
:root
{
	--white: #EFEFEF;
	--grey: #666666;
	--black: #070707;
	--wh-red: #f02d61;
	--wh-darkred: #cf1e4d;
	--shadow: #0712189A;
	--deep-black-blue: #040631;
	--sans: 'Montserrat', 'Trebuchet MS', sans-serif;
	--serif: 'Zilla Slab', 'Rockwell', Georgia, serif;
	--swift: 0.15s ease-in-out;
	--break-point: 1152px;
}

/* global */
html,
body
{
	scroll-behavior: smooth; 
	width: 100%;
	height: 100%;
	font-family: var(--sans);
	font-size: 16px;
	font-weight: 400;
	hyphens: auto;
	color: var(--white);
	background-color: var(--black);
	margin: 0;
	padding: 0;
}

.grid-container
{
	margin: 0 auto;
	padding: 0 1rem;
	max-width: 1152px;
}

/* inside grid-container */
.grid-container .ccm-image-slider-text,
.grid-container .ccm-image-slider-text h2,
.grid-container .form-group > input,
.grid-container .form-group > textarea,
.grid-container .contact-form-block,
.grid-container
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.grid-container .ccm-layout-column-wrapper,
.grid-container .ccm-image-slider-container,
.ccm-block-testimonial-wrapper
{
	margin: 0 0 40px 0;
}

.grid-container fieldset
{
    border: 0;
    margin: 0;
    padding: 0;
}

.grid-container textarea
{
  height: 100px;
  resize: vertical;
  padding: 0;
  margin: 4px 0 0 0;
}

.grid-container .visible
{
	opacity: 1;
}

/* typo */
.grid-container a
{
	text-decoration: none;
	color: var(--wh-red);
}

.grid-container a:hover
{
	color: var(--wh-darkred);
}

.grid-container p
{
	font-size: 1.125rem;
	line-height: 1.35;
	margin: 6px 0 12px 0;
}

.grid-container h1,
.grid-container h2,
.grid-container h3,
.grid-container h4,
.grid-container h5,
.grid-container h6,
.grid-container .navigation ul
{
	font-family: var(--serif);
	font-style: italic;
}

.grid-container h1,
.grid-container h2,
.grid-container h3,
.grid-container h4,
.grid-container h5,
.grid-container h6
{
	font-weight: 400;
	line-height: 1.2;
}

.grid-container div.ccm-layout-column h1,
.grid-container div.ccm-layout-column h2,
.grid-container div.ccm-layout-column h3,
.grid-container div.ccm-layout-column h4,
.grid-container div.ccm-layout-column h5,
.grid-container div.ccm-layout-column h6,
.grid-container div.ccm-layout-column p
{
	margin-right: 2rem;
	margin-left: 2.4rem;
}

.grid-container div.ccm-layout-column:last-child h1,
.grid-container div.ccm-layout-column:last-child h2,
.grid-container div.ccm-layout-column:last-child h3,
.grid-container div.ccm-layout-column:last-child h4,
.grid-container div.ccm-layout-column:last-child h5,
.grid-container div.ccm-layout-column:last-child h6,
.grid-container div.ccm-layout-column:last-child p
{
	margin-right: 1.6rem;
	margin-left: 3.2rem;
}

.grid-container div.ccm-layout-column:first-child h1,
.grid-container div.ccm-layout-column:first-child h2,
.grid-container div.ccm-layout-column:first-child h3,
.grid-container div.ccm-layout-column:first-child h4,
.grid-container div.ccm-layout-column:first-child h5,
.grid-container div.ccm-layout-column:first-child h6,
.grid-container div.ccm-layout-column:first-child p
{
	margin-left: 0;
}

.grid-container h1
{
	font-weight: 600;
	font-size: 3.5rem;
	margin: 48px 0 32px 0;
}

.grid-container h2
{
	font-weight: 600;
	color: var(--white);
	font-size: 32px;
	line-height: 1.2;
	margin: 20px 0 18px 0;
}

.grid-container h2:first-child,
.grid-container h3:first-child,
.grid-container p:first-child
{
	margin-top: 0;
}

