/* CSS Document */
@font-face {
	font-family: 'D-DIN'; 
	src: url('../fonts/D-DIN-Regular.eot?#iefix') format('embedded-opentype'); 
	src: url('../fonts/D-DIN-Regular.ttf') format('truetype'); 
	src: url('../fonts/D-DIN-Regular.woff') format('woff'); 
	src: url('../fonts/D-DIN-Regular.svg#D-DIN-Regular') format('svg'); 
	src: local(☺), url("../fonts/D-DIN-Regular.ttf"); 
   font-weight: normal; 
   font-style: normal;
}
@font-face {
	font-family: 'D-DIN'; 
	src: url('../fonts/D-DIN-Bold.eot?#iefix') format('embedded-opentype'); 
	src: url('../fonts/D-DIN-Bold.ttf') format('truetype'); 
	src: url('../fonts/D-DIN-Bold.woff') format('woff'); 
	src: url('../fonts/D-DIN-Bold.svg#D-DIN-Bold') format('svg'); 
	src: local(☺), url("../fonts/D-DIN-Bold.ttf"); 
   font-weight: bold; 
   font-style: normal;
}
/* DEBUG *xxxxx/
* {
	border: solid 1px #f00;
	}
/* */
body {
	font-family: 'D-DIN-Regular', sans-serif!important;
	background-color: #111111;
	font-size:1.0em;
	color:#eee;
}

body,html {
    width: 100%;
    height: 100%;
	margin:0;
}
#page_content {
	margin-top: 30px;
	margin-bottom: 20px;
	}

.float-left {
	float:left;
	}
.float-right {
	float:right;
	}
.navbar {
	margin-left:-15px;
	margin-right:-15px;
	}
a.nav-link {
	padding:10px;
	}
	
strong {
	font-weight:700!important;
	}
.fb-page {
	overflow:hidden!important;
	}
@media (min-width:993px){
	.navbar.navbar-expand-lg.navbar-dark.bg-dark {
		padding:0px 0px!important;
		}
}
.nav-item:hover,
.nav-item:hover a {
	background-color:#000;
	color:#F00!important;
	}
@media (max-width:1250px){
	#page_content.container,
	.footer.container,
	.navbar .container {
		max-width:100%!important;
		}
}


	#header-container {
			background-color:#000!important;
			background: url("../kuvat/header_bg.jpg") no-repeat 0px 100% / cover transparent;
	}
	#header-container {
		position:relative;
	}
	#header-container {
			background-position:bottom center;
		}
		
	.header_bg_container .header_bg_canvas {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: 0;
		padding: 0;
	}
	.header_bg_container .header_bg_canvas{}
	.header_bg_container {
		position: relative;
		min-width: 100%;
		padding-bottom: 20%; /* Suhde 11:4 ( 100%/11*4 = 36.36% ) */
	}
	.header_bg_canvas { 
			width:100%; height:100%;
		}

.header_logo {
	position:absolute;
	left:10px;
	bottom:20px;
	width:25%;
	}

.header_qd {
	position:absolute;
	right:10px;
	bottom:20px;
	width:13%;
	}

@media (max-width:1400px){
	.header_qd {
		width:16%;
	}
}
@media (max-width:767px){
	.header_logo,
	.header_qd,
	#header-container	{
		display:none;
		}
}

@media (min-width:768px){
	.extra_header_mobile {
		display:none;
		}
}
.footer_qd_mobile {
	display:none;
	}
.header_qd_mobile {
	margin-top:20%;
		}
.header_logo_mobile {
	margin:10px;
	}		
	
@media (max-width:575px){
	.extra_header_mobile .header_qd_mobile {
		display:none;
		}
	.header_logo_mobile {
		margin-left:0px;
		}
	.footer_qd_mobile {
	display:block;
	float:right;
	height:40px;
	}
}
.navbar-dark .navbar-nav .nav-link {
	color:#ddd!important;
	}
		
		
.navbar-expand-lg  {
	background-color:#000;
	border-top: solid 1px #f00;
	background-image: url(../kuvat/header_menu_bg.png)!important;
    background-repeat: repeat-x;
    background-size: contain;
    position: relative;
	color:#ddd;
	}

#lomake input,
#lomake textarea,
.g-recaptcha,
#lomake .alert {
	margin:4px;
	}


.card.yhteystiedot {
	background-color:#000;
	border: solid 1px #666;
	color:#eee;
	width:inherit!important;
	padding-left:20%;
	}

@media (max-width:767px){
	.card.yhteystiedot {
		display:none;
		}
	#footer > div.col-sm-4 {
		padding-right:-15px!important;
		}
}
@media (max-width:992px){
	.card.yhteystiedot {
	padding-left:2%;
	}
}


.card.rengas  {
	background-image: url(../kuvat/card_bg.png)!important;
    background-repeat: repeat-x;
    background-size: contain;
    position: relative;
	color:#111;
	}
.card.rengas {
	text-align:center;
	}
.card.rengas  {
	margin:30px 30px 30px 0;
	}

@media (max-width:992px){
	.card.rengas  {
	margin:15px 0px 15px 0px;
	}
	#footer p {
		font-size:0.8em;
		}
}
.rengaskuva  {
	max-height:200px!important;
	margin:0px 15px 0px 0px;
	}
