/*
Theme Name: RBWG
Theme URI: http://tastypixels.com.au
Description: Responsive theme for Roebuck Bay Working Group
Author: Ricki Coughlan
Author URI: http://tastypixels.com.au
Version: 1.0
Tags:
*/

@import url('bootstrap/css/bootstrap.css'); 
@import url('bootstrap/css/bootstrap-responsive.css'); 

body
{
padding: 0;
margin: 0;
background: #fff !important;
font-family: 'Open Sans', sans-serif;
color: #323232 !important;
}

.no-line
{
border-bottom: none !important;
text-decoration: none !important;
}

/*--------------------------*/

/*        TYPOGRAPHY        */

/*--------------------------*/

h1
{
color: #EE6C20 !important;
font-weight: normal !important;
font-size: 38px !important;
line-height: 1em !important;
margin: 0 0 30px !important;
text-align: center;
}

h1.home-title
{
color: #EE6C20 !important;
font-size: 44px !important;
margin-top: 25px !important;
}

h1.page-title
{
color: #EE6C20 !important;
font-size: 44px !important;
margin-top: 25px !important;
text-align: left !important;
}

h2
{
font-size: 28px !important;
color: #EE6C20 !important;
font-weight: normal !important;
margin: 0 0 10px !important;
line-height: 1em !important;
text-align: center;
}

.panel-text h2
{
font-size: 22px !important;
color: #EE6C20 !important;
font-weight: normal !important;
margin: 0 0 10px !important;
line-height: 1em !important;
text-align: center;
}

h3
{
font-size: 22px !important;
color: #323232 !important;
font-weight: normal !important;
margin: 0 0 10px !important;
line-height: 1em !important;
text-align: left !important;
}

h4
{
color: #EE6C20 !important;
font-size: 16px !important;
font-weight: normal !important;
margin: 0 0 10px !important;
line-height: 1.5em !important;
text-align: left !important;
}

p
{
font-size: 16px !important;
line-height: 1.5em !important;
margin: 0 0 20px !important;
}


.sidebar h2
{
font-size: 22px !important;
text-align: center;
}

.sidebar p
{
font-size: 14px !important;
text-align: center !important;
}

p.home-text
{
font-size: 16px !important;
line-height: 1.5em !important;
margin: 0 0 20px !important;
text-align: center !important;
}

p.contact-footer-text
{
color: #323232 !important;
line-height: 1.5em !important;
margin: 20px 0 20px !important;
}

p.address-1
{
color: #323232 !important;
padding-left: 35px;
margin: 0 0 5px !important;
background: url(img/footer-address-light.png) left center no-repeat;
}

p.address-2
{
color: #323232 !important;
padding-left: 35px;
}

p.mobile
{
color: #323232 !important;
padding-left: 35px;
margin: 0 0 10px !important;
background: url(img/footer-mobile-light.png) left center no-repeat;
}

p.email
{
color: #323232 !important;
padding-left: 35px;
background: url(img/footer-email-light.png) left center no-repeat;
}

p.facebook
{
color: #323232 !important;
padding-left: 35px;
background: url(img/footer-facebook.png) left center no-repeat;
}

p.sidebar
{
font-size: 14px !important;
line-height: 1.5em !important;
margin: 0 0 20px !important;
}

.panel-text
{
width: auto;
padding: 0 12px 0 12px;
margin: 0;
}

.panel-text p
{
text-align: center;
line-height: 1.7em !important;
}

.home-text-wrapper
{
width: auto;
padding: 15px;
}

/*--------------------------*/

/*      NAVIGATION       */

/*--------------------------*/

#menu-wrapper
{
position: relative;
z-index: 1000;
width: 100%;
height: 40px;
background: #473F38;
margin: -15px 0px 0px 0px;
}

#menu-envelope
{
margin: 15px auto;
}

