/*   

Theme Name: BLANK Theme

Theme URI: http://digwp.com

Description: This is just a BLANK starter WordPress Theme template -- WordPress v3.0.1

Author: Chris Coyier

Author URI: http://chriscoyier.net

Version: 2

*/



* { margin: 0; padding: 0; }

/*html,body {min-height:100%;}*/

body { background:#333; font-family:Gotham-Book, Arial; overflow:hidden; }



/*-----------------------------------*/

/*            STRUCTURAL             */

/*-----------------------------------*/



#page-wrap { width:100%; min-width:1024px; min-height:704px; /*min-height:768px;*/}



#page-loader {position:fixed; width:100%; height:100%; display:table;background-color:#333;overflow:hidden;z-index:9999999;}

#page-loader-inner {display:table-cell; vertical-align:middle;}

#page-loader-inner img {display:block; margin:0 auto 10px;}



.coordinates {

	background:#333333;

	color:#fff;

	padding:7px;

	position:absolute;

	display:none;

}



/*-----------------------------------*/

/*           TYPOGRAPHICAL           */

/*-----------------------------------*/



h1, h2, h3 { font-weight: normal; margin: 0 0 10px 0; }

h1 {font-size:22px}

h2 {font-size:16px;}

h3 { }



p { margin: 0 0 10px 0; line-height:1.5; font-size:14px;}

a { }

a:hover { } 



blockquote { }

blockquote p { }



ul, ol { margin: 0 0 10px 0; }

li {line-height:1.5; font-size:14px;}



strong {font-family: Gotham-Medium;}



/*-----------------------------------*/

/*           FRONT CONTENT           */

/*-----------------------------------*/



#front-container {

	min-width:1024px; 

	margin:0 auto; 

	/*min-height:768px; */ min-height:704px;

	background-size:cover; 

	background-position:center; 

	position:relative; 

	z-index:500;

}

