/*
font-family: Arial, Helvetica, sans-serif;
font-family: "Roboto Light", sans-serif; 
     font-family: Roboto, sans-serif; 
font-family: Montserrat, sans-serif;
font-family: Merriweather, serif;
font-family: Cabin, sans-serif;
font-family: Lato, sans-serif;
             background: url(../pics/Background2.jpg) ; background-size: 100% auto ;
*/

html * { font-size:100%; }

html {
    font-family: "lato", sans-serif; line-height: 1.3em;
}

img { max-width: 100%; height: auto; }


.container { width: 100%; overflow:hidden; background: #5ad ; background: #fff ; 
            float:left; padding: 57px 0 0 0 ; border: 0px solid #f00; }

.mainbox { color: #345 ; background: #fff ; text-align: left ; padding: 0.6% 2% 1% 2%  ; 
   margin: 1% 0% 0% 0% ; border-left: 0px solid #d06 ; border-right: 0px solid #d06 ;
 clear: both; display: block;  }

.grbox { margin: 2% 2% 2% 2% ; padding: 2% 2% 2% 2% ; text-align: center; 
        font-size: 100%; background: #698; color: #fff; }

.wattlebox { color: #345 ; background: #fff ; text-align: left ; padding: 0% 4% 2% 4%  ; 
   margin: 0% 0% 0% 0% ; font-size: 66%; line-height: 1.3em ; border-left: 0px solid #098 ; 
   clear: both; display: block;  }

.wordbox { color: #345 ; background: #fff ; text-align: left ; padding: 0% 4% 2% 4%  ; 
   margin: 0% 0% 0% 0% ; border-left: 0px solid #888 ; clear: both; display: block;  }

.donatebox { color: #345 ;  
   background: #fff ; text-align: center ; padding: 0% 2% 2% 3%  ; 
   margin: 0% 0% 6% 0% ; border: 3px solid #b06 ; clear: both; display: block;  }

.borderbox { color: #345 ;  
   background: #f7f7f7 ; text-align: left ; font-size: 70%; line-height: 1.3em ;
   padding: 0% 3% 1% 3%  ; 
   margin: 0% 0% 0% 0% ; border: 1px solid #0bf ; clear: both; display: block;  }

.fb-page { background: #09d ; }

div.back1 { background: url(../pics/background1.jpg) ;   background-repeat: no-repeat;
    background-size: 100% auto ; border: 0px solid black; }


.fit { object-fit: cover; width:400px; height:300px } 
.fit1 { object-fit: cover; width:300px; height:300px } 


.goright { display: table; float: right; padding: 0% 0% 0% 0% ; margin: 0% 0% 0% 3% ; 
           border : 1px solid #bbb; border-bottom: 0px solid #ccc; background: #eee;  }

.goleft  { display: table;  float: left; padding: 0% 0% 0% 0% ; margin: 0% 3% 0% 0% ; 
           border : 1px solid #bbb; border-bottom: 0px solid #ccc; background: #eee; }

.capt { padding: 0% 0% 0% 0% ; line-height: 1.3em;
        text-align: center; font-size: 80%; font-style: italic ; margin: 0% 0% 0% 0% ; }

.gocent  { display: table;  float: left; padding: 0% 0% 0% 0% ; margin: 0% 0% 0% 0% ; 
           border : 1px solid #bbb; border-bottom: 0px solid #ccc; background: #eee; }

.mid  { display: table;  float: left; padding: 0% 0% 0% 0% ; margin: 0% 0% 0% 0% ; 
           border : 1px solid #bbb; border-bottom: 0px solid #ccc; background: #eee; }


.goright0 { display: table; float: right; padding: 0% 0% 0% 0% ; margin: 0% 0% 0% 3% ; 
           border : 0px solid #09d; border-bottom: 0px solid #09d; background: #fff;  }

.goleft0  { display: table;  float: left; padding: 0% 0% 0% 0% ; margin: 0% 3% 0% 0% ; 
           border : 0px solid #09d; border-bottom: 0px solid #09d; background: #fff; }

.capt0 { display: table-caption; caption-side: bottom; background: #fff ; padding: 0% 0% 2% 0% ;
        border : 0px solid #09d;  border-top: 0px solid #09d; line-height: 1.3em;
        text-align: center; font-size: 80%; font-style: italic ; margin: 0% 0% 3% 0% ; }


.aqbox { margin: 2% 2% 2% 2% ; padding: 2% 2% 2% 2% ; 
        font-size: 110%; background: #58a; color: #fff; }


.fbbox { margin: 0% 0% 0% 0% ; padding: 3% 3% 2% 3% ; text-align: center; 
        font-size: 110%; background: #687; color: #fff; }

.fgbox { margin: 0% 0% 0% 0% ; padding: 2% 3% 4% 3% ; 
        font-size: 110%; background: #58b; color: #fff; }

.map-container { position: relative; padding-bottom: 82%; height: 0; overflow: hidden; }

.map-container iframe { position: absolute; top:0; left: 0; width: 100%; height: 100%; }

.rectc { font-size: 110%; background: #d04; color: #fff; line-height: 3.0em; font-weight:bold;
     box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.55);
     padding:3% 3% 3% 3%; margin: 1% 1% 1% 1%; border: 2px solid #a04; }
.rectc a {  color: #fff; }
.rectc a:visited { color: #fff; }
.rectc a:hover { color: #5ff; }

.corner { -webkit-border-radius: 25px;
             -moz-border-radius: 25px;
                  border-radius: 25px;
                  border-collapse:separate; }

/* ----------------------------------------------*/


/* Footer */
#footer { position: relative; width:100%; background:#27a; font-size: 76%; 
          color:#fff; font-weight: normal; padding: 1% 2% 1% 2% ;
          overflow:hidden; border: 0px solid #f00; line-height: 1.2em; }

.fcol1 { float: left; width: 46%; text-align: left; padding: 0% 0% 0% 0% ;  
          border: 0px solid #cc7; }

.fcol2 { float: right; text-align: right; width: 46%; padding: 0% 0% 0% 0% ; 
         border: 0px solid #c7c; }

/* ------------------------------------------------------ */

div.tbox { margin: 30px; background-color: #fff; border: 0px solid black; opacity: 0.6; }
div.tbox p { margin: 5%; font-weight: bold; color: #000; }

input[type=radio] { transform: scale(1.5); }

.gbox { margin: 2% 3% 2% 3% ; padding: 2% 3% 2% 3% ; 
          background: rgba(17, 34, 51, 0.5) ; font-size: 100%; color: #fff; }

.center { display: block; margin-left: auto; margin-right: auto; width: 93.5%; }

.orbox { margin: 2% 3% 2% 3% ; padding: 2% 3% 2% 3% ; 
        font-size: 120%; background: #e35825; color: #fff; }

.rect { font-size: 120%; background: #05b; color: #fff; line-height: 1.5em;
     box-shadow: 4px 4px 9px rgba(0, 0, 0, 0.15); display: inline-block;
          padding:1% 2% 1% 2%; margin: 1% 4% 2% 0%; border: 1px solid #bbb; }
 
.wh { font-size:200%; text-align:center; margin: 0.0em 0 0.2em 0; color:#fff;}


.aq { color: #078 ; font-size: 120%; }
.gr { color: #560 ; font-size: 120%; }
.or { color: #e52 ; font-size: 120%; }

/* ------- Responsive Grid  ---------------------------- */

* { box-sizing: border-box; } 

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

[class*="col-"] { float: left; padding: 0px 4px; }

/* For mobile phones: */
[class*="col-"] { width: 100%; }

    /* For tablets: */
@media only screen and (min-width: 600px) {
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}

    /* For desktop: */
@media only screen and (min-width: 768px) {
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%; }
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}

/*-------------------------------------------------------------------------*/