/* CSS for feedback form */

#rating {
   color: black;
   font: bold 14pt Arial;
   margin-top: -5px;
   margin-left: 10px;
   padding-bottom: 0;
}
#feedbackModal1 {
   display: none;
   width:100%;
   height:100%; 
   z-index:100;
   top:0; 
   left:0; 
   position:fixed; 
   background-color:transparent;
}
#feedbackModal2 {
   display: table;
   width: 360px;
   height: auto;
   margin: auto;
   margin-top: 100px; 
   border: 3px solid red;
   border-radius: 10px;
   background-color: #eee;
   padding: 0 5px 0 5px;
}
#f-schl {
   text-align: center;
   color: red;
   font: bold 16pt Arial;
   padding-bottom: 0px;
}
#f-desc {
   width: 90%;
   margin: 0 auto;
   padding: 10px 5px 0 5px;
   text-align: left;
   color: blue;
   font: bold 12pt Arial;
}

#f-div3 { 
   display: table; 
   margin: 0 auto;
   padding: 5px;
   padding-top: 5px;
}
#f-div3-1 { 
   display: table-cell; 
   margin: 5px;
}
#f-div3-2 { 
   display: table-cell; 
   margin: 5px;
   width: 125px;
}
#f-div3-3 { 
   display: table-cell; 
   margin: 5px;
}
#f-b1 {
   background-color: red;
   color: white;
   padding: 3px 15px;
   text-align: center;
   font: bold 14pt Arial;
}
#f-b2 {
   background-color: green;
   color: white;
   padding: 3px 15px;
   text-align: center;
   font: bold 14pt Arial;
}
#f-fs1 li {
   margin-bottom: -3px;
}
#f-fs1 label {
   font: bold 8pt Arial;
}
#f-fs1 input {
   margin-left: 2px;
   margin-top: 1px;
}
#f-schl { padding-top: 10px; } 
#f-b1, #f-b2 { margin-bottom: 5px; } 

/* The labelcontainer */
.labelcontainer {
  display: inline;
  position: relative;
  padding-left: 35px;
  padding-right: 15px;
  margin-bottom: 12px;
  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 radio button */
.labelcontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #ccc;
  border-radius: 50%;
}

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

/* When the radio button is checked, add a blue background */
.labelcontainer input:checked ~ .checkmark {
  background-color: #2196F3;
}

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

/* Show the indicator (dot/circle) when checked */
.labelcontainer input:checked ~ .checkmark:after {
  display: inline;
}

/* Style the indicator (dot/circle) */
.labelcontainer .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}