html {
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}
     

*, *:before, *:after {
   box-sizing: inherit;
}

.hidden {
   display: none;
}

header, section, footer, aside, nav, main, article, figure {
    display: block; 
    margin: 0;
    padding: 0;
}

body {
    background-color: white;
    margin: 0;
    padding: 0;
}

header {
    background-color: black;
    height: 94px;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
}

main {
    background-color: lightblue;
    position: relative;
    top: 0;
    left: 0;
    z-index: 50;
    height: 100%;
    margin: 1em;
    padding: 0;
}

footer {
    /* background-color: lime; */
    background-color: white;
    position: relative;
    z-index: 1000;
    margin: 1em;
    padding: 0;
    text-align: center;
    color: rgba(0, 0, 0, .25);
    font-size: 0.750em;
}

footer-copy {
   color: darkgrey; 
   font-family: proxima_novalight;
}

div {
    position: relative;
    z-index: 10;
}

xyzdiv {
    background-color: pink;
    position: relative;
    z-index: 10;
    margin: 0;
    padding: 0;
}	

section {
    background-color: white;
    margin: 0;
    padding: 0;
}

p {
  margin: 0;
  padding: 0;
}

/* h1 { */
/*    color: white; */
/*    text-shadow: 1px 1px 2px black, 0 0 30px blue, 0 0 8px darkblue; */
/* } */

#main_content, h1 {
   color: #102460; 
   text-transform: uppercase; 
   font-family: proxima_novabold; 
   font-size: 2em;
   margin: 0;
   padding: 0;
   padding-bottom: 0.5em;
}

#main_content, h2 {
   color: #102460; 
   text-transform: uppercase; 
   font-family: proxima_novasemibold; 
   font-size: 1.25em;
   margin: 0;
   margin-bottom: 0.25em;
}

#main_content, p {
   width: 96%;
   font-family: proxima_novalight; 
}

#main_content, li {
   font-family: proxima_novalight; 
}

.synapse_flags_container {
   display: inline-block;
   border: 3px solid transparent;
   margin: 0;
   padding: 0;
   width: auto;
   height: 3em;
}

img.synapse_flag {
   opacity: 0.95;
   height: 1em;
   width: auto;
}

.synapse_flag_div {
    display: inline-block;
    height: 1em;
    /* width: 2em; */
    /* clear: left; */
    float: none;
    /* overflow: auto; */
    /* float: left; */
    margin: 1em;
    /* box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); */
    box-shadow: rgba(0,0,0,0.24) 2px 2px 8px 2px, rgba(0,0,0,0.12) 0 0 1px 1px;
}

.my_flag a {
   outline: 0;
}

.clear_both {
    clear: both;
}

