﻿body { FONT-FAMILY: pt-sans, Helevetica,arial, sans-serif; FONT-SIZE:12px; WIDTH: 960px; MAX-WIDTH: 96%; MARGIN: 0 auto !important;}

h2 {color: #009EE2; FONT-SIZE:16px; LINE-HEIGHT:25px; FONT-WEIGHT:700px;}
b {font-weight:700;}
.hide-for-large, .display-xs {display:none;}

.vevent {display:none;}

#bnr {margin-top:1.6%;}
#bnr .load {background:#000; HEIGHT:400px;}
#bnr .blank {background:transparent; HEIGHT:auto;}
.g { OVERFLOW: hidden; }
.c { DISPLAY: block; FLOAT: left; MARGIN-LEFT: 1.6%; MARGIN-BOTTOM: 1.6%; PADDING: 0; }
.c img:not(.email) { WIDTH: 100%; }

.enlarge:hover { CURSOR: pointer; }

.g1 .c { FLOAT: none; MARGIN-LEFT: 0; }
.g2 .c { WIDTH: 49.2%; }
.g2 .cS { WIDTH: 32.26%; }
.g2 .cL { WIDTH: 66.13%; }

.g3 .c { WIDTH: 32.26%; }
.g4 .c { WIDTH: 23.8%; }

.g2 .c:nth-child(2n+1), .g3 .c:nth-child(3n+1), .g4 .c:nth-child(4n+1) { MARGIN-LEFT: 0; CLEAR: left; }

/* HEADER */
#hlLangSwitcher { position:absolute; top:10px; right:20px; }
#hlLangSwitcher::after {content:' '; clear:both;}
header[role=masthead] { MARGIN-TOP: 20px; DISPLAY: block; MARGIN-BOTTOM: 25px; }
header h1#branding a { DISPLAY: inline-block; WIDTH: 246px; HEIGHT: 47px; TEXT-INDENT: -9999em; BACKGROUND: url(media/logo.png) no-repeat 0 0; }

header nav { DISPLAY: inline-block;Float:right; WIDTH:325px; PADDING-top:22px;  }  
header nav li { FLOAT: left; PADDING: 0 15px; }
header nav li:last-child { padding-RIGHT: 0;}					    
header nav li a { TEXT-INDENT:9999;  COLOR:#000; DISPLAY: inline-block; TEXT-TRANSFORM:uppercase; FONT-SIZE:14px; }
header nav li a:hover { color:#009EE2 }
header nav li.selected a {color:#009EE2; CURSOR:none;  }

/* CONTENT */
.content { PADDING: 1.6%; BACKGROUND: #fff; PADDING-BOTTOM: 0; font-size:13px; LINE-HEIGHT:18px; }
.content .c {padding:0 8px; }

.content a {color:#000;}
.content a:hover, content a:visited {color: #009EE2;}

.content ul {list-style:disc}
.content li {margin-left:20px;}
/*
.hover img:nth-child(2) { -WEBKIT-TRANSITION: opacity 1s ease-in-out; -MOZ-TRANSITION: opacity 1s ease-in-out; -O-TRANSITION: opacity 1s ease-in-out; TRANSITION: opacity 1s ease-in-out; }
.hover img:nth-child(2):hover { opacity:0;}
*/

/* FOOTER */
footer { PADDING: 0 1.6% 0 1.6%; BACKGROUND: #fff; MARGIN-BOTTOM: 20px; }
footer h1#branding a { DISPLAY: inline-block; WIDTH: 55px; HEIGHT: 34px; TEXT-INDENT: -9999em; BACKGROUND: url(media/logo-s.jpg) no-repeat 0 0; FLOAT: left; }
footer .c { BACKGROUND: none; MIN-HEIGHT: auto; }

footer nav { DISPLAY: inline-block; PADDING-TOP: 15px; }
footer .load {background-color: #009EE2; 
              -webkit-transition: background-color 100ms linear;-moz-transition: background-color 100ms linear;-o-transition: background-color 100ms linear;-ms-transition: background-color 100ms linear;transition: background-color 100ms linear;}
footer  a {display:block;}
footer .selected a {background:#000; CURSOR:none; }
footer .load:hover {background-color:#000; 
		    -webkit-transition: background-color 100ms linear;-moz-transition: background-color 100ms linear;-o-transition: background-color 100ms linear;-ms-transition: background-color 100ms linear;transition: background-color 100ms linear; }

footer .contact {PADDING-TOP: 5px; CLEAR:both; PADDING-TOP:5px; }
footer .contact p {margin-top:16px; MARGIN-BOTTOM:5px;}
footer .contact a { COLOR: #000; }

/* page : Contact */		  
.form { background:#f3f3f3; PADDING:15px 20px; MARGIN-BOTTOM:15px; MARGIN-left:-1.6%}
.form input {display:block; MARGIN:10px 0; WIDTH:97%; PADDING:2px 0 2px 8px; BACKGROUND: #fff; color: #000; FONT-SIZE:14px; LINE-HEIGHT:16px;  }
.form textarea {FONT-FAMILY: pt-sans, Helevetica,arial, sans-serif; FONT-SIZE:14px; LINE-HEIGHT:16px; BACKGROUND: #fff; color: #000; DISPLAY:block; MARGIN:10px 0; WIDTH:96%; WIDTH:calc(97% - 5px); HEIGHT:146px; PADDING:5px 5px 5px 8px; }

.form .invalid {background: #FFB5AD; COLOR:#FF0000; }
   
.vcf { height:20px; margin-top:30px; font-size:13px; font-weight:400;}
.vcf img { margin:0 5px; vertical-align:middle; MAX-WIDTH:20px; WIDTH:20px;}

.mail { CURSOR:pointer;max-width:198px;}		  
/* tablet : 4 columns > 2 */
@media only screen and (max-width:991px) {
	body { WIDTH: 712px; }
	
	#bnr .load {height:297px }

	header nav { width:280px; }
	header nav li { PADDING: 0 6px; }
	header nav li a { FONT-SIZE:14px; }
	header nav li a:hover { BACKGROUND-POSITION: 0 -32px; }
	header nav li a.selected { BACKGROUND-POSITION: 0 -32px; }
}


/* mobile (portrait & landscape)*/
@media only screen and (max-width:570px) {
	#bnr .load {height:191px }
	.hide-for-small { DISPLAY: none; }
	
	.g2 .c { WIDTH: 100% !important; MARGIN-LEFT: 0; CLEAR: none; }
	.block-for-small {WIDTH: 100% !important; MARGIN-LEFT: 0; CLEAR: none;}
	.hide-for-large {display:block;}
	
	body { WIDTH: 460px; }
	
	header  h1#branding a	{BACKGROUND:url(media/logo-s.png) no-repeat; WIDTH:48px; HEIGHT:48px;  }

	header nav {padding-top:15px;}
	header nav li a { FONT-SIZE:14px; }
	
    header[role=masthead] {margin-bottom:15px;}	
	
	#info{display:none;} 
}




/* mobile (portrait ) 2 columns > 1 */
@media only screen and (max-width:479px) {
	body { WIDTH: 320px; }
	#bnr .load {height:133px }
	
	  
	header[role=masthead] { MARGIN-TOP: 5px; MARGIN-BOTTOM: 9px; }
	
	header h1#branding a {width:28px; HEIGHT:28px;
	                      -webkit-background-size: cover; -moz-background-size: cover;-o-background-size: cover; background-size: cover; }
	
	header nav { width:260px; PADDING-TOP:6px; }
	header nav li { PADDING: 0 6px; }
	header nav li a { FONT-SIZE:13px; }

	.g { MARGIN: 5px; }
	.c { WIDTH: 100% !important; MARGIN-LEFT: 0; CLEAR: none; }
}



/* Retina devices */
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {

}




