/*
Tutorial Name: Off Canvas Sliding Navigation
Author: Samuel Dalusung
*/


/* GENERAL STYLES
-------------------------------------------------*/


/* CONTAINERS
-------------------------------------------------*/

#container {
    width: 100%;
    height:auto;
    position: relative;
  
}

#canvas {
    width: 100%;
    height: auto;
    position: relative;
    padding : 0; 
    -webkit-transform:translateX(0);
    -moz-transform:translateX(0);
    -ms-transform:translateX(0);
    -o-transform:translateX(0);
    transform:translateX(0);
    -webkit-transition:.5s ease all;
    -moz-transition:.5s ease all;
    -o-transition:.5s ease all;
    transition:.5s ease all;
    

}

.fa-close
{
   display:  none !important;
}

/* UTILITIES
-------------------------------------------------*/


#logo a {
    position : relative; 
    display : inline-block; 
    vertical-align : top;
}
/*
#logo > a:nth-child(1) {float : left; width: 5%; }
#logo > a:nth-child(2) {display:inline-block; position:relative; width:100%; margin:0 auto; text-align:left;}
#logo > a:nth-child(3) {float :right; width: 5%; }
*/


#bars, #search, #ctl00_LoginMenuMobile1_btnLoginOrLogout{
	font-size: 20px;
}

#bars {
    float:left;
    margin-left:3%;
}

#ctl00_LoginMenuMobile1_btnLoginOrLogout{
	float:right;
}

.fa-lock, .fa-unlock-alt {
    float: right;
    display : none !important;
}

.fa-bars {
    float: left;
    display : none !important;
}

#bars:hover, #ctl00_LoginMenuMobile1_btnLoginOrLogout:hover, #search:hover{
       color: #0071cf;
}

#title{
	margin: 0;
	padding: 1em;
	color: rgba(0,0,0,0.4);
	text-shadow: 0 0 1px rgba(0,0,0,0.1);
	font-weight: 300;
	font-family: 'Raleway', Arial;
}

.border{
    border-top: 1px solid rgba(0,0,0,0.2);
}

a.back {
   color: #38935f; 
   text-decoration: none; 
   text-align: left; 
   font-family: 'Open Sans', sans-serif; 
   font-size: 20px;
   font-weight: 600;
   display: block;
   border: 2px solid #38935f;
   padding: 10px;
   z-index : 999;
}

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
}


/* TOGGLE NAV
-------------------------------------------------*/


#findarep
{
   display:none;	
}

#toggle {
    list-style: none;
    float : right;
    z-index : 999;
    font-size: 0; 
    width:100%;
    text-align:right;
    display:inline-block;
    width:96%;
    margin-right: 2%;
}

#toggle div:hover a {
    color:#4c8dce;
    text-decoration: none;
}

 span.menu-icons {
    font-size: 15px;
    height: 20px;
    width: 22px;
    /*height: 0px; width: 0px;*/ 
    float: left;
    /*margin: 11px 0px 10px 37px;*/
    color: #fff;
    margin: 0px;
}

span.fa-home {
    display: none;
}

span.the-btn {
    float: right;
    font-size: 1.1rem;
    /*height: 30px;
    width: 43px;*/
    margin-top: 10px;
	margin-right: 8px;
    padding:0;
    color: #fff;
    display:none;
}

#toggle ul {
    list-style: disc;
    display: none;    
}

#toggle li a {
    display :  inline-block ;
    width : auto;
  font-size: 12px;

    list-style: none;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    text-transform:capitalize;
    padding-top:7px;
    padding-bottom:7px;
    z-index:999;
    text-align:center;
 }



#toggle ul li {
       margin-left  : 1em;  
    
       z-index : 999;
       position :relative; 
       display:block ; 
       background-color:#ffffff;
}

#toggle ul li a:hover
{
	background: #e6e7e8;  
    z-index : 999;
}

#toggle ul li a { 
     z-index : 999;
}

.fa-bars::before {
    content: "\f0c9";
}

ul {
    margin-left: 0px;
}

