/*------------------*/
/* carto-debits CSS */
/*------------------*/

@import url(../font/openSans/open_sans.min.css);
/*@import url(https://www.free.fr/carte_fibre_7434040c614d5e3fcd32df76bdccdc57/font/openSans/open_sans.min.css);*/

:root { --max-width: 1200px; --max-height: 700px; }

/* Empecher la selection sur un objet de la page */
/*
*, html, body{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
*/

body {
	font-family:'Open Sans',Sans-Serif!important;
	font-weight:100;
	/*font-size: 16px !important;*/
	margin           : 0;
	padding          : 0;
}

input {
	font-family:'Open Sans',Sans-Serif!important;
	font-weight:100;
	/*font-size: 16px !important;*/
}


input[type=button]{
	-webkit-appearance: none;
	-moz-appearance: none;
	-appearance: none;
	border-radius: 0;
}

input[type=submit]{
	-webkit-appearance: none;
	-moz-appearance: none;
	-appearance: none;
	border-radius: 0;
}


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

/*--------------*/
/* MAIN (START) */
/*--------------*/

.scroll-invisible {
   overflow-y: scroll;
   overflow-y: -moz-scrollbars-none;
   scrollbar-width: thin;
   scrollbar-width: none;
   -ms-overflow-style: none;
}

.scroll-invisible::-webkit-scrollbar {
    display: none;
}

/* CONTAINER (START) */

#container {
	display: block;
	position: absolute;
	max-height: var(--max-height);
	max-width: var(--max-width);
	/*
	max-height: 100%;
	max-width: 100%;
	*/
}

.container {
	display: block;
	position: absolute;
	height: 100%; /*670px ;*/
	width: 100% ;
	border: 0px solid #F1F1F1;
	/* background: #ffffff; */
	background: #F5F5F5;
}

/* CONTAINER (END) */

/* MAP_HEADER(START) */

#map-header {

	position: absolute;
	top: 0px;
	left: 0px;
	max-height: var(--max-height);
	max-width: var(--max-width);
	width: 100%;
	height: 30px;
	display: inline-flex;
	border-top: 2px solid #F5F5F5;
	border-bottom: 2px solid #F5F5F5;
	padding: 0px;

}

input#map-search-input[type=text]{
	padding: 0px 0px 0px 5px;
}

#map-search-input::placeholder {
	color : black ;
	background-color : #FFFFFF ;
}

#map-search {
	
padding: 4px;
background-color: #F5F5F5;

}

#div-mh-xdsl-fibre {
	position: absolute;
	top: 30px;
	left: 10px;
	padding: 0px 0px 0px 0px;
	text-align: center;
	font-size: 12px;
	font-weight: 400;
	align-items: center;
	color: white;
	display: flex;
}

/* MAP_HEADER(END) */

/* BOTTOM-INFO(START) */

#bottom-info {

	display: inline-flex;
	position: absolute;
	bottom: 0px;
	height:15px;
	width: inherit;

	padding: 0px 0px 0px 0px;
	border: 0px solid #F1F1F1;
	border-top: 1px solid black;

	font-size: 9px;
	font-weight: 400;
	justify-content: center;

	color: black;
	background-color: #F5F5F5;
}

/* BOTTOM-INFO(END) */

/* LEFT (START) */

#left {

	display:none;
	position: absolute;
	z-index: 2;

	width: 250px ;
	height: 100%;
	float: left;
	padding: 0 30px;
	margin-left:0px;
	margin-right:0px;
	background-color: rgb(245, 245, 245);
	background-color: #F5F5F5;

/*
	overflow-y: scroll;
	overflow-y: -moz-scrollbars-none;
	scrollbar-width: thin;
	scrollbar-width: none;
	-ms-overflow-style: none;
*/
}

/*
#left::-webkit-scrollbar {
    display: none;
}
*/

