html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section, 
div{
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;	
}

audio,
canvas,
video {
	display: inline-block;
	max-width: 100%;
}

html {
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body,
button,
input,
select,
textarea {
	color: #555;
	font-family: 'Times New Roman', Times, Serif;
	font-size: 14px;
	/*line-height: 1.8;*/
	outline: none;
}

input:invalid {
	box-shadow: none;
}

body {
	background: #fff;
}

a {
	color: #318ce7;;
	text-decoration: none;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
	text-decoration: none;
	color: #963;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-weight: 600;
	margin: 20px 0 12px;
	color: inherit;
}

h1 {
	font-size: 36px;
	line-height: 1.1;
}

h2 {
	font-size: 30px;
	line-height: 1.1;
}

h3 {
	font-size: 24px;
	line-height: 1.1;
}

h4 {
	font-size: 20px;
	line-height: 1.1;
}

h5 {
	font-size: 18px;
	line-height: 1.1;
}

h6 {
	font-size: 16px;
	line-height: 1;
}

h1 strong,
h2 strong,
h3 strong,
h4 strong,
h5 strong,
h6 strong {
	color: #963;
}

address {
	font-style: italic;
	margin-bottom: 24px;
}

abbr[title] {
	border-bottom: 1px dotted #2b2b2b;
	cursor: help;
}

b,
strong {
	font-weight: 700;
}

cite,
dfn,
em,
i {
	font-style: italic;
}

mark,
ins {
	background: #963;
	text-decoration: none;
}

p {
	margin-bottom: 30px;
	line-height: 1.6;
	letter-spacing: 0.3333px;
	max-width: 1080px;
}

code,
kbd,
tt,
var,
samp,
pre {
	font-family: monospace, serif;
	font-size: 14px;
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	line-height: 1.6;
}

pre {
	border: 1px solid rgba(0, 0, 0, 0.1);
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 12px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

blockquote,
q {
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}

blockquote {
	font-size: 19px;
	font-style: italic;
	font-weight: 300;
	line-height: 1.2631578947;
	margin-bottom: 24px;
}

blockquote cite,
blockquote small {
	color: #2b2b2b;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

blockquote em,
blockquote i,
blockquote cite {
	font-style: normal;
}

blockquote strong,
blockquote b {
	font-weight: 400;
}

blockquote {
	border: 0;
	position: relative;
	font-family: Georgia, serif;
}

blockquote p {
	padding: 20px 0 0 48px;
}

blockquote p:before {
	content: "\201C";
	display: block;
	font-size: 84px;
	line-height: 1;
	position: absolute;
	left: 0;
	top: 0;
}

blockquote footer {
	padding-left: 20px;
}

small {
	font-size: smaller;
}

big {
	font-size: 125%;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

dl {
	margin-bottom: 24px;
}

dt {
	font-weight: bold;
}

dd {
	margin-bottom: 24px;
}

ul,
ol {
	list-style: none;
	margin: 0 0 24px 20px;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin: 0 0 0 20px;
}

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	vertical-align: middle;
	max-width: 100%;
	height: auto;
}

figure {
	margin: 0;
}

fieldset {
	border: 1px solid rgba(0, 0, 0, 0.1);
	margin: 0 0 24px;
	padding: 11px 12px 0;
}

legend {
	white-space: normal;
}

button,
input,
select,
textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	font-size: 100%;
	margin: 0;
	max-width: 100%;
	vertical-align: baseline;
}

button,
input {
	line-height: normal;
}

input,
textarea {
	background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); /* Removing the inner shadow, rounded corners on iOS inputs */
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
input[disabled] {
	cursor: default;
}

input[type="checkbox"],
input[type="radio"] {
	padding: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

table,
th,
td {
	border: 1px solid rgba(0, 0, 0, 0.1);
}

table {
	border-collapse: separate;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin-bottom: 24px;
	width: 100%;
}

th,
td {
	padding: 6px;
}

caption,
th,
td {
	font-weight: normal;
	text-align: left;
}

th {
	border-width: 0 1px 1px 0;
	font-weight: bold;
}

td {
	border-width: 0 1px 1px 0;
}

del {
	color: #767676;
}

hr {
	background-color: rgba(0, 0, 0, 0.1);
	border: 0;
	height: 1px;
	margin-bottom: 23px;
}

::selection {
	background: #963;
	color: #fff;
	text-shadow: none;
}

::-moz-selection {
	background: #963;
	color: #fff;
	text-shadow: none;
}

:hover {
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease; 
	transition: all 0.2s ease;
}

.required {
	color: #F00;
}

.clear {
	clear: both;
}

nav li {
	list-style-type: none;
}

/*** FORM ***/

.form-control,
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
	border-radius: 0;
	text-shadow: none;
	box-shadow: none;
}

.form-control:focus,
select:focus,
input:focus,
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
    border-color: #963;
    box-shadow: none;
}

.comment-reply-link {
	float: right;
	margin-right: 5px;
}

.comment-edit-link,
.comment-reply-link {
	font-style: italic;
	text-transform: uppercase;
}

.form-submit .submit {
	color: #fff;
	background-color: #000;
	width: 100%;
	border: none;
	padding: 8px 20px;
	border-radius: 0;
	display: inline-block;
	text-align: center;
}

.form-control,
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
    border: 1px solid #666;
    padding: 5px;
    background-color: transparent;
}

