﻿@import url("Menu.css");
@import url("MediaPrint.css");

/* for print layout of homepage, may need to be edit */

/*remember to change #search and #page-content1 for the rotating images*/

@media screen {

/*-----------------------------------*/

/*HL - get rid of white border on redirect module*/

.DnnModule-CustomEasyDNNMobileRedirect .sectionnh {
border: none;
}
/*--------------------------------*/

FORM
{
    margin: 0;
    padding: 0;
}

.clear
{
    clear: both;
}

/*the following will fix spanish nav menu other than IE*/
div#usernav div.clear {
display:none;
}
/*------------------------*/

/* for #sharepost positioning */
#border_wrap
{
	position: relative;
	background: white;
	width: 1025px;
}

#sharepost {
	background: url(images/socialmediaBG.png) no-repeat top left;
	position: absolute;
	top:5px;
	z-index: 3;
	right:52px;
}


/* the body tag has an id called body. the #body control the main body tag */
body, #Body
{
   /*background:#d2b070 url('images/bg-bottom.png') repeat-x left bottom;*/
	font-family: Arial, Helvetica, sans-serif; /* Arial, Helvetica, sans-serif; "Trebuchet MS", Verdana, */
  
    min-width: 1024px;
    position: relative;
    *overflow-x: hidden;
    text-align: center;
    font-size: 100%;
    height: inherit !important;

}

/* to have image with no border */
img
{
    border: none;
}

/* margin, padding and text-align has no change, it can be taken out */
#bgcontainer
{
    /*background: url(images/bg-top.png) repeat-x top left;*/
    /*this so browser can scroll when resolution is as low as 800x600*/
    /*overflow:hidden;*/

}

/*text align does not do anything */
#wrapper
{
    width: 1024px;
    margin: 0 auto !important;
}

/* this is for the menu dropdown, z-index is for the actual menu that is dropping down */
#header
{
    width: 960px;
    height: 139px;
    margin: 0 auto;
    position: relative;
    z-index: 4;
}

/* for the main navigation menu */
#navigation
{
     float: right;
     width: 626px;  
     height: 104px;
     padding: 22px 0 0 0;
     
     margin-right: 20px;
}

/*for the font on the logins, etc. and the way it display */
#usernav
{
    width: 626px;
    text-align: right;
    font-family: Arial;
    font-size: 12px; /*0.75em;*/
    margin: 0 0 20px 0;
    /*width: auto will fix IE spanish tab location because of translation for IE */
    *width:auto !important;
}

#usernav #Links
{
	font-size: 8.5pt;
	color: #53718B;
}

#usernav #Links a
{
	font-size: 8.5pt;
	color: #53718B;
	margin: 0 2px;
	font-weight: normal;
}

#usernav #Links a:hover
{
	color: #FF0000;
}

/*for the font on the logins, etc. and the way it display */
#Members
{
    float: right;   
    /*put the login area into one line */
    /*width: 100px;*/
}

#Members a
{
	font-size: 8.5pt;
	color: #53718B;
}

#Members a:hover
{
	color: #FF0000;
}

/* the whole #socialnav can be taken away */

#socialnav
{
    padding: 0 0 14px;
    height: 35px;
}


/*for the social media layout */
.socialLabel
{
    font-size: 18px; /*1.125em;*/
    font-style: italic;
    font-weight: normal;
    margin: 0;
    padding: 0 3px 0 0;
    float: right;
    height: 35px;
    line-height: 35px;
    vertical-align: middle;
	font-family: Times New Roman;
	color: #53718B;
}

/* for the social media buttons */
.socialButtons
{
    padding: 0;
    float: right;
    height: 35px;
}

.socialButtons IMG
{
    padding: 3px 0 0 0;   
}

/*css for animation */
#beauty_bgs
{
	background: url('images/BeautyBG.png') no-repeat;
    z-index: 2;
    padding: 0;
    left: -90px;
}

#image_rotate_buttons {
/*position:relative;*/
z-index: 10;
margin-left: -80px;
top:-107px;
border:1px solid black;
background-color:silver;
width:180px;
text-align:left;
*margin-left: -1000px;
}


