html {position: relative;
min-height: 100%;
-webkit-text-size-adjust: none;}
body {background-color: #52606b;}
.mainimage {position:relative;
float:left;
clear:both;
background-color: #c51927;
background-size:contain;
width:100%;
height: 300px;
overflow:hidden;
margin-bottom: 20px;
}

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

.mainimage {
height:200px
}

}

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

.mainimage {
height:120px
}}
.footer {position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 65px;
background-color: #f5f5f5;}
body > .container {padding: 60px 15px 0;}
.container .text-muted {margin: 20px 0;}
.footer > .container {padding-right: 15px;
padding-left: 15px;}
footer {display:none;}
.spacer {padding-bottom: 20px;
padding-top:20px;}
.subline {display:block;
border-bottom: 1px solid #ccc;
width: 100%;
padding: -15px 0 0 0;
margin: 0 0 15px 0;}
.centerlog {float:none;
clear:both;
display:block;
margin: 0 auto !important;}
.fieldnod {display:none;
visibility:hidden;}
.form-group {margin-bottom: 15px;}
.trenner {position:relative;
float:left;
clear:both;
background:url(src/bgmainimage.png) bottom center no-repeat #f1975c;
background-size:contain;
width:100%;
min-height: 400px;
overflow:hidden;
margin-bottom: 20px;
}

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

.trenner {
min-height:250px
}

}

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

.trenner {
min-height:200px
}}
#logo {position: relative;
top: 0px;
left: -15px;
width: 210px;
height: 80px;
z-index: 999;
}


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

#logo {
height:50px;
overflow:hidden;
}

}
#logo img {width:100%;
height:auto;}
.bottomspacer {margin-bottom: 10px;}
nav {display:block;
}

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

nav {
display:none; }}
.slicknav_menu {display: none;
}

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

.slicknav_menu {
display:block;
text-align:left;
}}
#bagmenu {background: url(../src/bag_navbar_schmal.png) top center repeat-x #fff;
height:80px;}
.nopadding {padding:0;}
.topdown50 {margin: 50px auto 30px auto !important;}
.topdown30 {margin: 20px auto 30px auto !important;}
.viewport, .viewportfront, .collapse {float: left;
width: 100%;
margin: 0;
overflow: hidden;
position: relative;}
.viewport a {display: block;
position: relative;}
.viewport a img, .viewportfront a img {position: relative;
width:100%;
height:auto;}
.viewport a span, .viewportfront a span {display: none;
height: 100%;
padding: 5%;
position: absolute;
text-align: center;
text-decoration: none;
width: 100%;
z-index: 100;}
.viewport a span p, .viewportfront a span p {display: block;
font-weight: normal;
font-size: 110%;
line-height: 115%;
color:#000;
padding:0;
margin:0;
}

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

viewport a span p,
.viewportfront a span p {
font-size: 90%;
line-height: 100%;
}}
.viewport a span h3, .viewportfront a span h3 {font-family: fira-m, Arial, sans-serif;
color:#000;
padding:4% 0 0 0;
margin:0 0 0.3em 0;}
.dark-background {background: url(../src/whiteopac.png) top repeat;
color: #f000;
}
white, .white p, .white h3, .white h2, .white h1 {color: #ffffff !important;}
.cleanfoot {display:block;
height: 65px;
width:100%;}
.vertcenter {position: absolute;
top: 50%;
transform: translateY(-50%);
border: 1px dashed deeppink;}
.bg_spot {background: url(../src/spotrepair.jpg) center center no-repeat #8c8e8f;
background-size: cover;
}


@media only screen and (max-width: 668px) {

.bg_spot {

background: #8c8e8f;
background-image: none;
}

}
.no-border {border: 0 !important;}
.topspace {margin-top: 7px;}
.no-padding {padding-left:0;
padding-right:0;}
h1 {margin-bottom: 15px !important;}
.bg_cold {background: url(../src/frozen-bg.jpg) center center no-repeat #3f6288;
background-size: cover;
}


@media only screen and (max-width: 668px) {

.bg_cold {

background: #3f6288;
background-image: none;
}}
.floater {float: left;
clear:both;
padding-top:15px;
padding-bottom: 20px;}
.topspace30 {padding-top:30px;}
.fieldnod {display:none;
visibility:hidden;}
input.usrurl {float:left;
text-align: left;
border: none;
height:0px;
width:200px;
display:none;
visibility:hidden;}
.formspacer {padding-bottom: 13px;
padding-top:13px;}
.bottom25 {margin-bottom:25px;}
.drops {background: url(../src/bg_drops.jpg)center center no-repeat;
background-size: cover;}
.job-box {width: 200px;
height: 200px;
transform:rotate(350deg);
z-index: 9999;
transition: all 0.5s ease;
}

.job-box:hover {
width: 240px;
height: 240px;
transform:rotate(360deg);
z-index: 999;
transition: all 0.5s ease;
}

/* On screens 500px or less */
@media screen and (max-width: 600px) {
.job-box {
width: 130px;
height: 130px;
transform:rotate(350deg);
z-index: 999;
transition: all 0.5s ease;
}

.job-box:hover {
width: 220px;
height: 220px;
transform:rotate(360deg);
z-index: 999;
transition: all 0.5s ease;
}
}
.job-box-holder {position: absolute; 
top:220px; 
right: 70px; 
z-index:9999;
transition: all 0.5s ease;
}

.job-box-holder:hover {
top:200px; 
right: 50px; 
z-index:9999;
transition: all 0.5s ease;
}

/* On screens 600px or less */
@media screen and (max-width: 600px) {
.job-box-holder {
top:80px; 
right: 20px; 
z-index:9999;
transition: all 0.5s ease;
  }

.job-box-holder:hover {
top:110px; 
right: 65px; 
z-index:9999;
transition: all 0.5s ease;
}
}
