/*

	Style.css

	01. Basics
	02. Top bar
	03. Home
	04. Intro
	05. Work
	06. Call to action
	07. Services
	08. Process
	09. About
	10. Contact
	11. Footer
	12. 404 Page
	13. Responsive settings

*/


/* ==================== 01. Basics ==================== */
body {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 25px;
	color: #777777;
}

p {
	margin-bottom: 25px;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #111111;
}

h1, .h1 {
	font-size: 30px;
	line-height: 1.5em;
	margin-bottom: 25px;
}

h2, .h2 {
	font-size: 24px;
	line-height: 1.5em;
	margin-bottom: 25px;
}

h3, .h3 {
	font-size: 16px;
	line-height: 25px;
	margin-bottom: 0;
}

h4, .h4 {
	font-size: 14px;
	line-height: 25px;
	margin-bottom: 0;
}

h5, .h5 {
	font-size: 13px;
	line-height: 25px;
	margin-bottom: 0;
}

h6, .h6 {
	font-size: 13px;
	line-height: 20px;
	margin-bottom: 0;
}

/* Responsive headings */
.bigtext h1, h1.bigtext,
.bigtext h2, h2.bigtext,
.bigtext h3, h3.bigtext,
.bigtext h4, h4.bigtext,
.bigtext h5, h5.bigtext,
.bigtext h6, h6.bigtext {
	margin-bottom: 10px;
}

.bigtext h1, h1.bigtext {
	font-size: 90px;
	line-height: 1em;
}

.bigtext h2, h2.bigtext {
	font-size: 75px;
	line-height: 1em;
}

.bigtext h3, h3.bigtext {
	font-size: 60px;
	line-height: 1em;
}

.bigtext h4, h4.bigtext {
	font-size: 48px;
	line-height: 1.25em;
}

.bigtext h5, h5.bigtext {
	font-size: 36px;
	line-height: 1.25em;
}

.bigtext h6, h6.bigtext {
	font-size: 24px;
	line-height: 1.5em;
}

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

	/* Responsive headings */
	.bigtext h1, h1.bigtext {
		font-size: 60px;
	}

	.bigtext h2, h2.bigtext {
		font-size: 48px;
	}

	.bigtext h3, h3.bigtext {
		font-size: 36px;
	}

	.bigtext h4, h4.bigtext {
		font-size: 30px;
	}

	.bigtext h5, h5.bigtext {
		font-size: 24px;
	}

	.bigtext h6, h6.bigtext {
		font-size: 18px;
	}

}

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

	/* Responsive headings */
	.bigtext h1, h1.bigtext {
		font-size: 36px;
	}

	.bigtext h2, h2.bigtext {
		font-size: 30px;
	}

	.bigtext h3, h3.bigtext {
		font-size: 24px;
	}

	.bigtext h4, h4.bigtext {
		font-size: 18px;
	}

	.bigtext h5, h5.bigtext {
		font-size: 16px;
	}

	.bigtext h6, h6.bigtext {
		font-size: 14px;
	}

}

/* Links */
a {
	color: #f1615f;
	text-decoration: underline !important;
}

a:hover {
	color: #111111;
}

.gallery-link a {
	cursor: pointer;
}

