/* -------MODIFS BEN 01-04-2020 -------------------------------- -----------------------------------------*/ html { height: 101%;} body { margin: 0; padding: 0;} body.contentpane { background: #fff;} * { padding: 0; margin: 0; box-sizing: border-box;} /*h1, h2, h3, h4, h5, h6, div.contentheading, .componentheading { padding: 3px 0; margin: 0; line-height: 1.2; font-weight: bold; font-style: normal; }*/ ul, ol { padding: .75em 0 .75em 0; margin: 0 0 0 35px;} ul.menu { margin: 0; padding: 0;} ul.menu li { list-style: none;} p { padding: 5px 0; margin-bottom: 1.5em;} address { margin: .75em 0; font-style: normal; letter-spacing: .025em;} a:focus { outline: none;} img { border: none;} .border img {border: 1px solid #e3e3e3; border-radius:3px } em { font-style: italic;} strong { font-weight: 600;} form, fieldset { margin: 0 auto; padding: 5px; border: none; width: 95%;} input, button, select { vertical-align: middle;} .clr { clear : both;} .column.column2 { width: 35%;} .column.center { width: 65%;} .noright .column.center { width: 100%;} .flexiblemodule, .column, .logobloc { float: left;} .well { background-color: #fff; border: none; box-shadow: none;} .div_center {margin:20px auto!important;} .no_float {float:none!important;} /* --------------------------------------- specific to images -----------------------------------------*/ ul.actions { margin: 0;} ul.actions li a { text-decoration: none;} .print-icon { list-style: none; display: inline-block; height: 16px; line-height: 16px; padding-left: 20px; background: url(../images/system/printButton.png) left center no-repeat;} .email-icon { list-style: none; display: inline-block; height: 16px; line-height: 16px; padding-left: 20px; background: url(../images/system/emailButton.png) left center no-repeat;} .edit-icon { list-style: none; display: inline-block; height: 16px; line-height: 16px; padding-left: 20px; background: url(../images/system/edit.png) left center no-repeat;} .well img { border-radius: 3px;} .no-border img { border: none;} /* --------------------------------------- Custom styling -----------------------------------------*/ .container, .container-fluid { margin: 0 auto;} .container { width: 100%;} .container-fluid { max-width: 100%;} body { color: #404040; text-align: left; line-height: 1.75; font-size: 18px; font-weight: 300; font-family: 'Open Sans', sans-serif; } h1, div.componentheading { line-height: 60px; font-size: 40px; margin-top: 50px; text-align: center; } h2, div.contentheading { line-height: 45px; font-size: 35px;} h3, .t3 { line-height: 32px; font-size: 25px;} h4 { line-height: 24px; font-size: 18px; font-weight:400;} h1, div.componentheading, h2, div.contentheading, h3 {color: #4c4c4c; font-family:'Work Sans', sans-serif ; font-weight:400;} h3, .t3 { border-bottom: 6px solid #88BDDF; padding: 10px 0; text-align: center; font-weight:400; } li { line-height: 1.63; padding-top: 4px;} .invalid {border: red;} textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { height: 28px; width: 100%;} .page-header { margin: 2px 0px 10px 0px; padding-bottom: 5px; text-align: center;} .h-margin { margin: 30px 0 !important;} .h-padding { padding: 15px 0;} .l-margin { margin: 0 15px;} .l-padding { padding: 0 15px;} .b-margin { margin: 0 0 15px 0;} .t-margin { margin: 15px 0 0 0;} .rgt-margin { margin: 0 15px 0 0;} .lft-margin { margin: 0 0 0 15px;} .outline { outline: thin dotted #08c;} .bg-white { background: #fff none repeat scroll 0 0;} .bg-black { background: #000 none repeat scroll 0 0; color: #FFFFFF; padding: 15px;} .bg-blue { background: #184f85 none repeat scroll 0 0; border: 1px solid #10223e; color: #fff; padding: 15px;} .text-white { color: #fff;} .text-blue { color: #006dcc;} .text-green { color: #26913D; } .text-orange { color: #ed7c57;} .text-red { color: #da4f49;} #wrapper2 { background: #fff; box-shadow: 0 4px 14px 0 rgba(96,152,220,.2); position: fixed; width: 100%; z-index:100; } #wrapper2 > div.inner { max-width:95%; margin: auto;} #banner > div.inner { color: #10223e; height: 60px; padding-top: 2px;} .inner-detail, .inner-form, .inner-list {width:90%;margin:auto;} #system-message-container {width:90%;margin:auto;} #bannerlogo { width: 20%; padding-bottom: 5px;} #bannerlogo > div.inner > .bannerlogodesc { color: #10223e; text-align: center; font-size: 13px; font-family: Arial, sans-serif;} #bannerlogo > div.inner { margin-top: 6px; margin-left: 3px;} #bannermenu { width: 80%;} #bannermenu ul.menu, #bannermenu ul.maximenuck { margin: 0 0 0 20px; padding: 0;} #bannermenu ul.menu li, #bannermenu ul.maximenuck li { margin: 0; padding: 0; display: inline-block; list-style:none;} #bannermenu ul.menu li li, #bannermenu ul.maximenuck li li { float: none; display: block;} #bannermenu ul.menu > li > a, #bannermenu ul.menu > li > span.separator, #bannermenu ul.maximenuck > li > a, #bannermenu ul.maximenuck > li > span.separator{ display:block; padding-top: 9px; padding-right: 8px; padding-bottom: 9px; padding-left: 8px; text-align: left; font-weight: normal; font-size: 14px;} #bannermenu ul.menu > li:hover > a, #bannermenu ul.menu > li:hover > span.separator, #bannermenu ul.maximenuck > li:hover > a, #bannermenu ul.maximenuck > li:hover > span.separator { color: #fff; background-color: #88BDDF;} #bannermenu ul.menu > li.active > a, #bannermenu ul.menu > li.active > span.separator, #bannermenu ul.maximenuck > li.active > a, #bannermenu ul.maximenuck > li.active > span.separator {background: #88BDDF; color: #fff;} #bannermenu ul.menu li li a, #bannermenu ul.menu li li span.separator,#bannermenu ul.maximenuck li li a, #bannermenu ul.maximenuck li li span.separator { display: block; margin: 5px; padding-left: 10px; font-size: 14px; font-weight: 400!important;} #bannermenu ul.menu li li:hover > a, #bannermenu ul.menu li li:hover span.separator,#bannermenu ul.maximenuck li li:hover > a, #bannermenu ul.maximenuck li li:hover span.separator { color: #000000;} #bannermenu ul.menu li li.active > a, #bannermenu ul.menu li li.active span.separator,#bannermenu ul.maximenuck li li.active > a, #bannermenu ul.maximenuck li li.active span.separator{ color: #000000;} /* code pour menu normal */ #bannermenu ul.menu li ul, #bannermenu ul.menu li:hover ul ul, #bannermenu ul.menu li:hover ul ul ul { position: absolute; left: -999em; z-index: 999; margin: 0; padding: 0; background: #f7f7f7; width: 200px;} #bannermenu ul.menu li:hover ul ul, #bannermenu ul.menu li:hover li:hover ul ul, #bannermenu ul.menu li:hover li:hover li:hover ul ul,#bannermenu ul.menu li.sfhover ul ul, #bannermenu ul.menu li.sfhover ul.sfhover ul ul, #bannermenu ul.menu li.sfhover ul.sfhover ul.sfhover ul ul { left: -999em;} #bannermenu ul.menu li:hover > ul, #bannermenu ul.menu li:hover ul li:hover > ul, #bannermenu ul.menu li:hover ul li:hover ul li:hover > ul, #bannermenu ul.menu li:hover ul li:hover ul li:hover ul li:hover > ul,#bannermenu ul.menu li.sfhover ul, #bannermenu ul.menu li.sfhover ul li.sfhover ul, #bannermenu ul.menu li.sfhover ul li.sfhover ul li.sfhover ul, #bannermenu ul.menu li.sfhover ul li.sfhover ul li.sfhover ul li.sfhover ul { left: auto;} #bannermenu ul.menu li:hover ul li:hover ul { margin-top: -30px; margin-left: 190px;} /* fin code normal */ #bannermenu ul.maximenuCK li ul, #bannermenu ul.maximenuCK li:hover ul ul, #bannermenu ul.maximenuCK li:hover ul ul ul, #bannermenu ul.maximenuck li ul, #bannermenu ul.maximenuck li:hover ul ul, #bannermenu ul.maximenuck li:hover ul ul ul { position: static !important; left: auto !important; background: transparent !important; border-radius: 0 !important; border: none !important; -moz-border-radius: 0 !important; -o-border-radius: 0 !important; -webkit-border-radius: 0 !important; width: 100% !important; box-shadow: none !important; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; } #bannermenu ul.maximenuCK li ul ul,#bannermenu ul.maximenuck li ul ul { margin: 0 !important;} #bannermenu li div.maxidrop-main { width: 250px;} #bannermenu li div.floatCK,#bannermenu li div.floatck { background: #fff;} #bannermenu ul li ul.maximenuCK2,#bannermenu ul li ul.maximenuck2 { margin: 0; padding: 0;} #bannermenu ul li div.maximenuCK2,#bannermenu ul li div.maximenuck2 { float: left; width: 100%;} #bannermenu li div.maxidrop-main div.maxidrop-main {} #bannermenu ul li.maximenuCK div.floatCK div.floatCK,#bannermenu ul li.maximenuck div.floatck div.floatck { margin-top: -30px; margin-left: 190px;} #bannermenu span.descCK,#bannermenu span.descck { display: block; line-height: 10px;} #bannermenu ul.menu li li { float: none; display: block;} div#maximenuck94 a { color: #404040;} div#maximenuck94 ul.maximenuck2 li a:hover { background-color: #87bbe0; color: #fff;} #wrapper > div.inner { background: #FFFFFF; border: none; max-width:100%;} #wrapper_85,#wrapper_86, #wrapper_87 {max-width:1080px; margin: 0 auto;} #breadcrumb { font-size: 14px;} /*#center > div.inner { padding: 10px 20px;}*/ #right div.moduletable, #right div.module,#right div.moduletable_menu, #right div.module_menu { background: #ffffff; font-size: 16px; margin: 20px; padding: 20px;} #wrapper1 { background: #4c4c4c; font-size: 14px; border-top: 10px solid #88BDDF; position:relative;z-index:1;overflow:hidden;} #wrapper1 h3, #wrapper1 .t3 {color:#fff} #wrapper1 > div.inner { color: #FFFFFF; padding: 20px; width: 85%;} #modules1 .n1 > .flexiblemodule { width: 100%; } #modules1 .n2 > .flexiblemodule { width: 50%; } #modules1 .n2 > .flexiblemodule + div { width: 50%; } #modules1 .n3 > .flexiblemodule { width: 33.333333333333%; } #modules1 .n3 > .flexiblemodule + div { width: 33.333333333333%; } #modules1 .n3 > .flexiblemodule + div + div { width: 33.333333333333%; } .moduletable li { margin-bottom: 10px; line-height: 22px;} .moduletable_blue { background: none repeat scroll 0 0 #184f85; border: 1px solid #e3e3e3; margin: 20px; padding: 20px; font-family: Helvetica,sans-serif; font-size: 18px; line-height: 30px; text-align: center;} .moduletable_blue a { color: #FFFFFF;} #wrapper1 a { color: #88bddf;} #wrapper3 { padding-top: 60px;} /* Menu CK */ div#maximenuck94 ul.maximenuck li.maximenuck.level1 { background: none repeat scroll 0 0 #fff; margin: 0 7px;} div#maximenuck94 ul.maximenuck li.maximenuck.level1:hover { background: none repeat scroll 0 0 #fff !important;} div#maximenuck94 ul.maximenuck li.maximenuck.item174.level1 { background-color: #ff5c99;} div#maximenuck94 .item174 span.titreck, div#maximenuck94 .item174 span.descck { color: #fff;} div#maximenuck94 li a {height:auto; box-sizing:content-box; padding: 5px 0;} div#maximenuck94 span.descck {font-size:11px; color:; font-weight:normal; line-height:20px;} div#maximenuck94 a:hover span.descck, div#maximenuck94 li.active span.descck {color:#fff !important;} div#maximenuck94 ul.maximenuck li.maximenuck.level1.hidden {display:none !important;} div#maximenuck94 ul.maximenuck li.maximenuck.level1 > a.featured {background:none repeat scroll 0 0 } div#maximenuck94 ul.maximenuck li.maximenuck.level1 > a.featured:hover, div#maximenuck94 ul.maximenuck li.maximenuck.level1.active > a.featured {background:none repeat scroll 0 0 ;} div#maximenuck94.maximenuckh ul.maximenuck { text-align: center; padding-top: 10px;} #bannermenu ul.maximenuck > li > hover { background: #88BDDF; color: #fff;} #banner .mobileckhambuger_togglerlabel { color: #fff; position: absolute; left: 0; top: 10px;} /* Blogview */ .blog .liste-articles-blog { text-transform:uppercase; font-size: 20px; line-height: 25px; border-bottom: 1px solid #333333; font-family: Domine; font-weight: normal; margin-top: 30px;} .blog { margin-bottom: 30px;} .blog .items-leading div { clear:both;} .blog .items-leading .item-image { padding-right:15px;} .blog .items-leading .page-header { padding-top: 30px; margin: 0;} .blog .items-leading .page-header h2 { font-size: 25px;} /* Article */ .chapeau { font-family: Domine,Helvetica,sans-serif; font-size: 23px; line-height: 30px; margin-bottom: 10px;} .img_caption {color: #999; line-height: 20px; font-size: 13px; margin-bottom: 18px;} a.jcepopup span.jcemediabox-zoom-span {border-width: 0px!important;} /* Accueil */ .col4-accueil { float: left; padding: 2.5%; width: 25%;} .col4-accueil img { padding: 10px 0;} .col6-accueil { float: left; padding: 1.5%; width: 33%;} .col6-accueil img { padding: 10px 0;} .col3-footer { float: left; padding: 1.5%; width: 33%;} .col3-footer img { padding: 10px 0;} .col2-services { float: left; padding: 3%; width: 49%;} .col2-services img { padding: 10px 0; } /* HEADER */ .header-pano-wrapper { height:220px; position:relative; overflow:hidden; margin-bottom: 25px;} .moduletable_header-pano-small .header-pano-wrapper { height:250px; position:relative; overflow:hidden; margin-bottom: 25px;} .header-pano-bg { position: absolute; left: -1000px; right: -1000px; text-align: center; height: 250px;} .moduletable_header-pano-small .header-pano-bg { height:250px;} .header-pano-img { height:250px; width: 1980px;} .fond-header {background-color: rgba(0, 0, 0); position: absolute; top: 0; right: 0; left: 0; bottom: 0;} .moduletable_header-pano-small .header-pano-img { height:250px;} .header-pano-title { top: 30px; text-align: center; width: 100%; padding: 30px 0; background-color: #000;} .header-pano-title h1, .header-pano-title h2 { color: #fff; padding: 0 15px; box-sizing: border-box; text-transform: none; } .header-pano-title h1 { font-weight: 700; font-size:40px; margin-bottom: 5px;} .header-pano-title h2 {font-weight: 400; font-size:30px;} .header-intro { padding: 10px 0px 20px 0px;} /* ACCUEIL */ .reponse_accueil { background: #88bddf; margin: 35px 0; padding: 20px 0;} .reponse_accueil .t2, .reponse_accueil h2 { font-weight: 600; color: #fff; font-size: 35px; text-rendering: geometricPrecision; letter-spacing: -0.01em; line-height: 1.05;} /* BTN */ .btn {border-radius: 0px;} .btn-primary:hover, .btn-danger:hover, .btn-success:hover, .btn-warning:hover, .btn-primary:active, .btn-danger:active, .btn-success:active, .btn-warning:active { background-color: #fff; border-color: #ff5c99; transition: 1s; color: #ff5c99; font-weight: 400;} .btn { padding: 15px 20px; font-size: 17px;} .btn-primary,.btn-danger,.btn-success,.btn-warning { background-color: #ff5c99; border-color: #ff5c99; transition: 1s; color: #fff; font-weight: 400; font-size:20px; width:100%; } .form-actions { padding: 17px 20px 18px; margin-top: 18px; margin-bottom: 18px; background-color: #fff; border-top: none;} .fond-bleu {background: #88BDDF; padding: 20px 0; margin: 20px 0;} .fond-gris {background: #F2F2F2; padding: 20px 0; margin: 20px 0;} .fond-gris-clair {background: #F9F9F9; padding: 20px 0; margin: 20px 0;} .fond-noir {background: #000; padding: 40px 0; margin: 20px 0; color:#fff;} .fond-noir h2 {color: #fff; } .fond-bleu h2 {color: #fff; padding-bottom: 10px;} .fond-bleu .well {min-height: 320px;} .logo-client img{margin: 10px auto; display: block;} .structure-client {margin-top: 30px;} .package-client-title {margin-top: 10px;} #realisation .well {min-height:600px} .bloc-icone .icone { width: 75px; line-height: 73px; margin:auto; color: #fff; background-color: #88BDDF; border-radius: 20%; text-align: center; transition: background-color 0.8s, transform 0.8s; position: relative; } .bloc-icone:hover .icone { background-color: #4C4C4C; transform: scale(1);} .zoom-img:hover img { transform: scale(1.5); } .zoom-img img { transition: transform 0.7s;} .prix { border-radius: 10px; color: #88bddf; font-size: 40px; font-weight: 900;} .chapo { font-size: 18px;font-weight:400;padding: 20px 0} .legende-photo { font-size: 12px;} #article_700px, .moduletable_menu_conseils, .moduletable_menu_infos {max-width:700px; margin:auto} #article_800px {max-width:800px; margin:auto} /* CSS RESACONSEIL */ body { color: #404040; text-align: left; line-height: 1.65; font-size: 17px; font-weight: 400; font-family: 'Open Sans', sans-serif; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family:'Open Sans', sans-serif ; font-weight: 700; line-height: 1.1; color: #21313a;} h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { text-rendering: geometricPrecision; letter-spacing: -0.01em; line-height: 1.30;} h1, h2, .h1, .h2, h3, .h3 { font-weight: 700;} h2 b, h2 strong, h3 b, h3 strong {font-weight:900; color: #88bddf;} h4, .h4 { font-weight: 400;} h1, .h1, h2, .h2, h3, .h3 { margin-top: 20px; margin-bottom: 20px;} h1, .h1 { font-size: 45px;} h2, .h2 { font-size: 35px;} h3, .h3 { font-size: 25px;} h4, .h4 { font-size: 18px;} h3, h4, h5, h6, .h3, .h4, .h5, .h6 { line-height: 1.4;} .articleBody {} div.jwDisqusForm { clear: both; width: 85%; margin: auto;} .table { font-size: 16px;} .table th, .table td { padding: 15px 8px;} a { color: #ff5c99; text-decoration: none;} a:hover { color: #ff5c99; font-weight: 400; text-decoration: underline;} .nav { font-size: 14px;} .quote { font-size: 20px; padding: 20px 0; font-weight: 700; font-style: italic;} .puce-site{font-size:0.9em;} /* TABLEAU RESPONSIVE */ @media (max-width: 500px) { .responsive-table-line td:before { content: attr(data-title); } .responsive-table-line table, .responsive-table-line thead, .responsive-table-line tbody, .responsive-table-line th, .responsive-table-line td, .responsive-table-line tr { display: block; } .responsive-table-line thead tr { display:none; } .responsive-table-line td { position: relative; border: 0px solid transparent; padding-left: 50% !important; white-space: normal; text-align:right; } .responsive-table-line td:before { position: absolute; top: 0px; left: 0px; width: 45%; padding-right: 15px; height:100%; white-space: nowrap; text-overflow: ellipsis !important; overflow:hidden !important; text-align:left; background-color:#f8f8f8; padding:2px; } } /* DEBUT TABLEAU TRAVEL BLOG responsive*/ @media screen and (max-width: 524px) { /* Force table to not be like tables anymore */ #prix-dates table, #prix-dates thead, #prix-dates tbody, #prix-dates th, #prix-dates td, #prix-dates tr, { display: block; } #voyages .voyages_row .mois-depart { display: inline-block;}   /* Hide table headers (but not display: none;, for accessibility) */ #prix-dates th { position: absolute;top:-9999px;left:-9999px;} #prix-dates thead { display:none} #prix-dates tr { border: 1px solid #ccc; } #prix-dates td { /* Behave like a "row" */border: none;border-bottom: 1px solid #eee; position: relative;padding-left: 50%; white-space: normal;text-align:right; min-height: 10px; display: block;} #prix-dates td:before { /* Now like a table header */position: absolute;/* Top/left values mimic padding */top: 6px;left: 6px;width: 45%; padding-right: 10px; white-space: nowrap;text-align:left;font-weight: bold; content: attr(data-title)} #prix-dates .fabrikSubGroup {padding-bottom: 0px;} .table { font-size: 12px;} } /* FIN TABLEAU RESPONSIVE*/ #etude-etourisme { background-color: #e5f3fe; border: 1px solid #eee;} #etude-etourisme h1 {font-size:5px; margin-top: 0; margin-bottom: 0;} #etude-etourisme .form-horizontal .control-label {text-align:left} #etude-etourisme .form-actions { padding: 0;} .alert, .alert h4 { font-size: 14px;} .popover-content { padding: 9px 14px; font-size: 12px;} .control-group.error .control-label, .control-group.error .help-block, .control-group.error .help-inline { color: #b94a48; font-size: 12px;} #etude-etourisme .inner-detail, #etude-etourisme .inner-form, #etude-etourisme .inner-list { width: 100%; margin: auto;} #etude-etourisme form, #etude-etourisme fieldset { margin: 0 auto; padding: 5px; border: none; width: 100%;} #etude-etourisme .input-xxlarge { width: 100%;} #etude-etourisme .form-actions { background-color: #e5f3fe;} #etude-etourisme .legend {font-size: 30.5px; line-height: 45px; border-bottom: none; text-align: center;} .moduletable-module-guide { width: 250px; margin: 20px;} /*---------------------------------- BANNER TOP -------------------------------------------------------- */ #bannertop, #bannerlogo, #bannermenu { width: 100%; box-sizing: border-box;} #bannertop {position:fixed; background-color:#181212; height: 40px; z-index:1;} #bannertop .inner-top {padding-top: 8px;} #recherche-libre {float: left; width: 200px;} #recherche-libre .input-large {font-size: 12px; padding: 1px 5px; width: auto; border-radius: 3px 0 0 3px; border: none;} #recherche-libre .btn { padding: 5px 8px; font-weight: 300; line-height: 10px; border-radius: 0 3px 3px 0; background-color: #fff; color: #555555; border-left: 1px solid #ddd; vertical-align: top;} #recherche-libre .btn:hover {background-color: #e5870e; color: #fff;} #bannertop-left {float: left; color: #fff; font-size: 13px; padding-top: 2px; padding-right: 120px;} #bannertop-right {padding-top: 2px; color:#FFFFFF;} #bannertop-right span.call-questions, #bannertop-right span.call-link, #bannertop-right span.link-blog {color:#fff; font-size:13px} #bannertop-right span.call-number {color:#fff; font-weight:600;} #bannertop-right span.call-questions {margin-right:0px; font-size: 13px;} #bannertop-right span.call-number {margin-right:10px; font-size: 15px;} #bannertop-right .btn-top-sur-mesure {font-size: 13px; line-height: 1em; padding: 4px 10px; margin-left: 10px;}