/*
 Theme Name:     Joe Walkling Child theme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Child Theme
 Author:         Joe Walkling
 Author URI:     https://www.joewalkling.com
 Template:       Divi
 Version:        1.0.0
*/
 
/* ------------------------------------------------------------------------- */
/* -------------------- Theme customization starts here -------------------- */
/* ------------------------------------------------------------------------- */
::selection{
	background: yellow;
}

/* ------------------------------------------------------------------------- */
/* FONTS */
/* ------------------------------------------------------------------------- */
body{
	font-family: 'sofia-pro', sans-serif;
	font-weight: 300;
	font-style: normal;
}

h1{
	font-family: 'sofia-pro', sans-serif;
	font-weight: 700;
	font-style: normal;
	letter-spacing:-0.05em;
}


/* ------------------------------------------------------------------------- */
/* COLOURS */
/* ------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------- */
/* HEADER */
/* ------------------------------------------------------------------------- */

/* ----- Remove Shadow on Main Header ----- */
#main-header.et-fixed-header {
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
	box-shadow: none!important;
}
/* fixed header on tablet and mobile */
@media only screen and (max-width:768px){
	#main-header {position:fixed!important;z-index:999999!important;}
	.et-fixed-header #logo{}
	.et_menu_container {width:94%!important;}
}

/* remove logo on mobile / tablet */
@media only screen and (max-width:980px){
	#logo {display:none!important;}
}
/* ------------------------------------------------------------------------- */
/* Navigation */
/* ------------------------------------------------------------------------- */
/* slide in*/
.et_pb_fullscreen_nav_container{
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	height:100vh;
}

/* slide in navigation width */
.et_header_style_slide .et_slide_in_menu_container {
    padding: 0px !important;
    top: 0px!important;
    width: 50vw!important;
    max-width: 100%!important;
}
/* menu width and padding */
.et_mobile_menu{
	padding: 100px 9vw 100px!important;
}
/* slide in typography */
.et_mobile_menu li a{
	font-size:5vw!important;
	line-height:0.8em!important;
	font-weight:700!important;
}
.et_mobile_menu li a:hover{
	text-decoration:underline;
	opacity:1!important;
}
@media only screen and (max-width:980px){
	.et_mobile_menu li a{
		font-size:7vw!important;
	}
}

@media only screen and (max-width:479px){
	.et_mobile_menu li a{
		font-size:9vw!important;
	}
}

/* slide in navigation width on tablet and mobile */
@media only screen and (max-width:768px){
	.et_header_style_slide .et_slide_in_menu_container {
		width: 100vw!important;
	}}
/* slide in navigation width on tablet */
@media only screen and (max-width:479px){
	.et_mobile_menu{padding: 80px 14% 50px!important;}
}


/* HAMBURGER */
/* width on desktop */
.mobile_menu_bar.et_pb_header_toggle {width: 6vw!important;}
/* width on tablet */
@media only screen and (max-width:768px){.mobile_menu_bar.et_pb_header_toggle {width: 8vw!important;}}
/* width on mobile */
@media only screen and (max-width:479px){.mobile_menu_bar.et_pb_header_toggle {width: 16vw!important;}}

/* height*/.et_divi_100_custom_hamburger_menu__icon div{height: 2px!important;}
/* hide centre */.et_divi_100_custom_hamburger_menu__icon.et_divi_100_custom_hamburger_menu__icon div:not(:first-child):not(:last-child) {opacity: 0 !important;}
/* colour on fixed*/.et-fixed-header .et_divi_100_custom_hamburger_menu__icon div {background: #fff!important;}

/* invert hamburger */
#main-header{
	mix-blend-mode:difference;
}
/* ------------------------------------------------------------------------- */
/* BODY */
/* ------------------------------------------------------------------------- */

/* divi adds margin to columns */
@media (max-width: 980px){
.et_pb_column .et_pb_module {
    margin-bottom: 0px!important;
}
}

/* flex vertical align */
.jw-flex-center{display:flex;flex-direction: column;justify-content:center;}
.jw-flex-end{display:flex;flex-direction: column;justify-content:flex-end;}
.jw-flex-start{display:flex;flex-direction: column;justify-content:flex-start;}