/* Smooth hover effects */
a,
a i,
button,
input[type="submit"] {
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

a:hover,
a i:hover,
button:hover,
input[type="submit"]:hover {
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* Cursor styling for icons */
i {
	cursor: default;
}

a i {
	cursor: pointer;
}

/* Lists */
.ol {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
	margin-left: 2em;
	margin-bottom: 25px;
}

.ol ol,
.ul ol {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
}

.ul {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: 1em;
	margin-bottom: 25px;
}

.ol ul,
.ul ul {
	list-style-type: disc;
	list-style-position: outside;
}

.ol ol,
.ol ul,
.ul ol,
.ul ul {
	margin-left: 2em;
}

/* Typographic styles */
.italic, em {
	font-style: italic;
}

.bold, b, strong {
	font-weight: 600;
}

.thin {
	font-weight: 300;
}

.x-thin {
	font-weight: 100;
}

.serif {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.uber {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Text colors */
.text-color {
	color: #f1615f;
}

.text-light {
	color: #bbbbbb;
}

.text-dark {
	color: #111111;
}

.text-white {
	color: #ffffff;
}

/* Dropcap */
.dropcap {
	float: left;
	color: #111111;
	font-size: 50px;
	line-height: 50px;
	padding-right: 8px;
	padding-left: 3px;
}

/* Quotes */
blockquote {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: 1.25em;
	padding: 25px;
	background: #fafafa;
	border-left: 5px solid #eeeeee;
	margin-bottom: 25px;
}

blockquote small {
	display: block;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 0.75em;
	font-weight: 400;
	font-style: normal;
}

blockquote small:before {
	content: '\2014 \00A0';
}

q {
	quotes: "\"" "\"" """ """;
}

q:before {
	content: '\201C';
}

q:after {
	content: '\201D';
}

/* Buttons */
/* Buttons styling */
.btn,
button,
input[type="submit"] {
	display: inline-block;
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 25px;
	padding: 12px 25px;
	color: #ffffff;
	background: #111111;
	text-decoration: none;
	-webkit-border-radius: 5px;
			border-radius: 5px;
}

a.btn:hover,
button:hover,
input[type="submit"]:hover,
a .icon:hover {
	color: #ffffff;
	background: #f36f6e;
	text-decoration: none;
}

button:hover,
input[type="submit"]:hover,
a i:hover {
	cursor: pointer;
}

/* Icon inside a button */
.btn > i {
	font-size: 14px;
	margin-right: 0.5em;
}

/* Button outline style */
.btn.outline {
	color: #111111;
	background: none;
	border: 2px solid #111111;
	padding: 10px 23px;
}

a.btn.outline:hover,
button.outline:hover,
input[type="submit"].outline:hover {
	color: #ffffff;
	background: #f36f6e;
	border: 2px solid #ff4800;
	border: 2px solid rgba(255,72,0,1);
}

/* Button colors */
.btn.color {
	background: #f36f6e;
}

.btn.outline.color {
	color: #f1615f;
	background: none;
	border: 2px solid #ff4800;
}

.btn.light {
	color: #ffffff;
	background: #f36f6e;
}

.btn.outline.light {
	color: #ffffff;
	background: none;
	border: 2px solid #cccccc;
	border: 2px solid rgba(255,255,255,0.3);
}

.btn.dark {
	color: #111111;
	background: #aaaaaa;
	background-color: #f1615f;
	background-position: 17;
}

.btn.outline.dark {
	color: #111111;
	background: none;
	border: 2px solid #aaaaaa;
	border: 2px solid rgba(17,17,17,0.3);
}

.btn.white {
	color: #FFF;
	background-color: #f36f6e;
}

.btn.outline.white {
	color: #ffffff;
	background: none;
	border: 2px solid #ffffff;
}

/* Buttons reset */
button,
input[type="submit"] {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	padding: 0;
}

input[type="submit"] {
	border: 0;
	width: auto;
}

/* Fixing the broken lineheight model in FF */
input::-moz-focus-inner { 
	border: 0; 
	padding: 0; 
	margin-top: 5px; 
	margin-bottom: 5px; 
}

@-moz-document url-prefix() { 
	input[type="submit"] {
		line-height: 15px;
	}
}

/* Headers */
.header {
	position: relative;
	display: block;
	width: 100%;
	height: 640px;
}

.header.large {
	height: 550px;
	background-image: url(../images/atrs-image-dark.jpg);
}

.header.medium {
	height: 480px;
}

.header.small {
	height: 320px;
}

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

	.header,
	.header.large {
		height: 480px;
	}
	
	.header.medium {
		height: 320px;
	}

}

/* Header with centered content */
.header-inner {
	position: absolute;
	top: 298px;
	left: 777px;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	max-width: 740px;
	min-width: 300px;
	text-align: center;
	z-index: 60; /* Should be 50+ because of the bxSlider */
}

/* Background image */
.bg-img {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

/* Fixed backgrounds only on non-touch devices */
.bg-img.fixed {
	background-attachment: scroll;
}

.no-touch .bg-img.fixed {
	background-attachment: fixed;
}

/* Background images */
.background-one {
	background-image: url(images/Untitled-1.jpg);
}

.background-two {
	background-image: url('../images/placeholder-1800x1200.png');
}

.background-three {
	background-image: url(images/tantalus-lodge-image.png);
}

.background-four {
	background-image: url(../images/placeholder-1800x1200.png);
}

.background-five {
	background-image: url('../images/placeholder-1800x1200.png');
}

/* Title */
.title {
	text-align: center;
}

.title h1,
.title h2 {
	font-size: 16px;
	line-height: 25px;
	margin-bottom: 15px;
}

.title hr {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: #cccccc;
	margin-bottom: 75px;
}

.title.title-light h1,
.title.title-light h2 {
	color: #ffffff;
}

.title.title-light hr {
	background: #555555;
}

/* Title on headers */
.header hr {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: #ffffff;
	filter: alpha(opacity=50);
	opacity: 0.5;
	margin-bottom: 5px;
}

/* Underline link */
a.underline {
	padding-bottom: 1px;
	border-bottom: 1px dotted #cccccc;
}

a.underline:hover {
	border-bottom: 1px dotted #111111;
}

/* Links for dark backgrounds */
a.inverted:hover {
	color: #ffffff;
}

a.inverted.underline {
	padding-bottom: 1px;
	border-bottom: 1px dotted #555555;
}

a.inverted.underline:hover {
	border-bottom: 1px dotted #ffffff;
}

/* Arrow link */
a.arrow-link {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #111111;
}

a.arrow-link:before {
	font-family: 'FontAwesome';
	content: '\f054';
	color: #aaaaaa;
	margin-right: 7px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

a.arrow-link:hover,
a.arrow-link:hover:before {
	color: #f1615f;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}


/* The hover effect */
.o-hover {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: rgba(255,255,255,0.0);
	background: rgba(0,0,0,0.0);
	visibility: visible;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover,
.overlay-item a:hover > .o-hover {
	color: rgba(255,255,255,1);
	background: rgba(0,0,0,0.5);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

/* The information inside the hover */
.o-hover span {
	font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	line-height: 20px;
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
}

.o-hover em {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(255,255,255,0);
	display: inline-block;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover em,
.overlay-item a:hover > .o-hover em {
	color: rgba(255,255,255,1);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.o-hover i {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(255,255,255,0);
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover i,
.overlay-item a:hover > .o-hover i {
	color: rgba(255,255,255,1);
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.overlay-item:hover > .o-hover i:hover,
.overlay-item a:hover > .o-hover i:hover {
	color: #111111;
	background: #ffffff;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
}

.o-hover i.fa-2x {
	font-size: 2em;
}

.overlay-item:hover > .o-hover i.fa-2x:hover,
.overlay-item a:hover > .o-hover i.fa-2x:hover {
	color: #ffffff;
	background: none;
}

/* Extra info below images used for portfolio thumbnails and employee images */
.e-info {
	position: relative;
	display: block;
	background: #ffffff;
	padding: 15px 15px 25px;
	text-align: center;
}

.e-info h3 {
	font-size: 13px;
	line-height: 20px;
	margin-bottom: 0;
}

.e-info p {
	color: #aaaaaa;
	line-height: 20px;
	margin-bottom: 0;
}


/* ==================== 02. Top bar ==================== */
.top-bar {
	position: fixed;
	top: 0;
	display: block;
	width: 100%;
	z-index: 99;
	-webkit-transition: all .2s;
	   -moz-transition: all .2s;
		-ms-transition: all .2s;
		 -o-transition: all .2s;
			transition: all .2s;
	background-position: 7;
}

/* Typographic logo for the top bar */
.tb-logo {
	margin-left: 20px;
}

.tb-logo h1 {
	float: left;
	text-align: left;
	font-size: 13px;
	line-height: 25px;
	color: #ffffff;
	margin-top: 15px;
	margin-bottom: 0;
}

.tb-logo h1 a {
	text-decoration: none;
	color: #ffffff;
}

.tb-logo h1 a:hover {
	color: #ffffff;
}

/* Image logo for the top bar */
.tb-logo img {
	float: left;
	text-align: left;
	width: auto;
	max-height: 167px;
	margin-top: -25px;
	margin-right: 10px;
	margin-bottom: 0;
	margin-left: 0;
}


/* Responsive settings for the menu */
@media only screen and (max-width: 768px) {

	.top-bar {
		padding-top: 0;
	}
	
	p {
margin-bottom: 25px;
padding-left: 20px;
padding-right: 20px;
}

	/* The toggle */
	.toggle {
		display: none;
		position: relative;
		cursor: pointer;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		user-select: none;
		color: #777777;
		float: right;
		font-family: 'FontAwesome';
		text-align: center;
		font-size: 14px;
		width: 50px;
		height: 50px;
		line-height: 50px;
		-webkit-transition: all .2s;
		   -moz-transition: all .2s;
			-ms-transition: all .2s;
			 -o-transition: all .2s;
				transition: all .2s;
	}


}

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

	.tb-logo {
		margin-left: 5px;
	}

	.toggle {
		margin-right: -10px;
	}


	p {
margin-bottom: 25px;
padding-left: 20px;
padding-right: 20px;
}
}


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

	.tb-large {
		padding-top: 0;
		padding-bottom: 0;
	}
	
	p {
margin-bottom: 25px;
padding-left: 20px;
padding-right: 20px;
}

}

/* Transparent top bar */
.top-bar.tb-transp {
	background: #none;
	background: rgba(7,7,7,0.0);
}

.tb-transp .menu ul li a {
	color: #ffffff;
	color: rgba(255,255,255,0.5);
}

.tb-transp .menu ul li:hover a {
	color: #ffffff;
}

.tb-small.tb-transp {
	background-position: 7;
}

/* Responsive settings for the transparent top bar */
@media only screen and (max-width: 768px) {

	.top-bar.tb-transp {
		background: #111111;
		background: none !important;
	}

}


/* ==================== 03. Home ==================== */
.home {
	z-index: 1;
}

.topspace {
	padding-top: 0px;
	background-image: url(../images/atrs-image-dark.jpg);
	height: 750px;
	margin-top: 0px;
	margin-right: auto;
}

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

	.topspace {
		padding-top: 50px;
	}
	
	.home .bx-wrapper .bx-controls-direction a {
		top: 100%;
		margin-top: -53px;
	}

}


/* ==================== 04. Introduction ==================== */
.intro {
	background: #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
}



/* ==================== 06. Call to action ==================== */
.cta {
	padding-top: 100px;
	padding-bottom: 100px;
}

/* ==================== 09. About ==================== */
.about {
	background: #f4f4f4;
	padding-top: 100px;
	padding-bottom: 100px;
}

.bg-white {
	background: #ffffff;
}

.bg-padding {
	padding: 75px 20px;
}

/* Quote slider */
.qs-wrap p {
	color: #aaaaaa;
}

.qs-wrap {
	margin-top: 2px;
}

.qs-wrap .bx-wrapper .bx-pager {
bottom: -25px;
}



/* Loader image */
.loader {
	margin-left: 10px;
}




/* ==================== 13. Responsive settings ==================== */
/* Tablet portrait - Medium */
@media only screen and (max-width: 768px) {

	.title hr {
		margin-bottom: 50px;
	}

	.bg-padding {
		padding: 50px 15px;
	}

	.section-slider {
		padding-top: 75px;
		padding-bottom: 100px;
	}


}

/* Smartphone landscape - Small */
@media only screen and (max-width: 480px) {

	.title hr {
		margin-bottom: 25px;
	}

	.bg-padding {
		padding: 25px 10px;
	}


}