body{ 
    background-color: rgba(0, 207, 138, 0.067); 
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    align-content: center;
    text-align: justify;
    text-justify: inter-word;
    /* max-width: 1550px; */

}

  
.bodyTable{
    /* width:99%;
    height:98%; */
    max-width: 1500px;
    width: 1500px;
    min-width: 1500px;
    /* background-color: white; */
    background: linear-gradient(to right,#11998e2d, #38ef7e2d ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

    padding: 20px 20px 0px 20px;
}
#dashboard{
    padding: 8px; 
    color: black; 
    background-color: white; 
    opacity: 1; 
    font-family:Verdana; 
    font-size:10pt;

    position: absolute;     
    z-index: 5000; 
    overflow: scroll;
    display: none;    
    left: 10vw; 
    top: 10vh;     
    /* height: 80vh; 
    width: 80vw;      */
    height: 80vh; 
    width: 80%;    
    min-width: 300px;     
    min-height: 300px; 
    border-radius:6px; 
    border: 2px solid black; 
}
#dbgDiv, #monitoringDiv{
    background-color: #d1d1d14b;
    border-radius:6px; 
    border: 2px solid #afafaf94; 
    width: 100%; 
    height: 55%;
    overflow-y: scroll;   
    overflow-x: scroll;  
}
/* ------------------ header style ------------------ */
#headerBGdiv{
    position: absolute;
    width: 100%;
    height: 150px;
    z-index: -500;
    top: 0;
    left: 0;   
    background: -webkit-linear-gradient(to right, #71b280a0, #134e5ea0);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #71b280a0, #134e5ea0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border-bottom: 6px solid #356760;
}
#genobumain_genobuheader{
    /* width:1800px; */
    min-width:1300px;
    max-width:2000px;
    width: 100%;
    min-height:150px;
    height:150px;
    max-height:150px;
    margin:0px 150px 0px 50px;

}
#genobuHeaderPaneTable{
    width: 100%;
}

#genobuHomeAnchor{
    /* color:rgb(38, 127, 97); */
    color:#ffffff;
    font-weight: bold;
    font-size: 84px;
    text-decoration: none;
    margin-left: 20px;
}
#genobuHomeAnchor:hover{
    /* color:#ebf9f4; */
    color:#356760;
    font-size: 88px;
    /* -webkit-text-stroke: 2px #fff; */

}
#logo{
    width: 150px;
    border:2px solid transparent;
    border-radius: 8px;
}
.logoPartner_header{
    width: 100px;
    border:2px solid transparent;
    border-radius: 10px;
    margin: 0px 0px 10px 0px;
}
#setLang{
    float:right;
    margin-right: 100px;
}
.subtitle_{
    font-size: 14px;
    vertical-align: top;
}
#user{
    float:right;
    color:#123631;
}
.logoutCell{
    float:right;
    column-span: 2;
}
.logoutBtn{
    border-radius:8px;
    /* border:1px solid #123631; */
    background-color: #fefffed8;    
    padding:5px;
    font-size:10pt; 
    color:#123631;
    cursor:pointer;
    float: right;
    text-decoration: none;
    margin:2px;
}
.logoutBtn:hover{
    background-color: #96c8c2;    
    font-size:11pt; 
    color:#fff;

}

/* ------------------------------ footer ------------------------------ */

