

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/*
- INIT
- CLASS ADITIONNELLE
- MAP-CANVAS
- FOOTER

couleur
bleu : 00539f // 50,115,183
vert : b6d039 // 182,208,57
*/

@font-face {
    font-family: 'adobe_garamond_proregular';
    src: url('../fonts/agaramondpro-regular-webfont.eot');
    src: url('../fonts/agaramondpro-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/agaramondpro-regular-webfont.woff') format('woff'),
         url('../fonts/agaramondpro-regular-webfont.ttf') format('truetype'),
         url('../fonts/agaramondpro-regular-webfont.svg#adobe_garamond_proregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* INIT */
html{ margin-top:0 !important; overflow:hidden;}
html, body, #main-container { height:100%; -webkit-text-size-adjust: 100%;}
#main-container {}
h2{ color:#00539f;}
h3{ color:#000;}

body{ font-family: 'Source Sans Pro', sans-serif; }


/*** Scrollbar ***/
::-webkit-scrollbar-thumb:horizontal { height: 8px; background-color:#00539f;}
::-webkit-scrollbar-thumb:vertical { width: 8px; background-color:#00539f;
-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.16);
-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.16);
box-shadow: 1px 1px 4px rgba(0,0,0,0.16);
}

::-webkit-scrollbar { width: 8px; height: 8px; background: #dbdbdb; right:10px;
-webkit-box-shadow: inset 1px 1px 4px rgba(0,0,0,0.13);
-moz-box-shadow: inset 1px 1px 4px rgba(0,0,0,0.13);
box-shadow: inset 1px 1px 4px rgba(0,0,0,0.13); }


/* ASPECT DES CHECKBOX */
/* case à cocher */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left:0; top: 2px;
  width: 17px; height: 17px;
  border: 1px solid #a0abc1;
  background: #fff;
  border-radius: 3px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.2);
}
.inforoutiere-open [type="checkbox"]:not(:checked) + label:before,
.inforoutiere-open [type="checkbox"]:checked + label:before {  right:0 !important; left:inherit; }

/* check de base caché */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute; left: -9999px;
}

/* label */
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative; padding-left: 25px; cursor: pointer;
}
.inforoutiere-open [type="checkbox"]:not(:checked) + label,
.inforoutiere-open [type="checkbox"]:checked + label {
  padding-right: 25px; padding-left:0;
}

/* Aspect général de la coche */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
  content: '✔';
  position: absolute;
  top: 0; left: 2px;
  font-size: 14px;
  color: #00539f;
  transition: all .2s;
}
.inforoutiere-open [type="checkbox"]:not(:checked) + label:after,
.inforoutiere-open [type="checkbox"]:checked + label:after { right: 1px; }

/* Aspect si "pas cochée" */
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
/* Aspect si "cochée" */
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}

/* Aspect désactivée */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
/* Styles de la coche (si cochée/désactivée) */
[type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
/* Label désactivé */
[type="checkbox"]:disabled + label {
  color: #aaa;
}

/* Aspect au focus de l'élément */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 1px dotted blue;
}

/* CLASS ADITIONNELLE*/
.floatleft{ float:left;}
.floatright{ float:right;}
.box_shadow{ box-shadow:0 0 4px -1px rgba(0,0,0,.5);}
.box-arrow:before{
        content:"";
        position:absolute; width:20px; height:20px; background:white;
        top:35px; right:0; margin-top:-10px; margin-right:-10px;
        -webkit-transform:rotate(45deg);
        -moz-transform:rotate(45deg);
        -o-transform:rotate(45deg);
        -ms-transform:rotate(45deg);
        transform:rotate(45deg);
        box-shadow:2px 0 2px -1px rgba(0,0,0,.3);
    }
a.close-panel{ float:right; padding:15px 25px; height:100%; background:#f9f9f8 url('../images/background/close_gradiant.png') 0 0 repeat-y; }
a.close-panel .icon-fermer{ font-size:30px;}

.img-container {
	position: relative;
	height: 240px; /* 56.25 - 16/9 */
	overflow: hidden;
}
.img-container img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto; top:20%;
}

.scrollable {}

