.main-content {margin: 0 20px 0 20px;}
.main-content input {width: 100%; height: 50px; margin-bottom: 10px; padding: 10px; text-align: center;}

.main-content li {color: #000;}
.main-content p {font-size: 1.1em;color: #000;}
.main-content h3, .main-content h4, .main-content h5 {color: #FF0000;}

.floatLeft {float:left;}

.w300 {min-width: 300px;}

.center {
  margin: auto;
  width: 50%;
  border: 1px solid #A7A7A7;
  padding: 10px;
}

.dashboard-section {
    float:left; 
    border: 1px solid #A7A7A7; 
    background-color: gainsboro; 
    margin: 0px 5px 5px 0px; 
    padding: 20px; 
    min-width: 320px; 
    max-width: 420px;
    min-height: 270px;
}


.dashboard-section-nondiv {
    float:left; 
    border: 1px solid #A7A7A7; 
    background-color: gainsboro; 
    margin: 0px 5px 5px 0px; 
    padding: 20px; 
    min-width: 333px; 
    max-width: 333px;
    min-height: 170px;
}

.dashboard-section-small {
    float:left; 
    border: 1px solid #A7A7A7; 
    background-color: gainsboro; 
    margin: 0px 5px 5px 0px; 
    padding: 20px; 
    min-width: 200px; 
    max-width: 200px;
    min-height: 200px;
}

.dashboard-section-large {
    float:left; 
    border: 1px solid #A7A7A7; 
    background-color: gainsboro; 
    margin: 0px 5px 5px 0px; 
    padding: 20px; 
    min-width: 670px; 
    max-width: 670px;
    min-height: 200px;
}

.dashboard-section p, .dashboard-section div, .dashboard-section label {color:#000000;}

.dashboard-section table tr th {padding:0px; font-size: 0.9em;}

.k9w-content, .k9w-content h5 {color: #000000;}
.k9w-content a {color: #FF0000;}
.k9w-content a:hover {text-decoration: underline; color: orange;}

.regForm input {width: 275px; height: 30px;}
.regForm input[type=radio] {width: auto; height: auto;}
.regForm input[type=submit] {width: auto; height: auto;}
.regForm p, .regForm h5 {color:#000000;}

.sectionTitle {font-size: 1.4em; font-weight: bold;}

.Divbg{border: 1px solid #FF0000; border-radius: 5px; width: 75px; text-align: center;}
.Divbg:hover{background:#FF0000;}
.Divbg a:hover {color: #000;}

/* ****************************** */

/* Customize the label (the container) */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 17px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border:1px #000000 solid;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #FF0000;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* ****************************** */

/* 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: 150px;
  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;
width: 150px;
  top: 100%;
  left: 50%;
  margin-left: -60px; /* Use half of the width (120/2 = 60), to center the tooltip */
}

/* ****************************** */
.container-23 {
    float: left; 
    width: 23%; 
    margin-right:15px;
  }

.container-70 {
    float: left; 
    width: 70%; 
    margin-right:15px;
  }

.container-25 {
    float: left; 
    width: 25%; 
  }
  
@media screen and (min-width: 200px) {
  .container-23 {
    float: left; 
    width: 100%; 
    margin-right:0px;
  }
  
.container-70 {
    float: left; 
    width: 100%; 
    margin-right:0px;
  }

.container-25 {
    float: left; 
    width: 100%; 
  }

@media screen and (min-width: 400px) {
  .container-23 {
    float: left; 
    width: 100%; 
    margin-right:0px;
  }

.container-70 {
    float: left; 
    width: 100%; 
    margin-right:0px;
  }

.container-25 {
    float: left; 
    width: 100%; 

  }

@media screen and (min-width: 800px) {
  .container-23 {
    float: left; 
    width: 23%; 
    margin-right:15px;
  }

.container-70 {
    float: left; 
    width: 70%; 
    margin-right:15px;
  }

.container-25 {
    float: left; 
    width: 25%; 
  }
  
.dashboard-section { 
    min-width: 333px; 
    max-width: 333px;
    min-height: 270px;
}

.dashboard-section-nondiv {
    min-width: 333px; 
    max-width: 333px;
    min-height: 270px;
}

.dashboard-section-small { 
    min-width: 333px; 
    max-width: 333px;
    min-height: 270px;
}

.dashboard-section-large {
    min-width: 600px; 
    max-width: 600px;
    min-height: 270px;
}  
  
  
}

@media screen and (min-width: 1200px) {
  
.dashboard-section { 
    /*min-width: 420px; 
    max-width: 420px;*/
    min-height: 270px;
}
  
  
}