/* Feuille de style de base - sites d'événements - VDG 2014 */

/***************************************************************************/
/* HTML */
* {-moz-box-sizing: border-box; box-sizing: border-box;margin:0;padding:0;}
html{height:100%;}
body{margin:0!important;padding:0;font-size:13px;min-height:100%;position:relative;}

/* Titres */
h1 {}
h2 {}
h3 {}
h4 {}
h5 {}

/* Listes */
ul, ol {margin: 0 0 10px 15px;padding: 0;}	
ul.inline, ol.inline {list-style: none outside none;margin-left: 0;}
ul.inline > li, ol.inline > li {display: inline-block;padding-left: 5px;padding-right: 5px;}

/***************************************************************************/

/*MENU ESCAMOTABLE (minimum VDG)*/
.header_text, .header_url{color:#fff;}
.content {max-width:960px;margin:0 auto;}

/*MENU DE NAVIGATION
.navbar{max-width:960px;}
.navbar > .container-fluid .navbar-brand {margin-left:0;}
.navbar-default {background:#ccc;}*/

.toto.fixed{
  transition-property: margin-top,margin-right;
  transition-duration: .5s,.1s;
  transition-delay: 0;
  transition-timing-function: cubic-bezier(0.22,0.99,0.62,1);
  -moz-transition-property: margin-top,margin-right;
  -moz-transition-duration: .5s,.1s;
  -moz-transition-delay: 0;
  -moz-transition-timing-function: cubic-bezier(0.22,0.99,0.62,1);
  -o-transition-property: margin-top,margin-right;
  -o-transition-duration: .5s,.1s;
  -o-transition-delay: 0;
  -o-transition-timing-function: cubic-bezier(0.22,0.99,0.62,1);
  -ms-transition-property: margin-top,margin-right;
  -ms-transition-duration: .5s,.1s;
  -ms-transition-delay: 0;
  -ms-transition-timing-function: cubic-bezier(0.22,0.99,0.62,1);
  -webkit-transition-property: margin-top,margin-right;
  -webkit-transition-duration: .5s,.1s;
  -webkit-transition-delay: 0;
  -webkit-transition-timing-function: cubic-bezier(0.22,0.99,0.62,1);
  position: fixed;
  top:0;
  z-index:1000;
}



/* CONTAINER */
#container{background:#fff;max-width:960px;margin:0 auto 0 auto;padding:50px 0 50px 0;min-height:600px;text-align:center;}


/* Champs cachés pour l'accessibilité */
.input_hidden {display: inline;left:-1000px;overflow:hidden;width:0px;position:absolute;top:-1000px;height:0px;}	

/* HEADER */ 
#header_top_container{min-width:320px; position:relative; width:100%; height:27px; background-color:#383838;}
#header_top_container .header_text{font-size:12px; margin-top:4px;}
#header_top_container .header_url{font-size:12px;margin-top:4px;}
#header_top_container .header_url a, #header_top_container .header_text a{color:#FFF;text-decoration:none;}	
#header_top_container .header_url a:hover, #header_top_container .header_text a:hover{color:#FFF;text-decoration:underline;}		
#header_top_container #inner_header{ cursor:pointer; }
#header_top_container #inner_header:hover #inner_header_right,
#header_top_container #inner_header:hover #inner_header_left{ text-decoration:underline; }
#header_top_container #inner_header_img{ height:27px; position:absolute; top:0; left:50%; }
#header_top_container .open_inner_header,#header_top_container .close_inner_header{}

/* INNER HEADER */
.inner_header_container{display:none;font-family: arial, sans-serif; font-size:13px; position: relative;width:100%; background:#565656;border-bottom:8px solid #383838;}

/* left panel - institutions links */
.institutions_link {width:34%; float:left;}
.institutions_link ul{margin:0; padding:0;}
.institutions_link li {list-style:none; margin:6px 0; padding:5px 5px 5px 12px; cursor:pointer;}
.institutions_link li:hover {background-color:#383838;}
.institutions_link li.active {background:url(../img/bg-active.jpg) repeat -20px 0 #383838;}
.institutions_link li a{color:#FFF; text-decoration:none; padding: 0 0 6px 0;}

/* middle panel - content institutions */
.institutions_content {display:none;width:66%; float:left; background-color:#383838; height:100%; padding:13px 0 0 0;}
.institutions_content ul {margin:0; padding:0 25px 5px 25px; }
.institutions_content li {list-style:none; border-bottom:1px solid #FFF; margin:0 0 10px 0; padding:0 0 2px 0;}
.institutions_content li a {color:#FFF; text-decoration:none; border-bottom:3px solid #FFF; padding: 0 0 4px 0;	}
.institutions_content li.text {color:#FFF;list-style:none;border:none;line-height:13px;}

/* right panel - link for ville-genève */
.city_link ul{margin:0; padding:13px 0 0 0;}
.city_link li{list-style:none; border-bottom:1px solid #FFF; margin:0 0 10px 0; padding:0 0 2px 0;}
.city_link li a{color: #FFF;  text-decoration:none;  border-bottom:3px solid #FFF; padding: 0 0 4px 0;	}
.city_link li a:hover {color: #FFF;  text-decoration:underline;}

/* FOOTER */
#footer{margin:0 0 0 0 ;width:100%;padding:15px 0 15px 0;background-color:#383838;border:solid;border-width:6px 0 0px 0;border-color:#ccc;}
#footer_content{max-width:960px;min-height:100px;margin:0 auto 0 auto;background-color:#383838;}
#footer_container{position: absolute; bottom: 0; left: 0; right: 0}
#footer_bottom {min-width:320px;width:100%;background-color:#383838;}
#footer_bottom .footer_text {margin:10px 13px 13px 0;}
#footer_bottom .footer_logo {margin:13px 0 13px 13px;}
#footer_bottom_under{margin-top:50px;min-height:100px;background:#333;}
#footer_bottom {background: none repeat scroll 0 0 #353535;color: #FFFFFF;min-height:200px;}
#footer_bottom .container_specific{padding: 10px 0 0 0;}
#footer_bottom h3 {   border-bottom: 1px solid #FFFFFF;color: #FFFFFF;font-family: "Helvetica Neue",Arial;font-weight: bold;margin: 0 0 10px;padding: 3px 0;text-transform: none;}
#footer_bottom ul li a:hover {text-decoration: underline;}
.ie #footer_bottom .nav-list > li > a {padding-left: 0;}

/*RESPONSIVE CLASS*/
@media (max-width:960px){.city_link ul{padding:13px 17px;} #header_top_container .header_text, .footer_text{margin-left:12px;} #header_top_container .header_url, .footer_logo{margin-right:12px;} }
@media (max-width:480px) {.institutions_link, .institutions_content, .city_link {float:left; width:100%;} #header_top_container .open_inner_header, #header_top_container .close_inner_header{left:55%;} #container{padding:0 5px 0 5px;} 
@media (min-width:1200px){.container{width:960px} }

