/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                    CSS BASICS DO NOT UPDATE OR CHANGE THIS                          +
+     IF YOU WANT TO OVER RIDE THESE STYLES PLEASE DO IT AT THE VERY BOTTOM OF THIS   +
+     CHANGES TO THESE STYLES WILL BE COPIED OVER THE ENTIRE SECTION                  +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/*----------


Screen sizes

PC Size 1920 x 1080 
PC Size 1280 x 1024 (campus lab computers)

ipad size 1024 x 768

nexus size 




-------*/
.btnNavMenu
{
    display:none;
    background-color:inherit;
    color:#fff;
    padding:2%;
}

 .btnNavMenu a
{
    background-image:url("/advancement/_resources/images/icons/mobilemenu.png");
    background-repeat:no-repeat;
    height:35px;
    background-position:left;
    background-repeat:no-repeat;
    border:solid 0px #fff;
    padding:1%;
    background-color:transparent;
    color:#fff;
    text-shadow:0px 4px 10px rgba(0,0,0,.5);
    width:200px;
    display:block;
    text-indent:38px;
}

#divFolderNav
{
    display:none;
}

#divFolderMenu
{
    display:none;
}



@media screen and (min-width:1200px) and (max-width:1399px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN FOR COMPUTER LABS
    --------------------------------------- */
    
    
  
}

@media screen and (min-width:1020px) and (max-width:1200px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN / iPad in LAND SCAPE
    --------------------------------------- */
  .Show80Wide
  {
    width:75%;    
  }
  
  .Show60Wide
  {
      width:57%;
  }

  #SiteName_Tabs{
      float:left;
      width:100%;
  }
      
    
}

@media screen and (min-width:950px) and (max-width:1019px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN / iPad in LAND SCAPE
    --------------------------------------- */
  .Show80Wide
  {
    width:75%;    
  }
  
  .Show60Wide
  {
      width:54%;
  }
      #SiteName_Tabs{
      float:left;
  } 
    
}

@media screen and (min-width:800px)  and (max-width:949px)
{
     /*-------------------------------------------
     STANDARD SMALL PC SCREEN 
    ---------------------------------------------- */
      .Show80Wide
    {
        width:70%;    
    }
  
  
  .Show60Wide
  {
      width:45%;
  }
      
  #sitecues-badge
  {
      display:none;
  }
  
  #Social
  {
     margin-right:8px;
  }
  #Social img
  {
      height:17px;
      width:17px;
  }
  #SocialLinks
  {
      height:40px;
  }
  #SocialLinks li
  {
      padding:3px;
  }
    
   #SiteName_Tabs{
      float:left;
  }

}

@media screen and (min-width:750px)  and (max-width:800px)
{
     /*-------------------------------------------
     STANDARD SMALL PC SCREEN 
    ---------------------------------------------- */
      .Show80Wide
    {
        width:70%;    
    }
    
  .Show60Wide
  {
      width:42%;
  }
      
  #sitecues-badge
  {
      display:none;
  }
    
   #Social
  {
     margin-right:8px;
  }
  #Social img
  {
      height:17px;
      width:17px;
  }
  #SocialLinks
  {
      height:40px;
  }
  #SocialLinks li
  {
      padding:3px;
  }
   #SiteName_Tabs{
      float:left;
  }
}