#left-arrow {
	display: inline-flex;
	position: absolute;
	z-index: 2 ;

	top: calc(calc(100% /2) - 40px);
	left: calc(250px + 60px - 23px);
	max-width: 25px;
	max-height: 85px;
	background: #555;
	border: 1px solid black;
	border-radius: 5px 0px 0px 5px;

	box-shadow : 
		0 3px 5px  -1px rgba(0,0,0,.2),
		0 6px 10px  0px rgba(0,0,0,.14),
		0 1px 18px  0px rgba(0,0,0,.12);
}

#center-arrow {
	display: inline-flex;
	position: absolute;
	z-index: 1 ;

	top: calc(calc(100% /2) - 40px);
	/* left: 3px; */
	max-width: 30px;
	max-height: 85px;
	background: #555;
	border: 1px solid black;
	border-radius: 0 5px 5px 0;

	box-shadow : 
		0 3px 5px  -1px rgba(0,0,0,.2),
		0 6px 10px  0px rgba(0,0,0,.14),
		0 1px 18px  0px rgba(0,0,0,.12);
}


/* LEFT (END) */

/* CENTER (START) */

.center {
	position: absolute;
	height: 100%;
	width: 100%;
	border: 0px solid #F1F1F1;
	display: inline-block;
	clear: both;
	margin-top:0px;
}

/* CENTER (END) */

/* RIGHT (START) */

#right {
	display: none;
}

/* RIGHT (END) */

/*------------*/
/* MAIN (END) */
/*------------*/

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

/* POPUP_TAG (START) - MENU LEFT (Tag Legende) */

.tag-popup {
	/*width: 250px;*/
	padding: 12px;
}

.tag-popup .tag-container {
	position: relative;
	background-color: #FFF;
	border: 1px solid #bbc0c4;
	padding: 16px 16px 16px 16px;
	font-size: 12px;
}

.tag-popup .tag-popup-arrow:before {
	position: absolute;
	content: '';
	background: #FFF;
	border: 1px solid #bbc0c4;
	border-bottom: none;
	border-right: none;
	top: -6px;
	left: -6px;
	width: 12px;
	height: 12px;
}

.tag-popup .tag-popup-arrow {
	display: block;
	transform: rotate(45deg);
	top: -1px;
}

.tag-popup .tag-popup-arrow {
	position: absolute;
	display: block;
	right: 10%;
}

#tag-legende-close.close-box {
	right: 10px;
	top  : 10px;
}

#tag-legende-close.close-box:before {
   height: 9px;
}

#tag-legende-close.close-box:after {
   height: 9px;
}

/* POPUP_TAG (END) */

/* POPUP_INFO (START) */

/* Popup container */
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.legende-fibre-departement .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 80px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

/* Popup arrow */
.legende-fibre-departement .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class - hide and show the popup */
.legende-fibre-departement .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

/* POPUP_INFO (END) */

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

#title {
	font-size: 20px;
	font-weight: 400;
	margin-left: 0px;
	color: rgb(204, 0, 0);
	color: #CC0000;
	margin: 0 0 23px 0;
	padding: 5px 0 0 0;
}

.header {
	position: relative;
	height:80px;
	width:720px;
	border: 0px solid #F1F1F1;
	background: #ffffff;
}

.search {
	display: flex;
	position: relative;
	width: 100%;
	top: 0px;
	border: 0px solid #F1F1F1;
	background-color: rgb(245, 245, 245);
	background-color: #F5F5F5;
}

.div-xdsl-fibre {
	display: block;
	position: relative;
	height:60px;
	width:100%;
	top: 0px;
	border: 0px solid #F1F1F1;
}

.ul-xdsl-fibre {
	display: block;
	list-style-type: none;

	margin-left: 0px;
	margin-right: 0px;

	padding: 0px;
}

li#li-fibre {
	list-style-type: none;
	float: left;
	width:calc((100% / 3) - 20px);
	text-align: center;
	padding:10px;
	margin-left:0px;
	border-radius: 6px 0px 0px 6px;

	background-color: rgb(204, 0, 0);
	background-color: #CC0000;
	color: white;
	font-weight: 400 ;
}