.rengaslogo  {
	margin-top:10%;
	padding-bottom:10px;
	}
.card.rengas  p {
	font-size:1.15em;
	}

.footer_phone_icon {
	padding: 15px 15px 0 0;
	}


#back-to-top {
    position: fixed;
    bottom: 150px!important;
    right: 10px;
    display: none;
	background-color: #fff;
	color:#000;
}

.copyright,
.design{
	font-size:0.8em;
	color:#ccc;
	}

@media (min-width:650px){	
.copyright {
	float:left;
	}
.design {
	float:right;
	}
	
}
.nmt20 {
	margin-top:-20px;
	}

.white {	color:#fff!important;	}
.blue {	color: #0090de;}
.green, a, a:link, a:visited { color: #f00;}
.grey { color: #666666;}
.light-grey { color:#999999;}


@media (max-width:1199px){
	

}
@media (max-width:649px){
	
.copyright,
.design{
	display:block!important;
	width:100%!important;
	text-align:left!important;
	font-size:0.6em!important;
	}
.design{
	margin-top:-10px!important;
}
}
@media (max-width:768px){
	.footer_phone_icon {
		display:none!important;
		}
}
@media (min-width:1200px){
			}

	

.modal-content {
	color:#000;
	}

#footer {
	background-image: url(../kuvat/footer_bg.png)!important;
    background-repeat: repeat-x;
    background-size: contain;
    position: relative;
	color:#eee;
	}
#footer a, #footer a:link, #footer a:visited {
	color:#fff;
	text-decoration:underline;
	}


/* yläbannerislide - Suhde 20:6 ( 100%/20*6 = 30% ) */
.embed-responsive-20by6::before{padding-top:30%}

/* tuotedia - Suhde 8:4,2 ( 100%/8*4,2 = 52,5% ) */
.embed-responsive-80by42::before{padding-top:52,5%}



.nm { margin:0px!important;}
.np { padding:0px!important;}
.n_mt20 { margin-top:-20px;}
.n_mb10 { margin-bottom:-10px;}
.n_mb15 { margin-bottom:-15px;}
.n_mb20 { margin-bottom:-20px;}

.p10 { padding:10px;}
.p20 { padding:20px;}
.p30 { padding:30px;}
.p40 { padding:40px;}
.p50 { padding:50px;}

.m10 { margin:10px;}
.m20 { margin:20px;}
.m30 { margin:30px;}
.m40 { margin:40px;}
.m50 { margin:50px;}

.mt5 { margin-top:5px;}
.mt10 { margin-top:10px;}
.mt20 { margin-top:20px;}
.mt30 { margin-top:30px;}
.mt40 { margin-top:40px;}
.mt50 { margin-top:50px;}
.mr10 { margin-right:10px;}
.mr20 { margin-right:20px;}
.mr30 { margin-right:30px;}
.mb10 { margin-bottom:10px;}
.mb20 { margin-bottom:20px;}
.mb30 { margin-bottom:30px;}
.ml10 { margin-left:10px;}
.ml20 { margin-left:20px;}
.ml30 { margin-left:30px;}

.pt10 { padding-top:10px;}
.pt20 { padding-top:20px;}
.pt30 { padding-top:30px;}
.pt40 { padding-top:40px;}
.pt50 { padding-top:50px;}
.pr10 { padding-right:10px;}
.pr20 { padding-right:20px;}
.pr30 { padding-right:30px;}
.pb10 { padding-bottom:10px;}
.pb20 { padding-bottom:20px;}
.pb30 { padding-bottom:30px;}
.pl10 { padding-left:10px;}
.pl20 { padding-left:20px;}
.pl30 { padding-left:30px;}



	.visble-sm-down { display:none!important;}
@media (max-width:992px){
	.visble-sm-down { display:block!important;}
}

	.visble-md-up{ display:none!important;}
@media (min-width:992px){
	.visble-md-up { display:block!important;}
}

@media (max-width:575px){
	.visble-sm-up { display:none!important;}
}

@media (min-width:576px){
	.visble-sm-up { display:block!important;}
}

@media (max-width:575px){
.visible-xs { display:block!important;}
.visible-sm { display:none!important;}
.visible-md { display:none!important;}
.visible-lg { display:none!important;}
.visible-xl { display:none!important;}
}

@media (min-width:576px){
.visible-xs { display:none!important;}
.visible-sm { display:block!important;}
.visible-md { display:none!important;}
.visible-lg { display:none!important;}
.visible-xl { display:none!important;}
}

@media (min-width:768px){
.visible-xs { display:none!important;}
.visible-sm { display:none!important;}
.visible-md { display:block!important;}
.visible-lg { display:none!important;}
.visible-xl { display:none!important;}
}

@media (min-width:993px){
.visible-xs { display:none!important;}
.visible-sm { display:none!important;}
.visible-md { display:none!important;}
.visible-lg { display:block!important;}
.visible-xl { display:none!important;}
}
@media (min-width:1200px){
.visible-xs { display:none!important;}
.visible-sm { display:none!important;}
.visible-md { display:none!important;}
.visible-lg { display:none!important;}
.visible-xl { display:block!important;}
}