@media screen and (min-width:500px)  and (max-width:750px)
{
   /*---------------------------------------------------------------
    DEFAULT MOBILE STYLES LANDSCAPE VIEW ON MOST PHONES
    ----------------------------------------------------------------*/
    .Show80Wide, .Show60Wide
    {
        width:95%;    
    }
  
  
  
  body
  {
      position:relative;
  }
  
  #BannerImage
  {
      display:none;
  }
  
  #CSUFTopLink, #CSUFLink_Search, #Tabs, #header_LowerScroll
  {
      display:none;
  }
  
  #mobile_header
  {
    display:block;
    height:40px;
    position:fixed;
    top:0px;
    left:0px;
    color:#222;
    background-color:#f4f5f5;
    width:100%;
    z-index:12000;
    border-bottom:solid 1px #ccc;
      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f8f9+0,d7dee3+100,f5f7f9+100 */
background: #f6f8f9; /* Old browsers */
background: -moz-linear-gradient(top,  #f6f8f9 0%, #d7dee3 100%, #f5f7f9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f6f8f9 0%,#d7dee3 100%,#f5f7f9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f6f8f9 0%,#d7dee3 100%,#f5f7f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */

}
  
  #mobile_header #btnMobileMenu
  {
    position:relative;
    background-image: none;
    border-radius: 4px;
    border: solid 1px transparent;
    cursor: pointer;
    display: block;
    float: left;
    font-size: 14px;
    height: 28px;
    width: 28px;
    background-color:transparent;
    color:#222;
    margin-bottom: 8px;
    margin-left: 10px;
    margin-right: 8px;
    margin-top: 5px;
    overflow-x: visible;
    overflow-y: visible;
    padding: 5px;
    text-align: center;
  
  }
  
  #mobile_header #btnMobileMenu:hover
   {
       border:solid 1px #aaa;
       border-top:solid 1px #cbcbcb;
       box-shadow:0px 1px 0px rgba(0,0,0,.4);
       background-color:#f7f7f7;
       background:#f7f7f7;
       color:#333;
   }
  
  .menubar
  {
    display: block;
    float:left;
    width: 15px;
    height: 3px;
    margin-bottom:3px;
    border-radius: 3px;
    background-color:#003366;
    background:#003366;
    color:#fff;
    transition:.25s ease-in-out;
  }
  
   #mobile_header #btnMobileMenu:active .menubar
   {
      background-color:#fff;
      color:inherit;      
   }
   
  .sr-only
  {     
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
  background-color:#002B54;
  color:#fff;
  }
  
  #btnMobileMenu:hover .menubar
  {
   background-color:#E17000;
   color:#222;
  }
  
  #btnMobileMenu.mobileon span:nth-child(2).menubar
  {
    top:12px;
    left:5px;    
    position:absolute;
    background-color:#E17000;
    color:#000;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  
  #btnMobileMenu.mobileon span:nth-child(3).menubar
  {
    opacity:0;
  }
  
  #btnMobileMenu.mobileon span:nth-child(4).menubar
  {
    top:12px;
    left:5px;
    position:absolute;
    background-color:#E17000;
    color:#000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  
  #mobile_search
  {
      position:fixed;
      top:2px;
      left:40px;
      width:85%;
      z-index:300000;
  }
  
  #mobile_search label
  {
      position:absolute;
      top:-100px;
      left:100000px;
  }
  
  #mobile_search input[type='text']
  {
       border: solid 1px #002B54;
       font-size:.95em;
       height:18px;
       padding:5px;
       font-weight:normal;
       width:280px;
       margin-top:5px;
       float:right;
       margin-left:5%;
  }
  
  #btnSearchMobile
  {
     border-radius: 4px;
      border: solid 1px rgba(22,55,88, .5);
      cursor: pointer;
        display: block;
  float: right;
  font-size:1em;
  height: 30px;
 /* width: 40px;*/
  margin-bottom: 8px;
  margin-left: 10px;
  margin-right: 20px;
  margin-top: 5px;
  padding: 9px;
  padding-top: 6px;
  text-align: center;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0057ab+0,093864+100 */
  background:#093864;
  background-color:#093864;
  color:#f7f7f7;     
background: #0057ab; /* Old browsers */
background: -moz-linear-gradient(top,  #0057ab 0%, #093864 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0057ab 0%,#093864 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0057ab 0%,#093864 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0057ab', endColorstr='#093864',GradientType=0 ); /* IE6-9 */

  }
  
  
  
  #mobile_csuf
  {
      position:fixed;
      float:right;
      right:0px;
      top:0px;
      width:50px;
      height:40px;
      background-color:#003366;
      color:#f7f7f7;
      box-sizing:border-box;
      border-left:solid 1px #f7f7f7;
      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0f3c73+0,002b54+100 */
background: #0f3c73; /* Old browsers */
background: -moz-linear-gradient(top,  #0f3c73 0%, #002b54 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0f3c73 0%,#002b54 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0f3c73 0%,#002b54 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0f3c73', endColorstr='#002b54',GradientType=0 ); /* IE6-9 */

  }
  
  #mobile_csuf a
  {
      display:block;
      background: #002b54;
      background-color:inherit;
      color:#fff;
      font-size:.7em;
      font-family:Arial;
       width:auto;
      margin:auto; 
      margin-top:15px;   
      text-align:center; 
  }
  #mobile_csuf a:hover
  {
      text-shadow:1px 1px 3px rgba(200,200,200,.5);
  }
  
  #mobile_header_menu
  {
      display:block;
      position:fixed;
      border-right:solid 1px #9DBED8;
      border-bottom:solid 1px #9DBED8;
      box-shadow:1px 2px 8px rgba(0,0,0,.8);
      top:30px;
      left:-550px;  
      height:100%;
      padding:5px;
      padding-top:15px;
      width:100%;  
      max-width:350px;
      overflow-y:auto;
      color:#fff;
      background:#1D508A;
     
      z-index:10000;
      transition: all 0.8s ease;
  }
  
  #mobile_header_menu ul
  {
      list-style-type:none;
      margin:0px;
      padding:5px;
  }
  
   #mobile_header_menu li
  {
      border-bottom:solid 1px #1c4464;
      border-top:solid 1px #0059ac;
      padding-top:5px;
      padding-bottom:8px;
      margin-top:0px;
      margin-bottom:0px;
      background-color:transparent;
      color:#fff;
  }
  
   #mobile_header_menu li:first-child
   {
       border-top:0px;
   }
   
   #mobile_header_menu li:last-child
   {
       border-bottom:0px;
   }
  
  #mobile_header_menu.mobileopen
  {
    left:0px;
     transition: all 0.8s ease;
 
  }
 
  #mobile_header_menu.mobileclosed
  {
     left:-500px;
    transition: all 0.8s ease;
  }
  
  #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
  #mobile_header_menu p, #mobile_header_menu li, #mobile_header_menu a
  {
      color:#f7f7f7;
      background:#1D508A;
  }
  
  #mobile_header_menu a
  {
      color:#f7f7f7;
      padding:1%;
      padding-top:6px;
      display:block;
      border-bottom-left-radius:6px;
      border-bottom-right-radius:6px;
      background:#1D508A;
 }
 
  #mobile_header_menu a:hover,
  #mobile_header_menu a:active
  {
      color:#f7f7f7;
 background:#22517B;
  }
  
  #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
  #mobile_header_menu p, #mobile_header_menu li
  {
      margin-left:5px;
  }
  
  #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
  #mobile_header_menu p
  {
      margin-bottom:5px;
  }
  
  #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3
  {
      line-height:normal;
      padding-bottom:4px;
      margin-bottom:1%;
  }
  
  #mobile_header_menu .sectionnav
  {
      margin:0px;
      padding:0px;
  }
  
  #mobile_header_menu .sectionnav ul:first-child
  {
      margin:1em;
      margin-top:0px;
      margin-bottom:20px;
      padding:0px;
      border-top:solid 2px #f7f7f7;
  }
  
   #mobile_header_menu .sectionnav li
  {
      margin:0px;
      padding:0px;      
  }
  
  #mobile_header_menu .sectionnav button
  {
      background-color:#f7f7f7;
      color:#002B54;
      height:30px;
      width:30px;
      padding:8px !important;
      padding-bottom:15px !important;
      margin-top:15px !important;
  }
  
  .mobile_division a
  {
      font-style:italic;
      font-size:.85em;
  }
   
   #mobile_header_menu .mobile_social
  {
      min-height:28px;
      float:left;
      width:100%;
      margin:0px;
      margin-top:8px;
      margin-bottom:8px;
      padding:0px;
      border:0px;
      background:#efefef;color:#222;
      border-left:solid 6px #E17000;
      border-right:solid 6px #E17000;
      box-sizing:border-box;      
  }
  
  #mobile_header_menu .mobile_social li
  {
      float:left;
      border:0px;
      padding:2px;
      padding-left:5px;
      margin:0px;
      background:inherit;color:inherit;
  }
  
  #mobile_header_menu .mobile_social li a
  {
      background:inherit;
      color:inherit;
      margin:0px;
      padding:0px;  
  }
  
  
  .mobile_sitetabs button
  {
      float:right;
      margin-top:2px;
      margin-bottom:2px;
      background-color:#f7f7f7;
      color:#002B54;
      height:25px;
      width:25px;
      border:solid 1px #f7f7f7;
      border-radius:4px;
  }
  
  .mobileexpand
  {
      display:block;
      font-size:.85em;
      padding-left:10px;      
  }
  
  .mobileexpand ul, .mobileexpand ol
  {
      margin:8px;
      margin-top:12px;     
  }
  
  .mobileexpand img
  {
      max-width:96%;
      height:auto;
      margin:2%;
      padding:0%;
  }
  
  
  .mobilecollapse
  {
      display:none;
    transition: all 0.8s ease;
  }
  
    
    #header
    {
        padding:0%;
        margin-top:50px;
    }
    
    #search
    {
       display:none;
       float:none;
       clear:both;
       position:relative;
    }
    #macronav
    {
       position:absolute;
       top:8px;
       right:5px;
        margin:0%;
        padding:0%;
    }
    
    #branding
    {
        padding-top:30px !important;
    }
    
    #unit, #Tabs2Social, #breadcrumb
    {
       display:none;
    }
   
   
    #sitename
    {
        padding:0%;
        margin:0%;
        font-size:.7em;
    }
    
    #sidebar1, #sidebar2
    {
        clear:both;
        width:95%;
        float:none;
        border-bottom:solid 1px #ccc;
        margin-bottom:30px;
    }
    
     
    #sidebar1 #MainMenu, #sidebar2 #MainMenu 
    {
        display:none;
    }
    
    #sidebar1
    {
        display:none;
    }
    
    #mobile_sidebar1
    {
        background-image:none;
        max-width:95%;
        padding:10px;
        margin:5px;
        background-color:#fff;
        color:#222;
        border:solid 1px #ccc;
        
    }
    #mobile_sidebar1 .sideblock h1, #mobile_sidebar1 .sideblock  h2, #mobile_sidebar1 .sideblock  h3,
  #mobile_sidebar1 .sideblock  p, #mobile_sidebar1 .sideblock  li, #mobile_sidebar1 .sideblock a
    {
        background-color:#fff;
        color:#222;
    }
    
    #mobile_sidebar1 .sideblock img
    {
        float:left;
        width:auto;
        height:auto;
        clear:both;
    }
    
    .Show80Wide, .Show60Wide
    {
        width:100%;
    }
     /*--- Section Navigation --- */
.sectionnav
{
    margin:0px;
    padding:0px;
    padding-top:.8em;
}
.sectionnav ul
{
    list-style-type:none;
    margin:0px;
    margin-left:5px;
    
}

.sectionnav li
{
    padding:.5%;
    border-bottom:solid 1px #3073AD;
    border-top:solid 1px #C3DCF6;
}

.sectionnav li:first-child
{ border-top:0px;   }

.sectionnav li:last-child
{ border-bottom:0px;   }

.sectionnav a
{   
    display:block;
    text-decoration:none;
    font-size:1em;
    padding-left:1%;
}

.sectionnav h3
{  font-family: 'open_sansbold';
    font-weight: 800;
    text-transform:uppercase;
    font-size:1em;
    line-height:1.8em;
    color:#686868;
    margin:0px;
    padding-left:5px;
}

/*---------- VERTICAL NAV -----------------------*/

#VerticalNavMenu
{
    position:fixed;
    top:35px;
    left:-97%;   
    width:93%;
    height:100%;
    background-color:#f7f7f7;
    color:#222;
    z-index:500;
    transition:left .6s;
}

#MobileVertNavSlider
{
    display:block;
    position:fixed;
    height:70%;
    left:0px;
    padding:3px;
    padding-top:65%;
    width:6px;
    background-color:#1D508A;
    color:#fdfdfd;
    z-index:515;
    text-align:center;
    font-size:.6em;    
    transition:all .6s;
}

.hideleft
{
    left:0px;
    text-align:right;   
}

#VerticalNavMenu.hideleft
{
    left:-100%;
    text-align:left;
}

#VerticalNavMenu.showright
{
    left:0px;
}

#MobileVertNavSlider.showright
{
    left:92% !important;
    width:30px;
    text-align:left;  
}

#VerticalNavMenu a
{
    background-color:#f7f7f7;
    color:#0057ab;
}

#VerticalNavMenu button
{
    color:#f7f7f7;
}

#VerticalNavMenu ul li ul
{
    background-color:#f7f7f7;
    color:#222;
    border-bottom:solid 0px #121212;
    border-top:solid 0px #C2C2C2;
}

#VerticalNavMenu ul li ul li
{
    background-color:#f7f7f7;
    color:#222;
    border-bottom:solid 1px #121212;
    border-top:solid 1px #C2C2C2;
}

#VerticalNavMenu li
{
    border-bottom:solid 1px #121212;
    border-top:solid 1px #C2C2C2;
}

#centercontent
{
    padding-top:5px;
}



    
    /* --- CSUF CLASSES FIXES --- */
    .CalendarBlock1, .CalendarBlock2, 
    .featureBlock1, .featureBlock2, .featureBlock3
    {
        width:100%;
        float:none;
        clear:both;
    }
    
    .divA, .divB, .divC, .divD, .divE, .divF, .divG, .divH,
    .divI, .divJ, .divK, .divL, .divM, .divN, .divO, .divP,
    .divQ, .divR, .divS, .divT, .divU, .divV, .divW, .divX,
    .divY, .divZ
    {
       width:98% !important;
       display:block !important;       
       clear:both !important;
       float:left !important;        
       margin:auto;
       padding:.2em; 
    }   

	img.linkicon
	{
		height:auto !important;
		width:auto !important;
	}
	
	#MainContent
	{
	    padding-left:15px;
	}
	
/*----------------------------------------
slide show
----------------------------------------*/
.Slideshow_shell, .slider_container, .slide_image, .slide_caption, .slide_show, .Slideshow_Navbar
{
    clear:both;
    float:left !important;
    width:98% !important;
    position:relative !important;
    display:block; 
    margin:0px;
    padding:1%;
    background-color:#fff;
    color:#333;
    top:0px !important;
}

.Slideshow_shell
{
   border:solid 1px #ccc !important;   
}

.slide_caption h2, .slide_caption p
{
    padding:5px;
    font-size:.8em;    
}

	
	
/*----------------------------------------
FOOTER FIXES
----------------------------------------*/
    #divFooter .logo 
	{
	    margin:5px;
	    margin-left:18px;
	    
	    padding:0% !important;
	    float:none;
	    border-right:0px solid #ccc;
    }
    
#divFooter .disclaimer
{
    float:none;
    margin:1%;
    margin-top:0%;
    padding:0%;
    padding-top:4px;
    padding-left:1%;
    width:95%;
    border-left:solid 0px #bcbcbc;     
}

#divFooter .accessibility h2
{
    font-size:1em;
    width:95%;
    margin-bottom:2px;
}

#divFooter .accessibility ul
{
    font-size:1em;
    width:95%;
    margin:1%;
    margin-top:4px;
}


#divFooter .accessibility li
{
    font-size:1em;
    width:95%;
    margin:1%;
    margin-top:4px;
}



 /*---------------------------
    Mobile Social Media tabs
   -----------------------------*/
.mobile_social
{
    list-style-type:none;
}


 /*---------------------------
    T4 divContainers
   -----------------------------*/
   
   #divContentContainer1, #divContentContainer2, #divContentContainer3,
   #divContentContainer4, #divContentContainer5, #divContentContainer6,
   #divContentContainer7, #divContentContainer8, #divContentContainer9,
   #divContentContainer10, #divContentContainer11, #divContentContainer12
   {
        float:none;
        clear:both;
        display:block;
        width:100% !important;
        min-height:50px !important;
        margin:0px !important;
        padding:0px !important;
        
    }
    
    #divContentContainer1 div, #divContentContainer2 div, #divContentContainer3 div,
    #divContentContainer4 div, #divContentContainer5 div, #divContentContainer6 div,
    #divContentContainer7 div, #divContentContainer8 div, #divContentContainer9 div,
    #divContentContainer10 div, #divContentContainer11 div, #divContentContainer12 div
   {
       margin:0px;
       padding:0px;
       margin-bottom:1px;
   }
    
    
    /*-------------------------------------
    parallax fixes
------------------------------------------------*/

.parallax_group.emptycontent
{
    display:none !important;
}

.parallax_group.hascontent
{
    display:block;
}

.parallax_group
{
    position:relative !important;
    margin:0px !important;
    padding:0px !important;
    height:auto;
}
.parallax
{
    
    overflow-x:visible;
    overflow-y:visible;
    
}

.parallax_image 
{
  position: absolute;
  top:0;
  left:0;
  width:100%;
  z-index:100;
  margin:0px;
  padding:0px;  
  background-color:#f7f7f7;
  color:#000;
  transform-origin-x: 100%;
  transform: translateZ(0px) scale(1); 
}

.parallax_image div
{
  position:absolute;
  top:0px;
  left:0px;
  width:100% !important;
  margin:0px !important;
 
}

.parallax_image_bg
{
    margin:0px;
    padding:0px;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;    
    height:290px;
    background-size:100% 100%;
}

.parallax_content 
{
  position:relative !important;
  margin:3% !important;
  padding:2% !important;
  width:90%;
  height:auto;
  min-height:250px;
  overflow-y:scroll;
  background-color:rgba(255,255,255,.98);
  color:#222;
  z-index:3000;
  box-shadow:1px 1px 3px rgba(0,0,0,.6);
}
    

    
}


@media screen and (min-width:0px) and (max-width:499px) {

    /*---------------------------------------------------------------
DEFAULT MOBILE STYLES FOR NAVIGATION AND GENERAL PAGE ELEMENTS
----------------------------------------------------------------*/
    .Show80Wide, .Show60Wide {
        width: 95%;
    }

    body {
        position: relative;
    }

    #BannerImage {
        display: none;
    }

    #CSUFTopLink, #CSUFLink_Search, #Tabs, #header_LowerScroll {
        display: none;
    }

    #mobile_header {
        display: block;
        height: 40px;
        position: fixed;
        top: 0px;
        left: 0px;
        color: #222;
        background-color: #f4f5f5;
        width: 100%;
        z-index: 12000;
        border-bottom: solid 1px #ccc;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f8f9+0,d7dee3+100,f5f7f9+100 */
        background: #f6f8f9; /* Old browsers */
        background: -moz-linear-gradient(top, #f6f8f9 0%, #d7dee3 100%, #f5f7f9 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #f6f8f9 0%,#d7dee3 100%,#f5f7f9 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #f6f8f9 0%,#d7dee3 100%,#f5f7f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
    }

        #mobile_header #btnMobileMenu {
            position: relative;
            background-image: none;
            border-radius: 4px;
            border: solid 1px transparent;
            cursor: pointer;
            display: block;
            float: left;
            font-size: 14px;
            height: 28px;
            width: 28px;
            background-color: transparent;
            color: #222;
            margin-bottom: 8px;
            margin-left: 10px;
            margin-right: 8px;
            margin-top: 5px;
            overflow-x: visible;
            overflow-y: visible;
            padding: 5px;
            text-align: center;
        }

            #mobile_header #btnMobileMenu:hover {
                border: solid 1px #aaa;
                border-top: solid 1px #cbcbcb;
                box-shadow: 0px 1px 0px rgba(0,0,0,.4);
                background-color: #f7f7f7;
                background: #f7f7f7;
                color: #333;
            }

    .menubar {
        display: block;
        float: left;
        width: 15px;
        height: 3px;
        margin-bottom: 3px;
        border-radius: 3px;
        background-color: #003366;
        background: #003366;
        color: #fff;
        transition: .25s ease-in-out;
    }

    #mobile_header #btnMobileMenu:active .menubar {
        background-color: #fff;
        color: inherit;
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0,0,0,0);
        border: 0;
        background-color: #002B54;
        color: #fff;
    }

    #btnMobileMenu:hover .menubar {
        background-color: #E17000;
        color: #222;
    }

    #btnMobileMenu.mobileon span:nth-child(2).menubar {
        top: 12px;
        left: 5px;
        position: absolute;
        background-color: #E17000;
        color: #000;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    #btnMobileMenu.mobileon span:nth-child(3).menubar {
        opacity: 0;
    }

    #btnMobileMenu.mobileon span:nth-child(4).menubar {
        top: 12px;
        left: 5px;
        position: absolute;
        background-color: #E17000;
        color: #000;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #mobile_search {
        position: fixed;
        top: 0px;
        left: 50px;
        height: 40px;
        box-sizing: border-box;
        border-right: #aaa;
        z-index: 300000;
    }

        #mobile_search label {
            position: absolute;
            top: -100px;
            left: 100000px;
        }

        #mobile_search input[type='text'] {
            border: solid 1px #002B54;
            font-size: .95em;
            height: 18px;
            padding: 5px;
            font-weight: normal;
            width: 170px;
            margin-top: 5px;
            float: right;
        }

    #btnSearchMobile {
        border-radius: 4px;
        border: solid 1px rgba(22,55,88, .5);
        cursor: pointer;
        display: block;
        float: right;
        font-size: 14px;
        height: 30px;
        width: 60px;
        margin-bottom: 8px;
        margin-left: 8px;
        margin-top: 5px;
        padding: 9px;
        padding-top: 5px;
        text-align: center;
        background: #093864;
        background-color: #093864;
        color: #f7f7f7;
        background: #0057ab; /* Old browsers */
        background: -moz-linear-gradient(top, #0057ab 0%, #093864 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #0057ab 0%,#093864 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #0057ab 0%,#093864 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0057ab', endColorstr='#093864',GradientType=0 ); /* IE6-9 */
    }

    #mobile_csuf {
        position: fixed;
        right: 0px;
        top: 0px;
        width: 50px;
        height: 40px;
        z-index: 300000;
        background-color: #003366;
        color: #f7f7f7;
        box-sizing: border-box;
        border-left: solid 1px #f7f7f7;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0f3c73+0,002b54+100 */
        background: #0f3c73; /* Old browsers */
        background: -moz-linear-gradient(top, #0f3c73 0%, #002b54 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #0f3c73 0%,#002b54 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #0f3c73 0%,#002b54 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0f3c73', endColorstr='#002b54',GradientType=0 ); /* IE6-9 */
    }

        #mobile_csuf a {
            display: block;
            background: #002b54;
            background-color: inherit;
            color: #fff;
            font-size: .7em;
            font-family: Arial;
            width: auto;
            margin: auto;
            margin-top: 15px;
            text-align: center;
        }

            #mobile_csuf a:hover {
                text-shadow: 1px 1px 3px rgba(200,200,200,.5);
            }

    #mobile_header_menu {
        display: block;
        position: fixed;
        border-right: solid 1px #9DBED8;
        border-bottom: solid 1px #9DBED8;
        box-shadow: 1px 2px 8px rgba(0,0,0,.8);
        top: 30px;
        left: -550px;
        height: 100%;
        padding: 5px;
        padding-top: 15px;
        width: 100%;
        z-index: 11000;
        max-width: 350px;
        overflow-y: auto;
        color: #fff;
        background: #1D508A;
        transition: all 0.8s ease;
    }

        #mobile_header_menu ul {
            list-style-type: none;
            margin: 0px;
        }

        #mobile_header_menu li {
            border-bottom: solid 1px #1c4464;
            border-top: solid 1px #0059ac;
            padding-top: 2px;
            padding-bottom: 8px;
            margin-top: 0px;
            margin-bottom: 0px;
            background-color: transparent;
            color: #fff;
        }

            #mobile_header_menu li:first-child {
                border-top: 0px;
            }

            #mobile_header_menu li:last-child {
                border-bottom: 0px;
            }

        #mobile_header_menu.mobileopen {
            left: 0px;
            transition: all 0.8s ease;
        }

        #mobile_header_menu.mobileclosed {
            left: -500px;
            transition: all 0.8s ease;
        }

        #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
        #mobile_header_menu p, #mobile_header_menu li, #mobile_header_menu a {
            color: #f7f7f7;
            background: #1D508A;
        }

        #mobile_header_menu a {
            color: #f7f7f7;
            padding: 1%;
            padding-top: 6px;
            display: block;
            border-bottom-left-radius: 6px;
            border-bottom-right-radius: 6px;
            background: #1D508A;
        }

            #mobile_header_menu a:hover,
            #mobile_header_menu a:active {
                color: #f7f7f7;
                background: #22517B;
            }

        #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
        #mobile_header_menu p, #mobile_header_menu li {
        }

        #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3,
        #mobile_header_menu p {
            margin-bottom: 5px;
        }

        #mobile_header_menu h1, #mobile_header_menu h2, #mobile_header_menu h3 {
            line-height: normal;
            padding-bottom: 4px;
            margin-bottom: 1%;
        }

        #mobile_header_menu .sectionnav {
            margin: 0px;
            padding: 0px;
        }

            #mobile_header_menu .sectionnav ul:first-child {
                margin: 1em;
                margin-top: 0px;
                margin-bottom: 20px;
                padding: 0px;
                border-top: solid 2px #f7f7f7;
            }

            #mobile_header_menu .sectionnav li {
                margin: 0px;
                padding: 0px;
            }

            #mobile_header_menu .sectionnav button {
                background-color: #f7f7f7;
                color: #002B54;
                height: 30px;
                width: 30px;
                padding: 8px !important;
                padding-bottom: 15px !important;
                margin-top: 15px !important;
            }

        #mobile_header_menu .mobile_division {
            margin-top: 10px;
        }

    .mobile_division a {
        font-style: italic;
        font-size: .85em;
    }

    #mobile_header_menu .mobile_social {
        min-height: 28px;
        float: left;
        width: 100%;
        margin: 0px;
        margin-top: 8px;
        margin-bottom: 8px;
        padding: 0px;
        border: 0px;
        background: #efefef;
        color: #222;
        border-left: solid 6px #E17000;
        border-right: solid 6px #E17000;
        box-sizing: border-box;
    }

        #mobile_header_menu .mobile_social li {
            float: left;
            border: 0px;
            padding: 2px;
            padding-left: 5px;
            margin: 0px;
            background: inherit;
            color: inherit;
        }

            #mobile_header_menu .mobile_social li a {
                background: inherit;
                color: inherit;
                margin: 0px;
                padding: 0px;
            }


    .mobile_sitetabs button {
        float: right;
        margin-top: 2px;
        margin-bottom: 2px;
        background-color: #f7f7f7;
        color: #002B54;
        height: 25px;
        width: 25px;
        border: solid 1px #f7f7f7;
        border-radius: 4px;
    }

    .mobileexpand {
        display: block;
        font-size: .85em;
        padding-left: 10px;
    }

        .mobileexpand ul, .mobileexpand ol {
            margin: 8px;
            margin-top: 12px;
        }

        .mobileexpand img {
            max-width: 96%;
            height: auto;
            margin: 2%;
            padding: 0%;
        }


    .mobilecollapse {
        display: none;
        transition: all 0.8s ease;
    }


    #header {
        padding: 0%;
        margin-top: 50px;
    }

    #search {
        display: none;
        float: none;
        clear: both;
        position: relative;
    }

    #macronav {
        position: absolute;
        top: 8px;
        right: 5px;
        margin: 0%;
        padding: 0%;
    }

    #branding {
        padding-top: 30px !important;
    }

    #unit, #Tabs2Social, #breadcrumb {
        display: none;
    }


    #sitename {
        padding: 0%;
        margin: 0%;
        font-size: .7em;
    }

    #sidebar1, #sidebar2 {
        clear: both;
        width: 95%;
        float: none;
        border-bottom: solid 1px #ccc;
        margin-bottom: 30px;
        box-sizing: border-box;
    }


        #sidebar1 #MainMenu, #sidebar2 #MainMenu {
            display: none;
        }

    #sidebar1 {
        display: none;
    }

    #mobile_sidebar1 {
        background-image: none;
        max-width: 95%;
        padding: 10px;
        margin: 5px;
        background-color: #fff;
        color: #222;
        border: solid 1px #ccc;
    }

        #mobile_sidebar1 .sideblock h1, #mobile_sidebar1 .sideblock h2, #mobile_sidebar1 .sideblock h3,
        #mobile_sidebar1 .sideblock p, #mobile_sidebar1 .sideblock li, #mobile_sidebar1 .sideblock a {
            background-color: #fff;
            color: #222;
        }

        #mobile_sidebar1 .sideblock img {
            float: left;
            width: auto;
            height: auto;
            clear: both;
        }

    .Show80Wide, .Show60Wide {
        width: 100%;
    }
    /*--- Section Navigation --- */
    .sectionnav {
        margin: 0px;
        padding: 0px;
        padding-top: .8em;
    }

        .sectionnav ul {
            list-style-type: none;
            margin: 0px;
            margin-left: 5px;
        }

        .sectionnav li {
            padding: .5%;
            border-bottom: solid 1px #3073AD;
            border-top: solid 1px #C3DCF6;
        }

            .sectionnav li:first-child {
                border-top: 0px;
            }

            .sectionnav li:last-child {
                border-bottom: 0px;
            }

        .sectionnav a {
            display: block;
            text-decoration: none;
            font-size: 1em;
            padding-left: 1%;
        }

        .sectionnav h3 {
            font-family: 'open_sansbold';
            font-weight: 800;
            text-transform: uppercase;
            font-size: 1em;
            line-height: 1.8em;
            color: #686868;
            margin: 0px;
            padding-left: 5px;
        }

    /*---------- VERTICAL NAV -----------------------*/

    #VerticalNavMenu {
        position: fixed;
        top: 35px;
        left: -97%;
        width: 93%;
        height: 100%;
        background-color: #f7f7f7;
        color: #222;
        z-index: 500;
        transition: left .6s;
    }

    #MobileVertNavSlider {
        display: block;
        position: fixed;
        height: 70%;
        left: 0px;
        padding: 3px;
        padding-top: 65%;
        width: 6px;
        background-color: #1D508A;
        color: #fdfdfd;
        z-index: 515;
        text-align: center;
        font-size: .6em;
        transition: all .6s;
    }

    .hideleft {
        left: 0px;
        text-align: right;
    }

    #VerticalNavMenu.hideleft {
        left: -100%;
        text-align: left;
    }

    #VerticalNavMenu.showright {
        left: 0px;
    }

    #MobileVertNavSlider.showright {
        left: 92% !important;
        width: 30px;
        text-align: left;
    }

    #VerticalNavMenu a {
        background-color: #474747;
        color: #ebebeb;
    }

    #VerticalNavMenu button {
        color: #f7f7f7;
    }

    #VerticalNavMenu ul li ul {
        background-color: #f7f7f7;
        color: #222;
        border-bottom: solid 0px #121212;
        border-top: solid 0px #C2C2C2;
    }

        #VerticalNavMenu ul li ul li {
            background-color: #f7f7f7;
            color: #222;
            border-bottom: solid 1px #121212;
            border-top: solid 1px #C2C2C2;
        }

    #VerticalNavMenu li {
        border-bottom: solid 1px #121212;
        border-top: solid 1px #C2C2C2;
    }

    #centercontent {
        padding-top: 5px;
    }




    /* --- CSUF CLASSES FIXES --- */
    .CalendarBlock1, .CalendarBlock2,
    .featureBlock1, .featureBlock2, .featureBlock3 {
        width: 100%;
        float: none;
        clear: both;
        margin: 1%;
        box-sizing: border-box;
    }

    .divA, .divB, .divC, .divD, .divE, .divF, .divG, .divH,
    .divI, .divJ, .divK, .divL, .divM, .divN, .divO, .divP,
    .divQ, .divR, .divS, .divT, .divU, .divV, .divW, .divX,
    .divY, .divZ {
        width: 98% !important;
        display: block !important;
        clear: both !important;
        float: left !important;
        margin: auto;
        padding: 0%;
        box-sizing: border-box;
    }

    img.linkicon {
        height: auto !important;
        width: auto !important;
    }

    #MainContent {
        padding: 1%;
    }

    /*----------------------------------------
slide show
----------------------------------------*/
    .Slideshow_shell, .slider_container, .slider_top_container, .slide_image, .slide_caption, .slide_show, .Slideshow_Navbar {
        clear: both;
        width: 100% !important;
        position: relative !important;
        display: block;
        margin: 0px;
        padding: 1%;
        background-color: #fff;
        color: #333;
        top: 0px !important;
        box-sizing: border-box;
    }

    .slide_image, .slide_video {
        padding: 0px;
    }

    .Slideshow_shell {
        border: solid 1px #ccc !important;
    }

    .slide_caption h2, .slide_caption p {
        padding: 5px;
        font-size: .8em;
    }


    .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .btnPrevNav,
    .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .btnNextNav {
        float: left;
        width: 20%;
        height: 18px;
        font-size: .7em;
        padding: 1px;
        margin-top: 10px;
        padding-top: 3px;
        background-color: #f7f7f7;
        background: #f7f7f7;
        color: #222;
        border: 0px;
        text-transform: capitalize;
        position: absolute;
        top: 0px;
    }

        .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .btnPrevNav:hover a,
        .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .btnNextNav:hover a {
            text-decoration: none;
        }

    .Slideshow_Shell.slidelayout_pauseplay.slidearrow_downcenter .slideshowcontrols .btnPrevNav {
        left: 8%;
    }

    .Slideshow_Shell.slidelayout_pauseplay.slidearrow_downcenter .slideshowcontrols .btnNextNav {
        right: 8%;
        left: auto;
    }

    .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .Slideshow_Navbar {
        text-align: center;
        display: block;
        margin: auto;
        margin-top: 0px;
        width: initial;
        float: left;
        margin-left: 36%;
        width:125px !important
    }

    .Slideshow_Shell.slidelayout_pauseplay .slideshowcontrols .Slideshow_Navbar button:first-child {
      width:100px;      
        }