/*css for animation */
.fade_me {
background: url('/Portals/_default/Skins/OCFLFlex/OC_FLSites/clear.png')
}

#beauty_bgs .fade_me img {
	background-color: transparent !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */
  zoom: 1 !important;
}

/*position of the search menu*/
#innerBeauty
{
   /* padding-top: 100px; */
   margin-top:-216px;   
}

#tutorial {
	color: white;
    font-size: 0.8em;
    text-decoration: underline;
    margin-left: 84px;
    background: url('/Portals/_default/Skins/OCFLFlex/OC_FLSites/images/VideoCameraIcon.png');
    padding-right: 36px;
    background-position: 380px;
    background-repeat: no-repeat;
    display:block;
}

#tutorial:hover {
	color: #fdca67
}


/*for the white area content box, text-align:center is not needed*/
.page-content
{
    width: 1025px;
    background: #ffffff;
    margin: 0 auto;
    position: relative;
    top:8px;

}
/*for the weather, position:relative is not needed  */
.innerContent
{
    width: 920px;
    margin: 0 auto !important;
    text-align: left;
    position: relative;
}
/*for page content and weather */
#page-content1
{
    /*margin-top: 125px;*/
    
    z-index: 1;
    /*height: 160px;*/ 
}

#innerContent1
{
    z-index: -2;
}


#page-content2
{
	z-index: 5;
	/*padding-bottom: 1px; */
	/*margin-top: -1px;*/
	/*height: 176px;*/
}


#innerContent2
{
	z-index: 5;
}

/*for the stay connected and orange county now position */
#page-content3
{
	z-index: 0;
    padding-bottom: 160px;
    *padding-bottom:170px;
	display: none;
}



#innerContent3
{
    z-index: -2;
}

/*weather pane position, margin is not needed */
#innerContent1 .WeatherPane
{
    /*padding: 40px 0 0 0;*/
    padding: 0px;
}

#innerContent1 .WeatherPane .sectionnh
{
	margin-bottom: 0px;
}

/*stay connected pane adjustment*/

/*ul list for stay connected */
#stay-connected ul 
{
    margin: 5px 17px 0 42px;
    padding: 0 0 0 0;
}
/*list items for stay connected */
#stay-connected ul li 
{
    list-style:none;
    color:#0D3252;
    font-weight:bold;
    font-size: 14px; /*0.875em;*/
    font-family:Arial, Helvetica, sans-serif;
    line-height:27px;
    height:27px;
}


/*stay connected adjustment*/
#stay-connected ul li.CareerOpportunities
{
    background: url('images/briefcase-icon.png') no-repeat right;
}

#stay-connected ul li.SpecDistricts
{
    background: url('images/spec-dist-icon.png') no-repeat right;
}


#stay-connected ul li.BCC
{
    background: url('images/bcc-icon.png') no-repeat right; 
}


#stay-connected ul li.Contacts
{
    background: url('images/notebook-icon.png') no-repeat right;
}

#stay-connected ul li.Document
{
    background: url('images/StayConnectedDocArchive.png') no-repeat right;
    margin-right: 4px;
}

/*------------------------*/


/*added by Susan per Graciela 4.12.2012*/
#stay-connected ul li.OpenGovernment
{
    background: url('images/government-icon.png') no-repeat right;
}


/*stay connected adjustment*/
#stay-connected ul li.GetInvolved
{
    background: url('images/hands-icon.png') no-repeat right;
}


#stay-connected ul li.Meetings
{
    background: url('images/meeting-icon.png') no-repeat right;
}

#stay-connected ul li.Newsletter
{
    background: url('images/phone-icon.png') no-repeat right;
}

#stay-connected ul li.BudgetHearings
{
    background: url('images/dollar-icon.png') no-repeat right;
}


#stay-connected ul li a 
{
    color:#0D3252;
    font-weight:bold;
    font-size: 14px; /*0.875;*/
    font-family:Arial, Helvetica, sans-serif;
    text-decoration:none;
    position: relative;
    left: -35px;
    
    /*make icons clickable on below */
    display:block;
    /*width:300px;*/
    
 }