.main-header {	
   top: -100px;
   max-height: 68px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.main-header-wrapper {
    background-color: black;
    height: 34px;
}

.main-header-logo-wrapper {
    float: left;
    background-color: black; 
}

.main-header-logo-image {
    height: 20px;
    margin-top: 8px;
    margin-left: 16px;
}

.main-header-menu-wrapper {
    float: right;
    /* background-color: lightgreen; */
    background-color: black; 
}

.main-header-menu-icon {
    margin-top: 4px;
    margin-right: 20px;
    font-size: 24px;		      
    color: white;
    background-color: black; 
}

.main-header-nav-wrapper {
    background-color: white;
    margin-top: 2px;
    height: 24px;
}

.main-header-first-filler {
    content: " ";
    background-color: white; 
    height: 6px;
}

.main-header-filler {
    content: " ";
    background-color: white; 
    height: 2px;
}

.box-shadow-left {
	position: absolute;
	left: 24px;
	bottom: 38px;
	height: 14px;	
	/* margin: 20px; */
	/* width: 237px; */
	width: 237px;
	/* background-color: white; */
	background-color: red;
	color: #656565;
	box-shadow: rgba(0, 0, 0, 0.2) -6px 12px 5px 0px;
	transform: matrix(0.999391, -0.0348995, 0.0348995, 0.999391, 0, 0);
	z-index: 5;
}

.box-shadow-right {
	position: absolute;
	right: 14px;
	bottom: 38px;
	height: 14px;	
	/* margin: 20px; */
	margin-right: 7px;
	width: 237px;
	background-color: white;
	color: #656565;
	box-shadow: rgba(0, 0, 0, 0.2) -6px 12px 5px 0px;
	transform: matrix(0.999391, 0.0348995, -0.0348995, 0.999391, 0, 0);
	z-index: 5;
}

.sticky-header {
  background-color: rgba(255, 255, 255, 0.99);
  opacity: 0.99;
  z-index: 200;
  top: 0px;
  border-color: darkgrey;
  border-bottom: 3px ridge darkgrey;
}

nav { 
    /*     float: right; */
    width: 60%;
    margin: 0;	
    padding: 0;
    /* margin-top: 4px; */
    /* margin-right: 70px; */
    width: 100%;
}

nav ul {
    list-style: none;
    overflow: hidden;
    text-align: left;
    /* text-align: right; */
    /* float: right; */
    float: none;
    margin: 0;
    padding: 0;
}

nav ul li {
    /* display: inline-block; */
    display: block;
    margin: 0;
    padding: 0;
    margin-left: 18px;  
    line-height: 1.2em;
}

nav ul a {
    color: black;
    font-family: proxima_novaregular;
    text-transform: uppercase;
    font-size: 14px;
    margin: 0;
    padding: 0;
}



.centeredImage {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 32px;
  width: auto; /* 410px */
  /* height: auto; */
  margin-top: -16px; 
  /* margin-left: -205px; */
  margin-left: -220px; 
}

.centeredBackgroundImage {
  position: relative;
  top: 0;
  left: 0;
  height: auto;
  width: 410px ;
  /* height: auto; */
  /* margin-top: -16px;  */
  /* margin-left: -205px; */
  margin-left: -205px;  
  margin-bottom: 0;
  padding-bottom: 0;
}

.img-box-shadow-left {
	position: absolute;
	left: 20px;
	bottom: 26px;
	height: 14px;	
	/* margin: 20px; */
	/* width: 237px; */
	width: 217px;
	background-color: red;
	background-color: transparent; 
	color: #656565;
	color: pink;
	box-shadow: rgba(0, 0, 0, 0.2) -6px 12px 5px 0px;
	transform: matrix(0.999391, -0.0348995, 0.0348995, 0.999391, 0, 0);
	z-index: 5;
}

.img-box-shadow-right {
	position: absolute;
	right: 2px;
	/* bottom: 32px; */
	bottom: 24px;
	height: 14px;	
	/* margin: 20px; */
	margin-right: 7px;
	/* width: 237px; */
	width: 217px;
	background-color: transparent; 
	/* background-color: lightgreen; */
	color: #656565;
	box-shadow: rgba(0, 0, 0, 0.2) -6px 12px 5px 0px;
	transform: matrix(0.999391, 0.0348995, -0.0348995, 0.999391, 0, 0);
	z-index: 5;
}

.img-box-wrapper {
   background-color: white; 
   margin: 24px; 
   height: auto; 
   box-shadow: rgba(0,0,0,0.24) 2px 2px 8px 2px, rgba(0,0,0,0.12) 0 0 1px 1px; 
   z-index: 1;
}

.img-box-outer {
   background-color: white; 
   height: auto; 
   margin: 0; 
   padding: 14px; 
   padding-bottom: 10px;
   box-shadow: rgba(0,0,0,0.24) 2px 2px 8px 2px, rgba(0,0,0,0.12) 0 0 1px 1px;
}

.img-box-inner {
   display: inline-block;
   background-color: inherit; 
   margin: 0; 
   width: 100%;
   height: auto; 
   box-shadow: rgba(0,0,0,0.24) 2px 2px 8px 2px, rgba(0,0,0,0.12) 0 0 1px 1px; 
   z-index: 6;
   overflow: hidden;
}

.img-box-img {
   display: block;
   visibility: hidden;
   opacity: 0;
   /* background-color: inherit;  */
   background-color: blue; 
   /* width: 100%;  */
   width: 33.333333333333336%; 
   left: -33.333333333333336%; 
   z-index: 100;
}


.img-box-first-img {
   visibility: visible;
   opacity: 1;
   width: 100%; 
   height: auto; 
   left: 0;
}

div#slider {
   width: 80%;
   max-width: 1024px;
}