.marker {position:absolute; top:0; left:0; z-index:600; }

	.marker span {/*background-color:rgba(0,0,0,0.7);*/ color:#000; padding:5px; display:block; text-transform:uppercase; font-size:0.7vw; position: initial !important; background: #dcdecf;}

	.marker span:hover,
	.marker.hover_class span
	
	{background: #333333;}

	/* .marker:before,

	.marker:after,

	.marker span:before,

	.marker span:after {position:absolute; content:""; height:7px; width:7px; display:block;}

	.marker:before {top:-3px; left:-3px; border-left:solid thin #fff; border-top:solid thin #fff; 

	-webkit-animation:border-tl-anim-off 0.5s;

	-moz-animation:border-tl-anim-off 0.5s;

	-o-animation:border-tl-anim-off 0.5s;

	animation:border-tl-anim-off 0.5s;}

	.marker:after {top:-3px; right:-3px; border-right:solid thin #fff; border-top:solid thin #fff;

	-webkit-animation:border-tr-anim-off 0.5s;

	-moz-animation:border-tr-anim-off 0.5s;

	-o-animation:border-tr-anim-off 0.5s;

	animation:border-tr-anim-off 0.5s;}

	.marker span:before {bottom:-3px; left:-3px; border-left:solid thin #fff; border-bottom:solid thin #fff;

	-webkit-animation:border-bl-anim-off 0.5s;

	-moz-animation:border-bl-anim-off 0.5s;

	-o-animation:border-bl-anim-off 0.5s;

	animation:border-bl-anim-off 0.5s;}

	.marker span:after {bottom:-3px; right:-3px; border-right:solid thin #fff; border-bottom:solid thin #fff;

	-webkit-animation:border-br-anim-off 0.5s;

	-moz-animation:border-br-anim-off 0.5s;

	-o-animation:border-br-anim-off 0.5s;

	animation:border-br-anim-off 0.5s;} */

	.marker a {display:block; cursor:pointer; width:100%; position:absolute; }
	
	.new_div
	{
		/*border:1px solid red;*/
	}
	
	.marker.new_div a {display:block; cursor:pointer; width:100%; height:100% !important; margin-top:0px !important; position:absolute; }

	 

	



	.marker:hover span,
	.marker.hover_class span
	 {background-color:rgba(51,51,51,1); color:#fff;}

	

	

	

.marker:hover span::after,
.marker.hover_class span::after {

    content: url('https://www.matrixtotalcapabilities.com/wp-content/uploads/2019/04/marker1.png');

}

	

	.marker:hover:before {border-left:solid thin #fff; border-top:solid thin #fff; top:-6px; left:-6px;

	-webkit-animation:border-tl-anim-on 0.5s;

	-moz-animation:border-tl-anim-on 0.5s;

	-o-animation:border-tl-anim-on 0.5s;

	animation:border-tl-anim-on 0.5s;}

	.marker:hover:after {border-right:solid thin #fff; border-top:solid thin #fff; top:-6px; right:-6px;

	-webkit-animation:border-tr-anim-on 0.5s;

	-moz-animation:border-tr-anim-on 0.5s;

	-o-animation:border-tr-anim-on 0.5s;

	animation:border-tr-anim-on 0.5s;}

	.marker:hover span:before {border-left:solid thin #fff; border-bottom:solid thin #fff; bottom:-6px; left:-6px;

	-webkit-animation:border-bl-anim-on 0.5s;

	-moz-animation:border-bl-anim-on 0.5s;

	-o-animation:border-bl-anim-on 0.5s;

	animation:border-bl-anim-on 0.5s;}

	.marker:hover span:after {border-right:solid thin #fff; border-bottom:solid thin #fff; bottom:-6px; right:-6px;

	-webkit-animation:border-br-anim-on 0.5s;

	-moz-animation:border-br-anim-on 0.5s;

	-o-animation:border-br-anim-on 0.5s;

	animation:border-br-anim-on 0.5s;}

	

	@keyframes border-tr-anim-off {

		0% {top:-6px; right:-6px;}

		100% {top:-3px; right:-3px;}

	}

	@keyframes border-br-anim-off {

		0% {top:-6px; right:-6px;}

		100% {bottom:-3px; right:-3px;}

	}

	@keyframes border-tl-anim-off {

		0% {top:-6px; left:-6px;}

		100% {top:-3px; left:-3px;}

	}

	@keyframes border-bl-anim-off {

		0% {bottom:-6px; left:-6px;}

		100% {bottom:-3px; left:-3px;}

	}

	@keyframes border-tr-anim-on {

		0% {top:-3px; right:-3px;}

		100% {top:-6px; right:-6px;}

	}

	@keyframes border-br-anim-on {

		0% {bottom:-3px; right:-3px;}

		100% {bottom:-6px; right:-6px;}

	}

	@keyframes border-tl-anim-on {

		0% {top:-3px; left:-3px;}

		100% {top:-6px; left:-6px;}

	}

	@keyframes border-bl-anim-on {

		0% {bottom:-3px; left:-3px;}

		100% {bottom:-6px; left:-6px;}

	}

	

#edit-mode {width:100%; padding-top:25px;}

	#edit-mode h1 {color:#fff; text-align:center; font-size:18px;}

	#edit-mode p {color:#fff; text-align:center; font-size:14px;}

	

#bg-pieces {position:absolute; top:0; left:0; z-index:400; overflow:hidden;}

#bg-pieces > div {width:100%; height:100%; position:absolute; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); top:0; left:0; background-size:cover; background-position:center; z-index:400}

#bg-pieces > img {width:100%; position:absolute; top:0; left:0; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}



.mlogo {

	position: absolute;

	left: 50px !important;

	z-index: 500;

	bottom: 130px !important;

	width: 300px !important;

}



/*-----------------------------------*/

/*               CONTENT             */

/*-----------------------------------*/



#content-container {

	display:none; 

	width:100%;  

	height:100%; 

	background-size:cover; 

	background-position:center; 

	position:absolute;

	top:0;

	left:0; 

	z-index:800;

	transition: all 0.6s;

	-webkit-transition: all 0.6s;

    -moz-transition: all 0.6s;

    -o-transition: all 0.6s;

	/*background-color:rgba(51,51,51,0.5);*/

}

body.admin-bar #content-container {top:32px; height:calc(100% - 32px);}

#content-loader-container {

	width:100px; 

	height:100px; 

	display:none !important; 

	position:absolute; 

	top:50%; 

	left:50%; 

	margin:-50px 0 0 -50px;

	background-color:rgba(51,51,51,0.8);

}

#content-loader {

	background:url(images/loading.png) center no-repeat; 

	background-size:cover; 

	width:50px; 

	height:50px; 

	position:absolute; 

	top:50%; 

	left:50%; 

	margin:-25px 0 0 -25px;

}

