/*
    Template:       zuka
    Theme Name:     zedgrafix.com.au
    Theme URI:      http://themeforest.net/user/LA-Studio/portfolio?ref=LA-Studio
    Author:         LA Studio
    Author URI:     http://themeforest.net/user/LA-Studio?ref=LA-Studio
    Description:    Clean, Minimal WooCommerce Theme
    Version:        1.0.6
    Tags:           one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, post-formats, sticky-post, theme-options, translation-ready
    License: 		GNU General Public License
	License URI: 	licence/GPL.txt
    Text Domain:    zuka-child
    Domain Path:    /languages/
*/
:root{
	--color-brand: #f26b24; /* on ZED, this is primary, on Tonic, this is primary - use as var(--color-brand); */
	--color-brandAlt: #fdde00; /* inversed on above */
}

h1{
	/* yellow heading copy */
    color: var(--color-brand);
    font-weight: 500;

	/*
	font-size: 30pt;
    line-height: 40pt;
	*/
	font-size: 24pt;
    line-height: 30pt;
}

h2{
    color: #1c1652;
    font-weight: 500;
    font-size: 20pt;
    line-height: 28pt;
}

.introCopy{
/*    font-size: 22pt;
    line-height: 32pt;*/
	font-size: 20pt;
    line-height: 32pt;
    color: black;
}


p, ul, li{
    color: black;
    font-weight: lighter;
    /*font-size: 15pt;
    line-height: 25pt;*/
	font-size: 13pt;
    line-height: 22pt;
}

/* list bullet overrides */ 
#main ul{
    list-style-position: outside;
    margin-left: 1em;
}
#main ul li::marker {
    color:var(--color-brand);
}

#main ul.slides{
    margin-left:inherit;
}
.flexslider{
    border:0 !important;
}
.flex-direction-nav a:before{
    font-family: FontAwesome !important;
    color:white !important;
    opacity: 1 !important;
    
    content: "\f053" !important;
    content: "\f104" !important;
    /*color: var(--color-brand) !important;*/
}
.flex-direction-nav a.flex-next:before {
    content: "\f054" !important;
    content: "\f105" !important;
    
}
/* 
 * Menu overrides
 * */



 .regularText a{
    text-decoration: underline;
    color: #1c1652;
 }
 .regularText a:hover, .row.portfolio-nav a:hover{
    text-decoration: underline;
    color: #1c1652;
 }

 .row.portfolio-nav{
    display:none;
 }
/* button related */
/* this is to override the LA Button Compontents using as few settings as possible */ 

.btn.btn-style-flat.btn-color-primary{
    background-color: var(--color-brand);
    border: none;
    color: #1c1652;
    font-weight: 500;
    /* font-size: 13pt; */
    font-size: 14pt;
}

.btn.btn-style-flat.btn-color-primary:hover{
    color: var(--color-brand);
    border: none;
    background-color: #1c1652;
}

.btn.btn-style-flat.btn-color-primary.tonic{
    color: white;
    background-color: var(--color-brandAlt);
}
.btn.btn-style-flat.btn-color-primary.tonic:hover{
/*    background-color: #1c1652;*/
    background-color: var(--color-brandAlt);
}

/* custom menu overrides */
/* this means we're not using the header builder for styling, as it's a bit buggy */
.lahfb-row1-area{
    height:175px;
}




img.lahfb-logo {
    /*max-height: calc(290px / 2);*/
	max-height: calc(calc(290px / 2) * .75);
    width: auto;
    position: relative;}

.lahfb-area .lahfb-nav-wrap #nav > li.menu-item > a{
    /* font-size: 15pt; */
	font-size: 13pt;
    font-weight: 500;
}
.lahfb-area .lahfb-nav-wrap #nav > li.menu-item > a:hover{
    font-size: 13pt;
    font-weight: 500;
    color:var(--color-brand);
}


.lahfb-area .lahfb-nav-wrap #nav > li.menu-item.current > a{
    color:var(--color-brand);
    font-weight: 700;
}


.lahfb-area .lahfb-nav-wrap #nav > li.menu-item > a:before{
    display:none;
}

nav ul.sub-menu {
    padding: 15px 20px !important;
}
ul.sub-menu li.menu-item a{
	padding:0 !important;
}
ul.sub-menu li.menu-item a.hcolorf:hover,
ul.sub-menu li.menu-item.current a.hcolorf{
    color: var(--color-brand) !important;
	text-decoration:none !important;
}




/* main content structures */
section.folioCont{
    display: flex;
    flex-wrap: wrap;
    /*
    justify-content: space-around;
    */

}
section.folioCont .folioBlock.homepage, section.folioCont .folioBlock.homepage .overlayDiv{
    aspect-ratio: 2/1;
}

section.folioCont .folioBlock.homepage {
    /*
    width: 500px;
    height: 375px;
    float: left;
    margin: 10px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
*/

width: 32%;
    float: left;
    margin: 5px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
}


