/* *
*
*
  Theme Name:     North & West Metroplitan Region
  Theme URI:      http://inwpcp.org.au/
  Author:         Christine Sese
  Date:           Sep 17, 2015
*
*/


/********** FONTS ******************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css?family=Arvo);
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
/****************************************************************************************************************************************/
html { margin:0 !important;background:#FFF url(../img/koolin/bk.jpg) no-repeat bottom right; padding-bottom:220px;}
body { border:0; margin:0;font: 14px/22px 'Open Sans', sans-serif; color:#333333; overflow-x: hidden;}

.inline-block { display:inline-block;}
.inline-flex { display:inline-flex;}
.hide { display:none !important;}
.left { float:left;}
.right { float:right;}
.clear { height:0; clear:both;}
a { color:#0f76bb; text-decoration:none; }
a:hover { color:#73b8df;}
h1 { font-size:24px; padding:0; margin:36px 0; color:#fcb041;text-transform:uppercase;}
h2 { font: bold 19px/28px 'Arvo', sans-serif; line-height:27px;margin-top:40px; color: #000;text-transform:uppercase; }
h3 { font-size:16px;text-transform:uppercase; color: #000;text-transform:uppercase;}
h4 { font-size:15px; color:#000;text-transform:uppercase;}
h5 { font-size:12px; color:#666;}
h6 { font-size:10px; color:#666;}

img { border:none;}
area { background:#73b8df; width:100px; height:100px;}

.body-wrap { width: 100%; margin:0;}

#header,
.banner,
.quick-links, 
#container { margin:0 auto; width: 960px;}


/********** HEADER ******************************************************************************************************************************/
#header { margin:10px auto 25px; height:auto;}

#header .top-panel { height:127px; margin:0 auto; padding:0; width:100%;}
#header .top-panel h3 { display:none;}
#header .top-panel .block { margin:17px 40px 34px 0; display:inline-block; float:left;text-align:center;}
#header .top-panel .block:last-child { float:right;margin: 29px 0px 34px 0;}

/****************************************************************************************************************************************/


/********** BANNER ******************************************************************************************************************************/
.banner { height:122px; margin-bottom:44px; padding:0; background:#eee9df; }
.banner h3 { display:none;}
.banner .logo { width:125px; float:left; padding: 15px 0 15px 15px;}
.banner .logo-descr { width:735px; float:left;}
.banner .logo-descr p { color:#000; font: 23px/28px 'Arvo', sans-serif; line-height: 83px; font-weight: bold;}

.home .banner { height:189px;}
.home .banner .logo { width:180px;}
.home .banner .logo-descr p { margin:0; padding: 48px 0 4px 0;font: bold 21px/28px 'Arvo', sans-serif;}
.home .banner .logo-descr h1 { margin:0; font: bold 26px/34px 'Arvo', sans-serif;word-spacing: 5px}
/****************************************************************************************************************************************/


/********** QUICK LINKS ******************************************************************************************************************************/

.quick-links { height: 250px; margin-bottom:44px; padding:0; }
.quick-links .block { float: left; width: 168px; min-height: 220px; margin: 0px 12px; }
.quick-links .block h3 { display: none; }
.quick-links .block p { margin: 0; }
.quick-links .block img { opacity: 1; }
.quick-links .block img:hover { opacity: 0.5; }
.quick-links .widget_sp_image-description { height: 95px; text-align: center; }
.quick-links .widget_sp_image-description .title { font-family: 'Lato', sans-serif; font-size: 14px; font-weight: bolder; color: #007dc3; }

/****************************************************************************************************************************************/


/********** MENU ICONS ******************************************************************************************************************************/

#container .sidebar li::before,
#container .sidebar .fpw-page-title::before { float: right; content: "\f054"; font-family: 'FontAwesome'; font-size: 22px; }
#container .sidebar .fpw-page-title::before {  margin-left: 25px; margin-right: 7px; }

#container .sidebar li.lines4::before { margin-left: 25px; margin-top: 30px; margin-bottom: 35px; }
#container .sidebar li.lines3::before { margin-left: 25px; margin-top: 20px; margin-bottom: 25px; }
#container .sidebar li.lines2::before { margin-left: 25px; margin-top: 10px; margin-bottom: 15px; }
#container .sidebar li.lines1::before { margin-left: 25px; }


/****************************************************************************************************************************************/


/********** CONTENT ******************************************************************************************************************************/
#container { }
#container .sidebar { width:325px; float:left;}
#container .sidebar h3 { font: bold 17px/22px 'Arvo', sans-serif; color:#fcb041; margin-left: 10px;}
#container .sidebar h3.fpw-page-title { color:#eee9df;font: 400 15px/22px 'Open Sans', sans-serif;border-bottom: 1px solid #637581;border-top: 1px solid #637581;padding:12px 0 12px 8px;margin:0 0 5px 27px; }
#container .sidebar h3.fpw-page-title:hover { color:#0f76bb; }
#container .sidebar ul { margin:0; padding:0 0 0 27px; list-style-type:upper-alpha; color:#eee9df;}
#container .sidebar li { border-top:1px solid #637581; padding:15px 8px;}
#container .sidebar li:first-child { border:none;}
#container .sidebar li:hover { color:#0f76bb;}
#container .sidebar li a { color:#eee9df; font-size: 14px; font-weight:400;}
#container .sidebar li a:hover { color:#0f76bb;}

#container .sidebar-bl { background:#000 url(../img/koolin/sidebar-bk.jpg) no-repeat bottom; padding: 16px 16px 60px 10px; }
#container .sidebar-yl { background:#f7ba5f; padding: 10px 16px 10px 21px; margin-top:25px;}
#container .sidebar-yl a { color: #000;font-size: 15px;font-weight: 600;}
#container .sidebar-yl a:hover { color:#0f76bb;}

#container .content { width:597px; float:right; overflow:hidden; }
#container .content h3 { margin-top:0;}
#container .content h1 {font: 20px/28px 'Arvo', sans-serif; margin:0 0 30px 0;}
#container .content .overview { width:90%; background:#f2efe7; padding:34px 26px;}
#container .content table { border-collapse: collapse; width:100%; }

/*three colors alternating*/
#container .content table tr:nth-child(3n+1) { background: #f2efe7;}
#container .content table tr:nth-child(3n+2) { background: #f2efe7;}
#container .content table tr:nth-child(3n+3) { background: #f2efe7;}
#container .content table tr:nth-child(6n+4) { background:#e4eaed;}
#container .content table tr:nth-child(6n+5) { background:#e4eaed;}
#container .content table tr:nth-child(6n+6) { background:#e4eaed;}

/*alternating*/
#container .content table.alternating tr:nth-child(odd) { background: #f2efe7;}
#container .content table.alternating tr:nth-child(even) {background: #e4eaed;}

/* end alternating*/
#container .content table td { border:1px solid #FFF; vertical-align: text-top;padding:10px 12px;}
#container .content table.default tr { background: #efe8de;}

#container .content table.toolkit-tbl {border-collapse: collapse; width:100%; margin-bottom:30px; }
#container .content table.toolkit-tbl th { background:#000; color:#FFF; text-transform:uppercase;padding: 12px 12px 8px;}
#container .content table.toolkit-tbl tr.odd { background: #DDD9C3;}
#container .content table.toolkit-tbl tr.even { background: #EEECE1;}


.accordion h3 { font: normal16px/21px 'Arvo', sans-serif; padding:14px 0; border-bottom:1px dotted #666; margin:0; color:#7BBF44; cursor:pointer; }
.accordion .ui-accordion-content { margin:0;font: 14px/22px 'Open Sans', sans-serif;color:#333333;}
.accordion .ui-state-active,
.accordion .ui-state-default{ border:none; background:#000; color:#FFF; font: normal16px/21px 'Arvo', sans-serif; border-radius:0; margin-bottom:18px;}
.accordion .ui-widget-content{ border:none; background:none;margin-top: -15px;}
/****************************************************************************************************************************************/

/********** FOOTER *********************************************************************************************************************/


/****************************************************************************************************************************************/

/********** OVER WRITE STYLING **********************************************************************************************************/

/* Safari only override */
  .safari
/*This will work for firefox*/

  .firefox 

/****************************************************************************************************************************************/