/*body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}*/
body, html {
  font-family: 'Open Sans';
  /*font-family: 'Avenir Next';*/
  font-size:15px;
  height: 100%;
  color: #5f5f5f;
  line-height: 1.8;
}
 
:root {
  --colheader: #002557;
  --colmenub: #FFFFFF;
}


/* Container holding the image and the text */
.container {
  position: relative;
  text-align: center;
  color: black;
}


/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
}
.bottom-center {
  position: absolute;
  
}



/* Bottom right text */
.text-block {
  position: absolute;
  padding: 0px 0px 0px 0px;
  top: 95%;
  left: 50%;
  width:100%;
  transform: translate(-50%, -50%);
  background-color: rgba(255, 255, 255, 0.5);
  color: black;
}

/* Centered text */
/*.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);*/
  
  



.center {
  display: block;
  margin-left: auto;
/*  margin-right: auto;*/
/*  height: 90%;*/
  width: 80%;
}

tr.spacingBottom>td {
	padding-bottom:0.5em;
}
td.spacingRight {
	padding-right:0.5em;
}
h3.spacingTop {
	padding-top: 10px;
}

div.ex3 {
background-color: rgb(255, 255, 255);
/*width: 110px;*/
height: 500px;
overflow: auto;
}



.navbutton{
	font-weight: 250;
	border-bottom:6px solid #ccc!important;
	border-color:var(--colheader)!important
}

.navbutton:hover {
    /*    background-color:transparent!important;*/
        border-color:white!important;
    	 color:white!important;
    /*	 background-color: blue!important;*/
}

.navbuttontop{
	font-weight: 250;
	font-size: 16px;
	border-bottom:6px solid #ccc!important;
	border-color:var(--colheader)!important
}

.navbuttontop:hover {
/*    background-color:transparent!important;*/
    border-color:white!important;
	 color:white!important;
/*	 background-color: blue!important;*/
	
}

/*w3-bottombar w3-hover-border-black w3-border-white*/


.vertical-right-aligned {
    transform: rotate(-90deg);
    transform-origin: 100% 100%;
    position: fixed;
    right: 0;
    top: 50%;
    z-index: 100;
}

.w3-bar .w3-button {
  padding: 20px;
}

/*.w3-bar-item{
	font-weight: 200;
}*/

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
  }

  /* Tooltip text */
  .tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    top: 100%;
    left:50%;
    margin-left: -60px;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
  }
  .tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  bottom: 100%;  /* At the top of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}
  /* Show the tooltip text when you mouse over the tooltip container */
  .tooltip:hover .tooltiptext {
    visibility: visible;
  }