#content {margin:0 auto; position: relative;}

#content-inner {padding:60px 5% 0; width:100%; height:calc(100% - 70px); margin: 60px auto;}

#the-content {

	padding:35px 0 50px; 

	position:relative; 

	width:100%; 

	height:calc(104% - 125px); /*height:calc(83% - 125px);*/ 

	overflow: inherit; 

	/*background:url(images/content-bg.png) no-repeat; 

	background-size:cover;*/

	background: rgba(255, 255, 255, 0.9);

}

	#top-bar {width:100%; height:30px; position:relative;}

	.close-btn {

		position:absolute;

		top:-15px;

		right:25px;

		background:url(images/close-btn.png) center no-repeat;

		background-size:contain;

		width:77px;

		height:40px;

		cursor:pointer;

	}

	.back-btn {

		position:absolute;

		top:-20px;

		left:25px;

		background:url(images/back-button.png) center no-repeat;

		background-size:contain;

		width:75px;

		height:40px;

		cursor:pointer;

	}

	.all-content {width:100%; height:100%;}

	.content-image {width:60%; height:100%; float:left; overflow:hidden; padding-left:25px;}

		.content-image .images {width:100%; height:76%; overflow:hidden; position:relative;}

			.content-image .images .element {width:100%; position:absolute; top:0; left:0; display:none;}

			.content-image .images .element.active {display:block; }

		.content-image .photos-title {color:#000; padding-top:10px;}

		.content-image .image-thumbs {width:100%; padding-top:5px; height:60px;}

			.content-image .image-thumb {width:60px; height:100%; margin-right:15px; position:relative; background-size:cover; cursor:pointer; background-position:center; float:left; overflow:hidden;}

			.content-image .image-thumb.active:after {

				display:block;

				content:"";

				position:absolute;

				bottom:0;

				left:0;

				width:100%;

				height:5px;

				background-color:#6CB641;

			}

	

	.projects .the-projects {/*padding-top:5px;*/ text-align: left;}

		.projects .the-projects a {

			display:block;

			color:#000;

			margin-top:5px;

			font-size:14px;

			padding:2px 0 2px 30px;

			text-decoration:none;

			position:relative;

			cursor:pointer;

			margin-right:20px;

			margin-bottom:10px;

		}

		.projects .the-projects a:after {

			background:url(images/circle_arrow.png) no-repeat;

			background-size:cover;

			content:'';

			display:block;

			height:20px;

			width:20px;

			position:absolute;

			top:0;

			left:0;

		}



	.top-logo {

		position: absolute;

    	top: -27px;

    	left: 50%;

		margin-left:-121px;

		height:40px;

	}
	
	#the-content #pdf_form
	{
background: rgba(240, 240, 240, 0.96);

overflow: hidden;

width: 100%;

height: 100%;

position: absolute;

padding: 35px 0px 35px 50px;

margin: 0 auto;

z-index: 9999999;

top: 0;

display:none;
	}
	
	
	
	
	#the-content #pdf_form #top-bar-pdf
	{
		width: 100%;
height: 30px;
position: relative;
	}
	#the-content #pdf_form #top-bar-pdf .close-btn-pdf
	{
		position: absolute;
top: -15px;
right: 25px;
background: url(images/close-btn.png) center no-repeat;
    background-size: auto;
background-size: contain;
width: 75px;
height: 40px;
cursor: pointer;
	}
	

	

	.content-content {width:36%; height:96%; float:right; overflow:hidden;}

		.content-content h1.content-title {color:#000; font-weight: 800; margin-bottom:20px; text-transform: uppercase; font-size: 18px; font-family: Gotham-Medium;}

		

	.content-content ul.pdf_list
	{
		display:inline-block;
		width:100%;
		position:relative;
		z-index:1;
	}
	.content-content ul.pdf_list li
	{
		padding:10px;
		background:#6fb549;
		list-style:none;
		display:inline-block;
		width:100%;
		margin:0 0 10px 0;
	}
	.content-content ul.pdf_list li p
	{
		margin-bottom:0;
		line-height: 1.5;
        font-size: 14px;
		color:#fff;
		display:inline-block;
		float:left;
		width:75%;
		height: 40px;
	display: flex;
	align-items: center;
	}
	.content-content ul.pdf_list li .icons
	{
		width:23%;
		float:right;
		display:inline-block;
	}
	.content-content ul.pdf_list li a
	{
		display:inline-block;
		float:right;
		width:45%;
	}
	.content-content ul.pdf_list li img
	{
		width:30px;
		float: right;
		height:auto;
		padding-top: 7px;
	}
	.content-content ul.pdf_list li:hover
	{
		background:#356A20;
	}

		

		

		

		.content-content .the-content {padding-right:30px; /*max-height:630px;*/ overflow:hidden;}

		.content-content .the-content.scrollable::-webkit-scrollbar {

			background:transparent !important;

			width:10px !important;

		}

		.content-content .the-content.scrollable::-webkit-scrollbar-thumb {

			background:#999 !important;

			border-radius:4px !important;

		}

		.content-content .the-content.scrollable {

			overflow-y:scroll;

			height:630px;

		}

			.content-content .the-content p,

			.content-content .the-content li {color:#000;}

			.content-content .the-content li {list-style:disc; margin-left:20px; line-height:1.5;}

			.content-content .the-content a {text-decoration:underline; color:#000; cursor:pointer;}



		.services-area .service {margin-bottom:10px;}

		.services-area .service a {text-decoration:none;}



.services-area a {position:relative; display:block;}

.services-area a img {position:relative; z-index:800;}

.services-area .service-hover {opacity:0; display:block; z-index:900; top:0; left:0; height:100%; width:100%; background-color:rgba(0,0,0,0.8); color:#fff; position:absolute;}

.services-area .service-hover > span {display:block; padding:15px 0 0 15px; vertical-align:middle; font-size:16px; text-transform: uppercase;}



.service .service-hover {

	opacity:0;

	-webkit-animation:services-hover-off 0.5s;

	-moz-animation:services-hover-off 0.5s;

	-o-animation:services-hover-off 0.5s;

	animation:services-hover-off 0.5s;

}

.service:hover .service-hover {

	-webkit-animation:services-hover 0.5s;

	-moz-animation:services-hover 0.5s;

	-o-animation:services-hover 0.5s;

	animation:services-hover 0.5s;

	opacity:1;

}



@keyframes services-hover {

	0% {

		opacity:0;

	}

	100% {

		opacity:1;

	}

}



@keyframes services-hover-off {

	0% {

		opacity:1;

	}

	100% {

		opacity:0;

	}

}







.page-template-page-screen h1,

.page-template-page-screen h2,

.page-template-page-screen p,

.page-template-page-screen li {margin: 0 0 25px 0; font-size:130%;}

.page-template-page-screen li {margin-bottom:0;}

.page-template-page-screen .services-area .service-hover > span {font-size:130%;}

.page-template-page-screen .services-area a img {width:250px}

.page-template-page-screen .content-image .image-thumb {height:140px; width:140px;}

.page-template-page-screen .close-btn {width:100px; height:50px; top:0;}

.page-template-page-screen .content-image {height:99%; padding-top:1%;}

.page-template-page-screen .content-content {height:95%; padding-top:1%;}

.page-template-page-screen .top-logo {height:67px;}

.page-template-page-screen .back-btn {width:110px;}

.page-template-page-screen #the-content {height: calc(92% - 35px);}





.content-content .the-content p span, .content-content .the-content li {

    color: #000 !important;

}



.content-content h1.content-title img {

    position: absolute;

	left: 62%;
	top: 63px;

}

.popup-pic {

    position: absolute;
	width: 150px;
	right: -8px;
	bottom: -16px;
	opacity: 0.6;

}

.form-col input {

	width: 100%;

	border: 1px solid #eee;

	padding: 10px;

	margin-bottom: 15px;
	margin-top: -5px;

}

.form-col p {

	margin-bottom: 10px;

}

.form-col button{

	background: #6fb549;

	color: #000;

	font-size: 16px;

	cursor: pointer;

	border: 0px;

	padding:8px 20px;

	margin-top: 10px;

}

.form-col{

	margin-top: 20px;

	position:relative;

	z-index:999;

}

.form-col p span {

	color: #ff0000;

}

.error_box

{

	color: #ee6161;



border: 1px solid red !important;

}



.thankyou-container

{

	/*max-width:700px !important;*/

	height:auto !important;

	/*width:100% !important;

		transition: all 0.6s;

	-webkit-transition: all 0.6s;

    -moz-transition: all 0.6s;

    -o-transition: all 0.6s;*/

}
.thankyou-container .popup-pic
{
	display:none !important;
}

.thankyou-col

{

display: none;

position: relative;

z-index: 999;

width: 100%;

height: 100%;

text-align: center;

padding: 0 20px;

}

.thankyou-col h3

{

	font-size: 22px;

font-weight: bold;

text-transform: uppercase;

font-family: Gotham-Medium;

margin-bottom:15px;

}

.thankyou-col p

{


font-size: 16px;

padding: 0 10x;
margin-bottom: 0px;

}

.thankyou-col .two-btn

{

	width: 100%;

display: inline-block;

text-align: center;

margin-top:30px;

}

.thankyou-col .two-btn a

{

	color: #000;
	background-color: #6fb549;
	padding: 10px 20px;
	border-radius: 3px;
	text-decoration: none;
	margin: 0 10px;
	font-size: 16px;
	display: inline-block;
	margin-bottom: 10px;

}

.thankyou-col .two-btn a:hover

{

	background-color: #4b8a26;

}
/*.thankyou-container #content-inner {
    width: 585px;
}*/

#pdf_form input {
    width: 96%;
}

.content-content .the-content li.download_pdf_link
{
	text-decoration: underline;
	cursor: pointer;
}
.content-content .the-content li a {
    color: #000;
}







 

 





@media (max-width: 1800px) {

.mlogo {

    left: 0px !important;

    bottom: 78px !important;

    width: 265px !important;

}
#the-content {
	height:calc(118% - 125px); /*height:calc(83% - 125px);*/ 

}


}
@media (max-width: 1330px) {
#content-inner {
    width: 90%;
}
}

@media (max-width: 966px) {

.marker {
    width: 39%;
	position: relative;
	left: 0 !important;
	top: 0 !important;
	display: inline-block;
	margin: 15px 3.5% 0px 1%;
}
.marker span {
    font-size: 13px;
}
#background-wrap {
    max-width: 100%;
}
#myVideo {
    max-width: 100%;
	width:100%;
}
#front-container {
    width: 100% !important;
	min-width: 100%;
	text-align: center;
}
#page-wrap {
    min-width: 100%;
}
#content {
    width: 100% !important;
}
#content-inner {
    width: 100%;
	height: 500px;
	overflow: scroll;
}
.content-image {
    width: 97%;
    height: inherit;
    float: left;
    overflow: inherit;
    padding-left: 25px;
}
.content-content {
    width: 97%;
    height: 100%;
    float: right;
    overflow: inherit;
	margin-top: 40px;
}
.content-content h1.content-title img {
    position: relative;
    left: 0;
    top: 8px;
}
.popup-pic {
    bottom: -760px;
}
#the-content {
    overflow-x: hidden;
}
.content-content .the-content.scrollable {
    overflow-y: hidden;
	height: 700px !important;
}
}
@media (max-width: 579px) {
#front-container {
    top: 100px !important;
} 
.marker {
	width: 37%;
    margin: 15px 6% 0px 1%;
}
.marker span {
    font-size: 10px;
}
.content-image {
    padding-left: 12px;
}
}
@media (max-width: 433px) {
.marker {
    width: 41%;
    margin: 15px 6% 0px 1%;
}
.marker span {
    font-size: 8px;
}
}
@media (max-width: 375px) {
.marker {
    width: 39%;
    margin: 15px 6.5% 0px 1%;
}
}