/*   
Theme Name: GG Style
Theme URI: http://www.greengraphics.com.au/
Description: Nice theme. 
Author: Nathan
Author URI: http://www.greengraphics.com.au/
Version: 1.5.0
*/





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

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

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

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





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

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

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





@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700");

@import url("https://fonts.googleapis.com/css?family=Roboto:300,300italic,400,400italic,500,500italic,700,700italic");


* { 
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transition: all 0.3s ease;
       -moz-transition: all 0.3s ease;
            transition: all 0.3s ease;
    margin: 0;
    padding: 0;
}



li.menu-item, a.footer-link, a.button,
div#fancybox-wrap,
div#fancybox-wrap * {
    -webkit-transition: none;
       -moz-transition: none;
            transition: none;    
}




#header:after,
.menu:after,
#section:after,
#article:after,
#aside:after,
#footer:after,
#footer-list:after,
.clearer:after,
.wrapper:after {
    clear: both; 
    content: '.'; 
    display: block; 
    height: 0; 
    visibility: hidden;
}




.loading {
    background: url('images/loading.gif') no-repeat center center;
    min-height: 200px;
}


.wrapper {
    margin: 0 auto;
    max-width: 1080px;
}




/*.button {
    background: url(images/bg-red.png) repeat-y right top #d90119;   
    border-radius: 6px;
    color: white;
    display: inline-block;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 5px 0;
    padding: 10px;
    text-decoration: none;
    text-shadow: 1px 2px 2px black;
    text-transform: uppercase;
} */

.button {
    background: #d90119;   
    border-radius: 6px;
    color: white;
    display: inline-block;
    font-weight: 700;
    letter-spacing: 1px;
    margin: 18px 0 0;
    padding: 15px;
    text-transform: uppercase;
    transition: 0.5s ease-out;
}

a.button {
	text-decoration: none !important;
}


.button:hover {
    transform: scale(1.03);
    color: white;
box-shadow: 0px 1px 1px rgba(3, 7, 18, 0.02),
  0px 5px 4px rgba(3, 7, 18, 0.03),
  0px 12px 9px rgba(3, 7, 18, 0.05),
  0px 20px 15px rgba(3, 7, 18, 0.06),
  0px 32px 24px rgba(3, 7, 18, 0.08);

}



.button.go-to {
    border-radius: 6px 0 0 6px;
    clear: right;
    display: block;
    float: right;
    margin-right: -20px;
}



li.pagenav {
    list-style-type: none;
}



iframe {
    max-width: 100%;
}







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

/*!     ii - Body                                                             */

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





body {
    background: url(images/bg.png) repeat-x left top #313233;
	color: #303030;
	font-size: 62.5%;
	font-family: 'Roboto', Arial, Helvetica, Sans-Serif;
	font-weight: 400;
	overflow-x: hidden;
}





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

/*!     iii - Document Colors                                                 */

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





.color1 {
    color: #d90119;
}

.color2, a {
    color: #a02719;
}

.color3, a:hover {
    color: #000;
}



.color4 {
    color: #272828;
}

.color5 {
    color: #4f5051;
}

.color6 {
    color: white;
}





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

/*!     iv - Typography                                                       */

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





h1, h2, h3, h4, h5, h6 {
    font-family: 'Open Sans';
    font-weight: 400;
}


#header {
    font-size: 1.2em;
}




#article {
    font-size: 1.4em;
}


    #article h1 {
        font-size: 2.5em; /* 40px */
    }


    #article h2 {
        font-size: 1.875em; /* 30px */
    }
    
    
    #article h3 {
        font-size: 1.25em; /* 20px */
    }
    
    



#aside, #mobile-toggle {
    font-size: 1.6em;
}


    #quotes {
        font-size: 0.75em;
    }




#footer, #footer-buttons {
    font-size: 1.2em;
}




p {
    margin: 0 0 1em 0;
}





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

/*!     STRUCTURE START                                                       */

/*!     1. - Header                                                           */

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




#header {
    background: url(images/bg-red.png) repeat-y right top #d90119;
    border-top: 20px solid black;
    border-bottom: 20px solid black;
    margin-top: 15px;
    padding: 20px 0;
    position: relative;
    width: 100%;
}


    #small-logo {
        display: block;
        float: left;
        text-align: center;
        width: 27.5%;
    }


    #logo {
        display: block; 
        float: left;
        text-align: left;
        width: 72.5%;
    }






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

/*!     2. - Menus                                                            */

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





