@charset "utf-8";
@import url("fontawesome-4.3.0.min.css");
@import url("custom.flexslider.css");
@import url("framework.css");

/* Rows
--------------------------------------------------------------------------------------------------------------- */
.row0, .row0 a{}
.row1, .row1 a{}
.row3, .row3 a{}
.row4, .row4 a{}
.row5, .row5 ul li a{ color:#BEBEBE; }
.row5, .row5 ul li a:hover{color:#FFF; text-decoration:none;}
.row6, .row6 a{}


/* Header
--------------------------------------------------------------------------------------------------------------- */
#header{padding:5px 0;}
#header #logo{float: left; width: 19%; height: 100%;}
#header #logo img{ width:220%;
}
#header #slogan{width:22%; height:100%; float: left; margin: 0 19%;
}
#header #slogan p{text-align:center;}
#header #slogan img{width:100%; height:100%;}
#header .socialNetwork{float:right; width:200px; height:100%; line-height:45px; }
#header .socialNetwork ul{float:right;}
#header .socialNetwork li{margin:0; padding:0; display:inline; text-decoration:none; }
#header .socialNetwork li:last-child{margin-right:0;}
#header .socialNetwork ul li a:hover{opacity:0.7;}
#header, #mainav{width:100%;}
.wrapper .flexslider ul .slides{width:100%; height:250px;}
.wrapper .flexslider ul.slides li img{width:100%; height:650px;}


/* Content Area
--------------------------------------------------------------------------------------------------------------- */
.container{padding:30px 0; max-width:978px; }

/* Content */
.container .content{}
.container li{transition: all .2s ease-in-out; background:white; margin:10px; height: 454px;}