/* this creates the current page menu highlighting. Note the changes in the menu in the header.php file to echo ' page-item-home current_page_item'. In some themes this doesn't work without that modification and the creation of the custom menu in the WordPress admin panel. The custom menu on this site is called 'main'. */
.current_page_item
{
background: #2FC7EE; 
}

#menu .current_page_item a
{
color: #fff !important;
border-bottom: 0px !important;
}

#menu a
{
border-bottom:  0px !important;
}

/*--------------------------*/

/*          HEADER          */

/*--------------------------*/

.banner-wrapper
{
clear: both;
margin: -20px 0 0;
width: 100%;
height: auto;
padding: 20px 0 20px;
background: #2FC7EE;
}

/* changes banner wrapper to fit mobile menu */
@media screen and (max-width: 900px) 
{
.banner-wrapper
{
height: 60px;
}
}

.logo
{
clear: both;
margin: 0 auto;
width: 300px;
height: 140px;
background: url(img/logo.png) top left no-repeat;
}

.page-banner
{
clear: both;
margin: 0px 0 0;
width: 100%;
height: 160px;
padding: 10px 0;
background: #E8E4CA;
}

.page-logo
{
clear: both;
margin: 0 auto;
width: 190px;
height: 160px;
background: url(img/logo.png) top left no-repeat;
}

/*---------------------------*/

/*        EMBED VIDEO        */

/*---------------------------*/

/* holds embedded iframe code */
.vid {
clear: both;
position: relative;
border-top: 20px solid transparent;
padding-bottom: 56.25%;
padding-top: 30px; 
height: 0; 
overflow: hidden;
}
 
.vid iframe,
.vid object,
.vid embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

iframe
{
border: none;
}

/*---------------------------*/

/*        SLIDER CONTENT     */

/*---------------------------*/

.slider-wrapper 
{
width: 100%;
position: relative;
background-attachment: fixed;
z-index: 0;
overflow: hidden;
margin: 0px auto 0px auto;
}

.page-top
{
clear: both;
width: auto;
margin-top: 30px;
}

.page-bottom
{
clear: both;
width: auto;
margin-top: 80px;
}

.sidebar
{
width: 90%;
padding: 0 10px;
margin-bottom: 60px;
}

.page
{
width: 90%;
padding: 0 10px;
}

/*--------------------------*/

/*       PLAIN PANELS       */

/*--------------------------*/

.post-line /* underlines on blog posts */
{
width: auto;
margin: 20px 0 40px 0;
border-bottom: 1px #827564 solid;
clear: both;
}

/*--------------------------*/

.date-wrapper /* wraps the dates on blog posts */
{
width: auto;
padding: 0;
margin: 20px 0 0;
background: #f6f6f8 !important;
overflow: visible;
}

/*--------------------------*/

.main-panel
{
width: auto;
padding: 0px 12px;
margin: -20px 0 0;
background: #fff !important;
overflow: visible;
}

/*--------------------------*/

.main-bottom-panel
{
width: auto;
padding: 0px 12px;
margin: -40px 0 0;
background: #fff !important;
overflow: visible;
}

/*--------------------------*/

.white-panel
{
width: auto;
padding: 12px;
margin: -20px 0 0;
background: #fff !important;
overflow: visible;
}

/*--------------------------*/

.pale-panel
{
width: auto;
padding: 25px 0 0;
margin: -20px 0 0;
background: #E8E4E3;
overflow: visible;
}
/*--------------------------*/

.blog-sponsor-panel
{
width: auto;
height: 35px;
padding: 0;
margin: 40px 0 70px;
background: #fff url(img/blog-sponsors.png) top center no-repeat;
overflow: visible;
}

/*--------------------------*/

/*       TOP FOOTER         */

/*--------------------------*/

.top-footer
{
width: auto;
padding: 10px 0;
margin: -25px 0 0;
border-top: 15px solid #2FC7EE;
background: #E8E4E3;
}

.top-footer-panel
{
width: auto;
margin-right: 20px;
}

.top-footer-panel-right
{
width: auto;
}