li#li-xdsl {
	list-style-type: none;
	float: left;
	width:calc((100% / 3) - 20px);
	text-align: center;
	padding:10px;
	margin-right:0px;
	border-radius: 0px;
	background-color: white;
	color: #c1c1c1;
	font-weight: 400 ;
}

li#li-4gbox {
	list-style-type: none;
	float: left;
	width:calc((100% / 3) - 20px);
	text-align: center;
	padding:10px;
	margin-right:0px;
	border-radius: 0px 6px 6px 0px;
	background-color: white;
	color: #c1c1c1;
	font-weight: 400 ;
}

span#span-xdsl-fibre:visited {color:#FFFFFF;background-color:#4CAF50}


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

.mh-xdsl-fibre {
	display: block;
	position: relative;
	height:12px;
	width:100%;
	top: 0px;
	border: 0px solid #F1F1F1;
	font-size: 10px;
}

.ul-mh-xdsl-fibre {
	display: block;
	list-style-type: none;

	margin-left: 0px;
	margin-right: 0px;

	padding: 0px;
}

li#li-mh-fibre {
	list-style-type: none;
	/*float: left;*/
	text-align: left;
	padding:6px;
	margin:0px 0px ;
	margin-left:0px;
	border-radius: 6px 6px 0px 0px;

	background-color: rgb(204, 0, 0);
	background-color: #CC0000;
	color: white;
	font-weight: 400 ;
}

li#li-mh-xdsl {
	list-style-type: none;
	/*float: right;*/
	text-align: left;
	padding:6px;
	margin:0px 0px ;
	margin-right:0px;
	border-radius: 0px;

	background-color: white;
	color: #c1c1c1;
	color: #777777;
	font-weight: 400 ;
}

li#li-mh-4gbox {
	list-style-type: none;
	/*float: right;*/
	text-align: left;
	padding:6px;
	margin:0px 0px ;
	margin-right:0px;
	border-radius: 0px 0px 6px 6px;

	background-color: white;
	color: #c1c1c1;
	color: #777777;
	font-weight: 400 ;
}


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

.map-partial {
	position: relative;
	width:100% ;
	height:100%;
	
	border: 0px solid #F1F1F1;
	display: inline-block;
	clear: both;
	margin-top:0px;
}

.map {
	position: absolute;
	width: 100% ;
	height: 100% ;
	
	border: 0px solid #F1F1F1;
	display: inline-block;
	clear: both;
	margin-top:0px;
}

#map {
	position: absolute;
	width: 100% ;
	height: 100% ;
	
	border: 0px solid #F1F1F1;
	display: inline-block;
	clear: both;
	margin-top:0px;
}

#legende {
	position: relative;
	width: 100%;

	left:0px;
	border: 1px solid #F1F1F1;
	background-color:rgb(255, 255, 255);
	background-color: #F5F5F5;
	display: block;
	clear: both;
	margin-left:0px;
	margin-right:0px;
	padding:0px;
	box-shadow: 4px 4px 6px #F1F1F1;
	font-size: 12px;
}

.release-info {
	top: 10px;
	position: relative;
}

.adresse-technical-info {
	font-size: 10px ;
}

.adresse-extra-info {
	font-size: 10px ;
}

.zone-info {
	display: block;
	position: relative;
	border: 1px solid #F1F1F1;
	clear: both;
	margin-top: 0px;
	box-shadow: 4px 4px 6px #F1F1F1;
	font-size: 12px;
}

#span-header {
	font-size: 18px;
	font-weight: 500;
}

.span-note {
	font-size: 10px;
}

span#span-search-input {
}

input#search-input {
	width: 100%;
	margin-left: 0px;
}

img#search-innerImage {
width:24px;
height:100%;
padding:4px;
position:relative;
background: #CC0000 ;
background: rgb(204, 0, 0);
background: #CC0000;
opacity: 1;
}

img#search-innerImage:hover {
	background: #CC0000 ;
	background: rgb(204, 0, 0);
	_opacity: 0.7;
}

