/*Logo*/

a#logo {
	background: url(img/coe-logo.png);
	background: url(img/coe-logo.svg) left center no-repeat;
	float: left;
	width: 285px;
	height: 75px;
	text-indent: -9999px;
}

/*Transitions

li#search-box,
.mainmenu .dropdown-menu li a,
.mainmenu .glyphicon,
#menu a, 
#explore>a, 
#languages>a, 
#connect a {
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}*/

/*Les menus*/

#menu, 
#explore, 
#languages, 
#connect,
#connected, 
#search-box {
	color: #fff;
}

#menu a, 
#explore>a,
#languages>a, 
#connected>a, 
#connect a {
	color: #fff;
	font-size: 15px;
	display: inline-block;
	margin-right: 0;
	margin-left: 0;
	padding-right: 10px;
	padding-left: 10px;
	text-transform: uppercase;
	border-style: none;
	height: 75px;
	line-height: 75px;
}

#menu a:hover, 
#explore>a:hover, 
#languages>a:hover, 
#connect a:hover,
#connected a:hover,
.open a.dropdown-toggle {
	background-color: rgba(255, 255, 255, 0.1);
	text-decoration: none;
}

#connect,
#explore{
    position: relative;
}

#languages{
	margin-right: 8px;
    position: relative;
	margin-left: 85px;
}

/*Connect*/

#connect .glyphicon{
	font-size: 10px;
    top: 0px;
	margin-left: 5px;
	float: none;
}

#connect a:hover span.glyphicon {
	color: #FFF;
}

/*Connected*/

#connected {
	margin-right: 0;
	margin-left: 20px;
	position: relative;
	display: inline-block;
}

#connected b.caret {
	margin-left: 10px;
}

#connected > a {
	margin: 0;
	padding: 0 10px 0 0;
}

#connected img {
	width: 35px;
	margin: -4px 0 0 10px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
}

.big span.glyphicon.glyphicon-remove-circle {
	color: red;
	font-size: 15px;
}

li.big a {
	line-height: 25px;
}

/*Searchbox*/

li#search-box:hover {
	background-color: rgba(255, 255, 255, 0.1);
}

li#search-box .glyphicon.glyphicon-search {
	font-size: 17px;
	float: none;
	margin: 0;
}

/*Dropdown*/

.mainmenu ul.dropdown-menu {
	top: 72px;
	border-radius: 0 0 2px 2px;
	-moz-box-shadow: none;
	box-shadow: none;
	min-width: 200px;
}

.mainmenu .dropdown-menu li a {
	text-transform: uppercase;
	padding-top: 10px;
	padding-bottom: 10px;
	position: relative;
	font-weight: 500;
}

.mainmenu .dropdown-menu li a:hover {
	color: #103651;
}

.mainmenu .glyphicon {
	font-size: 10px;
	color: #e4e5e4;
	margin-top: 4px;
	margin-right: 8px;
	float: left;
}

.mainmenu a:hover span.glyphicon {
	color: #220505;
}

/* ==================================================== */
/* = Live											  = */
/* ==================================================== */

div.content.bloc-live2 {
	background: url(img/motif_live.png), linear-gradient(120deg, #113651 0%, #0f7dad 100%);
	color: #ffffff;
	opacity: 1;
	border: none !important;
	border-radius: 0 2px 2px 2px !important;
}


/* ==================================================== */
/* = Responsive = */
/* ==================================================== */

@media (min-width: 1199px) {
	#header{
		height: 75px;
	}
	#header.container-fluid.topmenu {
		height: 40px;
	}
}

