/*   
Theme Name: ggstyle
Description: CSIRO Soil Strategy. 
Author: Nathan
Author URI: http://www.greengraphics.com.au/
Version: 1.0.0.1
Tags: left-sidebar, fluid-layout, responsive-layout, two-columns
Text Domain: ggstyle
*/





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

/*!     INDEX:                                                                */
/*!         i - Resets, Imports, Utilities, Misc                              */
/*!        ii - Body                                                          */
/*!       iii - Document Colors                                               */
/*!        iv - Typography                                                    */

/*!     STRUCTURE:                                                            */
/*!         1. - Header                                                       */
/*!         2. - Menus                                                        */
/*!         3. - Section                                                      */
/*!         4. - Article                                                      */
/*!         5. - Aside                                                        */
/*!         6. - Footer                                                       */
/*!         7. - Responsive                                                   */

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





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

/*!     i - Imports, Resets, Utilities, Misc                                  */

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




.search-form--label,
input.search-submit {
    display: inline-block;
}






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

/*!     ii - Body                                                             */

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





body {
	color: black;
	font-size: 14px;
	font-family: 'Open Sans', Arial, sans-serif;
	font-weight: 400;
	position: relative; right: 0;
	-webkit-transition: right 0.3s ease;
        	transition: right 0.3s ease;
}
body.top__menu--show {
    right: 200px;
}






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

/*!     iii - Document Colors                                                 */

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



a { color: #396114;}

a:hover { color: #447e0f;}

.color1, h1, h3 {
    color: rgb(105,71,52);
}
.color2, h2 {
    color: rgb(167,96,12);
}
.color3 {
    color: rgb(104,147,63);
}
.color4 {
    color: rgb(200,223,142);
}

}
.black, h4 {
    color: black;
}
.white {
    color: white;
}





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

/*!     iv - Typography                                                       */

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





h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 18px; }
.homeBox h3 {font-size: 32px;}
h4 { font-size: 16px; }

.top { font-size: 16px; }

.aside { font-size: 14px;}

.footer { font-size: 14px; }


blockquote { 
    background: #efefef;
    font-size: 14px; 
    font-style: italic;
    margin: 15px 0 25px 0;
    padding: 20px;
    max-width: 600px;
}


a, .mobile-toggle:hover { text-decoration: none; }
a:hover { text-decoration: underline; }

a[href*='tel:'] {
    font-weight: 700;
}

a.read-more {
    color: black;
    display: inline-block;
    font-style: italic;
    font-weight: 700;
}





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

/*!     STRUCTURE START                                                       */

/*!     1. - Header                                                           */

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




.top {
    border-bottom: 5px solid rgb(200,223,142);
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.55);
    padding: 32px 0 0;
}


    .top .container {
        background: white;
    }


    .top__deco {
        background: rgb(104,147,63);
        height: 145px;
        position: absolute; top: -32px; right: 100%;
        width: 50%;
        z-index: -1;
    }


    .top__logo {
        background: #67933f;
        border-radius: 0 0 12px 0;
        color: #ffffff;
        display: block;
        float: left;
        font-size: 18px;
        height: 145px;
        margin: -32px 32px 16px 0;
        padding: 32px 16px 16px 32px;
        width: 210px;
    }
    
    .top__logo:hover {
        text-decoration: none;
        color: #ffffff;
    }
    
    
    .search-form {
        clear: left;
        float: left;
        padding: 16px 0 16px 16px;
    }
    
    
        .search-form--label {
            margin: 0 5px 0 0;
        }
        
        
            .search-field,
            .search-form .search-submit {
                border-radius: 12px 0;
            }
            
   
        
    .search-form .search-submit {
	text-align: center;
	font-weight: bold; 
	padding: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-bottomright: 8px;
	border-top-left-radius: 8px;
	border-bottom-right-radius: 8px;
	background: rgb(104,147,63);
	color: white;
}

	.search-form .search-submit:hover {
	text-decoration: none;
	background: #2f530e;
    }




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

/*!     2. - Menus                                                            */

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