#footerBGdiv{
    position: fixed;
    background-color:#2b4e43;
    width: 100%;
    height: 60px;
    /* z-index: -500; */
    bottom: 0;
    left: 0;
    margin-top: 50px;
    align-content: center;
    text-align: center;
}
#footerTable{
    align-content: center;
    text-align: center;
    color:#ffffff;
    font-size: 16px;
    width:1510px;
    min-width:1510px;
    max-width:1510px;
}
.logoPartner_footer{
    width: 45px;
    border:2px solid transparent;
    border-radius: 5px;
    float:right;
    /* margin-right: 10px; */
}
/* ************************************ boxes ************************************ */
#logoBox{
    width: 20%;
    align-content: center;
    /* background-color: white; */
}
.fillBox{
    width: 5%;   
    /* background-color: white; */

}
#partnerLogoBox{
    width: 5%;
    align-content: center;
    /* background-color: white; */

}
#titleBox{
    /* color:rgb(43, 78, 67); */
    color:rgb(255, 255, 255);
    width: 60%;    
    /* margin-right: 40px; */

    font-weight: bold;
    font-size: 60px;
    text-align: left;
    /* background-color: white; */

}
/* --------------------------------- body tables --------------------------- */
#genobudefDiv, #genobuselDiv, #genobutableDiv{
    /* max-width: 1510px;
    width: 1510px;
    min-width: 1510px; */

    background-color: #77a88244;
    border-radius:6px; 
    border:2px solid transparent;
    padding:5px;

    /* text-align: justify;
    text-justify: inter-word; */
}
#genobumain_genobudef,#genobumain_genobusel{
    width:1500px;
    min-width:1300px;
    max-width:1800px;

    min-height:150px;
    height:150px;
    max-height:150px;

    margin:0px 50px;

}

.homePagePanelCell, .mainPanel, .introPan, .imgCntPanel,.minorPanel{
    width:      50%;
    /* overflow-x: scroll;   */
    vertical-align: top;

    border: 0px solid rgb(40, 161, 121);
    background-color: #ffffffb2; 
    border-radius: 10px;
    font-size: 18px;
    padding: 10px;
    text-align: justify;
    text-justify: inter-word;

}

.cntPanel,.cntPanel2{
    max-width:  640px;
    width:      640px;
    min-width:  640px;
    max-height:  240px;
    /* height:      540px;
    min-height:  540px; */
    /* overflow-y: scroll;    */
    overflow-x: scroll;  
    vertical-align: top;
    /* text-align: justify;
    text-justify: inter-word; */

    border: 0px solid rgb(40, 161, 121);
    background-color: #f4f4f4b2; 
    border-radius: 10px;
    font-size: 18px;
    padding: 10px;
}
.refPanel{
    border: 0px solid rgb(40, 161, 121);
    background-color: #ffffffb2; 
    border-radius: 10px;
    font-size: 15px;
    padding: 10px;
}
.JBrowsePanel{
    max-width:  1490px;
    width:      1490px;
    min-width:  1490px;
    overflow-y: scroll;   
    overflow-x: scroll;  
    vertical-align: top;

}
.JBrowsePanel_iFrame{
    width:  1450px;
    height: 500px;

}
.homePagePanel_titleRow, .mainPanel_title, .cntPanel_title,  .cntPanel2_title, .imgCntPanel_title, .default_title{
    max-height:  70px;
    height:      70px;
    min-height:  70px;
    vertical-align: middle; /* Aligns text to the middle */
}
.homePagePanel_img, .mainPanel_img{
    width: 580px;
    height: 350px;
}
.cntPanel_img{
    width: 700px;
    height: 550px;
}

.cntPanel2_img{
    width: 100%;
    height: 800px;
}

.imgCntPanel_img{
    width: 1400px;
    height: 550px;
}
.introPan_textBox{
    font-size: 22px;
    padding: 10px;
}

.mainPanel_textBox{
    margin: 0px 150px 0px 50px ;
    font-size: 18px;
}
#annotationPipeline_img{
    width: 770px;
    height: 550px;

}
#bubalusChromos_img{
    width:  510px;
    height: 859px;
}

#plotDiv{
    background-color: white;
    position: absolute;     
    z-index: 5000; 
    /* overflow: scroll; */
    display: none;    
    left: 80vw; 
    top: 30vh;     
    /* height: 80vh; 
    width: 80vw;      */
    /* height: 80vh; 
    width: 80%;    
    min-width: 300px;     
    min-height: 300px;  */
    border-radius:6px; 
    border: 2px solid black; 
}
/* 
.plotDiv, .main-svg,.user-select-none svg-container{
    width: 40%;
    height: 40%;

}
 */
.infoDiv{
    opacity:0.9;
    background-color:#3F3F3F;
    position:fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:1000;
    display: none;
}
#closeCoverDiv{
        color:darkred;

}