/*------------------------------------------
FEATURE BLOCKS
-----------------------------------------------*/


.featureBlock5_white
{
    top:2%;
    
}
	
	
/*----------------------------------------
FOOTER FIXES
----------------------------------------*/
    #divFooter .logo 
	{
	    margin:5px;
	    margin-left:18px;
	    
	    padding:0% !important;
	    float:none;
	    border-right:0px solid #ccc;
    }
    
#divFooter .disclaimer
{
    float:none;
    margin:1%;
    margin-top:0%;
    padding:0%;
    padding-top:4px;
    padding-left:1%;
    width:95%;
    border-left:solid 0px #bcbcbc;     
}

#divFooter .accessibility h2
{
    font-size:1em;
    width:95%;
    margin-bottom:2px;
}

#divFooter .accessibility ul
{
    font-size:1em;
    width:95%;
    margin:1%;
    margin-top:4px;
}


#divFooter .accessibility li
{
    font-size:1em;
    width:95%;
    margin:1%;
    margin-top:4px;
}



 /*---------------------------
    Mobile Social Media tabs
   -----------------------------*/
.mobile_social
{
    list-style-type:none;
}


 /*---------------------------
    T4 divContainers
   -----------------------------*/
   
   #divContentContainer1, #divContentContainer2, #divContentContainer3,
   #divContentContainer4, #divContentContainer5, #divContentContainer6,
   #divContentContainer7, #divContentContainer8, #divContentContainer9,
   #divContentContainer10, #divContentContainer11, #divContentContainer12
   {
        float:none;
        clear:both;
        display:block;
        width:100% !important;
        min-height:50px !important;
        margin:0px !important;
        padding:0px !important;
        
    }
    
    #divContentContainer1 div, #divContentContainer2 div, #divContentContainer3 div,
    #divContentContainer4 div, #divContentContainer5 div, #divContentContainer6 div,
    #divContentContainer7 div, #divContentContainer8 div, #divContentContainer9 div,
    #divContentContainer10 div, #divContentContainer11 div, #divContentContainer12 div
   {
       margin:0px;
       padding:0px;
       margin-bottom:1px;
   }
    
    
    /*-------------------------------------
    parallax fixes
------------------------------------------------*/

