/*
/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\ CONTENTS /\/\/\/\/\/\/\/\/\/\/\/\/\/\//\/\/\/\

	 1.  IMPORT
	 2.  HEADER
	 3.  NAVIGATION
	 4.  FOOTER & FOOTER WIDGETS
     5.  SIDEBAR & SIDEBAR WIDGETS
     6.  PORTFOLIO/PROJECTS
     7.  BLOG STYLING
     8.  404 PAGE
     9.  ABOUT PAGE
     10. CONTACT PAGE FORM
     11. ICON LIST PAGE
     12. RECENT WORK CAROUSEL
     13. TESTIMONIALS
     14. ICON SERVICE BOXES
     15. CLIENTS
     16. TYPOGRAPHY PAGE
     17. BUTTONS
     18. PRICING TABLES
     19. TABS
     20. ACCORDION & TOGGLE
     21. PROGRESS SKILL BAR
     22. PROMO BOX
     23. PAGINATION
     24. TITLE
     25. DROPCAPS
     26. HIGHLIGHT
     27. SWIPE J.S SLIDER
     28. CAROUSEL
     29. FLICKR
     30. LIST & BULLETS
     31. BUTTON UP
     32. RECENT BLOG POST
     33. MEDIA QUERIES
*/

/* =================================================================== */
/*  1. Import Section
====================================================================== */
@import url("font-awesome.css");
@import url("meanmenu.css");
@import url("magnified.css");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700");
@import url(http://fonts.googleapis.com/css?family=Lato:400,300,700);
@import url(http://fonts.googleapis.com/css?family=PT+Sans:400,700);

@font-face
{
  font-family: 'robotoB';
  src: url(../../roboto/Roboto-Bold.ttf);
}
@font-face
{
  font-family: 'roboto';
  src: url(./../../roboto/Roboto-Regular.ttf);
}
@font-face
{
  font-family: 'robotoM';
  src: url(../../roboto/Roboto-Medium.ttf);
}

a:hover{
    text-decoration: none;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	color:#555;
}
a:focus{
    outline: none;
}

.not-ie a {
	-webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	   -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
		-ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
		 -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
			transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}
.newsletter .submit {
    width: 40px;
    height: 40px;
    background-image: url(../img/subscribe.png);
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    background-color: #0085D9;
    top: 0;
    right: 0;
    outline: none;
    border: none;
}
.newsletter {
    position: relative;
}
.newsletter .email {
    background-color: #F4F4F4;
    border: none;
}
.footer-top {
    background:rgb(0,41,80);
    padding: 5em 0;
}
.newsletter .email {
    padding: 5px 60px 5px 15px;
    border-radius: 3px;
    -Webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    height: 40px;
    border: 1px solid #fff;
    width: 100%;
    text-align: left;
}



ul
{
    list-style: none;
}

.wrapper {
    background:#FFFFFF;
    margin: 0 auto;
    width: 100%;
}

.hidden {
    display:none;
}

.mrgb-20{
    margin-bottom:20px;
    display:block;
}
.mrgb-30{
    margin-bottom:30px;
    display: inline-block;
}
.mrgb-40{
    margin-bottom:40px;
    position:relative;
    display:block;
}
.mrgb-50{
    margin-bottom:50px;
    position:relative;
    display:block;
}
.mrgb-60{
    margin-bottom:60px;
    position:relative;
    display:block;
}
.mrg-0{
    margin:0 auto;
}
.mrgt-0{
    margin:0 auto 20px;
}

/* =================================================================== */
/* 2. HEADER
====================================================================== */
#header {
	z-index: 99999;
	position: relative;
	width: 100%;
	-webkit-box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.2);
	-ms-box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.2);
	-o-box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.2);
   
}

#nav-bar {background: rgb(5,49,123) !important};

.fixed-header #nav-bar{
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

#top-bar{color: #fff!important; padding: 3px 0;background: #033d9e;}

.top-info span,.top-info a,.top-info em{ float: left;}

.top-info span{ font-size: 13px; line-height: 28px ; text-transform: capitalize;padding-right: 15px;}

.top-info span i{ font-size:13px; margin-right:5px;}

.top-info ul{ float: right; margin-bottom:0;}

.top-info li{ float:left;}