/* ------------------------------------------------------------------------- */
/* Creative page */
/* ------------------------------------------------------------------------- */
#creative-grid .et_pb_ajax_pagination_container{
	display: grid;
	grid-template: auto / repeat(4 , 1fr);
	grid-gap: 15px;
	pointer-events: none !important;
}
#creative-grid .et_pb_post{
	margin-bottom: 0px !important;
}
#creative-grid h2{
	font-size: 24px !important;
}
#creative-grid .post-meta, #creative-grid p{
	font-size: 14px !important;
	line-height: 1.2em !important;
}
#creative-grid .entry-featured-image-url{
	margin-bottom: 15px !important;
	padding-top: 150%;
  	display: block;
}
#creative-grid .entry-featured-image-url img {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;left: 0;right: 0;bottom: 0;
	object-fit: cover;
}
@media only screen and (max-width: 980px){
	#creative-grid .et_pb_ajax_pagination_container{
		grid-template: auto / repeat(3 , 1fr);
	}
	#creative-grid h2{
		font-size: 20px !important;
	}
	#creative-grid .post-meta, #creative-grid p{
		font-size: 12px !important;
	}
}
@media only screen and (max-width: 768px){
	#creative-grid .et_pb_ajax_pagination_container{
		grid-template: auto / repeat(2 , 1fr);
		grid-column-gap: 5px;
		grid-row-gap: 15px;
	}
	#creative-grid h2{
		font-size: 16px !important;
	}
	#creative-grid .post-meta, #creative-grid p{
		font-size: 10px !important;
		line-height: 1.3em !important;
	}
}

/* ------------------------------------------------------------------------- */
/* PORTFOLIO */
/* ------------------------------------------------------------------------- */

/* Performer Images */
/* container */
.mfp-bg{
	background:#000!important;
	opacity:1!important;	
}
/* bottom bar*/
@media only screen and (min-width:980px){
	.mfp-bottom-bar{
		position:fixed;
		width:auto;
		top:1vh;
		left:1vw;
	}
}
/* title */
.mfp-title{
	font-size:7vw!important;
	line-height:1.4em!important;
	color:#fff!important;
	font-weight:700;
	letter-spacing:-0.07em!important;
}
/* captions */
.dss_masonry_gallery_caption{
	white-space:pre-wrap!important;
	font-size:20px!important;
	color:#fff!important;
	font-weight:300!important;
	line-height:1.2em!important;
	letter-spacing:0em!important;
}
/*close */
.mfp-close{    
	position: fixed!important;
	top:0!important;
	left:0!important;
	font-size: 20vw!important;
	line-height:0.5em!important;
    opacity: 1!important;
}
.mfp-counter{
	display:none!important;
}
/* ------------------------------------------------------------------------- */
/* LINKS */
/* ------------------------------------------------------------------------- */
a:link {
	font-weight:700!important;
}
a:hover {
	text-decoration:underline;
}

/* ------------------------------------------------------------------------- */
/* Login */
/* ------------------------------------------------------------------------- */
.tml {
	font-family: sans serif;
	font-weight: 300;
	font-style: normal;
}
/* remember me*/.tml-field-wrap.tml-rememberme-wrap{text-transform: capitalize!important; font-size: 12px!important;letter-spacing:0px!important;}
/* fields */.tml .tml-field{padding:15px 25px;border:1px solid #c0beae;}
/* buttons */.tml-button{text-transform:uppercase!important;padding: 15px 25px; border: 1px solid #9fa093; background: #fff;	letter-spacing:0.1em;}.tml-button:hover{background-color: #000; border: 1px solid #000; color: #f6f6f4;}
/* links */.tml-links{text-transform: capitalize; font-size: 12px;letter-spacing:0px;}
/* errors */.tml .tml-error {border: 1px solid #dc3232!important;text-transform: capitalize; font-size: 12px;letter-spacing:0px;line-height:1.3em!important;box-shadow:none!important;}
/* Success */.tml .tml-success {border: 1px solid #00a0d2!important;text-transform: capitalize; font-size: 12px;letter-spacing:0px;line-height:1.3em!important;box-shadow:none!important;}

/* ------------------------------------------------------------------------- */
/* MOBILE */
/* ------------------------------------------------------------------------- */