.containerInfoDiv{
    padding: 50px 50px;
    background-color:#ffffff;
    position:fixed;
    width:55%;
    height:auto;
    top:20%;
    left:20%;
}
.contentTable{
    max-height:  450px;
    /* height:      550px;
    min-height:  550px; */
    overflow-y: scroll;
}
/* ************************************ texts ************************************ */
.cellTitle,.default_title,.mainPanel_title,.introPan_title,.imgCntPanel_title, .JBrowsePanel_title{
    color:#d2421e;
    font-size: 30px;
    font-weight:550;
    text-decoration: none;
}
.cntPanel_title{
    /* color:#e78414; */
    color:#d2421e;
    font-size: 28px;
    font-weight:550;
    text-decoration: none;

}
 .cntPanel2_title{
    color:#d2421e;
    font-size: 28px;
    font-weight:550;
    text-decoration: none;

}
.refPanel_title{
    color:#176253;
    font-size: 18px;
    font-weight:550;
    text-decoration: none;
}
.cellTitle_anchor,.mainPanel_anchor,.cntPanel_anchor,.imgCntPanel_anchor,.default_anchor{
    color:#249586;
    font-size: 30px;
    font-weight:550;
    text-decoration: none;
}
.cellTitle_anchor:hover,.mainPanel_anchor:hover,.cntPanel_anchor:hover,.imgCntPanel_anchor:hover,.default_anchor:hover{
    color:#427d75;
    font-size: 31px;
}
a.mainPanel_anchor font , a.minorPanel_anchor font { /* fa ereditare al font all'interno dell'anchor lo style dall'anchor e non dal font */
    color: inherit;
    font-size: inherit;
}
.minorPanel_anchor{
    color:#427d75;
    font-size: 24px;
    font-weight:550;
    text-decoration: none;
}  
.minorPanel_anchor:hover{
    font-size: 25px;
    color:#17645a;
}
#variantsCellTitle{
    color:rgba(171, 52, 22, 0.759);
    font-size: 30px;
}
#dbAnchor,.homeText{
    color:rgb(195, 109, 10);
    font-size: 20px;
    /* text-decoration: none; */
}
.homeText:hover{
    font-size: 21px;

}
.infoMainText{
    font-size: 19px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    line-height: 1.6;
    /* font-weight:510; */
    margin: 0px 10px 0px 10px;
}
.expTitle{
    color:rgb(27, 71, 56);
    font-size: 20px;
    text-decoration: none;
    font-weight: bold;
    font-family: Verdana; 
}
.contentText{
    font-size: 20px;
    color:rgb(18, 18, 18);
    font-family: Verdana; 
    line-height: 1.6;
    text-align: justify;
    text-justify: inter-word;
}
.plotBtn{
    float:right;
    border: 3px solid rgb(66, 125, 107);
    color: rgb(215, 147, 11);
    border-radius: 12px;
    background-color: rgb(255, 255, 255);
    cursor:pointer;
    padding: 5px;
    font-weight: bold;
}
.showListBtn{
    cursor:pointer;
    /* color:rgb(249, 182, 13); */
    font-size: 20px;
    /* font-style: italic; */
    text-decoration: none;
}
.showPart{
    text-decoration: none;
    cursor:pointer;
    color:rgb(43, 125, 111);
    font-weight:520;
    font-size: 18px;
    font-style: italic;
}
.showPart:hover{
    font-size: 19px;
}
/* ************************************ images ************************************ */

.tableimg_cell:hover{
    /* background-color: #a7b6b959; */
    background-color: #e3625b42;
    cursor: pointer;
}
.tableimg_cell_sel{
    background-color: #30b6a030;

}
.homeImg{
    width: 80%;
    vertical-align:-200%;
}
.homeImg{
    width: 90%;
    vertical-align:-200%;
}
.buffalo{
    width: 10%;    
    vertical-align:-100%;
}
.cartina{
    width: 40%;
    vertical-align:-500%;
}
.cariotipo{
    width: 70%;
    margin: 10px;
    /* vertical-align:-500%;
    margin-left: 8%; */
}
.cariotipo1{
    width: 80%;
}
.cariotipo2{
    width: 80%;
    vertical-align:-500%;
    margin-left: 20px;
}
.cariotipo3{
    width: 50%;

}
.info{
    width: 2.2%;
    vertical-align:25%;
    cursor:pointer;
}
.info2{
    width: 4.5%;
    vertical-align:25%;
    cursor:pointer;
}
.info3{
    width: 9%;
    vertical-align:25%;
    cursor:pointer;
}