.grid-container p.footer:last-child,
.grid-container p.title-footer:last-child
{
	text-align: center;
	font-size: 10px;
}

/* hide title footer */
.grid-container p.title-footer:last-child
{
	display: none;
}

.grid-container p.footer:last-child
{
	bottom: 0;
	border-top: 1px var(--white) solid;
	margin: 12px 0 24px 0;
	padding-top: 6px;
}

.grid-container hr
{
	border: 0;
	border-top: 1px solid var(--white);
	margin: 0;
}

/* testimonial */
.grid-container .ccm-block-testimonial-text
{
	display: flex;
	flex-direction: column;
	padding: 1.2rem 6rem 3rem 6rem;
}

.grid-container .ccm-block-testimonial-paragraph
{
	font-family: var(--serif);
	font-size: 3.5rem;
	line-height: 1.2;
	margin-bottom: 32px;
	font-style: italic;
	font-weight: 100;
	order: 1;
}

.grid-container .ccm-block-testimonial-paragraph::before
{
	content: '«'
}

.grid-container .ccm-block-testimonial-paragraph::after
{
	content: '»'
}

.grid-container .ccm-block-testimonial-name,
.grid-container .ccm-block-testimonial-position
{
	align-self: flex-end;
}

.grid-container .ccm-block-testimonial-name
{
	order: 2;
}

.grid-container .ccm-block-testimonial-position
{
	order: 3;
}