.top-footer h2
{
color: #EE6C20 !important;
text-align: center !important;
font-size: 20px !important;
line-height: 1.5em !important;
}

h2.contact-heading
{
text-align: left !important;
}

.top-footer h3
{
text-align: left !important;
font-size: 16px !important;
ine-height: 1.5em !important;
margin: 20px 0 10px !important;
}

p.top-footer-text
{
color: #323232 !important;
text-align: center !important;
line-height: 1.5em !important;
margin: 20px 0 20px !important;
}

.footer-sponsor-text
{
color: #323232 !important;
text-align: center !important;
line-height: 1em !important;
margin: 10px 0 0 !important;
}

.top-footer-sponsor-text
{
color: #323232 !important;
text-align: center !important;
line-height: 1em !important;
margin: 20px 0 0 !important;
}

/*--------------------------*/

/*     BOTTOM FOOTER        */

/*--------------------------*/

.dark-footer-panel
{
width: auto;
padding: 0;
margin: 0;
background: #827564;
}

.mission-footer
{
width: auto;
margin: 10px auto;
padding: 0 10px;
height:  auto;
}

.footer-panel
{
width: auto;
height: auto;
margin: 0;
padding: 0 20px;
}

.footer-panel-right
{
margin: 0;
padding: 0 20px;
}

p.footer-text
{
color: #fff !important;
text-align: center !important;
line-height: 1.5em !important;
margin: 20px 0 20px !important;
}

/*--------------------------*/

/*          LINKS           */

/*--------------------------*/

a
{
color: #323232;
border-bottom: 1px dotted #323232;
text-decoration: none !important;
}

a:hover
{
color: #EE6C20;
border-bottom: 1px solid #EE6C20;
text-decoration: none !important;
}

.pale-panel a
{
color: #323232;
border-bottom: 1px dotted #323232;
text-decoration: none !important;
}

.pale-panel a:hover
{
color: #EE6C20;
border-bottom: 1px solid #EE6C20;
text-decoration: none !important;
}

.white-panel a
{
color: #323232;
border-bottom: 1px dotted #323232;
text-decoration: none !important;
}

.white-panel a:hover
{
color: #EE6C20;
border-bottom: 1px solid #EE6C20;
text-decoration: none !important;
}

.dark-footer-panel a
{
color: #fff;
border-bottom: 1px dotted #fff;
text-decoration: none !important;
}

.dark-footer-panel a:hover
{
color: #fff;
border-bottom: 1px solid #fff;
text-decoration: none !important;
}

.top-footer a
{
color: #323232;
border-bottom: 1px dotted #323232;
text-decoration: none !important;
}

.top-footer a:hover
{
color: #EE6C20;
border-bottom: 1px solid #EE6C20;
text-decoration: none !important;
}


/*--------------------------*/

/*         BUTTONS          */

/*--------------------------*/

p.button-text
{
text-align: center;
margin: 35px 0 50px !important;
}

.primary-button
{
color: #fff !important;
background: #827564;
line-height: 1em;
text-transform: uppercase;
padding: 12px 18px;
margin: 10px 0 20px;
text-decoration: none !important;
border-bottom: none !important;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
}

.primary-button:hover, .primary-button:focus
{
color: #fff !important;
background: #EE6C20;
border-bottom: none !important;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
}

/*-------------------------*/
/*       Back to top       */
/*-------------------------*/

.top-button
{
margin: -50px auto 10px auto;
height: 110px;
width: 110px;
border: 6px solid transparent;
border-radius: 50%;
background: url(img/back-to-top.png) top center no-repeat;
transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-webkit-transition: .5s ease-in-out;
}

.top-button:hover
{
margin: -60px auto 20px auto;
border: 6px solid #40D0F2;
border-radius: 50%;
cursor: pointer;
transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-webkit-transition: .5s ease-in-out;
}

.contact-panel-wrapper .top-button
{
margin: -70px auto 10px auto;
}


