body, html {
	margin:0;
	padding-left: 0px;
    padding-right: 0px;
    height: 100%;
    margin:auto;
    max-width: 1400px;
    min-width: 300px;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:small;
}
.page-wrapper {
    margin:0;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-auto-rows: min-content;
    /*grid-template-rows: min-content;*/
}
.headline {
    background-color: #F2F2F2;
    
}
.hd1 {
    padding: 10px;
    grid-column: 1/5;
    grid-row: span 3;
    z-index: 8;
    position: relative;
}
.hd2 {
    padding: 10px;
    grid-column: 5/-1;
    z-index: 8;
    position: relative;
}
.hd3 {
    padding: 10px;
    grid-column: 5/9;
    grid-row: span 2;
    z-index: 8;
    position: relative;
}
.hd4 {
    padding: 10px;
    grid-column: 9/13;
 /*   grid-row: 5;*/
    z-index: 8;
    position: relative;
}
.hd5 {
    padding: 10px;
    grid-column: 9/13;
 /*   grid-row: 6;*/
    z-index: 8;
    position: relative;
}
.hd6 {
    padding: 10px;
    grid-column: 1/7;
    
    z-index: 8;
    position: relative;
}
.hd7 {
    padding: 10px;
    grid-column: 7/13;
   
    z-index: 8;
    position: relative;
}
.hd8 {
    padding: 10px;
    grid-column: 1/-1;   
    z-index: 8;
    position: relative;
}
.hd9 {
    padding: 10px;
    grid-column: 1/9;   
    z-index: 8;
    position: relative;
}
.hd10 {
    padding: 10px;
    grid-column: 9/13;   
    z-index: 8;
    position: relative;
}
.hd11 {
    padding: 10px;
    grid-column: 1/-1;   
    z-index: 8;
    position: relative;
}
.hd12 {  /*CONTACT PAGE*/
    padding: 10px;
    grid-column: 1/7;
    z-index: 8;
    position: relative;
}
.hd13 { /*CONTACT PAGE*/
    padding: 10px;
    grid-column: 7/13;
    grid-row: span 2;
    z-index: 8;
    position: relative;
}
.hd14 { /*CONTACT PAGE*/
    padding: 10px;
    grid-column: 1/7;
    z-index: 8;
    position: relative;
}
.hd15 {
    padding: 10px;
    grid-column: 1/7;   
    z-index: 8;
    position: relative;
}
.hd16 {
    padding: 10px;
    grid-column: 7/13;   
    z-index: 8;
    position: relative;
}
.hd17 {
    padding: 10px;
    grid-column: 5/9;   
    z-index: 8;
    position: relative;
}
.hd18 {
    padding: 10px;
    grid-column: 9/13;   
    z-index: 8;
    position: relative;
}
.hd19 {
    padding: 10px;
    grid-column: 5/9;   
    z-index: 8;
    position: relative;
}
.hd20 {
    padding: 10px;
    grid-column: 9/13;   
    z-index: 8;
    position: relative;
}
.hd1 img, .hd3 img, .hd4 img, .hd5 img, .hd17 img, .hd18 img, .hd19 img, .hd20 img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:10px;
    max-width:400px;
}
.hd2 img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:10px;
    max-width:800px;
}
.hd15 img, .hd16 img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:10px;
    max-width:340px;
 }
