@font-face {
    font-family: 'myFont';
    src: url('images/openSans.ttf')
}

*{
  box-sizing: border-box;  
}

body{
    margin:0px;
    font-family:myFont;
    background-color:#fafafa;
    
}

h1,h2,h3,h4,h5,h6{
    margin:0px;
}


header{
    position:fixed;
    top:0px;
    width:100%;
    height:100px;
    z-index: 3000;
    text-align:right;
    font-family:myFont;
    /* background: -moz-linear-gradient(left,  rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.75) 1%, rgba(255,255,255,0.5) 20%, rgba(255,255,255,0) 100%); 
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 1%,rgba(255,255,255,0.5) 20%,rgba(255,255,255,0) 100%); 
    background: linear-gradient(to right,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 1%,rgba(255,255,255,0.5) 20%,rgba(255,255,255,0) 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfffffff', endColorstr='#00ffffff',GradientType=1 );  */
    background-color:#CEE5F8;
    box-shadow:1px 1px 5px rgba(82, 79, 79, 0.3);
}


header ol{
    padding:0px;
    margin:0px;
}

header ol li{
    list-style-type: none;
    display:inline-block;
    width:10%;
    margin:0px 15px;
    font-size:15px;
    color:#283878;
    /* text-shadow: 1px 1px 1px #283878; */
    letter-spacing:2px;
    font-weight:bold;
    text-align:center;
    height:100px;
    position:relative;
    cursor:pointer;
}

.liNav{
    position: absolute;
    top:50%;
    left:50%;
    width:100%;
    transform:translate(-50%,-50%);
}

header ol li:hover{
    height:100px;
    border-bottom:1px solid #283878;
}

header a{
    text-decoration: none;
    color:#283878;
}

#theImgDiv{
    position:fixed; 
    top:0px;
    left:7%;
    padding:10px 40px 15px 40px;
    z-index:4000;
    /* border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;     */
}

#theImgDiv img{
    height:100%;
}

#main{
   background-color:#fafafa;
    min-height:120vh;
    text-align:left;
    padding:150px;
}

#contactDiv{
    display:inline-block;
    padding-bottom:40px;
    background-color:white;
    border-radius:1px;
    box-shadow: 0px 0px 10px rgba(82, 79, 79, 0.3);
    width:50%;
    color:rgb(59, 53, 53);
    z-index:1000; 
}

#contactDiv h2{
    padding:20px 0px;
    font-size:40px;
    border-bottom:1px solid rgba(82, 79, 79, 0.3);
    text-align:center;
    text-shadow: 1px 1px 1px rgba(82, 79, 79, 0.5);
    font-weight:normal;
    color:#777777
}


.formGroup{
    margin:25px 0px;
}

.formGroup label{
    font-size:20px;
    display:inline-block;
    width:30%;
    text-align:right;
    color:#808080;
    padding:0px 10px;
}

#securityDiv{
    display:none;
}

.inputDiv{
    width:70%;
    float:right;
    text-align:left;
   
}

.formGroup input, .formGroup textarea{
    border-radius:2px;
    padding:5px;
    font-size: 18px;
    width:90%;
    border:1px solid #cacaca;
}

.formGroup textarea{
    height:200px;
}

.inputDiv #button{
    padding:15px;
    margin:30px 0px;
    width:90%;
    cursor: pointer;
    border-radius: 3px;
    text-align:center;
    /* background-color:rgb(66, 56, 56); */
    background-color: #006888;
    border:1px solid rgba(66, 56, 56,.6);
    color:#fafafa;
}

.inputDiv #button:hover{
    color:white;
    background-color: #617AAA;
}

#contactExtras{
    padding-top:15px;
    float:right;
    width:40%;
    height:100vh;
    overflow:hidden;
}

#contactExtras img{
    /* width:100%; */
    height:33%;
    margin-bottom:10px;
    border:1px solid #808080;
    box-shadow:0px 0px 5px rgba(82, 79, 79, 0.5);
}

#words{
    position:absolute;
    top:470px;
    left:-270px;
}

#mottoWords{
    color:blue;
    opacity: .5;
    transform:rotate(-90deg);
    font-size:50px;
}

footer{
    background-color:#283891;
    color:white;
    z-index:1000; 
}

#footerDiv{
    width:75%;
    height:300px;
    margin:0px auto;
    padding:30px 10px;
}

#rightFooter{
    float:right;
    width: 60%;
}

#leftFooter{
    float:left;
    width:35%;
}

#leftFooter h4{
    margin:0px;
}

#footerServiceRight, #footerServiceLeft{
    float:left;
    width:45%;
}

#rightFooter h4{
    margin:0px;
}

#rightFooter ol li{
    list-style-type: none;
}

#rightFooter ol{
    margin:0px;
    padding:5px;
}

footer h5{
    padding:5px 0px;
    margin:0px;
    /* border-top:1px solid lightgray; */
    text-align: center;
    background-color:#283878;
}