/* 
 * British Council
 * 
 * @author		Igino Fucci
 * @copyright	Copyright (c) 2014 (Keepthinking Ltd.)
 * @link		http://keepthinking.it
 * 
 -------------------------------------------------------  */
@font-face {
    font-family: "britishcouncilsans";
    src: url("../fonts/britishcouncilsans-light.eot");
    src: url("../fonts/britishcouncilsans-light.eot?#iefix") format("embedded-opentype"),
         url("../fonts/britishcouncilsans-light.woff") format("woff"),
         url("../fonts/britishcouncilsans-light.ttf") format("truetype"),
         url("../fonts/britishcouncilsans-light.svg#britishcouncilsans") format("svg");
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "britishcouncilsans";
    src: url("../fonts/britishcouncilsans-regular.eot");
    src: url("../fonts/britishcouncilsans-regular.eot?#iefix") format("embedded-opentype"),
         url("../fonts/britishcouncilsans-regular.woff") format("woff"),
         url("../fonts/britishcouncilsans-regular.ttf") format("truetype"),
         url("../fonts/britishcouncilsans-regular.svg#britishcouncilsans") format("svg");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "britishcouncilsans";
    src: url("../fonts/britishcouncilsans-bold.eot");
    src: url("../fonts/britishcouncilsans-bold.eot?#iefix") format("embedded-opentype"),
         url("../fonts/britishcouncilsans-bold.woff") format("woff"),
         url("../fonts/britishcouncilsans-bold.ttf") format("truetype"),
         url("../fonts/britishcouncilsans-bold.svg#britishcouncilsans") format("svg");
    font-weight: 700;
    font-style: normal;
}

html {
	height: 100%;
}


#page-header {
	font-family: "britishcouncilsans", Lucida Sans Unicode, Lucida Grande, sans-serif;
	background: #333;
}
	#page-header * {
		line-height: normal;
		color: #fff;
	}
	#page-header .gutter {
		position: relative;
		overflow: visible;
	}
		#logo {
			background-image: url("/layout/header/images/british_council-logo.png");
			background-repeat: no-repeat;
			overflow: hidden;
			margin-top:15px;
			margin-left:00px;
			font-size: 0;
		}
			#logo * {
				vertical-align: top;
			}
			#logo span {
				display: inline-block;
				position: relative;
				border-right: 1px solid #6EC6FF;
			}
				#logo img {
					position: absolute;
					left: -2000px;
					top: -2000px;
				}
			#logo strong {
				display: inline-block;
				font-weight: 400;
				line-height: 100%;
				white-space: nowrap;
			}
		#page-header form {
			
		}
			#page-header fieldset input, 
			#page-header fieldset button {
				background-color: transparent;
				vertical-align: middle;
			}
			#page-header fieldset input[type="search"] {
				
			}
			#page-header fieldset input[type="submit"], 
			#page-header fieldset button {
				background-image: url("/layout/header/images/icon-small.png");
				background-repeat: no-repeat;
				font-size: 0;
				line-height: 0;
				text-indent: -90000px;
				
			}
			#page-header fieldset button {
				z-index: 10;
			}

/* -----------------------------------------------------  */

.gutter {
	padding: 0 10px;
}


/* -----------------------------------------------------  */



