/*
font-family: 'Architects Daughter', cursive;
font-family: 'Cairo', sans-serif;
font-family: 'Permanent Marker', cursive;
font-family: 'Questrial', sans-serif;
font-family: 'Rajdhani', sans-serif;
*/

html {
    font-size:1.2em;
	height:100%;
	width:100%;
}

body {
    font-family: "Open Sans", sans-serif;
	height:100%;
	width:100%;
}

a {
	text-decoration: none;
	color: #A1D0DD;
}
a:hover {
	color: #0ed4cb;
}
img {
    max-width: 100%;
    max-height: 100%;
	margin-top: 15px;
}

input, select {
	color: #06498C;
	background-color: #A1D0DD; 
	font-size: 1.0em;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}
H1 {
	color: #FFF;
    text-shadow: -1px 1px 2px #000,
				 1px 1px 2px #000,
				 1px -1px 0 #000,
				-1px -1px 0 #000;
}

H3 {}

H4 {

}

H5 {
  font-size: 12px;
}

/* DIVS */

.container {
	width: 98%;
	margin: 15px;
	height: 100%;
	background-color: #FFF;
	color: #000;
	overflow: hidden;
}
.headerBar {
	background-color: #A1D0DD;
	background-color: #50686e;
	max-height: 15%;
	padding-left: 10px;
	padding-right: 10px;
	width: 95%;
	margin-bottom: 20px;
}
.headerBar H1 {
	font-family: 'Rajdhani', sans-serif;
}
.row {
	background-color: #FFF;
}
.row2 {
	background-color: #A1D0DD;
}
.col-10{
	width:10%;
}
.col-tiny{
	width: 10%;
	float:left;
	padding-left: 20px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;	
}
.col-sm {
	width: 15%;
	float:left;
	padding-left: 20px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
}
.col-md {
	width: 50%;
	padding: 10px;
	float: left;
}
.col-lg {
	width: 79%;
	float:left;
	padding: 10px;
	

}
.tanDiv {
    background-color: #06498C;
    border-bottom: 2px solid black;
    color: #FFF;
	padding: 15px;
}
.blueDiv {
    background-color: #A1D0DD;
    border-bottom: 2px solid black;
	padding: 15px;
}

div.hideMobile {
	display: none;
}

@media only screen and (min-width: 1280px) {
  div.hideMobile {
    display: block;
  }
}

/* END DIVS */

div.box {
	border: 2px solid black;
}

.menu {
	color: #A1D0DD;
	background-color: #50686e;
	min-height: 70%;
	height: 700px;
	overflow: auto;
}
.menuTitle {
	color: #FFF;
	border-bottom: 1px groove white;
	padding-top: 5px;
	padding-bottom: 5px;
}
.menu H3 {
   font-size: 18px;	
   color: #90bbc6;
   color: #fff;
   text-shadow: -1px 1px 2px #000,
				 1px 1px 2px #000,
				 1px -1px 0 #000,
				-1px -1px 0 #000;
}
.menu H3:hover {
	color: #ccc;
	/*text-decoration: underline overline;*/
}	
.menu H4 {
	font-size: 16px;	
	color:#e3e089;
    text-shadow: -1px 1px 2px #000,
			 1px 1px 2px #000,
			 1px -1px 0 #000,
			-1px -1px 0 #000;
}

.breadcrumb {
	font-size: 0.8em;
}
.main {
	color: #50686e;
	min-height: 70%;
	height: 700px;
	/*background-color: #E3E5E7;*/
	font-family: 'Questrial', sans-serif;
	/*background-image: url("./images/vetpasLogo-small.png");
    background-repeat: no-repeat;*/
	overflow: auto;
}  
.field {
    border: 5px solid black;
    background-color: white;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 40%;
    font-weight: bold;
	font-size: 1.0em;
}
.fieldElm {
    margin: 5px;
	font-size: inherit;
	font-size: 1.2em;
}
.fieldElm2 {
	width: 20em;
}
.fieldElm input {
	font-size: 1.2em;
}
.floatLeft {
	float: left;
}

.padL60 {
	padding-left: 60%;
}
.clearBoth {
	clear: both;
}
.hide {
	display: none;
}

.tableBorder {
	border: solid black 5px
}

.greenBold {
	color: green; 
	font-weight: 700;
}

.EDBB99 {
	color: #EDBB99;
}

.A9064E {
	color" #A9064E;
}




.redBold {
	color: red; 
	font-weight: 700;	
}
.header1 {
    text-align: center;
    width: 20%;
    font-size: 1.3em;
}

a.button {
    padding: 6px;
    border: 3px solid black;
    text-decoration: none;
    color: initial;
    margin-top:20px;
}

.cf {
    display: block;
    background-color: #66BB6A; //green
    min-height: 60px;
    line-height: 60px;
    padding: 10px;
    border: 3px solid darkgreen;
    text-decoration: none;
    font-size: 1.6em;
    width: auto;
    font-weight: 900;
	color: black;
}
.rs {
    display: block;
    background-color: #FFF176; //yellow
    min-height: 60px;
    line-height: 60px;
    padding: 10px;
    border: 3px solid tan;
    text-decoration: none;
    font-size: 1.6em;
    width: auto;
    font-weight: 900;
	color: black;
    margin-top:20px;
    margin-bottom:20px;
}
.cx {
    display: block;
    background-color: #EC407A; //red
    min-height: 60px;
    line-height: 60px;
    padding: 10px;
    border: 3px solid darkred;
    text-decoration: none;
    font-size: 1.6em;
    width: auto;
    font-weight: 900;
	color: black;
}
.active {
	font-weight: bold;
	color: #FFF;
}
.sub {
	padding-left: 20px;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
 
  /* 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;
}

.radio-toolbar {
  margin: 10px;
}

.radio-toolbar input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbar label {
    display: inline-block;
    background-color: #ddd;
    padding: 10px 20px;
    font-family: sans-serif, Arial;
    font-size: 16px;
    border: 2px solid #444;
    border-radius: 4px;
}

.radio-toolbar label:hover {
  background-color: #dfd;
}

.radio-toolbar input[type="radio"]:focus + label {
    border: 2px dashed #444;
}

.radio-toolbar input[type="radio"]:checked + label {
    background-color: #bfb;
    border-color: #4c4;
}