.contact-panel-wrapper .top-button:hover
{
margin: -80px auto 10px auto;
}

/*-------------------------*/

/*          LISTS          */

/*-------------------------*/

ol 
{
margin-left: 0;
padding-right: 0;
list-style: none;
}

ol li
{
counter-increment: step-counter;
font-size: 14px;
color: #54928b;
}

ol li::before 
{
content: counter(step-counter);
font-size: 100%;
color: white;
padding: 0 5px;
line-height: 2em;
margin: 0px 15px 0 0;
border-radius: 50%;
background: #54928b;
}

/*--------------------------*/

.row ul 
{
list-style: none;
padding: 0;
margin: 0 0 1em;
}

.row ul li 
{ 
padding-left: 0em;
margin-left: 1em;
list-style-position: inside !important;
}

.row ul li:before 
{
content: "";
position: relative;
left: -1em;
top: 15px;
background: #54928b;
display: table-cell;
width: 8px;
height: 8px;
border-radius: 50%;
list-style-position: inside !important;
}

/*----------------------------------*/

/*        FIXES FOR WIDGETS         */

/*----------------------------------*/

.row .widgets_on_page ul li:before 
{
width: 0 !important;
height: 0 !important;
margin-right: 0em !important;
}

/* removes bullets from widgets */
div.widgets_on_page li 
{
list-style:none !important;
background:none !important;
}

div.widgets_on_page ul 
{
margin-left: 0px !important;
margin-bottom: 0px !important;
margin-top: 0px !important;
}

/*--------------------------*/

/*        PRELOADER         */

/*--------------------------*/

.preloader1
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/mobile-icon-hover.png) no-repeat -9999px -9999px;
}

.preloader2
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/phone-icon-hover.png) no-repeat -9999px -9999px;
}

.preloader3
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/email-icon-hover.png) no-repeat -9999px -9999px;
}

/*-------------------------*/

/*    WORDPRESS IMAGES     */

/*-------------------------*/

.aligncenter,
div.aligncenter 
{
display: block;
margin: 0 auto;
}

.round
{
border-radius: 50%;
margin-bottom: 20px;
}

.alignleft 
{
float: left;
margin: 8px 15px 10px 0;
}

.alignright 
{
float: right;
margin: 8px 0 10px 15px;
}

.wp-caption 
{
margin-bottom: 10px;
padding: 5px 0 8px 0;
background-color: #D7D7DB;
}

.wp-caption p
{
font-size: 13px !important;
line-height: 1.3em !important;
margin: 0 5px 5px 5px !important;
}

.wp-caption img 
{
float: none;
margin: 0;
padding: 0 0 0 5px;
border: none;
}

.wp-caption p.wp-caption-text 
{
font-weight: 300;
font-size: 16px;
line-height: 1.7em;
text-align: center;
padding: 10px 0 0 0;
margin: 0;
}

img a
{
border: none !important;
text-decoration: none;
}

.inline-image
{
margin: 25px 0px;
}

#gallery-1 img 
{
border: none!important;
margin: 0 0 -30px !important;
padding: 0 !important;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
}

#gallery-1 img:hover
{
-webkit-filter: brightness(0.5) sepia(0.5);
-moz-filter: brightness(0.5) sepia(0.5);
filter: brightness(0.5) sepia(0.5);
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
}

#gallery-1 a
{
text-decoration: none !important;
border: none !important;
}

#gallery-1 a:hover
{
text-decoration: none !important;
border: none !important;
}

/*--------------------------*/

/*        FORM STYLE        */

/*--------------------------*/


p.form-text
{
line-height: 1.5em;
margin-bottom: 0px;
}

p.form-break
{
line-height: 3px;
}

p.form-space
{
line-height: 0px !important;
font-size: 2px !important;
}

input    
{
width: 285px;
display: block;
border: 1px solid #999;
height: 40px;
font-size: 16px;
}