#stay-connected ul li a:hover
{
    text-decoration: underline;    
}

#stay-connected 
{
    float:left;
    background:url('images/StayConnected.Panel.png') no-repeat;
    margin-right: 3px;
    width:304px;
    /*height:293px;*/
}

#stay-connected .bottom
{
    /*margin: -4px 0 0 11px;*/
   
    text-align: center;
}

#stay-connected .bottom img
{
    margin: -9px 29px 0;

}

/*-----------------end of stay connected adjustment------------------------*/

/*oc now adjustment */

#oc-now h2 , #stay-connected h2
{
    color: #fff;
    font-size: 30px; /*1.875em;*/
    font-style: italic;
    font-weight: normal;
    margin: 6px 38px 0 30px;
    *margin-top: 5px;
    padding: 0;
    text-align: right;
    font-family: Times New Roman;
}

     
#oc-now UL
{
    margin: 10px 0 0;
    padding: 0;
}
       
#oc-now UL LI
{
    list-style: none;
    margin: 0 0 5px 0;
    padding: 0;  
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 12px; /*0.75em;*/
    line-height: 16px;
    margin-bottom: 11px;
}

#oc-now A
{
    text-decoration: underline;
    /*color: #53718B;*/
    color: #0D3252;
}

#oc-now A:hover
{
    text-decoration: none;
    color: #04467d;
}

#oc-now .Events .left
{
    width: 90px;
    float: left;
}

#oc-now IMG
{
    /*padding: 10px;*/
}

#oc-now .right
{
    width: 210px;
    float: left;
}

/*new stay connected*/
#stay-connected {
    background: none;
    border-right: 1px solid #0D3252;
    width: 300px;
    margin-right: 7px;
    }

#oc-now 
{
    float:left;
    width:612px;
    font-size: 12px;
}
    
#oc-now h2 {
    text-align: center;
    margin: 0px;
    }

#oc-now .News .right
{
    width: 200px;
    float: left;
}

#oc-now .News .left
{
    width: 90px;
    float: left;
}

#oc-now .News .left IMG
{
    padding: 10px;
}
    
#oc-now .News {height:auto !important;}

    
#oc-now .News h2, #oc-now .Events h2 {
    text-align: left;
    }
      
#oc-now .Events, #oc-now .News
{
    margin: 0px 10px 0 10px;
    float: left;
    padding: 0;
    width:96%;
 
    }
#oc-now .Events {    
	border-left: 1px dashed #0470b1;
    padding-left: 10px;  
    }
    
#oc-now img {
    /*padding: 10px 0px;*/
    }
    
.More {float: right; }
.Events .More {margin-right: 10px;}

/*------------------------*/


/*-------------------end of oc now adjustment-------------------------*/

/*footer adjustment */
#footer
{
    background: #CCCCCC;
    width: 1025px;
    height: 230px;
    position: relative;
    z-index: 2;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px; /*0.75em;*/
    text-align: center;
    padding: 0;
}

/*text inside footer */
#innerFooter
{
    padding: 40px 0 0 0;  
    width: 920px; 
    text-align: left;
    margin: 0 auto;

}

.footerCol
{
	float: left;
	width: 20%;
	margin: 0 0 10px 38px;
	padding: 0;			
}


.footerCol li
{
	list-style-type: none;
	font-size: 12px;
	margin-bottom: 10px;
}


.footerCol a
{
	color: #2F2FE5;
}

#footerBot
{
 clear: both;
 
 width: 100%;
}

/*copyright adjustment*/
#copyright
{
    width: 450px; 
    
}

#links
{
    float: right;
    text-align: right;
    width: 450px;
}

#links A:link
{
    color: #2F2FE5;
}

#links A:visited
{
    color: #8a4d8a;
}

.wraphoverhtml a:link
{
	color: #125E9C;
	font-weight:bold;
	font-size: .9em;			
}

/*-------------end of copyright adjustment------------------*/

}
