/*
 Theme Name:     Jengo 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{
	color: var(--white);
	background: var(--dark-grey);
}
/*home*/.page-id-23 ::selection{background: var(--rust)!important;}
/*profile*/.page-id-177 ::selection{background: var(--yellow)!important;}
/*projects*/.page-id-632 ::selection{background: var(--blue)!important;}
/*services*/.page-id-204 ::selection{background: var(--pink)!important;}
/*contact*/.page-id-645 ::selection{background: var(--green)!important;}

/* ------------------------------------------------------------------------- */
/* FONTS */
/* ------------------------------------------------------------------------- */

.font-600{font-weight:600;}

h1{font-weight:600;}

/* ------------------------------------------------------------------------- */
/* COLOURS */
/* ------------------------------------------------------------------------- */
:root {
	--white: #fff;
	--dark-grey: #1a1a1a;
	--pale-grey: #f2f2f2;
	--stone: #e7e2db;
	--grey: #9fa093;
	--blue: #186dec ;
	--green: #727639 ;
	--pink: #dd8a86;
	--yellow: #e79213 ;
	--rust: #94260a ;
}

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

/* ----- Remove Shadow on Main Header ----- */
#main-header, #main-header.et-fixed-header {
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
	box-shadow: none!important;
}

.jengo-title{}

@media only screen and (max-width:980px){
	.jengo-dot{
		display:none;	
	}
}

/* ------------------------------------------------------------------------- */
/* Different page colours */
/* ------------------------------------------------------------------------- */
.jengo-main-header{
	background: var(--grey);
}
/* homepage */ .page-id-23 .jengo-main-header, .page-id-23 .say-hello, .page-id-23 .jn-section-color{background: var(--pale-grey)!important;}
/* profile */ .page-id-177 .jengo-main-header, .page-id-177 .say-hello, .page-id-177 .jn-section-color{background: var(--blue)!important;}
/* projects */ .page-id-632 .jengo-main-header, .page-id-632 .say-hello, .page-id-632 .jn-section-color {background: var(--grey)!important;}
/* services */ .page-id-204 .jengo-main-header, .page-id-204 .say-hello, .page-id-204 .jn-section-color{background: var(--green)!important;}
/* contact */ .page-id-645 .jengo-main-header, .page-id-645 .say-hello, .page-id-645 .jn-section-color{background: var(--pink)!important;}
/* Links */ .page-id-796 .jengo-main-header, .page-id-796 .say-hello, .page-id-796 .jn-section-color{background: var(--rust)!important;}


/*change text colour on say-hello section + header  .page-id-632 .jengo-main-header, .page-id-632 .say-hello h1, .page-id-632 .say-hello h2, .page-id-632 .say-hello h3, .page-id-632 .say-hello h4, .page-id-632 .say-hello h5, .page-id-632 .say-hello h6{
	color:#f2f2f2!important;
}*/
/*change text colour on header navigation .page-id-632 .jengo-main-header .menu-item a, .page-id-632 .jengo-main-header .current-menu-item a{
	filter: invert(1);
}*/

/* ------------------------------------------------------------------------- */
/* Navigation */
/* ------------------------------------------------------------------------- */

.jengo-nav .menu-item{
	padding:0px 15px!important;
	margin:0px!important;
}
.jengo-nav .et-menu li>a{
		padding:0px!important;
	text-decoration:none!important;
}

/* hamburger icon*/
.et_divi_100_custom_hamburger_menu .mobile_menu_bar{
	margin-bottom:0px!important;
	padding:0px!important;
}
.et_divi_100_custom_hamburger_menu__icon{
	height:auto!important;
}