section.folioCont .folioBlock.homepage .overlayDiv {
    cursor: pointer;
    display: flex;
    align-content: center;
    flex-direction: column;
    justify-content: center;
    transition: background-color .15s linear;
    width: 100%;
}
section.folioCont .folioBlock.homepage .overlayDiv:hover{
    background-color: rgba(0,0,0,.7);
    transition: background-color .3s linear;
}

section.folioCont .folioBlock.homepage .overlayDiv div{
    opacity:0;
    transition: opacity .3s linear;
}

section.folioCont .folioBlock.homepage .overlayDiv:hover div{
    opacity:1;
    transition: opacity .3s linear;
}
section.folioCont .folioBlock.homepage .overlayDiv .title_short{
    color: var(--color-brand);
    font-size: 15pt;
    font-weight: 600;
    text-transform: uppercase;
    
}
section.folioCont .folioBlock.homepage .overlayDiv .byline{
    color: white;
    font-size: 14pt;
    font-weight: 500;
    text-transform: uppercase;
}






/* footer related */

footer .lhs {
    font-size: 22px;
    color: white;
    padding-left: 1em;
    padding-bottom: 0.5em;
}

footer .rhs {
    /*font-size: 16px;*/
	font-size: 11pt;
    color: white;
    text-align: right;
    padding-top: 50px;
}

.footer-top a {
    color: white;
}
.footer-top a:hover {
    color: var(--color-brand);
}

.copy {
/*font-size: 18px;*/
	/*font-size: 11pt;*/
}
.logo {
    float: right;
}
.logo img {
    max-width: 25px;
    margin-left: 0.5em;
}

.copyright {
    clear: both;
}


.vc_wp_custommenu.wpb_content_element.ourwork_menu {
    margin-bottom: 10px;
}
#menu-our-work-menu{
    display: flex;
    justify-content: space-between;
    
}
#menu-branding-menu{
    display: flex;
}
#menu-branding-menu li{
    padding-right:40px;
}
#menu-branding-menu a, #menu-our-work-menu a{
    color: #1c1652;
}
.current-menu-item{
    font-weight: bold;
}
#menu-branding-menu a:hover, #menu-our-work-menu a:hover{
    color: #1c1652;
    font-weight: bold;
}
.single-la_portfolio #nav li:nth-child(2) a {
    
}
.single-la_portfolio #nav li:nth-child(2) a.sf-with-ul{
	color: var(--color-brand) !important;
}
	    
}
.single-la_portfolio li#menu-item-200 a {
    font-weight: bold !important;
}
#menu-branding-menu .current{
    font-weight: bold;
}
/* hide mobile only stuff on desktop */
ul#nav li.menu-item-home{
	display:none;
}

.branding_menu{
    display:none;
}

.single-la_portfolio .branding_menu{
    display:flex;
}


/* mobile related CSS */
ul#responav li {
    text-align: center;
}
ul#responav li.current.menu-item a{
    color: var(--color-brand);
}
.lahfb-responsive-menu-wrap.open {
    width: 100%;
}
@media (max-width: 991px) {
  
    #menu-our-work-menu {
        flex-direction: column;
    }


section.folioCont {
    flex-direction: column;
}

section.folioCont .folioBlock.homepage{
    width:100%;
}

.row.portfolio-nav span {
    display: none;
}
}

@media screen and (max-width: 600px) {
	img.lahfb-logo.logo--normal {
		width: 125px;
		height: auto;
	}
	.lahfb-row1-area{
    	height:auto;
	}
	a.btn, button.btn.btn-size-sm{
        font-size: 10pt !important;
        padding: 5px 20px !important;
    }
	.footer-top{
		padding:0px;
        padding-top:10px;
        text-align: center;
	}
    .site-footer .widget {
        margin-bottom: 20px;
    }
    .footer-column-inner .rhs {
        text-align: center;
        padding:0;
    }
    .footer-column-inner .rhs .logo { /* the linkedIn logo */
        float: none;
    }
    #clientGrid .vc_grid-container{
        padding-left:0px !important;
        padding-right:0px !important;
    }
    #clientGrid .vc_col-sm-6,
	    #clientGrid .vc_col-sm-2{
        max-width: 33%;
        float: left;
    }

    #menu-branding-menu{
        flex-direction: column;
    }
    #menu-branding-menu li {
        padding-right: 0px;
        font-size: 10pt;
    }
    .wpb_gallery.wpb_content_element {
        margin-bottom: -20px;
    }

    .flexslider:not(.flexslider:first-child) {
        /*margin-top: 30px;*/
    }
	
	/* mobile menu related */ 
	
	#responav ul.sub-menu li.menu-item a {
		color: grey !important;
		font-size: 10pt !important;
		}
	
	
}