/*   
Theme Name: Major Trailors
Theme URI: http://www.greengraphics.com.au/
Description: Nice theme. 
Author: Nathan
Author URI: http://www.greengraphics.com.au/
Version: 1.5.6
*/


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


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

/*!     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                                                       */

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





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

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

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





.header:after,
.menu ul:after,
.section:after,
.article:after,
.post:after,
.latest-news:after,
.subscribe:after,
.aside:after,
.footer:after,
.clearer:after,
.clearfix:after,
ul[class$='list']:after,
.wrapper:after {
    clear: both; 
    content: '.'; 
    display: block; 
    height: 0; 
    visibility: hidden;
}



.wrapper {
    margin: 0 auto;
    max-width: 960px;
    position: relative;
}



.inline {
    display: inline;
}



input[type="submit"] { background: #064c7e; }
input[type="submit"]:hover { background: #c5533e; }







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

/*!     ii - Body                                                             */

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





body {
    background: #fff;
	color: black;
	font-size: 62.5%;
	font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
	font-weight: 400;
}





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

/*!     iii - Document Colors                                                 */

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





.color1, .footer a {
    color: #FFFFFF;
}

.color2 {
    color: #9db0c2;
}


.color3, a, .phone, .read-more.red {
    color: #064c7e;
}

.color4 {
    color: red;
}



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

/*!     iv - Typography                                                       */

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





h1, h2, h3, h4, h5, h6 {
    color: black;
    font-weight: 500;
    margin: 0 0 15px 0;
}


.article, .content {
    font-size: 1.5em;
    font-weight: 300;
}


    .article h1, .content h1 {
        color: #064c7e;
        font-size: 1.4em; /* 24px */
        font-weight: 700;
    }


    .article h2, .content h2 {
        font-size: 1.2em; /* 20px */
		color: #5071a2;
		margin-bottom:0;
        font-weight: 700;
    }
    
    
    .article h3, .content h3 {
        font-size: 1.3em; /* 20px */
		color: #5071a2;
       	font-weight: 700;
    }
    



.aside {
    font-size: 1.6em;
}

.footer {
    font-size: 1.3em;
}




a {
    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                                                           */

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

header {
	height:169px;
	width:100%;
	background: #081b31 url('images/header.png') repeat-x bottom;
}

	.topbar{
		color:#fff;
   		font-size: 1.3em;
		width:100%;
	}        
        
	.topbar .address{
		float:left;
		color:#9db0c2;
		max-width:60%;
		line-height:35px;
	}
	
	.topbar nav{
		float:right;
		max-width:40%;
	}

    .logo {
        left:0;
		margin:0;
		position:absolute;
		top:75px;
    }
    
    
    .phone {
        clear: left;
        float: right;
		text-align:right;
		font-size:2.5em;
		font-weight:normal;
		position:relative;
		top:20px;
		
    }
   .phone a, .phone a:hover{
		color:#9db0c2;
		text-decoration:none;
	}





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

/*!     2. - Menus                                                            */

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





.mobile-toggle {
    color: white;
    display: none;
    font-size: 20px;
    padding: 0px;
	float:left;

}


    .mobile-toggle img {
        vertical-align: -8%;
        width: 25px;
    }




.menu {   
    clear: both;
    position: relative;
    z-index: 1;
	top:37px;
    font-size: 1em;
    font-weight: 500;  
	float:right;
	max-width:685px;  
}
    .menu ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }


        .menu li {
            float: left;
            position: relative;
            text-align: center;
        }

	
		.menu li.hideme {
			display:none;
		}

            .menu li a {
                color: white;
                display: block;
                font-weight: 600;
                padding: 0px 16px;
				font-size:1.5em;
				border-right:1px solid #fff;
                text-transform: uppercase;
                -webkit-transition: all 0.3s ease;
                   -moz-transition: all 0.3s ease;
                        transition: all 0.3s ease;
            }
           .menu li#menu-item-29 a{
				padding-right:0;
				border-right:none;
			}
	
            .menu li a:hover {
                color: #9db0c2;
                text-decoration: none;
            }
            
            .menu li > ul {
                background: #27488E;
                border-radius: 0 0 6px 6px;
                display: none;
                position: absolute; top: 100%; right: 50%;
                text-align: center;
                -webkit-transform: translateX(50%);
                   -moz-transform: translateX(50%);
                        transform: translateX(50%);
                white-space: nowrap;
                z-index: 1;
            }
            
            .menu li:hover > ul {
                display: block;
            }
            
            
                .menu ul ul > li {
                    width: 100%;
                }


.top-menu {    
	float:right;
	padding:8px 0;
	position:relative;
}
    .top-menu ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }


        .top-menu li {
            float: left;
            position: relative;
            text-align: center;
			border-right:solid 1px #fff;padding: 0 10px;
        }

            .top-menu li a {
                color: white;
                display: block;
                font-weight: 300;
                text-transform: capitalize;
                -webkit-transition: all 0.3s ease;
                   -moz-transition: all 0.3s ease;
                        transition: all 0.3s ease;
            }
            .top-menu li:last-of-type{
				border-right:0px #fff solid;
				padding-right:0;
				}
            .top-menu li a:hover {
              color: #9db0c2;
                text-decoration: none;
            }
       

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