/* structure */
#titleSVGtag
{
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.grid-container div#logo
{
	height: 4rem;
	width: 22rem;
	background: center / contain url('../img/WH-logo.svg') no-repeat #fff;
	margin: 32px 0 0 0;
}

.default-title-nav
{
	display: grid;
	grid-template-columns: 22rem 1fr;
	column-gap: 2rem;
	border-bottom: 1px var(--white) solid;
	align-items: end;
	justify-items: end;
}

.grid-container .grid-padding-x
{
	padding: 0;
}

.grid-container .navcontainer
{
	padding: 0 0 2rem 0;
}

.grid-container img
{
	width: 100%;
	height: auto;
}

.grid-container img#ccm-logo
{
	width: 20px;
	height: 20px;
}

/* navigation */

.grid-container .titlenav
{
	border-bottom: none;
	text-align: center;
	border-top: none;
}

.grid-container .navigation ul.nav
{
	font-size: 20px;
	line-height: 20px;
	padding: 12px 0;
	margin: 0;
}

.grid-container .navigation ul.nav li
{
	display: inline;
	padding: 0 16px 4px 0;
	margin: 16px 16px 16px 0;
	border-right: 1px solid var(--white);
}

.grid-container .navigation ul.nav li:last-child
{
	padding-right: 0;
	margin-right: 0;
	border-right: 0;
}

.grid-container .navigation div#burger
{
	display: none;
	position: relative;
	height: 48px;
	text-align: right;
	background-size: auto 100%;
	/* border-top: 1px solid var(--white); */
}

#burgerOverlay
{
	position: absolute;
	z-index: 900;
	width: 48px;
	height: 48px;
	right: 0;
	top: 0;
}

.nav-burger
{
	max-height: 48px;
}

#burgerOverlay
{
	z-index: 900;
}

.blend-in
{
	opacity: 0;
	transition: opacity 0.2s;
}

/* contact form */
.ccm-dashboard-express-form > fieldset > div.mb-3
{
	display: grid;
	grid-template-columns: 8rem 1fr;
	grid-row-gap: 0.5rem;
	margin: 0.8rem 0 1.6rem 0;
}

.ccm-dashboard-express-form > fieldset > div.mb-3 .small
{
	color: var(--wh-red);
	font-size: 0.8rem;
}

.ccm-dashboard-express-form > fieldset > div.mb-3 > input,
.ccm-dashboard-express-form > fieldset > div.mb-3 > textarea
{
	grid-column: span 2;
}

.ccm-dashboard-express-form > fieldset > div.mb-3 > input,
.form-stacked > .captcha input,
.form-actions > button
{
	min-height: 2rem;
}

.ccm-dashboard-express-form > fieldset > div.mb-3 > textarea
{
	width: 100%;
	min-height: 12rem;
}

.form-stacked > .captcha
{
	font-size: 0.8rem;
	max-width: 16rem;
}

.form-stacked > .captcha > div
{
	margin: 0.5rem 0;
}

.form-stacked > .captcha  input
{
	box-sizing: border-box;
	width: 100%;
}

.form-actions > button
{
	width: 100%;
	max-width: 16rem;
}

.form-stacked > .captcha br
{
	display: inline-block;
	line-height: 0;
	height: 0;
}

.ccm-form > .alert
{
	font-weight: 300;
	font-size: 2rem;
	font-style: italic;
	margin: 0.5rem 0 2rem 0;
	max-width: 44rem;
	padding: 0 0.8rem 0 1rem;
}

/* old contact form */
.grid-container .ab-contact-form
{
	padding: 0 3rem 0 0;
}

.grid-container .contact-form-block
{
	margin: 0 0 12px 0;
	padding: 6px 12px 12px 12px;
	border: none;
	border-top: 1px solid var(--white);
	border-radius: 0;
	background-color: var(--deep-black-blue);
}

.grid-container .form-group > input,
.grid-container .form-group > textarea
{
	width: 100%;
	border: 1px solid var(--white);
	border-radius: 4px;
	background-color: var(--deep-black-blue);
	padding: 6px;
}

.grid-container .contact-form .btn-lizard
{
	background-color: var(--wh-red);
	color: var(--black);
}

/* slider */
.grid-container a.rslides_nav.prev,
.grid-container a.rslides_nav.next
{
	margin-top: -56px;
	width: 56px;
	height: 112px;
	opacity: 0.8;
	-webkit-transition: margin var(--swift), width var(--swift), height var(--swift), opacity var(--swift);
    -moz-transition: margin var(--swift), width var(--swift), height var(--swift), opacity var(--swift);
    -o-transition: margin var(--swift), width var(--swift), height var(--swift), opacity var(--swift);
	transition: margin var(--swift), width var(--swift), height var(--swift), opacity var(--swift);
}

.grid-container a.rslides_nav.prev:hover,
.grid-container a.rslides_nav.next:hover
{
	margin-top: -64px;
	width: 64px;
	height: 128px;
	opacity: 1;
}

.grid-container a.rslides_nav.prev
{
	background: url('../img/arrow-left.svg') no-repeat right;
}

.grid-container a.rslides_nav.next
{
	background: url('../img/arrow-right.svg') no-repeat right;
}

.grid-container .ccm-image-slider-text p:last-child
{
	margin-bottom: 12px;
}

.grid-container .ccm-image-slider-text,
.grid-container .ccm-image-slider-text h2
{
	color: var(--white);
}

.grid-container .ccm-image-slider-text
{
	max-width: 35%;
	border-left: 1px var(--white) solid;
	top: 56px;
	left: 64px;
	padding: 12px 24px 12px 24px;
	background-color: var(--shadow);
}

.grid-container .ccm-image-slider-text > h2
{
	font-weight: 100;
}

a[href="/login"] {
	display: none;
}

a[href="/login"]:before {
	display: inline-block;
	content: 'gulululululiu';
	color: #ef2323;
	font-size: 34rem;
}

/* responsive */
@media only screen and (max-width: 1152px)
{
	.grid-container .ccm-layout-column
	{
		width: 100% !important;
	}

	.grid-container .navcontainer
	{
		padding: 0 0 6rem 0;
	}
	
	.grid-container div.ccm-layout-column h1,
	.grid-container div.ccm-layout-column h2,
	.grid-container div.ccm-layout-column h3,
	.grid-container div.ccm-layout-column h4,
	.grid-container div.ccm-layout-column h5,
	.grid-container div.ccm-layout-column h6,
	.grid-container div.ccm-layout-column p
	{
		margin-right: 1rem;
		margin-left: 1.5rem;
	}

	.grid-container div.ccm-layout-column:first-child h1,
	.grid-container div.ccm-layout-column:first-child h2,
	.grid-container div.ccm-layout-column:first-child h3,
	.grid-container div.ccm-layout-column:first-child h4,
	.grid-container div.ccm-layout-column:first-child h5,
	.grid-container div.ccm-layout-column:first-child h6,
	.grid-container div.ccm-layout-column:first-child p
	{
		margin-left: 1.5rem;
	}

	.default-title-nav
	{
		grid-template-columns: 1fr;
		border-bottom: none;
	}
	
	.grid-container div#logo
	{
		position: absolute;
		height: 48px;
		top: 0;
		left: 1rem;
		margin: 0;
		max-width: 11rem;
	}

	/* [mobile] typo */
	.grid-container h1
	{
		font-size: 3rem;
		margin: 24px 0 32px 0;
	}
	
	.grid-container h2
	{
		font-size: 1.5rem;
	}

	.grid-container h2,
	.grid-container div.ccm-layout-column:last-child h2
	{
		margin: 1.5rem 1.6rem 1.25rem 1.5rem;
	}

	.grid-container div.ccm-layout-column:last-child p
	{
		margin-left: 1.5rem;
	}
	
	/* [mobile] testimonial */
	.grid-container .ccm-block-testimonial-text
	{
		padding: 0.6rem 2rem 1.2rem 2rem;
	}
	
	.grid-container .ccm-block-testimonial-paragraph
	{
		font-size: 2rem;
		line-height: 1.2;
	}
	
	/* [mobile] navigation */
	.grid-container .navcontainer
	{
		padding: 0 0 1.5rem 0;
	}

	.grid-container .navigation div#burger
	{
		display: block;
	}

	.grid-container .navigation {
		width: 100%;
		border-bottom: 0;
	}

	.grid-container .titlenav
	{
		border-top: 1px solid var(--white);
	}
	
	.grid-container .navigation ul.nav
	{
		border-top: 1px solid var(--white);
		margin: 0;
	}

	.grid-container .navigation ul.visible
	{
		border-bottom: 1px solid var(--white);
	}

	.grid-container .navigation ul.nav li {
		line-height: 1rem;
		overflow: hidden;
		opacity: 0;
		height: 0;
		padding: 0;
		border-bottom: none;
		-webkit-transition: height var(--swift);
		-moz-transition: height var(--swift);
		-o-transition: height var(--swift);
		transition: height var(--swift);
	}

	.grid-container .navigation ul.visible li
	{
		overflow: visible;
		opacity: 1;
		height: 1rem;
		padding: 0.85rem 0 1.15rem 0;
		border-bottom: 1px solid var(--black);
	}
	
	.grid-container .navigation ul.nav li
	{
		display: block;
		width: 100%;
		margin: 0;
		border-right: 0;
	}

	.grid-container .navigation ul.nav li:last-child
	{
		border-bottom: 0;
	}

	/* [mobile] slider */
	.grid-container .ccm-image-slider-text
	{
		max-width: 100%;
		width: 100%;
		bottom: 0px;
		top: auto;
		left: 0px;
		padding: 6px 12px 2px 12px;
	}

	/* .grid-container .ccm-image-slider-text, */
	.grid-container .ccm-image-slider-text h2
	{
		font-size: 1rem;
		line-height: 1.125;
		margin-bottom: 0.375rem;
	}

	.grid-container .ccm-image-slider-text p
	{
		font-size: 0.75rem;
		line-height: 1.125;
		margin-top: 0;
		margin-bottom: 0.125rem;
	}
}



@media print
{
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited
	{
        text-decoration: underline;
    }

    a[href]:after
	{
        content: " (" attr(href) ")";
    }

    abbr[title]:after
	{
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after
	{
        content: "";
    }

    pre,
    blockquote
	{
        border: 1px solid var(--grey);
        page-break-inside: avoid;
    }

    thead
	{
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img
	{
        page-break-inside: avoid;
    }

    img
	{
        max-width: 100% !important;
    }

    @page
	{
        margin: 0.5cm;
    }

    p,
    h2,
    h3
	{
        orphans: 3;
        widows: 3;
    }

    h2,
    h3
	{
        page-break-after: avoid;
    }
}
