@charset "UTF-8";
/*
 * TABLE OF CONTENTS
 *
 * 1. Typography
 * 2. Elements
 * 3. Navigation
 * 4. Footer
 * 5. Content & structures
 * 6. Pages
 * 7. Form
 * 8. Banner
 * 9. Other
 *
 */

/* ----------------------------------- 1. Typography ----------------------------------- */


#site-banner{display:none;}

.min-h-puff {min-height:145px;}

@media screen and (max-width: 1445px) {
.min-h-puff {min-height:200px;}
    
}
@media screen and (max-width: 767px) {
.min-h-puff {min-height:1px;}
    
}



#bild h2,#bild  h3,#bild h4,#bild h5{
    color: #fff;
}


#slide_1 {
    height: 550px;
    background: transparent url(../../files/bild1.jpg) no-repeat center center;
    width:100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

}

#slide_2 {
    height: 550px;
    width:100%;
    background: transparent url(../../files/bild2.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

}

.grey img{
-webkit-filter: grayscale(1);
    filter: grayscale(1);    
}

  

#bild {
    color: #fff;
    background: linear-gradient( rgba(255, 255, 255, 0.19), rgba(0, 0, 0, 0.34) ), url(../../files/parkett.jpg) no-repeat center top;
    background-size: cover;
    padding: 100px;
}

.a22{display:block;width:40%;float:left;position:relative;margin-top:30px;}

.a11 {
    width: 60%;
    display: block; 
    position: relative;
    float: left;
}