.hd12 img, .hd13 img, .hd6 img, .hd7 img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:10px;
    max-width:680px;
}
.content { 
    background-color: #F2F2F2;
    position: relative;
 /*   margin: 10px;*/
 /*   padding: 10px 10px 5px 10px;*/
    border-width: 3px;
    box-shadow: 5px 5px 1rem 5px rgba(0,0,0,0.8);
    padding: 20px;
    margin: 20px;
    background-color: #FBFBE0;
/*    border-style: groove;*/
/*    border-color: #E7E7E7;*/
    text-align:justify;
    
}
.c1 {
    grid-column: 1/4;
 /*   grid-row: 9;*/
    z-index: 8;
}
.c2 {
    grid-column: 4/7;
/*    grid-row: 9;*/
    z-index: 8;
}
.c3 {
    grid-column: 7/10;
 /*   grid-row: 9;*/
    z-index: 8;
}
.c4 {
    grid-column: 10/13;
/*    grid-row: 9;*/
    z-index: 8;
}
.slogan1 {
    width: 100%;
    z-index: 8;
    grid-column: 1/-1;
    background-color: transparent;
    height: 600px;
    position: relative;
}
.slogan {
    display: block;
    position: relative;
    top: 12%;
    left: 26%;
    width: 500px;
    z-index: 8;
    padding: 25px;    
    margin: auto;
    color: #000000;
    font-family:'verdana';
    font-size: x-large;
    font-weight:bold;
    box-shadow: 0 0 1rem 5px rgba(0,0,0,0.8);
    background: inherit;
    overflow: hidden;
    border-radius: 8px;
    background-color: rgba(255,255,255,0.4);
}
.slogan2 {
    width: 100%;
    z-index: 8;
    grid-column: 1/-1;
    background-color: transparent;
    height: 400px;
    position: relative;
}
.slogan3 {
    width: 100%;
    z-index: 8;
    grid-column: 1/-1;
    background-color: transparent;
    height: 600px;
    position: relative;
    display: flex;
    justify-content: center;
    text-align:center;
}
.slogan3 img {
    align-self: center;
    width: 40%;
    max-width: 400px;
}
.footer {
    height:50px;
    /*line-height: 50px;*/
    background-color: #F2F2F2;
    padding-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom:15px;
    grid-column: 1/-1;
    z-index: 8;
    color : #000066;
    position: relative;    
}
.background1 {
  /* The image used */
  /* Set a specific height 
  width: 100%;*/
  display:block;
  /*overflow-x: no-display;*/
  overflow-y: hidden;
  z-index: 2;
  opacity: 1;
  grid-column: 1/-1;
  /*grid-row-start: 1;
  grid-row-end: 3;*/
  position: fixed;
  top: 0px;
  max-width: 1399px;
}
.background2 {
  display:block;
  /*overflow-x:no-display;*/
  overflow-y: hidden;
  z-index: 1;
  opacity: 0.8;
  grid-column: 1/-1;
 /* grid-row-start: 1;
  grid-row-end: 4;*/
  position: fixed;
  top: 0px;

  max-width: 1399px;
}
.background3 {
  display:block;
  /*overflow-x:no-display;*/
  overflow-y: hidden;
  z-index: 1;
  opacity: 1;
  grid-column: 1/-1;
 /* grid-row-start: 1;
  grid-row-end: 4;*/
  position: fixed;
  background-color: #f2f2f2;
  top: 0px;
  width: 100%;
  height: 100%;
  max-width: 1399px;
}
.read-more a {
  display:block;
  color:#000066;
  text-align:right;
  font-weight:bold;
  font-size:medium;
  text-decoration:none;
  font-style:italic;
}
/* backdrop is a white background to sit behind logo title and header-pic */ 
.backdrop {
    width: 100%;
    margin: 0;
    grid-column: 1/-1;
    grid-row-start: 1;
    z-index: 8;
    background-color: #ffffff;
}
/* backdrop2 is a grey background to sit behind hd1 hd2 hd3 and hd4 */
.backdrop2 {
   width: 100%;
    margin: 0;
    grid-column: 1/-1;
    grid-row-start: 4;
    z-index: 8;
    background-color: #f2f2f2;
}
.logo{
    /* width: 100%;*/
    grid-column: 1/3;
    grid-row-start: 1;
    grid-row-end: 2;
    padding-left: 10%;
    z-index: 9;
    align-self: end;
    justify-self: start;
}
/* .logo img{width: 100%;} */
.page-title{
    width: 100%;
    overflow:auto;
    position:relative;
    grid-column: 3/11;
    grid-row-start: 1;
    z-index: 9;
    justify-self: stretch;
}
.page-title h3 {text-align:center; }
.header-pic{
    /* width: 100%; */
    grid-column: 11/13;
    grid-row-start: 1;
    z-index: 9;
    justify-self: end;
    padding-right: 10%;
}
h1 {
	display: block;
	margin: 0px;
    padding: 0px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	font-size: 22px;
	color: #000066;
}
h2 {
	display: block;
	width: 814px;
	height: 30px;
	margin: 0px;
	padding-left: 15px;
	background-color:#d8d9db;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	font-size: 22px;
	color: #000066;
}
h3 {
	display: block;
	margin: 0px 0px 0px 0px;
	padding: 25px 0px 0px 0px;
	font-family: "Times New Roman", Times, serif;
	font-weight: bold;
	text-align: left;
	font-size: 40px;
    letter-spacing: 4px;
	color: #000;
}
h4 {
	margin: 0px;
	padding: 0px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 16px;
	color: #121764;
}
hr {
    padding: 0px;
    margin: 0px;
}
img {
    border-color: #000000;
}
.navBar {
    height: 40px;
    grid-column: 1/-1;
    grid-row-start: 2;
    z-index: 9;
    background-color: #5d5d5d;
    background-image: linear-gradient(to bottom, #4e4e4e, #626262);
    color: #ffffff;
    border-radius: 10px;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
    padding-left: 20px;
}
nav{
 /*   z-index: 9;*/
}
nav ul {
 /*   float: left;  */
}
.icons {
    float: left;
}
.parallax1 {
    top: 0px;
}
.txtblock {
    display: block;
    padding-left: 20px;
    padding-right: 20px;
}
.letter {
   display:block;
   position:relative;
   box-shadow: 5px 5px 1rem 5px rgba(0,0,0,0.8);
   padding: 20px;
   margin: 20px;
   background-color: #FBFBE0;
   text-justify:auto;
   
}
.addressPanel1 {
    padding: 10px;  
    z-index: 8;
    position: relative;
    font-weight:bold;
}

.tinytext { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 9px;}
.smalltext { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 10px;}
.bluetext {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; color:#000033; font-weight:bold;}
.smallbluetext {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; color:#000033; font-weight:bold;}
.LineHeading {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 18px; color:#4747BE; font-weight:bold;}

.mobile {
    display: none;
}
/* drop slogan1 for narrow screens  */
@media (max-width: 1160px){
    .slogan {
         display: none;
    }
}
/* 1060 to 700 is tablet mode  */
@media (max-width: 1060px){
       .hd1 {
           grid-column: 1/7;
           height: auto;
          /* grid-row: 4 / span 2;
           height: 680px;*/
       }
       .hd2 {
           grid-column: 7/-1;
        /*   grid-row: 4;
           height: 200px;*/
       }
       .hd3 {
           grid-column: 7/-1;
        /*   grid-row: 5;*/
       }
       .hd4 {
           grid-column: 1/7;
           grid-row: span 3;
       }
       .hd5 {
           grid-column: 7/-1;
        /*   grid-row: 6;*/
       }
       .hd6 {
           grid-column: 7/13;
        /*   grid-row: 5;*/
       }
       .hd7 {
           grid-column: 7/-1;
        /*   grid-row: 6;*/
       }
       .hd8 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd9 {
           grid-column: 1/7;
        /*   grid-row: 5;*/
       }
       .hd10 {
           grid-column: 7/-1;
        /*   grid-row: 6;*/
       }
       .hd11 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd12 {  /*CONTACT PAGE*/
           grid-column: 1/-1;
           grid-row: 6;
       }
       .hd13 {  /*CONTACT PAGE*/
           grid-column: 1/-1;
           grid-row: 8;
       }
       .hd14 {  /*CONTACT PAGE*/
           grid-column: 1/-1;
           grid-row: 7;
       }
       .hd17 {
           grid-column: 7/-1;
       }
       .hd18 {
           grid-column: 7/-1;
       }
       .hd19 {
           grid-column: 1/7;
       }
       .hd20 {
           grid-column: 1/7;
       }
       .c1 {
           grid-column: 1/7;
           height: auto;
       }
       .c2 {
          grid-column: 7/-1;
          height: auto;
       }
       .c3 {
           grid-column: 1/7;
           height: auto;
       }
       .c4 {
           grid-column: 7/-1;
           height: auto;
       }
       h3 {
           letter-spacing: 2px;
           font-size: 36px;
        }  
       
}
@media (max-width: 950px){
       .header-pic{
           display: none;
       }
       .page-title{
          grid-column: 4/13;
       }
       h3 {
           letter-spacing: 2px;
           font-size: 34px;
        }       
}

@media (max-width: 700px){
       .hd2 {
           grid-column: 1/-1;
       /*    grid-row: 4;*/
           height: auto;
       }
       .hd1 {
           grid-column: 1/-1;
      /*     grid-row: 5;*/
           height: auto;
       }
       
       .hd3 {
           grid-column: 1/-1;
     /*      grid-row: 6;*/
       }
       .hd4 {
           grid-column: 1/-1;
     /*      grid-row: 7;*/
       }
       .hd5 {
           grid-column: 1/-1;
      /*     grid-row: 8;*/
       }
       .hd6 {
           grid-column: 1/-1;
        /*   grid-row: 5;*/
       }
       .hd7 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd8 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd9 {
           grid-column: 1/-1;
        /*   grid-row: 5;*/
       }
       .hd10 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd11 {
           grid-column: 1/-1;
        /*   grid-row: 6;*/
       }
       .hd15, .hd16, .hd17, .hd18, .hd19, .hd20 {
           grid-column: 1/-1;
        }
       .c1 {
           grid-column: 1/-1;
           height: auto;
       }
       .c2 {
          grid-column: 1/-1;
          height: auto;
       }
       .c3 {
           grid-column: 1/-1;
           height: auto;
       }
       .c4 {
           grid-column: 1/-1;
           height: auto;
       }
       .header-pic{
           display: none;
       }
       .title{
          grid-column: 4/13;
       }
       .logo{
          width:100%;
       }
       h3 {
           letter-spacing: 2px;
           font-size: 32px;
       }
       .desktop {
           display: none;
      }
      .mobile {
          display: block;
      }              
}
@media (min-width: 768px){
    nav {
        float:right;
    }
}
@media (max-width: 670px){
    h3 {
           letter-spacing: 2px;
           font-size: 30px;
       }
}      

/* LIGHTBOX */

body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
  outline: none;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;

  /* Image border */
  border: 4px solid white;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;

  /* Background color behind image.
     This is visible during transitions. */
  background-color: white;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(images/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(images/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(images/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-caption a {
  color: #4ae;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(images/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