/* mobile menu */
@media only screen and (max-width:980px){
	.et_mobile_menu{
		position:absolute;
		left: calc(-30vw + 42px + 1.5vw);
		width:30vw;
		margin-top: 25px;
		border: 1px solid var(--white)!important;
		-webkit-box-shadow: none!important;
		-moz-box-shadow: none!important;
		box-shadow: none!important;
		padding:25px 35px!important;
	}
	.et_mobile_menu li a{
		border-bottom:none!important;
		padding:25px 0px!important;
	}
}
@media only screen and (max-width:550px){
	.et_mobile_menu{
		left: calc(-97vw + 42px + 1.5vw);
		width:97vw;
		text-align:center!important;
	}
}
/* ------------------------------------------------------------------------- */
/* BUTTONS */
/* ------------------------------------------------------------------------- */
.et_pb_button{
	padding:0px!important;
	margin:0px!important;
	text-decoration:none!important;
}

/* ------------------------------------------------------------------------- */
/* BODY */
/* ------------------------------------------------------------------------- */

/* full width image sections */
@media only screen and (min-width:980px){
	.jengo-image-sc{
		background-attachment:fixed!important;
	}
}
/* ---------HOME PAGE---------- */
/* grid */
.jengo-home-grid .et_pb_ajax_pagination_container{
	display:grid;
	grid-template-columns: repeat(6, 1fr);
	grid-column-gap: 2vw;
	grid-row-gap:2vw;
}
@media only screen and (max-width:1080px){
	.jengo-home-grid .et_pb_ajax_pagination_container{
		grid-template-columns: repeat(6, 1fr);
	}
}
@media only screen and (max-width:700px){
	.jengo-home-grid .et_pb_ajax_pagination_container{
		grid-template-columns: repeat(4, 1fr);
	}
	.jengo-home-grid .et_pb_portfolio_item_0_2{display:none!important;}
}

/* portfolio image */
/*porfolio image aspect ratio square 1:1*/

.jengo-home-grid .et_portfolio_image {
  padding-top: 150%;
  display: block;
}

.jengo-home-grid .et_portfolio_image img {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}

/* portfolio grid items */
.jengo-home-grid .et_pb_module_header{
	padding:7px 15px;
	text-align:left;
}
.jengo-home-grid .et_pb_portfolio_item{
	grid-column: span 2;
}


/* ---------PROJECTS PAGE---------- */

/* grid */
.jengo-project-grid .et_pb_ajax_pagination_container{
	display:grid;
	grid-template-columns: repeat(12, 1fr);
	grid-column-gap: 2vw;
	grid-row-gap:2vw;
}
@media only screen and (max-width:1080px){
	.jengo-project-grid .et_pb_ajax_pagination_container{
		grid-template-columns: repeat(6, 1fr);
	}
	.page-id-632 .jn-logo-row{display:none!important;}
}
@media only screen and (max-width:700px){
	.jengo-project-grid .et_pb_ajax_pagination_container{
		grid-template-columns: repeat(4, 1fr);
	}
}

/* portfolio image */
/*porfolio image aspect ratio square 1:1*/

.jengo-project-grid .et_portfolio_image {
  padding-top: 150%;
  display: block;
}

.jengo-project-grid .et_portfolio_image img {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}

/* portfolio grid items */
.jengo-project-grid .et_pb_module_header{
	padding:7px 15px;
	text-align:left;
}
.jengo-project-grid .et_pb_portfolio_item{
	grid-column: span 2;
}