div#slider figure {
   position: relative;
   width: 500%;
   margin: 0;
   padding: 0;
   font-size: 0;
   text-align: left;
}

div#slider figure img {
   width: 20%;
   height: auto;
   float: left;
}

div#slider {
   width: 80%;
   max-width: 1024px;
   overflow: hidden;
}

@keyframes slidy { 
    0%  { left: 0%; }
    20% { left: 0%; }
    25% { left: -100%; }
    45% { left: -100%; }
    50% { left: -200%; }
    70% { left: -200%; } 
    75% { left: -300%; }
    95% { left: -300%; }
    100% { left: -400%; } 
}

@keyframes slider {
	   0% { transform: translateX(0px); }
	   21% { transform: translateX(0px); } 
	   25% { transform: translateX(-484px); }
	   46% { transform: translateX(-484px); } */
	   51% { transform: translateX(-968px); }
	   76% { transform: translateX(-968px); } */
	   81% { transform: translateX(-1452px); }
	   96% { transform: translateX(-1452px); } */
	   100% { transform: translateX(-1936px);  }
}

div#slider figure {
   position: relative;
   
   width: 500%;
   margin: 0;
   padding: 0;
   font-size: 0;
   left: 0;
   text-align: left;
   animation: 500s slidy infinite;  
}

.slider_ctl-nav {
   list-style: none;
   padding: 0;
   margin: 0;
   text-align: center;
   position: absolute;
   top: 100%;
   left: 0;
   right: 0;
}

.slider_ctl-nav li {
   display: inline-block;
   margin: 8px 3px;
}

.slider_ctl-nav a {
   cursor: pointer;
   text-indent: -9999px;
   display: block;
   height: 6px;
   width: 6px;
   background: #BBBBBB;
   border-radius: 10px;
}

.slider_ctl-nav .slider_active {
   background: #345474; 
   /* background: #4D85AB; */
   /* background: #B6D6E6; */
   /* box-shadow: rgba(B6,D6,E6,0.24) 2px 2px 8px 2px, rgba(0,0,0,0.12) 0 0 1px 1px; */
   /* box-shadow: rgba(30,40,180,0.85) 1px 1px 2px 2px, rgba(182,214,230,0.70) 0 0 1px 1px; */
   box-shadow: rgba(52,84,116,0.24) 0 0 1px 1px;
}

@-webkit-keyframes kenburnsBR {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}
@keyframes kenburnsBR {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}


@-webkit-keyframes kenburnsBL {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}
@keyframes kenburnsBL {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}

@-webkit-keyframes kenburnsTL {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}
@keyframes kenburnsTL {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}

/*
@-webkit-keyframes kenburnsTR {
  0.001%, 33.33233333333334%  { z-index: 2; }
  0%, 100% {
    opacity: 0.2;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  8.130081300813009%, 33.333333333333336% { opacity: 1 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  33.33433333333333%, 100%  { z-index: 1; }
}
*/

@keyframes kenburnsTR {
  0.001%, 33.33233333333334%  { 
     z-index: 9; 
  }
  20% {
     transform: translate(30px,30px) scale(1.85) rotate(2deg);
  }    
  55% {
     transform: translate(10px,50px) scale(1.87) rotate(-2deg);
  }    
  0%, 100% {
    opacity: 0.92;
    -webkit-transform: scale(1.83);
    transform: scale(1.83);
    perspective: 2000px;
    perspective-origin: 25% 75%;
  }
  8.130081300813009%, 33.333333333333336% { opacity: 0.98 }
  41.463414634146346%, 66.66666666666666% {
    opacity: 0.94;
    -webkit-transform: scale(1.89);
    transform: scale(1.89);
  }
  33.33433333333333%, 100%  { z-index: 8; }
}


