/*
Theme Name: PlusGroup 2023
Description: PlusGroup Custom theme
Author: Squidart
Author URI: http://squidart.co.za
Version: 1.1.0

License URI: ###

/*------------------------------------*\
	DEVMODE

	Zindex Items
	10 - Nav Dropdown
	
\*------------------------------------*/
/* * {
	outline: 1px solid red;
	outline-offset: -1px;
} */

/*------------------------------------*\
	VARIABLES
\*------------------------------------*/
:root {
	--max-width: 1650px;

	--min-header-height: 150px;
	--min-footer-height: 100px;

	--primary-color: #474e67;
	--primary-hover: #474e67;
	
	--accent-color: #474e67;
	--select-color: #474e67;
	--body-color: #ffffff;

	--light-font-color: #ffffff;
	--dark-font-color: #474e67;
}
/* fonts */

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Bold.eot');
	src: url('../fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),
			url('../fonts/Gotham-Bold.woff2') format('woff2'),
			url('../fonts/Gotham-Bold.woff') format('woff'),
			url('../fonts/Gotham-Bold.ttf') format('truetype'),
			url('../fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Book.eot');
	src: url('../fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
			url('../fonts/Gotham-Book.woff2') format('woff2'),
			url('../fonts/Gotham-Book.woff') format('woff'),
			url('../fonts/Gotham-Book.ttf') format('truetype'),
			url('../fonts/Gotham-Book.svg#Gotham-Book') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

/*------------------------------------*\
	MAIN
\*------------------------------------*/
body {
	background-color: var(--body-color);
	overscroll-behavior: none;
	margin: 0;

	font-family: 'Gotham';
	color: var(--dark-font-color);
	overflow-x: hidden;
}


/*------------------------------------*\
	PAGE STRUCTURE
\*------------------------------------*/
/* header */
.header .flex-pillar {
	min-height: var(--min-header-height);
	padding: 0px 15px 0px 15px
}

/* content */
.content {
	/* min-height: calc(100vh - var(--min-header-height) - var(--min-footer-height)); */
	min-height: calc(100vh - 250px - 50px);
	margin-bottom: 50px;
}

/* footer */
.footer {
	min-height: var(--min-footer-height);
	/* position: absolute; */
	/* bottom: 0; */
	width: 100%;
}


/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/
/* text */
h1 {
	font-family: 'Gotham';
	font-weight: bold;
	text-align: center;
	font-size: 120px;
	margin: 50px 0 0 0;
	line-height: 0.8em;
}

p {
	font-family: 'Gotham';
	text-align: center;
	font-size: 12px;
	margin: 0;
}

a {
	all: unset;
}
a:hover {
	color: var(--primary-color);
	cursor: pointer;
}

a:hover, a:active, a:focus {
	outline:0;
}

/*------------------------------------*\
	ICONOGRAPHY
\*------------------------------------*/
.hero-1 {
	width: 100%;
	height: 100%;
	max-width: 356px;
	margin: auto auto auto 0;
	display: block;
}

.col-lg-2 .logo-box {
	opacity: 0;
	transform: translateY(50px);
	animation: slideUp 0.5s forwards;
	display: block;
}

.col-lg-2 .logo-box .logo {
	width: 100%;
	height: 100%;
	border-left: solid black 3px;
	padding: 0px 40px;

}
.col-lg-2:nth-child(1) .logo-box .logo,
.col-lg-2:nth-child(2) .logo-box .logo {
	border-left: 0;
}

.col-lg-2 .logo-box .logo img {
	width: 100%;
	margin: auto;
}

/* .col-lg-2:nth-child(1) .logo-box { animation-delay: 0.2s; }
.col-lg-2:nth-child(2) .logo-box { animation-delay: 0.4s; }
.col-lg-2:nth-child(3) .logo-box { animation-delay: 0.6s; }
.col-lg-2:nth-child(4) .logo-box { animation-delay: 0.8s; }
.col-lg-2:nth-child(5) .logo-box { animation-delay: 1s; } */

.row-1 .col-lg-2:nth-child(2) .logo-box { animation-delay: 0.2s; }
.row-1 .col-lg-2:nth-child(3) .logo-box { animation-delay: 0.4s; }
.row-1 .col-lg-2:nth-child(4) .logo-box { animation-delay: 0.6s; }

.row-2 .col-lg-2:nth-child(2) .logo-box { animation-delay: 0.8s; }
.row-2 .col-lg-2:nth-child(3) .logo-box { animation-delay: 1.0s; }
.row-2 .col-lg-2:nth-child(4) .logo-box { animation-delay: 1.2s; }

@keyframes slideUp {
	to {
			opacity: 1;
			transform: translateY(0);
	}
}

/*------------------------------------*\
	STYLED SECTIONS

	Added to .header
\*------------------------------------*/
.section-blue {
  background-color: var(--accent-color);
	color: var(--light-font-color);
}

.footer .flex-pillar{
	padding: auto;
	display: block;
}

/*------------------------------------*\
	MISC
\*------------------------------------*/
/* selected content*/ 
::selection {
	background: var(--select-color);
	color: var(--light-font-color);
	text-shadow:none;
}

::-webkit-selection {
	background: var(--select-color);
	color: var(--light-font-color);
	text-shadow:none;
}

::-moz-selection {
	background: var(--select-color);
	color: var(--light-font-color);
	text-shadow:none;
}

/*------------------------------------*\
	STOP EDITING HERE
 *------------------------------------*
	IMAGES
\*------------------------------------*/
img {
	max-width:100%;
	vertical-align:bottom;
}

/*------------------------------------*\
	GLOBAL
\*------------------------------------*/
/* global box-sizing */
*,
*:after,
*:before {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;

	font-smoothing:antialiased;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/*------------------------------------*\
	RESPONSIVE
\*------------------------------------*/
.pillar, .flex-pillar {
	padding: 20px 10px 20px 10px;
	max-width: var(--max-width);
	margin: auto;
}
.flex, .flex-pillar {
	display: flex;
	flex-wrap: wrap;
}

@media only screen and (min-width: 1500px) {
	.pillar, .flex-pillar {
		padding: 30px 15px 30px 15px;
	}
	h1 {
		font-size: 120px;
		margin: 70px 0 0 0;
	}
	.content {
		min-height: calc(100vh - 250px - 70px);
		margin-bottom: 70px;
	}
}
@media only screen and (min-width: 787px) {
	.flex-right {
		margin-left: auto;
		width: fit-content;
	}
	/* .content {
		margin-bottom:80px;
	} */
	.col-md-spacer {
		display: none;
	}
}

/*------------------------------------*\
	COLUMNS
\*------------------------------------*/
/* 12 Column Structure */
.col-lg-0 {flex-grow: 1}
.col-lg-1 {flex:8.333333333333333%;}
.col-lg-2 {flex:16.66666666666667%;}
.col-lg-3 {flex:25%;}
.col-lg-4 {flex:33.33333333333333%;}
.col-lg-5 {flex:41.66666666666667%;}
.col-lg-6 {flex:50%;}
.col-lg-7 {flex:58.33333333333333%;}
.col-lg-8 {flex:66.66666666666667%;}
.col-lg-9 {flex:75%;}
.col-lg-10 {flex:83.33333333333333%;}
.col-lg-11 {flex:91.66666666666667%;}
.col-lg-12 {flex:100%;}

.pad-lg-50 {width: 50px;} 

body .lg-hide {display:none !important;}
body .lg-show {display:block !important;}
	
/*/////////////////////////*/
/* RETINA DISPLAYS 		   */
/*/////////////////////////*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {
}
/*/////////////////////////*/
/* TABLET LANDSCAPE DEVICE */
/*/////////////////////////*/
@media only screen and (max-width:1150px) {
	/* 12 Column Structure */
	.col-md-1 {flex:8.333333333333333%;}
	.col-md-2 {flex:16.66666666666667%;}
	.col-md-3 {flex:25%;}
	.col-md-4 {flex:33.33333333333333%;}
	.col-md-5 {flex:41.66666666666667%;}
	.col-md-6 {flex:50%;}
	.col-md-7 {flex:58.33333333333333%;}
	.col-md-8 {flex:66.66666666666667%;}
	.col-md-9 {flex:75%;}
	.col-md-10 {flex:83.33333333333333%;}
	.col-md-11 {flex:91.66666666666667%;}
	.col-md-12 {flex:100%;}
		
	body .md-hide {display:none !important;}
	body .md-show {display:block !important;}

	.flex-pillar.row-1 {
		padding-bottom: 0;
	}
	.flex-pillar.row-2 {
	 padding-top: 0;
	}
	/* text */
	h1 {
		font-size: 85px;
		margin: 40px 0 0 0;
	}
	.col-lg-2 .logo-box {
		text-align: center;
	}
	.col-lg-2 .logo-box .logo {

		border-left: none;
	}
	.col-lg-2 .logo-box .logo img {
		max-width: 285px;
		border-top: solid black 3px;
		padding: 25px 0;
	}
	.row-1 .col-lg-2:nth-child(2) .logo-box .logo img {
		border-top: none;
	}
}

/*////////////////////////*/
/* TABLET PORTRAIT DEVICE */
/*////////////////////////*/
@media only screen and (max-width: 786px) {
	/* 12 Column Structure */
	.col-sm-1 {flex:8.333333333333333%;}
	.col-sm-2 {flex:16.66666666666667%;}
	.col-sm-3 {flex:25%;}
	.col-sm-4 {flex:33.33333333333333%;}
	.col-sm-5 {flex:41.66666666666667%;}
	.col-sm-6 {flex:50%;}
	.col-sm-7 {flex:58.33333333333333%;}
	.col-sm-8 {flex:66.66666666666667%;}
	.col-sm-9 {flex:75%;}
	.col-sm-10 {flex:83.33333333333333%;}
	.col-sm-11 {flex:91.66666666666667%;}
	.col-sm-12 {flex:100%;}
		
	body .sm-hide {display:none !important;}
	body .sm-show {display:block !important;}

		/* text */
		h1 {
			font-size: 70px;
			margin: 40px 0 0 0;
		}
}