/*.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('../img/InternetSlowdown_Day.gif') 50% 50% no-repeat rgb(249,249,249);
}
*/


*{
	padding:0;
	margin:0;
	box-sizing: content-box;
}

body
{
	background-color: white;
	font-family: arial;
	font-size: 12px;
	line-height: normal;
	color: black;
}

#Inner
{
	margin-top: 15px;
}

#Container
{
	width: 1280px;
	margin: 0px auto;
}

.cleaner
{
    clear: both;
}

#Head
{
	height: 212px;
	width: 1280px;
	background: url("../img/bac_logo.gif") top left repeat-x;
}

#Head_left
{
	height: 212px;
	width: 324px;
	float: left;
}

#Leaf_top
{
    background: url("../img/leaf.gif") top left no-repeat;
    height: 161px;
    width: 324px;
	float: left;
}

#Leaf_bottom
{
	background: url("../img/leaf2.gif") top left no-repeat;
    height: 51px;
	float: left;
	width: 324px;
}

#Leaf_bottom a
{
	color: #6b9c22;
	text-decoration: none;
	font-weight: bold;
	line-height: 58px;
	font-size: 11px;
}

#Leaf_bottom a:hover
{
	text-decoration: underline;
}

.registration
{
	text-indent: 12px;
}

*>.registration
{
    margin-left: 12px;
}

.log-in
{
    margin-left: 40px;
}

*>.log-in
{
    margin-left: 52px;
}

#Head_right
{
	height: 212px;
	/*width: 576px;*/
	/*float: right;*/
	clear: right;
}

#Logo
{
	height: 161px;
	#width: 576px;
}

#Name
{
    background-position: 54px 50px;
    font-size: 50px;
  	padding-top: 48px;
    padding-left: 100px;
    color: #585858;
}

.blue
{
	color: #0e88af;
}

#Informations
{
    font-size: 15px;
    padding-left: 92px;
    color: #585858; 
}

#Top_menu
{
    height: 59px;
    width: 100%;
	background: url("../img/bac_button2.png") top left repeat-x;
	text-align: center;
}

#Top_menu a
{
	width: 150px;
	height: 21px;
	float: center;
	color: #0e88af;
	text-decoration: none;
	font-weight: bold;
	padding-top: 18px;
	text-indent: 38px;
	transition : 0.2s;	
}

#Top_menu a:hover
{
	color: #FF8706;
	text-decoration: underline;
}

