/*
 Theme Name:   CCTV
 Theme URI:    https://www.cctv.co.uk
 Description:  WordPress theme for CCTV.co.uk
 Author:       Mantra Design
 Author URI:   https://www.mantra.co.uk
 Template:     generatepress
 Version:      1.0
*/

/* TYPOGRAPHY */

body {
	-webkit-font-smoothing: antialiased;
    -webkit-font-kerning: normal;
    font-kerning: normal;
    font-feature-settings: "kern" 1,"pnum" 1, "ss01" 1;;
}
h1.call-us {
	font-weight: 600;
	margin-bottom: 10px;
}
h2.call-us {
    font-size: 2.325rem;
    font-weight: 600;
    color: var(--brand-two);
}
h3.town {
	color: var(--brand-two);
    font-weight: 500;
    font-size: 1.85rem;
    letter-spacing: -0.25px;
    line-height: 2.5rem;
}
h4.categories {
	margin-bottom: 30px!important;
}
h6.quote-form {
	color: #fff;
}
h3.content {
    font-weight: 300;
    font-size: 2.625rem;
    letter-spacing: -0.75px;
    line-height: 3rem;
}
div.gb-headline {
    margin-bottom: 20px;
	color: var(--headline);
}
p.intro, p.cta-headline {
	color: var(--headline);
}
p.quote-form {
	color: #fff;
	padding-top: 4px;
}
ul.geo-links {
    margin: 0;
    list-style: none;
    font-weight: 600;
    line-height: 2.15rem;
    font-size: 1.125rem;
}
span.postcode-result {
	text-transform: uppercase;
    color: var(--brand-three);
    font-weight: 600;
}
p.footer-cta a {
	color: #fff;
}
p.footer-cta a:hover {
	color: var(--brand-one);
}
p.acf-lists {
    margin-bottom: -5px;
	margin-left: -5px;
	font-size: 1.125rem;
}
.town-icon figure {
	flex-shrink: 0;
}


/* HEADER */

.site-logo a {
	text-decoration: none;
}
.inside-header {
	align-items: flex-start;
}
.tel-no a {
	font-size: 2rem;
	font-weight: 700;
	color: var(--headline)!important;
	letter-spacing: -.4px;
	margin-right: 30px;
	padding: 0!important;
	line-height: 70px!important;
}
.tel-no a:hover {
	color: var(--headline)!important;
}
.cctv-menu svg {
	height: 70px;
	width: 70px;
	fill: var(--headline);
	padding: 0!important;
	top: 0!important;
}
.cctv-menu svg:hover {
	fill: var(--text-light);
}
.cctv-menu-close svg {
	height: 70px;
	width: 70px;
	fill: var(--headline);
	padding: 0!important;
	top: 2.5px;
}
.cctv-menu-close svg:hover {
	fill: var(--text-light);
}
.site-logo {
    position: relative;
}

/*  
.site-logo:hover .logo-desktop-hover,
img.logo-desktop-regular {
    opacity: 1;
    transition: all .2s ease-in-out;
}
.site-logo:hover .logo-desktop-regular,
img.logo-desktop-hover {
    opacity: 0;
    transition: all .2s ease-in-out;
}
header .site-logo {
    display: grid;
}
.site-logo a {
    grid-column: 1;
    grid-row: 1;
}
*/


/* NAVIGATION */

#generate-slideout-menu.main-navigation.offside {
    width: var(--slideout-width);
}

#generate-slideout-menu.main-navigation.offside--left {
    left: calc(-1 * var(--slideout-width));
}

#generate-slideout-menu.main-navigation.offside--left.is-open {
    transform: translate3d(var(--slideout-width), 0, 0);
}
.slideout-navigation button.slideout-exit {
	padding-top: 0px!important;
}
.main-navigation .menu-bar-item>a {
	line-height: 35px;
}
.gb-button-style-one, .gb-button-style-two {
	font-size: 1.2rem;
	font-weight: 700;
}
#generate-slideout-menu {
	padding: 40px;
}
#generate-slideout-menu.main-navigation .main-nav ul ul {
	margin: 5px 0px 15px 25px;
}
.menu-bar-item.slideout-toggle {
    display: block !important;
}
button.menu-toggle {
    display: none !important;
}
.main-navigation ul ul {
	box-shadow: none;
}
.slideout-overlay {
	background-color: rgba(0,0,0,.5)!important;
}


/* CONTENT */

.nobr {
	white-space: nowrap;
}
.cursor-hover {
	cursor: pointer;
}
.no-margin {
    margin-bottom: 0px;
}
.margin-5 {
    margin-bottom: 5px;
}
.margin-bottom-0 {
	margin-bottom: 0px;
}
.margin-bottom-15 {
	margin-bottom: 15px;
}
.margin-bottom-30 {
	margin-bottom: 30px;
}
.margin-bottom-45 {
	margin-bottom: 45px;
}
.wp-block-separator {
	border: none!important;
}
ol, ul {
    margin: 0 0 30px 2.5rem;
}
.tick-list {
	margin-bottom: 0;
	font-weight: 600;
}
.tick-list-bold {
	font-weight: 700;
}
.call-us-table table {
	margin-bottom: 0px!important;
	border: none;
}
.call-us-table .wp-block-table td, .call-us-table .wp-block-table th {
	border: none;
	padding: 4px;
}
.vimeo-icon a:after {
    content: "";
    background: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity 500ms ease;
}
.vimeo-icon a:hover:after {
    opacity: 1;
}
.cctv-card {
	box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 3px;
}

