
/* -- Style ----------------------------------------------------------- */
/*
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;
font-family: Lato, sans-serif; 
font-family: Metropolis, sans-serif;
*/

html * { font-size:100%; }

/* ------- Body  ---------------------------- */

body { font-family: Metropolis, sans-serif; font-weight: 400; padding:0; margin:0;
       background: #025; color:#046; font-size:100%; line-height:130%; }

.container     { overflow:hidden; float:left; border: 0px solid #f00;
             background:#fff; margin: 0% 0% 0% 0% ; }
.container a:hover { opacity: 85%; }

.col-container     { overflow:hidden; float:left; border: 0px solid #f00;
             background:#fff; margin: 0% 0% 0% 0% ; }
.col-container a:hover { opacity: 85%; }

.col2 { padding: 2% 5%; }

img { max-width: 100%;  height: auto; display: block;} /*need display: block to remove gap beneath */
img, figure { margin: 0; }

.wide { width: 100% }

.float-left { float:left; display:inline; margin: 1.5em 1em 0 0; }
.float-right { float:right; display:inline; margin: 1.5em 0 0 1em; }
.cent1 { display:block; text-align:center; margin: 0.9em auto 0 auto; }

.left { text-align: left; }

.logo {position: fixed; top: 1%; left: 4%;  float:left;  z-index: 10; max-width: 250px;}
@media screen and (max-width: 1000px) {
.logo {position: sticky; top: 1%; right: 4%; float:right;  z-index: 10; max-width: 150px;}
}

.tinycontact { color: #fff; text-align: right; padding: 0.5% 7% 0.5% 0% ;
             font-size: 80%; background: #025; }
@media screen and (max-width: 1000px) {
.tinycontact { color: #fff; text-align: left; padding: 1.0% 0% 1.0% 7% ;
             font-size: 80%; background: #025; white-space: pre; }
}

.material-icons { font-size:24px;color:#fff; }
.tmreg { font-size:50%; }
.sm80 { font-size:80%; }
.sm60 { font-size:60%; }
.sm100 { font-size:100%; }
.lg130 { font-size:130%; }
.lg170 { font-size:170%; }

.white { color: #fff; }
.rust  { color: #d52; }
.duckegg  { color: #cff; }
.midblue  { color: #aef; }
.sea  { color: #29c; }
.dkblue  { color: #047; }
.purp  { color: #e07; }

.goldrow {background: #fff; font-size: 95%; line-height: 1.3em; padding: 1% 0% 0.0% 0%;}

.pad1 {padding: 0% 5% 3% 6%;}
.modules {margin: 2% 10% 2% 15% ; }
.max250 { max-width: 250px; }
.offers { margin: 1% 4.0% 1% 4.0% ; padding: 0% 0.5% 1% 0.5% ; }

.fullstrip { background:#fff;  padding: 0% 10% 1% 10%; line-height: 1.3em; }

.strip1 { background:#fff; text-align: center; margin: 0% 0% ;
          padding: 2% 20% 0.5% 20% ; line-height: 1.3em; }

.strip1a { background:#fff; text-align: left; margin: 0% 0% 0% 0% ;
          padding: 2% 20% 0.5% 20% ; line-height: 1.3em; }


.strip2a { background:#ffe; background:url(../pics/balloons.png);
background-repeat: repeat-x; color: #037; text-align: center; padding: 2% 7% 3% 7% ;
         line-height: 1.3em; }

.strip1b { background:#ffe; text-align: center; margin: 0% 0% ; font-weight: 500;
          padding: 2% 5% 2% 5% ; line-height: 1.3em; }

.bluebox { background:#069; text-align: left; font-size:80%;
line-height: 1.3em; font-weight: 500; color: #fff; 
         margin: 1% 0% 0.5% 0% ; padding: 5% 5%  5% 5% ; }


.quote {line-height: 1.3em;  color:#159; font-weight:600;
         text-align:center; padding: 0% 8% 2% 8%; }

.strip2 { background:#26a; color: #fff; text-align: center; padding: 3% 6% 1% 6% ;
         line-height: 1.3em; }

.strip4 { background:#366; text-align: left; color: #fff; padding: 4% 15% 4% 15% ; }

.darkback {background: rgba(34, 68, 102, .7) ; margin : 0% 10%; text-align: left; }
.darkerback {background: rgba(34, 68, 102, .8) ; margin : 0% 9%; text-align: left; }
.darkestback {background: rgba(34, 68, 102, .9) ; margin : 0% 9%; text-align: left; }

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

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

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

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

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

.strip7 { background:#fff; text-align: center; padding: 3% 10% 4% 10% ; }

.strip8 { background:#37b; color: #fff; text-align: center; padding: 2.5% 6% 2% 6% ;
         line-height: 1.3em; }

.strip9 { background:#fff; text-align:left; padding: 2% 10% 2% 10% ; line-height: 1.3em; }

.strip10 { background:#158; text-align: center; color: #fff; font-weight: 500;margin: 0% 10%;
          padding: 2% 5% ; }

.strip11 { background:#fff; text-align:left; padding: 2% 20% 2% 20% ; line-height: 1.3em; }

.dark12 {background: rgba(34, 68, 102, .7) ; margin : 2% 6%; text-align: left; }

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

.strip12 a:link {border-bottom: 0px ; color: #fff; }
.strip12 a:visited {border-bottom: 0px ; color: #fff;}
.strip12 a:hover {border-bottom: 0px ; color: #cef;}

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

.latest { margin: 0% 0% 0% 0% ; padding: 2% 4% 6% 4% ; text-align: center;
        line-height: 1.2em; background: #fbf8f3; max-width: 260px; font-size: 80%;
        border: 9px solid #fd9; border-radius: 20px; color: #246; }

.fixednotice { position: fixed; max-width: 250px; padding: 1em; z-index: 10; right: 0.0%; top: 10%; }
@media screen and (max-width: 1000px) {
.fixednotice {position: fixed; max-width: 200px; padding: 1em; z-index: 10; right: 0.0%; top: 10%; }
}

.strip14 { background:#fff; text-align:left; 
          padding: 2% 6% 2% 6% ; line-height: 1.3em; }

.strip15 { background:#059; text-align: center; font-weight: 700; color: #fff;
         margin: 1% 20% 0.5% 20% ; padding: 2% 3%  2% 3% ; }

.rectc { font-size: 100%; background: #eff; line-height: 2.0em;
     box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.25);
     padding:1% 1% 1% 1%; margin: 1% 1% 1% 1%; border: 1px solid #aaa; }

.rectd { font-size: 100%; background: #bdf; line-height: 2.0em;
     padding:2.3% 3% 2% 3%; }
.rectd a:hover { color: #369; opacity: 85%; }



.capt { font-size: 85%; line-height: 1.2em; padding-top: 2%; }
.cent { text-align: center; border: 0px solid #7cc; }

/*
.hero-text { text-align: center; position: absolute; top: 50%;
  left: 50%; transform: translate(-50%, -50%); color: white;
}*/

.rect { font-size: 90%; background: #ddd; line-height: 2.5em;
     box-shadow: 4px 4px 9px rgba(0, 0, 0, 0.15);
     padding:1% 1% 1% 1%; margin: 1% 1% 1% 1%; border: 1px solid #bbb; }
.rect a { text-decoration: none; }
.rect a:hover { color: #d26; }

.greybox1 { color: #333 ; background: #f2f2f2 ; text-align: left ; padding: 2% 3% 3% 5% ; 
   margin: 2.0% 5% ; border: 0px solid #ddd ; }

/* ------- Footer  ---------------------------- */

#footer { position: relative; width:100%; background:#fff; 
          font-size: 100% ; line-height: 1.0em ; text-align:left; 
          margin: 0.0em 0 0em 0; border-top: 0px solid #238 ;
          padding: 1% 2% 1% 2% ; overflow:hidden; font-weight:normal;  }

#footer ul, ol, li { font-size:1em; line-height:1.2em; margin: 0.1em 0 0.1em 0.0em; }

#footer img { float: left; padding-top: 0.0em ; padding-left: 0.2em ;
  padding-right: 0.5em; padding-bottom: 0.0em ; } 


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

* { box-sizing: border-box; }
.row::after { content: ""; clear: both; display: table; }
[class*="col-"] { float: left; padding: 0px 20px; 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-m-15 {width: 12.5%;}
    .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: 968px) {
    .col-1 {width: 8.33%;}
    .col-15 {width: 12.5%;}
    .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%;}
}

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

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

/*--- Headings -----------------------------------------------*/

	h1, h2, h3, h4, h5, h6 {
                font-family: Metropolis, sans-serif;
		font-style: normal; color:#333; margin:0; }

	h1 { font-size:220%; line-height: 1.0em; text-align:center;
                font-weight: 600;
		margin: 0.0em 0 0.5em 0; color:#37c; }

	h2 { font-size:170%; line-height: 1.2em; text-align:center;
                font-weight: 600;
		margin: 0.0em 0 0.5em 0; color:#099; }

	h3 { font-size:130%; line-height: 1.2em;
                font-weight: 500;
		margin: 0.4em 0 0.2em 0; color:#08a; }

	h4 { font-size:120%; line-height: 1.2em;
		padding:0.4em 0 0.2em 0; color:#26b; }

	h5 { font-size:120%; line-height: 1.2em;
		margin: 0.3em 0 0.3em 0; color:#089; }

	h6 { font-size:100%; line-height: 1.2em;
		margin: 1.0em 0 0.1em 0; color:#aff; }

	/*--- Links ---------------------------------------------- */

	a { color:#aaa; background:transparent; font-weight: normal;
           outline-style: none; }

	a:link   { color:#124; 
             	 text-decoration:underline; 
       	      	 }

	a:visited { color:#346;  
             	 text-decoration:none; }

	a:focus, a:hover, a:active { color:#346; 
             	   text-decoration: underline; }

  	a.non:link {border-bottom: 0px ; }
	a.non:visited {border-bottom: 0px ;}
	a.non:hover {border-bottom: 0px ;}

  	a.white:link {border-bottom: 0px solid #fff ; color: #fff; }
	a.white:visited {border-bottom: 0px  solid #fff; color: #fff;}
	a.white:hover {border-bottom: 0px  solid #fff; color: #fff;}

  	a.whiteline:link {border-bottom: 1px solid #fff ; color: #fff; }
	a.whiteline:visited {border-bottom: 1px  solid #fff; color: #fff;}
	a.whiteline:hover {border-bottom: 1px  solid #fff; color: #fff;}

        a.box:link, a.box:visited { background-color: #09a; color: white;
          padding: 8px 15px; text-align: center; text-decoration: none;
          display: inline-block; border-bottom: 0px ;}

        a.box:hover, a.box:active { border-bottom: 0px ;background-color: #0bc; }

        a.box1:link, a.box1:visited { background-color: #eee; color: white;
          padding: 8px 15px; text-align: center; text-decoration: none;
          display: inline-block; border-bottom: 0px ;}

        a.box1:hover, a.box1:active { border-bottom: 0px ;background-color: #f8f8f8; }



	/* --- Lists --------------------------------------- */

	ul, ol, dl { margin: 0.2em 0 0.1em 0.0em; }

	ul { list-style-type:disc; }
	ul ul { list-style-type:disc; margin-top:0; }
	ul ul ul { list-style-type:disc; margin-top:0; }
	ol { list-style-type:decimal; }
	ol ol { list-style-type:lower-latin; margin-top:0; }
	ol ul { list-style-type:circle; margin-top:0; }

	li { padding: 0.1em 0 0.1em 0.0em; }

	dt { font-weight:bold; }

	dd { margin:0 0 1.5em 0.8em; }

	/* --- Text Formatting ------------------------------------- */

	p { margin: 0.7% 0  0.9% 0; }

	hr { color:#fff; background:transparent; margin:0.3em 0 0.8em 0;
		padding:0 0 0.0em 0; border:0; border-bottom:1px #ace solid; }

	blockquote, cite, q { font-family: Georgia, "Times New Roman", Times, serif;
		font-style:italic; margin:1.5em 0 0 1.5em; color:#666; }

	strong, b { font-weight:bold; }

	em, i { font-style:italic; }

	small { font-size:60%; line-height: 120%; }

	textarea, pre, code, kbd, samp, var, tt { 
        font-family:"Bitstream Vera Sans Mono", "Courier New", Courier; }

	pre { line-height:1.5em; margin: 1.5em 0 0 0; white-space: pre;
		white-space: pre-wrap; word-wrap: break-word; }
	pre, code { color:#800; }

	kbd, samp, var, tt { color:#666; font-weight:bold; }

	var, dfn { font-style:italic; }

	sub, sup { font-size: 75%; line-height: 0; position: relative;
		vertical-align: baseline; }
	sup { top: -0.5em; }
	sub { bottom: -0.25em; }

	/* ------------- Tables -------------------------------------------  */

	table { width:100%; border-collapse:collapse;
		margin: 0em 0 0 0; color:#333;
		border-top: 0px #ccc solid; }
        
        table.img { max-width: 100%; } 

	table.cols { border: 1px #ccc solid; }

	.cols td { background:#f8f8f8; border-right:1px #ccc solid;
		border-bottom:1px #ccc solid; }

	table.narrow { margin:  1.4286em 0 0 0; }

	table.narrow th,
	table.narrow td { padding: 0 0.5em; line-height: 1.4286em; }

	table caption { font-variant:small-caps; }

	th, td { line-height: 1.3em; vertical-align: top; padding: 0.6em 0.6em; }

	th *:first-child,
	td *:first-child { margin-top: 0; }

	th.nowrap,
	td.nowrap { white-space: nowrap; }

	thead th { text-align: left; color:#000; border-bottom:2px #000 solid; }
	tbody th { text-align: left; border-top:1px solid #ccc; text-align:left; }
	tbody td { text-align: left; border-top:1px solid #ccc; }

	table.noborder { border-top: 0px #cc0 solid; }
	.noborder tr { border-top: 0px #c0c solid; padding: 0 0 0 0 ; }
	.noborder td { border: 0px #c0c solid; padding: 0 0 0 0 ; }

	table.bordertable { font-size: 85%;  }
	.bordertable thead th { border-right:1px #ccc solid;
		border-bottom:1px #ccc solid; }
	.bordertable tbody th { border-right:1px solid #ccc; }
	.bordertable tbody tr td {   border:1px #ddd solid; }

        table.darktable { font-size: 85%;  }
        .darktable thead th { border-right:1px #246 solid;
                border-bottom:1px #246 solid; }
        .darktable tbody th { border-right:1px #246 solid ; }
        .darktable tbody tr td { line-height: 1.0em;  border:1px #246 solid; }


	/* highlight row on mouse over
	tbody tr:hover th,
	tbody tr:hover td {
	background:#fff;
	} */
}
