/*FAQS*/

.faq-question {

    margin: 0px;
    padding: 5px 0px 5px 0px;
    display: inline-block;
    cursor: pointer;
    color: #B0171F;
    font-size: 90%; 
    font-weight:bold;
}


.faq-question:hover {
    text-decoration:underline;
}



.faq-answer-container {
    height: 0px;
    overflow: hidden;
    padding: 0px;
}

.faq-answer {  font-size:80%; color: #5B5B5B; font-weight: bold; }

/*END FAQS*/




.introd {font-family: "Steinem Bold", Arial, sans-serif;
 line-height: 1.57em;
  letter-spacing: 0.06em;
  color: #453c37;
  font-weight: bold;
  font-size: 105%;
  
  
  
  background: url(quotes3bb.jpg); background-size: cover;  background-repeat: no-repeat;
  

  
   padding:10px; 
 
 	border-color:  #B0171F; 
     border-style: dotted;
    border-radius: 10px;
    border-width: 1px;
    
    margin-bottom: 30px;
    
   
   
      
    
 
    
 
    -moz-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
  
  
  
  
  
  }
  
  h1 { font-family: "Steinem Bold", Arial, sans-serif;
 
  letter-spacing: 0.06em;
  color: #453c37;
  font-size: 110%;
  

} 
  
  section {
    max-width: 700px; 
  margin: 10px auto 0;  
  padding: 10px;
} 

  .head-wrap {
    max-width: 1000px; 
  margin: 10px auto 0;  
  padding: 10px;
} 
  
  
  #pin{ color: #FF82AB; } 
#red { color: #B0171F;  }
#amb { color: #ffbf00; }
#gre { color: #009933; }
#bla {color: #000000; }



body {
    
      font-family: verdana, sans-serif;
 
    padding: 0;
    margin: 0;
    background-color:#fffafa;
}

.col-1 {width: 50%; 
padding-top: 10px; padding-bottom: 10px; padding-right: 30px; padding-left: 10px;
 
     }
.col-2 {
  width: 50%; padding-top: 10px; padding-bottom: 10px; padding-right: 10px; padding-left: 30px; 
  }

[class*="col-"] {
 float: left;
} 

.row {
     max-width: 1000px; 
     margin: auto;
     
}

.row::after {
 content: "";
 clear: both;
 display: table;
} 

@media only screen and (max-width: 768px) {
 /* For mobile phones: */
 [class*="col-"] {
  width: 100%;
  padding: 10px;
 }
}






.home {
background-color: #1f2e2e;

 border-radius: 10px;

padding: 10px;

    -moz-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.8);
    -webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.8);
     box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.8);
     
     margin-top: 10px; /* for space to introd */
     
         margin-bottom: 30px;
    


}





.home p {
background-color: #fffafa; 

font-size:90%;

padding: 10px; 
border-radius: 10px;

line-height: 1.57em;
  letter-spacing: 0.04em;
  color: #453c37;
  

}














#small-t {
font-size: 90%;
color: #000000;
font-weight: normal;
}


#bl-sm { color: #191970; font-weight: bold; font-size: 80%; }









 .topnav {
 background-color: #696969; /* #8E8E8E; */
 overflow: hidden;
 
 
 /* 3 lines here in other css to make fixed */ 
}


.topnav a {
    
 float: left;
 display: block;
 color: #ffffff;
 text-align: center;
 padding: 14px 16px;
 text-decoration: none;

}



.topnav a.active {
    background-color: #FF82AB;
}




.topnav a:hover:not(.active) {
 background-color: #B0E2FF;
 color: black;
}


.topnav .icon {
 display: none;
} 



   
    
@media screen and (max-width: 600px) {
     .topnav a:not(:first-child) {display: none;}
     .topnav a.icon {
     float: right;
     display: block;
       
 }
}
 
 
@media screen and (max-width: 600px) {
 .topnav.responsive {position: relative; }
 .topnav.responsive a.icon {
  
  position: absolute;
  right: 0;
  top: 0;
  
  }
 .topnav.responsive a {
    
 float: none;
 display: block;
 text-align: left;
 
  
 padding: 10px 16px;
 }
 /* the addition of the padding line above and the topnav a style below make the mobile menu narrow to suit banner */
 .topnav.responsive a:hover:not(.active) {  /* this addition is the sole fix for responsive icon too big issue NEEDS TO GO TO OTHER PAGES */
 background-color: transparent;
 color: black;
 }

 .topnav a {padding: 6px 16px; }
 } 

       



h2 {
     color:   #B0171F; 
     font-size: 120%;
}

h3 {
     color:   #191970; 
     font-size: 120%;
}


* {
 box-sizing: border-box;
}







header.logo { width: 100%; }