.stretch {
    display:inline-block;
    transform:scale(.5,1);
    -webkit-transform:scale(.5,1);
    -moz-transform:scale(.5,1);
    -ms-transform:scale(.5,1);
    -o-transform:scale(.5,1);
}
li.separator{ height:1px; padding:0 !important; background:#ddd;}

.see-on-map { margin: 0 20px 20px; padding: 10px; border:1px solid #eee; display: inline-block;
transition: all .2s;}
.see-on-map:active,
.see-on-map:focus,
.see-on-map:hover { color:#fff; background:#00539f; border:1px solid #eee; text-decoration:none;}

/* HEADER */
.navbar-brand { position:relative; float:none; height:124px; }
.navbar-brand .logo { position:absolute; top:0; left:0; width:270px; height:100%; }
.navbar-brand .logo > a { height:100%; width:170px; display:block; float:left; }
.navbar-brand .logo > a + a { width:100px; }
.navbar-brand .logo + a {
    text-decoration: none; text-align: center; color:#000;
    margin: -20px auto 0;
    max-width: 450px; height: 100%;
    display: block;
}
.navbar-brand h2,
.navbar-brand h5{ font-family: 'adobe_garamond_proregular','EB Garamond', serif; text-transform:uppercase;}
.navbar-brand h2{ font-size:56px; margin: -0.4em 0 0;}
.navbar-brand h5{ font-size:15px; margin:-5px 0 0;}
header .navbar-brand h6 span.hidden-xs{ display:inline !important; }


/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.625em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.625em;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}


#myd_infomessage_txt{
	position:absolute;
	z-index:3999;
	width:300px;
	left:50%;
	margin-left:-150px;
	padding:25px 10px;
	top:300px;
	background-color:#fff;
	color:#000;
	text-align:center;
	font-family: 'Source Sans Pro',sans-serif;
}

#myd_infomessage{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3990;
	width: 100%;
	height: 100%;
	background-color: #333;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}


@media (min-width: 768px) and (max-width: 992px){
    .navbar-brand .logo + a { margin: -20px 0 0 auto;}
}
@media (min-width: 401px) and (max-width: 767px){
    .navbar-brand .logo + a { margin: 0 auto;}
    .navbar-brand h2{ font-size:35px; margin: 8px 0 0;}
    .navbar-brand h5{ font-size:12px; margin:-5px 0 0;}
}
@media (max-width: 400px){
    .navbar-brand .logo + a { margin: 0 auto;}
    .navbar-brand h2{ font-size:24px; margin:-2px 20% 0; letter-spacing:-1px; line-height:9px}
    .navbar-brand h6{ font-size:9px}
	header .navbar-brand h6 span.hidden-xs{ display:none !important; }
}

/* NAVIGATION */
header{
    background:url('../images/background/header_grad_repeat.png') 0 100% repeat-x;
}
.navbar {
    margin-bottom:1px;
    border-radius:0;
    background: url('../images/background/header_bg.png') 50% 0 no-repeat;
}
.navbar ul > li:first-child{}
.navbar-nav > li > a {
  font-size:16px;
  line-height:20px;
  color:white; padding-left:50px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
  transition:all .2s;
}
.navbar .navbar-nav > .active > a{
    background:#00449c;
}
.nav > li > a:hover, .nav > li > a:focus {
    background:#00449c;
}
.tel-label{ float: left; margin: -10px 0;}
.tel-number{ position: relative; display: inline-block;
    margin: -1px 0 0; top: 8px; font-size: 20px; }

.menu-left{ float:left; margin-left: 15px; margin-right:0; }

