@font-face {
    font-family: 'gothamlight';
    src: url('fonts/gotham-light-webfont.eot');
    src: url('fonts/gotham-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/gotham-light-webfont.woff') format('woff'),
         url('fonts/gotham-light-webfont.ttf') format('truetype'),
         url('fonts/gotham-light-webfont.svg#gotham-lightgotham-light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothambook';
    src: url('fonts/gotham-book-webfont.eot');
    src: url('fonts/gotham-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/gotham-book-webfont.woff') format('woff'),
         url('fonts/gotham-book-webfont.ttf') format('truetype'),
         url('fonts/gotham-book-webfont.svg#gotham-bookgotham-book') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothambold';
    src: url('fonts/gotham-bold-webfont.eot');
    src: url('fonts/gotham-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/gotham-bold-webfont.woff') format('woff'),
         url('fonts/gotham-bold-webfont.ttf') format('truetype'),
         url('fonts/gotham-bold-webfont.svg#gotham-boldgotham-bold') format('svg');
    font-weight: normal;
    font-style: normal;
}


body,html{
	height:100%;
	color:#fff;
}

html{
	overflow:hidden;
}

body{

	overflow:hidden;

}



h1{
	font-family: 'gothambold';
	color:#3f3f3f;
	font-size:20px;
	margin-bottom:20px;
}


a{
	color:#fff !important;
}

section#fullscreen{
	background:rgba(23,23,29,0.2);
	width:100%;
	height:100%;

	-webkit-transition: opacity .15s ease-in-out;
        -moz-transition: opacity .15s ease-in-out;
        -ms-transition: opacity .15s ease-in-out;
        -o-transition: opacity .15s ease-in-out;
        transition: opacity .15s ease-in-out;
}

.darker{
	background:rgba(23,23,29,0.7) !important;

	-webkit-transition: opacity .15s ease-in-out;
        -moz-transition: opacity .15s ease-in-out;
        -ms-transition: opacity .15s ease-in-out;
        -o-transition: opacity .15s ease-in-out;
        transition: opacity .15s ease-in-out;
}

.lighter{
	background:rgba(23,23,29,0) !important;

	-webkit-transition: opacity .15s ease-in-out;
        -moz-transition: opacity .15s ease-in-out;
        -ms-transition: opacity .15s ease-in-out;
        -o-transition: opacity .15s ease-in-out;
        transition: opacity .15s ease-in-out;
}

section#map{
	width:100%;
	height:100%;
	position:absolute;
	z-index:-1000;
}

.logobox{
	width:30%;
	position:relative;
	padding-left:30px;
	padding-top:30px;
}

.logo{
	cursor:pointer;
}

.infobox{
	margin-bottom:40px;
}

.infobox p{
	color:#fff;
	margin-left:30px !important;
	font-family: 'gothambold';
	font-size:20px;
	text-align:left;
	position:relative;
	/* use bold font here*/
}

.infobox > p.no-padding-left:before{
	position:absolute;
	left:-25px;
	top:1px;
	content:url('../img/before.svg');
	display:block;
	width:8px;
	height:16px;

}

.logo{
	width:100%;
	left:30px;
	top:30px;
}

nav.mobile{
	display:none;
}

nav.desktop{
	position:absolute;
	right:30px;
	bottom:30px;
}

nav.desktop ul{
	margin:0 !important;
	padding:0 !important;
}

nav.desktop ul li{
	list-style:none;
	text-align:right;
	display:block;
	margin:0 0 0 0;
}

nav.desktop ul li a{
		text-align:right;

}

nav.desktop ul li a:hover{
	opacity:0.9;
}

nav.desktop ul li a img{
	transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	transform-origin:100%;
	-webkit-transform-origin:100%;
	-moz-transform-origin:100%;
	text-align:right;
	margin:0;
}


.Absolute-Center.is-Responsive {
  width: 60%; 
  height: 60%;
  
}

.iconbox{
	text-align:right;
	height:100px;
	display:none;
	position:absolute;
	top:60px;
	right:32px;
}

.iconbox .description{
	position:absolute;
	bottom:-20px;
	left:0;
	display:none;
	text-align:right;

}

.iconbox .gallery{
	text-align: right;
	display:block;
	width:70px;
	height:52px;
	background-size:100%;
	background:url(../img/gallery.svg);
	cursor:pointer;
	float:right;
	margin-left:30px;

}

.iconbox .mapicon{
	display:block;
	width:52px;
	height:52px;
	background-size:100%;
	background:url(../img/map.svg);
	cursor:pointer;
	float:right;

}

.iconbox .pricelisticon{
	display:block;
	width:45px;
	height:45px;
	background-size:100%;
	background:url(../img/pricelist.svg);
	cursor:pointer;
	float:right;
	margin-right:30px;
	margin-top: 4px;
}

.address{
	background:none;
	z-index:1000;
	text-align:center;
	width: 100%;
  	overflow: auto;
  	margin: auto;
	position:absolute;
	top:52%;
	left:35%;
	width:30%;
  	display:block;
  	min-width: 200px;
  	display:none;
}

.address{
    font-family: 'gothambold';
	font-size:20px;
}

.address p.thelocation{
    font-family: 'gothambold';
}

.address .pdfprice{
	display:block;
	padding:10px 0 12px 0;
	border:1px solid white;
	max-width:200px;
	text-align: center;
	margin:0 auto;
	font-size:18px;
}