.top-info li a{color:#fff; font-size: 15px; border:1px solid #fff;
    height: 26px;
    width: 26px;
    transition:all 0.3s ease-in 0s;
    -webkit-transition:all 0.3s ease-in 0s;
    -moz-transition:all 0.3s ease-in 0s;
    -ms-transition:all 0.3s ease-in 0s;
    -o-transition:all 0.3s ease-in 0s;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    margin: 0 2px;
    line-height: 23px;
    text-align: center;
}
.top-info li:hover a.my-tweet{background:#fff; color:#3ABDD1;}
.top-info li:hover a.my-facebook{background:#fff; color:#648CD5;}
.top-info li:hover a.my-skype{background:#fff; color:#00AFFF;}
.top-info li:hover a.my-pint{background:#fff; color:#DE5656;}
.top-info li:hover a.my-rss{background:#fff; color:#EF8D1F;}
.top-info li:hover a.my-google{background:#fff; color:#E73904;}

.ie8 #header {
	border-bottom: 1px solid #e9e9e9;
}
.fa.fa-angle-down{color:#fafafa;}

/* Logo
====================================*/
#logo > h1 {
    line-height: 0;
    font-size: 0;
    margin: 0;
}

#logo a {
    float: left;
    line-height: 46px;
    color:#fff;
}
#logo a img {
	width:100%;
}
.content{
	padding:30px 0 60px;
	position: relative;
}
.sub_content{
	margin-bottom: 30px;
}

/* Page Head Title
====================================*/
.page_head {
	border-bottom: 1px solid #eee;
	background:#f9f9f9;
	padding:30px 0;
}
.page_head h2 {
    float: left;
    font-weight: 600;
    margin-bottom: 0;
    margin-top: 0;
    font-size:24px;
}

/* Breadcrumbs
====================================*/
#breadcrumbs ul {
    float: right;
    font-size: 12px;
    padding: 0;
}

#breadcrumbs ul li {
	display: inline-block;
	color: #888;
	padding: 0 11px 0 0;
	margin: 0 0 0 5px;
	background: url(../img/breadcrumbs.png) no-repeat 100% 50%;
}

#breadcrumbs ul li:last-child a,
#breadcrumbs ul li a { color: #ED687C; }

#breadcrumbs ul li:first-child { padding-right: 0; margin-left: 0; }

#breadcrumbs ul li:first-child,
#breadcrumbs ul li:last-child {
	color: #888;
	background: none;
}

#breadcrumbs ul li:last-child { padding:0; background: none; }


/* =================================================================== */
/* 3. NAVIGATION*/



.navbar, .dropdown-menu{
    background:rgba(255,255,255,0.25);
    border: none;
    
    }
    
    .nav>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .dropdown-menu>li>a, .dropdown-menu>li{
      border-bottom: 3px solid transparent;
    }
    .nav>li>a:focus, .nav>li>a:hover,.nav .open>a, .nav .open>a:focus, .nav .open>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
      border-bottom: 3px solid transparent;
      background: none;
    }
    .navbar a, .dropdown-menu>li>a, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .navbar-toggle{
    color:#FFF;
    }
    .dropdown-menu{
          -webkit-box-shadow: none;
        box-shadow:none;
    }
    
    .nav li:hover:nth-child(8n+1), .nav li.active:nth-child(8n+1){
      border-bottom: #C4E17F 3px solid;
    }
    .nav li:hover:nth-child(8n+2), .nav li.active:nth-child(8n+2){
      border-bottom: #F7FDCA 3px solid;
    }
    .nav li:hover:nth-child(8n+3), .nav li.active:nth-child(8n+3){
      border-bottom: #FECF71 3px solid;
    }
    .nav li:hover:nth-child(8n+4), .nav li.active:nth-child(8n+4){
      border-bottom: #F0776C 3px solid;
    }
    .nav li:hover:nth-child(8n+5), .nav li.active:nth-child(8n+5){
      border-bottom: #DB9DBE 3px solid;
    }
    .nav li:hover:nth-child(8n+6), .nav li.active:nth-child(8n+6){
      border-bottom: #C49CDE 3px solid;
    }
    .nav li:hover:nth-child(8n+7), .nav li.active:nth-child(8n+7){
      border-bottom: #669AE1 3px solid;
    }
    .nav li:hover:nth-child(8n+8), .nav li.active:nth-child(8n+8){
      border-bottom: #62C2E4 3px solid;
    }
    
    .navbar-toggle .icon-bar{
        color: #fff;
        background: #fff;
    }
    
    




/* ====================================================================== */

#navigation { 
    z-index:9999;
    padding: 0 70px;
    text-align: center;
}


.js .selectnav { display: none; }

