/* CSS Document by Meridian Communication */ /* www.continentsenfete.com 2008 */ /* ----------------------------------- */ /* >>>>>>>>>>>>> aide couleurs <<<< */ /* ----------------------------------- */ /* Colors Help {gris fonce : #819eb0 ; gris clair : #a3b9c8 ; gris tres fonce : #50636e ; fond page : #6c8da4 ; }*/ /* ----------------------------------- */ /* >>>>>>>>>>>>> generalites <<<< */ /* ----------------------------------- */ input, select, textarea{font-size: 100%;} .accessiblite {display:none} h1{display:none; text-decoration:line-through } /* ----------------------------------- */ /* >>>>>>>>>>>>> entete <<<< */ /* ----------------------------------- */ #entete q{display:none} /* #entete #nav-niv-1 { position:relative; width:900px; top: 205px; left:0px; display:block; height:23px; background:transparent url(images/menuBackground.png) repeat-x 0 0; } #entete #nav-niv-1 ul {display:block; width:390px; margin:0 auto; font-size:1.2em; line-height:21px} #entete #nav-niv-1 li {display:block; float:left; padding-left:17px; text-transform:uppercase } #entete #nav-niv-1 li.first { padding-left:0px} */ #entete #nav-niv-1 { position:absolute; top: 205px; display:block; height:23px; width:900px;z-index:21; background:transparent url(images/menuBackground.png) repeat-x 0 0; } #entete #nav-niv-1 ul { } #entete #nav-niv-1 li { display:block; float:left } #entete #nav-niv-1 li.last {display:block; float:left;} #entete #nav-niv-1 li a {position: relative; display:block; text-indent: -5000px; z-index:21; cursor:pointer } * html #nav-niv-1 a:link, * html #nav-niv-1 a:visited {height:22px; he\ight:0;} #entete #nav-niv-1 li a {display:block; top:1px } #entete #nav-niv-1 li a{color:#50636e; text-decoration:none; margin:0; padding:0} #entete #nav-niv-1 li a:visited {color:#50636e;} #entete #nav-niv-1 li a:hover{color:#FFF; text-decoration:underline; } #entete #nav-niv-1 li a.active{color:#FFF;} #entete #nav-niv-1 li#item1 a, #entete #nav-niv-1 li#item1.active a, #entete #nav-niv-1 li#item1 a:hover {display:block; width:59px; height:22px; margin-left:240px} #entete #nav-niv-1 li#item2 a, #entete #nav-niv-1 li#item2.active a, #entete #nav-niv-1 li#item2 a:hover {display:block; width:72px; height:22px; margin-left:20px} #entete #nav-niv-1 li#item3 a, #entete #nav-niv-1 li#item3.active a, #entete #nav-niv-1 li#item3 a:hover {display:block; width:138px; height:22px; margin-left:20px} #entete #nav-niv-1 li#item4 a, #entete #nav-niv-1 li#item4.active a, #entete #nav-niv-1 li#item4 a:hover {display:block; width:80px; height:22px; margin-left:20px;} #page #entete #nav-niv-1 li#item1 a {background:transparent url(images/niv1-item1-off.png) 0 0 no-repeat;} #page #entete #nav-niv-1 li#item2 a {background:transparent url(images/niv1-item2-off.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item3 a {background:transparent url(images/niv1-item3-off.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item4 a {background:transparent url(images/niv1-item4-off.png) 0 0 no-repeat;} #page #entete #nav-niv-1 li#item1.active a{background:transparent url(images/niv1-item1-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item2.active a{background:transparent url(images/niv1-item2-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item3.active a{background:transparent url(images/niv1-item3-on.png) 0 0 no-repeat;} #page #entete #nav-niv-1 li#item4.active a{background:transparent url(images/niv1-item4-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item1 a:hover {background:transparent url(images/niv1-item1-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item2 a:hover {background:transparent url(images/niv1-item2-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item3 a:hover {background:transparent url(images/niv1-item3-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item4 a:hover {background:transparent url(images/niv1-item4-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item1.active a:hover {background:transparent url(images/niv1-item1-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item2.active a:hover {background:transparent url(images/niv1-item2-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item3.active a:hover {background:transparent url(images/niv1-item3-on.png) 0 0 no-repeat; } #page #entete #nav-niv-1 li#item4.active a:hover {background:transparent url(images/niv1-item4-on.png) 0 0 no-repeat; } /* ----------------------------------- */ /* >>>>>>>>>>>>> pied de page <<<< */ /* ----------------------------------- */ #piedDePage p { color:#8c979e; font-size:1.1em; } #piedDePage a{color:#8c979e; text-decoration:none; } #piedDePage a:visited {color:#8c979e;} #piedDePage a:hover{color:#FFF; text-decoration:underline; } #piedDePage a:active{color:#FFF;} #piedDePage a.hautDePage{ display:block; position:absolute; right:0; top:0px; width:75px; background:transparent url(images/hautDePageOff.png) right top no-repeat; } /* -------------------------------------------------- */ /* >>>>>>>>>>>>> template 5 : accueil <<<<<<<<<<< */ /* -------------------------------------------------- */ body.template5 #page #contenu #fondAccueil{ position:relative; } body.template5 #colonneGauche { display:block; position:absolute; top:225px; width: 487px; height:210px; border-right:#DDD dotted 1px; margin-top:23px; } body.template5 #colonneDroite { background:transparent url(images/corpsBackground-fonce-light.png) center top repeat-x; padding-left: 487px; height:266px; padding-top:20px; } body.template5 #colonneGauche p { font-size:1.2em; line-height:1.4em; color:#FFF; margin:12px 24px} body.template5 #colonneGauche h2 { background:transparent url(images/h2LeVoyageEnSoi.png) left top no-repeat; width:201px; height:25px; margin:0px 0 0 18px} body.template5 #colonneGauche h2 span { display:none} body.template5 #colonneDroite h2 {background:transparent url(images/h2FocusGrand.png) left top no-repeat; width:200px; height:19px; margin:2px 0 0 18px} body.template5 #colonneDroite h2 span { display:none} body.template5 #colonneDroite h2 strong {color:#d9e1e6; font-weight:bold; font-size:1.2em; line-height:19px; padding-left:90px} body.template5 #colonneDroite p { font-size:1.2em; line-height:1.6em; color:#FFF; margin:12px 24px} body.template5 #colonneDroite ul { position:relative; margin:18px 0px 10px 20px; height:87px} body.template5 #colonneDroite li { background:transparent url(images/imgBackground.png) left top no-repeat; position:relative; float:left; width:120px; height:87px; margin:0 3px 0 0 } body.template5 #colonneDroite img { position:absolute; top:3px; left:4px} body.template5 a.button{ height:19px; background:#000 url(images/buttonBackground.png) 0 0 repeat-x ; border: 1px solid #EEE; text-decoration:none; font-size:1em; line-height:16px; text-align:center; color:#EEE; padding:2px 4px} body.template5 a#enSavoirPlus{ width:8em; } body.template5 a.button:visited {color:#FFF;} body.template5 a.button:hover{color:#FFF; text-decoration:none; border: 1px solid #FFF; background:#000 url(images/buttonBackgroundOver.png) 0 0 repeat-x ; } body.template5 a.button:active{color:#FFF;} body.template5 #piedDePage p {text-align:center} /* ----------------------------------------------------------- */ /* >>>>>>>>>>>>> template 4 : texte continents <<<<<<<<<<< */ /* ----------------------------------------------------------- */ body.template4 #colonneDroite a{color:#FFF; text-decoration:underline; } body.template4 #colonneDroite a:visited {color:#FFF;} body.template4 #colonneDroite a:hover{color:#FFF; text-decoration:none; } body.template4 #colonneDroite a:active{color:#FFF;} body.template4 #colonneDroite { padding-left: 487px; padding-top:20px; background-color:#6c8da4} body.template4 #colonneGauche { width: 487px; border-right:#DDD dotted 1px; margin-top:23px; background-color:#6c8da4} body.template4 #colonneGauche h2 { font-size:1.3em; line-height:1.6em; font-weight:bold; color:#FFF; height:38px; margin:0px 0 0 24px} body.template4 #colonneGauche h2 strong { text-transform:uppercase} body.template4 #colonneGauche h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template4 #colonneGauche h3 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:12px 0px 0px 24px } body.template4 #colonneGauche p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:6px 24px 0px 24px} body.template4 #colonneGauche em { font-weight:bold} body.template4 #colonneGauche ul { margin:6px 0 0 24px ;} body.template4 #colonneGauche li { font-size:1.1em; line-height:1.6em; color:#FFF; margin:6px 12px 0px 12px; list-style-type:disc} body.template4 #colonneGauche img { margin:0px 16px 0px 24px; border:#a5b9c7 1px solid} body.template4 #colonneDroite p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:0px 16px 12px 24px} body.template4 #colonneDroite h2 { font-size:1.3em; line-height:1.6; font-weight:bold; color:#FFF; height:38px; margin:3px 0 0 24px} body.template4 #colonneDroite h2 strong { text-transform:uppercase} body.template4 #colonneDroite h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template4 #colonneDroite h3 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:6px 0px 0px 24px } body.template4 #colonneDroite div.illustration { display:block; float:left } body.template4 #colonneDroite img { margin:0px 16px 12px 24px; border:#a5b9c7 1px solid} body.template4 #colonneDroite a.button{ height:19px; background:#000 url(images/buttonBackground.png) 0 0 repeat-x ; border: 1px solid #EEE; text-decoration:none; font-size:1em; line-height:16px; text-align:center; color:#EEE; padding:2px 4px} body.template4 #colonneDroite a#enSavoirPlus{ width:8em; } body.template4 #colonneDroite a.button:visited {color:#FFF;} body.template4 #colonneDroite a.button:hover{color:#FFF; text-decoration:none; border: 1px solid #FFF; background:#000 url(images/buttonBackgroundOver.png) 0 0 repeat-x ; } body.template4 #colonneDroite a.button:active{color:#FFF;} body.template4 #piedDePage p {text-align:left} /* ----------------------------------------------------------- */ /* >>>>>>>>>>>>> template 8 : contats <<<<<<<<<<< */ /* ----------------------------------------------------------- */ body.template8 #colonneGauche a{color:#FFF; text-decoration:underline; } body.template8 #colonneGauche a:visited {color:#FFF;} body.template8 #colonneGauche a:hover{color:#FFF; text-decoration:none; } body.template8 #colonneGauche a:active{color:#FFF;} body.template8 #colonneDroite a{color:#FFF; text-decoration:underline; } body.template8 #colonneDroite a:visited {color:#FFF;} body.template8 #colonneDroite a:hover{color:#FFF; text-decoration:none; } body.template8 #colonneDroite a:active{color:#FFF;} body.template8 #colonneDroite { padding-left: 487px; padding-top:20px; background-color:#6c8da4} body.template8 #colonneGauche { width: 487px; border-right:#DDD dotted 1px; margin-top:23px; background-color:#6c8da4} body.template8 #colonneGauche h2 { font-size:1.3em; line-height:1.6em; font-weight:bold; color:#FFF; height:38px; margin:0px 0 0 24px} body.template8 #colonneGauche h2 strong { text-transform:uppercase} body.template8 #colonneGauche h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template8 #colonneGauche h3 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:12px 0px 0px 24px } body.template8 #colonneGauche p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:6px 24px 0px 24px} body.template8 #colonneGauche em { font-weight:bold} body.template8 #colonneGauche ul { margin:6px 0 0 24px ;} body.template8 #colonneGauche li { font-size:1.1em; line-height:1.6em; color:#FFF; margin:6px 12px 0px 12px; list-style-type:disc} body.template8 #colonneGauche img { margin:0px 16px 0px 24px; border:#a5b9c7 1px solid} body.template8 #colonneDroite p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:0px 16px 12px 24px} body.template8 #colonneDroite em { font-weight:bold} body.template8 #colonneDroite h2 { font-size:1.3em; line-height:1.6; font-weight:bold; color:#FFF; height:38px; margin:3px 0 0 24px} body.template8 #colonneDroite h2 strong { text-transform:uppercase} body.template8 #colonneDroite h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template8 #colonneDroite h3 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:6px 0px 0px 24px } body.template8 #colonneDroite ul { margin:6px 0 0 24px ;} body.template8 #colonneDroite li { font-size:1.1em; line-height:1.6em; color:#FFF; margin:6px 12px 0px 12px; list-style-type:disc} body.template8 #colonneDroite div.illustration { display:block; float:left } body.template8 #colonneDroite img { margin:0px 16px 12px 24px; border:#a5b9c7 1px solid} body.template8 #colonneDroite a.button{ height:19px; background:#000 url(images/buttonBackground.png) 0 0 repeat-x ; border: 1px solid #EEE; text-decoration:none; font-size:1em; line-height:16px; text-align:center; color:#EEE; padding:2px 4px} body.template8 #colonneDroite a#enSavoirPlus{ width:8em; } body.template8 #colonneDroite a.button:visited {color:#FFF;} body.template8 #colonneDroite a.button:hover{color:#FFF; text-decoration:none; border: 1px solid #FFF; background:#000 url(images/buttonBackgroundOver.png) 0 0 repeat-x ; } body.template8 #colonneDroite a.button:active{color:#FFF;} body.template8 #piedDePage p {text-align:left} /* -------------------------------------------------- */ /* >>>>>>>>>>>>> template 6 : liste voyages <<<<< */ /* -------------------------------------------------- */ body.template6 #colonneGauche { width: 900px; background-color:#6c8da4} body.template6 #colonneGauche .unVoyage {position:relative; width: 868px; height:287px; background-color:#6c8da4; border-bottom:1px #FFF dotted; margin:16px 0 0 16px} body.template6 #colonneGauche h2 { font-size:1.3em; line-height:1.6; font-weight:bold; color:#FFF; height:22px; margin:16px 0 0px 0px} body.template6 #colonneGauche h2 strong { text-transform:uppercase} body.template6 #colonneGauche h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template6 #colonneGauche img { border:#a5b9c7 1px solid} body.template6 #colonneGauche .unVoyageDescription {position:absolute; width: 249px; height:258px; left:619px; top:8px} body.template6 #colonneGauche .unVoyageDescription h3 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:12px 0px 6px 0px } body.template6 #colonneGauche .unVoyageDescription p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:10px 0px 12px 0px} body.template6 #colonneGauche .unVoyageDescription ul { margin:0px 0px 0 0; height:68px} body.template6 #colonneGauche .unVoyageDescription li { float:left; width:71px; height:68px; margin:6px 9px 0 0 } body.template6 #colonneGauche .unVoyageDescription img { top:0px; left:0px; width:71px; height:68px; overflow:hidden} body.template6 #colonneGauche .unVoyageDescription a.button{ position:absolute; bottom:0px; height:17px; background:#5d7486 url(images/buttonBackgroundListe.png) 0 0 repeat-x ; border: 1px solid #EEE; text-decoration:none; font-size:1em; line-height:16px; text-align:center; color:#EEE; padding:2px 4px} body.template6 #colonneGauche .unVoyageDescription a.button:visited {color:#FFF;} body.template6 #colonneGauche .unVoyageDescription a.button:hover{color:#FFF; text-decoration:none; border: 1px solid #FFF; background:#5d7486 url(images/buttonBackgroundListeOver.png) 0 0 repeat-x ; } body.template6 #colonneGauche .unVoyageDescription a.button:active{color:#FFF;} body.template6 #piedDePage p {text-align:left} /* -------------------------------------------------- */ /* >>>>>>>>>>>>> template 7 : un voyage <<<<< */ /* -------------------------------------------------- */ /*/////////////// BOUTON retour */ body.template7 #btn-retour {display:block; width:133px; height:22px; z-index:1006} body.template7 #btn-retour a{background:transparent url(images/btn-retourListe-off.png) 0 0 no-repeat; display:block; width:133px; height:22px; cursor:pointer} body.template7 #btn-retour a:hover {background:transparent url(images/btn-retourListe-on.png) 0px 0 no-repeat;width:133px; height:22px; cursor:pointer } body.template7 #btn-retour a span{display:none} body.template7 #btn-retour {position:absolute; top:229px; right:13px; } body.template7 #colonneGauche { width: 900px; background-color:#6c8da4} body.template7 #colonneGauche #unVoyage {position:relative; width: 884px; height:267px; background-color:#6c8da4; margin:0px 0 0 16px} body.template7 #colonneGauche #artisanat {position:relative; width: 884px; height:224px; background-color:#6c8da4; margin:0px 0 0 16px} body.template7 #colonneGauche #programme {position:relative; width: 884px; height:auto; background-color:#6c8da4; margin:0px 0 0 16px} body.template7 #colonneGauche #avis {position:relative; width: 884px; height:auto; background-color:#6c8da4; margin:0px 0 0 16px} body.template7 #colonneGauche h2 { font-size:1.3em; line-height:1.6; font-weight:bold; color:#FFF; height:22px; margin:16px 0 0 0px} body.template7 #colonneGauche h2 strong { text-transform:uppercase} body.template7 #colonneGauche h2 span { padding-left:23px; background:transparent url(images/tiretPlein.png) 7px 0px no-repeat;} body.template7 #colonneGauche img { border:#a5b9c7 1px solid} body.template7 #colonneGauche h3 { font-size:1.1em; line-height:1.5em; text-transform:uppercase; font-weight:bold; color:#FFF; height:18px; margin:16px 0 6px 0px; background:transparent url(images/h3Background.png) 0 0px repeat-x ; } body.template7 #colonneGauche h3 span {background-color:#6c8da4; padding-right:10px} body.template7 #colonneGauche .droite {position:absolute; width: 249px; height:258px; left:619px; top:22px; padding-top:0px} body.template7 #colonneGauche .droite h4 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:0px 0px 6px 0px } body.template7 #colonneGauche .droite p { font-size:1.1em; line-height:1.5em; color:#FFF; margin:0px 0px 12px 0px} body.template7 #colonneGauche .droiteFonce {position:absolute; background-color:#567991; width: 221px; left:619px; top:22px; padding:14px} body.template7 #colonneGauche .droiteFonce h4 { font-size:1.2em; line-height:1.4em; font-weight:bold; color:#FFF; margin:0px 0px 6px 0px } body.template7 #colonneGauche .droiteFonce p { font-size:1.1em; line-height:1.6em; color:#FFF; margin:0px 0px 0px 0px} body.template7 #colonneGauche #artisanat ul { margin:0px 0px 0 0; height:68px} body.template7 #colonneGauche #artisanat li { float:left; width:185px; height:185px; margin:0px 16px 0 0 } body.template7 #colonneGauche #artisanat li img { top:0px; left:0px; width:185px; height:185px; overflow:hidden} body.template7 #colonneGauche #programme ul { margin:0px 0px 0 0; width:605px} body.template7 #colonneGauche #programme li { position:relative; margin:5px 16px 10px 0; min-height:85px; padding:0 0 10px 0; border-bottom:1px solid #98afbf } body.template7 #colonneGauche #programme ul h4 { font-size:1.1em; line-height:1.4em; font-weight:bold; color:#567991; margin:0px 0px 6px 0px } body.template7 #colonneGauche #programme ul h4 span { background-color:#FFF; padding:1px 3px 0 3px; text-transform:capitalize} body.template7 #colonneGauche #programme ul p { font-size:1.1em; line-height:1.4em; color:#FFF; width:372px; margin:0px 0 10px 0px } /*body.template7 #colonneGauche #programme ul p:first-line{ font-weight:bold; line-height:1.4em; padding-bottom:10px}*/ body.template7 #colonneGauche #programme img { position:absolute; top:0; right:0; width:185px; overflow:hidden } body.template7 #colonneGauche #avis ul { margin:0px 0px 0 0; width:884px} body.template7 #colonneGauche #avis li { position:relative; margin:35px 16px 10px 0; min-height:145px; padding:0 0 10px 0; background-color:#567991; padding-top:12px; } body.template7 #colonneGauche #avis ul h4 { position:absolute; font-size:1.1em; line-height:1.4em; color:#FFF; margin:0px 0px 6px 0px; top:-20px; padding-left:30px; background:transparent url(images/h4AvisBackground.png) 0 0px no-repeat ; } body.template7 #colonneGauche #avis ul h4 strong { font-weight:bold; } body.template7 #colonneGauche #avis ul p { font-size:1.1em; line-height:1.4em; color:#FFF; width:332px; margin:0px 0 10px 31px } body.template7 #colonneGauche #avis img { position:absolute; top:18px; right:18px; width:228px; height:130px; overflow:hidden } body.template7 #colonneGauche .droite a.button{ position:absolute; bottom:12px; height:17px; background:#5d7486 url(images/buttonBackgroundListe.png) 0 0 repeat-x ; border: 1px solid #EEE; text-decoration:none; font-size:1em; line-height:16px; text-align:center; color:#EEE; padding:2px 4px} body.template7 #colonneGauche .droite a.button:visited {color:#FFF;} body.template7 #colonneGauche .droite a.button:hover{color:#FFF; text-decoration:none; border: 1px solid #FFF; background:#5d7486 url(images/buttonBackgroundListeOver.png) 0 0 repeat-x ; } body.template7 #colonneGauche .droite a.button:active{color:#FFF;} body.template7 #piedDePage p {text-align:left}