@import 'https://fonts.googleapis.com/css?family=Montserrat:300,400,500';
@import 'https://fonts.googleapis.com/css?family=Muli:200, 300,400,500';

body {
margin: 0 auto; 
padding: 0;
color:#111111 ; 
font-size: 1.2em; 
background-color: #dddddd;  
font-family: "Muli", "Helvetica", "Arial", sans-serif;}
#PageWrapper{width: 922px; margin: 0 auto; }
.main{float: left; width: 580px; margin: 0 40px 0 20px; padding: 0; }
.ancillary{float: left; width: 200px; margin: 80px auto 20px; padding: 20px 40px; background: white; border: .5px solid gray; border-radius: 20px;}
.ancillary a {font-weight: 400;}
.ancillary p{margin: 0 0 12px 0; padding: 0;}
.ancillary h2{margin: 40px 0 20px 0;}
a {color: #215878; text-decoration: underline; font-weight: 200;}
a:hover {text-decoration: none; color: #666666;}
a:active {text-decoration: none; color: #666666;font-weight: 200;background-color: transparent; top: 0; right: 0;}
a:visited {color: #215878; text-decoration: underline;font-weight: 200;}

h1, h2, h3 {
font-weight: 300; 
font-family: "Montserrat",sans-serif;}
h1 {width: 550px; margin: 80px 5px 0 50px; line-height: 1.1em;}
h2{ width: 500px; margin: 80px auto 10px; }
h3 {width: 320px; margin: 40px auto 5px; padding: 0 10px 0 10px; border-bottom: 1px solid white;  text-align: center;}
p {margin: 0 28px 12px 28px; line-height: 1.5; padding: 0 1em 0;  }
ul, li {margin: 0 20px 12px; padding: 0 1em 0; line-height: 1.5;  }
li {margin: 0 20px 12px 40px; line-height: 1.2; }
.subtitle{margin: 0 0 0 50px; font-size: .8em;  text-align: right; text-decoration: underline;}
#Introduction {margin: 40px 40px 40px; padding: 40px 20px 30px; line-height: 1.2; background-color: white; border: .5px gray solid; border-radius: 20px;}
#Introduction p {margin: 0 auto 12px; line-height: 1.5; padding: 0 1em 0;  }
#Introduction h2 {width: 400px;}
#Introduction .callOut{ margin: 20px 20px;
padding: 40px 20px 30px; background-color: #dddddd; border-color: silver;}
.info{font-size: .8em; max-width: 500px; margin: 0 auto;}
.ancillary .info{margin: 0; }
.band{background-color: #00A4DE; width: 100%; padding: 40px 0;}
.orange{background-color: #E28709; }
.band img{border: .5px solid #00BCFF}
.orange img{border: .5px solid #ff9800;}
.band h1{margin: 80px auto 0;}
.band .subtitle{width: 550px; margin: 0 auto 0;}
.band p {width: 600px; margin: 0 auto;}
.band .heading {width: 600px; margin: 0 auto; font-size: 1.4em;}

#Header{height: 140px; max-width: 962px; margin: 1em auto 0;  padding: 0;}
 #Header{background-image: url(../0-image-files/zeroparallax.png); background-position: 20px; background-size:  auto 100px; background-repeat: no-repeat; } 
#Header .homelink {display:block; width:300px; height:100px; position: relative; left: 20px; top:20px; }
#Header a:link {color: black; text-decoration: underline;}
#Header a:visited {color: #888888; text-decoration: underline;}
#Header a:hover, a:active, a:focus {color: #888888; 
background-color: transparent; 
text-decoration: none ; font-weight: 200; border: .5px solid white; top: -1; right: -1;}
.itemV{ float: left; width: 200px; margin: 0 10px 10px 0; min-height: 68px; padding: 20px; border: 1px white solid;border-radius: 20px;}
.itemV:nth-child(odd){ clear: left;}
.topBar{width: 100%;height: 40px;padding: 4px 0 4px 0; background-color: white;margin: 0px auto 8px;position: -webkit-sticky; position: sticky; top: 0;}
.topBar a:link {display: block; height: 40px; border-bottom: 0px; border-radius: 10px; }
.topBarInner {height: 40px; width: 324px;float: right;margin: 0 auto; padding: 0; }
.bg{width: 100%; margin: 0; padding-top: 60px;}
.bgD{background: #393E42; color: white; }
.bgL{background: #F7F1E8;}
.block{width: 480px; margin: 0 0 60px 0; float: left; border: .5px red solid;}
.block h2 { margin: 10px 0 10px;}
.block h3 {margin: 20px 0 0;}
.block p {font-size: .8em; padding: 0;}
.bgD .block{border-color: white;}
.padb{padding-bottom: 20px;}

.centerfloat{margin: 10px auto 0px;float: none; padding: 20px;}
.centerfloatoriginal{margin: 10px auto 0; float: none; padding: 0 20px 20px;  height: 400px;}
.line{border-top: 1px solid black; margin: 0 auto 0; width:50%;}


.button{margin: 1.4em 1em 2em 20px; float: left; clear: none;}
.button a:link {font-size: .8em; letter-spacing: 0.2em; text-decoration: none; padding: 1.2em 2em; margin: 0;  border-radius: 5px; color: white; background: #008EBD; box-shadow:5px 5px 20px  grey; 
position: relative; top: 0px; transition-property:  position, background; }
.button a:visited  {font-size: .8em; letter-spacing: 0.2em; text-decoration: none; padding: 1.2em 2em; margin: 0;  border-radius: 5px; color: white; background: #008EBD; box-shadow:5px 5px 20px  grey; 
position: relative; top: 0px; transition-property:  position, background; }
.button a:hover, .button a:active, .button a:focus  {/* background:  #0880A8;  */ color: white; text-decoration: none;position: relative; top: -1px; right: -1px; }

.inline ul, .inline li {width: 100%;}
.inline ul {float: left; margin-left: 20px;}
.inline li { display: inline; padding: 0 20px 0 0;}


#Footer {clear: both; height: 200px; width: 300px; margin: 40px auto; padding: 40px 0; text-align: center; border-top: 1px #B9B9B9 solid;}





.smaller{
font-size: .8em;}

.fullwidth{
max-width:940px;}
.halfwidth{max-width: 298px;}
.halfwidthplus{max-width: 450px;}
.halfwidthminus{max-width: 198px;}
.box{
width: 280px;
height: 280px;
overflow: scroll;
padding: 10px;
margin: 5px;
}
.box li {
margin: 0 0 0 10px;
padding: 0 0 0 5px ;}
.textBox {max-width: 520px; 
margin: 20px auto;
padding: 40px 40px 30px; 
border: .5px gray solid; 
border-radius: 20px; 
background-color: #fafafa; }
.callOut {margin: 40px 40px 40px; padding: 40px 40px 30px;  background-color: #FFFFFF; border: .5px black solid; border-radius: 20px;}
.callOut p {padding: 0;font-weight: 400;}
.callOut h2 {font-weight: 500; }
.callOut>h3{width: 60%; margin: 0 0 40px; padding-left: 0; text-align: left;}
.callOut ul {padding: 0;}
/* .callOut:nth-child(odd){background-color: #cacaca} */
.border{border: 1px black solid;}
.borderWhite{border-color: white;}
.borderRed{border-color: red;}
.borderNone{border: 0 white solid;}
.borderRounded{border-radius: 10px;}
.borderRounded20{border-radius: 20px;}
.blockBorder{border: .5px green solid;}
.dark {background-color: #888888;
color: white;
border-width: 0;
}

/* 
.dark a:link {
color: silver;}
.bgD a:link{
color:silver; font-weight: 400;}
.bgL a:link{
font-weight: 400;}
 */
.tight1 {
max-width: 450px;}

.tight2 {
max-width: 400px;}

.low {
padding: 10px 40px;}

.nilPadding{
padding: 0;}


.bgNone{
background-color: transparent;}
.underline{
border-bottom: 1px gray solid;}

.sharethis-inline-share-buttons{
max-width: 600px;
margin: 20px auto 20px;}

.menu{margin: 0 auto; width: 576px; height: 60px; padding: 0; border: 0px gray solid;}

.menuItem{float: left; width: 112px;margin: 0 auto 0;  padding: 10px 15px; border: .5px gray solid; color: white; font-size: .8em; letter-spacing: 0.2em; text-align: center;}



.index {
width: 230px; 
float: left; 
margin: 0 20px 20px;
border: 0px black solid;}
.index a:link {
color: #666666;}
.floatstop{clear: both; float: none;}
.left{float: left; }
.right{float: right;}
.righT{text-align: right;}
.tRight{text-align: right;}
.tCenter{text-align: center;}





@media only screen and (max-width: 962px), only screen and (max-device-width: 962px) {
#PageWrapper{width: 100%;  }
#Header{width: 762px;}
.main{float: none; width: 680px; margin: 0 auto; padding: 0; }
/* h2{ width: 500px; margin: 64px 160px 20px 20px; } */
/* h3 {width: 300px; margin: 20px auto 5px; padding: 0 20px 0 260px; } */
.ancillary{float: none; width: 580px; margin: 80px auto 20px; padding: 20px 40px; background: white; border: .5px solid gray; border-radius: 20px;}
.subtitle{margin: 0 50px;}
.ancillary p {margin: 0 80px 0 80px;}
.block{width: 380px; margin: 0 0 40px 0;  }
.bg{padding-top: 40px;}
.centerfloatoriginal{ padding: 0 10px 10px; }


}

@media only screen and (max-width: 762px), only screen and (max-device-width: 762px) {

 #Header{width: 622px;}
.main{width: 620px; }
/* .main{border: .5px gray solid;} */
h2{width: 480px; margin: 50px auto 10px;}
/* h2{border-bottom: .5px blue solid;} */

.ancillary{width: 520px;}
/* h3{padding: 0; margin: 60px 0 40px 300px;} */
.callOut>h3{width: 60%; margin: 0 0 40px 0; }
.callOut h2{margin: 40px 40px 20px 20px;}
.block{width: 310px;}
.centerfloatoriginal{height: 360px; }

}

@media only screen and (max-width: 620px), only screen and (max-device-width: 620px) {



/* 
#Header{height: 120px;width: 440px;background-position: 100px;}
#Header .homelink {width:80px;height:80px;left: 100px; top: 20px; }
#Header .headerMenu {width: 180px;margin-left: 200px; }
 */
/*  #PageWrapper{width: 460px;  } */
 #Header{width: 460px;}
 #Introduction{margin: 40px 40px 40px; padding: 40px 20px 30px; }
#Introduction h2 {width: 300px; padding:0; }
#Introduction h3 {width: 300px; padding: 0;}
 p, ul, li {margin: 0 auto 12px; padding: 0 1em 0;  }

.band{width: 100%; padding: 20px 0;}
.band p {width: 90%; margin: 0 auto 10px;}
.band .heading {width: 90%; margin: 0 auto; font-size: 1.4em;}
.main{width: 460px; }
.ancillary{width: 420px; padding: 20px; ;}
.block{width: 460px; }
.block h2 {margin-left: 20px;}
.centerfloatoriginal{padding: 0 5px 10px; height: 400px; }
.itemV{width: 180px; margin: 0 10px 10px 0; min-height: 88px; padding: 10px;}
h1, h2, h3 {margin: 40px 20px 30px; font-weight: 300; }
h1 {width: 380px; margin: 80px auto 5px; border-bottom: 0px solid #B9B9B9;}
h2{width: 380px; margin: 60px auto 10px ;}
h3 {width: 300px; margin: 40px auto 5px ; padding: 0 20px 0 140px;  text-align: right;}
p/* , h1, h2 */ {
max-width: 90%;
}

/* h3 {margin: 50px 0 5px 220px; width: 240px;} */
.callOut {margin: 20px; padding: 40px 20px 20px;}
.callOut h3{margin: 20px; padding: 0;  }
.callOut h2{width: auto; margin: 40px 20px 20px 20px;}


.subtitle{max-width: 90%}


ul, li {
max-width: 80%;}

.info{
font-size: .8em;
max-width: 90%;
margin: 0 auto;}

.left{float: none;}
.box{
margin: 5px auto;
}


.tight1 {
max-width: 70%;}

.tight2 {
max-width: 60%;}
.menu{
width: 294px; 
height: 120px;
border: .5px gray solid;
 }
/* 
.menu a:link, a:visited, a:focus {
height:  30px; width: 120px; margin: 0 -1px -1px 0;  padding: 16px 5px 0; text-decoration: none; border: .5px solid #888888;}
 */
}



@media only screen and (max-width: 460px), only screen and (max-device-width: 460px) {

#Header{width: 320px;}
#Introduction{margin: 40px 0 40px; padding: 40px 10px 30px; }
.centerfloatoriginal{ height: 360px; }
.callOut{margin: 40px 10px; padding: 40px 10px;}
.itemV{float: none; width: 280px; min-height: 58px; margin: 0 auto 10px; padding: 20px; }
.main{width: 320px; }
.ancillary{width: 280px;}
.ancillary p {margin: 0 10px 10px 40px;}
.block{width: 320px; }
.block p {margin-left: 20px;}
.block h3 {margin-left: 20px;}
p{width: 300px; margin: 0 auto 10px; padding: 0;}
h1{width: 300px;}
h2{width: 300px; margin: 60px auto 20px; font-size: 1.2em; border-bottom: 1px white solid;}
h3{width: 200px; margin: 40px 0 20px 0; padding: 0 20px 0 100px; }
#Introduction h2 {width: 300px; margin: 60px 10px; padding:0; }
#Introduction h3 {width: 280px; margin: 40px 10px; padding:0; text-align: center;}

}

@media only screen and (max-width: 320px), only screen and (max-device-width: 320px) {
/* #Header{height: 120px;width: 320px;background-position: 20px;} */
#PageWrapper{width: 320px;  }
.main{width: 320px; }

/* .callOut{width: 280px;} */
  #Introduction{margin: 40px 0 40px; padding: 40px 10px 30px; }
}