.container h2{font-size:26px; font-family:tahoma; color:#2a70e8; text-align:center;}
.container img{width:213px; height:280px; }
.container h4{font-size:16px; font-family:tahoma; color:#2a70e8; text-align:center;}
.container p{text-align:center; color:#333;}

/* Latest
--------------------------------------------------------------------------------------------------------------- */
#latest{margin:auto; max-width: 978px; height:250px;/*max-width:2000px;*/ }
#latest .three_quarter {float:left; height:100%; width:70%;}

#latest article{padding:20px 0; }
#latest article h1{font-size:30px; font-family:tahoma; color:#2a70e8; }
#latest article p{font-size:14px; font-family:tahoma; text-align: justify; color:#333;}
#latest article button{float:right; background:#2a70e8; color:#fff; border:none;  font-size:10px;}
#latest article button:hover{background:#fff; color:#2a70e8; border:1px solid #2a70e8;}
#latest .one_quarter{ float:right; width: 25%; height: 100%; border-left: 2px solid #fff; padding:20px 0 0 20px;}
#latest .one_quarter h1{font-size:26px; font-family:tahoma; color:#2a70e8; margin-bottom: 10px;}
#latest .one_quarter ul{padding:0; margin:0;}
#latest .one_quarter ul li{ list-style-type:none; font-size:14px;}
#latest .one_quarter ul li a{ color:#333; text-decoration: underline; }
#latest .one_quarter ul li a:hover{ color:#2a70e8;}


/* Footer
--------------------------------------------------------------------------------------------------------------- */
#footer{padding:30px 0px 0px;}

#footer h1{margin:0 0 25px 0; padding:0 0 8px 0; font-size:18px; text-transform:uppercase;}
#footer ul li{margin:0 0 5px 0 ; font-family:tahoma; font-size:12px;}
#footer ul li:last-child{margin-bottom:0;}
#footer .socialNetwork ul {float:left; padding:0; margin:0;}
#footer .socialNetwork ul li{float:left; padding:0 5px 0 0; margin:0; display:inline; text-decoration:none; }
#footer .socialNetwork li:first-child{margin-left:0;}
#footer .socialNetwork ul li a:hover{opacity:0.7;}
.row5 p{text-align:center; color:#777; font-size:11px; margin:0; padding:5px 0;}


/* Navigation
--------------------------------------------------------------------------------------------------------------- */
nav ul, nav ol{margin:0; padding:0; list-style:none;}

#mainav, .sidebar nav{line-height:normal;}
#mainav .drop::after, #mainav li li .drop::after, .sidebar nav a::after{position:absolute; font-family:"FontAwesome"; font-size:10px; line-height:10px;}

/* Top Navigation */
#mainav{border-bottom:3px solid;}
#mainav ul{text-transform:uppercase;}
#mainav ul ul{z-index:9999; position:absolute; width:110px; text-transform:none;}
#mainav ul ul ul{left:90px; top:0;}
#mainav li{display:inline-block; position:relative; float:left; margin:0; padding:0; font-size:14px;}
#mainav li:last-child{margin-right:0;}
#mainav li li{width:130%; margin:0;}
#mainav li a{display:block; padding:15px 23px;}
#mainav li li a{border:solid; border-width:0 0 1px 0;}
#mainav .drop{}
#mainav li li a, #mainav li li .drop{display:block; margin:0; padding:10px 15px;}
#mainav .drop::after, #mainav li li .drop::after{content:"\f0d7";}
#mainav .drop::after{top:22px; right:10px;}
#mainav li li .drop::after{top:15px; right:5px;}
#mainav ul ul{visibility:hidden; opacity:0;}
#mainav ul li:hover > ul{visibility:visible; opacity:1;}
#mainav ul li a:hover{text-decoration:none; }
#mainav form{display:none; margin:0; padding:0;}
#mainav form select, #mainav form select option{display:block; cursor:pointer; outline:none;}
#mainav form select{width:100%; padding:5px; border:1px solid;}
#mainav form select option{margin:5px; padding:0; border:none;}

/* Sidebar Navigation */
.sidebar nav{display:block; width:100%;}
.sidebar nav li{margin:0 0 3px 0; padding:0;}
.sidebar nav a{display:block; position:relative; margin:0; padding:5px 10px 5px 15px; text-decoration:none; border:solid; border-width:0 0 1px 0;}
.sidebar nav a::after{top:9px; left:5px; content:"\f101";}
.sidebar nav ul ul a{padding-left:35px;}
.sidebar nav ul ul a::after{left:25px;}
.sidebar nav ul ul ul a{padding-left:55px;}
.sidebar nav ul ul ul a::after{left:45px;}


/* Back to Top */
#backtotop{z-index:999; display:inline-block; position:fixed; visibility:hidden; bottom:20px; right:20px; width:36px; height:36px; line-height:36px; border-radius:5px; font-size:16px; text-align:center; opacity:.2;}
#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}
#backtotop.visible{visibility:visible; opacity:.5;}
#backtotop:hover{opacity:1; text-decoration:none;}



/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Colours
--------------------------------------------------------------------------------------------------------------- */
body{color:#BEBEBE; background-color:#393939;}
a{color:#2a70e8;}
hr {border-color:#D7D7D7;}
label span{color:#FF0000; background-color:inherit;}
.btn{color:#FFFFFF; background-color:#2a70e8;}
.red{background-color:#DC8B8A;}
.orange{background-color:#EC9700;}
.blue{background-color:#03A1CE;}
.flexslider .heading, .flexslider .btn{color:#FFFFFF;}


/* Rows */
.row0, .row0 a{color:#FFFFFF; background-color:#2a70e8;}
.row1{color:#888888; background-color:#FFFFFF;}
.row3{color:#888888; background-color:#fff; border-bottom: 1px solid #f7f7f7;}
.row4{color:#FFFFFF; background-color:#f7f7f7; border-bottom: 1px solid #e9e9e9; border-top: 1px solid #e9e9e9;}
.row5{color:#BEBEBE; background-color:#333;}
.row6, .row6 a{color:#BEBEBE; background-color:#393939;}




/* Footer */
#footer .title{color:#2a70e8; font-family:tahoma; font-size:20px;}
#left-footer{
	width:50%;
	height:100%;
	float:left;
}
#mainMenu{
	width:50%;
	height:100%;
	float:left;
}
#categorie{
	width:50%;
	height:100%;
	float:right;
}
#right-footer{
	width:50%;
	height:100%;
	float:right;
}
#getInTouch{
	width:50%;
	height:100%;
	float:left;
}
#socialNetwork{
	width:40%;
	height:100%;
	float:right;
}
#socialNetwork h1{
	font-family:tahoma;
	font-size:22px;
	color:#337AB7;
	margin:0 0 15px 0;
}
#socialNetwork ul li{
	float:left;
	color:#337AB7;
	list-style-type:none;
}
#socialNetwork ul li a{
	margin:0 5px 0 0;
}
#socialNetwork ul li a:hover{
	opacity:0.7;
}
.wrap-footer{
	width:100%;
	height:100%;
}
.wrap-footer h1{
	font-family:verdana;
	font-size:24px;
	color:#337AB7;
	margin:10px 0 15px 0;
}
.wrap-footer ul li{
	list-style-type:none;
	margin:5px 0 ;
	color:#C0C0C0;
}
.wrap-footer ul li a{
	text-decoration:none;
	font-family:verdana;
	font-size:12px;
	color:#C0C0C0;
}
.wrap-footer ul li a:hover{
	color:#fff;
}
#footer ul{
	float:left;
	margin-left:0;
	padding-left:0;
}
.wrap-Content{
	max-width:978px;
	height:100%;
	margin:auto;
}

/* Navigation */
#mainav{color:#FFFFFF; background-color:#393939; border-color:#2a79ff;}
#mainav li a{color:inherit;}
#mainav .active a, #mainav a:hover, #mainav li:hover > a{color:#FFFFFF; background-color:#2a79ff;}
#mainav li li a, #mainav .active li a{color:#FFFFFF; background-color:rgba(0,0,0,.6); border-color:rgba(0,0,0,.6);}
#mainav li li:hover > a, #mainav .active .active > a{color:#FFFFFF; background-color:#2a79ff;}
#mainav form select{color:#FFFFFF; background-color:#2a79ff; border-color:#2a79ff;}


.container .sidebar nav a{color:inherit; border-color:#D7D7D7;}
.container .sidebar nav a:hover{color:#2a79ff;}

.pagination a, .pagination strong{border-color:#D7D7D7;}
.pagination .current *{color:#FFFFFF; background-color:#2a79ff;}

#backtotop{color:#FFFFFF; background-color:#2a79ff;}

.row4 #latest p{
	font-size: 14px;
	font-family: tahoma;
	text-align: justify;
	color: #333;
}
.row3 .left{
	float:left;
	width:50%;
	height:100%;
}
.row3 .left img{
	width:100%;
	height:100%;
}
.row3 .left p{
	color:#393939;
	width: 100%;
	font-size: 11px;
}
.row3 .right{
	float:right;
	width:50%;
}
.row3 .right h1{
	color:#2A79FF;
	font-size:22px;
}
/*--pagenation start here--*/
.page-nation {
  margin: 0.5em 0 0;
  padding: 1em 0;
}
.page-nation ul li {
  display: inline-block;
}
 .page-nation ul li a{
 	text-decoration: none;
 	color: #fff;
 }
 .page-nation ul li  span{
  background: #2DA5DA;
  font-size: 1.2em;
  width: 32px;
  height: 32px;
  display: inline-block;
  line-height: 1.6em;
  text-align: center;
  margin: 0 5px;
  vertical-align: middle;
  color: #fff;
}
.page-nation ul li i {
	width:32px;
	height:32px;
	 background: url(../images/img-sprite.png) no-repeat -158px -3px;
	 display: inline-block;
	  vertical-align: middle;
}
.page-nation ul li i.next {
	background-position:  -198px -3px ;
}
.nbs-flexisel-container {
	position: relative;
	max-width: 100%;
}
.nbs-flexisel-ul {
	position: relative;
	width: 9999px;
	list-style-type: none;
	text-align:center;
}
.nbs-flexisel-inner {
  overflow: hidden;
  width: 75%;
  margin: 0em auto 0em;
}
.nbs-flexisel-item {
	float: left;
	cursor: pointer;
	position: relative;
	line-height: 0px;
}
.nbs-flexisel-item > img {
	cursor: pointer;
	position: relative;	
}
/*---- Navigation ---*/
.nbs-flexisel-nav-left, .nbs-flexisel-nav-right {
	width:32px;
	height:110px;
	position: absolute;
	cursor: pointer;
	z-index: 100;
	top:0 !important;
}
.nbs-flexisel-nav-left {
	left: 0px;
	  background: url(../images/img-sprite.png) no-repeat -4px -48px ;
}
.nbs-flexisel-nav-right {
	right: 0px;
	background: url(../images/img-sprite.png) no-repeat -47px -48px ;
}
/*--chaert--*/
.mid1 {
	float: right;
	width: 50%;
	text-align: left;
	  margin-top: 4em;
}
.mid2 {
	float: left;
	width: 50%;
}
.mid h2{
	  font-family: 'CantoraOne-Regular';
	  font-size: 1.8em;
	  color: #2A79FF;
	  text-align:center;
}
.mid1 p{
	  font-size: 1em;
	  color:#393939;
	  line-height: 1.7em;
	  width:70%;
	    margin: 0.5em 0 2em;
}
.mid {
  padding: 1em 5em;
}
.content-mid {
  padding:0;
}
h5{
	text-align:center;
	font-size:14px;
}
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
a:hover{
	text-decoration:none;
}

/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport{width:device-width;}

@media screen and (max-width:968px){
	#header #slogan {
		margin: 0px 17%;
	}
}
@media screen and (max-width:960px){
	#mainav li a {
		padding: 30px 16px;
	}
	.form-control{
		width:70%;
	}
}

@media screen and (max-width:924px){
	#mainav li a {
		padding: 30px 13px;
	}
}
@media screen and (max-width:909px){
	#header #slogan {
		margin: 0px 15%;
	}
}
@media screen and (max-width:870px){
	#mainav li a {
		padding: 30px 11px;
	}
}
@media screen and (max-width:857px){
	#header #slogan {
		margin: 0px 12%;
	}
}
@media screen and (max-width:834px){
	#mainav li a {
		padding: 30px 9px;
	}
}

@media screen and (max-width:798px){
	#mainav li a {
		padding: 30px 6px;
	}
	#header #slogan {
		margin: 0px 4%;
	}
}
@media screen and (max-width:709px){
	#mainav li a {
		padding: 30px 9px;
	}
}


/* Smartphone + Tablet
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:180px) and (max-width:750px) {
	.fl_left, .fl_right{display:block; float:none;}
	.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 30px 0; padding:0;}


	#header #slogan {margin: 0px 7%;}
	#header .fl_left{display:inline; margin-left:10px;}
	#header .socialNetwork {line-height:0;}
	#header ul{margin:0 0 15px 0; }
	#header ul li{margin:0;}
	#header .socialNetwork{padding-right:5px;}
	
	.wrapper .flexslider ul .slides{
	width:100%;
	height:250px;
}
.wrapper .flexslider ul.slides li img{
	width:100%;
	height:250px;
} 

.row4 #latest{height:500px; margin-left:10px;}
.row4 #latest .three_quarter {width:100%; height:55%;}
.row4 #latest .one_quarter{width:100%; height:45%}

.row4 #latest article{padding:15px 5px 0 0; margin:0; }
.row4 #latest article h1{font-size:24px;  }
.row4 #latest article p{font-size:12px; padding-top:5px;}
.row4 #latest article button{ margin:10px;  font-size:8px;}
.row4 #latest .one_quarter{ float:left;  border-left: none; }
.row4 #latest .one_quarter h1{font-size:24px; margin-bottom: 5px;}
.row4 #latest .one_quarter ul li{  font-size:12px;}
.row4 #latest .one_quarter {padding:0;}

.container {margin-left:10px;}
.container  h2{font-size:24px;}
.container  h4{font-size:24px;}
.container  p{font-size:12px;}
.container img{width:100%;}
.container li {margin:10px 0 0 0;}

.clients-bottom .flexslider{
	height:300px;
} 

.flex-viewport{height:200px;}
.slides{height:200px;}

.flexslider .slides img{
	display: block;
	float: right;
	width:15px;
	height:30px;
}
.row5 .one_quarter{ display:inline; width:40%; height:auto; margin-left:20px;}

#socialNetwork h1{
	font-size:20px;
	margin:0 0 15px 0;
}
#socialNetwork ul li a{
	margin:0 5px 0 0;
}
#socialNetwork ul li img{
	width:30px;
	height:30px;
}
#footer h1{
	font-size:20px;
	margin:10px 0 15px 0;
}
#footer ul li{
	margin:5px 0 ;
	font-family:verdana;
	font-size:12px;
}
#footer ul li a{
	font-size:12px;
}

@media screen and (min-width:180px) and (max-width:900px) {

	
	#header{}

	
	#mainav ul{display:none;}
	#mainav form{display:block;}

	.flexslider .heading{font-size:36px; line-height:36px; margin-bottom:15px;}



	.container img{width:100%;}
	.container li {margin:10px 0 0 0; width:40%;}
	
#socialNetwork h1 {margin:0;}


}



/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:978px) {
  .container, #footer {max-width:978px;}
  #header #slogan{margin: 0px 18%;}
}



/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:1100px) {
	#latest div{margin-bottom:0;}
	#latest .latestposts li{display:block; float:none; width:100%;}
	.container img{width:100%;}
}



@media screen and (max-width:650px) {
	
	#header .socialNetwork{padding-right:5px;}
	.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
	.scrollable table{margin:0; padding:0; white-space:nowrap;}
	.flexslider .txtoverlay{display:none}
	.container img{width:100%;}
	.container li {margin:10px 0 0 80px; width:60%;}
	#latest article{padding:30px;}
	#latest .latestposts li figure figcaption{display:none;}
	
	#socialNetwork h1 {margin:10px 0 0 0;}
	#footer #mainMenu {padding-left:10px;}
	#footer #mainMenu{width:100%; display:block;}
	#footer #categorie {width:100%; display:block; padding-left:10px;}
	#footer #getInTouch{width:100%; display:block;}
	#footer #socialNetwork{width:100%; display:block; margin-top:95px;}

}
@media screen and (max-width:663px){
	#header #slogan {
		margin:0;
	}
}
@media screen and (max-width:550px){
	.row3 .right{
		float:none;
		width:100%;
	}
	.row3 .left{
		float:none;
		width:100%;
	}
}
@media screen and (max-width:400px) {
	#header li{display:block; margin-right:0;}
	#socialNetwork h1 {margin: 10px 0px 15px;}
	.container li {
    margin: 10px 0px 0px 40px;
    width: 60%;}
	#footer #mainMenu{width:100%; display:block;}
	#footer #categorie {width:100%; display:block; padding-left:10px;}
	#footer #getInTouch{width:100%; display:block;}
	#footer #socialNetwork{width:100%; display:block; margin-top:105px;}
}