/* ---------- overall aspect ---------- */
* {
	outline: none;
}

html, body {  
	height: 100%;
}

body {
	background-color: #fff;	
	font-family: 'open sans', sans-serif;
	font-size: 13px;
	color: #8c8c8c;
	line-height: 1.6;	
}

/* ---------- links ----------  */
a {
	word-wrap: break-word;
	color: #e6e6e6;
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
		-moz-transition: color 0.1s ease-in, background 0.1s ease-in;
			-ms-transition: color 0.1s ease-in, background 0.1s ease-in;
				-o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a:hover, a:focus {
    color: #f57e2f; /* 000 */
    text-decoration: none;
    outline: 0;
} 

a:before, a:after {	
	color: #005fa6; /* 000 */
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
		-moz-transition: color 0.1s ease-in, background 0.1s ease-in;
			-ms-transition: color 0.1s ease-in, background 0.1s ease-in;
				-o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;	
}


/* ----------  titles font ---------- */
h1, h2, h3, h4, h5, h6 {
	font-family: 'open sans', sans-serif;
}

/* ----- titles size ----- */
h1 {
    font-size: 30px;
	padding-top: 20px;    
	padding-bottom: 20px;    
}

h2 {
    font-size: 26px;
	padding-top: 20px;    
	padding-bottom: 20px;    
}

h3 {
    font-size: 22px;
	padding-top: 8px;    
	padding-bottom: 8px;    
}

h4 {
    font-size: 18px;
	line-height: 1.5;	
	padding-top: 8px;    
	padding-bottom: 20px;    
}
 
.h4 {   
	font-size: 16px;
	font-weight: 300;
	color: #841025;	    
}

h5 {
    font-size: 15px;
	line-height: 1.5;	
	padding-top: 8px;    
	padding-bottom: 20px;    
}

/* ---------- paragraph & typography ---------- */
p, ul, ol {
	font-family: 'roboto', sans-serif;
    font-weight: 300; 
}

p {	
	font-size: 16px;	
	line-height: 28px;
	margin-bottom: 15px;	
}

.b {	
	color: #005fa6;		
}

ul li {
	font-size: 16px;
}

.ul li {
	font-size: 16px;
	line-height: 35px;
	list-style-type: square;		
}

ul.list {
	font-size: 16px;
	line-height: 1.5;
	list-style-type: square;		
}

ol li {
	font-size: 16px;
	padding-bottom: 8px;	
} 

.ol li {
	font-size: 14px;
	padding-bottom: 10px;	
}
 
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
  
 
/* ---------- les class ---------- */
.centered {
    text-align: center;
}

.font {
	font-size: 15px;	
}

.color {
    color: #fff;
}

.color-contact {
	background: transparent !important;	
    color: #f85c37;
}

.backgrndicon {
	background: transparent !important;	   
}

.background {
	background: #fff !important;
	color: #000 !important;
	border-bottom: 1px solid #ccc !important;
}

.background-container {
	background: #fff;	
}

.erreur {
	font-size: 16px;
	color: #841025;
}

.complement {
	display: none; 
}

.space li {
	padding-bottom: 15px;	
}

.bottom {
	padding-bottom: 80px;	
}

.padding-bottom  {
	padding-bottom: 0px;	
}

.lineheight{
	line-height: 35px;
}
	
/* ---------- cacher le text indent des fonts ---------- */
@media(max-width:991px) {
.leftcolumn li, .rightcolumn li, .colleft li, .colright li {
	font-size: 13px;
	text-indent: 0px !important;
    }
}

@media(max-width:767px) {
.leftcolumn li, .rightcolumn li, .colleft li, .colright li {
	font-size: 13px;
	text-indent: 0px !important;
    }
} 
 
/* a {
	color: #404040;
}
a:hover {
	color: #404040;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}
a.none:hover {
	text-decoration: none;
}
*/

/*---------- Img responsive ----------*/
.img-responsive {
	display: block;
	max-width: 100%; 
	height: auto; 
}

/*---------- Img zoom ----------*/
.zoom {	
	width: auto;
	height: auto;
	margin: 0 auto;
	transition: transform .2s;
}

.zoom:hover {
	-ms-transform: scale(1.5); /* IE 9 */
		-webkit-transform: scale(1.5); /* Safari 3-8 */
	transform: scale(1.5);
	-webkit-box-shadow: 3px 3px 35px 0px rgba(0,0,0,0.35);
		-moz-box-shadow: 3px 3px 35px 0px rgba(0,0,0,0.35);
			box-shadow: 3px 3px 35px 0px rgba(0,0,0,0.35);
}

/*---------- header navigation ----------*/
.top {
	background-color: #fff;
	color: #000; /* #404040 */ 
	padding: 10px 0;	
}

.top h3 {	
	font-size: 18px;
	text-align: center;
	color: #005fa6;
	margin: 0;		
}

.top p {	
	margin: 0;
}

.top ul {
	text-align: center;
	margin: 0;
	margin-top: 5px;
	padding: 0;
}

.top li i {
	color: #005fa6; /* fff */
}
 
.top li a {
	color: #000;
}

.top li a:hover {
	text-decoration: none;
}

.top li a:hover,.top li a:hover i {
	color: #005fa6;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

/* ---------- modal for contact ---------- */
.modal-content {	
	border-radius: 10px;		
}

.modal-header {
	background: #f57e2f;
	border-radius: 10px 10px 0px 0px;	
}

.modal-header h4 {
	font-size: 20px;
	font-weight: 600;	
	color: #fff;
	padding: 0;
}

.modal-header .close {
	font-size: 35px;	
    color: #fff;
	margin-top: -30px;
}

.modal-body {
	font-family: 'open sans', sans-serif;
    font-weight: 300;   
	text-align: center;
    color: #000;  
}

.modal-body h4 {
	font-family: 'open sans', sans-serif;
	font-size: 20px;
    font-weight: 300;     
}

.modal-body .p {
	text-align: justify;	
}

.row i {
	color: #f57e2f;	
}

.modal-footer {
	background: #fff;
	border-radius: 0 0 80px 80px;
	margin-top: 20px;	
}

#mapwrap {	
	width: 100%;	
}

.btn {	
	cursor: pointer;
}


/* ==========================================================================
	page
	========================================================================== */
	
.page-main {
	float: left;
	width: 100%;
	background-color: #fff;
	margin-bottom: 30px;
}

.page-main a {
	font-size: 16px;
	font-weight: 600px;
	color: #404040; 
	margin-left: 0px;
	padding-bottom: 30px;	
}

.page-main a:hover {
	color: #888;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

.page-main a:hover {
	text-decoration: none;
}

.page-main ul {
	list-style-type: square;
}

.page-main img {
	float: right;
}

.page-main .imgleft {
	float: left;
}

.flex-container {
	display: flex;
	flex-wrap: nowrap;
	background-color: transparent;
}

.flex-container > div {
	background-color: transparent; 
	width: 75%;
	font-size: 16px;
	text-align: justify;
	line-height: 25px;
	margin: 10px;
	padding: 10px;  
}

.flex-container > div:first-child {
	background-color: transparent;
	border-radius: 0px;
	border-bottom: 1px solid #999;
	width: 25%;
	font-size: 16px;
	font-weight: 600;
	text-align: justify;
	line-height: 25px;
	margin: 10px;
	padding: 10px;
}

.flex-container2 {
	display: flex;
	flex-wrap: nowrap;
	background-color: transparent;
}

.flex-container2 > div {
	background-color: transparent;
	width: 10%;
	margin: 10px;
	padding: 20px;
	font-size: 10px;
}
.flex-container2 > div:first-child {	
	width: 50%;	
}

/* ==========================================================================
   sections boxes_area
   ========================================================================== */

.boxes_area {
	background-color: #f8f8f8;
	padding-top: 40px;
	padding-bottom: 10px;
	padding-left: 0;
	padding-right: 0;	
}

.boxes_area h3 {
	font-size: 16px;
	font-weight: 500;
	margin-top: 0;
	margin-bottom: 18px;
}

.box a {
	color: #fff;
}

.box a:hover {
	color: #000;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

.box a.none:hover {
	text-decoration: none;
}

.box {
	position: relative;
}

.box h3 {
	position: relative;
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.box i {	
	position: absolute;
	font-size: 45px;
	color: #005fa6; 
	top: 0;	
	right: 0;	
	margin: 0;	
}

@media (min-width:769px) {
    .boxes_area div[class*="col-"]:after {
		display: block;
		position: absolute;
		background-color: #ebebeb;
		width: 1px;
		height: 100%;		
		content: " ";		
		top: 0;
		right: 0;		
	}
    .boxes_area div[class*="col-"]:last-child:after {
		display: none;
	}    
}

/* ==========================================================================
	breadcrumb 
  ========================================================================== */
  
.bread_area {
	background: #fff;	
	border-bottom: 1px solid #e7e7e7; 
	margin-bottom: 50px;
	padding: 20px 0;	
}

.breadcrumb {
	background: #fff;
	margin: 0;	
	padding: 0;
}

.breadcrumb a {
	color: #f57e2f;
}

.breadcrumb a:hover {
	color: #555;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

/* ==========================================================================
    sections services
   ========================================================================== */

.services {
	padding-top: 50px;
	padding-bottom: 50px;
}

h2.section-title {
	text-align: center;
	color: #404040;
}

.services p.desc {	
	font-size: 16px;
	font-variant: small-caps;
	text-align: center;
	color: #555;	
	margin-bottom: 20px;
}

.services .media {
	margin-top: 30px;
}

.services .media i {
	font-size: 45px;
	color: #005fa6;
}

.services .media h4 {
	font-size: 15px;
	font-weight: 600;
	color: #404040;
}

.services .media p {
	text-align: left;
}

/* ==========================================================================
    section news
   ========================================================================== */

.news_content h2:after, .box h3:after {
	position: absolute;
	background-color: #005fa6;
	width: 30px;
	height: 2px;
	bottom: 0;
	left: 0;	
	content: '';
}
 
.news-area {
	padding-bottom: 50px;
} 

.news-area a {
	font-size: 16px;
	color: #bbb;
} 

.news-area a:hover {	
	color: #aaa;
} 

.news_content h2 {
	position: relative;
	font-size: 17px;
	font-weight: 600;
	color: #404040;
	margin-bottom: 30px;
	padding-bottom: 20px; 	
}

.news_list h3 {
	font-size: 17px;
	font-weight: 500;
	color: #404040;
	margin-top: 10px;
	margin-bottom: 10px;	
}

.news_list h4 {
	font-size: 16px;
	font-weight: 600;
	color: #404040;
	margin-top: 10px;
	margin-bottom: 10px;	
}

.news_list p {
	color: #8c8c8c
}

.news_list a {	
	color: #bbb;
}

.news_list a:hover {
	color: #404040;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

.news_list a.none:hover {
	text-decoration: none;
}

.news_list a.btn {
	font-size: 13px;
	color: #005fa6;
	padding: 0;	
}

.news_list ul {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;	
}

.news_list ul li {
	list-style: none;
}

.news_list .thumbnail {
	border: none;
	padding: 0;
}

.thumbnail .caption {	
	color: #404040; /* 404040 */
	padding: 9px;
	padding-right: 0;
	padding-left: 0;	
}


/* ==========================================================================
    section cafe/resto
   ========================================================================== */

.home_content h2:after, .box h3:after {
	position: absolute;
	background-color: #005fa6;
	width: 30px;
	height: 2px;
	bottom: 0;
	left: 0;	
	content: '';
}
 
.home-area {
	background-color: #ebebeb;
	padding-bottom: 50px;
}

.home_content h2 {
	position: relative;
	font-size: 17px;
	font-weight: 600;
	color: #404040;
	margin-bottom: 30px;
	padding-bottom: 20px; 	
}

.home_list h3 {
	font-size: 16px;
	font-weight: 600;
	color: #404040;
	margin-top: 10px;
	margin-bottom: 10px;	
}

.home_list p {
	color: #8c8c8c
}

.home_list a {
	color: #bbb;
}

.home_list a:hover {
	color: #404040;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
}

.home_list a.none:hover {
	text-decoration: none;
}

.home_list a.btn {
	font-size: 13px;
	color: #005fa6;
	padding: 0;	
}

.home_list ul {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;	
}

.home_list ul li {
	list-style: none;
}

.home_list .thumbnail {
	border: none;
	padding: 0;
}

.thumbnail .caption {	
	color: #404040; /* 404040 */
	padding: 9px;
	padding-right: 0;
	padding-left: 0;	
}

.home_bottom .row {
	margin-right: -5px;
	margin-left: -5px;	
}

.home_bottom div[class*="col-"] {
	position: relative;
	padding-right: 5px;
	padding-left: 5px;	
}


/* ==========================================================================
    section caroussel / @media
   ========================================================================== */
.carousel-control{ 
	width:  4%; 
}
.carousel-control.left,.carousel-control.right {
	background-image:none;
	margin-left: 0;	
}

@media (max-width: 767px) {
	.carousel-inner .active.left {
			left: -100%;
		}
		.carousel-inner .next {
			left: 100%;
		}
		.carousel-inner .prev {
			left: -100%;
		}
		.active > div {
			display:none;
		}
		.active > div:first-child {
			display:block;
		}
	}
	
@media (min-width: 767px) and (max-width: 992px ) {
	.carousel-inner .active.left {
		left: -50%;
		}
		.carousel-inner .next {
			left:  50%;
		}
		.carousel-inner .prev {
			left: -50%;
		}
		.active > div {
				display:none;
		}
		.active > div:first-child {
			display:block;
		}
		.active > div:first-child + div {
			display:block;
		}
	}
@media (min-width: 992px ) {
	.carousel-inner .active.left {
			left: -25%;
		}
		.carousel-inner .next {
			left: 25%;
		}
		.carousel-inner .prev {
			left: -25%;
		}
	}
	
/* ==========================================================================
    section maillist
   ========================================================================== */
.login-form-1 {
	display: inline-block;	
	max-width: 300px;
	border: solid 1px #ddd;
	border-radius: 5px;
}

.main-login-form {
	position: relative;
}
.login-form-1 .form-control {
	background: transparent;
	height: auto;	
	border: 0;
	border-radius: 0;
	box-shadow: 0 0 0;
	font-weight: 500;	
	color: #000;
	padding: 7px 0; 	
}

.login-form-1 .form-control::-webkit-input-placeholder {
	color: #c6c6c6;
}

.login-form-1 .form-control:-moz-placeholder, 
.login-form-1 .form-control::-moz-placeholder, 
.login-form-1 .form-control:-ms-input-placeholder {
	color: #c6c6c6;
}

.login-form-1 .form-group {
	position: relative;
	border-bottom: 2px solid #d6d6d6;
	margin-bottom: 0;	
	padding-right: 20px;	
}

.login-form-1 .form-group:last-child {
	border-bottom: 0;
}

.login-group {
	background: #fff;
	border-radius: 8px;
	color: #999;	
	padding: 10px 20px;
}
.login-group-checkbox {
	padding: 5px 0;
}

.login-form-1 .login-button {
	position: absolute;
	background: #fff;
	width: 50px;
	height: 50px;
	border: 2px solid #d6d6d6;
	border-radius: 50%;
	color: #999;	
	top: 50%;
	right: -25px;
	margin-top: -25px;	
	padding: 11px 0;
	transition: all ease-in-out 500ms;
}

.login-form-1 .login-button:hover {
	color: #555;
	transform: rotate(450deg);
}

.login-form-1 .login-button.clicked {
	color: #555;
}

.login-form-1 .login-button.clicked:hover {
	transform: none;
}

.login-form-1 .login-button.clicked.success {
	color: #2ecc71;
}

.login-form-1 .login-button.clicked.error {
	color: #e74c3c;
}	

/* ==========================================================================
    section categorie page du blog
   ========================================================================== */
.category-main {
	float: left;
	width: 100%;
	background-color: #fff;
	margin-bottom: 30px;
}

.category-content h3 {
	font-size: 20px;
	margin-bottom: 0;
}

.category-content h4 {
	font-size: 18px;
	margin-bottom: 0;
}

.category-main .media {
	margin-top: 30px;
}

.category-main .media:first-child {
	margin-top: 0;
}

.category-main ul li {
	position: relative;
	list-style: none;	
}
.category-main .media-left {
	float: left;
	padding-right: 20px;
}

.category-main .meta {
	/* position: absolute; */ 
	width: 75%;
	min-height: 30px;
	line-height: 24px;	
	bottom: 0px;
	border-bottom: 2px solid #e7e7e7;	
	margin-bottom: 40px;
	padding-bottom: 3px;
}

.category-main .category-meta {
	width: 100%;
}

.category-main .meta .arc-comment {
	float: left; 
	border-right: 2px solid #e7e7e7;
	margin-right: 5px; 	
	padding-right: 7px;
}

.category-main .meta .arc-comment a, .archive ul.arc-share li a {
	font-size: 14px;
	color: #333;	
}

.category-main .meta .arc-comment a:hover, .archive ul.arc-share li a:hover {
	text-decoration: none;
	color: #f57e2f;
}

.category-main .meta .arc-date  {
	float: right;
	font-size: 14px;
	color: #333;
}

.category-main ul.arc-share {
	float: left;
	margin: 0;
	margin-right: 5px;
	padding: 0;	
}

.category-main ul.arc-share li {
	float: left;
	list-style: none;
	margin-left: 10px;
}

.category-main .archive-cat a {
	color: #f57e2f;
}

.category-main .archive-cat a:hover {
	text-decoration: none;
	color: #333; 
}
 
	
/* ==========================================================================
	section widget/sidebar
   ========================================================================== */

.widget {
	margin-bottom: 30px;
}

.widget h4, h2.page-title, h2.category-title {
	position: relative;
	width: 100%;
	font-size: 20px;
	font-weight: 700;
	color: #404040;	
	margin-top: 0;
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.widget h4:after, h2.page-title:after, h2.category-title:after {
	position: absolute;
	background-color: #005fa6;
	width: 30px;	
	height: 2px;
	bottom: 0;
	left: 0;	
	content: '';	
}

.widget h4 {
	font-size: 15px;
	margin-left: 15px;
}

.widget p {	
	font-size: 14px;
	line-height: 20px;
	margin-bottom: 10px;
	padding: 10px;	
}

.widget .blockquote-footer {	
	font-size: 13px;
	line-height: 1.5px;
	margin: 0px;
	padding: 10px;	
}

.sidebar ul {
	margin: 0;
	padding-right: 15px;
	padding-left: 15px;	
}

.sidebar ul li {
	list-style: none;
}

.sidebar ul li a {
	display: block;	
	color: #404040;
	margin-right: -15px;
	margin-left: -15px;
	padding: 3px 15px;	
}

.sidebar li.current a {
	background-color: #005fa6;
	border-radius: 4px;
	color: #fff;
	margin-left: -15px;
	margin-right: -15px;	
}

.sidebar ul li a:hover {
	background-color: #005fa6;
	border-radius: 4px;
	color: #fff;
	text-decoration: none;
	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: linear;
}


/* ==========================================================================
	section table
   ========================================================================== */
   
table {
	width: 100%;	
}

table a {
	font-weight: 500;		
	color: #555;	
}

th {
	background: #ebebeb;
	font-size: 17px;	
	text-align: justify;
	color: #000;
	padding: 10px;	 
}

td {
	background: #fff;	
	border-right: 1px solid #d6d6d6;
	text-align: left;
	padding: 6px;	
	padding-top: 15px;	
	padding-bottom: 15px;	
}

td:last-child {
	border-right: 0px solid #d6d6d6;	
}

.noborder{
	border-right: 0px solid #d6d6d6;	
}

.leftco {
	width: 10%;
}

.leftco2 {
	width: 30%;
}

.leftco3 {
	width: 30%;
}

.leftco_epice {
	width: 30%;
}

.leftco2 {
	width: 30%;
}

.leftco3 {
	width: 30%;
}

.col1 {
	width: 12%;
}
.col2 {
	width: 10%;
}
.col3 {
	width: 10%;
}
 
/* ==========================================================================
	section prefooter 
   ========================================================================== */
   
.prefooter {
	background: #f57e2f;
	padding-top: 35px;
	padding-bottom: 35px;	
}

.prefooter h4 {
	font-weight: 700;	
	color: #fff;	
}

.prefooter p {
	text-align: justify;
	color: #fff;
	line-height: 20px;
}

.prefooter ul li {
	color: #fff;
	line-height: 30px;
	list-style: none;
	border: none;
}
  

/* ==========================================================================
   section footer 
   ========================================================================== */
.footer {
	float: left;
	background: #ebebeb;
	width: 100%;	
	padding: 20px 0 0;	
}

.footer h4 {
	font-size: 17px;
	font-weight: 500;
	margin-top: 20px;
	margin-bottom: -10px;
}

.footer p {
	font-size: 13px;
}

.footer p a {
	color: #666;
}

p.text {
	color: #666;
}

.footer ul {	
	list-style: none;
	margin-bottom: 20px;
	padding-left: 0;	
}

.footer ul a {
	font-size: 13px;
	color: #666;	
}

.footer li a:hover {
	color: #000;
}

.footer i {
	font-size: 18px;
}

/* ==========================================================================
   section copyright 
   ========================================================================== */

#copyright {
	background: #404040;
	font-size: 13px;	
	color: #ccc;
	margin-top: 20px 0;	
	padding: 20px 0;	
}

#copyright p, #copyright ul {	
	/* float: left; */
	font-size: 13px;
	margin: auto;
	width: 65%;	
}

#copyright a {
	font-size: 13px;
	color: #fff;	
}

#copyright a:hover {	
	color: #f57e2f;	
}

ul.big li {
	float: left;
	width: 100%;
}

/* ul.big li:nth-child(2n) {
	margin-left: 2%;
}*/

@media (max-width:462px) {
	.fbox:last-child {
		float: left;
		width: 100%;		
		margin-top: 20px;		
	}
}








/* responsive */
@media screen and (max-width:462px) {
    .top {text-align: center;}.top ul.list-inline{float: none !important;text-align: center;}
    .hero_content {padding: 80px 0;}
    .hero_content h1 {font-size: 32px;}
    .hero_content h2 {width: 90%;font-size: 21px;}
    /*.boxes_area .row {margin-left: -20px;margin-right: -20px;}*/
    .boxes_area .box p {margin-bottom: 30px;}
    .services .media .media-left {padding-right: 15px;}
    
    .category-content .media-body {float: left;position: relative;width: 100%;}
    .category-content .media-body h3 {margin-top: 20px;}
    .category-main .meta {position: relative;width: 100%;}
    .category-main .meta .pull-left {margin-left: 40px;}
    .category-main .meta .pull-right {display: none;}
    
    .sidebar {margin-top: 40px;}
}
@media (min-width:463px) and (max-width:768px) {
    .fbox {float: left;}
    .fbox:nth-child(3) {float: right !important;}
}