@media (max-width: 1199px) {

	
	#languages li {
		float: left;
		margin-right: 10px;
	}
	
	#languages span.glyphicon {
		display: none;
	}
	
	#languages li a span {
		border-radius: 2px;
		display: block;
		padding: 6px;
		border-width: 1px;
		border-style: solid;
	}
    
	.mainmenu {
		padding: 0;
	}
	
	.dropdown-menu, 
	.dropdown-menu li a, 
	#tools .dropdown-menu li a:hover, 
	#connect a {
		font-size: 15px;
		border: 0;
		width: 100%;
		padding: 0;
		margin: 0;
	}
	
	li#connect,
	li#connected,
	li#languages,
	li#explore,
	li#search-box {
		clear: both;
		width: 100%;
		margin: 0;
		float: left;
		border-style: none;
	}
	
	#tools {
		width: 100%;
		padding: 0;
		margin: 0;
	}
	
	/** Menu principal **/
	
	li#explore li,
	li#languages li {
		margin-top: 12px;
		margin-bottom: 12px;
	}
	
	.dropdown-menu > li > a {
		white-space: normal;
		padding-left:20px !important;
	}
	
	.mainmenu a span.glyphicon {
		color: #8f8f8f;
		margin-left: -20px;
	}

	/** Recherche **/
	
	li#search-box {
		margin: .5em 0 2em;
		position: relative;
	}
	
	li#search-box input {
		border: none;
		border-radius: 2px;
		font-size: 20px;
		padding: 1.3em 1.3em 1.3em 01em;
	}
	
	li#search-box:after {
		content: "\e003";
		font-family: "Glyphicons Halflings";
		color: #123751;
		position: absolute;
		right: 12px;
		font-size: 30px;
		cursor: default;
		top: 5px;
	}
	
	#header.topmenu #search-box{
		margin-left: 0px !important;
	}
	
	/** Divers **/

	a#logo {
		margin-left: -19px;
	}

	button.navbar-toggle {
		margin-top: 12px;
		margin-right: 0;
	}
	
	li.dropdown-header {
		display: block;
		width: 100%;
		margin: 0px !important;
		padding: 0px;
	}

li.dropdown-header.hidden-sm.hidden-md.cartouche {
	border-bottom: 1px solid #fff;
	padding-bottom: 2px;
	display: block;
	padding-top: 19px;
}

li.dropdown-header.hidden-sm.hidden-md.cartouche span {
	background-color: white;
	padding: 3px 10px 2px;
	border-radius: 2px 2px 0 0;
}

/** Connected **/
	
	#connected {
		margin: 1em 0 !important;
		position: relative;
		display: block;
		padding: 1em;
		background-color: #232323;
		border-radius: 2px;
		border: 1px solid rgba(255, 255, 255, 0.18) !important;
	}
	
	#connected li.dropdown-header {
		font-size: 1.2em;
		text-align: left;
	}
	
	#connected li {
		border-bottom: 1px solid rgba(255, 255, 255, 0.22);
		padding-top: 5px;
		padding-bottom: 5px;
	}
	
	#connected li:last-child {
		border-bottom: none;
	}
}

@media (max-width: 767px) {

	a#logo {
		width: 240px;
	}

}


/*Fx hover pour test*/

.view {
	width: 270px;
	height: 154px;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
}
.view .mask, .view .content {
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
	width: 270px;
	height: 154px;
}
.view img {
   display: block;
   position: relative;
}
.view a.info {
   background:url(img/icon-cam.svg) center no-repeat;
   display: inline-block;
   text-decoration: none;
   padding:0;
   text-indent:-9999px;
   width:40px;
   height:30px;
}

.cam-effect .mask {
   opacity: 0;
   overflow:visible;
   border: 100px solid rgba(0,0,0,0.7);
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box !important;
   box-sizing:border-box !important;
   -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;
}
.cam-effect a.info {
   position:relative;
   top:-10px;
   opacity: 0;
   -webkit-transition: opacity 0.4s 0s ease-in-out;
   -moz-transition: opacity 0.4s 0s ease-in-out;
   -o-transition: opacity 0.4s 0s ease-in-out;
   -ms-transition: opacity 0.4s 0s ease-in-out;
   transition: opacity 0.4s 0s ease-in-out;
}
.cam-effect:hover .mask {
   opacity: 1;
   border:100px solid rgba(0,0,0,0.7);
}
.cam-effect:hover a.info {
	opacity:1;
	-moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;
	-o-transition-delay: 0.3s;
	-ms-transition-delay: 0.3s;
	transition-delay: 0.3s;
}



.disclaimer {
    padding: 1em;
}

/*Newsroom*/

span.headline {
	background-color: #ee6830;
	margin-right: 1em;
	padding: 3px 7px 4px;
	border-radius: 9px;
	color: white;
	font-size: 9px;
	display: inline-block;
}

div.upper.news-info span.headline {
	padding: 0 10px;
	line-height: 18px;
	display: inline-block;
	float: left;
	margin-top: 3px;
	margin-right: 10px;
}

.top-news2 span.headline {
	background-color: #989998;
}

.top-news3 span.headline {
	float: right;
}

.hidehead span.headline {
	display: none;
}

span.origin {
	border-right: 1px solid #e2e3e2;
	padding-right: 1em;
}

span.location {
	border-right: 1px solid #e2e3e2;
	margin-right: 0;
	margin-left: 1em;
	padding-right: 1em;
}

