/* 
Theme Name ORIG: Hello Elementor Child
Theme Name: Cohasset Group Limited
Theme URI: https://cohassetgroup.co.nz
Description: Cohasset Group Limited | Child theme, do not deactivate or delete
Author: MRD Web + Digital Marketing
Author URI: https://www.mrd.co.nz
Template: cohassetgroup
Version: 1.0.1
Text Domain: cohassetgroup-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

@import url("../cohassetgroup/style.css");



/* Theme customization starts here
============================================================== */


.elementor-widget-archive-posts article{
	background-color: #fff;
}

.elementor-widget-archive-posts article .elementor-post__text{
	padding: 25px 40px 50px 40px;		
}


/* LI
============================================================== */


.elementor-nav-menu li {
    margin-bottom: 0px !important;
}

li {
    margin-bottom: 10px !important;
}

/* LI END
============================ */





/* STICKLY HEADER
==================================================== */

/***
* Shrinking Sticky header, no container edition
* class: .sticky-header
* Uses the built-in .elementor-container class for shrinking the header in non-container installs
*/
header.sticky-header {
	--header-height: 100px; /* Set your own header height */
	--shrink-header-to: 0.8; /* Shrinks to 60%, values: 0.1 to 1 */
	--transition-timing: .45s cubic-bezier(.4, 0, .2, 1); /* values: .1s to 0.5s (or more), replace "cubic-bezier(.4, 0, .2, 1)" with "ease" if you need a simpler transition */
	background-color: rgba(f, f, f, 1); /* Set your own background color */
	transition: background-color var(--transition-timing),
				backdrop-filter var(--transition-timing),
				box-shadow var(--transition-timing);
}
header.sticky-header.elementor-sticky--effects {
	background-color: rgba(f, f, f, 1); /* Set your own background color on scroll */
	box-shadow: 0px 4px 33px 1px rgba(0, 0, 0, .09); /* Delete this line if you don't want shadow on scroll */
	-webkit-backdrop-filter: saturate(180%) blur(20px); /* Delete this line if you don't use transparency on scroll */
	backdrop-filter: saturate(180%) blur(20px); /* Delete this line if you don't use transparency on scroll */
}
header.sticky-header > .elementor-container {
	min-height: var(--header-height);
	transition: min-height var(--transition-timing);
}
header.sticky-header.elementor-sticky--effects > .elementor-container {
	min-height: calc( var(--header-height) * var(--shrink-header-to) );
}

/***
* class: .logo
* Add the class "logo" to your logo to scale your logo to 80% on scroll
*/
header.sticky-header .logo img,
header.sticky-header .logo.elementor-widget-theme-site-logo img,
header.sticky-header .logo .elementor-icon svg {
	--logo-height: 116px; /* This should be the original logo height _before_ being shrunk */
	--logo-shrink-to: 0.85; /* Shrinks logo to 80%, values: 0.10 to 1.00, where 1.00, as in 100%, won't shrink the logo */
	height: var(--logo-height);
	transition: height var(--transition-timing);
}
header.sticky-header.elementor-sticky--effects .logo img,
header.sticky-header.elementor-sticky--effects .logo.elementor-widget-theme-site-logo img,
header.sticky-header.elementor-sticky--effects .logo .elementor-icon svg {
	height: calc(var(--logo-height) * var(--logo-shrink-to));
}
header.sticky-header .logo .elementor-icon svg {
	width: auto !important;
}

header.sticky-header .logo img {
	width: auto !important;
}

/***
* Optional: Shorter header on mobile
*/

@media only screen and (max-width: 767px) {
	
	header.sticky-header,
	header.sticky-header.e-container.elementor-element {
		--header-height: 65px !important;
	}
	
	
	header.sticky-header .logo img, header.sticky-header .logo.elementor-widget-theme-site-logo img {
	    --logo-height: 85px !important;
	    --logo-shrink-to: 0.95 !important;
	    height: var(--logo-height);
	    transition: height var(--transition-timing);
	}
	
	header.sticky-header .elementor-nav-menu--dropdown .elementor-nav-menu__container li a {
		text-align: center !important;
	}


}

@media only screen and (max-width: 360px) {
	header.sticky-header .logo img, header.sticky-header .logo.elementor-widget-theme-site-logo img {
	    --logo-height: auto !important;
	}	
	
}

@media screen and (max-width: 767px) {
	header.sticky-header .elementor-widget-wrap{
	    display: grid!important;
	    grid-template: 1fr / 1fr 40px;
	}
	header.sticky-header img{	
		height: auto;
	}
}

/* STICKLY HEADER END
================================= */


/* SLIDER HEADER
==================================================== */



/* SLIDER HEADER END
================================= */



/* ICON LIST
============================================================== */


.elementor-widget .elementor-icon-list-item .elementor-widget .elementor-icon-list-item a {
    align-items: normal !important;
}

/* ICON LIST END
============================ */








/* HOUSING ENQUIRY FORM
============================================================== */


#housing-enquiry .elementor-kit-5 button, .elementor-kit-5 input[type="button"] {
	background-color: #eaeaea;
    border-radius: 0px 0px 0px 0px;
    padding: 6px 0px 6px 0px !important;
}

#housing-enquiry .elementor-kit-5 button, .elementor-kit-5 input[type="button"]:hover {
	background-color: #841A36;
    border-radius: 0px 0px 0px 0px;
    padding: 6px 0px 6px 0px !important;
}

/* HOUSING ENQUIRY FORM END
============================ */






/* FOOTER
============================================================== */


.elementor-715 .elementor-element.elementor-element-36fe427 {
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    padding: 60px 0px 60px 0px;
}

.footer-links a {
    color: #b57686 !important;
}

.footer-links a:hover {
    color: #fff !important;
}


/* FOOTER END
============================ */







/* HOMEPAGE DESIGN VIDEO GRID
============================================================== */



/* MEDIA QUERIES */

	@media (max-width: 767px) {
      selector {margin: 10px;}
	}


	@media screen and (min-width: 768px) and (max-width: 1400px) {
      selector {margin: 20px 40px 40px;}
	}

@media screen and (min-width: 1401px) and (max-width: 1440px) {
      selector {margin: 20px 40px 40px;}
	}

	@media (min-width: 1441px) {
      selector {margin: 20px 60px 60px;}
	}
	



@media screen and (max-width: 1024px) {
    .my-main {
        height:40vh!important;
    }
    .my-alternate {
        height:14vh;
    }
    .my-secondary {
        height:14vh;
    }
}

@media screen and (min-width: 1025px) {
    .my-secondary {
        height:40vh;
    }
}



/* HOMEPAGE DESIGN VIDEO GRID END
============================ */