/**********************************************************/
/*** COMMON - CHANGE ONLY IN CUSTOM AREA   ****************/
/**********************************************************/

html.metro-skin body {
  background-color: black;
}

/* MENU   */
html.metro-skin #subwrapper {
	padding-top: 0
}

html.metro-skin #navigation {
	margin-right: 0;
	margin-left: 0
}

/* Main menu Header */


html.metro-skin #metro-skin-nav {

  line-height: 1.35;
  padding-bottom: 10px;
  background-color: white;
}
html.metro-skin #metro-skin-nav  a {
    text-decoration: none;
    color: #272727;
    outline: none;
}

html.metro-skin #metro-skin-nav ul {
    display: table;
    margin: 0 auto;
    list-style: none;
}

html.metro-skin #metro-skin-nav ul{
	display: table;
	margin: 0 auto;
	
}
html.metro-skin #metro-skin-nav ul li{
	float:left;
}	
html.metro-skin #metro-skin-nav li a{
	display: block;
  font: normal 1em/1.334 Arial,sans-serif;
  padding: 5px;
  text-transform: uppercase;
}	


html.metro-skin #metro-skin-nav .level-1 {
	background-color:#f1f2f3;
	border-bottom: 5px solid #32b847
}

html.metro-skin #metro-skin-nav .level-1 li{
  margin: 0 0px;
  padding: 5px 15px;
}
html.metro-skin #metro-skin-nav li a {
    display: block;
    font: normal 1em/1.334 Arial,sans-serif;
    padding: 5px;
    text-transform: uppercase;
}


html.metro-skin #metro-skin-nav .level-1 .current a{
	font-weight:bold;
} 

html.metro-skin #metro-skin-nav .level-1 .current  {
	 position: relative;
} 

html.metro-skin #metro-skin-nav .level-1 .current:after{
	bottom: 0; 
	left: 50%;
	border: solid transparent; 
	content: " ";
	height: 0; 
	width: 0; 
	position: absolute; 
	pointer-events: none; 
	border-color: rgba(213, 213, 213, 0); 
	border-bottom-color: #32b847; 
	border-width: 10px;
	margin-left: -10px;
}

html.metro-skin #metro-skin-nav .closed{display:none;}


html.metro-skin #metro-skin-nav .level-2.closed {    
   height: 5px;
   overflow:hidden,
}


html.metro-skin #metro-skin-nav .level-2 {    
   background-color: #32b847;  
}

html.metro-skin #metro-skin-nav .level-2 li{
  text-align: center;
	width: 164px;
  white-space: nowrap
}


html.metro-skin #metro-skin-nav .level-2 li a {
	margin: 5px;  
	color:#fff ;
	text-transform: capitalize;
	font-family:verdana;
} 

html.metro-skin #metro-skin-nav  .level-2 a:hover , html.metro-skin #metro-skin-nav .level-2 .current a{
	font-weight: bold;
	border-radius: 5px;
	color:#fff ;
} 




/*  HEADER */

html.metro-skin #menu-button-wrapper  {
	top:  -4px;
}

html.metro-skin header {
	height: 239px;
	margin: 0;
}


html.metro-skin #header-links ul  {
	font-size:  inherit;
}
html.metro-skin  #header-links ul li{
	position:relative;
}
html.metro-skin  #header-links ul li.myhome a:before {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("/digitalmetrojs/skin/examens/picto_home.png");
    background-origin: padding-box;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 15px auto;
    content: " ";
    height: 18px;
    left: -21px;
    position: absolute;
    top: 0;
    width: 21px;
}

html.metro-skin #header-links a {
	color:  #ffffff;
	display:  block;
	padding:  0 0.5em;
	text-decoration:  none;
}

html.metro-skin #header-links  {
	min-width: 738px
	background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwcHgiIHN0b3AtY29sb3I9IiMwOTBhMGEiLz48c3RvcCBvZmZzZXQ9IjBweCIgc3RvcC1jb2xvcj0iIzI5MmQzMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFjMWUxZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==");
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0px, #090a0a), color-stop(0px, #292d30), color-stop(100%, #1c1e1f));
  background: -moz-linear-gradient(center top, #090a0a 0px, #292d30 0px, #1c1e1f 100%);
  background: -webkit-linear-gradient(center top, #090a0a 0px, #292d30 0px, #1c1e1f 100%);
  background: linear-gradient(to center bottom, #090a0a 0px, #292d30 0px, #1c1e1f 100%);
	z-index:  1;
	width:  100%;
	box-sizing: border-box;
	height: 25px;
	overflow: hidden;
	line-height: 20px;
}
html.metro-skin #ad12 {
  background-color:#fff;
	margin-top: 0
}
html.metro-skin.takeover-netbook {
	padding-top: 90px
}
html.metro-skin {
	background-color: #000;
  padding-top:0;
}
html.metro-skin #promos {
	display: none
}
html.metro-skin header .logotype { 	
  bottom: 9px;
  height: 166px;
  left: 24px;
  width: 350px;
}

