@font-face {
    font-family: OpenSans;
    src: url(/fonts/OpenSans-CondLight.ttf);
}
.logoPanel{
    height:100%;
    padding-left:10px;
    padding-right:10px;

}

#Banner{
    height: 130px;
    color:white;
    background: #5999B2 url('/images/banner1.jpg');
    background-size: 100% 100%;
    text-shadow: 1px 1px rgba(50,50,50,.30);
}
#Banner .header1{
    font-size: 31pt;
    font-family: Helvetica;
}
#Banner .header2{
    font-size: 16pt;
    font-family: Helvetica;
    color: rgba(255,255,255,1)
}
#Banner .header3{
    margin-top:10px;
    font-size: 11pt;
    font-family: Helvetica;
    color: rgba(255,255,255,.8)
}

@media screen and (max-width: 925px) {
    .logoPanel{
	padding-left:20px;
    }
}
@media screen and (max-width: 715px) {
    #Banner .header3{
	margin-top:15px;
    }
}
@media screen and (max-width: 520px) {
    #Banner .header2{
	font-size: 12pt;
	font-family: Helvetica;
	color: rgba(255,255,255,1)
    }
}


#Content{
    color:#444;
}
#Footer{

}
#Footer .menu{
    float:right;
    color:rgba(50,50,50,.6);
}
#Footer .menu .tab{
    padding:6px;
    padding-left:10px;
    padding-right:10px;
    font-size: 10pt;

}
#Copyright{
    font-size: 7pt;
    color:rgba(50,50,50,.6);
}
.button{
    font-weight: bold;
    padding-top:6px;
    padding-bottom:6px;
    padding-left:15px;
    padding-right:15px;
    border-radius: 3px;
    font-size: 10pt;
    cursor:pointer;
}
.button.small{
    padding-top:4px;
    padding-bottom:4px;
    padding-left:12px;
    padding-right:12px;
    font-size: 9pt;
}
.button.gray{
    background-color: #E9E9E9;
    border: 1px solid #C3C3C3;
    box-shadow: inset 0px 1px 1px rgba(255,255,255,.7);
    color:#333;
}
.button.blue{
    background-color: #5F9DB6;
    border: 1px solid #51859A;
    box-shadow: inset 0px 1px 1px rgba(255,255,255,.7);
    color:white;
}

@font-face {
    font-family: ProximaNova;
    src: url(/fonts/ProximaNova-Regular.otf);
}
#Menu {
    background-color: #666;
    color:white;
    font-family: Helvetica;
}
#Menu .logo{
    font-size: 14pt;
    font-style: normal;
    font-weight: bold;
    font-family: ProximaNova
}
#Menu .tab{
    font-size: 10pt;
    padding-top:10px;
    padding-bottom:10px;
    padding-left:10px;
    padding-right:10px;
    border-left: 1px solid rgba(255,255,255,.2);
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#Menu .tab:hover{
    background-color: #437597;
}
#Menu .tab:active{
    box-shadow: inset 0px 0px 3px rgba(50,50,50,.9);
    background-color: #1E6397;
    color:#DDD;
}


.wrapper{
    width:100%;
    max-width:1100px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing: border-box;
}

.featureCaption{
    color: #216496;
    font-weight: bold;
}

/*HAM BUTTON*/
.hamButton {
    border: none;
    cursor: pointer;
    display: flex;
    padding: 0;
    background-color: gray;
}
.hamButton .line {
    fill: none;
    stroke: white;
    stroke-width: 6;
    transition: stroke-dasharray 300ms cubic-bezier(0.4, 0, 0.2, 1),
	stroke-dashoffset 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
.hamButton .line1 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
}
.hamButton .line2 {
    stroke-dasharray: 60 60;
    stroke-width: 6;
}
.hamButton .line3 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
}
.hamButton.opened .line1 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
}
.hamButton.opened .line2 {
    stroke-dasharray: 1 60;
    stroke-dashoffset: -30;
    stroke-width: 6;
}
.hamButton.opened .line3 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
}