* { font-family: 'Open Sans', sans-serif; box-sizing: border-box; -moz-box-sizing: border-box;}

body {font-size: 14px; margin: 0;}

header { background: #121212; padding: 10px; position: fixed; top: 0; left: 0; right: 0; z-index: 2; }
    header img { max-width: 175px;}

section#directory-filters { position: fixed; left: 0; top: 84px; right: 0; z-index:1; background: #f0f0f0; padding: 20px; -webkit-box-shadow: 0 0 50px 0 rgba(0,0,0,.3); box-shadow: 0 0 50px 0 rgba(0,0,0,.3); }
    section#directory-filters .form-item { margin-bottom: 0;}

section#map-container { position: fixed; left: 500px; top: 188px; right: 0; bottom: 0; background: #e5e5e5; }

section#directory-list-container { position: fixed; left: 0; top: 188px; width: 500px; padding: 20px; bottom: 0; background: #fff; overflow: auto; }

    .directory-list-item { margin-bottom: 20px; border-bottom: 1px solid #ccc; padding-bottom: 20px; }
    .project-date-container { }

    .directory-list-item h4 { font-size: 1.25em; }
    .project-date-container span { margin-right: 30px }
    .directory-list-item .form-item span { margin-bottom: 0; }

.project-website-link { background: #27969d; color: #fff; font-weight: 700; display: block; text-align:center; padding: 10px 20px; text-decoration: none; margin-top: 15px; }


/*Admin*/

.website-box { position:relative;}
    /*.website-box::after { content: ".nmdotprojects.org"; position: absolute; bottom: 13px; right: 10px; }*/
    .website-box::after {  position: absolute; bottom: 13px; right: 10px; }


    /*General Styles*/
    .clear-after::after { content: ""; clear: both; display: block; }

.width20 { float:left; width: 14.25%; margin-right: 5%;}
    .width20:last-child { margin-right: 0;}

.width25 { float:left; width: 21.25%; margin-right: 5%;}
    .width25:last-child { margin-right: 0;}

.width33 { float: left; width: 30%; margin-right: 5%; }
    .width33:last-child { margin-right: 0; }

.width50 { float: left; width: 47.5%; margin-right: 5%; }
    .width50:last-child { margin-right: 0; }



.form-section { margin-bottom: 30px; padding-bottom: 20px; border-bottom: 5px solid rgba(0,0,0,.1); max-width: 700px; }
.form-section-add { margin-bottom: 30px; }

.form-sub-title { font-size: 16px; font-weight: 700; margin-bottom: 20px; }
    .form-sub-title span { font-size: 12px; display: block; font-weight: 400; margin-top: 5px; }

.form-item { margin-bottom: 15px; }
    .form-item span { display: block; font-size: .8em; color: #000; text-transform: uppercase; font-weight: 400; margin-bottom: 8px; }
        .form-item span.ltc-testing-date { font-size: 1em; }

        .form-item span.required:before { color: red; content: "*"; display: inline-block; padding-right: 5px; }

.radio-btn-container { padding-bottom: 15px; border-bottom: 1px solid rgba(0,0,0,.1); }

.rb-container { margin: 20px 0; }

input[type=text], input[type=password], input[type=date], input[type=number], input[type=email], input[type=tel], select { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; font-family: 'Open Sans', sans-serif; font-size: 1em; }
input[type=button], .btn { background: #277ad4; color: #fff; display: inline-block; border: 0; padding: 10px 15px; font-family: 'Open Sans', sans-serif; font-size: 1em; border-radius: 2px; -moz-border-radius: 2px; cursor: pointer; text-decoration: none; }
textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; height: 125px; font-family: 'Open Sans', sans-serif; font-size: 1em; }

.cb-container { float: left; margin-right: 2em; }

.top-nav { list-style: none; padding: 0; margin: 0; position: absolute; top: 20px; right: 20px; }
    .top-nav li { float:left; margin-left: 10px;}
        .top-nav li a { display:block; padding: 10px; color:#fff; text-decoration:none; background:#27969d; font-weight: 700; }


/*pm begin*/        
section#main-container { position: fixed; left: 0px; height:100%; top: 80px; right: 0; bottom: 0; background: #e5e5e5; }
    section#main-container #login-window {margin-left:auto; margin-right:auto; margin-top:auto; margin-bottom:auto; width:600px; height:300px; background-color:#fff;}
    section#main-container #main-window {margin-left:auto; margin-right:auto; margin-top:auto; margin-bottom:auto; width:1300px; height:800px; background-color:#fff;}

.align-right {text-align:right}

.invalid {border-color:red !important;}

section#fp-container { position: fixed; left: 0px; height:100%; top: 400px; right: 0; bottom: 0; background: #e5e5e5; }
    section#fp-container #fp-window {margin-left:auto; margin-right:auto; margin-top:auto; margin-bottom:auto; width:600px; height:300px; background-color:#fff;}

section#widget-management-container { position: fixed; left: 0px; top: 84px; right: 0; bottom: 0; background: #e5e5e5; }
    section#widget-management-container .main-content-full {margin:50px}

/*loader begin*/
#overlay {
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 100000; /* Sit on top */
    left: 0;
    top: 0;
    background: rgba(141, 141, 141, 0.4); 
    overflow-x: hidden; /* Disable horizontal scroll */
    display:none;
    }


#loader {
    position: fixed;
    opacity: 1;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: 16px solid #a7a5a5;
    border-radius: 50%;
    border-top: 16px solid rgba(77, 57, 194, 1);
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    }
    
    @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
    }
    
    @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
    }
/*loader end*/


/*pm end*/

#login-window { max-width: 600px; margin: 50px auto 20px; background:#fff; -webkit-box-shadow: 0 0 50px 0 rgba(0,0,0,.1);box-shadow: 0 0 50px 0 rgba(0,0,0,.1);}
.loginBG { background:#e5e5e5;}

#fp-window { display:none;}

.login-pane {padding: 50px;}
.toogle-pane { font-size: .8em; float:right;}

.footer-txt { font-size: .8em; text-align:center; opacity: .4;}

.add-location { background: #27969d;
    color: #fff;
    font-weight: 700;
    display: block;
    text-align: center;
    padding: 10px 20px;
    text-decoration: none;
    }

.directory-list-item{
    padding:5px;
}

.selected-directory-list-item{
    background-color:#ffb;
 
}