﻿/*********
    #SITE 
***********/


:root
    {overflow: scroll}





.itemCaption, .itemHeader, .itemCaptionNoFl
{
	font-size: 120%;
	font-family:Arial;
    padding-bottom: 3px;
    
}




.req
{
    color: red;

}

.boldTextColor
{
    font-weight: bold;
}

.pollTitle
{

	font-family:Arial;
    font-weight: bold;
    padding-bottom: 6px;
    padding-top: 6px;
}

.pollButtons
{
    padding-top: 15px;
    width: 100%;
    padding-left: 8px;
}



.pollQuestion
{
    padding-top: 3px;
    padding-bottom: 3px;
}

.pollLink
{

    text-decoration: none;
    background-color: #CCCCCC;
    padding: 6px;
    width: 60px;
    float: left;
}

.pollLink:hover
{

    text-decoration: underline;
    background-color: #CCCCCC;
    padding: 6px;
    width: 60px;
    float: left;
    cursor: pointer;
}

.pollResults
{
    display: none;
}






.floatLeftNoMob
{
    float: left;
}

.floatRightNoMob
{
    float: right;
}



.floatLeft
{
    float: left;
}

.floatRight
{
    float: right;
}

.floatClear
{
    clear: both;
    float: none;
    height: 0px;
}

.smallLeft
{

    line-height: 1.4;

    
}

.smallRight
{
    padding-right: 8px;
}

.bigLeft
{
    padding-left: 16px;
}



.noteBox, .otherBox, .headerBox, .moreBox
{
 
    border: solid 1px #CCCCCC;
    
    padding: 8px 8px 8px 8px;

    
    overflow: auto;
}

.moreBottom
{
    padding-top: 40px;
    width: 100%;
    text-align: center;
    padding-bottom: 40px;
    clear: both;
   
}

.moreBox
{
    cursor: pointer;
}

.moreBoxIn
{
    padding-top: 25px;
    padding-bottom: 25px;
}


.noteYellow
{
    background-color: #FAFAD2;
    border: solid 1px #CCCCCC;
    width: 95%;
    padding: 8px 8px 8px 8px;

    
    overflow: auto;
}

.space
{
    height: 5px;
    width: 90%;

}



.popUp
{
    display: none;
    position: absolute;
    left: 100px;
    top: 200px;
    background-color: #FFFFFF;
    border: solid 2px #333333;
    padding: 15px;
    width: 540px;
    max-width: 100%;
}

#settingsPop
{
    top: 30px;
    left: 630px;
    width: 350px;
}

.gray
{
    color: #595959;
}

.itemDescription
{
    

    line-height: 1.4;
}


.sslideTitle
{
    font-weight: bold;
    padding-bottom: 3px;
}
.sslideBody
{
    padding-top: 3px;
}

#secondSlideFull DIV.secondslideimage {
    position:relative;
    top:0;
    left:0;
    z-index:1;
    width: 100%;
    height: 350px;
    background-color: #FFFFFF;
 
    
}



#secondSlideFull
{
    width: 99%;
    height: 350px;
    overflow: hidden;
    position: relative;
    padding-top: 0px;
    text-align:center;
}

    

#secondSlideSmall
{
    width: 300px;
    height: 225px;
    overflow: hidden;
    position: relative;
    padding-top: 0px;
     float: right;


}

#secondSlideSmall DIV.secondslideimage {
    position:relative;
    top:0;
    left:0;
    z-index:1;
    width: 300px;
    height: 225px;
    background-color: #FFFFFF;
 
    
}

 

#secondSlideFull IMG.active, #secondSlideSmall IMG.active, #itemSlideSmall IMG.active {
    z-index:10;
}

#secondSlideFull IMG.last-active, #secondSlideSmall IMG.last-active, #itemSlideSmall IMG.last-active {
    z-index:9;

}

#secondSlideFull .slideSecondCaption
{
    position: absolute;
    width: 100%;
    z-index: 12;
    background-color: rgba(0, 0, 0, 0.6);
   padding-top: 8px;
   padding-left: 8px;
   padding-right: 25px;
   padding-bottom: 8px;
    color: #FFFFFF;
    bottom: 0px;

   
}

.galleryCaption
      {    position: absolute;
    width: 100%;
    z-index: 12;
    background-color: rgba(0, 0, 0, 0.6);
   padding-top: 8px;

   text-align: left;

   padding-bottom: 8px;
    color: #FFFFFF;
    bottom: 0px;
      }


#secondSlideSmall .slideSecondCaption
{
    position: absolute;
    width: 300px;
    z-index: 12;
    background-color: rgba(0, 0, 0, 0.6);
    color: #FFFFFF;
    bottom: 0px;
    padding-bottom: 5px;
    padding-left: 8px;

}