span.date {
	margin-left: 1em;
}

.top-news2 h3 a:hover {
	color: #161616 !important;
	border-bottom: 1px solid #161616;
}

.top-news3 h3 a:hover {
	color: #129af0 !important;
	text-decoration: none;
	border-bottom-style: none;
	text-align: center;
}

/*newsroom mobile*/
@media (max-width: 767px) {
	span.headline{
		float: right;
		padding: 3px 7px 3px;
	}
	span.origin{
		display: block;
		padding-top: 4px;
		margin-bottom: 6px;
		border: none;
	}
	span.location, span.date{
		display: inline-block;
		border: none;
		margin: 0;
		padding: 0;
	}
	span.location:after{
		content: "-";
		padding: 0 5px;
	}
	
	#languages li {
		float: left;
		margin-right: 10px;
		margin-left: 0;
	}
	
	#languages li a {
		padding-left: 0 !important;
	}
	
	#languages span.glyphicon {
		display: none;
	}
	
	#languages li a span {
		border-radius: 2px;
		display: block;
		padding: 10px;
		border-width: 1px;
		border-style: solid;
	}

	#search-box input.form-control {
		border-radius: 2px;
	}
}

/* ==================================================== */
/* = Carrefour V3									  = */
/* ==================================================== */

.carrefour2 h3.carretitle strong {
	color: #113651;
	font-weight: bold;
	font-size: 2em;
	display: block;
	text-align: center;
}

.carrefour2 h4 {
	font-size: 15px;
	font-weight: bold;
	line-height: 21px;
}

.carrefour2 #right h4 {
	padding-top: 9px;
}

.carrefour2 #left,
.carrefour2 #right {
	padding: 20px;
}

/*link droite*/
a.list-group-item.link-highlight{
	background: #f5f5f5;
}

#right  a.list-group-item::before{
	content: none !important;
}

.carrefour2 #right a.list-group-item.link-highlight{
	background: #f5f5f5;
	margin-left: -20px;
	display: block;
	font-weight: bold;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	z-index: 3;
	margin-right: -10px;
}

.carrefour2 #right a.list-group-item.link-highlight::before{
	content:"➜ " !important;
	color: #53a841;
	font-size: 15px;
	margin-right: 8px;
}

.carrefour2 ul.nav.nav-tabs {
	font-size: 1.4em;
}

.carrefour2 .pan{
	display: none;
}

.carrefour2 #home {
	float: left;
	padding-right: 1em;
	padding-bottom: 1em;
	padding-left: 1em;
	border-bottom: 1px solid #dcdddc;
	border-left: 1px solid #dcdddc;
	border-right: 1px solid #dcdddc;
	margin-bottom: 2em;
}

.carrefour2 #home div.jumbotron {
	padding: .4em 0 0;
	margin-top: 1em;
	margin-bottom: 0;
}

.carrefour2 h3.carretitle {
	margin-top: 0;
	margin-bottom: 20px;
	text-align: center !important;
}

li.active a {
	font-weight: bold;
}

.carrefour2 #breadcrumb-wrapper {
	margin-top: 20px;
	border-radius: 3px;
}

#left-wrapper div.currentSlide h3 {
	font-size: 2em;
	margin-top: 0;
	margin-bottom: .5em;
}


 
 /* ==================================================== */
 /* = Menu 47									  = */
 /* ==================================================== */
 
.mainmenu.menu47 a {
	font-size: 14px !important;
}

.mainmenu.menu47 #menu,
.mainmenu.menu47 li#explore,
.mainmenu.menu47 li#languages {
	margin-left: 8px;
	margin-right: 0;
}

.mainmenu.menu47 #logo {
	width: 70px !important;
}


/* ==================================================== */
/* = Sous site									 	  = */
/* ==================================================== */

/* Menu COE dans Sous site
----------------------------------------*/

#header.topmenu #tools > li {
	float: left;
}

#header.topmenu .glyphicon {
	color: #113651;
}

#header.container-fluid.topmenu {
	background-color: #e8e8e8;
	min-height: 40px;
}

#header.topmenu #menu a, 
#header.topmenu #explore>a,
#header.topmenu #connect a {
	color: #113651 !important;
	font-size: 15px;
	height: 40px;
	line-height: 40px;
	float: left;
}

#header.topmenu #menu a:hover, 
#header.topmenu #explore>a:hover, 
#header.topmenu #languages>a:hover, 
#header.topmenu #connect a:hover,
#header.topmenu #connected a:hover,
#header.topmenu .open a.dropdown-toggle {
	background-color: rgba(17, 54, 81, 0.1);
	text-decoration: none;
}

