/* Importation scripts css */
@import url("font-awesome.css");

html, body { min-height: 100%; }
/*
body { padding-top: 120px } a utiliser pour nav bar fixed */
.clear { clear: both; }

ol, ul { list-style: none; }

/**/
.navbar { padding-top: 15px; padding-bottom: 15px; transition: all 0.5s; }
.navbar-brand { font-size: 22px }
.navbar-nav>li>a { font-family: 'Open Sans Condensed', sans-serif; font-size: 22px  }
.navbar-right>li>a { font-size: 20px }
.navbar.compressed { padding-top: 2px; padding-bottom: 2px; } 

.back-top { position: fixed; bottom: 30px; right: 6%; cursor: pointer; z-index: 9999; font-size: 2rem  }
a.back-top { float: right; margin: -10px 0 0 0; }

.fb-page, 
.fb-page span, 
.fb-page span iframe[style] { 
    width: 100% !important; 
}

.affix { top: 0; width: 100%; z-index: 9999 !important; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
.affix-top { position: static; top: -35px; z-index: 9999 !important }

/* Yamm Nav-bar */
.yamm .nav, .yamm .collapse, .yamm .dropup, .yamm .dropdown { position: static; }
.yamm .container { position: relative; }
.yamm .dropdown-menu { left: auto; }
.yamm .yamm-content { padding: 20px 30px; }
.yamm .dropdown.yamm-fw .dropdown-menu { left: 0; right: 0; }

/* nav-bar right */
.well { padding-top: 15px }
.well h3 { margin-top: 10.5px }

@media screen and (max-width: 767px) {
	h1 { font-size: 28px }
	h2 { font-size: 26px }
	h3 { font-size: 24px }
	.withsb { margin-bottom: 25px }
	.col-half-width { width: 100% }
	.navbar { padding-top: 8px; padding-bottom: 8px; transition: all 0.5s; }
	.yamm .dropdown { border-bottom: solid 1px #E1E1E1; font-size: 22px; text-align: center; text-transform: uppercase; }
}

.mbr-carousel-overlay-full .carousel-overlay-overlay { min-height: 100vh; }
.carousel-overlay { content: ''; background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(0,0,0,.4)); bottom: 0; left: 0; /*opacity: 0.7;*/ position: absolute; right: 0; top: 0; /*z-index: 1;*/ }
.carousel-overlay ~ * { z-index: 2; }
.carousel-inner img { width: 100%; height: 100%; }

/* Formulaire */
#contactForm .message{ display: none; }
#contactForm .load, #loginForm .load, #registerForm .load{ display: none; margin-left: 20px; }
img.load { position: relative; top: -35px; width: 20px }
.collapse .form-control, input { border-width: 1px; border-radius: 0  }
.form-control, input { border-width: 1px; border-radius: 2px }
.has-error .form-control, .has-error .form-control:focus { border: 1px solid #e74c3c; }

@media (min-width: 768px){
	h1 { font-size: 2.5em; margin-bottom: 30px}
	.col-half-width { width: 50% }
}

/* Formulaire multi-step */
#regForm { margin: 100px auto; font-family: Raleway; padding: 40px; width: 70%;min-width: 300px; border: solid 1px #ccc; }
#regForm input, #regForm select { padding: 10px; width: 100%; font-size: 17px; font-family: Raleway; border: 1px solid #aaaaaa; }
#regForm input.invalid { background-color: #ffdddd; }
#regForm button { background-color: #4CAF50; color: #ffffff; border: none; padding: 10px 20px; font-size:  17px; font-family: Raleway; cursor: pointer; }

#dispicture { display: flex; height: 30vh; }
#dispicture img { margin: auto; }

.tab { display: none; }
#prevBtn { background-color: #bbbbbb; }
.step { height: 15px; width: 15px; margin: 0 2px; background-color: #bbbbbb; border: none;   border-radius: 50%; display: inline-block; opacity: 0.5; }
.step.active { opacity: 1; }
.step.finish { background-color: #4CAF50; }


/*  Grilles */
.grid-aside { padding: 10px 30px; background-color:#eee;}
.cont-aside { padding: 10px 30px; background-color:#eee; text-align:center}
.cont-aside h3 { margin:0;padding:8px}


.bg-color1, .bg-color1 .ctn-blog-cat-txt { background: #fff; }
.bg-color2, .bg-color2 .ctn-blog-cat-txt { background: #f6f6f6; }
.top-section-home { padding-bottom: 20px; }

.main-section { padding-bottom: 50px; }
.form-section { padding: 50px 0 80px; }
.last-section { padding:30px 0; position:relative; overflow:hidden; background:#6F8D8A; }
.last-section:before{content:"";position:absolute; width:110%; height:100%;  background:url("../img/bg-cible.jpg") no-repeat 0 0; background-size:cover; filter: blur(3px); z-index:0; transform: scale(1.5);-ms-transform: scale(1.5); -webkit-transform: scale(1.5);}


.post-date{ background:#f4f4f4; padding:4px; margin:3px 0; display:block; }
.post-thumb{ width:100%; }
.post-body img { width: 95%; /*float: left; pour texte autour img */ margin: 0 15px 15px 0 }
.pagination-links{ margin:30px 0; }
.pagination-links strong{ padding: 8px 13px; margin:5px; background: #f4f4f4; border: 1px #ccc solid; }
a.pagination-link{ padding: 8px 13px; margin:5px; background: #f4f4f4; border: 1px #ccc solid; }
.cat-delete{ display:inline; }

/* Blog content */
.container.blog h2 { margin-bottom: 30px; text-align: center; color: #18bc9c }
.container.blog h3 { font-size: 22px }
.ctn-top-blogs { padding-bottom: 20px; }
.top-blogs-item { padding-bottom: 15px; color: #333; }
.ctn-top-post-img { display: block; margin-top: 10px; min-height: 220px; line-height: 167px;    background-color: #e6e6e6; text-align: center; }
.ctn-top-blogs-num { float: left; width: 30px; padding-right: 5px; }
.top-blogs-num { color: #18bc9c; text-align: right; font-size: 17px; font-weight: bold; }
.top-blogs-name { float: left; width: 250px; }
.top-blogs-name a { font-size: 17px; color: #333;  }
.ctn-blog-cat { text-transform: uppercase; padding: 5px 0 0 30px; position: relative; }
.ctn-blog-cat-txt { padding: 0 5px; position: absolute; top: 0; left: 38px; font-size: 12px; font-weight: 300; color: #686868; }
.ctn-blog-cat.divers .blog-cat-label, #categorie-nav.divers li a:hover, #categorie-nav.divers li.current a, .divers { color: #18bc9c; }

.ctn-blog-cat-txt { background: #f6f6f6; }
.bg-blog-cat { height: 8px; background: #E6E6E6; }
.ctn-blog-cat.divers .square, .submenu .submenu-cat-parent.divers::before, #categorie-nav.divers {
    background: #18bc9c; }
.square { width: 8px; height: 8px; background: #333; position: absolute; top: 5px; }

/* === TABLES
---------------------- === */
@media screen and (max-width: 767px) {
	.doctechtbl, .refclitbl { overflow-x: auto; }
	table, tbody, th, tr, td { display: block; width: auto!important; }
	table td:before { content: attr(data-label); float: left; font-weight: bold; }
	table td:last-child { border-bottom: 0; }
	table thead { display: none; }
}

.doctechtbl tr:nth-child(even) {background-color: #f2f2f2;}
.doctechtbl th, .doctechtbl td, .refclitbl th, .refclitbl tb { padding: 8px }

/* === MODAL 
--------------------- === */
.alert, .alert-danger { border-radius: 0 }

.widget ul { padding-left: 5px; }
.widget ul > li a i { margin-right: 5px; }
.widget h4.footer-widget-title { border-bottom: 1px solid #9a9a9a;  padding-bottom: 10px; margin-bottom: 20px; }
.socialinks { background: #f4f4f4; padding: 5px; margin: 5px 0; display: block; }
.social-inline { list-style: none; margin-bottom: 0; padding-left: 20px }
.social-inline > li { display: inline-block; margin-right: 15px; line-height: 1.2em}
.fb-share-button { position:relative; top:-3px; }

@media screen and (max-width: 767px) {
	.container.blog h2 { font-size: 26px }
	.post-body { text-align: justify; }
	.post-body img { width: 100%; float: none; margin: 0 0 15px 0 }
	.social-inline { padding: 0 }
}

@media screen and (min-width: 768px) and (max-width: 991px) {

}

@media screen and (min-width: 992px) and (max-width: 1199px) {

}

@media screen and (min-width: 1200px) {
	.container .body { min-height: 200px }
}

/*  Preloader  */

#preloader { width: 100%; height: 100%; 	position: fixed; top: 0; left: 0; z-index: 9999999; background: #fff; }
.sk-circle { width: 80px; height: 80px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
.sk-circle .sk-child { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.sk-circle .sk-child:before { content: ''; display: block; margin: 0 auto; width: 15%; height: 15%; background-color: #2fadb9; border-radius: 100%; -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both; animation: sk-circleBounceDelay 1.2s infinite ease-in-out both; }
.sk-circle .sk-circle2 { -webkit-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); }
.sk-circle .sk-circle3 { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
.sk-circle .sk-circle4 { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.sk-circle .sk-circle5 { -webkit-transform: rotate(120deg); -ms-transform: rotate(120deg); transform: rotate(120deg); }
.sk-circle .sk-circle6 { -webkit-transform: rotate(150deg); -ms-transform: rotate(150deg); transform: rotate(150deg); }
.sk-circle .sk-circle7 { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
.sk-circle .sk-circle8 { -webkit-transform: rotate(210deg); -ms-transform: rotate(210deg); transform: rotate(210deg); }
.sk-circle .sk-circle9 { -webkit-transform: rotate(240deg); -ms-transform: rotate(240deg); transform: rotate(240deg); }
.sk-circle .sk-circle10 { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }
.sk-circle .sk-circle11 { -webkit-transform: rotate(300deg); -ms-transform: rotate(300deg); transform: rotate(300deg); }
.sk-circle .sk-circle12 { -webkit-transform: rotate(330deg); -ms-transform: rotate(330deg); transform: rotate(330deg); }
.sk-circle .sk-circle2:before { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
.sk-circle .sk-circle3:before { -webkit-animation-delay: -1s; animation-delay: -1s; }
.sk-circle .sk-circle4:before { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.sk-circle .sk-circle5:before { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
.sk-circle .sk-circle6:before { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }
.sk-circle .sk-circle7:before { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }
.sk-circle .sk-circle8:before { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }
.sk-circle .sk-circle9:before { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }
.sk-circle .sk-circle10:before { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }
.sk-circle .sk-circle11:before { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; }
.sk-circle .sk-circle12:before { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; }
@-webkit-keyframes sk-circleBounceDelay {
	0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); }
	40% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes sk-circleBounceDelay {
	0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); }
	40% { -webkit-transform: scale(1); transform: scale(1); }
}

/* === FOOTER 
--------------------- === */
footer { background: #818181; color: #ffffff; padding: 30px; }
.site-footer { padding: 30px 0; box-shadow: 0 -2px 0 rgba(0,0,0,.07); }
.site-footer-bottom { background-color: #333; padding: 20px 0; color: #eeeeee; }
.site-footer-bottom .copyrights-col-left { font-size: 13px; padding-top: 8px }
.site-footer-bottom .copyrights-links { font-family: 'Open Sans Condensed', sans-serif; font-size: 15px; text-align: right; padding-top: 5px  }
.site-footer-bottom .copyrights-links a { margin: 0 10px }
.site-footer-bottom .social-icons, .site-header .social-icons { text-align: right; }
.site-footer-bottom .social-icons a, .site-header .social-icons a { color: #ffffff; background: #999999;  border-radius: 50%; width: 25px; height: 25px; text-align: center; display: inline-block; margin: 0 0 0 8px; text-decoration: none; }
.site-footer-bottom .social-icons a:hover, .site-header .social-icons a:hover { background: #666666; }

@media screen and (max-width: 767px) {
	.site-footer-bottom .social-icons, .site-header .social-icons { text-align: center; }
	.site-footer-bottom .copyrights-links { text-align: center; padding-bottom:10px}
}