img#title-innerImage {
width:24px;
height:24px;
position:relative;
top:5px;
right:0px;
display:true;
}

.geoloc {
	position: relative;
	height: 40px;
	width: 100%
	top: 0px;
	border: 0px solid #F1F1F1;
	background-color: rgb(245, 245, 245);
	background-color: #F5F5F5;
}

img#geoloc-innerImage {
width:24px;
height:24px;
position:absolute;
top:8px;
right:0px;
display:true;
}

#map-info {
   position: absolute;
   top: 90px;
	height: 400px ;
	width: calc(calc( 100% / 6) * 4);
	left: calc(100% / 12);
   padding: 20px;
   display: block;
   background-color: #F5F5F5;
   font-size: 14px;

/*
   overflow-y: scroll;
   overflow-y: -moz-scrollbars-none;
   scrollbar-width: thin;
   -ms-overflow-style: none;
*/
}

/*
#map-info:-webkit-scrollbar {
    display: none;
}
*/

/*
#map-info {
   overflow-y: scroll;
   overflow-y: -moz-scrollbars-none;
   scrollbar-width: thin;
   scrollbar-width: none;
   -ms-overflow-style: none;
}

#map-info::-webkit-scrollbar {
    display: none;
}
*/

#map-info-close {
   position: absolute;
   display: block;
}

#map-info-adresse {
   position: absolute;
   top: 40px;
	min-width: 200px;
	max-width: 265px;
	min-height: 200px;
	max-height: 500px;
	left: calc(100% / 12);
	/*padding: 0px 0px 0px 0px;*/
   padding: 10px 20px 10px 5px;
   display: block;
   background-color: #FFFFFF;
	border: 1px solid #F1F1F1;
   font-size: 14px;
}

#map-info-adresse-close {
   position: absolute;
   display: block;
}

#map-link {
	position: absolute;
	top: 90px;
	width: calc(calc( 100% / 6) * 4);
	left: calc(100% / 12);
	padding: 20px;
	display: block;
	background-color: #F5F5F5;
	font-size: 14px;
}

#map-link-close {
	position: absolute;
	display: block;
}

.map-link-url {
	background-color: #c9c9c9;
	border: 1px solid #CC0000;
}

.map-link-url textarea {
    flex-grow: 1;
    border: 0;
    margin: 0;
    outline: 0;
    padding: 10px 15px;
    background: #c9c9c9;
    color: #475b6f;
    font-size: 12px;
    line-height: 18px;
}

/* CLOSE-BOX (START) :: Close popup */

.close-box {
	position: absolute;
	right: 15px;
	top: 15px;
	width: 13px;
	height: 13px;
	opacity: 0.3;
}
.close-box:hover {
  opacity: 1;
}
.close-box:before, .close-box:after {
	position: absolute;
	top: -4px;
	right: 2px;
	content: ' ';
	height: 13px;
	width: 2px;
	background-color: #333;
}
.close-box:before {
	transform: rotate(45deg);
}
	.close-box:after {
	transform: rotate(-45deg);
}

/* CLOSE-BOX (END) */

/* INPUT-STYLED (START) :: POPUP (S'abonner, Se tenir informé) */

.search-innerImage {
	margin-left: 2px;
	margin-top: 2px;
	width:  36px;
	height: 19px;
	background-image: url("img/search22.png");
}

.input-styled {
	width: 100% ;
	border: 0;
	line-height: 2.5;
	padding: 0 20px;
	font-size: 10px;
	text-align: center;
	color: #fff;
	background-color: rgba(220, 0, 0, 1);
}

.input-styled:hover {
	background-color: rgba(255, 0, 0, 1);
}


/* INPUT-STYLED (END) :: POPUP (S'abonner, Se tenir informé) */

/* PANEL (START) :: Right Button (center, geoloc, link, info) */

#panel-opt {
	position : absolute ;
	right    : 1px ;
	top      : 130px;
	width    : 40px;
	height   : 120px;
}