/*!     3. - Section                                                          */

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

.section {
    position: relative;
}

.mobilecontact {display:none;}

.mobileextras {display:none;}


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

/*!     4. - Article                                                          */

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

.content {
    float: right;
    padding: 30px 0;
    width: 100%;
}


.article {
    float: right;
    padding: 30px 0;
    width: 71%;
}

.full .article, .article.full {
    float: none;
    width: 100%;
}


    h1.page-title {
        margin: 0 0 15px;
    }
          
        .post {
            background: #f0ece7;
            margin: 0 0 30px 0;
            padding: 15px;
        }
        
                   .post-title {
                margin: 0 0 10px 0;
            }
            
        
        .post > p:last-of-type { margin: 0; }
        
.contenthome{
	background:#f5f5f8;
	width:100%;
}        
  
	.grid4{
		clear:both;
		width:100%;
		margin-top:0.5%;
	}

/* grid4 col */

		.grid4 .col {
			width: 24.62%;
		}

		.grid4 .col:nth-of-type(4n+1) {
			margin-left: 0;
			clear: left;
		}

/* col */

		.col {
			float: left;
			margin-left: 0.5%;
			margin-bottom: 0.5%;
			cursor: pointer;
			position:relative;
			padding:0;
			height:auto;
		}

		.col img{
			position:relative;
			width:100%;
			height:100%;
			z-index:10;
			padding:0;
		}

			.col .overlay{
				z-index:100;
				position:absolute;
				top:0;
				left:0;
				text-transform:uppercase;
				color:#fff;
				font-size:1.6em;
				font-weight: 600;
				width:100%;
				height:100%;
				background: rgba(0, 0, 0, 0.4); 
				opacity:0;
				-webkit-opacity:0;
				-moz-opacity:0;
				text-align:center;
				display: flex;
    			justify-content:center;
    			align-content:center;
    			flex-direction:column; /* column | row */
  				transition: opacity .25s ease-in-out;
   				-moz-transition: opacity .25s ease-in-out;
   				-webkit-transition: opacity .25s ease-in-out;
			}

			.col:hover .overlay { 
				opacity:1; 
				-webkit-opacity:1;
				-moz-opacity:1;
			}


			.col .overlay2{
				z-index:100;
				background: rgba(0, 0, 0, 0.4);
				position:absolute;
				bottom:0;
				padding: 5px 0;
				left:0;
				text-transform:uppercase;
				color:#fff;
				font-size:0.9em;
				font-weight: 600;
				width:100%;
				text-align:center;
			}

.home .content_left {
	width:70%;
}
.home .content_right {
	width:25%;
}

.home_resp {
	display:none;
}

.trading_hours {
	font-weight:600;
	color: blue;
}

.readmore {
	margin-top:20px;
}

	.readmore a{
		background: #064c7e;
		text-decoration:none;
		color: white;
		text-transform: uppercase;
		font-weight: 600;
		padding:5px 10px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
}

	.readmore a:hover{
		background: #081b31;
		text-decoration:none;
	}

.hr {
	border-top:1px #ccc dashed;
	margin:30px 0;
}

.post-image {
	float:right;
	margin-left:20px;
	margin-bottom:10px;
}
/******************************************************************************/

/*!     5. - Aside                                                            */

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

.aside {
    float: left;
    padding: 30px 0px;
    width: 25%;
}

.aside h2 {

}

.aside ul {
	padding: 0;
}

	.aside li {
		margin-bottom:3px;
		list-style-type: none;
	}

	.aside li a {
		color:#fff;
		text-transform:uppercase;
		display: block;
		background:#081b31;
		padding: 5px 10px;
		text-decoration: none;
		width: 100%;
		font-weight:600;
	}
	.aside li a:hover {
		background: #064c7e;
		color: #fff;	
	}

	.aside li.current-cat a{
		background: #064c7e;
		color: #fff;	
	}




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

/*!     6. - Footer                                                           */

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



    
    
ul.gform_fields {
    list-style-type: none;
    margin: 0;
    padding: 0;
}


    .contact .gfield_label, .contact-us .gfield_label {
        display: none;
    }
    
    
    .gfield textarea, .gfield input {
        width: 100%;
    }
    
    .gfield.col-4 {
        float: left;
        margin: 10px 2% 10px 0;
        padding: 0;
        width: 32%;
    }
    
    .gfield.col-4.last {
        margin-right: 0;
    }
    
    
    .gform_footer input[type="submit"] {
        border: none;
        color: white;
        cursor: pointer;
        float: right;
        font-size: 1em;
        font-weight: 500;
        padding: 8px 12px;
        text-align: center;
        text-transform: uppercase;
        width: 32%;
    }


.footer {
    background: #0e3e69 url('images/footer.jpg') repeat-x;
    color: white;
	padding: 20px 0;    
	width: 100%;
	font-size:1.2em;

}

    .footer-credits {
        float: left;
        width: 50%;
    }
	
	.footer-credits h2{
		color: white;
		line-height:150%;
		font-weight: 700;
		text-transform:uppercase;
		margin-bottom:0;margin-right:20px;
	}
    
	.footer-credits img{
		float:left;
		margin:10px 0;
	}
    
    .footer-designed {
        float: right;
        text-align: right;
        width: 50%;        
    }