nav {
    
}


    nav ul {
        list-style-type: none;
        margin: 0 auto;
        max-width: 960px;
        padding: 0;
    }
    
    nav ul.menu, nav div.menu > ul {
        margin: 0 auto;
        padding: 0;
    }
        

        nav li {
            margin-bottom: 0;
            position: relative;
        }


            nav li a {
                border-radius: 12px 12px 0 0;
                color: rgb(104,147,63);
                display: block;
                font-weight: 600;
                margin-right: 3px;
                padding: 8px 12px;
                text-decoration: none;
                -webkit-transition: all 0.3s ease;
                   -moz-transition: all 0.3s ease;
                        transition: all 0.3s ease;
                white-space: nowrap;
            }
            
            nav li.memberlog a {display:none;}
            body.logged-in nav li.memberlog a {display:block;}
            
            nav li:hover > a, 
            nav li.current-menu-item > a, 
            nav li.current_page_item > a {
                background: rgb(200,223,142);
                color: black;
                text-decoration: none;
            } 
            
            
            nav li > ul {
                background: rgb(200,223,142);
                font-size: 14px;
                margin: 0;
                min-width: 100%;
            }
        
            
                nav li > ul li a {
                    border-radius: 0;
                    color: #2f530e;
                    padding: 10px;
                }
                
                nav li > ul li.memberlog a {display:none;}
                .logged-in nav li > ul li.memberlog a {display:block;}
                
            
      
    .menu-footer-container {
    	width: 30%; 
    	float: right;
    	text-align: right;
    	} 
         
    ul#menu-footer li {
        list-style-type: none;
        margin: 0 0 5px 0;
        padding: 0;
    }
    
     
            

                
                



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

/*!     3. - Section                                                          */

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





.section {
    
}  

.home .section.full {background: rgb(104,147,63);}

.section__image {width:100%;}


.beforeContent {
    overflow: hidden;
    position: relative;
    background: rgb(104,147,63);
}


    .section__title {
        color: white;
        font-size: 48px;
        font-weight: 400;
        margin: 0 auto;
        max-width: 960px;
        padding: 0 16px;
        position: absolute; right: 0; bottom: 32px; left: 0;
        text-shadow: 0 0 10px black;
    }
    
    .section__title--noImg,
    .section__title--home {
        margin: 32px 0;
        position: static;
    }
    
    .section__title--home {
        font-size: 40px;
        font-weight: 800;
        margin: 0 0 16px;
        text-align: right;
        text-transform: uppercase;
    }
    
    
    .section__subTitle {
        color: white;
        font-size: 30px;
        margin: 0 0 32px;
        text-align: right;
        text-shadow: 0 0 10px black;        
    }
    
    
    .section__image {
        max-width: none;
        min-height: 140px;
    }


    





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

/*!     4. - Article                                                          */

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





.article {
    padding: 16px;
}


    .homeBox {
        background: rgba(255,255,255,0.9);
        border-radius: 12px 0;
        margin: 0 0 32px;
        padding: 32px;
    }


   
.post__image {
    float: right;
    margin: 0 0 15px 15px;
    max-width: 30%;
}  

.post__image-default {
    border: 1px solid #dadada;
    border-radius: 6px;
} 

.article img {
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;
}
    

.post__details {
    font-size: 80%;
    margin: 0 0 15px;
}    


.readMore {
    clear: both;
    display: block;
    margin: 0 0 15px;
    text-align: right;
}



    .column--background {
        background: #e6e7e8;
        border-bottom: 5px solid #939598;
        margin: 0;
        padding: 15px;
    }
    
    .columnspread {clear: both;
    }



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

/*!     4a. - Members                                                         */

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

.button a {
	text-align: center;
	font-weight: bold; 
	padding: 12px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-bottomright: 8px;
	border-top-left-radius: 8px;
	border-bottom-right-radius: 8px;
	background: rgb(104,147,63);
	color: white;
	}
.button a:hover {
	text-decoration: none;
	background: #2f530e;
}

.button.big  {
	font-size: 1.2em;
	clear:both;
	margin-bottom: 12px;
}

.button.clear  {
	font-size: 1.1em;
	clear:both;
	margin-bottom: 12px;
}

.button.logout a { 
	width: 120px;
	float: right;
	margin-left: 20px;
	padding: 12px;
}

.button.logout a:hover {
}

.button li {
list-style-type: none;
margin: 0 0 12px 0;
padding: 0;
}

.links {font-size: 1.1em; margin: 0 0 6px 0;  }

.links li {
list-style-type: none;
margin: 0 0 12px 0;
padding: 0;
}


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

/*!     5. - Aside                                                            */

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





.aside {
    padding: 32px 16px;
}






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

/*!     6. - Footer                                                           */

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



.pageinate {
    clear: both;
    padding: 20px;
    text-align: center;
}


    .page-numbers {
        background: white;
        border: 1px solid black;
        border-radius: 3px;
        display: inline-block;
        font-size: 16px;
        font-weight: 700;
        padding: 5px 8px;
    }
    
    .page-numbers.current {
        background: #efefef;
    }
    
    .page-numbers.next, .page-numbers.prev {
        margin: 0 10px;
    }



.footerDeco {
    background: url(img/deco.png) no-repeat 15% top rgb(200,223,142);
    height: 75px;
}


.footer {
	background: white; 
    color: #396114;
	padding: 16px;    
	width: 100%;
}



    .social-icon {
        display: inline-block;
        margin: 0 0 0 5px;
        max-width: 25px;
        vertical-align: -25%;
    }




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