body {font-family: 'Source Sans Pro', Arial, Sans-serif; font-size: 15px; line-height: 1.7; font-weight: 400; color: #333333; background-color: #fff;}

h1, h2, h3, h4, h5, h6 {font-weight: 500; letter-spacing: 1px; color: #333; margin: 0;}

h1 {font-size: 30px; line-height: 45px; margin-bottom: 15px; color: #f39200;}
h2 {font-size: 30px; line-height: 40px; margin-bottom: 15px; color: #f39200;}
h3 {font-size: 20px; line-height: 30px; margin-bottom: 15px; color: #f39200; text-transform: uppercase;}
h4 {font-size: 16px; line-height: 30px; margin-bottom: 15px;}
h6 {font-size: 19px; line-height: 30px; margin-bottom: 15px;}

@media screen and (max-width: 767px) {
    html, body {font-size: 15px; line-height: 30px;}
    h1 {font-size: 25px; line-height: 40px;}
    h2 {font-size: 25px; line-height: 35px;}
    h3 {font-size: 18px; line-height: 28px;}
    h6 {font-size: 17px; line-height: 28px;}
}

a {color: #333; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}

a:hover {color: #333; text-decoration: none;}

a:focus, a:active {outline: none; color: #333; text-decoration: none;}

::-moz-selection {color: #fff; background: #da042b;}
::selection {color: #fff; background:#f39200;}

/* ----------------------------------- 2. Elements ----------------------------------- */

img {display: block; max-width: 100%; height: auto;}

hr {width: 100%; height: 3px; margin: 0 0 25px 0; background-color: #f39200; border: 0;}

hr.dark, #footer .footer-wrapper hr {width: 40px; height: 2px; margin: 12px 0 15px 0; background-color: #f39200;}

.btn {font-size: 14px; font-weight: 300; letter-spacing: 1px; text-transform: uppercase; padding: 10px 20px; border-radius: 5px;}
.btn:hover {text-decoration: none; border-radius: 5px;}

.btn-primary {color: #fff; background: #4a96cf; border: 3px solid #4a96cf;}
.btn-primary:hover {color: #fff; background: #0c4587; border: 3px solid #0c4587;}

.btn-success {
    color: #fff;
    background: #f39200;
    border: none;
    /* -webkit-box-shadow: 0px 5px 0px 0px #b40021; */
    /* --moz-box-shadow: 0px 5px 0px 0px #b40021; */
    -o-box-shadow: 0px 5px 0px 0px #b40021;
    /* box-shadow: 0px 5px 0px 0px #b40021; */
     border: 3px solid #f39200!important;
}
.btn-success:hover, .btn-success:active, .btn-success:focus {color: #fff; background: #ffb23f;}

.btn-info {color: #333; background: #fff; border: 3px solid #fff;}
.btn-info:hover {color: #fff; background: #0c4587; border: 3px solid #0c4587;}

.btn-danger {color: #fff; background: #333; border: 3px solid #333;}
.btn-danger:hover {
    color: #fff;
    background: #f39200;
    border: 3px solid #f39200;
}
.btn-danger:focus,.btn-danger:active,.btn-success:focus,.btn-success:active   {
    color: #fff;
    background: #f39200!important;
    border: 3px solid #f39200!important;
}
.btn-warning {color: #f39200; background: none; border: none; padding: 0;}
.btn-warning:hover, .btn-warning:active, .btn-warning:focus {background: transparent; color: #b40021; border: none;}
.btn-warning:after {content: "\f101"; font-family: FontAwesome; padding: 0 0 0 5px;}

.btn-block {display: block; font-size: 18px; letter-spacing: 1px; text-transform: uppercase; color: #fff; background: #6d63d3; padding: 10px 0; border: none;}
.btn-block:hover {text-decoration: none; background: #333; color: #fff; border: none;}

.btn-default {
    color: #fff;
    background: #f39200;
    border: none;
    /* -webkit-box-shadow: 0px 5px 0px 0px #b40021; */
    /* --moz-box-shadow: 0px 5px 0px 0px #b40021; */
    -o-box-shadow: 0px 5px 0px 0px #b40021;
    /* box-shadow: 0px 5px 0px 0px #b40021; */
}
.btn-default:hover, .btn-default:active, .btn-default:focus {color: #fff; background: #ffb23f;}

@media screen and (max-width: 767px) {
    .btn {font-size: 13px; padding: 7px 25px;}
    .btn-warning {padding: 0;}
}

/* ----------------------------------- 3. Navigation ----------------------------------- */

#contact-block {width: 100%; padding: 5px 0; background:#f39200; color: #fff; text-align: center; }

.navbar {margin: 0;}
.navbar-default {background-color: transparent; padding: 0; border-bottom: 0px; border-top: none; border-left: none; border-right: none; border-radius: 0; moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s;}
.navbar-nav {float: right;}
.container {padding: 0;}
.navbar-brand {
    display: block;
    width: 179px;
    height: auto;
    padding: 10px;
    margin: 0;
    border: none;
}
.navbar-brand:hover {border: none;}
.navbar-brand img {margin-top: 6px;}
.navbar-default .navbar-nav>li>a, #mobile-buttons li a {padding: 30px 20px; color: #333; display: block; font-weight: 700; font-size: 16px; text-align: center; font-style: normal; text-decoration: none; border: none;}
.navbar-default .navbar-nav>li>a:hover {color: #333;}
.navbar-default .navbar-nav>li>a:hover, .navbar-nav li.active.current.current_page_item a, .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {    background: #f39200;
    color: #fff;}
.navbar>.container .navbar-brand, .navbar>.container .navbar-brand {margin: 0;}

/* Responsive menu */
.navbar-default .navbar-toggle {border: none; margin: 15px 0 0 0;}
.navbar-default .navbar-toggle .icon-bar {background-color: #333;}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {background-color: transparent;}
.navbar-toggle .icon-bar {width: 25px;}
.navbar-toggle .icon-bar+.icon-bar {margin-top: 6px;}
.navbar-default .navbar-collapse {border: none;}
.container-fluid>.navbar-collapse {margin: 0;}

/* Dropdown menu */
.dropdown-menu {border: none; border-radius: 0;}
.dropdown-menu>li>a {letter-spacing: 1px; text-transform: uppercase; border: none; padding: 10px 20px;}

/* Mobile buttons */
#mobile-buttons {list-style: none; padding: 0; display: none;}
#mobile-buttons li {width: 50%; float: left;}
#mobile-buttons li a {font-size: 14px; color: #fff; background:#f39200; margin: 20px 0;}
#mobile-buttons li:last-child a {background:#e88c00;}
#mobile-buttons li a:hover {background:#e88c00;}

@media screen and (max-width: 991px) {
    .navbar-default .navbar-nav>li>a, #mobile-buttons li a {font-size: 12px;}
}

@media (max-width: 767px) {
    #contact-block {display: none;}
    .navbar-default {padding: 0 15px;}
    .container>.navbar-header {margin: 0 40px; padding: 10px 0;}
    .navbar-collapse {padding: 0;}
    .navbar-default .navbar-nav {width: 100%;}
    .navbar-default .navbar-nav>li>a {margin: 10px 0;}
    #mobile-buttons {display: block;}
    .navbar-default .navbar-nav>li>a, #mobile-buttons li a {font-size: 14px; text-transform: uppercase; padding: 7px;}
    .navbar-nav .open .dropdown-menu>li>a {font-size: 12px; letter-spacing: 0; text-align: center; color: #333; padding: 5px 0;}
    .navbar-default .navbar-nav .open .dropdown-menu>li>a {color: #333;}
    .navbar-nav {margin: 0;}
}

/* ----------------------------------- 4. Footer ----------------------------------- */

#footer {color: #fff; background: linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ), url("../../files/parkett2.jpg") no-repeat center top; background-size: cover;}
.footer-wrapper {line-height: 1.8; font-weight: 300; padding: 50px 0;}
.footer-wrapper h1, .footer-wrapper h2, .footer-wrapper h3, .footer-wrapper h4, .footer-wrapper h5, .footer-wrapper h6 {font-weight: 500; color: #fff;}
.footer-wrapper p {margin-bottom: 0;}
.footer-content a {color: #fff; border: none;}
.footer-content a:hover {color: #f39200; text-decoration: none; border: none;}
.footer-content i {color: #f39200;}

.footer-menu {padding: 20px 0; border-top: 1px solid rgba(255, 255, 255, 0.3);}
#foot-menu {list-style: none; padding: 0; margin: 0; text-align: center;}
#foot-menu li {display: inline-block; padding: 0 20px 0 20px; border-right: 1px solid rgba(255, 255, 255, 0.3);}
#foot-menu li:last-child {margin-right: 0; border-right: none;}
#foot-menu li a {color: #fff; font-size: 14px;}
#foot-menu li a:hover {color: #da042b;}

.copyright {text-align: center; font-size: 14px; color: rgba(255, 255, 255, 0.3); padding-top: 20px;}

@media screen and (max-width: 767px) {
    .footer-wrapper {text-align: center;}
    .footer-content {display: block; margin-bottom: 30px;}
    hr.dark, #footer .footer-wrapper hr {display: block; margin: 12px auto 15px auto; text-align: center; float: none;}
    
    .footer-menu {display: none;}

}

/* ----------------------------------- 5. Content & structures ----------------------------------- */

.clear {clear: both;}

.center {margin: 0 auto;}

.grey {background: #f5f6fa;}

/*.blue {background: #4a96cf;}*/

.display-table {display: table; table-layout: fixed;}
.display-cell {display: table-cell; vertical-align: middle; float: none;}

.block-section > .block-section-container, .content {padding: 30px 5px; margin-right: auto; margin-left: auto;}

.block-section .block-section-container .block-columns .block-section-container {width: auto;}

.block-section > .block-section-container, .container {width: 80%; margin: 0 auto; max-width: 2500px;}

@media (max-width: 1200px) {
    .block-section > .block-section-container, .container {width: 75%;}
}

@media (max-width: 992px) {
    .block-section > .block-section-container, .container {width: 80%;}
}

@media (max-width: 768px) {
    .navbar-brand {
    display: block;
    width: 150px;
    height: auto;
    padding: 10px;
    margin: 0;
    border: none;
}
    .block-section > .block-section-container, .container {width: 95%;}
    #offer > .block-section-container > .block-columns  .block-section-container {display: block; margin-bottom: 30px;}
    #referenser > .block-section-container > .block-columns  .block-section-container {display: block; margin-bottom: 30px;}
    #tjanster > .block-section-container > .block-columns  .block-section-container {display: block; margin-bottom: 30px;}
}

/* ----------------------------------- 6. Pages ----------------------------------- */

#offer > .block-section-container > .block-columns  .block-section-container .block-header {padding: 20px 20px 0 20px;}
#offer > .block-section-container > .block-columns  .block-section-container .block-text {padding: 0 20px 10px 20px;}
#offer img:hover {opacity: 0.9;}

#referenser > .block-section-container > .block-columns  .block-section-container {padding: 0; background: #fff; border-bottom: 3px solid #da042b; margin-bottom: 30px; display: block;}
#referenser > .block-section-container > .block-columns  .block-section-container .block-header {padding: 20px 20px 0 20px;}
#referenser > .block-section-container > .block-columns  .block-section-container .block-text {padding: 0 20px 10px 20px;}
#referenser h3 {color: #333;}

#tjanster > .block-section-container > .block-columns  .block-section-container {padding: 0; background: #fff; border-bottom: 3px solid #da042b; margin-bottom: 30px; display: block;}
#tjanster > .block-section-container > .block-columns  .block-section-container .block-header {padding: 20px 20px 0 20px;}
#tjanster > .block-section-container > .block-columns  .block-section-container .block-text {padding: 0 20px 10px 20px;}
#tjanster h3 {color: #333;}

#tjanster-icons img { margin: 20px auto;}

ul.gallery {list-style: none;}
ul.gallery li {margin-bottom: 30px;}

/* ----------------------------------- 7. Form ----------------------------------- */



label {font-size: 14px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase;}

textarea {resize: vertical;}

.form-control {font-size: 15px; border-radius: 0; background: #fff; height: auto; border-color: #333; color: #333; padding: 12px 17px; position: relative; -webkit-appearance: none; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);}

.form-control:focus {color: #da042b; border-color: #da042b; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);}

select.form-control {padding-right: 5px;}

.form-control::-moz-placeholder {color: inherit;}
.form-control:-ms-input-placeholder {color: inherit;}
.form-control::-webkit-input-placeholder {color: inherit;}

select.form-control {-webkit-appearance: menulist;}
select[multiple].form-control {-webkit-appearance: listbox;}

/* Disabled forms */
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {opacity: 0.5; filter: alpha(opacity=50);}

/* ----------------------------------- 8. Banner ----------------------------------- */


.banner-box {
    width: 100%;
    float: none;
    padding: 40px 20px;
    background: rgba(255, 255, 255, 0.93);
    border-bottom: 3px solid #ffffff;
    text-align:center;
}
.banner-box a {margin-bottom: 20px;}

@media screen and (max-width: 767px) {
    .banner-box {    padding: 3px; float: none; display: block; margin: 0 auto;}
  
}

@media screen and (max-width: 425px) {
.banner-box {

    float: left!important;
    position: relative;
}



}


/* ----------------------------------- 9. Other ----------------------------------- */

/* Scroll to top */
.scrollToTop {color: #ffffff; position: fixed; bottom: 5px; right: 5px; width: 50px; height: 50px; text-align: center; cursor: pointer; background-color: #000000; z-index: 1005; display: none;}
.scrollToTop i {line-height: 50px; font-size: 24px;}

/* Small devices (tablets, phones less than 767px) */
@media (max-width: 768px) {
	.scrollToTop {width: 40px; height: 40px; background-color: rgba(0, 0, 0, 0.4);}
	.scrollToTop i {line-height: 40px; font-size: 20px;}
}

/* Parallax */
.parallax h1, .parallax h2, .parallax h3, .parallax p, .parallax a {color: #fff;}
.no-touch .light-translucent-bg, .no-touch .dark-translucent-bg, .no-touch .default-translucent-bg, .no-touch .parallax {background-attachment: fixed !important;}
.light-translucent-bg, .dark-translucent-bg, .default-translucent-bg, .parallax {-webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important;}
.parallax {background-position: 50% 0; background-repeat: no-repeat; z-index: 1; position: relative; padding: 100px 0;}
.light-translucent-bg, .dark-translucent-bg, .default-translucent-bg {background-position: 50% 0; background-repeat: no-repeat; z-index: 1; position: relative;}
.light-translucent-bg:after, .dark-translucent-bg:after, .default-translucent-bg:after {content: ""; position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%;}
.light-translucent-bg {color: #333;}
.header + .banner > .light-translucent-bg {border-top: none;}
.slider-banner-container .light-translucent-bg {border: none; width: 100%; height: 100%; position: absolute; top: 0 !important; left: 0 !important; margin: 0 !important; bottom: 0;}
.slider-banner-container .dark-translucent-bg {width: 100%; height: 100%; position: absolute; top: 0 !important; left: 0 !important; margin: 0 !important; bottom: 0;}
.slider-banner-container li .light-translucent-bg:after, .slider-banner-container li .dark-translucent-bg:after {background-color: transparent;}
.light-translucent-bg .separator-2 {background-color: #333;}
.light-translucent-bg:after {background-color: rgba(255, 255, 255, 0.7);}
.dark-translucent-bg:after {background-color: rgba(0, 0, 0, 0.7);}
.dark-translucent-bg, .dark-translucent-bg h1, .dark-translucent-bg h2, .dark-translucent-bg h3, .dark-translucent-bg h4, .dark-translucent-bg h5, .dark-translucent-bg h6 {color: #ffffff;}
.dark-translucent-bg a:not(.btn) {text-decoration: underline; color: #ffffff;}
.dark-translucent-bg a:not(.btn):hover {text-decoration: none; color: #ffffff;}
.default-translucent-bg:after {background-color: rgba(232, 76, 61, 0.7);}
.default-translucent-bg, .default-translucent-bg h1, .default-translucent-bg h2, .default-translucent-bg h3, .default-translucent-bg h4, .default-translucent-bg h5, .default-translucent-bg h6 {color: #ffffff;}
.default-translucent-bg a:not(.btn) {text-decoration: underline; color: #ffffff;}
.default-translucent-bg a:not(.btn):hover {text-decoration: none; color: #ffffff;}
.light-translucent-bg .container, .dark-translucent-bg .container, .default-translucent-bg .container {z-index: 3; position: relative;}
.parallax-bg {background: url("../../files/hem/parallax-bg.jpg") 50% 0px no-repeat;}
.parallax-bg-2 {background: url("../../files/hem/parallax-bg-2.jpg") 50% 0px no-repeat;}
.parallax-bg-3 {background: url("../../files/hem/parallax-bg-3.jpg") 50% 0px no-repeat;}