#itemSlideSmall
{
    width: 300px;
    max-width: 300px;
    height: 220px;
    overflow: hidden;
    float: right;
    position: relative;
    
    
}

#itemSlideSmall img
{
    width: 300px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8;
    padding-top: 8px;

}
   




   #galleryCon
      {
          /*border: solid red 5px;*/
          position: absolute relative;
          display: none;
          min-width: 200px;
          min-height: 200px;
          z-index: 3;
          top: 100px;

      }

      .galSlide
      {
          position: absolute;
          top: 0;
          left: 0;
          display: block;
          opacity: 1;
          
      }


      
      #prevGallery
      {
          position: absolute;
          left: 5px;
          z-index: 120;
      }

        #nextGallery
      {
          position: absolute;
          right: 5px;
          z-index: 120;
      }

      .galleryNav
      {
          opacity: .6;
          cursor: pointer;
          top: 40%;
      }


/********
    #FRONT SLIDE SHOW - COMMON   
*********/

#slideshow {
   
    position:relative;
    width:490px;
    height: 263px;
    overflow: hidden;
    padding-top: 0px;
    
}



#slideshow DIV.slideimage,  #slideshow DIV.slideimageSingle {
    position:absolute;
    top:0;
    left:0;
    z-index:1;

    background-color: #FFFFFF;

 
    
}

#portalshow
{
    position:relative;
    width:750px;
    height: 350px;
    overflow: hidden;
    padding-top: 0px;
}

#portalshow DIV.slideimage {
    position:absolute;
    top:0;
    left:0;
    z-index:1;
    width: 750px;
    height: 350px;
    background-color: #FFFFFF;
 
    
}

#slideshow DIV.slideshow IMG
{
    width: 750px;
    height: 350px;
}



#slide2, #slide3, #slide4, #slide5, #slide6, #slide7, #slide8, #slide9, #slide10, #slide11, #slide12, #slide13, #slide14, #slide15
{
    display: none;
}

#slideshow DIV.slideshow IMG
{
    width: 490px;
    height: 263px;
}


.slideCaption
{
    position: absolute;
    width: 100%;
    z-index: 12;
    background-color: rgba(0, 0, 0, 0.6);
   padding-top: 5px;
   padding-left: 8px;
   padding-right: 25px;
   padding-bottom: 5px;
    color: #FFFFFF;
    bottom: 0px;
    text-align: left;
   
}

#slideshowMarker
{
    display: none;
    padding-top: 5px;
    background-color: rgba(0, 0, 0, 0.6);
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 2;
    height: 20px;
    overflow: hidden;



}

#slideshowMarker IMG
{
    cursor: pointer;
}

#slideshowMarker .slidemark
{
    width: 8px;
    height: 10px;
    padding-left: 5px;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.1);
   
}

#nextImage
{
   position: absolute;
    right: 5px;
    top: 40%;
    width: 40px;
    height: 40px;

}

#prevImage
{
    position: absolute;
    top: 40%;
    left: 5px;
    width: 40px;
    height: 40px;
}

#nextSmallImage
{
    position: absolute;
    top: 70px;
    right: 0px;
    width: 40px;

}

#prevSmallImage
{
    position: absolute;
    top: 70px;
    left: 0px;
    width: 40px;
    
}


.slideNav
{
    cursor: pointer;
    display: none;
    z-index: 20;
    width: 40px;
    opacity: .7;
}






/********
    #FRONT Calendar - COMMON 
*************/

.frontCalHead
    { border: 0px;}

.calFrontDay
    {text-align: center;font-weight: bold;vertical-align: middle;}

.calFrontHead
    {
    }



.calView
{background-color: transparent;}



.dayPop
{
    padding: 10px 25px 10px 5px;
    display: none;
    position: absolute;
       border: 2px solid #314A2D;
     min-width: 250px;
}

.evDiv
{
    padding-top: 3px; 
    padding-bottom: 3px;

}




/********
    #FRONT BUTTONS & FRONT MENU
*************/

.mobileMenuCon
{
    display: none;
}

.frontMobileHeader
{
    display: none;
}






.frontAlternateText a
{
    text-decoration: none;

    color: #FFFFFF;
}

.frontAlternateText
{
    padding-left: 10px;
    float: left;
    width: 160px;
    color: #FFFFFF;
    
}




.frontMenuI
{

    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 5px;
    width: 100%;
}


.frontMenuI a
{
    text-decoration: none;
    display: block;
}

  .frontMenuI:hover a
{

     
}

