/* Windborne EVM CSS (Main) */

/* Non-responsive CSS */

body {
    background-color: #1c4a6b;
    font-family: 'Questrial','Open Sans', sans-serif;
    font-size: 150%;
    letter-spacing: .025em;
    margin: 0px;
    padding: 0px;
    /*overflow-y: scroll;*/
}


.container {
    width:100%;
    padding-right:0px;
    padding-left:0px;
}

.navbar {
    margin-bottom: 0px;
}

hr {
    border-top: 1px solid #BBB;
}

.modulecss {
    padding:10px;
}

.editor-visibility {
    display: none;
}



/** TEMPLATES CSS **/



/* Header colors */
.header-1-color {
    background-color: #c5c997;
}

.header-2-color {
    background-color: #accaa6;
}

.header-3-color {
    background-color: #9fbcb0;
}

.header-4-color {
    background-color: #a6c9bb;
}

.header-5-color {
    background-color: #a3c1a3;
}

.header-6-color {
    background-color: #99c0c3;
}

.header-7-color {
    background-color: #aecdd4;
}

.header-8-color {
    background-color: #afc0d4;
}

.header-9-color {
    background-color: #bccbd9;
}

.header-10-color {
    background-color: #a7bbc9;
}

.header-11-color {
    background-color: #bcc4d2;
}

.header-12-color {
    background-color: #c9c1cb;
}

.header-13-color {
    background-color: #d5c9d4;
}


.header-14-color {
    background-color: #1c4a6b;
}



.header-text-c-1 {
    color:#000;
}

.header-text-c-2 {
    color:#ffffff;
}


.header-hover-c-1 {
    background-color: #1c4a6b;
}

.header-hover-c-2 {
    background-color: #000000;
}

.header-hover-c-3 {
    background-color: #880b0b;
}


.header-hovertext-c-1 {
    color: #FFFFFF; /* White */
}

.header-hovertext-c-2 {
    color: #000000; /* Black */
}

.header-hovertext-c-3 {
    color: #880b0b; /* Red */
}

.header-hovertext-c-4 {
    color: #f3e314;/* Yellow */
}

.data-bg-color-c1 {
    background-color: #FFFFFF;
}

.data-bg-color-c2 {
    background-color: #d6d6d6;
}

.data-text-color-c1 {
    color: #000000;
}

.data-text-color-c2 {
    color: #99c0c3;
}

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

    #top-exit {
        display: block;
        position: absolute;
        top:10px;
        right:15px;
        font-weight: bold;
        z-index: 1000;
    }

    .container {
        width:100%;
    }


    div#exitbutton {
        background-color: #3e597c;
        width: 40px;
        height: 20px;
        color:#fff;
        text-align: center;
        font-size: 13px;
        line-height: 13px;
        padding:5px 0px;
        letter-spacing: .075em;
        cursor: pointer;
        position:relative;
        z-index: 2000;
    }



    div#exitbutton:hover {
        background-color: #4d729a;
        text-decoration: none;
    }

    #top-exit a {
        padding: 0px;
        margin: 0px;

    }

    #top-exit a:hover {
        color:#fff;
        text-decoration: none;
    }

    div#exitbutton {
        background-color: #689ecf;
    }

    .mid-container {
        background-color: #e6e5e7;
        padding: 10px 0px;
    }

    #top-openclose-all {
        display: block;
        position: absolute;
        top:38px;
        right:22px;
        font-weight: bold;
        z-index: 1000;
    }

    form textarea {
        margin:10px auto;
        width: 95%;
    }

    #previewtemplate {
        margin:10px auto;
        width: 95%;
    }

    ul.modulecolors {
        list-style: none;

    }
    li.modulecolorchoice {
        float: left;
        padding: 12px;
        width:80px;


    }

    .template-row {
        max-width: 820px;
        width: 100%;
        margin: auto;
        background-color: lightgrey;
    }

    #headerpanel span {
        text-transform: uppercase;
    }


}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

    #top-exit {
        display: block;
        position: absolute;
        top:10px;
        right:10px;
        font-weight: bold;
        z-index: 1000;
    }

    div#exitbutton {
        background-color: #3e597c;
        width: 60px;
        height: 25px;
        color:#fff;
        text-align: center;
        font-size: 16px;
        line-height: 16px;
        padding:5px 0px;
        letter-spacing: .075em;
        cursor: pointer;
        position:relative;
        z-index: 2000;
    }

    div#exitbutton:hover {
        background-color: #4d729a;
        text-decoration: none;
    }

    #top-exit a:hover {
        color:#fff;
        text-decoration: none;
        z-index: 1000;
    }

    div#exitbutton {
        background-color: #689ecf;
    }


    form textarea {
        margin:10px auto;
        width: 95%;
    }

    #previewtemplate {
        margin:10px auto;
        width: 95%;
    }

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

    .container {
        width:100%;
    }
    .mid-container {
        background-color: #e6e5e7;
        padding: 20px 0px;
    }

    #top-exit {
        right:5px;
    }

    form textarea {
        margin:10px auto;
        width: 80%;
        max-width: 900px;
    }

    #previewtemplate {
        margin:10px auto;
        width: 80%;
        max-width: 900px;
    }


}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .container {
        width:100%;
    }

    form textarea {
        margin:10px auto;
        width: 80%;
    }

    #previewtemplate {
        width: 80%;
        margin:10px auto;
    }

    #modulecolors {
        width: 900px;
        margin:10px auto;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .container {
        width:100%;
    }


}