#Top_menu .submenu
{
	width: 120px;
	height: 50px;
	float: center;
	font-weight: bold;
	padding-top: 20px;
	font-size: 12px;
	text-indent: 15px;

	text-align: center;
    background: url("../img/submenu2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .home
{
	font-size: 14px;
    background: url("../img/home2.png") top left no-repeat;
}

#Top_menu .help
{
	font-size: 14px;
    background: url("../img/help_menu.png") top left no-repeat;
}

#Top_menu .contact
{
	font-size: 14px;
	background: url("../img/contact2.jpg") top left no-repeat;
}

#Top_menu .user
{
	font-size: 14px;
    background: url("../img/user2.png") top left no-repeat;
}

#Top_menu .mailbox
{
	font-size: 14px;
    background: url("../img/mailbox.png") top left no-repeat;
}

#Top_menu .mailbox-new
{
	font-size: 14px;
    background: url("../img/alert.png") 8% 35% no-repeat,
    			url("../img/mailbox-new.png") top left no-repeat;
}

#Top_menu .export
{
	font-size: 14px;
    background: url("../img/dtview.png") top left no-repeat;
}

#Top_menu .mapview
{
	font-size: 14px;
    background: url("../img/mapviewer2.jpg") top left no-repeat;
}
#Top_menu .analyse
{
	font-size: 14px;
    background: url("../img/export2.jpg") top left no-repeat;
}

#Top_menu .logout
{
	font-size: 14px;
    background: url("../img/logout2.png") top left no-repeat;
}
#Top_menu .admin
{
	font-size: 14px;
    background: url("../img/admin2.png") top left no-repeat;
}

#Top_menu .group
{
	font-size: 13px;
    background: url("../img/team2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .tools
{
	font-size: 13px;
    background: url("../img/tools.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .accession
{
	font-size: 13px;
    background: url("../img/accession.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .phenotyping
{
	font-size: 13px;
    background: url("../img/pheno2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .genotyping
{
	font-size: 13px;
    background: url("../img/geno2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .classification
{
	font-size: 13px;
    background: url("../img/class2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .seedlot
{
	font-size: 13px;
    background: url("../img/seedlot2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .genealogy
{
	font-size: 13px;
    background: url("../img/accession2.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .genealogy
{
	font-size: 13px;
    background: url("../img/accession2.jpg") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .user_guide
{
	font-size: 13px;
    background: url("../img/user_guide.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .report_bug
{
	font-size: 13px;
    background: url("../img/report_bug.png") top left no-repeat, url("../img/bac_button2.png") top left repeat-x;
}

#Top_menu .menu
{
    background: url("../img/bac_button2.png") top left repeat-x;
    padding-top: 10px;
    padding-bottom: 10px;
}

#LeftPart
{
	width: 245px;
	background-color: #fbfdfe;
	margin-top: -12px;
	/*float: left;*/
}

*>#LeftPart
{
    margin-top: 8px;
}

#Menu
{
    width: 245px;
    float: left;
}

#Menu_help
{
	width: 245px;
    float: left;
}

#Menu_help .fixed
{
	position: fixed;
	top:0;
}

#Menu_header
{
    width: 256px;
    height: 31px;
}

.menu_header_right
{
    background: url("../img/ornament_menu2.png") top left no-repeat;
	height: 31px;
	width: 46px;
	float: right;
}

.menu_header_left
{
    background: url("../img/bac_button2.png") top left repeat-x;
	width: 210px;
	height: 31px;
	float: left;
	font-size: 13px;
}

.menu_text
{
	color: #0e88af;
	font-weight: bold;
	line-height: 31px;
	padding-left: 14px;
}

#Menu_content
{
	float: left;
	width: 235px;
	padding: 5px;
}

#Menu_content a:hover
{
    text-decoration: underline;
    color: #0e88af;
}

.menu_item
{
	color: #585858;
	text-decoration: none;
	padding-left: 20px;
	background: url("../img/arrow.gif") top left no-repeat;
	margin-left: 6px;
	line-height: 18px;
	font-size: 14px;
	font-weight: bold;
}

.menu_item2
{
	color: #8d9395;
	text-decoration: none;
	padding-left: 50px;
	font-size: 11px;
}

#Poll_header
{
    width: 215px;
    height: 31px;
    float: left;
}

#Poll
{
	margin-top: 5px;
	float: left;
}

#Poll_content
{
    width: 203px;
	padding: 5px;
    padding-left: 12px;
	float: left;
}

#Poll_content a:hover
{
    text-decoration: underline;
    color: #0e88af;
}

.poll_question
{
    color: #767879;
	text-decoration: none;
	font-weight: bold;
}

.poll_unswer
{
    color: #8d9395;
	text-decoration: none;
	line-height: 25px;
}

#RightPart
{
	width: 1000px;
	float: right;
	clear: left;
	/*background-color: #f5fdfd;*/
	margin-top: -12px;
}

*>#RightPart
{
    margin-top: 8px;
    clear: right;
    margin-left: 5px;
}

#Page
{
	width: 800px;
	padding: 5px;
	padding-right: 0px;
}

*>#Page
{
	padding: 5px;
}

h1
{
	color: #0e88af;
	font-size: 20px;
	font-weight: bold;
	padding-left: 20px;
	line-height: 35px;
	margin-top: 0;
	margin-bottom: 0;
}

h2
{
	color: #0C7597;
	font-size: 16px;
	font-weight: bold;
	padding-left: 25px;
	line-height: 35px;
	margin-top: 0;
	margin-bottom: 0;
}

h3
{
	margin-top: 0;
	margin-bottom: 0;
	font-size: 14px;
	font-family: arial;
	line-height: normal;
	color: black;
	font-weight: bold;
}

#help_txt
{
	font-size: 13px;
	margin-left:25px;
}

#Page_header
{
	background-color: white;
	padding: 8px;
	padding-right: 0px;
	padding-left: 0px;
	width: 800px;
}

.page_header_img
{
	width: 68px;
	padding-left: 8px;
}

.page_header_text
{
    width: 250px;
    text-align: justify;
    font-size: 11px;
    color: #0e88af;
}

#Page_header tr
{
	width: 670px;
}

#Page_top
{
	background-color: #a5d7e9;
	margin-top: 8px;
	margin-bottom: 8px;
	color: #074d64;
	width: 800px;
}

#Page_top p
{
    padding: 5px;
}

#Page_top a
{
    color: #074d64;
}

#Page_center
{
    width: 800px;
}

.page_center_button
{
	width: 31px;
}

.page_center_button span
{
	display: none;
}

.page_center_buy
{
    background: url("../img/buy.gif") top left no-repeat;
    height: 53px;
    width: 31px;
    float: left;
}

.page_center_info
{
    background: url("../img/info.gif") top left no-repeat;
    height: 99px;
    width: 31px;
    float: left;
}

.page_center_content
{
    height: 142px;
    width: 170px;
    background-color: white;
  	margin-bottom: 3px;
    padding-left: 10px;
}


#Page_center tr
{
    width: 669px;
    margin-bottom: 5px;
}

.page_center_img
{
	width: 117px;
	height: 152px;
	background-color: white;
	margin-right: 3px;
}

.page_center_img img
{
	padding-top: 30px;
	padding-left: 20px;
}

.page_center_img2
{
	float: left;
	width: 117px;
	height: 152px;
	background-color: white;
}

.page_center_img2 img
{
	padding-top: 30px;
	padding-left: 20px;
}

.blue2
{
    color: #0e88af;
    font-size: 16px;
    font-weight: bold;
    line-height: 45px;
}

.gray
{
    color: #a6acae;
    font-size: 14px;
    font-weight: bold;
    line-height: 18px;
}

.green
{
    color: #7e9b1e;
    font-size: 14px;
    font-weight: bold;
}

.page_center_text
{
	width: 170px;
	float: left;
}

#Bottom
{
	background: url("../img/bac_button2.png") top left repeat-x;
	width: 1280px;
	height: 51px;
	float:left;
	text-align:right;
	font-weight: bold;
	margin-top: 5px;

}

.down
{
	font-size: 11px;
	margin-left: 650px;
	text-align: left;
	padding-bottom: 5px;
}

.down a
{
    color: #5a5551;
}

.down2
{
	margin-left: 810px;
	padding-bottom: 10px;
}

.down2 img
{
    border: 0px;
}

.errorlist {
	color:red;
}

/*-----   Messages   -----*/

.success {
	color: green;
	margin: 5 5 5 5;
	border:2px solid;
	font-family: Garamond, Times New Roman, Times, serif;
	text-align: center;
	/*background:url("../img/ok.png") no-repeat scroll 0 0 transparent;*/
	background-color: #D5FFD1;
	font-size: 1.3em;
	margin-left: auto;
	margin-right: auto;
	margin-top:1px;
	margin-bottom:1px;
	width: 600px;
	min-height:20px;
	list-style-type: none;
}

.error {
	color: red;
	margin: auto;
	border:2px solid;
	font-family: Garamond, Times New Roman, Times, serif;
	text-align: center;
	/*background:url("../img/exclamation.png") no-repeat scroll 0 0 transparent;*/
	background-color: #FFE7DC;
	font-size: 1.3em;
	margin-left: auto;
	margin-right: auto;
	margin-top:1px;
	margin-bottom:1px;
	width: 600px;
	min-height:20px;
	word-wrap:break-word;
	list-style-type: none;
}

/*.warning {
	color: yellow;
	margin: 5 5 5 5;
	border:2px solid;
	font-family: Garamond, Times New Roman, Times, serif;
	text-align: center;
	background:url("../img/exclamation.png") no-repeat scroll 0 0 transparent;
	background-color: #000000;
	font-size: 1.3em;
	margin-left: auto;
	margin-right: auto;
	width: 600px;
	min-height:20px;
}*/

.warning {
	color: #FF8706;
	margin: 5 5 5 5;
	border:2px solid;
	font-family: Garamond, Times New Roman, Times, serif;
	text-align: center;
	/*background:url("../img/exclamation.png") no-repeat scroll 0 0 transparent;*/
	background-color: #fff3e4;;
	font-size: 1.3em;
	margin-left: auto;
	margin-right: auto;
	margin-top:1px;
	margin-bottom:1px;
	width: 600px;
	min-height:20px;
	list-style-type: none;
}

.info {
	color: #0E88AF;
	margin: 5 5 5 5;
	border:2px solid;
	font-family: Garamond, Times New Roman, Times, serif;
	text-align: center;
	background-color: #DAEEF6;
	font-size: 1.3em;
	margin-left: auto;
	margin-right: auto;
	margin-top:1px;
	margin-bottom:1px;
	width: 600px;
	min-height:20px;
	list-style-type: none;
}


.break-word {
-ms-word-break: break-all;
-ms-word-wrap: break-all;
-webkit-word-break: break-word;
-webkit-word-wrap: break-word;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}

/*Classes pour affichage tableau*/
.result {
	display:block;
	overflow:auto;
	width:950px;
	max-height:500px;
	white-space: nowrap;
}

.result th {
	min-width:100px;
	height: 30px;
	background-color: #FAAC58;
	cursor: pointer;
	position: sticky;
	top: 0;
}

.result td {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:5px;
	padding-right:5px;
	border:1px solid #FAAC58;
}

.alternate tr:nth-child(even) {
    background-color: #F5D0A9;

}
.alternate tr:nth-child(odd) {
    background-color: #F7DBBD;
 
}

.tableform th, td {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:5px;
	padding-right:5px;
}

.tableform th {
	text-align:left;
}

/* ===================== Genotyping table style ===================== */

.pandas-result {
	display:block;
	overflow:auto;
	width:950px;
	max-height:500px;
	white-space: nowrap;
}

.pandas-result thead th {
	min-width:100px;
	height: 30px;
	background-color: #FAAC58;
	cursor: pointer;
	position: sticky;
	top: 0;
	z-index:20;
	border:1px solid #FAAC58;
}

.pandas-result thead th:nth-child(1) {
	position:sticky;
	left:0;
	z-index:40;
}

.pandas-result tbody th {
	min-width:100px;
	height: 30px;
	background-color: #FAAC58;
	cursor: pointer;
	position: sticky;
	left:0;
	border:1px solid #FAAC58;
}

.pandas-result td {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:5px;
	padding-right:5px;
	border:1px solid #FAAC58;
}

/* ========= Style for Individual result table ========= */

/* To color the 3 first lines in gray */
.pandas-result-ind tbody tr:nth-child(1) th, .pandas-result-ind tbody tr:nth-child(2) th, .pandas-result-ind tbody tr:nth-child(3) th {
	background-color:#848484;
	border:1px solid #848484;
}

.pandas-result-ind tbody tr:nth-child(1) td, .pandas-result-ind tbody tr:nth-child(2) td, .pandas-result-ind tbody tr:nth-child(3) td {
	background-color:#848484;
	border:1px solid #848484;
}

/* To fix the 3 first lines to the top (when scrolling down)*/
.pandas-result-ind tbody tr:nth-child(1) th, .pandas-result-ind tbody tr:nth-child(1) td {
	position:sticky;
	top:34px;
}

.pandas-result-ind tbody tr:nth-child(2) th, .pandas-result-ind tbody tr:nth-child(2) td {
	position:sticky;
	top:66px; 
}

.pandas-result-ind tbody tr:nth-child(3) th, .pandas-result-ind tbody tr:nth-child(3) td {
	position:sticky;
	top:98px; 
}

/* To allow the fixed lines to be displayed on top of the cells of the table (when scrolling down) */
.pandas-result-ind tbody tr:nth-child(1) th, .pandas-result-ind tbody tr:nth-child(2) th, .pandas-result-ind tbody tr:nth-child(3) th {
	z-index:30;
}
.pandas-result-ind tbody tr:nth-child(1) td, .pandas-result-ind tbody tr:nth-child(2) td, .pandas-result-ind tbody tr:nth-child(3) td {
	z-index:20;
}

/* To make the cells of the "Accession" column of each of the three lines displayed on top of the three lines when scrolling to the right */
.pandas-result-ind-acc tbody>:nth-child(1)>:nth-child(2), .pandas-result-ind-acc tbody>:nth-child(2)>:nth-child(2), .pandas-result-ind-acc tbody>:nth-child(3)>:nth-child(2) {
	z-index:30 !important;
}

/* To make the cells of the "Seedlot" column of each of the three lines displayed on top of the three lines when scrolling to the right */
.pandas-result-ind-sdl tbody>:nth-child(1)>:nth-child(3), .pandas-result-ind-sdl tbody>:nth-child(2)>:nth-child(3), .pandas-result-ind-sdl tbody>:nth-child(3)>:nth-child(3) {
	z-index:30 !important;
}

/* To make the cells of the "Sample" column of each of the three lines displayed on top of the three lines when scrolling to the right */
.pandas-result-ind-spl tbody>:nth-child(1)>:nth-child(4), .pandas-result-ind-spl tbody>:nth-child(2)>:nth-child(4), .pandas-result-ind-spl tbody>:nth-child(3)>:nth-child(4) {
	z-index:30 !important;
}

/* ========= Style for Genotyping frequency result table ========= */

.pandas-result-freq thead tr:nth-child(2) {
	position: sticky;
	top: 34px;
	z-index:20;
}

/* ======= Style for Genotyping individual and frequency result table ======= */

/* To color the "Accession" column as the fist column (GenoID) (in orange) */
.pandas-result-acc-col {
	background-color: #FAAC58;
	border:1px solid #FAAC58;
	position:sticky;
	font-weight:bold;
}

/* To display the header of the "Accession" column on top of the other headers when scrolling to the right */
.pandas-result-acc-headers {
	z-index:30 !important;
}

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


/* Test mailbox table */

.mailbox-table {
	display:block;
	overflow:auto;
	width:950px;
	max-height:500px;
	white-space: nowrap;
}

.mailbox-table th {
	min-width:100px;
	height: 30px;
	background-color: #c1dfeb;
	cursor: pointer;
	position: sticky;
	top: 0;
}

.mailbox-table td {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:5px;
	padding-right:5px;
	border:1px solid #c1dfeb;
}

.mailbox-standard {
	background-color: #daeef6;
}

.mailbox-success {
    background-color: #D0F2CD;
}

.mailbox-error {
    background-color: #FFD8C6;
}

/* class pour menu dynamique (à nettoyer) */
.sf-menu {
    line-height: 1;
    z-index: 100;
}
.sf-menu ul {
	padding-top:25px;
	list-style-type: none;
    position: absolute;
    top: -999em;
    width: 80px;
}
.sf-menu ul li {
	list-style-type: none;
    width: 100%;
    height: 50px;
    white-space: nowrap;
}
.sf-menu li:hover {
    visibility: inherit;
}
.sf-menu li {
	list-style-type: none;
    float: left;
    position: relative;
}

.sf-menu li:hover ul, .sf-menu li.sfHover ul {
	border-top : none;
	border-bottom : none;
    left: 0;
    top: 2em;
    z-index: 999;
}

ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
    top: -999em;
}
ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
    top:-25px;
	left:176px;
	width: 120px;
	height: 50px;
}
ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
    top: -999em;
}
ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
    left: 10em;
    top: 0;
}
.sf-menu {
    float: left;
    margin-bottom: 1em;
}
.sf-menu a {
    padding: 1em;
    text-decoration: none;
    display: block;
    position: relative;
}
.sf-menu li li {
    background: none repeat scroll 0 0 #222222;
}
.sf-menu ul a {
    color: #AAAAAA;
}
.sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active, nav ul li.current a {
    outline: 0 none;
}
.sf-menu li li:hover, .sf-menu li li.sfHover, .sf-menu li li a:focus, .sf-menu li li a:hover, .sf-menu li li a:active {
    box-shadow: 0 3px 20px rgba(255, 255, 255, 0.1) inset;
}
.sf-menu a.sf-with-ul {
    min-width: 1px;
    padding-right: 2.25em;
}

.fiel_set {
	background-color: #ffffff;
    width: 800px;

    margin-left: 50px;
    padding: 10px;
    border: 2px solid gray;
 
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    behavior: url(border-radius.htc);
 
    background-image: -moz-linear-gradient(top, #ffffff, #f4f4f4);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f4f4f4));
    position:relative;
}

.fiel_set_drop {
	background-color: #ffffff;
    width: 800px;

    margin-left: 50px;
    padding: 10px;
    border: 2px solid gray;
 
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    behavior: url(border-radius.htc);
 
    background-image: -moz-linear-gradient(top, #ffffff, #f4f4f4);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f4f4f4));
}

.mailbox-report_fieldset {
	padding:1%;
	border-radius:4px;
	margin-right:245px;
	background-image: linear-gradient(white, #edf7fb);
}

.mailbox-report {
	border-spacing: 15px 0;
}

.mailbox-report th, td {
	padding-top:2px;
	padding-bottom:10px;
	padding-left:10px;
	padding-right:10px;
	/*font-size:14px;*/
}

.mailbox-report th {
	text-align:left;
	color:#0e88af;
}

.report-message p {
	line-height: 1.5em;
	margin-bottom: 1em;
}


label
{
	display: block;
	width: 150px;
	float: left;
}

legend {
  padding: 0.2em 0.5em;
  border:2px solid gray;
  
  -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    behavior: url(border-radius.htc);
  
  color:#DF7401;/* 0000FF  5C85D6 */
  font-size:110%;
  text-align:right;
  font-weight: bold;
  

  }

  
#button {
    background-color: #0000FF; 
    padding: 2px 2px;
    font: 13px sans-serif;
    text-decoration: none;
    border: 1px solid #000;
    border-color: #aaa #444 #444 #aaa;
    color: white;
    /* margin-left: 150px; */
    margin-top: 10px;
}





#tableHeader {
    width: 100%;
}

#tableHeader th {
    text-align: left;
}

#tableBody-container {
    height: 50px;
    overflow: auto;
}

#tableBody {
    width: 100%;
}

.column1,
.column2,
.column3,
.column4,
.column5 {
    width: 20%
}

}

div.scroll {
	overflow-x: auto;
	overflow-y: auto;
}

div.infos table{
	border:1px solid white;
	border-spacing:2px;
	border-collapse:separate;
}

div.infos table tr, div.infos table tr td{
	border:1px solid #FAAC58;
	background-color:#F5D0A9;
}

div.infos table tr th{
	text-align:left;
	padding:2px 4px 2px 4px;
	background-color: #FAAC58;
	font-weight: bold;
	border:1px solid #FAAC58;
}











/* --- Image Dataview --- */


/* Create four equal columns that floats next to eachother */
.column {
  float: left;
  width: 25%;
  padding-top: 10px;
  padding-bottom: 10px
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  z-index:10000;
}

/* Modal Content */
.modal-content {
  position: relative;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1800px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.mySlides {
  display: none;
}

.imagesInfoBox {
  padding: 10px;
  width: 40%;
  border: solid 3px #0e88af;
  background-color: rgba(0, 0, 0, 0.5);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Caption text */
.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

img.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
  border: solid 3px #0e88af;
  cursor: pointer
}

.hover-shadow:hover {
  opacity: 0.7;
  box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

/*----- INFOBULLE -----*/

.element{
	width : 20px;
}
.infobulle{
	opacity:0;
	transform : scale(0);
	position : absolute;
	top:-8px;
	left:35px;
	background-color : #0e88af;
	color : white;
	border-radius : 15px;
	padding : 8px;
	margin-top : 8px;
	border-left : 10px solid transparent;
	border-right : 10px solid transparent;
	transition : 0.25s;
	z-index: 500;
}

.element:hover > .infobulle{
	opacity:1;
	transform : scale(1);
}


/*----- MAP ACCESSION -----*/


#accession_map{
	opacity:0.5;
    border: solid 2px #0e88af;
	transform : scale(1);
	transition : 1.5s;
}

#accession_map:hover{
	opacity:1;
	transform : scale(1.15);
}


/*----- LOADER -----*/

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	opacity: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('../img/MaizeLoading.png') 50% 50% no-repeat;
	animation: opacity 3s linear infinite;
    /*background-color: rgba(255, 255, 255, 0.5);*/

}

.loaderFond {
	position: fixed;
	left: 0px;
	top: 0px;
	opacity: 0.9;
	width: 100%;
	height: 100%;
	z-index: 9998;
	background: url('../img/MaizeLoading2.png') 50% 50% no-repeat;

}

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

.hide-loader{
display:none;
}

/*----- GENOTYPING FORMSETS -----*/

.hidden_formset {
	display:none;
}

/*----- HIDE SHOW -----*/

.hide_show {
	background-image:url('../img/plus.png');
	background-repeat: no-repeat;
	width: 30px;
	height: 30px;
	float:right;
}

/*----- CLEAR FLOAT -----*/

.clear_float{
	clear:both
}

/*----- FULL SCREEN -----*/

.full-screen-table {
	position: absolute; 
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0;
	width:100%;
	max-height:none;
    height:100%;
    background-color:white;
}


.dots {
   width: 24px;
   height: 11.5px;
   background: radial-gradient(circle closest-side,#0e88af 90%,#0000) 0%   50%,
          radial-gradient(circle closest-side,#0e88af 90%,#0000) 50%  50%,
          radial-gradient(circle closest-side,#0e88af 90%,#0000) 100% 50%;
   background-size: calc(100%/3) 4.8px;
   background-repeat: no-repeat;
   animation: dots-7ar3yq 1.2s infinite linear;
}

@keyframes dots-7ar3yq {
	20% {
		background-position: 0%   0%, 50%  50%,100%  50%;
	}

	40% {
		background-position: 0% 100%, 50%   0%,100%  50%;
	}

	60% {
		background-position: 0%  50%, 50% 100%,100%   0%;
	}

	80% {
		background-position: 0%  50%, 50%  50%,100% 100%;
	}
}