#downloadTableBtn{
    float:right;
    width:30px;
    height: 30px;
    margin: 2px 5px 0px 0px;

    background-size: 95%;
    background-color: transparent;
    background-image: url("../imgs/download-logo-white.png");
    background-repeat: no-repeat;

    border: 3px solid transparent; 
    border-radius:6px; 
    cursor:pointer;
}
#downloadTableBtn:hover{
    background-size: 100%;
    background-color:#31705bf8;

}
/* ------------------------------------- TABLES ------------------------------------------ */
caption {
	height: 35px;
	/* border: solid 1px; */
	background-color: rgba(222, 58, 58, 0.286);
    text-align: center;
	align-items: center;
	line-height: 35px;
  
	font-family: Verdana;
	font-weight: bold;
	font-size: 20;
	/* color: rgb(190, 41, 11);
    border-radius:6px; 
    border-color:rgb(210, 30, 30);  */
}

.contentsTable caption{
	height: 35px;
    text-align: center;
	align-items: center;
	line-height: 35px;

    font-family: Verdana;
	font-weight: bold;
	font-size: 20px;
	color: #f6fffc;

    background-color: #1d4a3b;
	border: solid 2px;
    border-radius:6px; 
    border-color:#3b9f7ef1; 
}
.contentsTable th{
	height: 30px;
	font-weight: bold;
    border-radius:3px; 
	text-align: center;
    color:#feffff;
	border: solid 2px transparent;
    background-color: #275b4a73;
    vertical-align: top;  
     /* color:rgb(27, 71, 56); */
}
.contentsTable td{
	/* width: 5%; */
	max-width: 130px;
	min-width: 20px;
    word-wrap: break-word;
	height: 25px;
	font-family: Verdana; 
	font-size: 15px;
    background-color: rgb(255, 255, 255);
    border-radius:3px; 
	text-align: right;
    vertical-align: top;
    /* color:rgb(34, 95, 75); */
}
.contentsTable {
    /* width:     700px; */
    min-width: 700px;
    /* max-width: 700px; */
}

.rowCellAnchor{
    color:#23624d;
    font-style: italic;
    font-weight: bold;

}



/* #chromotable {
    width: 1500px;
    min-width: 1500px;
    max-width: 1500px;
} */
#genobuContentPaneTable tr{
	height: 25px;
	max-height: 50px;
    padding:0px;
}

/* ---------------------- iFrames --------------------- */

#JBrowse_iFrame{
    width: 1500px;
	height: 1500px;  
}

/*--------------------- buf 03 sequencing ---------------------------------*/
/* #contigsOnChromos-triangle-d, #contigsOnChr1-triangle-d,#chromotable-triangle-d,#variants-triangle-d,#SNPs-triangle-d{
    display: none;
} */
/* #contigsOnChromos_cell,#contigsOnChr1_cell,#chromotable_cell,#variants_cell,#SNPs_cell{
    display:none;
} */
.triangle{
    width:24px;
    margin: 0px 0px 0px 15px;
    cursor: pointer;
    vertical-align:-15%;

}
.triangle:hover{
    width: 26px;
}
.contentCellTitle{
    color:#1c7163;
    font-size: 26px;
    font-weight:550;
}