.unslide_banner {
    line-height: 2em;
    position: relative; 
    top: 100%; 
    overflow: auto; 
    margin: 0; 
    padding: 0;
    z-index: 150;
}

.unslide_banner ul {
    list-style: none; 
    background-color: lightblue; 
    font-size: 2em; 
    line-height: 2.5em; 
    margin: 0; 
    padding: 0; 
    z-index: 200;
}

.unslide_banner ul li {
     float: left; 
     //background-image: url('sunset2.png'); 
     background-size: cover; 
     background-repeat: no-repeat;
}

.unslide_banner ul li a:link {
    text-decoration: none;
    color: white;
}

.unslide_banner ul li a:visited {
    text-decoration: none;
    color: white;
}

.unslide_banner ul li a:hover {
    text-decoration: none;
    color: white;
}

.unslide_banner ul li a:active {
    text-decoration: none;
    color: white;
}

.dots { 
      list-style: none;
      height: 24px;
      font-size: 0.5em;
      line-height: 1em;
      padding: 0;
      margin: 0;
      position: relative;
      text-align: center;
      // top: 0; 
      // left: 0;
      // right: 0;
      bottom: 24px;
      background-color: white;
      opacity: 0.75;
      z-index: 99990;
}

.dot {
   display: inline-block;
   margin: 8px 4px;
   cursor: pointer;
   text-indent: -9999px; 
   height: 8px;
   width: 8px;
   background: #BBBBBB;
   border-radius: 10px;
   z-index: 9999;
}

.dots .active {
   background: #345474; 
   /* box-shadow: rgba(52,84,116,0.24) 0 0 1px 1px; */
   /* background: red;  */
   /* border-radius: 20px; */
   box-shadow: rgba(52,84,116,0.24) 0 0 1px 1px;
}

.foo_dots {
      background-color: lightblue;
      height: 64px;
   list-style: none;
   padding: 0;
   margin: 0;
   text-align: center;
   position: relative;
   top: 100%;
   left: 0;
   right: 0;
}

.foo_dot {
     font-size: initial;
   line-height: initial;
   display: inline-block;
   margin: 8px 3px;
}

.foo_dot a {
   cursor: pointer;
   text-indent: -9999px;
   display: block;
   height: 6px;
   width: 6px;
   background: #BBBBBB;
   border-radius: 10px;
}

.foo_dot .foo_active {
   background: #345474; 
   box-shadow: rgba(52,84,116,0.24) 0 0 1px 1px;
}

a.back-to-top {
   display: none;
   width: 48px;
   height: 48px;
   text-indent: -9999px;
   position: fixed;
   z-index: 999;
   right: 20px;
   bottom: 32px;
   background: #27AE61 url("../icons/arrow-up.png") no-repeat center 43%;
   background: #345474 url("../icons/arrow-up.png") no-repeat center 43%;
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   opacity: 0.6;
   z-index: 8888;
}
a:hover.back-to-top {
   background-color: #000;
}

.unslider-prev {
   display: inline-block;
   width: 48px;
   height: 48px;
   text-indent: -9999px;
   position: absolute;
   z-index: 999;
   left: 20px;
   top: calc(50% - 24px);
   background: #27AE61 url("../icons/arrow-left.png") no-repeat 43% 50%;
   background: #345474 url("../icons/arrow-left.png") no-repeat 43% 50%;
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   opacity: 0.6;
   z-index: 88888;
}

.unslider-next {
   display: inline-block;
   width: 48px;
   height: 48px;
   text-indent: -9999px;
   position: absolute;
   z-index: 999;
   right: 20px;
   top: calc(50% - 24px);
   background: #27AE61 url("../icons/arrow-right.png") no-repeat 57% 50%;
   background: #345474 url("../icons/arrow-right.png") no-repeat 57% 50%;
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   opacity: 0.6;
   z-index: 8888;
}