
* {
  box-sizing: border-box;
}

img {
  width:100%;
  height:auto;
  margin:auto;
}

/* For mobile phones and tablets*/
#largebanner {
  display:none;
}



@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

	/* For landscape and Desktop only */
    #smallbanner {
      display:none;
    }
  }
}


@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

    #largebanner {
      display:block;
    }
  }
}

  
iframe {
   max-width:100%;
   max-height:auto;
   margin:auto;
}

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


[class*="col-"] {
  float: left;
  padding: 15px;
}
 
[class*="col-r"] {
  float: right;
  padding: 15px;
}

/* For mobile phones: */

[class*="col-"] {
  width: 100%;
}

@media only screen and (orientation: landscape) {
    body {
/* For Landscape Orientation */ 

  .col-m-l-1 {width: 8.33%;}
  .col-m-l-2 {width: 16.66%;}
  .col-m-l-3 {width: 25%;}
  .col-m-l-4 {width: 33.33%;}
  .col-m-l-5 {width: 41.66%;}
  .col-m-l-6 {width: 50%;}
  .col-m-l-7 {width: 58.33%;}
  .col-m-l-8 {width: 66.66%;}
  .col-m-l-9 {width: 75%;}
  .col-m-l-10 {width: 83.33%;}
  .col-m-l-11 {width: 91.66%;}
  .col-m-l-12 {width: 100%;}
  }
}

@media only screen and (min-width: 600px) {
/* For tablets: */

  .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%;}
}

@media only screen and (min-width: 768px) {
/* For desktop: */

  .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%;}
} 

@media only screen and (min-width: 768px) {
/* For desktop: */
/*Right float*/

  .col-r-1 {width: 8.33%;}
  .col-r-2 {width: 16.66%;}
  .col-r-3 {width: 25%;}
  .col-r-4 {width: 33.33%;}
  .col-r-5 {width: 41.66%;}
  .col-r-6 {width: 50%;}
  .col-r-7 {width: 58.33%;}
  .col-r-8 {width: 66.66%;}
  .col-r-9 {width: 75%;}
  .col-r-10 {width: 83.33%;}
  .col-r-11 {width: 91.66%;}
  .col-r-12 {width: 100%;}
}

body {  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 20px;  
  padding-left: 0px;  
  background-color: #b2e0b2;
  font-size: 100%;
}

h1 { 
  font-size: 2.5em;	
  background-color: transparent;  
  text-align: center;
}

h2 { 
  font-size: 2em;	
  background-color: transparent;  
  text-align: center;
}

h3 { 
  font-size: 1.5em;	
  background-color: transparent;  
  text-align: center;
}

h4 {
   text-align: center;
}

p {
  font-size: 1.5em;
}

li {
  font-size: 1.5em;
}

img {
  width: 100%;
}

#page {  
  width: 98%; 
  height: auto; 
  margin-left: auto;  
  margin-right: auto; 
  margin-top: 40px; 
  margin-bottom 20px;
  background-color: transparent;  -webkit-
  border-radius: 0px 0px 15px 15px;
  border-radius: 0px 0px 15px 15px;  -webkit-
  box-shadow: 4px 4px 15px 0px black;
  box-shadow: 4px 4px 15px 0px black;
  background-image: url('../images/texture.png');
  /*background-repeat: repeat-y;
  background-size; 100%*/
}

header {  
  width: 100%;
  height: auto;  
  margin-left: auto; 
  margin-right: auto;  
}

#headerlogo {
  display:block;
  border-radius: 100%;
  border-style:solid;
  border-color:white;
  border-size:1px; 
  box-shadow: 4px 4px 15px 0px black;
  width: 40%;
  height:auto;
  position:absolute;
  left:30%;
  top:30px;
}

@media only screen and (min-width: 600px) {
	/*for tablets*/

  #headerlogo {
    display:block;
    border-radius: 100%;
    border-style:solid;
    border-color:white;
    border-size:1px; 
    box-shadow: 4px 4px 15px 0px black;
    width: 35%;
    height:auto;
    position:absolute;
    left:19px;
    top:29px;
  }
}

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {
  /* For landscape and Desktop only */

    #headerlogo {
      display:none;
    }
  }
}

/*header img {
	width: 100%;
	height: auto;
}*/

.preheader {
  display:none;
}