.modal{
	background:none;
	z-index:1000;
	text-align:left;
	border-radius:4px;
	display:none;
}

.modal.mobile{
	width: 100%;
  	height: 100%;
  	overflow: auto;
  	margin: auto;
  	position: absolute;
  	top: 0; left: 0; bottom: 0; right: 0;
  	display:block;
  	min-width: 200px;

  	padding: 40px;
  	border-radius:0;
}

.modal.desktop{
	position:absolute;
	top:30%;
	left:35%;
	width:30%;
	text-align: center;
}

.modal p, .modal h1{
	color:#fff;

}

.modal .close{
	display:block;
	width:20px;
	height:15px;
	position:absolute;
	top:8px;
	right:15px;
	background:url('../img/close.svg');
	z-index:4000;
	cursor:pointer;
}

.modal .closegrey{
	display:block;
	width:20px;
	height:15px;
	position:absolute;
	top:8px;
	right:15px;
	background:url('../img/closegrey.svg');
	z-index:4000;
	cursor:pointer;
}

.modal .close:hover, .modal .closegrey:hover{
	opacity:0.8;
}

.contactbox-outer{
	width:40%;
	position:relative;
	padding-left:30px;
	height:100%;
	bottom:280px;
}

.contactbox{
	position:absolute;
	left:20%;
	text-align:left;
}

.contactbox p{
	color:#fff;
	margin:0;
	font-family: 'gothambold';
	font-size:20px;
	/* use bold font here*/
}

.contactbox p span, #contactus p span{
    font-family: 'gothamlight';
}



.no-padding-left{
	padding-left:0 !important;
}

.contactbox p span{
	padding-right:10px;
}

/* MODALS */

.aboutusmobile, .contactusmobile{
	display:none;
}

#aboutus, #pricelist{
	display:none;
}

#contactus.mobile{
	display:none;
}

/* MAP CONTROLS */

a.zoomcontrol, a.terraintype{
	display:none;
}

.zoomin{
	background:url(../img/zoomin.svg);
	display:block;
	width:32px;
	height:32px;
	position:absolute;
	top:65px;
	right:70px;
	z-index:3000;
}

.zoomout{
	background:url(../img/zoomout.svg);
	display:block;
	width:32px;
	height:32px;
	position:absolute;
	top:65px;
	right:30px;
	z-index:3000;
}

.terraintype{
	position:absolute;
	top:30px;
	right:30px;
	z-index:3000;
	display:none;
}

.lebold{
	font-family:'gothambold';
}




/*============= MEDIA QUERIES ===========*/


@media only screen and (max-width: 1024px) {
    /* tablets and desktop */

    nav.desktop ul li a img{
		transform: scale(0.5);
		-webkit-transform: scale(0.5);
		-moz-transform: scale(0.5);
		margin-bottom:-30px;
	}

	.contactbox-outer{
		bottom:200px;
	}

	.contactbox-outer p{
		font-size:16px !important;
	}

    .Absolute-Center.is-Responsive {
    	width:50% !important;
    	padding:20px;
    }



}

@media only screen and (max-width: 700px) {

	body{
		background:url('../img/landing.jpg');
		background-size:cover;
		background-position:center;
        min-height: 400px;
	}

	.Absolute-Center.is-Responsive {
    	width:100% !important;
    	max-width:100%;
    	height:100%;
    	max-height:100%;
    	border-radius:0;
    	padding-top:60px;
    }

    .contactbox-outer{
    	width:50%;
    }

    .logobox{
    	width:90%;
    }

	.contactbox-outer{
		display:none;
	}

	nav.desktop{
        display: none;
		text-align:center;
		position:static;
		margin-top:20px;
	}

	nav.mobile{
		display:block;
		width:100%;
		height:50px;
		text-align:right;
		padding-top:10px;
	}

    #menuToggle{
        display: inline-block;
        position: relative;
        padding-right: 20px;
        padding-top: 10px;
        z-index: 4000;
    }

    #mobileMenu{
        background: rgba(0, 0, 0, 0.9);
        display: none;
        position: absolute;
        top:0;
        left:0;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        list-style-type: none;
        z-index: 3000;
        box-sizing: border-box;
        padding-top: 80px;
    }

    #mobileMenu li a{
        display: block;
        text-align: center;
        padding: 20px 0;
    }

    #callButton{
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 40px;
        width:100%;
    }   

	nav.mobile a{
		color:#fff !important;
		font-family: 'gothamlight';
		font-size:18px;
	}

	nav.desktop ul{
		width:100%;
		position:static;
	}

	nav.desktop ul li {
		text-align: center;
	}

	nav.desktop ul li a{
		display:block;
		text-align: center;
	}

	nav.desktop ul li a img {
		transform: scale(0.5);
		-webkit-transform: scale(0.5);
		-moz-transform: scale(0.5);
		text-align:center;
		transform-origin: 50% 100% 0;
		-webkit-transform-origin: 50% 100% 0;
		-moz-transform-origin: 50% 100% 0;
		margin-bottom:3px;
	}

	.iconbox{
		display:none !important;
	}

	.modal.mobile{
		background: rgba(0, 0, 0, 0.9);
        color: #FFFFFF;
        z-index: 2000;
	}

	.modal p, .modal h1{
		color:#FFFFFF;
	}

	.aboutusdesktop, .pricelistdesktop{
		display:none;
	}

	.terraintype{
		display:none;
	}

}