.panel-box {
	display : table ;
	width   : 30px ;
	height  : 30px ;
	margin  : 4px 1px ;
	border-radius  : 4px ;
	background : rgb(245, 245, 245) ;
	background : #F5F5F5 ;
	box-shadow : 
		0 3px 5px  -1px rgba(0,0,0,.2),
		0 6px 10px  0px rgba(0,0,0,.14),
		0 1px 18px  0px rgba(0,0,0,.12);
}

.panel-box {
	font-size : 16pt;
	font-weight: bold;
	text-align : center;
}

.panel-box:hover {
	background: #c9c9c9 ;
}

#panel-zoom {
	position : absolute ;
	right    : 8px ;
	top      : 120px;
	width    : 50px;
	height   : 120px;
}

.panel-zoom {
	display : table ;
	width   : 30px ;
	height  : 30px ;
	margin  : 5px ;
	border : 4px solid #d1d1d1 ;
	border-radius  : 4px ;
	background-color : rgb(245, 245, 245) ;
	background-color : #F5F5F5 ;
}

.panel-zoom {
	font-size : 16pt;
	font-weight: bold;
	text-align : center;
}

img.panel-img {

	display : block ;
	margin-left : auto ;
	margin-right : auto ;
	padding : 1px ;
	width : 80% ;
	height : 80% ;
}


/* PANEL STOP :: Right Button (center, geoloc, link, info) */

/* TAB-STYLED (START) :: Style the tab-styled */

.tab-styled {
	overflow: hidden;
	border-bottom: 1px solid #ccc;
	background-color: #F5F5F5;
	font-size: 10px;
}

.tab-styled button {
	background-color: inherit;
	float: left;
	border: none;
	outline: none;
	cursor: pointer;
	/* padding: 14px 16px; */
	padding: 5px 10px;
	transition: 0.3s;
	font-size: 17px;
}

/* Change background color of buttons on hover */
.tab-styled button:hover {
	border-bottom: 3px solid #CC0000;
	opacity: 0.5;
}

/* Create an active/current tablink class */
.tab-styled button.active {
	border-bottom: 3px solid #CC0000;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border-top: none;
}

/* TAB-STYLED (END) */

.legende-selector {
	 margin: 0px 10px;
	 margin: 0px 0px;
    font-size: 8px;
}

.selector-up{
	display: inline-block;
	height: 0;
	border-right : 1em solid transparent;
	border-bottom : 1em solid rgba(85, 85, 85, 0.8);
	border-bottom : 1em solid rgba(110, 198, 141, 0.8);
	border-bottom : 1em solid rgba(32, 117, 97, 0.8);
	border-bottom : 1em solid #c1c1c1 ;
	border-left : 1em solid transparent;
}
.selector-down{
	display: inline-block;
	height: 0;
	width: 0;
	border-top: 1em solid rgba(204, 0, 0, 1);
	border-top: 1em solid #555 ;
	border-right: 1em solid transparent;
	border-left: 1em solid transparent;
}

.selector:hover{
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   transform: rotate(180deg);

}
.selector1 {
	margin: 0px 10px;
	font-size: 12px;

	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}

.selector1.active {
	margin: 0px 10px;
	font-size: 12px;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	transform: rotate(-90deg);
}

/* MOBILE MEDIA (START) */

/* MEDIA (START) :: PORTRAIT */

@media only screen and (orientation: portrait) and (max-width: 659px) {

	body {
		font-family:'Open Sans',Sans-Serif!important;
		font-weight:100;
		height           : 100%
		margin           : 0;
		padding          : 0;
		width            : 100%;
	}

	#container {
		display: block;
		position: absolute;
		height: 100%;
		width: 100%;
		background: #ffffff;
	}

	#left {
		display:none;
		position: absolute;
		z-index: 2 ;

		height:100%;
		width: calc(100% - 60px);
		float: left;
		padding: 0px 30px;

		margin-left:0px;
		margin-right:0px;
		background-color: rgb(245, 245, 245);
/*
		overflow-y: scroll;
		overflow-y: -moz-scrollbars-none;
		scrollbar-width: thin;
		-ms-overflow-style: none;
*/
	}