a:hover {
    text-decoration: none;
}

/*#searchholder {display: inline-block;}*/
/*#bars {display :none;}*/
/*#toggle div:hover {color:#414042;}*/	
#toggle > li:first-child, #toggle > li:nth-child(2)
{
    border-left-width: 0;	
	
}
#toggle > li { cursor:pointer; display:inline-table; margin:0em; width:auto; font-family:'Oswald', Sans-Serif; font-weight:300; padding-right:.5%; padding-left:.5%;;     border-left-color: #555555;
    border-left-width: 1px;
    border-left-style: solid;}

#toggle > li > ul {position:absolute; width:auto; padding-left:0px; padding-right:0px; }
#toggle li a {text-align:left;}
#toggle > li > a {list-style:none; margin:0;}
#toggle > li > ul > li {padding-left:0; padding-right:0; }
#toggle > li > ul >  li > a {padding-left:5%; padding-right:5%; margin-left:0; width:90%; display:inline-block ;}
#toggle > li:hover > ul {display:block;}

.display-nav #toggle > li > ul
{
 width : 100%;	
}

.display-nav #toggle > li:hover > ul {display:none;}

.display-nav #toggle  li a:hover
{
	background: #e6e7e8;  
	 z-index : -1;
}

.display-nav #toggle > li > div > a
{
  	 position: relative;
	 z-index : -1;
}


.display-nav #toggle > li > div.nosubmenu > a
{
 
     display : inline-block;	 
	 z-index : 999;
	 width :   90%;
	 margin-left: 1em;
}






/*#toggle span.the-btn, #toggle span.menu-icons {display : none;}*/
#toggle ul {z-index : 999; border:solid 1px #bcbec0; border-top:solid 7px #4c8dce;}
#toggle ul li ul li a {display:block ; width:100%; list-style:none; padding:0; margin-left:0; }
#title {position:relative; width:auto; float:left; margin:0; }
#title{margin: 0; padding: 1em; color: rgba(0,0,0,0.4); text-shadow: 0 0 1px rgba(0,0,0,0.1); font-weight: 300; font-size: 1em; font-family: 'Oswald', sans-serif; }
#searchmodilediv{ display:none;}


/*************************************************************************************************************************/
#mobilelogin 
{
    display: none;	
    margin-right: 3%;
}
 #searchholder
 {
   display : inline-block;	
 }



@media only screen and (max-width: 1024px) {



.spotlightfiles li
{
   padding-top: 3px;
   padding-bottom: 3px;
   margin-left:0px;
   margin-right:0px;
}

#mobilelogin
{
   float:right;	
	
}


#mobilelogin i
{
    	display:inline-block;
	position :relative;
     float :right !important;
	 z-index :9999;
	color : #EF7D24;
    font-size: 30px;
    margin-top: 10px;
   	
}

#logo {text-align: center; 
        float :left;
       }
#bars 
{
	/*float:left; width:10%;*/ 
	display:inline-block;
	position :relative;
     float :left !important;
	 z-index :9999;
	color : #EF7D24 !important;
    font-size: 50px;
    
 }
 
 #searchholder
 {
    display: none;	
 	
 }
#mobilelogin 
{
    display: inline-block;
}
 
#ctl00_LoginMenuMobile1_btnLoginOrLogout {float:right; width:10%;}
/*.fa-bars {float: left;}*/
#toggle span.the-btn, #toggle span.menu-icons {display : block;}
/*.fa {display : block !important;}*/
#logo img {margin-left:auto; margin-right:auto;}
#logo > a:nth-child(2) {width:auto; text-align:center;}
#searchmodilediv{ display:block;}

#toggle > li {cursor:pointer; display:inline-block; margin:0em; width:100%; font-family:'Oswald', Sans-Serif; font-weight:300; padding-right:0px; margin-right:0px;}
.fa-lock, .fa-unlock-alt, .fa-bars {float: right; display : block!important;}
span.the-btn {display:block;}
}
/* **************************************************** SCREEN 480 *******************************************************/


@media only screen and (max-width: 480px) {

}