.menuItem
{
    text-align: left;
}

/********
    #EMERGENCY ALERT - COMMON 
*************/



/***  text Boxes*/

  .txtBox
{


    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding-left: 4px;
    

}


.tdCaptionNOFL
{
    color: #595959;
text-align: left;
padding-top: 4px;
font-weight: bold;
min-width: 160px;


}

.tdCaption, .itemCaption
{
color: #595959;
text-align: left;
padding-top: 4px;
min-width: 160px;



}

.tdValue, .itemValue
{
 
    padding-top: 4px;
    float: left;
    
}


/****** 

    All Pages 

*******/

.wrapper
{
    
}

.bgGray
{
    position: absolute;
    display: none;
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 1000px;
    z-index: 2;
    top: 0px;
    left: 0px;
}

/**********

    Front Page

*********/

.searchItemCon
{
    padding-top: 20px;
    padding-bottom: 8px;
    
}



.frontNewsItem, .frontCalendarItem, .frontAlertItem
{
    padding-bottom: 6px;
    padding-top: 6px;
    padding-right: 5px;
    padding-left: 8px;
}

.frontNewsItem{


}

.frontNewsItemIn
{
    padding: 8px;
}

.frontNewsTitle, .frontAlertTitle
{

    
    padding-bottom: 3px;
    padding-top: 12px;
}

.frontNewsSummary
{
     

    line-height: 1.4;
}

.frontNewsMore
{

}

.frontCalendarDate
{
 
    font-weight: bold;
    padding-top: 5px;

}

.frontCalendarLink
{


}

.frontCalendarTime
{

}


.frontFeature
{
    padding-bottom: 8px;
    overflow-y: hidden;
    height: 100px;
    border: solid 1px #CCCCCC;
}

.frontFeatureIn
{
    line-height: 1.2;
}


.mobileBox
{
    overflow: hidden;
}

.frontFeatureTitle
{
    font-size: 120%;
    padding-bottom: 8px;
    padding-top: 4px;
}

.frontFeatureImage
{
    width: 125px;
}



.moreNews, .moreCal
{
    text-align: right;
    width: 100%;

    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
 

}

    .moreNews a, .moreCal a
    {
        text-decoration: none;

    }

      .moreNews a:hover, .moreCal a:hover
    {
        text-decoration: underline;
    }


/********
    #SECOND PAGES 
*************/

.mainContainer
{
    margin-left: auto;
	margin-right: auto;

    max-width: 99%;
	text-align: left;
	z-index: 10;
    overflow: hidden;
    margin-left: auto;
	margin-right: auto;


}

.topline
{
	text-decoration: none; 
    
	width:990px;
	line-height:18px;
}

.topline a
{
	text-decoration: none;
}

.topline a:hover
{
    text-decoration: underline;
}




.secondContainer
{

 
    max-width: 100%;
    min-height: 500px;
 
    

}

.secondLeft
{

   float: left;
   
   width: 20%;

   min-height: 600px;
   display: table;
   overflow: hidden;
}

.sideMenuUnder
{
    height: 60px;
}

.secondRight
{

    text-align: left;
    float: left;
    

    z-index: 9;
    padding-left: 10px;
 
    width: 78%;
    box-sizing: border-box;


}




.breadCrumb
{
    padding-top: 4px;
    width: 100%;
    float: left;

}




    .breadSpan a:hover
    {
        text-decoration: underline;
    }

.breadSpace
{
    padding-left: 5px;
    padding-right: 5px;

}
.pageFunction
{
    max-width: 140px;
    float: right;
    text-align: right;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;

}

.pageTitleCon {
    padding-top: 0px;
    width: 100%;
    text-align: left;
    float: left;
}

.returnText
{
    width: 25%;
    float: right;
    padding-top: 8px;
    text-align: right;
}




.pageTitleUnder
{
    height: 15px; clear: both;
}

.pageLeftNoHigh
{
    width: 100%;
   

 
}

    .pageLeftNoHigh img, .pageLeftHigh img {
        max-width: 100%;

    }

.pageLeftHigh
{

    position: relative;
}


.pageLeftNoHigh, .pageLeftHigh
{
  

    padding-bottom: 30px;

  
}

.mobileHeader, .mobileShow
{
    display: none;
}





.mainFooter
{

    margin-left: auto;
	margin-right: auto;

    width: 100%;
	padding-bottom:5px;
	padding-top:5px;
    text-align: center;


    
    overflow: visible;
    
}



.mainFooter a
{	
     text-decoration: none;
}

.mainFooter a:hover
{
    text-decoration: underline;
}

.mainFooterU
{
    
    height: 5px;
}