input[type="submit"] {
    border: 1px solid #666;
    background-color: transparent;
    padding: 5px;
}

/*** END FORM ***/

body#manager{background-color: #eee;}
#manager .wrapper{
	position: relative;
	width: 90%;
	max-width:1600px;
	margin: 20px auto 0;
	border: 1px solid #ccc;
	overflow: hidden;
	background-color: #393939;
	padding-left: 50px;
	box-sizing: border-box;
}

.logo-box a{
	color: #318ce7;
	font-size: 3em;
	text-decoration: none;
}

nav#main_nav{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 50px; 
	background-color: #393939; 
}

nav#main_nav ul.blocks{
	padding: 0; 
	margin: 40px 0 0; 
	list-style: none; 
	width: inherit;
}

nav#main_nav li{ position: relative; line-height: 35px; font-size: 24px; width: 100%; text-align: center; padding: 0 10px; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
nav#main_nav li.clear{ border-top: 1px solid #696969; margin-top: 5px; padding-top: 5px;}
nav#main_nav li a{color:#aaaaacc;}
nav#main_nav li a:hover {color: #fff;}
nav#main_nav li span{display: none;}
nav#main_nav li.current{
	background-color: #318ce7;
}
nav#main_nav li.current a{
	color: #fff;
}
nav#main_nav li.current a::after{
	right: 0px;
	border: solid 8px transparent;
    border-right-color: transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right-color: #fff;
	top: 50%;
	margin-top: -8px;
}
nav#main_nav li i{
	display: inline-block;
	width: 30px;
}

@media only screen and (min-width: 1200px)  {
	#manager .wrapper{
		padding-left: 200px;
	}
	
	nav#main_nav{
		width: 200px;
	}
	
	nav#main_nav li{
		text-align: left;
	}
	
	nav#main_nav li span{
		position: relative;
		display: inline-block;
		font-size: 0.6em;
		line-height: 24px;
		top: -3px;
	}
}