@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

/* only landscape or desktop */

  .preheader {
    display:block;
    width: 98%;
    margin: auto;	
    text-align: center;
    padding-top: 5px;  
    padding-right: 5px;  
    padding-bottom: 5px;  
    padding-left: 5px;  
    font-size: .95em; 
    }
  }  
}

#tagline {  
  text-align: left;
  display: inline-block;
  float: left;
  margin-left: auto;
  color: #162c16;  
  background-color: transparent;
 
}

#contact {  
  text-align: right;
  display: inline-block;
  float: right;
  margin-right: auto;
  margin-bottom: 5px;
  background-color: transparent;
}

/* phone screen */
nav {
  display: inline-block;
  text-align: center;  
  width: 100%;  
  position:relative;
  top:5px;
  z-index:2;
}


@media only screen and (min-width: 600px) {

  nav {
    display: block;
    position: absolute;
    top: 20px; 
    right: 20px;
    z-index: 2;
    text-align: center;  
    width: 40%;  

    }
  }

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

  /* only landscape or desktop */

    nav { 
      background-color: #b2e0b2;
      background-image: url("../images/navigation.png");  
      background-repeat: /*no-repeat*/;
      background-size 100% 100%;
      position: relative;
      top: -20px;
      right:0;
      text-align: center;  
      width: 100%;  
      height: 50px;
      margin-right: auto;  
      margin-left: auto; 
      border-style: solid;  
      border-width: 1px; 
      border-color: white;
      -webkit- border-radius: 15px 15px 15px 15px;
      border-radius: 15px 15px 15px 15px; 
      -webkit- box-shadow: 4px 4px 15px 0px black;
      box-shadow: 4px 4px 15px 0px black;
    }
  }
}  

nav ul {
  padding-left:0;	
}
    nav ul li { 
      font-size: 18px;
      line-height: 50px;
      color: white;  
      -epub-text-transform: uppercase;
      text-transform: uppercase;  
      text-align: center;
      vertical-align:middle;
      display: block;
      margin-top: 10px;
      height: 50px;
      background-color: #b2e0b2;
      background-image: url("../images/navigation.png");  
      background-repeat: no-repeat;
      background-size: 100% 100%;
      border-style: solid;  
      border-width: 1px; 
      border-color: white;
      -webkit- border-radius: 15px 15px 15px 15px;
      border-radius: 15px 15px 15px 15px; 
      -webkit- box-shadow: 4px 4px 15px 0px black;
      box-shadow: 4px 4px 15px 0px black;
      
    }
    

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

  /* only landscape or desktop */

    nav ul li {  
      font-size: 18px;
      line-height: 50px;
      position: relative;
      top:-17px;
      vertical-align: middle;
      color: white;  
      display: inline;  
      background-color: transparent;  
      background-image:none;
      border-style:none;
      box-shadow:none;
      -epub-text-transform: uppercase;
      text-transform: uppercase;  
      text-align: center;
    }
  }
}

    nav ul li a {  
      text-decoration: none;  
      background-color: transparent;  
      padding-top: 11px;  
      padding-right: 18px;  
      padding-bottom: 11px;  
      padding-left: 20px;  
      color: white;
    }
 
   nav ul li.selected a{  
      text-decoration: none;
      background-color: #7dc37d;  
      color: black;  
      -webkit-box-shadow: 1px 1px 3px black inset;
      box-shadow: 1px 1px 3px black inset; 
    }

    nav ul li a:hover {  
      text-decoration: none;  
      background-color: #7dc37d;  
      color: black;  -webkit-box-shadow: 1px 1px 3px black inset;
      box-shadow: 1px 1px 3px black inset;  
    }

    nav ul li a:visited {  
      text-decoration: none;  
      background-color: transparent;
    }

section {  
  border-style: solid;    
  border-width: 0px 1px 1px 1px;  
  border-color: white;   
  width: 100%;

/*
  position:relative;
  top:-120px;
*/
  /*  margin-left: 6px;
  margin-right: 4px; 
  padding-top: 30px;
  padding-bottom: 30px;
  padding-right: 20px;  
  padding-left: 20px;  
  font-size: 14pt; */
  -webkit-border-radius: 0px 0px 15px 15px;
  border-radius: 0px 0px 15px 15px; 
/*  -webkit-box-shadow: 4px 4px 15px 0px black; 
  box-shadow: 4px 4px 15px 0px black;
  position: relative;
  top: 1px;
  right: 1px;*/
  z-index: 1;
  overflow: auto;
}