button
{
font-size: 15px;
color: #FFF;
text-align: center;
line-height: 1em;
text-decoration: none;
background: #5AA145; 
opacity: 0.7;
transition: opacity .3s ease-in-out;
-moz-transition: opacity .3s ease-in-out;
-webkit-transition: opacity .3s ease-in-out;
padding: 12px 25px 16px 25px;
border-radius: 6px;
border: none;
}

button:hover
{
background: #5AA145;
color: #FFF;
opacity: 1.0;
transition: opacity .3s ease-in-out;
-moz-transition: opacity .3s ease-in-out;
-webkit-transition: opacity .3s ease-in-out;
cursor: pointer;
}

button:active
{
color: #FFF;
background: #537CC9;
}

p.button-text
{
text-align: center;
margin: 35px 0px 0px 0px;
}

/* - - - - - - - - - - - - */

/*      SIDE BAR MENU      */

/* - - - - - - - - - - - - */

h3.sidebar1
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-values.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar1:hover
{
background: #ece7df url(img/sidebar-values.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar2
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-clean.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar2:hover
{
background: #ece7df url(img/sidebar-clean.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar3
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-film.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar3:hover
{
background: #ece7df url(img/sidebar-film.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar4
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-science.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar4:hover
{
background: #ece7df url(img/sidebar-science.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar5
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-volunteer.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar5:hover
{
background: #ece7df url(img/sidebar-volunteer.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar6
{
font-size: 18px !important;
line-height: 1.3em !important;
padding: 11px 0 11px 58px;
background: #e3dcce url(img/sidebar-rbwg.png);
background-repeat: no-repeat;
background-position: 10px 6px;
margin-bottom: 0px !important;
border-bottom: 1px solid #bdae8e;
border-top: 1px solid #fff;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

h3.sidebar6:hover
{
background: #ece7df url(img/sidebar-rbwg.png);
background-repeat: no-repeat;
background-position: 10px 6px;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out;
text-decoration: none !important;
}

sidebar
{
text-decoration: none !important;
}


.sidebar-panel a
{
border-bottom: none !important;
text-decoration: none !important;
}

.sidebar-panel a:hover
{
border-bottom: none !important;
text-decoration: none !important;
}

/* - - - - - - - - - - - - */

/*      SOCIAL MEDIA       */

/* - - - - - - - - - - - - */

.social-wrapper
{
width: 175px;
float: right;
clear: right;
margin: 0 70px 0 0;
}

.social-facebook-icon
{
float: left;
width: 40px;
height: 40px;
margin: 0 5px 0 0;
background: url(img/social-facebook.png) top left no-repeat;
}

.social-facebook-icon:hover
{
background: url(img/social-facebook-hover.png) top left no-repeat;
}

.social-twitter-icon
{
float: left;
width: 40px;
height: 40px;
margin: 0 5px 0 0;
background: url(img/social-twitter.png) top left no-repeat;
}

.social-twitter-icon:hover
{
background: url(img/social-twitter-hover.png) top left no-repeat;
}

.social-instagram-icon
{
float: left;
width: 40px;
height: 40px;
margin: 0 5px 0 0;
background: url(img/social-instagram.png) top left no-repeat;
}

.social-instagram-icon:hover
{
background: url(img/social-instagram-hover.png) top left no-repeat;
}

.social-linkedin-icon
{
float: left;
width: 40px;
height: 40px;
margin: 0 0 0;
background: url(img/social-linkedin.png) top left no-repeat;
}

.social-linkedin-icon:hover
{
background: url(img/social-linkedin-hover.png) top left no-repeat;
}

.preloader1
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/social-facebook-hover.png) no-repeat -9999px -9999px;
}

.preloader2
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/social-twitter-hover.png) no-repeat -9999px -9999px;
}

.preloader3
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/social-instagram-hover.png) no-repeat -9999px -9999px;
}

.preloader4
{
clear: left;
float: left;
width: 1px;
height: 1px;
background: url(img/social-linkedin-hover.png) no-repeat -9999px -9999px;
}