/** Custom icons **/

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

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	position: relative;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-house:before {
	content: "\e600";
}
.icon-link_arrow:before {
	content: "\e601";
}
.icon-download:before {
	content: "\e602";
}
.icon-hammer:before {
	content: "\e603";
}

/** Page elements **/

body {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	color: #212121;
	font-size: 16px;
}

a, a:visited {
	color: #ff8400;
	text-decoration: none;
}

a:hover, a:active {
	color: #414141;
	text-decoration: none;
}

strong {
	font-weight: 600;
}

div[class*="col-"] {
	padding-bottom: 20px;
}

form > div[class*="col-"] {
	padding-bottom: 0;
}

.navbar {
	z-index: 100;
}

.navbar-collapse {
	border-bottom: 1px solid transparent;
}

.navbar-nav>li>a {
	padding-top: 12px;
	padding-bottom: 14px;
	padding-left: 0;
	padding-right: 0;
	margin-right: 15px;
	margin-left: 15px;
	font-size: 16px;
	letter-spacing: 1px
}

.navbar-nav>li>a:hover {

}

.navbar-nav>li>a.active {

}

.nav-bg {
	background-color: #ffffff;
}

#frontpage {
	background-image: url("../img/primatalo-768.jpg");
	height: 300px;
}

#staff {
	background-image: url("../img/primatalo-ihmiset-768.jpg");
	height: 150px;
}

#services {
	background-image: url("../img/primatalo-palvelut-768.jpg");
	height: 150px;
}

#references {
	background-image: url("../img/primatalo-referenssit-768.jpg");
	height: 150px;
}

#contact {
	background-image: url("../img/primatalo-768.jpg");
	height: 150px;
}

.masthead {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.navbar-default {
	background-color: transparent;
	border-color: transparent;
	border-radius: 0;
}

.navbar-brand {
	padding-bottom: 5px;
	padding-top: 5px;
}

#logo-header {
	width: 113px;
	height: 16px;
	background: url("../img/primatalo-logo.svg") no-repeat center center;
	margin-left: 15px;
	margin-top: 16px;
	margin-bottom: 16px;
	background-size: 113px 16px;
}

.no-svg #logo-header {
	background-image: url("../img/primatalo-logo_16.png")
}

@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
	.no-svg #logo-header {
		background-image: url("../img/primatalo-logo32.png");
		background-size: 113px 16px;
	}
}

#logo {
	width: 113px;
	height: 16px;
	background: url("../img/primatalo-logo.svg") no-repeat center center;
    margin-bottom: 20px;
    margin-right: 10px;
	background-size: 113px 16px;
}

.no-svg #logo {
	background-image: url("../img/primatalo-logo_16.png")
}

@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
	.no-svg #logo {
		background-image: url("../img/primatalo-logo32.png");
		background-size: 113px 16px;
	}
}

.navbar-default .navbar-nav>li>a {
	color: #999999;
	text-transform: uppercase;
}

.navbar-default .navbar-nav>li>a.active {
	color: #ff8400;
}

.spacing-xs {
	margin-top: 20px;
}

.spacing-sm {
	margin-top: 10px;
}

.spacing-lg {
	margin-top: 40px;
}

.divider {
	margin-top: 10px;
	margin-bottom: 30px;
	border-top: 1px solid #ddd;
}

footer {
	background-color: #efefef;
	border-top: 1px solid #dddddd;
	padding-top: 30px;
	color: #999999;
	font-size: 14px;
}

footer h4 {
	text-transform: uppercase;
	font-size: 16px;
	border-top: 1px solid #ddd;
	padding-top: 30px;
}

footer img {
	margin-bottom: 20px;
	margin-right: 10px;
}

footer .container.light {
	padding-bottom: 30px;
}

footer .form-group {
	padding-left: 0;
}

footer .dark {
	background-color: #212121;
	min-height: 70px;
	padding-top: 16px;
	padding-bottom: 16px;
	color: #616161;
}

footer .dark a {
	color: #616161;
}

footer .dark a:hover {
	color: #999999;
}