@media (max-width: 767px) {
    .navbar{
        border-top:1px solid #2e67b3;
        border-bottom:1px solid #fff;
        background: #3b7ac2;
    background: -moz-linear-gradient(top,  #3b7ac2 0%, #4486cb 1%, #00539f 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b7ac2), color-stop(1%,#4486cb), color-stop(100%,#00539f));
    background: -webkit-linear-gradient(top,  #3b7ac2 0%,#4486cb 1%,#00539f 100%);
    background: -o-linear-gradient(top,  #3b7ac2 0%,#4486cb 1%,#00539f 100%);
    background: -ms-linear-gradient(top,  #3b7ac2 0%,#4486cb 1%,#00539f 100%);
    background: linear-gradient(to bottom,  #3b7ac2 0%,#4486cb 1%,#00539f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b7ac2', endColorstr='#00539f',GradientType=0 );
    }
    .navbar-brand{ height:auto; padding:0;}
    .navbar *{ color:#fff; }
}
}@media (max-width: 400px) {
    header{ background:grey;}
    .navbar {
        margin-bottom:0;
        background:none;
    }
    .navbar-brand{ padding:0;}
}

/* ADS */
.ad_webMobile{
    position:absolute; top:0; right:0; z-index:-1;
    height:122px; width:420px;
}
.ad_webMobile p{
    color:white; font-weight:bold; font-size:14px;
    width:80%; text-align:center;
}

/* MOBILE */
.navbar-toggle { border-color:white; z-index:100;}
.navbar-toggle .icon-bar{ background-color:white;}
/*.itemFooter a{ background:#000;}
.itemFooter a:focus, .itemFooter a:hover { background:#333 !important;}*/


/* MAP-CANVAS */
#map-canvas{ position:relative;background:#e5e3df; height:100%;}
#myd_map{ width:100%; height:100%;}

#amimobile{ display:block; position:absolute; width:0; height:0; }

    @media (max-width: 400px) {

    }

    /* poi-info* */
    div[class^="poi-info-"]	.content-header {position:relative; height:70px; border-bottom:4px solid #00539f; padding-left:15px;}
    div[class^="poi-info-"]	.content h2, h2{ font-size:18px; margin:0; padding-top:12px; text-transform:uppercase; }
    div[class^="poi-info-"]	.content h3, h3{ font-size:16px; margin:0; padding-top:2px; padding-bottom:10px; }
    div[class^="poi-info-"]	.content p{ font-size:14px; margin:0; }
    div[class^="poi-info-"]	.content h2, h2{ font-family: 'Source Sans Pro', sans-serif; font-weight:300;}
    div[class^="poi-info-"]	.content h3, h3{ font-family: 'Source Sans Pro', sans-serif; font-style:italic;}

    /* poi-info-min */
    div.poi-info-min{
        position:absolute; top:10%; left:10%;
        background:#fff;
    }
    div.poi-info-min .content { width:400px;}
    div[class^="poi-info"] .small-picture{
        width:70px; height:66px; float:left;
        margin:0 10px 0 -15px;
        background:#efefef;
    }
    div.poi-info-min h2,
    div.poi-info-min h3{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

    /* poi-info-max */
    div.poi-info-max{
/*        position:absolute; top:5%; left:40%; */
        position:absolute; left:50%; margin-left:-415px; margin-top:-50px;

        width:560px;
        background:#fff;
    }


    div.poi-info-max .content{ padding:0;}
    div.poi-info-max .content .scrollable p{  padding:7px 15px;}
    div.poi-info-max .content .scrollable p:last-child{  padding-bottom:20px;}
    div[class^="poi-info"] .date{ text-align:left; color:#758f19; font-size:14px; font-family: 'Source Sans Pro',sans-serif; min-height: 14px; }
    div[class^="poi-info"] span.month{ font-size:14px; text-transform:lowercase; color:#8ba71f; font-weight:bold;}
    div[class^="poi-info"] .periode{ color:#5f5847; font-size:34px; line-height:34px; font-family: 'Source Sans Pro', sans-serif; font-weight: 300; }

    div.poi-info-max .content-poi{ padding:0;}
    div.poi-info-max .content-poi .description{ padding:5px;}
    div.poi-info-max .content-panel ul{ list-style-type:none; padding:0; margin:0;}
    div.poi-info-max .content-panel li{ padding:2px; margin:2px;}
    div.poi-info-max .content-panel .poi-attached li{ padding:10px 0 10px 30px;}

    div.poi-info-max h2{ padding:0px; height: 25px;}
    div.poi-info-max h3{ padding:0px;}
    div.poi-info-max .content-panel h2{ color:#000; padding:10px;}
    div.poi-info-max .content-panel .poi-proximite{}
    div.poi-info-max .content-panel .poi-proximite li{}
    div.poi-info-max .content-panel .poi-proximite input{}

	div.poi-info-max.small .bloc-content{ display:none; }

    @media (min-width: 992px){
        div.poi-info-max .bloc-content{ background:url('../images/background/poi_gradiant.png')374px 0 repeat-y; border-bottom:2px solid white;}
    }
    @media (max-width: 992px){
        div.poi-info-max .content-panel{ background:#f9f9f8; border-top:4px solid #ddd; }
    }
    @media (min-width: 768px) and (max-width: 992px) {
        div.poi-info-max{
            width:400px;
			margin-left:-250px;
        }
    }
    @media (min-width: 401px) and (max-width: 767px) {
        div.poi-info-max{
			margin-left:-380px;
            width:320px;
        }
    }
    @media (max-width: 400px) {
        div.poi-info-max{
			margin:0;
            width:100%; left:0; top:0;
        }
		div.poi-info-max.small .bloc-content{ display:block; }
        div.poi-info-max .close-panel{position:absolute; top:0; right:0; margin-top:-54px; height:54px; padding:10px 23px; z-index:1000;}
		#legende .close-panel{position:absolute; top:0; right:0; height:54px; padding:10px 23px; z-index:1000;}
        .box-arrow:before{ display:none;}
       /* div[class^="poi-info"] .date{ width:60px;}*/
        div[class^="poi-info"] span.month{ font-size:12px;}
        div[class^="poi-info"] .periode{ font-size:22px; line-height:22px; }
		#amimobile{ display:none }
    }
    @media (max-width: 992px) {
        div.poi-info-max .content-panel{
            margin-top:10px;
        }
    }




/* INFOS ROUTIERES */
@media (min-width: 768px) {
    .slideLeft { margin-left:-300px !important; display:block !important;}
    .slideLeft.in { margin-left:0px !important; display:block !important;}
}
@media (max-width: 767px) {
    .slideLeft { margin-left:-100% !important; display:block !important;}
    .slideLeft.in { margin-left:0 !important; display:block !important;}
}
.inforoutiere{
    position:absolute; z-index:100;
    top:50%; left:0; /*margin-top:-100px;
    /*padding:25px 20px; /*height:180px; width:20px;*/
    /*background:#000; */
    background:url('../images/background/triangle_menu3_bleu.png') right -65px no-repeat;
    color:white;
    border-radius:0; border:none;
/*    transition:all .2s;*/
    padding:0;
    height: 220px;
    margin-top: -160px;
    font-size:0;
    width:65px;
/*    -webkit-transform:rotate(90deg) translate(-50%,100%); margin-left:-21px;
	-moz-transform:rotate(90deg) translate(-50%,100%);
	-o-transform: rotate(90deg) translate(-50%,100%);
	transform: rotate(90deg) translate(-50%,100%);*/
}
.inforoutiere:focus,
.inforoutiere:hover{ text-decoration:none; background:url('../images/background/triangle_menu3_bleu.png') right -415px no-repeat; color:#5f5847 !important; }

.inforoutiere .css-vertical-text {
	/*writing-mode:tb-rl;
	-webkit-transform:rotate(90deg) translate(-60px,0px);
	-moz-transform:rotate(90deg);
	-o-transform: rotate(90deg);
	white-space:nowrap;
	display:block;*/

	padding:15px 25px; margin:0;
}
div.inforoutiere-open{
    position:absolute; z-index:101;
    bottom:0; left:0; right:0; top:0;
    height:auto; width:295px !important;
    background:#fff;
    transition:all .5s;
}

@media (max-width: 767px) {
    div.inforoutiere-open{
        bottom:0; top:127px; width:100% !important;
    }
}
@media (max-width: 400px) {
    div.inforoutiere-open{
        bottom:0; top:52px;
    }
}




/* INFOROUTIERE-OPEN */
.bloc-title{ position:relative; min-height:60px; border-bottom:1px solid #e5e5e5;}
.bloc-title .icon-infos-routieres{ width:30px; height:30px; display:inline-block; float:left; vertical-align:middle; margin: 15px 0 0 10px;}
.bloc-title h2{ padding:20px 0 0 50px;/* width: 78%;*/}
/*div.inforoutiere-open .bloc-title a.close-panel { height:100%;  }*/
/*div.inforoutiere-open .bloc-title a.close-panel .icon-fermer{ font-size:30px;}*/

div.inforoutiere-open .bloc-search{ background:#e8eaed; padding:10px;}
div.inforoutiere-open .bloc-search .input-search-ir{ width:100%; border:1px solid #e5e5e5; padding:5px;}
div.inforoutiere-open .bloc-search hr{ height:1px; background:white; margin:10px 0;}

div.inforoutiere-open .bloc-search-date input{}
div.inforoutiere-open .bloc-search .input-search-bt-ir{ width:80%; margin:0 10%;}

div.inforoutiere-open .bloc-couches{ padding:10px;}
div.inforoutiere-open .bloc-couches hr{ height:1px; background:#e5e5e5; margin:10px 0;}
div.inforoutiere-open .btn-group { width:90%; margin:0 5%;}
div.inforoutiere-open .btn-group a{ width:50%; }

div.inforoutiere-open ul[class^="list-"]{ text-align:right; padding:5px 25px;}
div.inforoutiere-open ul[class^="list-"] li { font-size:16px; color:#5f5847; list-style-type:none; margin:10px 0; }
div.inforoutiere-open .list-container-overview{ height:205px; width:275px; overflow:hidden}
div.inforoutiere-open .list-container{ height:205px; width:550px;}
div.inforoutiere-open ul.list-couches{ height:205px;width: 275px; float:left}

div.inforoutiere-open div.list-liens ul{ text-align:right; padding:5px 25px;}
div.inforoutiere-open div.list-liens ul li { font-size:16px; color:#5f5847; list-style-type:none; margin:10px 0; }

div.inforoutiere-open div.list-liens ul{ background:#b6d039; width:100%; margin:0;}
div.inforoutiere-open div.list-liens ul a { text-decoration:none;}
div.inforoutiere-open div.list-liens ul * {color:white; text-shadow:0 1px 1px rgba(0,0,0,.5);}




/* ICONS */
i.icon-lien-fleche,
i.icon-search{}
.navbar-nav i[class^='icon-'],
.content-panel i[class^='icon-']{ position:absolute; margin:-5px 0 0 -35px; width:30px; height:30px; display:inline-block; }

.bloc-title .icon-infos-routieres,
.bloc-title .icon-legende { width:30px; height:30px; display:inline-block; float:left; vertical-align:middle; margin: 15px 0 0 10px;}



/* FOOTER */
footer {
    position:relative; z-index:102; padding:0 20px;
    height:30px; overflow:hidden; font-size:13px; line-height:26px;
    background:rgb(0,0,0); color:grey;
}
footer a { color:white; opacity:.5; transition:all .2s;}
footer a:hover { color:white; opacity:1; text-decoration:none; }
footer li {float:right; list-style-type:none; padding:0 10px; }
.copyright { display:inline; float:left;}


.overview {
    position: absolute;
    left: 0; top: 0; padding: 0; margin: 0;
    height:100%;
    list-style: none;
}
.overview > li{
    float: left; margin: 0 20px 0 0; padding: 1px;
    height:100%;
}




#flashMessages{
    position:absolute;
    width:450px;
    left:50%; top:50%;
    margin-left:-225px; margin-top:-150px;
    background:#fff; color:#605951;
    z-index:9999;
}
#flashMessages h2{
    color:#fff; font-size:20px; font-weight:normal; margin:0; padding:19px; background:#222;
}
#flashMessages h3{
    font-size:16px; font-weight:normal; margin:0; padding:0 0 0 45px; border-bottom:1px solid #e3e3e3;line-height:58px; vertical-align:middle;
 background:url(../images/bg_flashmessage_title.jpg) 10px 10px no-repeat; overflow:hidden;
}
#flashMessages span.time{
    display:block; float:right; padding-right:10px; padding-left:45px; color:#52aa16; font-size:14px; background:url(../images/bg_flashmessage_heure.jpg) 10px 14px no-repeat;
}
#flashMessages .closeBtn{
    display:block; width:52px; height:58px; float:right; background:url(../images/btn_close.jpg);
}
#flashMessages p{ padding:10px 20px }
#flashMessages .viewport {
    /*float: left;*/ height: 180px; overflow: hidden; position: relative; border-bottom:1px solid #e3e3e3;
}
#flashMessages .overview > li{/* height: 140px;*/}
#flashMessages strong{ color:#52AA16;
}

@media (min-width: 768px){
    #flashMessages,
    #flashMessages .viewport,
    #flashMessages .overview > li { width:450px !important;}
}
@media (min-width: 401px) and (max-width: 767px){
    #flashMessages,
    #flashMessages .viewport,
    #flashMessages .overview > li { width:400px;}
    #flashMessages { margin-left:-200px;}
}
@media (max-width: 400px){
    #flashMessages { left:0; top:0; width:100%; height:80%; margin:50px 0 0 0;}
    #flashMessages .viewport{ width:100%; height:255px;}
    #flashMessages .overview > li{ height:260px;}
}

.pagination { margin:0 auto; display:block; height:60px; }
.pagination-lg a{ font-size:20px !important; padding: 16px 21px!important; }
.pagination li a{ border-radius:0 !important; border-top: none; transition: all .2s;}
.pagination li a.active{ color:#fff; background-color:#00539f;}
.pagination li a.disabled{color:grey;}
.pagination .arrow-page{font-size: 40px !important;
padding: 5px 20px 10px !important;
line-height: 45px;}

@media (max-width: 767px){
    .pagination .arrow-page{ width:50%;}
    .pagination li:last-child .arrow-page{ text-align:right;}
    .pagination .arrow-page span{ position:absolute; top:7px; left:0; width:100%; font-size: 17px; text-align:center;}
}


/* INFOS ROUTIERES */
@media (min-width: 768px) {
    .slideRight { margin-right:-450px !important; display:block !important; }
    .slideRight.in { margin-right:0px !important; display:block !important;}
}
@media (max-width: 767px) {
    .slideRight { margin-right:-100% !important; display:block !important;}
    .slideRight.in { margin-right:0 !important; display:block !important;}
}



#rightPan, #pageContent, #legende{
    position:absolute; z-index:1200;
    top:0; right:0; bottom:0;
    width:450px !important; height:auto;
    background:#fff; overflow:hidden;
    transition: all .5s;
}
#rightPan .viewport{ border-bottom:1px solid #e3e3e3;}
#rightPan .overview > li{ width: 450px;}
#rightPan h3{
    font-size:16px; font-weight:normal; line-height:39px;
    margin:0; padding:10px 0 10px 50px;
    vertical-align:middle;overflow:hidden;
}
#rightPan p{ margin: 20px 30px; }
#rightPan .overview .img-container { padding-bottom: 50%;margin: 5px 20px;}
.bloc-title h3{ padding:10px 0 10px 50px;}

#rightPan div.content img{ max-width:100%; height:auto; }
#rightPan .closeBtn{
    display:block; width:52px; height:58px;
    float:right; background:url(../images/btn_close.jpg);
}


#rightPan .bloc-heading{}
#rightPan .bloc-heading p{ position:absolute; top:0; left:0; margin-left:120px; width:65%;
    color:#fff; text-shadow:0 1px 1px rgba(0,0,0,.5);
    font-size:18px; line-height:20px; font-style:italic;}
#rightPan .bloc-heading p span{ font-family: 'adobe_garamond_proregular','EB Garamond', serif; font-size:30px; line-height:40px; display:block; font-style:normal }

#pageContent #pageContentCloseBtn{
	display:block; width:15px; height:15px;
	background-image: url("../images/uploader-icons.png");
	background-position:55px 0px;
	margin-top:5px; right:20px; position:absolute; z-index:9999;
}
#pageContent #pageContentCloseBtn:hover{
	background-position:35px 2px;
}

@media (max-width: 767px) {
    #rightPan, #pageContent, #legende{
        bottom:0; top:0; width:100% !important;
    }

    #rightPan .overview, #rightPan .overview > li { width:100%;}
	.pager{
		text-align:inherit;
	}
}
@media (max-width: 400px) {
    #rightPan, #pageContent, #legende{
        bottom:0; top:0;
    }
}

/*
#pageContent{
	position:absolute; z-index:20000; height:680px; width:680px; right:0; top:0;
	background:#fff;
	background: rgba(255,255,255,0.85);
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 20px rgba(0,0,0,0.5);
	box-shadow: 0 0 20px rgba(0,0,0,0.5);
	text-align:left;
	padding:10px;
	overflow:hidden;
}
*/
#pageContent .content{
	padding-right:30px; font-size:12px; padding-left:20px;
}
#pageContent .nano{
	margin-bottom:10px;
}

#pageContent .content h2.entry-title a{ color:#473D20; text-decoration:none; font-family:'hn57',Arial,times,sans-serif; }
#pageContent .content h2.entry-title a:hover{ color:#EB6B08; text-decoration:none; }

#pageContent .post{ border-bottom:1px dotted #473D20; margin-bottom:0.83em }
#pageContent .entry-utility{ font-style:italic; font-size:0.8em }
#pageContent .entry-utility a{ color:#473D20; }
#pageContent .entry-utility a:hover{ color:#EB6B08; }

#pageContent #nav-above{ display:none }
#pageContent .nav-previous{ float:left }
#pageContent .nav-next{ float:right }
#pageContent .navigation a{ font-size:0.9em; color:#473D20; text-decoration:none }
#pageContent .navigation a:hover{ font-size:0.9em; color:#EB6B08; text-decoration:none }

/* CALENDAR */

/* ICONES */
/*menu*/
i[class^='icon-']{ background:transparent url('../images/icones/icones_template.png') 0 0 no-repeat};
i.icon-legende-carto{ background-position: 0 0;}
i.icon-actus{ background-position: 0 -30px;}
i.icon-infosdirect{ background-position: 0 -60px;}
    /* mobile */
    button.navbar-toggle i.icon-menu-infos-routieres{
        position:relative; margin:-8px -4px;
        width:30px; height:30px;
        display:block;
        background-position: 0 -330px;
    }
/*actu*/
i.icon-infos-actus{ background-position: 0 0;}
/*inforoutiere-open*/
i.icon-infos-routieres{ background-position: 0 -270px;}
/*legende*/
i.icon-legende{ background-position: 0 -300px;}
/*poi*/
i.icon-pdf{ background-position: 0 -90px;}
i.icon-gps{ background-position: 0 -180px;}
i.icon-commenter{ background-position: 0 -120px;}
i.icon-partager{ background-position: 0 -150px;}
i.icon-default{ background-position: 0 30px;}
.close i[class^='icon-']{ background:none;}





/* MYD INFOWINDOW */

/* INFOWINDOW */


.myd_info_window{
	border: 1px solid #DDD ;
	background-color: #fff;
	text-align:left;
	padding:10px;
	width:290px;
	min-height:80px;
}

.myd_info_window .titrebulle{
	background-color: #OOO;
	padding: 0px;
}

.myd_info_window .titrebulle h4{
	color: #a81217;
	font-family: Arial;
    font-size: 12px;
    font-weight: bold;
	margin:0;
	text-align:center
}


.myd_info_window .tag {
	background: url('../images/i/tag.png') left no-repeat;
	min-height: 19px;
	padding-top: 4px;
	font-size: 12px;
	color: #666;
	font-style: italic;
}

.myd_info_window .titrebulle h5{
	font-family: Arial;
    font-size: 12px;
    font-weight: bold;
	margin:0;
	text-align:center; background:#eee;
}


.myd_info_window .bulletxt{
    font-size: 11px;
    line-height: 10px;
    margin: 2px 0 0;
    padding-left: 10px;
    text-align: left;
}

.myd_info_window .bulledes{
	padding-left: 10px;
	font-size: 11px;
	text-align: left;
	line-height:10px;
}

.myd_info_window .conseil{
	padding-left: 10px;
	font-size: 11px;
	text-align: left;
}


.myd_info_window .txtbulle {
	margin-bottom: 2px;
	color: #444;
}

.bulle{
	position: absolute;
	background: url('../images/i/ombrebulle.png') no-repeat 0 bottom;
	width: 264px;
	height: 124px;
	left: 400px;
	top:300px;
}

.myd_info_window_icone{ width:50px; float:left; margin-right:5px; }
.myd_info_window_icone img{ width:50px; height:auto; margin-top:5px }


/* LEGENDE */
/*
#legende{
    position:absolute; width:760px; height:600px;
    left: 50%; top: 50%;
    margin-left: -380px; margin-top:-300px;
    background: #fff; color: #605951;
    z-index: 9999;
}*/
#legende .viewport {position:relative; height: 100px; overflow: hidden;}
#legende ul.tableau{
    margin:20px 20px; padding:0;
    list-style-type:none;
    border:2px solid #e8eaed; border-bottom:none;
}
#legende ul.tableau li{
    position:relative; padding:10px 0px 5px;
    border-bottom: 1px solid #e3e3e3;
}
#legende ul.tableau li:nth-child(2n + 3){ background:#fafbfb; }
#legende li i[class^="icon-"] {
    width: 30px;
    height: 30px;
    display: inline-block; float: left;
    vertical-align: middle;
    margin: -5px 10px 0 -15px;
}
#legende p, #legende h4{ margin:20px 30px;}
#legende li:nth-child(1){
    background: #447abd;
    background: -moz-linear-gradient(top,  #447abd 0%, #4e89c6 3%, #447fbc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#447abd), color-stop(3%,#4e89c6), color-stop(100%,#447fbc));
    background: -webkit-linear-gradient(top,  #447abd 0%,#4e89c6 3%,#447fbc 100%);
    background: -o-linear-gradient(top,  #447abd 0%,#4e89c6 3%,#447fbc 100%);
    background: -ms-linear-gradient(top,  #447abd 0%,#4e89c6 3%,#447fbc 100%);
    background: linear-gradient(to bottom,  #447abd 0%,#4e89c6 3%,#447fbc 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#447abd', endColorstr='#447fbc',GradientType=0 );
}
#legende li:nth-child(1) div *{ text-transform:uppercase; padding:5px 20px; color:white;}
#legende li:nth-child(n+2) div:nth-child(2),
#legende li:nth-child(n+2) div:nth-child(3) { border-top:1px lightGrey dashed; padding:5px 10px }
#legende li div:nth-child(2) { font-style: italic;}
#legende li:nth-child(n+2) div:nth-child(1){ text-transform:uppercase; font-size:16px; padding:5px 10px; padding-left:50px;}
#legende li:nth-child(n+2) div:nth-child(3) { font-weight:bold;}

/*count*/
#legende li:nth-child(1) div:after {
    position:absolute; top:0; left:5px; width:25px; height:25px;
    text-align:center;  border-radius:3em; border:1px solid white; color:white;
}
/*#legende li:nth-child(1) div:nth-child(1):after { content:"1";}
#legende li:nth-child(1) div:nth-child(2):after { content:"2";}
#legende li:nth-child(1) div:nth-child(3):after { content:"3";}*/

#legende li div i{ color:#fff; margin-right:5px; padding:0px 0 0 0; text-align:center; width:40px; display:inline-block; position:absolute; left:5px;}

/*couleurs*/
#legende li:nth-child(2) div:first-child i{ border-radius:2em; background:rgb(0,255,0); color:#000;}
#legende li:nth-child(3) div:first-child i{ border-radius:2em; background:rgb(255,255,0); color:#000;}
#legende li:nth-child(4) div:first-child i{ border-radius:2em; background:rgb(255,0,0); }
#legende li:nth-child(5) div:first-child i{ border-radius:2em; background:rgb(0,0,0); }
#legende li:nth-child(6) div:first-child i{ border-radius:2em; background:rgb(128,0,128);}
#legende li:nth-child(7) div:first-child i{ border-radius:2em; background:rgb(0,0,255);}
#legende li:nth-child(8) div:first-child i{ border-radius:2em; background:rgb(0,255,255); color:#000;}
#legende li:nth-child(9) div:first-child i{ border-radius:2em; background:rgb(153,51,0);}
#legende li:nth-child(10) div:first-child i{ border-radius:2em; background:rgb(255,0,255);}
#legende li:nth-child(11) div:first-child i{ border-radius:2em; background:rgb(150,150,150);}
#legende li:nth-child(12) div:first-child i{ background:rgb(255,255,255); border-bottom: 1px dashed #000; color: #000;}

@media (min-width: 768px){
/*    #legende,
    #legende .viewport { width:760px !important;}*/
}
@media (min-width: 401px) and (max-width: 767px){
/*    #legende,
    #legende .viewport { width:400px;}
    #legende { margin-left:-200px;}*/
}
@media (max-width: 400px){
/*    #legende { left:0; top:50px; width:100%; height:80%; margin:0;}
    #legende .viewport{ width:100%; height:255px;}*/
}
@media (max-width: 767px){
    /*count*/
    #legende li:nth-child(1) div *{padding-left:30px; }
    #legende li:nth-child(1) div:after { top:4px; left:0px;}

    #legende li:nth-child(n+2) div:nth-child(2),
    #legende li:nth-child(n+2) div:nth-child(3) { border-left:none; }
    #legende li div { min-height:35px; padding:5px 10px 10px; margin:0 10px; border-bottom:1px dashed lightGrey; }
    #legende li:nth-child(1) div{ border-bottom:1px solid white; padding:5px; }
    #legende li div:last-child { border:none; padding-bottom:0; }
}