html.metro-skin header .logotype a {
	width: 350px;
  height: 166px;
}

html.metro-skin #wrapper {
	background: 0 0;
	overflow: visible
}
html.metro-skin #ad12+#navigation {
	background: #FFF;
	margin: 0;
	padding: 0 12px
}
html.metro-skin #cp_backhomepage {
	font-weight: 700;
	left: 0;
	position: absolute
}
html.metro-skin #cp_backhomepage a>span {
	display: inline-block;
	font-size: 9px;
	font-weight: 700;
	margin-right: 2px
}
html.metro-skin #subwrapper {
	background: #fff
}


html.metro-skin #social-links {
	bottom: 48px;
  color: #ffffff;
  display: block;
  font-family: arial;
  font-size: 13px;
  font-weight: bold;
  right: 12px;
  text-align: center;
  width: 90px;
}



html.metro-skin #metro-skin-wrapper {
	background: none;
	position: absolute;
	width: 100%;
	height: 1500px;
	top: 25px;
	/*z-index: -1;*/
}

@media only screen and (min-width: 732px) and (max-width: 980px) {
	html.metro-skin .takeover-netbook #header-links {
		width: 762px;
		padding: .2em 0;
		margin: 0 auto;
	}

}

@media only screen and (min-width: 981px) {

	html.metro-skin .takeover-netbook #header-links {
		width: 981px;
		padding: .2em 0;
		margin: 0 auto;
	} 
	
}



@media only screen and (min-width: 981px) and (max-width: 1199px) {
	
	html.metro-skin #metro-wrapper {
		background: 0 0
	}
	
}


@media only screen and (min-width: 1200px) {
	html.metro-skin header {
		background-image: none;
		background-color: transparent
	}
	
	html.metro-skin.takeover-netbook #header-links {
		width: 981px;
		padding: .2em 0;
		margin: 0 auto;
	}
}




/***************************************/
/*** CUSTOM CATEGORY    ****************/
/***************************************/



/* EXAMENS */

html.metro-skin.examens body{ 
	background-color: #000;
}

html.metro-skin.examens header {
	background-image: url(/digitalmetrojs/skin/examens/headbg.jpg);
	background-repeat: no-repeat;
}

html.metro-skin.examens header .logotype a {
   background: url(/digitalmetrojs/skin/examens/metronews-examens.png) no-repeat;
   background-size: 350px auto;
}



html.metro-skin.examens #metro-skin-nav .level-1 .current:after {
	border-bottom-color:#910065
}
html.metro-skin.examens #metro-skin-nav .level-2 {
	background-color:  #910065
}


html.metro-skin.examens .takeover-netbook #metro-skin-wrapper {
	background: none;
}

html.metro-skin.examens .takeover-netbook header {
	background-image: url(/digitalmetrojs/skin/examens/headbg.jpg);
	background-repeat: no-repeat;
}


@media only screen and (min-width: 981px) {   }

@media only screen and (min-width: 981px) and (max-width: 1199px) { }


@media only screen and (min-width: 1200px) {	

	html.metro-skin.examens .takeover-netbook header {
		background-image: url(/digitalmetrojs/skin/examens/headbg.jpg);
		background-repeat: no-repeat;
	}
	
	html.metro-skin.examens header{
		background:none;
	}
	
	html.metro-skin.examens #metro-skin-wrapper {
		background: url("/digitalmetrojs/skin/examens/bg.jpg") center 0 no-repeat #000;
	}

}



/* ************** */
/* Sport ligue1   */
/* ************** */

html.metro-skin.ligue1 body{ 
	background-color: #000;
}

html.metro-skin.ligue1 header {
	background-image: url(/digitalmetrojs/skin/sport/ligue1/headbg-v2.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


html.metro-skin.ligue1 header .logotype a {
   background: url(/digitalmetrojs/skin/sport/metronews-sport.png) no-repeat;
   background-size: 400px auto;
}
html.metro-skin.ligue1 header .logotype a {
    height: 166px;
    width: 400px;
}

html.metro-skin.ligue1 header .logotype {
		bottom: 10px;
    height: 166px;
    left: -6px;
    width: 400px;
}



html.metro-skin.ligue1 #metro-skin-nav .level-1 .current:after {
	border-bottom-color:#32b847
}
html.metro-skin.ligue1 #metro-skin-nav .level-2 {
	background-color:  #32b847
}


html.metro-skin.ligue1 .takeover-netbook #metro-skin-wrapper {
	background: none;
}