/*
	#left::-webkit-scrollbar {
		 display: none;
	}
*/
	#left-arrow {
		display: inline-flex;
		position: absolute;
		z-index: 2 ;
		width: 30px;

      top: calc(calc(100% / 2) - 40px);
		left: unset;
		right: 0px;
		height: 80px;
		background: #555;
		border: 1px solid black;
		border-radius: 5px 0px 0px 5px;
	}

	#center-arrow {
		display: inline-flex;
		position: absolute;
		z-index: 1;

      top: calc(calc(100% / 2) - 40px);
		left: 0px; 
		max-width: 30px;
		height: 80px;
		background: #555; 
		border: 1px solid black; 
		border-radius: 0 5px 5px 0;
	}

	#center {
		position: absolute;
		height:100%;
		width:100%;
		border: 1px solid #F1F1F1;
		display: inline-block;
		clear: both;
		margin-top:0px;
	}

	/* Style the tab */
	.tab-styled {
		overflow: hidden;
		border-bottom: 1px solid #ccc;
		background-color: #F5F5F5;
		font-size: 8px;
	}

	/* Style the buttons inside the tab */
	.tab-styled button {
		background-color: inherit;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 14px 16px;
		transition: 0.3s;
		font-size: 12px;
	}

}

/* MEDIA (END) :: PORTRAIT */

/* MEDIA (START) :: PAYSAGE */

@media only screen and (orientation: landscape) and (max-width: 659px) and (max-height: 1200px) and (min-height: 600px) {

	body {
		font-family:'Open Sans',Sans-Serif!important;
		font-weight:100;
		margin           : 0;
		padding          : 0;
	}

	#container {
		display: block;
		position: absolute;

		
		height: 100%;
		width: 100%;
	}

	#left {
		display: none ;
		position: absolute ;
		z-index: 2 ;

		width: calc( calc( calc(100% / 8 ) * 3 ) - 0px) ;
		height: 100%;
		float: left;
		padding: 0 30px;
		margin-left:0px;
		margin-right:0px;
		background-color: rgb(245, 245, 245);
/*
		overflow: auto;
*/
	}

   #left-arrow {
      display: inline-flex;
      position: absolute;
      z-index: 2 ;
      width: 30px;

      top: calc(calc(100% / 2) - 40px);
      left: unset;
      right: 0px;
      height: 80px;
      background: #555;
      border: 1px solid black;
      border-radius: 5px 0px 0px 5px;
   }

   #center-arrow {
      display: inline-flex;
      position: absolute;
      z-index: 1 ;

      top: calc(calc(100% / 2) - 40px);
      left: 0px;
      max-width: 30px;
      height: 80px;
      background: #555;
      border: 1px solid black;
      border-radius: 0 5px 5px 0;
   }

	#title {
		font-size: 20px;
		font-weight: 400;
		margin-left: 0px;
		color: rgb(204, 0, 0);
	}

	.center {
		position: absolute;
		width:100%;
		height:100%;
		border: 0px solid #F1F1F1;
		display: inline-block;
		clear: both;
		margin-top:0px;
	}

	.map-full {
		position: absolute;
		width:calc(100%);
		height:calc(100% / 1);

		border: 0px solid #F1F1F1;
		display: inline-block;
		clear: both;
		margin-top:0px;
	}

	#map-link {
		position: absolute;
		top: 50px;
		left: 20px; 
		width: 300px;
		padding: 20px;
		display: block;
		background-color: #F5F5F5;
		font-size: 10px;
	}

	/* Style the tab */
	.tab-styled {
		overflow: hidden;
		border-bottom: 1px solid #ccc;
		background-color: #F5F5F5;
		font-size: 8px;
	}  
		
	/* Style the buttons inside the tab */
	.tab-styled button {
		background-color: inherit;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 14px 16px;
		transition: 0.3s;
		font-size: 12px;
	}

}

/* MEDIA (END) :: PAYSAGE */

/* MOBILE MEDIA (END) */