#header.topmenu #languages>a, 
#header.topmenu #connect>a {
	height: 40px;
	line-height: 40px;
	color: #113651 !important;
	display: block;
	float: left;
	font-size: 10px;
}


a#logo-coe-www {
	background: url(img/coe-logo-www.svg) left / cover no-repeat;
	width: 110px;
	text-indent: -9999px;
	float: left;
	height: auto;
	margin-top: 10px;
}

	a#logo-coe-www:hover {
		opacity: 0.75;
	}

#header.topmenu .mainmenu ul.dropdown-menu {
	top: 37px !important;
}

#header.topmenu #search-box{
	margin-top: 6px;
	margin-left: 28px;
	padding: 6px;
}

#header.topmenu li#search-box:hover {
	background-color: rgba(17, 54, 81, 0.1);
}


#header.topmenu li#search-box .glyphicon.glyphicon-search {
	font-size: 14px;
}

#header.topmenu button.navbar-toggle {
	margin-top: 0;
	margin-right: 0;
	color: black;
}

#header.topmenu .navbar-toggle {
	padding: 6px;
}

#header.topmenu span.icon-bar {
	background-color: rgb(17, 54, 81);
}

#header.topmenu .dropdown-menu, 
#header.topmenu .dropdown-menu li a, 
#header.topmenu #tools .dropdown-menu li a:hover, 
#header.topmenu #connect a {
	color: black;
}

/*Le chevron*/

#header.topmenu .navbar-toggle > span.glyphicon {
	color: #a4a5a3;
	font-size: 18px;
	margin: 0;
	padding: 0;
}

#header.topmenu .navbar-toggle {
	margin: 0;
	padding: 5px;
}

/* Header menu COE
----------------------------------------*/

#header-subsite {
	background-color: #123751;
}

#header-subsite div.title-site {
	font-size: 2.4em;
}

a#logo-coe-sans {
	background: url(img/coe-logo-sans.svg) left center no-repeat;
	float: left;
	height: 75px;
	text-indent: -9999px;
	width: 100px;
	margin-top: 10px;
}

/* Menu Sous site
----------------------------------------*/

.subsite nav.navbar.navbar-default {
	background-color: #1B7EAC;
	border-style: none;
	border-radius: 0;
	min-height: inherit ;
	margin-left: 0px !;
	margin-bottom: 0;
}

.subsite .navbar-nav>li>a {
	padding-top: 7px;
	padding-bottom: 7px;
	color: #fff;
}

	.subsite .navbar-nav>li>a:hover,
	.subsite .navbar-nav>li>a:hover span {
		background-color: white !important;
		color: #1B7EAC !important;
	}

.subsite .navbar-collapse {
	padding-right: 0;
	padding-left: 0;
	}
	
.subsite .navbar-default .navbar-nav>.active>a,
.subsite .navbar-default .navbar-nav>.active>a:hover,
.subsite .navbar-default .navbar-nav>.active>a:focus {
	background-color: white;
	color: #1B7EAC;
	font-weight: normal;
	font-style: normal;
}

.subsite a:hover,
.subsite a:focus {
	color: #bbbbbb;
	text-decoration:underline;
}

.subsite ul.nav.navbar-nav li.dropdown.open a.dropdown-toggle:hover {
	color: #000000 !important;
}

.chevron{
	position: relative;
}

.chevron:after {
	content:"";
	background: url(img/chevron.svg) 0 2px no-repeat;
	position: absolute;
	height: 8px;
	width: 12px;
	bottom: -1px;
	left: 50%;
	margin-left: -6px;
}

.submenu button.navbar-toggle {
	margin-top: 0;
	margin-bottom: 14px;
	margin-right: 10px;
}

.submenu button.navbar-toggle span.icon-bar {
	background-color: white;
}

.submenu .navbar-collapse.collapse.in a {
	color: white;
}

@media (max-width: 1199px) {
.submenu ul.dropdown-menu li a {
	color: white !important;
}
}


@media (max-width: 768px) {
	.submenu ul.dropdown-menu li a {
		color: white !important;
	}
	
	.submenu ul.nav.navbar-nav li.dropdown.open a.dropdown-toggle {
		color: #151615;
	}
	
	div.title-site {
		font-size: 2em;
		line-height: 1em;
		padding-top: .6em;
		padding-bottom: .6em;
	}
}