/* 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;}

/* ------------------------------------------------------------------------- */
/* PROJECTS */
/* ------------------------------------------------------------------------- */
/* carousel images */
.mfp-bg{
	opacity:1!important;
	background: var(--dark-grey)!important;
}
.mfp-arrow{
	display:none!important;
}
.mfp-close {
    position: fixed;
    left: 0!important;
    top: 32px!important;
    font-size: 200px!important;
    opacity: 1!important;
    margin: 0px!important;
    padding: 0px!important;
    color: var(--pale-grey)!important;
	font-family: 'Open Sans',Arial,sans-serif!important;
    font-weight: 200!important;
}
.mfp-content{
	max-width:94%!important;
}
.mfp-counter {
    position: fixed;
	top:auto!important;
    bottom: 7px!important;
    right: 7px!important;
    left: 7px!important;
    color: var(--pale-grey);
    font-size: 30px;
    line-height: 1.4em;
    text-align: left!important;
    padding: 0px!important;
    margin: 0px!important;
    font-weight: 600;
}
.mfp-counter::before {
	content:"—";
}
.mfp-counter::after {
	font-size:14px;
	font-weight:400;
	content:" (click image to view more)";
}
.mfp-figure:after{-webkit-box-shadow:none!important;box-shadow:none!important;background:#fff!important;}


.jengo-project-carousel .owl-item img{
	filter: grayscale(100%);
	transition: 0.5s ease-in-out!important;
}
.jengo-project-carousel .owl-item img:hover{
	filter: grayscale(0%)!important;
}

.et_pb_section{
	background-color:var(--grey);
}
/* ------------------------------------------------------------------------- */
/* FOOTER */
/* ------------------------------------------------------------------------- */
#main-content {
	margin-bottom: 50px;
	z-index: 2;
}

@media only screen and (max-width:768px){
	#main-content{
		margin-bottom: 50vh;
	}
}
#main-footer, .et-l--footer {
    z-index: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
}

/* social follow */
.et_pb_social_media_follow li{
	margin-bottom:0px!important;
}
.et_pb_social_media_follow li a {
    margin-right: 0px!important;
}

/* ------------------------------------------------------------------------- */
/* LINKS */
/* ------------------------------------------------------------------------- */
a{
	transition-duration:.3s!important;
	transition-timing-function: ease-in-out!important;
}
a:link {text-decoration: underline;}
a:visited {}
a:hover {color:var(--rust);}
a:active {}

.white-links a{color: var(--white)!important;}

/* ------------------------------------------------------------------------- */
/* Login */
/* ------------------------------------------------------------------------- */
.tml, .tml a {
	font-weight: 600;
	font-style: normal;
	color:var(--pale-grey);
	font-size:18px;
}
/* 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 var(--pale-grey)!important;
	background-color: rgba(0,0,0,0.0)!important;
}

/* buttons */
.tml-button{
	padding: 0px; 
	background: rgba(0,0,0,.0);
	font-weight:600;
	font-size:30px;
	border:none!important;
	color: var(--white);
	transition-duration:.5s!important;
}
.tml-button:hover{
	color: var(--rust);
}

/* links */.tml-links{text-transform: capitalize; font-size: 12px;letter-spacing:0px;}
/* errors */.tml .tml-error {color: var(--rust); border: 1px solid var(--rust)!important;text-transform: capitalize; font-size: 18px;letter-spacing:0px;line-height:1.3em!important;box-shadow:none!important;padding:25px;}
/* Success */.tml .tml-success {color: var(--green);border: 1px solid var(--green)!important;text-transform: capitalize; font-size: 18px;letter-spacing:0px;line-height:1.3em!important;box-shadow:none!important;padding:25px!important;}

/* message */
.tml-message {color: var(--blue); border: 1px solid var(--blue)!important;text-transform: capitalize; font-size: 18px;letter-spacing:0px;line-height:1.3em!important;box-shadow:none!important;padding:25px!important;}

/* passwords */
#pass-strength-result.short {
    background-color: var(--pink);
    border-color: var(--pink);
    opacity: 1;
}
#pass-strength-result.bad {
    background-color: var(--rust);
    border-color: var(--rust);
    opacity: 1;
}
#pass-strength-result.good {
    background-color: var(--yellow);
    border-color: var(--yellow);
    opacity: 1;
}
#pass-strength-result.strong {
    background-color: var(--green);
    border-color: var(--green);
    opacity: 1;
}
/* ------------------------------------------------------------------------- */
/* MOBILE */
/* ------------------------------------------------------------------------- */