/*!     7. - Responsive                                                       */

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

@media (min-width: 768px) {


    .search-form {
        clear: none;
        float: right;
        padding: 0;
    }
     

    nav {
        background: none;
        padding: 0;
        position: absolute; top: 100%; left: 0; right: 0; bottom: auto;
        width: auto;
        z-index: 2;
    }

    
    nav li {
        display: inline-block;
    }
    
    
        nav li > ul {
            border-radius: 0 0 12px 0;
            box-shadow: 0 5px 5px 0 rgba(0,0,0,0.3);
            display: none;
            margin: 0;
            padding: 0;
            position: absolute; top: 100%;
            z-index: 2;
        }
        
        nav li.page_item_has_children:hover .children,
        .menu-item-has-children:hover > .sub-menu {
            display: block;
        }
        
        
        nav li > ul li a {
            padding: 10px 15px 10px 10px;
        }
        
        
                    
        
        
    .section__title {
        padding: 0 16px;
    }
        
        
    .article {
        float: left;
        padding: 32px 16px;
        width: 70%;
    }
    
    .aside {
        float: right;
        width: 30%;
    }
    
    .full .article, .article.full {
        float: none;
        padding: 32px;
        width: 100%;
    }
    
}

@media (min-width: 960px) {
    
    .top__menu {
        position: absolute; top: auto; right: 0; bottom: 0; left: auto;
        z-index: 1;
    }
    
        .top__menu li {
            display: block;
            float: left;
        }
        
        
        .top__menu .sub-menu li {
            float: none;
        }        
        
        
    .section__title {
        padding: 0;
    }
        
    
    .article {
        padding: 32px 16px 32px 0;
    }
    
    
    .full .article, .article.full {
        padding: 32px 0;
    }
    
}




/*! #######################################################################

	MeanMenu 2.0.7
	--------

	To be used with jquery.meanmenu.js by Chris Wharton (http://www.meanthemes.com/plugins/meanmenu/)

####################################################################### */

/* hide the link until viewport size is reached */
a.meanmenu-reveal {
	display: none;
}

/* when under viewport size, .mean-container is added to body */
.mean-container .mean-bar {
	position: relative;
	background: rgb(104,147,63);
}
.mean-bar:before, .mean-bar:after {clear: both; content: ' '; display: table;}


.mean-container a.meanmenu-reveal {
	color: #fff;
	cursor: pointer;
	display: block;
	float: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1px;
	font-weight: 700;
	height: 50px;
	line-height: 22px;
	padding: 13px 13px 11px 13px;
	text-decoration: none;
	text-indent: -9999em;
	width: 50px;
}
.mean-container a.meanclose {
    background: rgb(200,223,142);
}

.mean-container a.meanmenu-reveal span {
	display: block;
	background: #fff;
	height: 3px;
	margin-top: 3px;
}

.mean-container .mean-nav {
	background: rgb(200,223,142);
    position: absolute;
    top: 100%;
    right: 0; left: 0;
    z-index: 10;
}

.mean-container .mean-nav ul li {
	border-top: 1px solid rgba(255,255,255,0.25);
	border-bottom: 1px solid rgba(255,255,255,0.25);
    margin: 0;
}

.mean-container .mean-nav ul li a {
    border-radius: 0;
	color: #fff;
	margin-right: 50px;
	padding: 15px;
}

.mean-container .mean-nav ul li li a {
	width: 80%;
	padding: 1em 10%;
	opacity: 0.75;
	filter: alpha(opacity=75);
	text-shadow: none !important;
	visibility: visible;
}

.mean-container .mean-nav ul li.mean-last a {
	border-bottom: none;
	margin-bottom: 0;
}

.mean-container .mean-nav ul li li li a {
	width: 70%;
	padding: 1em 15%;
}

.mean-container .mean-nav ul li li li li a {
	width: 60%;
	padding: 1em 20%;
}

.mean-container .mean-nav ul li li li li li a {
	width: 50%;
	padding: 1em 25%;
}

.mean-container .mean-nav ul li a:hover {
	background: #252525;
	background: rgba(255,255,255,0.1);
}

.mean-container .mean-nav ul li a.mean-expand {
	background: rgba(255,255,255,0.1);
	border-left: 1px solid rgba(255,255,255,0.4);
	height: 50px;
	line-height: 1;
	margin: 0;
	padding: 15px;
	text-align: center;
	position: absolute;
	right: 0;
	top: 0;
	width: 50px;
	z-index: 2;
}

.mean-container .mean-nav ul li a.mean-expand:hover {
	background: rgba(0,0,0,0.9);
}

.mean-container .mean-push {
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
	clear: both;
}


.mean-remove {
	display: none !important;
}