/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                    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, .btnNavMenu a:link, .btnNavMenu a:visited
{
    background-image:url("../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:1600px)
{
     /*----------------------------------------------
     STANDARD PC LARGE SCREEN 
    --------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:12% !important;
        padding-right:12% !important;
        width:76% !important;
    }
    
    .phone, .tablet
    {
        display:none;
    }    

}



@media screen and (min-width:1400px) and (max-width:1599px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN 
    --------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:10% !important;
        padding-right:10% !important;
         width:80% !important;
    }
    
     .phone, .tablet
    {
        display:none;
    }    
}



@media screen and (min-width:1200px) and (max-width:1399px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN FOR COMPUTER LABS
    --------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:3% !important;
        padding-right:3% !important;
        width:94% !important;
    }
    
    .phone, .tablet
    {
        display:none;
    }    
    
  
}

@media screen and (min-width:1000px) and (max-width:1199px)
{
     /*----------------------------------------------
     STANDARD PC SCREEN / iPad in LAND SCAPE
    --------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:0% !important;
        padding-right:0% !important;
        width:100% !important;
    }
   
   #lnkComputerAva
   {
       display:block;
   }
   
    .phone
    {
        display:none;
    }  
      
    
}

@media screen and (min-width:800px)  and (max-width:999px)
{
     /*-------------------------------------------
     STANDARD PC SCREEN 
    ---------------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:0%;
        padding-right:0%;
        width:100% !important;
    }
     #frmComputerAva
   {
     height:300px;
   }
   
   #lnkComputerAva
   {
       display:block;
   }
   
   .phone, .desktop
    {
        display:none;
    }    
    
     .tablet
    {
        border:0px !important;
    } 
   
}



@media screen and (min-width:700px)  and (max-width:799px)
{
     /*-------------------------------------------
     iPad Portrait PC SCREEN 
    ---------------------------------------------- */
    
    .wrap
    {
        margin:0%;
        padding-left:0%;
        padding-right:0%;
        width:100% !important;
    }
     #frmComputerAva
   {
     height:300px;
   }
   
   #lnkComputerAva
   {
       display:block;
   }
   
   .phone, .desktop
    {
        display:none;
    }    
    
    .tablet
    {
        border:0px !important;
    }
    
 
}



@media screen and (min-width:500px)  and (max-width:699px)
{
    .wrap
    {
        margin:0% !important;
        padding-left:0% !important;
        padding-right:0% !important;
        width:100% !important;
    }
    
    #frmComputerAva
   {
     height:200px;
   }
   
   #lnkComputerAva
   {
       display:block;
   }

    .tablet, .desktop
    {
        display:none;
    }  
    
    .phone
    {
        border:0px !important;
    }  
    
  
    
}


@media screen and (min-width:300px)  and (max-width:499px)
{
    .wrap
    {
        margin:0%;
        padding-left:0%;
        padding-right:0%;
        width:100%;
    }

 #frmComputerAva
   {
     height:300px;
   }
   
   #lnkComputerAva
   {
       display:block;
   }


    .tablet, .desktop
    {
        display:none;
    }    

}

@media screen and (min-width:0px)  and (max-width:299px)
{
    .wrap
    {
        margin:0%;
        padding-left:0%;
        padding-right:0%;
        width:100%;
    }
    
   
 #frmComputerAva
   {
     display:none;
   }
   
   #lnkComputerAva
   {
       display:block;
   }
   
   
    .tablet, .desktop
    {
        display:none;
    }    
}


@media screen and (min-width:0px) and (max-width:699px)
{
    /*---------------------------------------------------------------
DEFAULT MOBILE STYLES FOR NAVIGATION AND GENERAL PAGE ELEMENTS
----------------------------------------------------------------*/
  
  .Show100Wide
{
   width:97%; 
}

.Show80Wide
{
    width:97%;
}

.Show60Wide
{
    width:97%;
}
  
  #BannerImage
    {
        display:none;
    }
    .phone
    {
        border:0px !important;
    }  
   
      #wordmark
    {
        float:none;
        position:relative;
    }
    
    #header
    {
        padding:0%;
    }
    
    #search
    {
        float:none;
        clear:both;
       position:relative;
    }
    #macronav
    {
       position:absolute;
       top:8px;
       right:5px;
        margin:0%;
        padding:0%;
    }
    
    #displayversion
    {
        display:none;
    }
    
    #sitename
    {
        padding:0%;
        margin:0%;
        padding-left:2%;
        font-size:1.2em;
    }
    
    
#breadcrumb
{
    display:none;
}
    
    .btnNavMenu
    {
        display:block;
    }
    
    #navMain
    {
        display:none;
    }
    
    #sitesubnav
    {
        display:none;
    }
    
    
    #sitenav
    {
		color:#fff !important;
        background-image:none !important;
        background-color:#003366 !important;
        margin:0% !important;
        padding:0% !important;
        width:100% !important;
         
    }
    
    #sitenav p
    {
        margin:0% !important;
    }
    
    .navbar,  #sitesubnav 
    {
       float:none;
       background-image:none !important; 
       padding-top:0%;
       border:0px;
       box-shadow:none;
    }
    
    #sitesubnav
    {
        border-top:solid 2px #fafafa;
        background-color:#336699 !important;
    }
    
    .navbar ul, #sitesubnav  ul
    {
        display:block;
		float:none;
		padding-left:0;
		color:#fff;
		margin-top:0% !important; 
		margin-bottom:0% !important; 
		padding-top:0% !important;
	}
    
    .navbar ul li, #sitesubnav ul li
    {
        float:none;
        display:block;
        background:none;    
        border:0px;   
        box-shadow:none;
        padding-left:0%;
        margin-left:0%;
    }
    
    .navbar ul li a, #sitesubnav ul li a
    {
		display:block;
		float:none;
		padding:8px 12px;
		margin-right:1px;
		text-decoration:none;
		text-transform:uppercase;
		color:#fff;
		background-image:none;
		background:url("../images/CampusCSS/bg-navbar-tab.pngx") top transparent;
    }
				
	.navbar ul li.last a, #sitesubnav ul li.last a 
	{
	    border-right:none;
	}
	
	#sitesubnav ul li:hover
	{
	    background:none;
	    border:0px;
	}
    
    .navbar ul li a:focus, .navbar ul li a:hover, #sitesubnav ul li a:focus, #sitesubnav ul li a:hover
    {
	    text-decoration:underline;
		color:#666;
		background-color:#fff;
		background-image:none;
	}	
	
	#divFolderNav
	{
	    display:block;
	}
	
	#divFolderNav .btnNavMenu
	{
	    background-color:#555;
		color:#fff;
	    padding-top:0px;
	    padding-bottom:0px;
	}
	
	.btnNavMenu a, .btnNavMenu a:link, .btnNavMenu a:visited
	{
		color:#fff !important;
		background-color:#555;
		background:#555;
	}
	
	#divFolderNav .sectionnav li
	{
	    border:0px;
	}
	
	
    #sidebar1, #sidebar2
    {
        clear:both;
        width:100% !important;
        float:none;
        background-color:#fafafa;
        border-bottom:solid 1px #333;
    }
    
    #sidebar1 .sidebarfade, #sidebar2 .sidebarfade
    {
        display:none;
    }
    
    #sidebar1 #MainMenu, #sidebar2 #MainMenu 
    {
        display:none;
    }
    
    #maincontent #divA, #maincontent #divB, #maincontent #divC, 
    #maincontent #divD, #maincontent #divE, #maincontent #divF, 
    #maincontent #divG, #maincontent #divH
    {
        margin:0% !important;
        margin-bottom:2% !important;
        padding:1% !important;
        float:none !important;
        position:relative !important;
        width:100% !important;
        border:0px !important;
        border-bottom:solid 0px #cdcdcd !important;  
        clear:both !important;
        height:auto !important;
        background-color:#fff;
        color:#000;
        text-align:left !important;
       
    }
    
    #maincontent #divA img, #maincontent #divB img, #maincontent #divC img, 
    #maincontent #divD img, #maincontent #divE img, #maincontent #divF img, 
    #maincontent #divG img, #maincontent #divH img
    {
        display:none;
    }
    
    #maincontent .ShowImage
    {
        display:block !important;  
        clear:none !important;
        float:left !important;
        margin:3% !important;
        width:50%;
        height:auto;
    }
    
    
    #maincontent p
    {
        float:none !important;
        margin:0% !important;
        margin-bottom:1% !important;
        padding:1% !important;
        line-height:normal !important;
        font-size:1em !important;
        text-align:left;
    }
    
    #maincontent h2
    {
        border:0px;
        text-align:left;
        margin:0% !important;
        margin-bottom:1% !important;
    }
    
    #navfooter
    {
        height:auto;
        padding-bottom:1% !important;
    }
    
    
    #navfooter div
    {
        height:auto;
        clear:both;
        float:none;
        width:90%;
        padding-bottom:1%;
    }
    
    #navfooter img
    { display:none;
      padding:0%;
      margin:0%;
    }
   
    #navfooter h2
    {   border:0px;
        text-align:left;
        border-bottom:solid 0px #fff;
        color:#ff6600;
        font-size:1em;
        margin-bottom:0%;
        margin-top:1%;
        padding:1%;
        padding-left:3%;
        font-weight:bold;
        font-family:Helvetica;
    }
    
    #navfooter a
    {
        color:#fff;
        display:block;
        width:100%;
        padding:1%;
    }
    
    #navfooter li 
    {
	    padding:0%;
	    margin:0%;
	    list-style: none;
	    font-size: .8em;
	    margin-bottom:.4% !important;
	}
	
	#footer .logo 
	{
	 margin:3%;
	 margin-top:0%;
	 margin-bottom:0%;
	 padding:0%;
	 float:none;
	border-right:0px solid #ccc;}


}



@media screen and (min-width:0px) and (max-width:450px)
{
    
    #BannerImage
    {
        display:none;
    }
    /*---------------------------------------------------------------
    FIX A-Z LINK ON PHONES
    ----------------------------------------------------------------*/
    #macronav
    {
       position:absolute;
       top:38px;
       right:5px;
        margin:0%;
        padding:0%;
    }

}
@media screen and (min-width:500px) and (max-width:699px)
{
    /*---------------------------------------------------------------
    RESET MOBILE STYLES FOR BELOW PAGE FOLD LINKS
    ----------------------------------------------------------------*/
    #navfooter
    {
        min-height:500px !important;
        clear:both !important;    
        
    }
    
    
     #navfooter li 
    {
        float:left;
        width:32%;
    }

}


/*-------------------------------------------------------------------------------
SLIDESHOW LAYOUT ADJUSTMENTS
----------------------------------------------------------------------------------*/
@media screen and (min-width:1200px)  and (max-width:2800px)
{
   /*----------------------------------------------------------
    TABLETS TO SMALL SCREEN DESKTOPS
    ------------------------------------------------------------*/
    .CaptionBoxLeft .SlideShowPicture, .CaptionBoxRight .SlideShowPicture
    {
        float:left;
        width:67%;
        text-align:center;
        padding-left:.75% !important;
         padding-right:.75% !important; 
    }
 
 .CaptionBoxTop .SlideShowCaptions, .CaptionBoxBottom .SlideShowCaptions
{
    float:left;
    margin-bottom:0%;
    width:96%;
    padding:1%;
    margin:0%;
      font-size:.75em;
    
}

.CaptionBoxTop .SlideShowCaptions
{
    border-top:0px !important;
    border-bottom-right-radius:38px;
}

.CaptionBoxBottom .SlideShowCaptions
{
    border-left:0px !important;
    border-bottom-right-radius:38px;
    margin-bottom:1%;
    margin-top:0%;
}

.CaptionBoxTop .SlideShowPicture, .CaptionBoxBottom .SlideShowPicture
{
    float:left;
    width:99%;
    height:auto;
}

   
.CaptionBoxLeft .SlideShowCaptions, .CaptionBoxRight .SlideShowCaptions 
{
     float:left;
   width:27%;
   margin:0%;
    padding:1.25%;
   padding-top:1%;  
     border-top:0px;
      font-size:.75em;
       background-color:rgba(255,255,255,.8);  
  
} 
.CaptionBoxLeft .SlideShowCaptions 
{
   
  border-bottom-right-radius:38px;
}

.CaptionBoxRight .SlideShowCaptions 
{
   
   border-bottom-left-radius:38px;
   border-bottom-right-radius:38px;
   
  
}


#slideshow
{
   float:left;
    width:70% !important;
}
    

 }

@media screen and (min-width:1000px)  and (max-width:1199px)
{
   /*----------------------------------------------------------
    TABLETS TO SMALL SCREEN DESKTOPS
    ------------------------------------------------------------*/
  
   .CaptionBoxTop .SlideShowCaptions, .CaptionBoxBottom .SlideShowCaptions
{
    float:left;
    margin-bottom:0%;
    width:96%;
    padding:1%;
    margin:0%;  
    font-size:.75em;    
}

.CaptionBoxTop .SlideShowCaptions
{
    border-top:0px !important;
    border-bottom-right-radius:38px;
}
.CaptionBoxBottom .SlideShowCaptions
{
    border-left:0px !important;
    border-bottom-right-radius:38px;
    margin-bottom:1%;
    margin-top:0%;
}

.CaptionBoxTop .SlideShowPicture, .CaptionBoxBottom .SlideShowPicture
{
    float:left;
    width:99%;
    height:auto;
}

  
    .CaptionBoxLeft .SlideShowPicture, .CaptionBoxRight .SlideShowPicture
    {
        float:left;
        width:68%;
        text-align:center;
        padding-left:1% !important;
         padding-right:1% !important; 
    }
    
    
.CaptionBoxLeft .SlideShowCaptions, .CaptionBoxRight .SlideShowCaptions 
{
     float:left;
   width:26%;
   margin:0%;
    padding:1.25%;
   padding-top:1%;  
     border-top:0px;
      font-size:.75em;
       background-color:rgba(255,255,255,.8);  
       border-top:0px !important;
  
} 
.CaptionBoxLeft .SlideShowCaptions 
{
   
  border-bottom-right-radius:38px;
}

.CaptionBoxRight .SlideShowCaptions 
{
   
   border-bottom-left-radius:38px;
   border-bottom-right-radius:38px;
   
 }

#slideshow
{
   float:left;
    width:100% !important;
}
    
#divSlideShowList, #divSlideShowList li
{
    display:none !important;
    width:0%;
    padding:0%;
}
 }
 

@media screen and (min-width:700px)  and (max-width:999px)
{
   /*----------------------------------------------------------
    TABLETS TO SMALL SCREEN DESKTOPS
    ------------------------------------------------------------*/
     .CaptionBoxTop .SlideShowCaptions, .CaptionBoxBottom .SlideShowCaptions
{
    float:left;
    margin-bottom:0%;
    width:96%;
    padding:1%;
    margin:0%;
    font-size:.75em;
}

.CaptionBoxTop .SlideShowCaptions
{
    border-top:0px !important;
    border-bottom-right-radius:38px;
}
.CaptionBoxBottom .SlideShowCaptions
{
    border-left:0px !important;
    border-bottom-right-radius:38px;
    margin-bottom:1.25%;
    margin-top:0%;
}
.CaptionBoxTop .SlideShowPicture, .CaptionBoxBottom .SlideShowPicture
{
    float:left;
    width:99%;
    height:auto;
}
.CaptionBoxLeft .SlideShowPicture, .CaptionBoxRight .SlideShowPicture
    {
        float:left;
        width:98%;
        text-align:center;
        padding-left:1% !important;
         padding-right:1% !important; 
    }
    
    
.CaptionBoxLeft .SlideShowCaptions, .CaptionBoxRight .SlideShowCaptions 
{
   float:left;
   width:97%;
   margin:0%;
   padding:1.25%;
   padding-top:1%;  
   font-size:.75em;
   background-color:rgba(255,255,255,.8);  
  border-radius:0px;     
  
} 
.CaptionBoxLeft .SlideShowCaptions 
{
}

.CaptionBoxRight .SlideShowCaptions 
{
  border:0px !important;
  
   
 }

#divSlideShowList, #divSlideShowList li
{
    display:none !important;
    width:0%;
    padding:0%;
}

#slideshow
{
   float:left;
    width:98% !important;
}
    
 
 }
 

@media screen and (min-width:700px)  and (max-width:999px)
{
   /*----------------------------------------------------------
    TABLETS TO SMALL SCREEN DESKTOPS
    ------------------------------------------------------------*/
    .CaptionBoxLeft .SlideShowPicture, .CaptionBoxRight .SlideShowPicture
    {
        float:left;
        width:96%;
        text-align:center;
        padding-left:1% !important;
         padding-right:1% !important; 
    }
    
    
    .CaptionBoxLeft .SlideShowCaptions , .CaptionBoxRight .SlideShowCaptions 
   {
   float:left;
   width:95%;
   margin:0%;
   padding-top:.5%;
   padding-left:.5%;
   padding-right:.5%;
   padding-bottom:2%;
   border-bottom-right-radius:38px;
   border-top:0px !important;
   border-left:0px !important;
    background-color:rgba(255,255,255,.8);
   
   
}

#divSlideShowList, #divSlideShowList li
{
    display:none !important;
    width:0%;
    padding:0%;
}

#slideshow
{
   float:left;
    width:98% !important;
}
    
   
    
}
 
 
@media screen and (min-width:100px)  and (max-width:699px)
{
   /*----------------------------------------------------------
    MOBILE DEVICES
    ------------------------------------------------------------*/
   
    /*------------------------------------------------------------
    SLIDE SHOW FIXES
    ---------------------------------------------------------*/
    #divSlideShowList
    {
    float:left;
    width:97%;
    height:auto;
    padding:.5%;
    }

    #slideshow, #SlideShowPrev, #SlideShowStartStop, #SlideShowNext, #slideshow_shadow
    {
    display:none;
    }



    
 }



/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                   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                  +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/