/* QUERY LOOP */

.news-img {
	overflow: hidden;
}
.news-img .gb-block-image, .news-archive-card .gb-block-image {
    overflow: hidden;
}
p.post-title {
	margin-bottom: 10px;
}
.news-archive-card h3 a {
	text-decoration: none;
}
.news-archive-card h3 a:hover {
	text-decoration: underline;
}


/* GRAVITY FORMS */

body img.gform_ajax_spinner, .gform_heading {
	display: none !important;
}
.gfield_description {
	display: none;
}
.footer-quote-form .gform_footer input[type=submit] {
	width: 50%;
}
.gform_footer input.button, .gform_wrapper input[type=submit] {
    align-items: center;
    justify-content: center;
    background-color: var(--button-1);
    color: var(--headline);
    text-align: center;
    padding: 18px 34px 20px;
    border-radius: 50px;
    font-size: 1.2rem;
    font-weight: 700;
	transition: all 0.2s ease;
}
.gform_footer input.button:hover, .gform_wrapper input[type=submit]:hover {
	background-color: var(--button-1-hover);
}
.postcode-form input[type=submit] {
	margin-left: 14px;
    padding: 18px 60px 20px;
}
.postcode-form .gfield input[type=text] {
	font-size: 1.25rem;
    padding: 18px;
    border-radius: 5px;
    border-color: #b4b4b4;
	font-weight: 600;
	color: var(--headline);
	text-transform: uppercase;
}
.footer-quote-form .gfield input, .footer-quote-form textarea {
	font-size: 1rem!important;
    padding: 12px!important;
    border-radius: 4px;
    border-color: #ffffff;
    font-weight: 500;
    color: #000000;
}
.footer-quote-form .gfield_label {
	color: #ffffff!important;
    font-size: 1rem!important;
    margin-bottom: 2px!important;
    letter-spacing: 0.1px;
    font-weight: 600!important;
}
.footer-quote-form .gfield_required_asterisk {
	color: #ffffff!important;
    font-size: 1.125rem!important;
    padding-left: 2px!important;
    font-weight: 300!important;
}
.gform_wrapper.gravity-theme .gform_fields {
	grid-row-gap: 10px!important;
	grid-column-gap: 20px!important;
}
.gform_wrapper.gravity-theme .ginput_complex:not(.ginput_container_address) span:not([style*="display:none"]):not(.ginput_full) {
	padding-right: 0!important;
}


/* GRAVITY FORM PLACEHOLDERS */

::-webkit-input-placeholder { text-transform: none; }
:-moz-placeholder { text-transform: none; } /* Firefox 18- */
::-moz-placeholder { text-transform: none; } /* firefox 19+ */
:-ms-input-placeholder { text-transform: none; } /* ie */
input:-moz-placeholder { text-transform: none; }


/* MODAL POPUPS */

.nelio-popup {
	background-color: transparent;
	padding: 0px!important;
}
.nelio-popup-close-button--is-top-right {
	top: -60px;
	right: 0px;
}
.nelio-popup-close-button {
	padding: 0!important;
}
.nelio-popup-close-button .dashicons, .dashicons-before:before {
	height: 40px!important;
	width: 40px!important;
}
span.dashicons.dashicons-no.nelio-popup-close-button-icon:before {
	content: url(/wp-content/uploads/Close-icon.svg);
}



@media (max-width: 768px) {
    /* MOBILE-SPECIFIC */
	:root {
    --slideout-width: 100vw;
	--gp-slideout-width: 100vw!important;
    }
	.gb-container-aa7c40db {
		background-size: 1400px!important;
	}
	.cctv-menu svg {
		height: 60px;
		width: 60px;
	}
	.postcode-form input[type=submit] {
		width: 100%!important;
		margin-left: 0px!important;
		padding: 22px 60px 24px!important;
	}
	.postcode-form .gfield.gfield--width-quarter {
		grid-column: span 12!important;
	}
	.gform_wrapper.gravity-theme input:not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]) {
		line-height: 1;
	}
	.footer-quote-form .gform_footer input[type=submit] {
		width: 100%;
	}
	.slideout-navigation button.slideout-exit {
    	text-align: right!important;
	}
	#generate-slideout-menu {
		padding: 40px 30px 30px 30px!important;
	}
	.cctv-menu-close svg {
		height: 60px;
		width: 60px;
	}
	ol, ul {
    	margin: 0 0 30px 1rem;
	}
}
@media (min-width: 769px) and (max-width: 1024px) {
    /* TABLET-SPECIFIC */
}

@media (min-width: 1025px) {
    /* DESKTOP-SPECIFIC */
	:root {
		--slideout-width: 35vw;
		--gp-slideout-width: 35vw!important;
	}
	.postcode-form .gfield.gfield--width-quarter {
		grid-column: span 6!important;
	}
}