/*  HEADER /////////////////////////////////////////////////////////// */

header {
	z-index:100;
	position:fixed;
	top:0;
	left:0;
	width:100%;
}

header .page {
	padding:1.5em 0;
	border-bottom:dotted 1px #ddd;
}

header .gradient {
	box-sizing: border-box;
    display: block;
    max-width: 980px;
    margin: 0 auto;
    clear: both;
	height:2em;
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}


header .logo {
	width:180px;
	float:left;
	padding:0 1em ;
}

header .logo img{
	width:100%;
}



header .help{
	float:right;
	line-height:1.625em;
	vertical-align: middle;
}

header .help .folder{
	text-align:right;
	font-size: 0.875em;
    line-height: 1.5em;
	color:#339999;
	font-weight: 700;
	margin-bottom:1em
}

header .help .folder strong{
	color: #46361f;
}


header .help .need-help{
	font-size:1.125em;
	font-family: 'Playfair Display', serif;
}

header .help .tel{
	font-size:1.275em;
	display:inline-block;
	font-weight: 700;
}

header .help .callbackBtn {
	border: solid 1px #ccc;
	background-color: #eeeeee;
	color: #666;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 0.75em;
	line-height: 1.25em;
	padding: 0.5em 0.75em;
	vertical-align: middle;
	text-shadow: 0 1px 0 #f3f3f3;
	display:inline-block;
	margin-left: 1.5em;
}

header .help .callbackBtn .flag {
	margin:0 0 1px 0.75em;
	width: 18px;
	vertical-align:middle;
	display:inline-block
}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 TABLETTE //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


@media only screen and (max-width: 1023px){
	
/*  HEADER /////////////////////////////////////////////////////////// */

header .logo {
	width:40%;
}


header .logo img{
	width:140px;
	padding-top:3px;

}
	
header .help .folder{
	font-size: 0.8125em;
    line-height: 1.5em;
	margin-bottom:0.75em
}



header .help .need-help{
	font-size:1em;
}	

header .logo .text-secure {
	margin-top:2px;
	font-size:0.6875em;
	line-height:1.25em;
}

header .help{
	font-size:0.9375em
}


}



/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 SMARTPHONE //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


@media only screen and (max-width: 767px){
	
/*  HEADER /////////////////////////////////////////////////////////// */

header .page {
	padding:0.75em 1em
}

header .logo {
	width:140px;
	padding: 0;
}




header .logo .text-secure {
	display:none;
}

header .help{
	font-size:0.875em;
	line-height:1.375em
}
	
header .help .need-help{
	display:block;
	text-align:right;
}

header .help .tel {
    font-size: 1.125em;
    display: block;
}

header .help .callbackBtn {
	display:none;
}

}
