﻿/* Location: /App_/ROOT/PageFrame/StandardPartial/StyleSheet.css */
/* Description: Stylesheet used to define the main layout of
the website as well as common elements between the home page and interior pages */

/**** Import the global stylesheet to redefine HTML and add common fonts ****/
@import url(../StyleSheet.css);

.opHide,.printOnly{
display:none;
}

/*** Quote Area In Footer **********************************************************/
#didYouKnow { width: 290px; float: right; }
#didYouKnow p.quote 
{
	font-family: Georgia, "Times New Roman";
	font-size: 1.3em;
	line-height: 1.3em;
	font-style: italic;
	margin: 3px 0px 10px 0px;
}
#didYouKnow p.author {margin-top:-5px !important; color: #8ca5b4; }

table.standard {
border:1px solid #53778D;
border-collapse:collapse;
margin:0;
padding:0;
width:100%;
}
table.standard th{
background-color:#366988;
color:#FFFFFF;
font-weight:bold;
text-align:left;
}
table.standard th, table.standard td {
padding:7px 10px;
}

table.standard  tr.alternate {
background-color:#E0EEEF;
}
table.standard  table tr {
margin:0;
padding:0;
}
ul.ui-autocomplete li{
list-style-type:none;
}
.ui-autocomplete-loading { background: url(http://apps.opkansas.org/images/ajax-loader.gif) no-repeat right; }
ul, li{
text-align:left;
}
/* end formerly import op.css */

body { background: #fff; text-align: center; font-size:0.75em; /*12px;*/ line-height: 1.2em; }

/**** Common Classes ****************************************************/
.clear { clear: both; }
.left { float: left; }
.right { float: right; }

/**** Error Pane ********************************************************/
div.errorPane { margin: 0 0 10px 0; }
div.errorPane span, .error { color:#DF291F; font-weight:bold; }

/**** Set light blue font ***********************************************/
#quickLinks, #quickLinks a, #topNav, #topNav a, #didYouKnow {color: #c0d1dc;}

/*** Remove header and footer margins and list style ********************/
h1#headerLogo, #footer ul, #footer li, #header ul, #header li { margin: 0; padding:0; }
#footer ul, #footer li, #header ul, #header li { list-style-type: none; }

/**** Modal overlay color ***********************************************/
.modalOverlay, #modal_overlay { background-color: black; }

/**** Footnote **********************************************************/
.tinyText, .footnote { font-size:0.75em; /*8px;*/ }

/***** calendar *************************************/
.calendar .event 
{
	background: url(/App_/ROOT/PageFrame/StandardPartial/Images/CalendarMarker.gif) top left no-repeat;
	margin-bottom: 15px;
	padding-bottom: 5px;
	padding-top: 1px;
}
.calendar .event:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.calendar .event { zoom: 1; }
.calendar .viewAll,.calendar .details { margin-left: 60px; } 
.calendar .details {line-height: 1.2em;}
.calendar h3
{
	float: left;
	margin:0;
	padding:0;
	padding-top: 8px;
}
.calendar h3 .month, .calendar h3 .day { display: block; text-align: center; margin-left: 16px; }
.calendar h3 .month { font-size: .9em; color: #8c9b93; font-weight: bold; line-height: 1.4em; }
.calendar h3 .day { font-size: 1.6em; color: #7a847f;}
.calendar .details .location { color: #8c9b93; font-size: .9em; }

/***** faq homepage *********************************/
ul.faq { margin-top:0px; padding-top:0px; }
div#FaqTab .faq li { list-style-image: url(Content/GreenArrow.gif); padding-bottom:10px; }

/****** Header Area **********************************/
#container, #header, h1#headerLogo { width: 960px; }
#header { background: url(Header/HeaderBgSync.gif) top repeat-x; position: relative; z-index: 500; }
h1#headerLogo { background: url(Header/HeaderTopRight.gif) top right no-repeat;}
h1#headerLogo a 
{
    display: block;
    background: url(Header/HeaderLogo.gif) center center no-repeat;
    width:338px;
    height:97px;
    overflow: hidden;
    text-indent: -9999px;
}
#printableLogo { display:none; }

/**** Top Navigation ***********************************************************/
#topNav { text-align: right; width: 500px; }
#topNav li {display: inline;}
#topNav li a {display: -moz-inline-box; display: inline-block;padding-left: 12px;}
#topNav, #mainSearch {position: absolute;right: 20px;z-index: 501;}
#topNav {top: 10px;}

/*** Main Search at top ********************************************************/
#mainSearch 
{
	background: #fff;
	width: 288px;
	height: 30px;
	margin-top: 10px;
	top: 30px;
}
#mainSearch label 
{
	position: absolute;
	color: #ccc;
	top:6px;
	left:4px;
	font-size: 1.3em;
}
#mainSearch input.text 
{
	width: 250px;
	border: 1px solid #fff;
	background: #fff;
	font-size: 1.4em;
	padding: 3px;
}
#mainSearch input.image { position: absolute; top: 3px; right: 0; }

/****** Main Navigation ************************************************************/
#mainMenu { background: url(MainTool/Shadow.jpg) top left no-repeat; }
#mainMenu li { display: inline; }
#mainMenu ul { padding-left: 12px;height: 40px; }

/********* FOOTER ******************************************************************/
h4.Footer { font-family: Helvetica, Arial, Sans-Serif; font-size: 1.2em; /*14px;*/ color: #FFFFFF; }
#footer { clear: both; background: url(Footer/FooterBg.jpg) top center no-repeat; padding-bottom: 15px; }
#footer .content {padding: 20px 0; width: 910px;}
#copyrightLegal { clear: both; font-weight: bold; font-size: .9em; }
#copyrightLegal li {display: inline;}
#copyrightLegal li a 
{
	display: -moz-inline-box; 
	display: inline-block;
	padding-right: 8px;
	margin-right: 5px;
	border-right: 1px solid #666;
}
#copyrightLegal { color: #666; }

/*** Quick Links In Footer *********************************************************/
#quickLinks { height: 110px; float: left; width: 600px; }
#quickLinks .col { width: 147px; float: left; font-size: .9em; }
#quickLinks li, #quickLinks h4 {margin-bottom: 7px;}
#quickLinks li a { font-weight: bold; }

/***** Right Navigation ************************************************************/
.iconLink a, .iconLink a:visited, .iconLink a:active, .iconLink a:hover { color: #DF901C; font-weight:bold; }
.iconLinkImage { padding-right:5px; }
.rightSubContent li.iconLink
{
    list-style-image:none;
    list-style-type:none;
    position:relative;
    left:-15px;
}

.rightSubContent { float: right; background: url(RightTool/RightNavBg.jpg) repeat-y; }
.rightSubContent .wrapper1 { background: url(RightTool/RightNavTop.jpg) top left no-repeat; }
.rightSubContent .wrapper2 { padding: 15px 5px 40px 15px; background: url(RightTool/RightNavBottom.jpg) bottom left no-repeat; }
.leftSubContent { float: right; background: url(LeftTool/LeftNavBg.jpg) top right repeat-y; text-align: left; }
.leftSubContent .wrapper1 { background: url(LeftTool/LeftNavTop.jpg) top right no-repeat; }
.leftSubContent .wrapper2 { padding: 15px 15px 40px 5px; background: url(LeftTool/LeftNavBottom.jpg) bottom right no-repeat; }

/****** Photo Frame *********************************************/
.photo img { margin: 0 !important; padding: 0 !important; vertical-align:middle; }
.photo, .photo span, .photo > div {display: -moz-inline-box; 
                           display: inline-block;
                           border: 1px solid #d5dada; background: #fff; padding: 3px;}
.photo { border-color: #e9eeee; }
/****** Main Content ********************************************/
#container, #footer .content { text-align: left; margin: 0 auto; }
#content { padding: 10px 14px; color: #585858; width: 932px; }
#content .blueBox, #content .blueBoxFloatRight { background-color: #f3f9f9; border: 1px solid #dcdcdc; }
#content .contentContainer { padding: 12px 12px 0 12px; }
#content .blueBoxFloatRight 
{ 
    float:right;
    padding:10px 5px 0 5px;
    margin: 0px 0px 10px 10px;
    display:block;
}
#content .blueBoxFloatRight img
{
	padding-top:0px;
}
.mainContent h1 { margin: 0 0 .5em 0; }

/**** Text Size Fluctuation ***************************************/
body.textSize1 .contentPane, body.textSize1 .enginePage,
body.textSize1 .opcContentPane, body.textSize1 .enginePage { font-size: 1em; }
body.textSize2 .contentPane, body.textSize2 .enginePage,
body.textSize2 .opcContentPane, body.textSize2 .enginePage { font-size: 1.1em; line-height: 1.1em; }
body.textSize3 .contentPane, body.textSize3 .enginePage,
body.textSize3 .opcContentPane, body.textSize3 .enginePage { font-size: 1.2em; line-height: 1.2em; }
body.textSize4 .contentPane, body.textSize4 .enginePage,
body.textSize4 .opcContentPane, body.textSize4 .enginePage { font-size: 1.3em; line-height: 1.3em; }

/**** Flyout Calendar Control *************************************/
table.calendar_table { height: 170px; width: 210px; }
table.calendar_table thead tr { height: 20px; }

/**** Form Styles ******************************************/
input.radioButton { position: absolute; left: -999em; }
label.radioLabel 
{
    padding: 2px 10px 0 20px;
    background: url(Content/Radio_Off.gif) top left no-repeat;
    line-height: 20px;
    font-weight: normal;
}
label.radioSelected { background-image: url(Content/Radio_On.gif); }
label.required { background: url(Form/RequiredBg.gif) 0 5px no-repeat; padding-left: 1em; }
/*.inline label.required { background-position: right 2px; display: -moz-inline-box; display: inline-block; padding-right: 10px; padding-left: 0; }*/
fieldset table { border-collapse: collapse; }
fieldset table td { padding: 0 10px 10px 0; }
fieldset.stacked label { display: block; }
fieldset.inline label { float: left; width: 10em; }
fieldset.inline label.required { width: 9em; }
fieldset.inline2 label { float: left; width: 8em; text-align: right; background-position: right 5px; padding-left: 0; padding-right: 1em; margin-right: 1em; }
fieldset.inline .commandPane, fieldset.inline2 .commandPane { padding-left: 10em; }

/**** Toggle List ********************************************/
ul.toggleList { margin: 0 0 1em 0; }
ul.toggleList li
{
    list-style-type: none;
    margin: 0 0 .5em 0;
    padding: 0;
}
/*Teri new toggle for JQuery */
ul.toggleList li a.toggle, div.ECTitleClosed { background: url(Content/Blue-Side-Arrow.gif) top left no-repeat; padding-left: 17px; }
ul.toggleList li a.active { background-image: url(Content/Green-Down-Arrow.gif); }
div.ECTitleOpen{ background: url(Content/Green-Down-Arrow.gif) top left no-repeat; padding-left: 17px; }
div.ECTitle{margin-top:6px;margin-bottom:2px;}
/***** Google Search *******************************************/
div.sortContainer 
{
	padding:0px;
	margin:0px;
	margin-top:7px;
	margin-bottom:20px;
	color:#929292;
}
table.searchForm
{
	width:100%;
}
table.googleContainerTable
{
	width:100%;
}
.at300bs
{
	display:inline !important;
	padding-right:0px; 
}
.addthis_button_compact a:hover, .addthis_button_compact span a:hover
{
	text-decoration:none !important;
}
#EmailThisPageLink
{
	margin-left:5px;
}
div.toolBar img 
{
	padding:0px !important;
	margin:0px !important;
}
div#noscript, div#nocookies {
	background: #000;
	color: #FFF;
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	padding: 3px 0 5px 0;
	text-align: center;
	padding:25px 10px; 
	margin:10px auto; 
	border:solid 2px #ccc; 
}

table.minimalStyle { border-collapse: collapse; margin: 0 0 1em 0; }
table.minimalStyle td, table.minimalStyle th { border: 0; padding: 4px; empty-cells: show; }

table.minimalStyleWithBorder { border-collapse: collapse; margin: 0 0 1em 0; }
table.minimalStyleWithBorder td, table.minimalStyleWithBorder th { border: 1px solid #333; padding: 4px; empty-cells: show; }

#EmergencyAlerts{
margin-bottom:10px;
}
#EmergencyAlerts h3, #EmergencyAlerts div
{
	border: 1px solid #CD0A0A;
}

#EmergencyAlerts h3
{
	padding-left:26px;
	background-color:#FDE5E5;
	cursor:auto;
}

#EmergencyAlerts div
{
	background-color:#fef5f5;
	border: 1px solid #CD0A0A;
}
#EmergencyAlerts,#EmergencyAlerts h3,#EmergencyAlerts a
{
	color: #CC0000;
}
#EmergencyAlerts a
{
	text-decoration:underline;
}

#EmergencyAlerts .NoMoreAlert
{	
	display:none;
	text-decoration:none;
	background: none repeat scroll 0 0 #CC0000;
    border: 1px solid #BD790E;
    color: #FFFFFF;
    font-size: 1em;
    font-weight: bold;
    padding: 2px 5px;
}
#EmergencyAlerts .alertDate{

    font-size: 1em;
    font-weight: normal;
}
.pointer{
	cursor:pointer !important;
}
.referenceContainer h3 a
{
	color:#DF901C;
}
.RightBarRss a{ font-weight:normal;}
.RightBarRss .dt{ font-size:.8em;}
.RightBarRss .RssItem{ margin-bottom:8px;}
.RightBarRss h3{ font-weight:normal;}
#ChiefBlog{
	margin-top:0px;
	margin-bottom:30px;
}

li.newsroom .dt
{
	font-size:.8em;
}
.callout1 .homePageNews  p
{
	font-size:1em;
}



#outlookSubmitButton{
margin-left:100px;margin-top:5px;
}
.calDiv .invalid{
color:red;
}
.calDiv select.invalid , .calDiv input.invalid  {
color:#777777;font-weight:normal;
}
.CalendarList{

}
.CalendarList li{
float:left;display:inline;
padding:3px;
border-style:solid;
border-color:#cccccc;
border-width:1px;
}
.CalendarList a{
color:#666666;
text-decoration:none;
}

.CalendarList span{
width:16px;height:16px;display:block;float:left;
}
.CalendarList .Google{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll 0px 0px transparent;
}

.CalendarList .outlook{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll -16px 0px transparent;
}

.CalendarList .Yahoo{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll -48px 0px transparent;
}

.CalendarList .SMS{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll -64px 0px transparent;
}

.CalendarList .Msn{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll -96px 0px transparent;
}

.CalendarList .iCal{
background: url("/apps/events/images/CalendarIcons.gif") no-repeat scroll -80px 0px transparent;
}
.OpIcon
{
	background: url("images/op.png") no-repeat scroll -0px 0px transparent;
}
.calDiv{
	display:none;
border-style:solid;
border-color:#cccccc;
border-width:1px;
margin-bottom:10px;
}
.calDiv h3{
padding:3px;
}

.CalendarList  li:hover
{
background-color: #eeeeee;
border-color:#E9AB54;
}

.pointer{
cursor:pointer;
}
.pad5{
padding:5px;
}
#emailIcs{
width:200px;
}
.fakeLink
{
cursor:pointer;
color: #DF901C;
}
.fakeLink:hover
{
	text-decoration:underline;
}

#EventForm{
margin-top:10px;
}


/* SPRITE */
#mainMenu li {
float:left;
position:relative; /* Spriteric Add */
}

#mainMenu a
{float:left;

	background-image:url(images/sprite-topnav.gif);
	height:40px;
	text-indent: -99999px;
	background-position:0px 0px;
	overflow:hidden;
}
#mainMenu a b { /* Spriteric Add */
position:absolute;
left:0;top:0;
z-index:-1;
height:50px; 
width:150px;
line-height:50px;
text-align:center;
}
* html #mainMenu a b { /* Spriteric Add for IE6 */
left:-999em;
}


#mainMenu a#ThingsToSeeAndDoSection 
{
	width:185px;
	background-position:0px -200px;
}
#mainMenu a#ThingsToSeeAndDoSection:hover,#mainMenu a#ThingsToSeeAndDoSection:focus
{
	background-position:-250px -200px;
}
#mainMenu a#ThingsToSeeAndDoSection.sel
{
	background-position:-500px -200px;
}

#mainMenu a#Resident-ResourcesSection
{
	width:189px;
	background-position:0px -250px;
}
#mainMenu a#Resident-ResourcesSection:hover,#mainMenu a#Resident-ResourcesSection:focus
{
	background-position:-250px -250px;
}
#mainMenu a#Resident-ResourcesSection.sel
{
	background-position:-500px -250px;
}

#mainMenu a#Doing-BusinessSection
{
	width:156px;
	background-position:0px -50px;
}
#mainMenu a#Doing-BusinessSection:hover,#mainMenu a#Doing-BusinessSection:focus
{
	background-position:-250px -50px;
}
#mainMenu a#Doing-BusinessSection.sel
{
	background-position:-500px -50px;
}

#mainMenu a#City-GovernmentSection
{
	width:174px;
	background-position:0px 0px;
}
#mainMenu a#City-GovernmentSection:hover,#mainMenu a#City-GovernmentSection:focus
{
	background-position:-250px 0px;
}
#mainMenu a#City-GovernmentSection.sel
{
	background-position:-500px 0px;
}

#mainMenu a#Maps-And-StatsSection
{
	width:137px;
	background-position:0px -100px;
}
#mainMenu a#Maps-And-StatsSection:hover,#mainMenu a#Maps-And-StatsSection:focus
{
	background-position:-250px -100px;
}
#mainMenu a#Maps-And-StatsSection.sel
{
	background-position:-500px -100px;
}

#mainMenu a#My-OPSection
{
	width:92px;
	background-position:0px -150px;
}
#mainMenu a#My-OPSection:hover,#mainMenu a#My-OPSectionn:focus
{
	background-position:-250px -150px;
}
#mainMenu a#My-OPSection.sel
{
	background-position:-500px -150px;
}

/******  Slideshows *****************************************/

/* The Nivo Slider styles */
.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:60;
	display:none;
}
/* The slices in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	bottom:0px;
	color:#fff;
	width:100%;
	z-index:89;
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
.nivo-caption a {
	display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:99;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
.slideshow img.nivo-0{display:block;}
	

.slideshow{
	position:relative;
	overflow: hidden;
}
.slideshow img {
	position:absolute;
	top:0px;
	left:0px;
	display:none; 
	padding:0 !important;
}
.slideshow a {
	border:0;
	display:block;
}

/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:99;
	cursor:pointer;
}
.nivo-controlNav {
	bottom: 10px;
    position: absolute;
    right: 90px;
    text-align: right;
}
 .slideshow .nivo-controlNav a {
	background: none repeat scroll 0 0 #D7921D;
    border: 1px solid #000000;
    color: #FFFFFF;
    display: inline-block;
    font-weight: bold;
    margin-right: 5px;
    padding: 2px 5px;
}

.slideshow  .nivo-controlNav a.active {
	background-color: #A7B420;
}

.nivo-directionNav a {
	display:block;
	width:30px;
	height:30px;
	text-indent:-9999px;
	border:0;
}
 .contentFeature  a.nivo-nextNav, .contentFeature  a.nivo-prevNav {
	display:none;
}
.nivo-caption .learnMore{
	 bottom: 0;
    position: absolute;
    right: 0;
	background: url(/App_/ROOT/PageFrame/Index/Images/MainImageLearnMore.gif);
	width:88px; 
	height:30px;
	z-index:101;
}

.nivo-caption .description{
	bottom: 0;
    color: #FFFFFF;
    left: 0;
    padding: 5px 100px 5px 7px;
    position: absolute;
    width: 100%;
}
.nivo-caption a { 
    color:#ffffff;
    text-decoration:underline;
}

.slideshow .learnMore a.externalLink span { display: none; }

/*Content Feature Slideshow*/
.contentFeature-wrapper {
	background: url(/App_/ROOT/PageFrame/Standard/Content/MainImageFrame.gif) no-repeat scroll 0 0 transparent;
    height: 235px;
    margin-bottom: 0px;
    position: relative;
    width: 502px;
	padding-top:9px;
	padding-left:10px;
}
.contentFeature {
    width:482px;
	height: 215px;    
}

.contentFeature-wrapper .nivo-caption .description{
	background: url("/App_/ROOT/PageFrame/Standard/Content/ContentFeatureFade.png") repeat-y scroll 0 0 transparent;
    width: 283px;
	min-height:30px;
}
/*Home Page Slideshow*/

/*Content Feature Slideshow*/
.homePageFeature-wrapper {
	background: url(/App_/ROOT/PageFrame/Index/Images/MainImageFrame.gif) no-repeat scroll 0 0 transparent;
    height: 235px;
    margin-bottom: 0px;
    position: relative;
	padding-top:9px;
	padding-left:10px;
}
.homePageFeature {
    width:696px;
	height: 215px;    
}
.homePageFeature-wrapper .nivo-controlNav{display:none;}