#mobile-toggle {
    background: url(images/bg-red.png) repeat-y right top #d90119;
    color: white;
    display: none;
    letter-spacing: 1px;
    padding: 10px 20px;
    text-decoration: none;
}


    #mobile-toggle img {
        margin: 0 10px;
        vertical-align: text-top;
        width: 20px;
    }



nav#main-menu {

}


    ul.menu,
    ul.sub-menu {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
    
    
        li.menu-item {
            border-bottom: 1px solid #f3f3f3;
            position: relative;
        }
        
        
            li.menu-item a {
                color: white;
                display: block;
                padding: 12px 15px;
                text-decoration: none;
                text-transform: capitalize;
            }
            
            
        li.menu-item:hover, li.current-menu-item, li.current-page-parent {
            background: url(images/bg-gray.png) repeat-y left top #4f5051;
            background-size: 100%; 
        }
        
        
        
        
    ul.sub-menu {
        border-top: 1px solid #f3f3f3;        
        background: #4f5051;
        display: none;
        position: absolute; top: -1px; left: 100%;
        white-space: nowrap;
        z-index: 1;
    }
    
    
    
    li.menu-item:hover ul.sub-menu {
        display: block;
    }




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

/*!     3. - Section                                                          */

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





#section {
    background: white;
    border-style: solid;
    border-width: 5px 0 0;
    -webkit-border-image: url(images/bg-c.png) 5 0 0 round repeat;
       -moz-border-image: url(images/bg-c.png) 5 0 0 round repeat;
         -o-border-image: url(images/bg-c.png) 5 0 0 round repeat;
            border-image: url(images/bg-c.png) 5 0 0 round repeat;
    position: relative;
}


.home #section {
    background: #dbdbdb;
}








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

/*!     4. - Article                                                          */

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





#article {
    float: right;
    margin: 0 0 193px 0;
    padding: 20px;
    width: 75%;
}

.home #article {
    min-height: 507px;
    padding: 30px 0;

}




    li.slide {
        position: relative;
    }
    
        
        .slide-image {
            margin: 30px 5%;
            width: 90%;
        }
    
    
        .slide-text {
            background: black;
            color: white;
            padding: 10px 15px;
            position: absolute; right: 2.5%; bottom: 0;
            text-align: center;
            width: 45%;
        }





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

/*!     5. - Aside                                                            */

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





#aside { 
    background: url(images/bg-red.png) repeat-y right top #d90119;
    color: white;
    float: left;
    width: 25%;
}




    #quotes {
        padding: 15px;
    }





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

/*!     6. - Footer                                                           */

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





    #footer-buttons {
        border-top: 1px solid rgba(0,0,0,0.15);
        position: absolute; right: 0; bottom: 0;
        width: 75%;
    }
    
    
        #footer-list {
            list-style-type: none;
            margin: 0;
            padding: 0;
        }
        
        
            .footer-list_item {
                float: left;
                text-align: center;
                width: 25%;
            }
            
            
                .footer-link {
                    background: white;
                    color: white;
                    display: block;
                    text-decoration: none;
                }
                               
                
                    .footer-link_image {
                        margin: 15px 0;
                        width: 60%;
                    }
                    
                    
                    .footer-link_text {
                        background: url(images/bg-gray.png) repeat-y left top #4f5051;
                        background-size: 100%;                         
                        display: block;
                        height: 75px;
                        position: relative;
                    }
                    
                    
                        .footer-link:hover .footer-link_text {
                            background: #4f5051;
                            color: white;
                        }                    
                    
                    
                        .footer-link_text p {
                            margin: 0;
                            padding: 0 15px;
                            position: absolute; top: 50%;
                            transform: translateY(-50%);
                            width: 100%;
                        }




#footer {
    border-style: solid;
    border-width: 5px 0 0;
    -webkit-border-image: url(images/bg-c.png) 5 0 0 round repeat;
       -moz-border-image: url(images/bg-c.png) 5 0 0 round repeat;
         -o-border-image: url(images/bg-c.png) 5 0 0 round repeat;
            border-image: url(images/bg-c.png) 5 0 0 round repeat;
    color: white;
    padding: 8px;
    position: relative;
    text-align: right;
	width: 100%;
}


#footer a {
    color: white;
    text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}


#bg-logo-left {
    background: url(images/bg-logo.png) no-repeat left bottom;
    opacity: 0.6;
    position: absolute; top: 0; bottom: 0; left: -2%;
    width: 50%;
    z-index: -1;
}


#bg-logo-right {
    background: url(images/bg-logo.png) no-repeat right top;
    opacity: 0.6;
    position: absolute; top: 0; right: -2%; bottom: 0;
    width: 50%;
    z-index: -1;
}