.menu ul {
	margin: 0;
	padding: 0;
    width: 100%;
}

.menu ul li { position: relative; z-index:100000;}
.menu ul ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	z-index: 100;
	width: 188px;
}
.menu > ul li { float: left; cursor: pointer;}
.menu ul li:hover > ul { display: block; }
.menu ul a {display: block;position: relative;}

.menu ul ul li a.sf-with-ul:after{
    content: "\f0da";
    color:#F27693;
    font-family: FontAwesome;
    font-size:15px;
    border-radius:0;
    left: 11.3em;
    margin-right: -3px;
    margin-top: -5px;
    position: absolute;
    top: 43%;
}
.menu ul ul li a:hover.sf-with-ul:after{
	border-color: #FBFBFB #FBFBFB #FBFBFB #ED687C;
	-moz-border-right-colors:#FBFBFB
}

.menu ul ul ul {top: 0;left: 100%;}
.menu ul a { text-decoration: none; }
.menu ul > li > a {
	font-family: 'RobotoM';
	font-size: 14px;
	line-height: 2.5;
	padding:10px !important;
	overflow: hidden;
	border-bottom: 2px solid transparent;
	transition: all .25s ease-in-out;
	-moz-transition: all .25s ease-in-out;
	-webkit-transition: all .25s ease-in-out;
    text-transform: uppercase;
}
.menu > ul > li > a {
    color:#fff;}
.menu ul li a:hover,

.menu li.current-menu-item > a:after, .menu li.sfHover > a:after, .menu li a:hover:after
{
    width: 100%;
}
.menu li a:after
{
    background:#fff;
    top:-2%;
    content: "";
    height:2px;
    right: 0;
    position: absolute;
    transition: all 0.3s ease 0s;
    width: 0;
    border-top-left-radius:4px ;
    border-top-right-radius:4px ;
}
.menu li a.border:before
{
    background:#fff;
    top:-2%;
    content: "";
    height:2px;
    right: 0;
    position: absolute;
    transition: all 0.3s ease 0s;
    width:100%;
    border-top-left-radius:4px ;
    border-top-right-radius:4px ;
}
/*.menu ul li a:hover .sf-sub-indicator{
	color:#ED687C;
}*/

.menu > ul > li > ul:before{
    border-bottom:10px solid #fff;
    border-left:8px solid transparent;
    border-right:8px solid transparent;
    content: " ";
    height: 8px;
    left: 37%;
    margin-left: 2px;
    position: absolute;
    top: 0;
    vertical-align: middle;
    width: 12px;
}
.ie8 #current:after {
	display: none;
}
.menu ul li a {
	-webkit-transition: border 150ms ease-in-out, background-color 150ms ease-in-out;
	-moz-transition: border 150ms ease-in-out, background-color 150ms ease-in-out;
	-o-transition: border 150ms ease-in-out, background-color 150ms ease-in-out;
	-ms-transition: border 150ms ease-in-out, background-color 150ms ease-in-out;
	transition: border 150ms ease-in-out, background-color 150ms ease-in-out;
}
/* Drop-Down */
.menu ul ul {
	z-index: 999;
	border-radius: 0 0 3px 3px;
	border-bottom:1px solid #DCDCDC;
}
.menu > ul > li > ul{	padding:9px 0 0 0;}
.menu > ul > li ul > li:first-child > a{border-top: 2px solid #fff;}

.menu > ul ul li:hover > a {
	background: transparent;
}

.menu ul ul li {
	margin: 0;
	padding: 0;
	width: 100%;
    background: #fff;
}

.menu ul ul li a {
	color: #555;
	font-size: 13px;
	line-height: 18px;
	padding: 10px 16px !important;
	border-right:1px solid #DCDCDC;
	border-left:1px solid #DCDCDC;
}

.menu ul ul li { border-top: 1px dashed #e8e8e8; }
.menu ul ul li:first-child { border: 0; }

.menu ul ul li a:hover {
	color:#FFF;
	
}

.menu ul ul li a {
	-webkit-transition: background-color 50ms ease-in-out;
	-moz-transition: background-color 50ms ease-in-out;
	-o-transition: background-color 50ms ease-in-out;
	-ms-transition: background-color 50ms ease-in-out;
	transition: background-color 50ms ease-in-out;
}

.menu ul ul ul {
	border: 1px solid #e0e0e0;
	border-radius: 0 3px 3px 3px;
	margin: -1px 0 0 0;
}

.sf-sub-indicator {
	color: #c6c6c6;
	margin: 0 0 0 5px;
	width: 11px;
	display: inline-block;
	font-size: 12px;
	line-height: 0;
}
.menu2
{
	list-style: none;
	text-decoration: none;
	  margin-left: 80px;

}
.menu2 li
{
	float: left;
	padding-left: 20px;
	padding-right: 20px;
	border-right:0.5px solid #c3c6ca;
	-webkit-transition: all .5s ease-in;
	-o-transition: all .5s ease-in;
	transition: all .5s ease-in;
	
}
.menu2 li:hover
{
	background: rgba(255, 102, 0, 0.87);	
}
.menu2 li:hover a
{
	color:#fff;	
}
.menu2 li a
{
	font-size: 14px;
	color:  #5c5f63;
}

.filiere
{
 border-right: 5px solid #F3ECED;
    /* z-index: 200; */
    /* opacity: 1; */
    color: #fff;
    font-size: 20px;
    padding-right: 5px;
}

.icon
{
	position: relative;
    left: -10px;
	font-size: 20px;
    top: 1px;
    width: 25px;
    background: #f44336;
    padding: 2px;
    border-radius: 50px;
}
.iconG
{
	position: relative;
    left: -10px;
	font-size: 20px;
    top: 1px;
    width: 25px;
    background: #00dd00;
    padding: 2px;
    border-radius: 50px;
}


.lien
{
	letter-spacing: 1px;
    text-transform: uppercase;
    color: #d5dfe5;
    position: relative;
    font-size: 15px;
    width: 100%;
    height: 35px;
    line-height: 34px;
    border-bottom: 1px solid rgba(255,255,255,0.3);
}
 .lien::after
{
	 content: "";
    position: absolute;
    height: 4px;
    width: 60px;
    background: #e5a12a;
    left: 0;
    bottom: -2px;
    border-radius: 5px;
}
.topBar {
    height: 46px;
    line-height: 45px;
    color: #fff;
    font-family: 'RobotoM';
    
    width: 100%;
    background: rgb(5,49,123);
}
.topBar span.topBar-email {
    display: inline-block;
    position : absolute;
    left: 0;
}
.topBar span  font {
    padding-right: 20px;
}
.topBar span.social-icon{
    display: inline-block;
    position : absolute;
    right: 0;
}
.topBar span.social-icon font {
    display: inline-block;
    width: 40px;
    background: #fff;
    height: 40px;
    border-radius: 50%;
    color: red;
    margin-right: 5px;
    margin-top: 2px;
    cursor: pointer;
}
.topBar span.social-icon font i {
    font-size: 20px;
    display: inline-block;
    padding-left: 12px;
    width: 100%;
    height: 100%;
}
.topBar span.social-icon font i.fa-facebook{
    color: #8b9dc3;
}
.topBar span.social-icon font i.fa-twitter{
    color: #0084b4;
}
.navbar-brand {
    display: inline-block;
    width: 170px;
    height: 100px;
    padding: 0 !important;
}
.navbar-brand img {
    width: 100%;
    height: 100%;
}
.slider-product {
    height: 46px;
    background: rgb(5,49,123) !important;
    line-height: 45px;
}

.ul-footer {
    padding: 0;
    margin: 0;
}
.menu-cgda {
    width: 100%;
}
.menu-cgda .menu-ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    padding: 30px 0;
}
.menu-cgda .menu-ul li {
    display: inline-block;
    height: 35px;
    line-height: 34px;
    position:  relative;
    border-radius: 5px;
    
}
.menu-cgda .menu-ul li:hover{
    background: #d4021d;
}
.menu-cgda .menu-ul li:hover:after{
    content: '';
}
.menu-cgda .menu-ul li:hover a{
    color: #fff;
}
.menu-cgda .menu-ul li:after {
    content :'|';
    position: absolute;
    color: rgb(5,49,123);
}
.menu-cgda .menu-ul li:last-child:after  {
    content : ''
}
.menu-cgda .menu-ul li .listmenu{
    color: rgb(5,49,123);
    font-size: 14px;
    font-family: 'RobotoM';
    display: inline-block;
    width: 100%;
    height: 100%;
     padding: 0 20px;
}
.box-images {
    width: 100%;
    background: #fff;
}
.box-images a{
    display: inline-block;
    width: 70%;
    height: 100px;
}
.box-images a img{
    width: 100%;
    height: 100%;
}
.banner-img {
    width: 100%;
    text-align: right;
}
.banner-img img {
    position: relative;
    top: 5px;
}