﻿body {
    
}

.wrapper {
    padding-top: 7px;
   
}

.contentBody {
    position:relative;
    left:-40px;
    color: white;
    font-family: Verdana;

    
}

@media (max-width:400px){
    .contentBody{
        left:0px;
    }
}

    .contentBody > p {
        margin-bottom: 0px;
        font-weight:bold;

    }

.contentBodyInner{
    /*padding-left:47px;*/
}

.contentHeader {
    color: #cc9933;
    font-size: 1.5em;
    font-weight: bold;
    font-family: Verdana;
    text-decoration: underline;
}

.contentContainerHeader{
    margin-bottom:18px;
}

.contentHeader2 {
    color: white;
    font-size: 1em;
    font-weight: bold;
    font-family: Verdana;
    text-decoration: underline;
}

.contentImportant{
    color:#ffff00;
    margin-bottom:12px;
    font-size:18px;
}

.contentImportant > span{
    font-size: 25px;
    font-weight: bold;
}

.contactContainer{
    padding-bottom:20px;
}


    .contactContainer > div > div > span {
        font-weight: bold;
    }

div .indent {
    margin-left: 50px;
    font-size: 12px;
}

.webContact{
    float:none;
    font-size: 12px;
}

.addressContainer{
    height:50px;
}

.addressblock{
    float:left;
}

.addressLoc {
    float: left;
    padding-left:5px;
    font-size: 12px;
}

div .navButton{
    display:inline-block;
    width:100%;
    height:auto;
    float:left;
    
}

div .imageLinks{
    margin-top:10px;
}


.linkBtn {
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 5px;
    text-align: center;
    border: white solid 1px;
}

.linkBtn > a{
    text-decoration:none;
}

.linkBtn > span{
    font-size:12px;
}


#banner {
    background: rgb(18,6,227);
    background: linear-gradient(90deg, #00376700 0%, #004A78 100%);
    height: 90px;
    border-radius: 0px 0px 20px 0px;
    top: -20px;
}

    #banner .row > h2 {
        text-shadow: 2px 1px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 700;
        font-style: italic;
        color: #003767;
        font-size: 21px;
    }

.bannerHeader {
    height: 140px !important;
}

@media screen and (min-width: 400px) {
    #banner .row > h2 {
        text-shadow: 2px 2px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 700;
        font-style: italic;
        color: #003767;
        font-size: 30px;
    }
}


#systems {
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0px 0px 10px 10px;
    height: 100%;
    top: -55px;
}

#systems .items {
    background-color: rgb(248, 247, 247);
    width: 100%;
    /*height:300px;*/
    box-shadow: 5px 10px 10px #0000006b;
    border-radius: 10px;
    transition: transform .2s;
}

#systems .itemsArreya {
    /*margin-top: 75%;*/
}

    #systems .linkArreya {
        position:absolute;
        width: 100%;
        height: 100%;
        /*z-index: 9000;*/
        /*background: red;*/
        opacity: .5;
    }

#systems .items:hover {
    transform: scale(1.05);
}

@media screen and (min-width: 400px) {
    #systems .items {
        height: 235px;
    }
}

#systems .itemTitle {
    font-size: 17px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    color: #003767;
    text-shadow: 2px 1px 2px #ffffff;
    padding-left: 3px;
    background: rgb(18,6,227);
    background: linear-gradient(90deg, #00376700 0%, #004A78 300%);
    font-style: italic;
    white-space: nowrap;
    overflow: hidden;
}

#systems .imageArea {
    text-align: center;
    height: 100px;
    overflow: hidden;
}


#systems .items .itemImg {
    overflow: hidden;
    padding: 0px;
    border-radius: 10px 10px 0px 0px;
    max-width: 100%;
}

#systems .areaArreya {
    text-align: center;
    /*height: 100px;*/
    overflow: hidden;
    height: 100%;
    width: 100%;
}

#systems .rowChannel {
    height: 100%;
}


#systems .items .itemArreya {
    height: 100%;
    width: 100%;
    overflow: hidden;
    padding: 0px;
    border-radius: 10px 10px 10px 10px;
}



#systems .items .itemImg {
    overflow: hidden;
    padding: 0px;
    border-radius: 10px 10px 0px 0px;
    /*max-width: 100%;*/
}

#systems .itemTextArea > p {
    font-weight: 500;
    font-size: 14px;
    color: #000000;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 90px;
    -webkit-mask-image: linear-gradient(to bottom, black 75%, transparent 100%);
}


#systems .itemTextArea:hover {
    text-decoration: none;
}

#systems .itemLink {
    text-decoration: none;
}

#systems .presentBanner {
    background-color: rgb(248, 247, 247);
    height: 100%;
    width: 100%;
    overflow: hidden;
    padding: 10px;
    border-radius: 10px 10px 10px 10px;
    
}

.quality {
    background: #333366 !important;
}

.wow {
    color: #FFFF00;
    font: bold 12px Verdana;
}

#contact {
    top: -75px;
}

    #contact .title {
        padding: 0px;
        margin-right: -15px;
        background: rgb(18,6,227);
        background: linear-gradient(90deg, #00376700 0%, #004A78 100%);
        height: 40px;
        border-radius: 0px 0px 20px 0px;
    }

        #contact .title > h2 {
            text-shadow: 2px 1px 2px #ffffff;
            text-transform: uppercase;
            font-weight: 700;
            font-style: italic;
            font-size: 21px;
            color: #003767;
        }

@media screen and (min-width: 400px) {
    #contact .title > h2 {
        text-shadow: 2px 1px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 700;
        font-style: italic;
        font-size: 25px;
        color: #003767;
    }
}

    #contact .type > h3 {
        text-shadow: 2px 2px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 700;
        font-style: italic;
        font-size: 25px;
        color: #003767;
    }

    #contact .type .typeDiv {
        height: 10px;
        background: linear-gradient(90deg, #00376700 0%, #004A78 300%);
        margin-left: 10px;
        border-radius: 0px 0px 7px 0px;
    }

    #contact .itemHeader {
        text-shadow: 2px 1px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 700;
        font-style: italic;
        font-size: 11px;
        color: #000000;
        text-align: right;
    }

    #contact a:link {
        color: rgb(0, 0, 0);
    }

    #contact a:hover {
        color: #3e6591;
    }

    #contact a:visited {
        color: rgb(0, 0, 0);
    }


    #contact .itemData {
        text-shadow: 2px 1px 2px #ffffff;
        text-transform: uppercase;
        font-weight: 500;
        font-size: 11px;
        color: #000000;
    }

    #contact .items .row {
        padding-top: 5px;
    }