.btn-default {
	color: #ffffff;
	background-color: #cccccc;
	border-color: #ccc;
	text-transform: uppercase;
}

.btn-default:hover {
	color: #ffffff;
	background-color: #ff8400;
	border-color: #ff8400;	
}

#map-canvas {
	width: 100%;
	height: 300px;
	border-radius: 4px;
	border: 1px solid #ddd;
}

/** Content **/

img {
	border: 1px transparent;
	border-radius: 4px;
}

h2 {
	font-weight: 800;
	font-size: 22px;
	text-transform: uppercase;
	margin-top: 0;
}

h2 > span[class^="icon-"], span[class*=" icon-"]{
	color: #ff8400;
	margin-right: 6px;
	font-size: 120%;
	top: 3px;
}

h3 {
	font-size: 20px;
}

.icon-link_arrow {
	top: 3px;
	margin-left: 3px;
	font-size: 110%;
}

abbr[data-original-title], abbr[title] {
	text-decoration: none;
	font-weight: 600;
	margin-right: 10px;
}

.headline {
	font-style: italic;
	color: #ffffff;
	text-transform: uppercase;
	position: relative;
	top: 10px;
	margin: 0 15px;
}

#frontpage > .headline {
	margin: 0 auto;
	text-align: center;
	top: 50px;
}

.headline h1 {
	font-size: 32px;
	font-weight: 600;
	margin: 0;
	text-shadow: 0px 0px 15px #212121;
}

.headline h1 span {
	font-weight: 800;
}

.lead {
	font-weight: 600;
}

.orange {
	width: 100%;
	height: 100%;
	background-color: rgba(255,132,0, 0.9);
	border: 1px transparent;
	border-radius: 4px;
	color: #ffffff;
	padding: 20px;	
}

.orange h2 {
	font-weight: 800;
	text-transform: uppercase;
	margin-bottom: 10px;
	margin-top: 5px;
	font-size: 24px;
}

.orange a {
	color: #ffffff;
	font-size: 20px;
	font-weight: 600;
}

.orange a:hover {
	color: #414141;
	text-decoration: none;	
}

.orange > a > span {
	margin-top: 20px;
}

.orange > a > span[class^="icon-"], span[class*=" icon-"] {
	top: 4px;
	font-size: 140%;
}

.cobox {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 178px;
	border: 1px transparent;
	border-radius: 4px;
	position: relative;
	margin-top: 10px;
}

.palvelut {
	background-image: url(../img/primatalo-palvelut.jpg);
}

.talopaketit {
	background-image: url(../img/primatalo-talopaketit-etusivu.jpg);
}

.huoneistoremontit {
	background-image: url(../img/primatalo-huoneistoremontit.jpg);
}

.overlay {
	display: block;
	position: absolute;
	bottom: 0;
	padding: 0 20px;
	color: #ffffff;
	background-color: rgba(33,33,33, 0.7);
	left: 0;
	right: 0;
	border: 1px transparent;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

.overlay h3 {
	color: #ffffff;
	text-transform: uppercase;
	font-size: 20px;
	margin-bottom: 5px;
}

.overlay a {
	color: #ffffff;
}

.overlay a:hover {
	color: #ff8400;
}

.faq {
	background-color: #efefef;
	border: 1px solid #dddddd;
	border-radius: 4px;
	font-size: 16px;
	padding-top: 20px;
	font-weight: 600;
	margin-left: 0;
	margin-right: 0;
	text-align: center;
	text-transform: uppercase;
}

/** Responsive **/

@media (min-width: 768px) {

.navbar-nav>li>a {
	font-size: 14px;
	border-top: 4px solid #ffffff;
}

.navbar-nav>li>a:hover {
	border-top: 4px solid #ff8400;
}

.navbar-nav>li>a.active {
	border-color: #ff8400;
}

#frontpage {
	background-image: url("../img/primatalo-1024.jpg");
	height: 500px;
}

#staff {
	background-image: url("../img/primatalo-ihmiset-1024.jpg");
	height: 300px;	
}