.footerSocial
{
    padding-top: 6px;
}

.subPagesCon ul li, .subPagesMobileCon ul li
{
    padding-top: 4px;
    padding-bottom: 4px;
    

}

.subPagesCon
{
    padding-top: 10px;
}

.subPagesMobileCon
{
    
    display: none;
}


.groupHeader
{
    background-color: #CCCCCC;
    padding: 6px;

}

/********
    Highlights 
*************/




.highContent
{


	padding-top: 10px;
    padding-bottom: 20px;
   


    overflow: hidden;
	text-align: left;
}

.highContent a
{
	text-decoration:underline;
}





.highFooter
{

	height:15px;
	margin-bottom:15px;
}

.highItem
{
    padding-top: 6px;
    padding-bottom: 6px;
}


.highSummary
{


    
    padding-bottom: 15px;


}







/***********
    MODULE
********/

.viewReturn
{
    float: right;

    text-align: right;
    padding-top: 5px;

 
}

.viewReturn a
{
text-decoration: none;
}

.viewReturn a:hover
{
    text-decoration: underline;
}

.returnLink
{
    font-size:90%;
}

.itemLineCon
{
    padding-top: 9px;
    padding-bottom: 9px;
}

.itemLineConSM
{
    padding-top: 3px;
    padding-bottom: 3px;
}




.itemClear, .modClear
{
    clear: both;
    height: 0px;
}


.itemImage
{
    width: 250px;
}

.imageCon
{
    float: right;
    text-align: center;
    overflow: hidden;
    width: 300px;
    height: 250px;
    padding-top: 20px;
}

.folderImg
{
    background-image: url(/clientcommon/images/folder-closed.gif);
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    height: 15px;
    width: 22px;
}



.itemCaptionNoFl
{
    font-weight: bold;

}

.itemLineConSM
{
    padding-bottom: 10px;
}

.itemLineIn
{
    padding-left: 25px;
    padding-top: 3px;
    padding-bottom: 5px;
}
.itemSummary
{
    padding-top: 4px;
    

}


.staffLineName
{
    float: left;
    width: 225px;
}

.staffLineTitle
{
    float: left;
    width: 240px;
}

.staffLineEmail
{
    float: left;
    width: 125px;
    
}

.staffLinePhone
{
    float: right;
    /*width: 100px;*/
    padding-right: 3px;
 
}



.lineLeftSM
{
    float: left;
    width: 100px;

}

.lineLeftMD
{
    float: left;
    width: 175px;

}

.lineLeftLG
{
 
    float: left;
    width: 225px;
}



/***********
    MODULE HEADER / FOOTER
********/

.pageHeader
{
    padding-bottom: 10px;
    line-height: 1.3;
}

.pageHeaderUnder
{
}

.pageFooter
{
       padding-top: 25px;
}

  

/***********
    ADMIN Stuff
********/

       .actionButton
        {
            padding: 3px 1em 3px 1em;
            text-decoration: none;
            height: 30px;
            position: relative;
            border: 1px solid #c5dbec;
            
            font-weight: bold;
            background: #dfeffc;
            color: #2e6e9e;
            cursor: pointer;
        }

        .actionButton a
        {
 
            text-decoration: none;
            
            font-size:80%;
            font-weight: bold;
            
            cursor: pointer;
            color: red;
        }

        .actionButton:hover
        {
            color: #000000;
        }

      .rounded
        {
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }


/***********
        AGENDA    
*******/

.agendaTitle
{
    width: 300px;
    float: left;   
}

.agendaLink
{
    float: left;
    min-width: 65px;

}

.itemDate
{
    font-style: italic;

    
}

.agendaItemDivide
{
    padding-top: 5px;

    width: 100%;
    height: 2px;
}






/****** Business ******/


.businessCaption
{
    clear: both;
    width: 75px;
    float: left;
    padding-bottom: 2px;
    padding-top: 2px;
    
}

.businessValue
{
    float: left;
    padding-top: 2px;
    padding-bottom: 2px;
}

.memberTitle
{

}


/******  License  ******/


.licenseEntry
{

}


/****   FAQ  *****/



     


/***** FORMS ******/

.formItem
{
    padding-top: 10px;
    padding-bottom: 10px;
    clear: both;
}

.formTextBox
{
    width: 60%;


}

.formLeft
{
    float: left;

}

.formRight
{
    float: left;
}

.formSubmit
{
    padding-top: 25px;
    padding-left: 180px;
}

.formHead
{


    
    overflow: auto;

}


/******  Document *******/

.documentTop
{

}

