/*
font-family: Arial, Helvetica, sans-serif;
font-family: "Roboto Light", sans-serif; 
     font-family: Roboto, sans-serif; 
font-family: Montserrat, sans-serif;
font-family: Cabin, sans-serif;
*/

html * { font-size:100%; }

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

/* need display: block; or few pxs space reserved below images to allow for text descenders! */
img { width: 100%; height: auto; display: block;  }

body a:hover { opacity: 85%; }

.flex-container { display: flex; }

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

.frontcontain { width: 100%; overflow:hidden; background: #fcf9f2; background: #f4f4f4 ;
            float:left; padding: 0 0% 0 0% ; border-top: 1px solid #797; background: #896; }

.blurb {background: #08a; padding: 2% 10% 3% 10% ; color: #fff; text-align:
center; border: 0px solid #f00; font-family: Montserrat, sans-serif;
font-size:120%; line-height: 1.4em; }

.fb-page { font-size: 150%; }

.contain { width: 100%; overflow:hidden; background: #fff ; 
            float:left; padding: 0px 5% 0 5% ; border-top: 1px solid #797; }

.leftbox { color: #222 ; text-align: left ; line-height: 1.3em; padding: 1% 4% 1% 4%  ; 
   margin: 0% 2% 0% 2% ; border: 0px solid #ff0 ; clear: both; display: block;  }

.strip1 { background:url(../pics/backgroundfront.jpg); background-repeat: no-repeat;
        background-size: cover; width: 100%; height: auto; 
        color: #fff;text-align: center; border: 0px solid #faa; font-weight: 700;
        padding: 2% 2% 2% 2% ; line-height: 1.3em; }


.news {background: #fff ; border: 0px solid #ddd ; padding: 2% 6% 3% 2% ;
       line-height: 1.4em; font-size: 100%; color: #269;
       text-align: left ; margin: 0 0 0 0; }

.cap {font-size: 80%; font-style: italic; float: right; }

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

.capt { display: table-caption; caption-side: bottom; background: #eee ; padding: 2% 2% 2% 2% ;
        border : 1px solid #bbb;  border-top: 0px solid #ccc; line-height: 1.3em;
        text-align: center; font-size: 80%; font-style: italic ; margin: 0% 0% 3% 0% ; }

.signbox { margin: 0% 2% 6% 2% ; padding: 2% 5% 3% 5% ; text-align: center; border-radius: 25px;
        font-size: 80%; line-height: 1.2em; border: 1px solid #aaa; 
         background: #497; color: #fff; }

.latest { margin: 3% 2% 4% 2% ; padding: 2% 4% 4% 5% ; text-align: center;
        font-size: 90%; line-height: 1.2em; background: #fff; 
        border: 9px dotted #fd9; border-radius: 50px; color: #242; }

.notice { margin: 5% 2% 6% 2% ; padding: 1% 6% 6% 6% ; text-align: center;
        font-size: 80%; line-height: 1.2em; background: #fff; 
        border: 1px solid #fd9; border-radius: 50px; color: #242; }

.snip { margin: 0% 0% 1% 0% ; padding: 2% 3% 4% 3% ; text-align: left;
        font-size: 80%; line-height: 1.2em; color: #345; }

.snippet { margin: 0% 0% 1% 0% ; padding: 0% 9% 4% 9% ; text-align: left;
        font-size: 80%; line-height: 1.2em; color: #fff;  }

.cbox { margin: 3.0% 2% 0% 2% ; padding: 1% 3% 2% 3% ; text-align: center;
        font-size: 90%;line-height:1.3em; background: #fff; color: #353; }

.aqbox2 { margin: 0% 0% 0% 0% ; padding: 0.6% 5% 0.6% 5% ; 
        font-size: 100%; background: #59c; color: #fff; }

.gbox {padding:3% 3% 3% 3%; margin: 0.0% 0.0% 0.0% 0.0% ; line-height: 1.3em;
font-size: 95%; background: #f7f7f7; border: 1px solid #eee ; }

.rect1 { font-size: 200%; background: #ab8; color: #fff; line-height: 1.3em;
        box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.25); display: inline-block;
        padding:3.5% 3% 3.5% 3%; margin: 2% 0% 2% 0%; border: 1px solid #999; 
        border-radius: 12px; }

/* Query Form */
label.fm {width:80px; display:inline-block;}
img.note {position:absolute; width: 387px; height: 200px; top:400px;left:300px; }
input[type=checkbox] { transform: scale(1.5); }
input[type=submit] { transform: scale(1.2); }

.iframe { -moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 4px 4px 14px #000;
-webkit-box-shadow: 4px 4px 14px #000;
box-shadow: 4px 4px 14px #000; }

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

.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: 0 10px 0 10px; border: 0px solid #f00 ; }

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

    /* For tablets: */
@media only screen and (min-width: 600px) {
    .col-m-1 {width: 8.33%;}
    .col-15 {width: 12.50%;}
    .col-m-2 {width: 16.66%;}
    .col-m-24 {width: 20.00%;}
    .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: 1220px) {
    .col-1 {width: 8.33%;}
    .col-15 {width: 12.50%;}
    .col-2 {width: 16.66%;}
    .col-24 {width: 20.00%;}
    .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%;}
}

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