Nos partenaires et nous-mêmes utilisons différentes technologies, telles que les cookies, pour personnaliser les contenus et les publicités, proposer des fonctionnalités sur les réseaux sociaux et analyser le trafic. Merci de cliquer sur le bouton ci-dessous pour donner votre accord. Vous pouvez changer d’avis et modifier vos choix à tout moment. Informations RGPD
*{ margin: 0px; padding: 0px; outline: none; border: none; text-decoration: none; list-style: none; box-sizing: border-box; } img { max-width: 100%; } .clear{ clear: both; } .wrapper{ max-width: 1024px; width: 96%; margin: 0 auto; } .main{ width: 100%; float: left; /*font-family: 'Oswald', sans-serif;*/ font-family: 'Open Sans', sans-serif; background: url(https://i.imgur.com/D9oSnx6.jpg) left top repeat; } .header{ width: 100%; float: left; background: #fff; text-align: center; border-radius: 6px; border: solid 1px #e7e7e7; padding: 30px 0; margin: 22px 0; position: relative; } .header:after{ content: ''; position: absolute; left: 0; right: 0; bottom: -30px; height: 30px; background: url(https://i.imgur.com/Srpg4Q1.png) center top no-repeat; } .template{ width: 100%; float: left; } .template_left{ width: 75%; float: left; } .white_space{ padding: 16px; background: #fff; border-radius: 8px; border: solid 1px #e7e7e7; } .title,.heading{ width: 100%; float: left; background: #f9962f; font-family: 'Oswald', sans-serif; font-size: 22px; line-height: 28px; font-weight: normal; color: #fff; padding: 7px 15px; } h2.heading{margin-bottom: 15px;} /*gallery*/ .gallery_list { width: 100%; float: left; position: relative; text-align: center; margin: 35px 0; } .thumbnails { list-style: none; font-size: 0; } .thumbnails li { display: inline-block; margin: 0 10px 0 0; width: 90px; height: 90px; text-align: center; vertical-align: middle; } .thumbnails li:hover .item-hugger { background: white;} .thumbnails li:hover .item-hugger .title { color: #000; } .thumbnails input[name="select"] { display: none; } .thumbnails .item-hugger { height: 100%; position: relative; background: #fff; display: flex; flex-direction: column; justify-content: center; transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; border:solid 1px #e4e4e4; z-index: 999; padding: 4px; } .thumbnails label { position: absolute; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; } .thumbnails .title { padding: 20px 0 0; font-size: 18px; color: #555; transition: all 150ms linear; } .thumbnails .thumb-image,.thumbnails .content2 img { align-self: center; max-height: 100%; } .thumbnails .content2 { position: absolute; top: 0; left: 0; width: 100%; height: 350px; padding: 5px; opacity: 0; transition: all 150ms linear; display: flex; background: #FFF; flex-direction: column; justify-content: center; overflow: hidden; align-self: center; } .thumbnails input[name="select"]:checked + .item-hugger { background: white; border: solid 1px #f9962f; } .thumbnails input[name="select"]:checked ~ .content2 { opacity: 1; } .white-box { height: 400px; overflow: hidden; } .temp_lest{ width: 100%; float: left; margin-bottom: 15px; } .temp_lest li{ width: 100%; float: left; font-size: 14px; line-height: 28px; font-weight: normal; color: #737373; background: url(https://i.imgur.com/gCI74CA.jpg) left 10px no-repeat; padding-left: 18px; } p{ font-size: 14px; line-height: 24px; font-weight: normal; color: #737373; } .temp_left2{ background: transparent; padding:0; margin-top: 20px; border: none; } /*CSS TAB*/ .css_tab { width: 100%; float: left; position: relative; } .css-tab { display: none; } .css_tab li { display: inline-block; float: left; width: 100%; } .css_tab li label { padding: 10px 8px; width: 16.7%; background: #f9962f; font-family: 'Oswald', sans-serif; text-align: center; font-size: 16px; font-weight: 400; color: #FFF; position: absolute; left: 0; top: 0px; float: left; cursor: pointer; border-radius: 8px 8px 0 0; } .css_tab li:nth-child(1) label { left: 15px; } .css_tab li:nth-child(2) label { left: 19.2%; } .css_tab li:nth-child(3) label { left: 36.4%; } .css_tab li:nth-child(4) label { left: 53.6%; } .css_tab li:nth-child(5) label { left: 70.8%; } .css-tab:checked + .tab-label { background: #b75d00; } .tab-label:hover { background: #b75d00; } #tab1:checked ~ #tab-content1, #tab2:checked ~ #tab-content2, #tab3:checked ~ #tab-content3, #tab4:checked ~ #tab-content4, #tab5:checked ~ #tab-content5 { display: block; } .tab-content { width: 100%; float: left; margin-top: 44px; padding: 15px 20px; border: solid 1px #e7e7e7; background: #fff; display: none; text-align: left; min-height: 150px; border-radius: 8px; } .tab-content p{ font-size: 14px; line-height: 24px; font-weight: normal; color: #737373; } .tab-content .temp_lest{ margin: 15px 0; } .template_right{ width: 23%; float: right; border-radius: 8px; } .ftr_box{ width: 100%; float: left; text-align: center; background: #fff; border: solid 1px #e7e7e7; border-radius: 8px; padding: 12px; margin-bottom: 20px; position: relative; } .ftr_box:after{ content: url('https://i.imgur.com/JbYDaTt.png'); position: absolute; left: -21px; bottom: -26px; } .contact_box{ width: 100%; float: left; background: #fff; border-radius: 10px; text-align: center; position: relative; } .contact_box:after{ content: url('https://i.imgur.com/JbYDaTt.png'); position: absolute; left: -21px; bottom: -26px; } .contact_box h2{ margin-bottom: 0; border-radius: 10px 10px 0px 0px; } .contant_det{ width: 100%; float: left; border: solid 1px #e7e7e7; border-top: none; padding: 10px; } .contant_det p{ font-size: 13px; line-height: 20px; font-weight: normal; color: #777; font-style: italic; } .contant_det p b{ display: block; font-weight: bold; } .feedback{ width: 100%; float: left; background: #fff; border: solid 1px #e7e7e7; padding: 25px; margin-top: 20px; border-radius: 8px; } .feedback img{ float: left; margin-right: 30px; } .feedback p{ font-style: italic; } .footer{ width: 100%; float: left; text-align: center; padding: 30px 0; } .footer p{ font-style: italic; } @media (max-width:980px){ .header{margin: 10px 0;} .template_left{width: 100%;margin-bottom: 20px;} .template_right{width: 100%;} .ftr_box{margin-bottom: 10px;} } @media (max-width:800px){ .css_tab li label { margin-left: 0 !important; padding: 10px 15px; width: 100% !important; position: static; background: #f9962f url(https://i.imgur.com/B5dctUv.png) right center no-repeat;text-align: left; border: none; } .css_tab li{ margin-bottom: 1px; } .tab-content { margin-top: 0px; min-height: 0; } .css_tab li label:hover{ background: #b75d00 url(https://i.imgur.com/B5dctUv.png) right center no-repeat; border: none; } .css-tab:checked + .tab-label{ border-bottom: 1px solid #ddd; background: #b75d00 url(https://i.imgur.com/vP5LKfH.png) right center no-repeat; } .tab-content,.css_tab li label{border-radius: 0;} } @media (max-width:600px){ .thumbnails .content2,.white-box{height: 340px;} .gallery_list{margin: 10px 0;} .header{padding: 15px 0;} .feedback{text-align: center;} .feedback img{float: none;} } @media (max-width:480px){ .thumbnails li{width: 80px;height: 80px;} .thumbnails .content2, .white-box {height: 300px;} }