html.metro-skin.ligue1 .takeover-netbook header {
	background-image: url(/digitalmetrojs/skin/sport/ligue1/headbg-v2.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


@media only screen and (min-width: 981px) {   
	
}

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

}


@media only screen and (min-width: 1200px) {	
	
	html.metro-skin.ligue1 .takeover-netbook header {
		background-image: url(/digitalmetrojs/skin/sport/ligue1/headbg-v2.jpg);
		background-repeat: no-repeat;
		background-size: auto 239px;
	}
	
	html.metro-skin.ligue1 header{
		background:none;
	}
	
	html.metro-skin.ligue1 #metro-skin-wrapper {
		background: url("/digitalmetrojs/skin/sport/ligue1/bg-v3.jpg") center 0 no-repeat #000;
	}

}

/* ************** */
/*  Rolland       */
/* ************** */

html.metro-skin.roland-garros header {
  height: 215px
}
    
html.metro-skin.roland-garros header {
	background-image: url(/digitalmetrojs/skin/sport/roland-garros/headbg.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


html.metro-skin.roland-garros header .logotype a {
   background: url(/digitalmetrojs/skin/sport/metronews-sport.png) no-repeat;
   background-size: 400px auto;
}
html.metro-skin.roland-garros header .logotype a {
    height: 166px;
    width: 400px;
}

html.metro-skin.roland-garros header .logotype {
    bottom: 10px;
    height: 166px;
    left: -1px;
    width: 400px;
}
html.metro-skin #social-links {
   bottom: 23px;
   
}


html.metro-skin.roland-garros #metro-skin-nav .level-1 .current:after {
	border-bottom-color:#32b847
}
html.metro-skin.roland-garros #metro-skin-nav .level-2 {
	background-color:  #32b847
}


html.metro-skin.roland-garros .takeover-netbook #metro-skin-wrapper {
	background: none;
}

html.metro-skin.roland-garros .takeover-netbook header {
	background-image: url(/digitalmetrojs/skin/sport/roland-garros/headbg.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


@media only screen and (min-width: 981px) { 
	html.metro-skin.roland-garros header {
	  height: 215px
	}
}

@media only screen and (min-width: 981px) and (max-width: 1199px) { 
	html.metro-skin.roland-garros header {
	  height: 215px
	}
}


@media only screen and (min-width: 1200px) {	
	html.metro-skin.roland-garros header {
	  height: 215px
	}
	html.metro-skin.roland-garros body{ 
		background-color: #D26B0F;
	}
	
	html.metro-skin.roland-garros body.takeover-netbook{ 
		background-color: #f4f2ee;
	}
	
	html.metro-skin.roland-garros .takeover-netbook header {
		background-image: url(/digitalmetrojs/skin/sport/roland-garros/headbg.jpg);
		background-repeat: no-repeat;
		background-size: auto 239px;		
	}
	
	html.metro-skin.roland-garros header{
		background:none;
	}
	
	html.metro-skin.roland-garros #metro-skin-wrapper {
		background: url("/digitalmetrojs/skin/sport/roland-garros/bg.jpg") center 0 no-repeat #000;
		height: 899px;;
	}

}




/* ************** */
/*  RUGBY       */
/* ************** */


    
html.metro-skin.rugby header {
	background-image: url(/digitalmetrojs/skin/sport/rugby/headbg.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


html.metro-skin.rugby header .logotype a {
   background: url(/digitalmetrojs/skin/sport/metronews-sport.png) no-repeat;
   background-size: 400px auto;
}
html.metro-skin.rugby header .logotype a {
    height: 166px;
    width: 400px;
}

html.metro-skin.rugby header .logotype {
    bottom: 10px;
    height: 166px;
    left: -1px;
    width: 400px;
}
html.metro-skin #social-links {
   bottom: 23px;
   
}


html.metro-skin.rugby #metro-skin-nav .level-1 .current:after {
	border-bottom-color:#32b847
}
html.metro-skin.rugby #metro-skin-nav .level-2 {
	background-color:  #32b847
}


html.metro-skin.rugby .takeover-netbook #metro-skin-wrapper {
	background: none;
}

html.metro-skin.rugby .takeover-netbook header {
	background-image: url(/digitalmetrojs/skin/sport/rugby/headbg.jpg);
	background-repeat: no-repeat;
	background-size: auto 239px;
}


@media only screen and (min-width: 981px) { 
	
}

@media only screen and (min-width: 981px) and (max-width: 1199px) { 
	
}


@media only screen and (min-width: 1200px) {	

	html.metro-skin.rugby body.takeover-netbook{ 
		background-color: #f4f2ee;
	}
	
	html.metro-skin.rugby .takeover-netbook header {
		background-image: url(/digitalmetrojs/skin/sport/rugby/headbg.jpg);
		background-repeat: no-repeat;
		background-size: auto 239px;		
	}
	
	html.metro-skin.rugby header{
		background:none;
	}
	
	html.metro-skin.rugby #metro-skin-wrapper {
		background: url("/digitalmetrojs/skin/sport/rugby/bg.jpg") center 0 no-repeat #000;
		height: 899px;;
	}

}