.documentLeft
{
    border: solid 1px #CCCCCC;
    float:left;
    width: 33%;
    height: 400px;
    overflow-y: scroll;

}

.documentRight
{
    float: left;
    border: solid 1px #CCCCCC;
    width: 66%;
    height: 400px;
    overflow-y: auto;

}

.docItem
{
    padding-top: 5px;
    padding-bottom: 5px;
}

.folderLine, .folderLineIndent
{
    padding-top: 8px;
    min-height: 20px;
    padding-left: 5px;
    cursor: pointer;

}

.folderLineIndent
{
    padding-left: 20px;
}

.documentLine
{
 padding-top: 8px;

}



.calDay
{
	text-align: left;
	border: solid 1px #76705A;
	vertical-align: top;
	


	
}

.calDayHeader
{
	background: #9B9270;
	color: #FFFFFF;
	border: solid 1px #9B9270;
}

.calNextPrev
{	

    font-size:90%;
	Color: #333333;
	vertical-align: bottom;
	border: none;
}

.calTitleStyle
{
	background: #FFFFFF;

	font-weight: bold;
	font-size: 160%;

	height: 25px;
	border: solid 4px #ffffff;

	
}

.calToday
{
	background: #ADB698;
	text-align: left;
	vertical-align: top;
	

}	

.calOtherMonth
{
		color: #999999;
		border: solid 1px #76705A;
		background: #dddddd;
		text-align: left;
		vertical-align: top;
		

}

.calView {
    background: #FFFFFF;
    width: 100%;
    max-width: 100%;
}

.calDayNum
{
	color: #444444;	
	font-size: 160%;

}

.dateChoice
{
    float: left;
    padding-bottom: 10px;
    padding-right: 15px;
    padding-top: 15px;
}


/********* RAD  ********/
.RadSocialShare
{
    border: 0 !Important;
    float: right;
}

#subPageLinkMenu
{
    position: absolute;
    display: none;
    width: 200px;
    background-color: #FFFFFF;
    border: solid 1px #CCCCCC;
    z-index: 10;
}



/* tables */


table.tableData
{
	width:100%;
	border:1px solid #C2BDA1;

	border-collapse:separate;
}

.tableData td
{
	border:0;
	border-top:1px solid #c3bfa7;
	padding:4px;
	margin:0;
}

.tableData th, .tableDataHdr
{
	padding: 6px;

	font-weight: bold;

	color: #403A25;
	background: #C2BDA1;
	text-transform:uppercase;
}

.tableDataHdr a, 
.tableData th a
{
	color: #ffffff;
}


.calendarReserve
{

    padding-top: 8px;

 
}

.calendarReserveL
{

    float: left;
    width: 40px;

}

.calendarReserveR
{

    width: 55px;
    float: left;

    text-overflow: ellipsis;
    overflow: hidden;
}


.portalBar
{
  background-color: rgba(0, 0, 0, 0.7);
    color: #FFFFFF;
    width: 100%;
    height: 50px;
    position: fixed;
    top: 0;
    left: 0;
}

.portalBarIn
{
    max-width: 100%;
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    padding-left: 15px;
}


.pline
{
    background-color: #FFFFFF;
}

.pline, .plinespace
{
    height: 4px;
    max-height: 4px;
    width: 30px;
}


.portalMenu
{
    width: 45px;
    height: 25px;
    float: left;
}

.portalTitle
{
    float: left;
    padding-left: 10px;
    font-size: 150%;
    color: #FFFFFF;
    text-align: left;


}

.portalHeader
{
    padding-top: 50px;
    max-width: 100%;

}

.portalFooter
{
    background-color: #FFFFFF;
    width: 100px;
    max-width: 60%;
    border: solid 2px red;
}

.portalFooterCon
{
    width: 100%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.portalLeft
{
    width: 22%;
    max-width: 220px;
    display: flexbox;
    flex: auto;
 
    padding-right: 5px;
}

.portalRight
{
    width: 75%;
    max-width: 750px;
    flex: auto;
    padding-left: 1%;

}

.portalMenuParent
{
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 130%;
    padding-left: 5px;
    cursor: pointer;
}

.portalMenuItem
{
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 19px;
    cursor: pointer;

}

.portalPageTitle
{
    font-size: 150%;
    padding-top: 5px;
    padding-bottom: 3px;

}
.portalPageTitleUnder
{
    padding-top: 3px;
}
.ppageContainer
{
    background-color: #FFFFFF;
    text-align: left;
    padding: 10px;

    line-height: 1.4;
    color: #000000;
    display: flex;
}


/* responsive */

@media all and (max-width: 999px) and (min-width: 800px)
{
    .calendarBox
    {
        display: none;
    }

}