#services {
	background-image: url("../img/primatalo-palvelut-1024.jpg");
	height: 300px;	
}

#references {
	background-image: url("../img/primatalo-referenssit-1024.jpg");
	height: 300px;	
}

#contact {
	background-image: url("../img/primatalo-1024.jpg");
	height: 300px;	
}

.headline {
	top: 70px;
	width: 750px;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}

#frontpage > .headline {
	top: 100px;
}

.spacing-xs {
	margin-top: 0;
}

.headline h1 {
	font-size: 56px;	
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 24px;
}

.orange h2 {
	font-size: 30px;
}

.orange a {
	line-height: 40px;
}

.faq {
	padding: 20px;
	font-size: 20px;
}

}

@media (min-width: 992px) {

div[class*="col-"] {
	padding-bottom: 0;
}

.navbar-right {
	float: right!important;
	margin-right: 0;
}

.navbar-nav>li>a {
	padding-top: 23px;
	padding-bottom: 23px;
	margin-right: 15px;
	margin-left: 15px;
	font-size: 16px;
}

#logo-header {
	width: 187px;
	height: 27px;
	background: url("../img/primatalo-logo.svg") no-repeat center center;
	margin-top: 24px;
	margin-bottom: 24px;
	background-size: 187px 27px;
}

.no-svg #logo-header {
	background-image: url("../img/primatalo-logo1x.png")
}

@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
	.no-svg #logo-header {
		background-image: url("../img/primatalo-logo2x.png");
		background-size: 187px 27px;
	}
}

#logo {
	width: 187px;
	height: 27px;
	background: url("../img/primatalo-logo.svg") no-repeat center center;
    margin-bottom: 20px;
    margin-right: 10px;
	background-size: 187px 27px;
}

.no-svg #logo {
	background-image: url("../img/primatalo-logo1x.png")
}

@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
	.no-svg #logo {
		background-image: url("../img/primatalo-logo2x.png");
		background-size: 187px 27px;
	}
}

.spacing-sm {
	margin-top: 20px;
}

.spacing-lg {
	margin-top: 70px;
}

.divider {
	margin-top: 25px;
	margin-bottom: 45px;	
}

#frontpage {
	background-image: url("../img/primatalo-1280.jpg");
}

#staff {
	background-image: url("../img/primatalo-ihmiset-1280.jpg");
	height: 320px;
}

#services {
	background-image: url("../img/primatalo-palvelut-1280.jpg");
	height: 320px;
}

#references {
	background-image: url("../img/primatalo-referenssit-1280.jpg");
	height: 320px;
}

#contact {
	background-image: url("../img/primatalo-1280.jpg");
	height: 320px;
}

.headline {
	width: 970px;
	top: 60px;
}

.cobox {
	height: 258px;
	margin-top: 0;
}

.orange h2 {
	margin-bottom: 20px;
	margin-top: 20px;
	font-size: 24px;
}

footer {
	padding-top: 60px;
}

footer .dark {
	padding-top: 26px
}

footer .equalheight {
	overflow: hidden;
}

footer .container.light {
	padding-bottom: 60px;
}

footer h4 {
	margin-top: 0;
	margin-bottom: 30px;
	border-top: 0px solid transparent;
	padding-top: 0;	
}

footer .border-box {
	border-right: 1px solid #ddd;
	margin-bottom: -99999px;
	padding-bottom: 99999px;
}

footer .border-box:last-child {
	border-right: 0px solid transparent;
}

.dark {
	min-height: 50px;
}

.footerlinks {
	float: right !important;
}

}

@media (min-width: 1200px) {

#frontpage {
	background-image: url("../img/primatalo-1920.jpg");
}

#staff {
	background-image: url("../img/primatalo-ihmiset-1920.jpg");
}

#services {
	background-image: url("../img/primatalo-palvelut-1920.jpg");
}

#references {
	background-image: url("../img/primatalo-referenssit-1920.jpg");
}

#contact {
	background-image: url("../img/primatalo-1920.jpg");
}

.headline {
	width: 1170px;
}

.orange h2 {
	font-size: 30px;
}

}