#manager .btn{display: inline-block; background-color: #318ce7; padding: 5px 10px; color: #fff; font-weight: 500; letter-spacing: 2px; border: 2px solid #318ce7;}
#manager .btn:hover{background-color: #fff; padding: 5px 10px; color: #318ce7;}
header{position: relative;}
header .userbar{ padding: 5px 15px; background-color: #318ce7; color: #fff; border-bottom: 1px solid #ccc;}
header .userbar .logout{float: right; color: #fff;}
header .userbar .logout:hover span{text-decoration: underline;}
header a#website-link{position: absolute; top: 0px; right: 0px; color: #318ce7; font-size: 12px; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 5px; display: block;}
header a#website-link:hover{font-size: 13px; box-shadow: 1px 2px 5px #ccc;}
header .top-bar{display: block; background-color: #fff; padding-bottom: 5px;}
header .top-bar-center{margin: 0 auto; float: none; clear: both; text-align: center;}
header .top-bar-center{width: 300px;}

#manager footer{margin-top: 20px; background-color: #318ce7; color: #fff; padding: 10px 20px;}
#manager footer a{font-weight: bold; color: #fff; border-bottom: 1px dotted #fff;}
#manager footer p{line-height: 40px;}
#manager footer i{font-size: 16px;}

h2{margin: 20px 0 35px;}
h3{clear: both; float: none; margin: 20px 0 5px;}
hr{clear: both;}
*[onclick]:hover {cursor:pointer;}
.error{color: #c00; border: 1px solid #c00; background-color: #ffefef; padding: 5px 10px;}
.metadata{color: #999; font-size: 11px; margin: 10px 0 0;}
#searchArea{border-top: 1px solid #eee; border-left: none; border-bottom: none; border-right: none; background-color: none;}
#searchArea.bordered{border: 1px solid #318ce7;; background-color: #f8f3f1; padding: 10px;}
#searchArea input{background-color: #fff;}
#searchArea legend{background-color: #fff; padding: 2px 15px; border: 1px solid #eee;}
#searchContent{display: none;}
.notice{font-size: 12px; font-family: 'FontSwiss', 'Open Sans', sans-serif; display: block; position: absolute; top: -10px; right: -15px; border: 1px solid #c00; border-radius: 50%; width: 20px; height: 20px; line-height: 20px; background-color: #e00; color: #fff; text-align: center;}
.center{text-align: center;}
/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

.tooltip:hover{
	cursor: help;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 130px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 6px;
  right: 0;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}
#login{
	width: 350px;
	margin: 50px auto;
	border: 1px solid #ccc;
	box-shadow: 0 0 5px #393939;
	padding: 10px 15px;
	overflow: hidden;
}

#login h2{
	margin: 5px 0;
	text-align: center;
}

.ctable .sous_categorie{
	color: #999;
}

.ctable .metadata{
	background-color: #eee;
}

.ctable td{
	position: relative;
}

.ctable td.txtsmall{
	font-size: 11px;
}

.ctable .reseaux{
	position: absolute;
	bottom: 5px;
	left: 5px;
	color: #999;
	font-size: 1em;
}

.ctable .reseaux a{
	color: #CBA;
}

.ctable .reseaux a:hover{
	color: #963;
	font-size: 1.2em;
}

.ctable .operations{
	position: absolute;
	bottom: 5px;
	right: 5px;
	color: #999;
	font-size: 0.9em;
}

.ctable .operations a{
	
	color: #999;
}

.ctable .operations a:hover{
	color: #963;
}

.ctable .thumbnail{
	width: 50px;
}

.ctable .thumbnail img{
	max-width: none;
}

.ctable .statut{
	text-align: center;
}

.ctable .statut span{
	position: relative;
	text-indent: -99999px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: block;
	margin: 0 auto;
}

.ctable .statut span.sync{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 20px;
	height: 10px;
	background-color: #318ce7 !important;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	animation: blinker 2s linear infinite;
}

span.ArticleCamanMissing{
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #318ce7;
	animation: blinker 2s linear infinite;
	margin-right: 5px;
}

span.ArticleCamanMissing:hover{
	cursor: context-menu;
}

@keyframes blinker {
	0%{	opacity: 1;	}
	40%{ opacity: 1; }
	50% { opacity: 0; }
	60% { opacity: 1; }
	100% { opacity: 1; }
}

.ctable .statut span.sync:hover{
	cursor: context-menu;
}

.ctable .statut.Actif span{
	background-color: #3c3;
}
.ctable .statut.Inactif span{
	background-color: #d80;
}
.ctable .statut.Abandonne span{
	background-color: #c33;
}
.ctable th i{
	font-size: 1.2em;
}
.ctable th.libelle{
	min-width: 200px;
}
.ctable .valign-top{
	vertical-align: top;
}
.ctable .saction{
	width: 20px;
	text-align: right;
}

.row{
	clear: both;
	float: left;
	margin: 8px 0;
	width: 100%;
}

.row.important{
	background-color: #fcc;
	padding: 5px;
	border: 1px dashed #f99;
}

.row select,
.row input[type="text"],
.row input[type="tel"],
.row input[type="url"],
.row input[type="email"],
.row input[type="password"],
.row input[type="number"],
.row input[type="date"],
.row textarea{
	width: 100%;
	background-color: #fff;
}
.row input[readonly="readonly"], .row textarea[readonly="readonly"]{
	background-color: #eee;
}
.row input[type="submit"]{
	float: none;
	display: block;
	margin: 0 auto;
}

.row.tel_field label{
	width: 100%;
	display: inline-block;
}

.row.tel_field input[type="text"],
.row.tel_field input[type="tel"]{
	float: left;
	margin-right: 5px;
	width: 150px;
}

.livrLink{
	font-size: 22px;
}

.livrLink:hover i{
	color: #318ce7;
}

#cmdArtEditLine{
	background-color: #fff;
	padding: 5px;
	margin: 10px 0;
}

.editLine textarea{
	width: 100%;
	min-height: 100px;
}

#cmd_lines input{
	background-color: #fff;
}

#cmd_lines.edition tr:hover{
	cursor: pointer;
	background-color: #fff;
}

#cmd_lines tr.deleted td{
	background-color: #ccc;
	text-decoration: line-through;
}