/* ------------------------ scrollbars --------------------------- */
.mainPanel::-webkit-scrollbar,.introPan::-webkit-scrollbar ,.contentTable::-webkit-scrollbar,.cntPanel::-webkit-scrollbar,.imgCntPanel::-webkit-scrollbar,.JBrowsePanel::-webkit-scrollbar {
    width: 10px;               /* width of the entire scrollbar */
    height: 10px;               /* width of the entire scrollbar */
}
.mainPanel::-webkit-scrollbar-track,.introPan::-webkit-scrollbar-track,.contentTable::-webkit-scrollbar-track,.cntPanel::-webkit-scrollbar-track,.imgCntPan::-webkit-scrollbar-track,.JBrowsePanel::-webkit-scrollbar-track {
    background: rgba(251, 242, 242, 0.45); /* color of the tracking area */
    cursor:pointer;

}
.mainPanel::-webkit-scrollbar-thumb,.introPan::-webkit-scrollbar-thumb ,.contentTable::-webkit-scrollbar-thumb ,.cntPanel::-webkit-scrollbar-thumb,.imgCntPan::-webkit-scrollbar-thumb,.JBrowsePanel::-webkit-scrollbar-thumb {
    background-color: #1c716378;    /* color of the scroll thumb */
    border-radius: 10px;       /* roundness of the scroll thumb */
    border: 1px solid rgb(231, 229, 229);  /* creates padding around scroll thumb */
}
.mainPanel::-webkit-scrollbar-thumb:hover,.introPan::-webkit-scrollbar-thumb:hover,.contentTable::-webkit-scrollbar-thumb:hover,.cntPanel::-webkit-scrollbar-thumb:hover,.imgCntPan::-webkit-scrollbar-thumb:hover ,.JBrowsePanel::-webkit-scrollbar-thumb:hover {
    background-color: #196559c2;    /* color of the scroll thumb */
    cursor:pointer;
}
.mainPanel::-webkit-scrollbar-corner,.introPan::-webkit-scrollbar-corner,.contentTable::-webkit-scrollbar-corner,.cntPanel::-webkit-scrollbar-corner,.imgCntPan::-webkit-scrollbar-corner,.JBrowsePanel::-webkit-scrollbar-corner {
    background: transparent;
  }


/*----------------------------------- dialog elements -----------------------------------*/
/* #genobuDialog{
    background-color:#47897324;
    padding: 20px;
    border: 2.5px solid #063d34;
    border-radius:6px;
}  */
.mainPanel_tableimg,.mainPanel_tableimg td,.imgCntPanel_tableimg,.imgCntPanel_tableimg td,.cntPanel_tableimg,.cntPanel_tableimg td{
    border-collapse: collapse;
    padding:0px;
    border-spacing: 0;
}
#chrDialogTable{
    border-collapse: collapse;
    border: 2px #30b69f solid;
    border-radius: 6px;
}
#genobuDialog{
    background-color:#116d75;
    padding: 15px 10px 0px 10px ;
    /* border: 3px solid ; */
    /* border-color: #30b69f #30b69f #30b69f transparent ; */
    /* border-radius: 0px 6px 6px 0px ; */
    vertical-align: top;
}  
.genobuDialog_PM{
    color:#1a8170;
    font-size: 16px;
 }
 .genobuDialog_font{
    font-weight:bold; 
    /* color:#0f5146;  */
    color:#fff; 
    font-size: 19px;
 }
.genobuDialog_submitBtn{
    color:#ab1c14;
    border-width:3px;
    background-color:#efefef;
    border: 3px solid #ab1c14;
    border-radius:6px;
    font-weight:bold; 
    font-size: 20px;
    cursor:pointer;
    margin: 25px 0px 5px 0px;
}
.genobuDialog_submitBtn:hover{
    font-size: 21px;
    border-color:#fff;
    color:#fff;
    background-color:#ab1c14;

}
.genobuDialog_field{
    color:#1a8170;
    font-size: 14px;
    float: right;
}
#dialog_1 table td,#dialog_2 table td{
    padding: 5px;
}


.controlBtn{
    font-size: 15px;
    font-weight: bold;
    border:2px solid #063d3d;
    color: #135658;
    background-color: #fff;
    border-radius:6px;
    cursor:pointer;
}
.controlBtn:hover{
    font-size: 16px;
    color: #fff;
    background-color: #116d75;

}
#graphMapDiv{
    background-color: #fff;
}
.graphMap_msg{
    font-size: 14px;
    color: #1c6967;
    font-style: italic;
    /* margin-left: 40%; */
}

#infoBox {
    display: none;
    position: absolute;
    background-color: #000000b3;
    color: white;
    padding: 10px;
    border-radius: 5px;
    pointer-events: none;
    font-size: 15px;
    white-space: pre-line;
}

.fullTable_anchor{
    font-size: 16px;
    color: #69211c;
    font-style: italic;
}