section a {  
  text-decoration: none;  
  background-color: transparent;
}

section a:hover {  
  text-decoration: underline;
}

.mainblock { 
  /*font-size: 14pt;  */
  text-align: left;
  width: 90%;
  margin: auto ;
}

/*
.mainblock img {
  width: 500px
  height: auto;
  margin: auto;

}
*/
/* 
@media only screen and (min-width: 768px) {
/* For desktop: */
/*
.leftblock {
  float: right;
  padding: 15px;
  width: 50%;
  text-align: left;
  }
}
*/

/*.leftblock img {
  float: right;
}

.leftblock iframe {
  float: right;
}

.rightblock {
  display: inline-block;
  text-align: left;
  margin-top: 50px ;
  padding: 50px;
}

.rightblock img {
  float: left;
  Margin-Right: 20px;
}

.rightblock iframe {
  float: left;
  Margin-Right: 20px;
}
*/

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

  /* only landscape or desktop */

    [id*="text-"] {
      text-align: left;
    }
  }
}
/*
#text-1 {
  padding:35px 0;
}

#text-2 {
  padding:125px 0;
}

#text-3 {
  padding:125px 0;
}

#text-4 {
  padding:65px 0;
}

#text-5 {
  padding:40px 0;
}

#text-6 {
  padding:30px 0;
}

*/

dl {
   font-size: 1.5em;
}

.webclock {
   text-align:center;
   background-color: #b2e0b2;
   display:block;
   /*
   padding-top: 1px;
   padding-right: 3px;
   padding-left: 15px;
   padding-bottom: 10px;
   */
   width: 100%;
   height:auto
   margin:auto;
   margin-top: 15px;
   margin-bottom: 15px;
   padding: 20px;
   overflow: hidden;-webkit-box-shadow: 4px 4px 15px 0px black;
   box-shadow: 4px 4px 15px 0px black; -webkit-border-radius: 15px 15px 15px 15px;
   border-radius: 15px 15px 15px 15px;
}

@media only screen and (min-width:600px) {
  .webclock {
    width: 80%;
    margin:auto;
  }
}

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:768px) {

	/* For landscape and Desktop only */

    .webclock {
      width: 60%;
      margin:auto;
/*      
      position:absolute;
      z-index-3;
      top: 45px;
      right:35px;
      */
    }
  }
}

.webclock h1{
   font-size: 1em;
}

.webclock ul li {
      padding-left:0;
      font-size:16px;
      line-height: 40px;
      color: white;  
      -epub-text-transform: uppercase;
      text-transform: uppercase;  
      text-align: center;
      vertical-align:middle;
      display: block;
      margin:auto;
      margin-top: 10px;
      margin-bottom: 10px;
      width:75%;
      height: 40px;
      background-color: #b2e0b2;
      background-image: url("../images/navigation.png");  
      background-repeat: no-repeat;
      background-size: 100% 100%;
      border-style: solid;  
      border-width: 1px; 
      border-color: white;
      -webkit- border-radius: 50px 50px 50px 50px;
      border-radius: 50px 50px 50px 50px; 
      -webkit- box-shadow: 4px 4px 15px 0px black;
      box-shadow: 4px 4px 15px 0px black;

}

.webclock ul {
	padding-left:0px;
	margin: auto;
}

.webclock ul li:hover {
	background:url("../images/navigationdown.png");
	background-repeat:no-repeat;
	text-decoration:none;
	color:white;
}