/* From Tablets landscape to Desktop (NAV) */
@media screen {

		#page-header ::-webkit-input-placeholder {
			font-size: 15px;
			color: #fff;
			font-weight: 400;
			opacity: 1;
			
		}
		#page-header :-moz-placeholder {
			font-size: 15px;
			color: #fff;
			font-weight: 400;
			opacity: 1;
		}
		#page-header ::-moz-placeholder {
			font-size: 15px;
			color: #fff;
			font-weight: 400;
			opacity: 1;
		}
		#page-header input:-ms-input-placeholder {
			font-size: 15px;
			color: #fff;
			font-weight: 500;
			opacity: 1;
		}
		#page-header .gutter {
			position: relative;
			overflow: visible;
			padding-top: 30px;
			padding-bottom: 10px;
		}
		

			#logo {
				background-position: left top;
				height: 40px;
			}
				#logo span {
					width: 115px;
					height: 33px;
					padding-right: 30px;
				}
				#logo strong {
					font-size: 25px;
					font-weight: 400;
					padding: 6px 0 0 29px;
				}
			#page-header nav {
			    margin-top: 15px;
			}
				#page-header nav strong {
					display: none;
				}
				#page-header nav li a {
					display: inline-block;
					vertical-align: middle;
					cursor: pointer;
					font-size:15px;
				}
				#page-header nav li a:hover, 
				#page-header nav li a:focus, 
				#page-header nav li .active {
					color: #6EC6FF;
				}
				#page-header nav > ul {
					/*font-size: 0;*/
				}
					#page-header nav > ul > li {
						display: inline-block;
						position: relative;
						padding-right: 15px;
					}
					#page-header nav > ul > li:last-child {
						padding-right: 0;
					}
						#page-header .drop-down .drop-down>a:after {
							content: '\25BE';
							display: block;
							position: absolute;
							top: -2px;
							right: -20px;
							font-size: 18px;
							transition: all .3s ease;
						}
					
					
						#page-header nav > ul > li > a, 
						#page-header .drop-down .drop-down .trigger {
							line-height: 17px;
							white-space: nowrap;
						}
						#page-header .drop-down .drop-down {
							display: inline-block;
							border-left: 1px solid #6EC6FF;
							padding-left: 35px;
						}
						#page-header .drop-down .drop-down .trigger:hover, 
						#page-header .drop-down .drop-down .trigger.on {
							color: #6EC6FF;
						}
							#page-header .drop-down .drop-down ul {
								display: none;
								overflow: hidden;
								position: absolute;
								left: 20px;
								top: 0;
								width: 250px;
								margin-top: 17px !important;
								z-index: 100;
							}
								#page-header .drop-down .drop-down li {
									background: #333;
									display: block;
									border-top: 1px solid #666;
								}
								#page-header .drop-down .drop-down li:first-child {
									border: 0;
									padding-top: 10px;
								}
									#page-header .drop-down .drop-down li a {
										display: block;
										line-height: 120%;
										padding: 10px 15px;
									}
			#page-header form {
				position: absolute;
				overflow: hidden;
				top: 10px;
				right: 10px;
				font-size:15px;
						font-family: "britishcouncilsans", Lucida Sans Unicode, Lucida Grande, sans-serif;
						font-weight: 400;
			}
			#page-header #logo strong {
				font-weight:300;
				font-size:27px;
			}
				#page-header fieldset {
					height: 18px;
					border-bottom: 1px solid #6EC6FF;
				}
					#page-header fieldset input {
						height: 17px;
						
					}
					#page-header fieldset input[type="search"] {
						width: 230px;
						font-size: 15px;
						color: #fff;
						font-weight: 400;
						line-height: 17px;
						font-family: "britishcouncilsans", Lucida Sans Unicode, Lucida Grande, sans-serif;
					}
					#page-header fieldset label {
						font-size:15px;
						font-family: "britishcouncilsans", Lucida Sans Unicode, Lucida Grande, sans-serif;
						font-weight: 400;
					}
					#page-header fieldset input[type="submit"] {
						background-position: right -5px;
						width: 25px;
						
					}
	
}


/* 
	HD icons
*/
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
	#logo {
		background-image: url("/layout/header/images/british_council-logo@2x.png");
		background-size: 115px 76px;
	}
	#page-header .gutter > ul input[type="submit"], 
	#page-header .gutter > ul button, 
	.social [class^="social-"], 
	[class^="icon-"]:before {
		background-image: url("/layout/header/images/icon-small@2x.png");
		background-size: 25px 250px;
	}
}