.parallax_group.emptycontent
{
    display:none !important;
}

.parallax_group.hascontent
{
    display:block;
}

.parallax_group
{
    position:relative !important;
    margin:0px !important;
    padding:0px !important;
    height:auto;
}
.parallax
{
    
    overflow-x:visible;
    overflow-y:visible;
    
}

.parallax_image 
{
  position: absolute;
  top:0;
  left:0;
  width:100%;
  z-index:100;
  margin:0px;
  padding:0px;  
  background-color:#f7f7f7;
  color:#000;
  transform-origin-x: 100%;
  transform: translateZ(0px) scale(1); 
}

.parallax_image div
{
  position:absolute;
  top:0px;
  left:0px;
  width:100% !important;
  margin:0px !important;
 
}

.parallax_image_bg
{
    margin:0px;
    padding:0px;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;    
    height:290px;
    background-size:100% 100%;
}

.parallax_content 
{
  position:relative !important;
  margin:3% !important;
  padding:2% !important;
  width:90%;
  height:auto;
  min-height:250px;
  overflow-y:scroll;
  background-color:rgba(255,255,255,.98);
  color:#222;
  z-index:3000;
  box-shadow:1px 1px 3px rgba(0,0,0,.6);
}
    

}

@media screen and (min-width:0px) and (max-width:330px)
{
    
    /*---------------------------------------------
        iPhone 5 / older smart phone fixes
    -------------------------------------------------------*/
    #mobile_header_menu
  {
      display:block;
      position:fixed;
      border-right:solid 1px #9DBED8;
      border-bottom:solid 1px #9DBED8;
      box-shadow:1px 2px 8px rgba(0,0,0,.8);
      top:30px;
      left:-550px;  
      height:100%;
      padding:5px;
      padding-top:15px;
      width:100%;  
      max-width:310px;
      overflow-y:auto;
      color:#fff;
      background:#1D508A;
     
      z-index:10000;
      transition: all 0.8s ease;
  }
  
   #mobile_search
  {
      position:fixed;
      top:0px;
      left:50px;
      height:40px;
      box-sizing:border-box;
      border-right:#aaa;
      z-index:300000;
  }
  
  #mobile_search label
  {
      position:absolute;
      top:-100px;
      left:100000px;
  }
  
  #mobile_search input[type='text']
  {
       border: solid 1px #002B54;
       font-size:.95em;
       height:18px;
       padding:5px;
       font-weight:normal;
       width:130px;
       margin-top:5px;
       float:right;
  }
  
  #btnSearchMobile
  {
       border-radius: 4px;
      border: solid 1px rgba(22,55,88, .5);
  cursor: pointer;
  display: block;
  float: right;
  font-size: 14px;
  height: 30px;
  width: 60px;
  margin-bottom: 8px;
  margin-left: 8px;
  margin-top: 5px;
  padding: 9px;
  padding-top: 5px;
  text-align: center;
  background:#093864;
  background-color:#093864;
  color:#f7f7f7;     
background: #0057ab; /* Old browsers */
background: -moz-linear-gradient(top,  #0057ab 0%, #093864 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0057ab 0%,#093864 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0057ab 0%,#093864 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0057ab', endColorstr='#093864',GradientType=0 ); /* IE6-9 */

  
  }
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                   END OF BASE MOBILE STYLES                                         +
+     IF YOU WANT TO OVER RIDE THESE STYLES PLEASE DO IT AT THE VERY BOTTOM OF THIS   +
+     CHANGES TO THESE STYLES WILL BE COPIED OVER THE ENTIRE SECTION                  +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/