section{ padding: 10px 15px; overflow: hidden; background-color: #fff; min-height: 450px;}
section ul.blocks{list-style: none; padding: 0 10px 0 0; margin: 10px 0; overflow: hidden;}
section ul.blocks li{list-style: none; display: inline-block; float: left; width: 229px; border: 1px solid #ccc;  padding: 20px; text-align: center; margin: 10px 0 10px 10px; box-sizing: border-box;}
section ul.blocks li.clear{clear: all; float: left;}
section ul.blocks li a{display: inline-block; width: 100%;}
section ul.blocks li i{font-size: 50px;}
section ul.blocks li i{position: relative;}
section .newrecord, section .recordDetails{position: relative; width: 100%; max-width: 600px; margin: 0 auto; border: 1px solid #318ce7; overflow: hidden; padding: 10px 15px;background-color: #f8f3f1;}
section .col2{max-width: none;}
section .col2 .column{width: 50%; box-sizing: border-box; float: left; min-width: 400px; padding: 0 15px; margin: 20px 0 0;}
section .col2 .columnA{background-color: #ffffee; clear: both; float: left;}
section .col2 .columnB{background-color: #eeeeff;}
section .col2 .columnC{background-color: #eeffee; margin-top: 0;}
section .col2 .fullSizeColumn{width: 100%; background-color: #eeffff; clear: both; float: left; margin: 20px 0 5px; padding: 10px 20px;}
section .recordDetails h3, section .recordDetails h4{ clear: none; float: none; margin: 10px 0 5px;}
section .recordDetails h3:hover{cursor: pointer;}
section .recordDetails h3 .title{display: block;}
section .recordDetails h3 a{font-size: 12px;}
section .recordDetails h3 .editRecord{display: none;}
section .recordDetails h3:hover .title{display: none;}
section .recordDetails h3:hover .editRecord{display: block;}
section .recordDetails span.cmd_prix_qt{ display: inline-block; width: 100%;}
section .recordDetails span.cmd_qt{ display: inline-block; width: 30%; box-sizing: border-box; padding: 5px 10px; text-align: right;}
section .recordDetails span.cmd_prix{ display: inline-block; width: 70%; box-sizing: border-box; padding: 5px 10px;}
section .newrecord h2{clear: none; float: none;}

input.error{font-weight: bold; color: red; text-decoration: underline;}
input.verified{font-weight: normal; color: green; text-decoration: none;}
.article_match_libelle{font-style: italic;}

span.icon{
	position: relative;
	float: right;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 1px solid #ccc;
	text-align: center;
	background-color: #fff;
	line-height: 100px;
	font-size: 24px;
	color: #696969;
	overflow: hidden;
}
span.icon i{
	line-height: 100px;
	color: #ccc;
	font-size: 70px;
}
span.icon#imgaction-area i{
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	text-align: center;
	background-color: rgba(255,245,245,.8);
	color: #cc0000;
	font-size: 35px;
}
span.icon#imgaction-area:hover{
	border: 1px solid #c00;
}
span.icon#imgaction-area:hover i{
	display: block;
	cursor: pointer;
}
span.icon img{
	line-height: 100px;
}
table.infos{
	clear: right;
	float: left;
	border: none;
	margin: 20px 0;
}
table.infos td{
	border: none;
}
table.infos.stocks{
	border-collapse: collapse;
}
table.infos.stocks th{ font-size: 1.2em;}
table.infos.stocks th, table.infos.stocks td{
	border: 1px solid #ddd;
	text-align: center;
}
table.suivi td{
	background-color: #faf8f7; border-top: 1px solid #eee; border-bottom: #eee;
}
table.suivi tr:hover td{
	background-color: #fff;
	cursor: pointer;
}
table.infos td.key{width: 30%; text-align: right; color: #999; font-size: 12px; line-height: 14px;}
table.infos td.value{width: 70%; text-align: left; color: #434343; font-size: 14px; line-height: 18px; overflow: hidden;}
table.infos tr.hr td{border-bottom: 1px solid #ccc; padding: 0;}
table.infos td.none{text-align: center;}
table.infos td.key span.method{display:block; float: left; color: #393939; font-size: 20px;}
table.infos .socialnetworks a{font-size: 22px; margin-right: 5px;}
div.update{float: left; border: 1px solid #ccc; background-color: #fff; width: 100%; padding: 10px 15px;}
table.suivi td.value .edit{display:none;}
table.suivi td.value .edit span{display: block; overflow: hidden; font-size: 0.9em; margin: 5px 0;}
/*#newCat{display: none;}*/
span.tag{
	display: inline-block;
	border: 1px solid #ccc;
	background-color: #eee;
	border-radius: 5px;
	padding: 2px 5px;
	margin: 5px 2px 0 0;
	font-size: 0.8em;
	white-space: nowrap;
}

.compatibility-table{
	border: none;
}

.infos .compatibility-table td{
	background-color: #fef9f7;
}

.infos .compatibility-table tr:hover td{
	background-color: #fff;
}

.compatibility-table th,
.compatibility-table td{
	border: 1px solid #ccc;
}

.infos .compatibility-table td{
	border-bottom: 1px solid #f8f3f1;
}

/* FORM IMAGE UPLOAD */
#drop-area
{
 	background-color:white;
 	border:3px dashed grey;
}
/* END FORM IMAGE UPLOAD */



/* ********** DASHBOARD ********** */ 
#dashboard .tuile{
	display: inline-block;
	float: left;
	border: 1px solid #318ce7;
	padding: 5px;
	background-color: #ffe6da;
	width: 440px;
	height: 320px;
	overflow: hidden;
	margin-right: 15px;
	margin-bottom: 15px;
}

#dashboard .tuile h3{
	font-size: 14px;
	margin: 5px 5px 10px;
}

#dashboard .tuile_content{
	background-color: #fff;
	width: 100%;
	height: 275px;
	overflow: scroll;
}

#dashboard .tuile_content th{
	position: sticky;
	top: 0;
	background-color: #eee;
	z-index: 10;
}

#dashboard .tuile span.date{
	font-size: 0.9em;
	color: #696969;
}

/* ************ TABS ************** */
 /* Style the tab */
.tabs_content{
	margin: 10px 5px;
}

.tabs {
  overflow: hidden;
  border: 1px solid #696969;
  background-color: #b2cce7;
}

/* Style the buttons that are used to open the tab content */
.tabs button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tabs button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tabs button.active {
  background-color: #318ce7;
  color: #fff;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
  background-color: #fff;
  overflow: hidden;
} 

.tabcontent {
  animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}