.webclock ul li a{
	text-decoration: none;
	color:white;
}
/*
.emplog {
   width: 60%;
   height: auto;
   background: url('../images/suplogup.png');
   background-repeat: no-repeat;
}

.emplog:hover {
    background: url('../images/suplogdown.png');
    background-repeat: no-repeat;
}

.suplog {
   width: 60%;
   height: auto;
   background: url('../images/emplogup.png');
   background-repeat: no-repeat;
}

.suplog:hover {
   background: url('../images/emplogdown.png');
   background-repeat: no-repeat;
}


.replog {
   width: 60%;
   height: auto;
   background: url('../images/reportsup.png');
   background-repeat: no-repeat;
}

.replog:hover {
   background: url('../images/reportsdown.png');
   background-repeat: no-repeat;
}


.paystub {
   width: 60%;
   height: auto;
   background: url('../images/paystubsup.png');
   background-repeat: no-repeat;
}

.paystub:hover {
   background: url('../images/paystubsdown.png');
   background-repeat: no-repeat;
}
*/
.blog {
   background-color: white;
   padding-top: 20px;
   padding-right: 20px;
   padding-left: 20px;
   padding-bottom: 20px;
   width: auto;
   height: auto;
   margin: auto;
   position: relative;
   box-shadow: 4px 4px 15px 0px black;
   box-shadow: 4px 4px 15px 0px black; -webkit-border-radius: 15px 15px 15px 15px;
   border-radius: 15px 15px 15px 15px;
   overflow: auto;
}

.blog img {
   float: left;
   margin: 30px;
   float: left;
   margin-right: 30px;
   box-shadow: 4px 4px 15px 0px black;
}


.productlist {
  position
}

.quote {
   background-color: #005e00;
   display: inline-block;
   padding-top: 30px;
   padding-right: 30px;
   
   padding-left: 30px;
   padding-bottom: 30px;
   margin-top:30px;
   text-align: center;
   width: 400px;
   height: auto;
   position: relative;
   overflow: hidden;-webkit-box-shadow: 4px 4px 15px 0px black;
   box-shadow: 4px 4px 15px 0px black; -webkit-border-radius: 15px 15px 15px 15px;
   border-radius: 15px 15px 15px 15px;
}

.author {
   background-color: #b2e0b2;
   text-align: left;
   display: inline-block;
   padding-top: 5px;
   padding-right: 30px;
   padding-left: 30px;
   padding-bottom: 30px;
   margin-top:30px;
   margin; auto;
   width: 650px;
   height: auto;
   position: relative;
   float: left;
   overflow: auto;
   margin-right: 30px;
   box-shadow: 4px 4px 15px 0px black;
}

.author img {
   float: left;
   margin-right: 30px;
   box-shadow: 4px 4px 15px 0px black;
}

.signature {  
  text-align: right;  
  background-color: transparent;  
  padding-right: 40px;
}

.Weblink {  
  border-top-width: 5px;  
  border-right-width: 5px;  
  border-bottom-width: 5px;  
  border-left-width: 5px;  
  border-top-color: white;  
  border-right-color: white;  
  border-bottom-color: white;  
  border-left-color: white;  
  border-top-style: solid;  
  border-right-style: solid;  
  border-bottom-style: solid;  
  border-left-style: solid;  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;  
  margin-top: 10px;  
  margin-right: 10px;  
  margin-bottom: 10px;  
  margin-left: 10px;
}

.weblink:hover {  
  -webkit-box-shadow: 4px 4px 2px 2px #666666;
  box-shadow: 4px 4px 2px 2px #666666;
}

footer {
  display:none;
}

@media only screen and (orientation: landscape) {
  @media only screen and (min-width:600px) {

/* only landscape, tablet, or desktop */

    footer {  
      display:inline-block;
      text-align: center;  
      width: 98%;
      margin: auto;  
      margin-top:10px;
/*
      padding-top: 10px;  
  padding-right: 10px;  
  padding-bottom: 10px;  
  padding-left: 10px;  
*/
      font-size: .80em;
    }
  }
}


footer a {  
  text-decoration: none;
}

footer a:hover {  
  text-decoration: underline;
}

#webhost {  
  text-align: left;  
  display: inline-block;  
  width: 35%;  
  float: left;  

  margin-left: 20px;

}

#copyright {  
  text-align: right;  
  display: inline-block;  
  width: 35%;  
  float: right;
/*  
  margin-right: 10px;
*/  
}

footer ul li {  
  display: inline;  
  padding-right: 15px;  
  padding-left: 15px;
  font-size: .90em;
}

footer ul li a {  
  text-decoration: none;
}

footer ul li a:hover {  
  text-decoration: underline;
/*
*
#add {  
  width: 476px;  
  height: 266.56px;
}
*/
.Telephone {  
  text-align: right;  
  background-color: transparent;  
  padding-top: 10px;  
  padding-right: 10px;  
  padding-bottom: 10px;  
  padding-left: 10px;
}

