html, body { font-family:Helvetica, Arial, Tahoma, sans-serif; margin:0 !important; padding:0 !important;}
a img{border: none !important;}
#container { /*min-height: 350px;*/ margin: 0 0 0 0; position:relative }

#options #filters li a { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
/**** Example Options ****/

#options { width:100%; }
#options #etc { float:right; margin-top:10px; }
#options #etc li a i { color:#9f9f9f; }
#options #etc li a:hover i { color:gold; }
#options #etc li a.toggle-selected i { color:#3f3f3f; }
#options h3 { margin-bottom: 0.2em; font-size: 15px; }
#options h4 { font-weight: bold; }
 @charset "utf-8";
/* CSS Document */
#options ul { margin: 0; list-style: none; }
#options ul ul { margin-left: 1.5em; }
#options li { /*float: left;*/ }
#options #filters { width:100%; margin: 0 auto; padding:0; }
#options #filters span { display:block; text-align:center; }
#options #filters li { margin-right:1px; }
#options #filters li a { font-size:12px; display: block; padding: 10px 20px; color: #404040;/* border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;*/ position:relative; z-index:0; color:white !important; text-decoration:none; }
#options #filters li a:active, #options #filters li a.selected, #options #filters li a:hover { color:navy !important; background-color: gold; -webkit-box-shadow: 0 1px 0 #d74700; -moz-box-shadow: 0 1px 0 #d74700; -o-box-shadow: 0 1px 0 #d74700; box-shadow: 0 1px 0 #d74700; }

html, body { height: 100%; width: 100%; padding: 0; margin: 0; }
body { margin-top:-10px; }
#full-screen-background-image { z-index: -999; min-height: 100%; min-width: 1500px; width: 100%; height: auto; position: fixed; top: 0; left: 0; background-color:#000033; }
#wrapper { position: relative; max-height: 100%; min-width: 200%; margin: -20px 0 0 0; color: #EEE; }

/** PULL OUT LEFT BAR **/
#leftsidebar { /*margin:16px 0; padding:5px 0;*/}
#leftsidebar div { z-index:7; padding:5px; text-align:center; color: #fff; font-weight:normal; font-size:2em; position:fixed; height:100%; display:block; -webkit-box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75); box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75);  background: #01396e; opacity:.9;}
.width-100{width:100%}       
.width-50{width:40%}       
.width-25{width:25%}       
#leftsidebar:hover { /*background: rgba(255,255,255,0.9);*/ }
.leftsidebarclose { display:none !important; }
.input form input[type=text]{color:navy;}
.input form input.rounded{border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px }

    /** INTRODUCTION **/
    #introduction-inner { z-index:8; padding:10px 0; text-align:center; color: #fff; font-weight:normal; font-size:1em; position:fixed; /*height:100%;*/ display:block; background:transparent; opacity:1; top:0; margin-top:165px;}
    #introduction-inner h1{font-weight:normal; font-size:2em; text-transform:uppercase;}
    #introduction-inner a{ color:gold !important; text-decoration:none; }
    #introduction-inner a:hover{ color:rgb(72, 255, 47) !important; text-decoration:none; }
        #intro-search.input{width:80%; margin:20px auto;}
        #intro-search.input form input{ padding:6px 0 ; margin:3px; background: #fff url('../images/search.png') no-repeat 8px 6px; width:100%; background-size:contain;}
        #intro-search.input form input, #intro-search.input form button{float:left; text-align:center; font-size:1em;}
        #intro-search.input form button{ width:20%}
    /** LOGIN FORM **/
    #login-form-inner { z-index:10; padding:25px 0; text-align:center; color: #fff; font-weight:normal; font-size:1em; position:fixed; width:50%; height:100%; display:block; background:transparent; opacity:1;}
    #login-form-inner h1{font-weight:normal; font-size:2em; text-transform:uppercase;}
    #login-form-inner a{ color:gold !important; text-decoration:none; }
    #login-form-inner a:hover{ color:rgb(72, 255, 47) !important; text-decoration:none; }
        #log-into-account {width:50%;}
        #log-into-account label{display: block; font-size: 1.1em;font-weight: bold;color: #fff; margin-bottom: 3px; text-align:left;width:100%;}
        #log-into-account.input form input{ padding:6px ; margin:3px; width:100%; display:block;padding: 6px 5px;margin-bottom: 15px;color: navy;font-size: 1.4em;}
        #log-into-account.input form button{text-align:center; width:20%;}
    /** CREATE ACCOUNT FORM **/
    #create-account-form-inner { z-index:10; padding:25px 0; text-align:center; color: #fff; font-weight:normal; font-size:1em; position:fixed; width:50%; height:100%; display:block; background:transparent; opacity:1;}
    #create-account-form-inner h1{font-weight:normal; font-size:2em; text-transform:uppercase;}
    #create-account-form-inner a{ color:gold !important; text-decoration:none; }
    #create-account-form-inner a:hover{ color:rgb(72, 255, 47) !important; text-decoration:none; }
        #create-an-account {width:50%;}
        #create-an-account label{display: block; font-size: 1.1em;font-weight: bold;color: #fff; margin-bottom: 3px; text-align:left;width:100%;}
        #create-an-account.input form input{ padding:6px ; margin:3px; width:100%; display:block;padding: 6px 5px;margin-bottom: 15px;color: navy;font-size: 1.4em;}
        #create-an-account.input form button{text-align:center; width:20%;}

#inner-content.leftsidebaractive { margin-left:300px; }
/*#otheroptions{ position: fixed; top: 5px; right: 0; background:white; color:black; z-index:10;}*/
#menu-options {position: fixed; color:navy; z-index:10;}
#menu-options a{display:block;}
.twoColumns{-webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;}
.threeColumns{-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;}
.fourColumns{-webkit-column-count: 4; /* Chrome, Safari, Opera */
    -moz-column-count: 4; /* Firefox */
    column-count: 4;}
    
    @media only screen and (max-width: 900px) {
.twoColumns, .threeColumns, .fourColumns{-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;}
    }
