body {
    -webkit-background-size: 400px 400px;
    -moz-background-size: 400px 400px;
    background-size: 400px 400px;
    background-position: left top;
    background-repeat: repeat;
    background-image: url(../uploads/website/brushedalu0.png%3F1458305991);
}

#identity {
    left: 265px;
}

/* 
VIIMESIMMÄT MUUTOKSET: 
- IE8 fixaus mobiilinaville ( mobiilinavin piilottaminen ilman mediaquerei )
- youtube-videot responsiivisiks
*/


.module p {
    font-size: 1rem;
    }

/* WRAPPER */
#wrapper{
margin:0 auto;
background:#fff;
width:auto;
max-width:960px;
-webkit-box-shadow: 0px 0px 7px 0px rgba(135,135,135,1);
-moz-box-shadow: 0px 0px 7px 0px rgba(135,135,135,1);
box-shadow: 0px 0px 7px 0px rgba(135,135,135,1);
}
#nav-toggle { display: none; }
.js #topNav { position: relative; }
.js #topNav.closed { max-height: none; }
body {
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
background-position: left top;
background-repeat: no-repeat;
background-attachment: fixed;
background-image: url(http://www.karenremontti.fi/uploads/website/tausta40.jpg?1377841666);
}
/* TAPTOCALL */
.taptocall {
text-align: center;
padding: 10px 0;
color: #fff;
display: inline-block;
font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
text-decoration: none;
text-transform: uppercase;
background-color: #00A0B0;
display: none;
}
.taptocall:hover {
background-color: #037C82;
}
.taptocall p {
margin-bottom: 0px !important;
font-size: 18px;
color: #FFF !important;
font-weight: bold;
}
.taptocall a {
text-decoration: none;
}
/* SLIDER */
.rslides {
position: relative;
list-style: none;
overflow: hidden;
display: block;
width: 100%;
padding: 0 !important;
margin: 0 auto;
box-shadow: 0px 2px 8px #333;
margin-top: -10px;
top: 0px;
}
.rslides li {
-webkit-backface-visibility: hidden;
position: absolute;
display: none;
width: 100%;
left: 0;
top: 0;
margin: 0;
padding: 0;
}
.rslides li:first-child {
position: relative;
display: block;
float: left;
}
.rslides img {
display: block;
height: auto;
float: left;
width: 100%;
border: 0;
}

/* FONTIT */
.contentArea p, #topNav ul li a, .contentArea .h1, .contentArea .h2 {
font-family: 'Open Sans', Helvetica, sans-serif; 
}
.contentArea .h1{
color:#00A0B0;
font-size:2em;
line-height:1.15em;
}
.contentArea .h2{
color:#515151;
font-size:1.5em;
line-height:1.3em;
font-weight:normal;
}
.contentArea p{
font-size:1.2em;
line-height:1.6em;
color: #444;
}
a{
color:#0098ca;
}
/* YLÄTUNNISTE / HEADER */
.header{ 
width:100%; 
}
#identityWrapper{
margin:0;
width:auto;
background: none;
}
#identityContact {
    padding: 0px 28px;
}
#identityContact img {
display: block;
margin: 0 auto;
width: 25em;
height: auto;
}
/* NAVIGAATIO */
#topNav{
margin: 0 auto;
border: none;
text-align: center;
margin-bottom: 0.56em;
width: 98%;
background: #f8f8f8;
display: block;
}
#topNav ul{
padding:0;
margin: 0;
background: none;
border: none;
list-style: none;
font-weight: bold;
text-align: center;
width: auto;
max-width:960px;
display: inline-block;
height:auto;
}
#topNav ul li{
padding:0;
height:auto;
width: auto;
float: left;
text-align: center;
margin:0;
}
#topNav ul li a{
font-weight: normal;
color: #202020;
background: none;
font-size: 1.2em;
line-height: 1.2em;
font-style: italic;
border: none;
margin: 0;
text-align: center;
padding: 13px 20px !important;
}
#topNav ul li a:hover, #topNav ul li a.active, #topNav ul li a.active:hover{
background: #00A0B0;
color: #F4F5ED;
font-style: italic;
font-weight:normal !important;
}
/* SISÄLTÖ / CONTENT */
#contentWrapperWrapper{
float:left;
width:100%;
}
#contentWrapper{
padding:0;
width:auto;
margin:0 auto;
background:#fff;
}
/* ALATUNNISTE / FOOTER */
#footer{
width:100%;
float:left;
border-top:1px solid #ddd;
}
address {
border:none;
background:none;
color: #515151;
width:auto;
margin:0;
font-size: 1em;
line-height:1.4em;
height:auto !important;
text-transform: none;
padding:1em;
}

/* -- LOMAKKEET -- */
.formbuilder .width-container{ text-align:left; }
.formbuilder.normal{ padding:1em; border:1px solid #ccc; background:#f1f1f1; }
.formbuilder.normal form{ padding:0; }
.formbuilder .text-container, .formbuilder .textarea-container{ background:transparent; width:100%; border:none; padding: 0; }

input.text, textarea.textarea{
width:95% !important;
font-family: 'Open Sans', Helvetica, sans-serif;
border:1px #ccc solid !important;
padding:7px;
background: #fff !important;
}
.formbuilder input.button{
padding:0.6em 1.3em !important;
height:auto;
font-size:16px;
line-height:1em;
background:#00A0B0;
border-radius: 0;
color:white;
}
.formbuilder input.button:hover{
background:#037C82;
text-decoration:none;
}
.formbuilder .dropdown{ width:100%; padding: 5px; font-size:1em; }

/* KUVIA TEKSTIEN KANSSA / IMAGETEXTCOLUMNS */
.contentArea .imagetextcolumn.three-column .column{
width:31%;
margin: 2% 0 2% 1.5%;
text-align:left;
}
p.readmore{
margin:20px 0;
}
p.readmore a.button {
font-size:1em !important;
border-radius:2px;
padding:0.5em 1.4em;
background: #00A0B0;
color:white;
}
p.readmore a.button:hover {
background:#363636;
}
/* TEXT BOX */
.box{
margin: 20px 10px;
padding: 1em !important;
border:none;
color:#363636;
font-size:110%;
}
.box .h2{
color:#212121;
font-weight:bold;
}
/* -- LISTS -- */
article.text ul, article.text ol{
margin:10px;
padding:0;
}
article.text li:before{
content:'>';
background:#00A0B0;
margin-right:10px;
font-size: 0.8em;
padding:1px 5px;
color:white;
}
article.text li{
text-indent:-28px;
padding:8px;
margin-left: 20px;
font-size:1em;
line-height:1.4em;
list-style:none;
}

/* -- IMAGE GALLERIES -- */
.gallery ul.pics { max-width:100%; }
.contentAreaD .slider, .contentAreaD .g3 .pics img, .contentAreaE .slider, .contentAreaE .g3 .pics img{ width:auto; }
.contentAreaD .slides div{ width:auto; }
.slides, .contentAreaE .slides div{ width:auto !important; }
.gallery .pics li span.pic{ overflow:visible; }
.gallery ul.nav{ border:none; }

.gallery .pics li{
float:left !important;
width:90px !important;
margin:0  !important;
margin-right:1% !important;
margin-bottom:1% !important;
position:relative !important;
}
.gallery .pics li span.pic img{
height:auto  !important;
width:100% !important;
}

/* RESPONSIVE YOUTUBE BASE */
div.embedVideo{
margin:1em 0;
position: relative;
padding-bottom: 56.25%; /* 16/9 ratio */
padding-top: 30px; /* IE6 workaround*/
height: 0;
overflow: hidden;
}
div.embedVideo iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* BANNER */
div.border{
width:100%;
padding:0;
text-align:center;
background:#f6ca56;
}
div.border .h2{
text-transform:uppercase;
padding:1.2em 0;
color:#282828;
font-size:2em;
font-weight:bold;
}
/* NO MARGIN FULL WIDTH */
.contentAreaC .image, .contentAreaC .border{
margin:0;
}

/* SPECIAL - IMAGE COLUMNS */
.imagetwocolumn, .imagethreecolumn, .imagefourcolumn {
margin:0;
padding:0;
}
.imagetwocolumn img{
width:47.5% !important; 
margin:0 0 1.5% 1.5% !important;
}
.imagethreecolumn img{
width:31% !important; 
margin:0 0 1.5% 1.5% !important;
}
.imagefourcolumn img{
width:22.95% !important; 
margin:0 0 1.5% 1.5% !important;
}

/* -- RESPONSIIVISET KUVAT / RESPONSIVE IMAGES -- */
.image{ width:100% !important; max-width: 100%; height: auto; margin:0; }

/* RESPONSIIVISET MEDIAHAUT / RESPONSIVE MEDIA QUERIES */

.contentArea, .pt10 .contentAreaG, .pt6 .contentAreaF, .pt7 .contentAreaE, .pt9 .contentAreaD, .pt8 .contentAreaD{ float:left; margin: 0 0 2% 1.5%; }

/*12 KOLUMNIN GRIDI: B=col3, G=col4, F=col5, A=col6, E=col7, D=col9, C=col12 */
.contentAreaB { width:22.95%; }
.contentAreaG {width:31%;}
.contentAreaF { width:40%; }
.contentAreaA { width:47.5%; }
.contentAreaE { width:55%; }
.contentAreaD { width:72%;  }
.contentAreaC { width:100%;margin:0 0 1.5em; }

/* ---- RESPONSIIVINEN MEDIAQUERY ---- */

/* MOBIILI PORTRAIT / KÄNNYKKÄ PYSTY */
@media  (max-width:600px) {

.contentAreaB { width:96.5%; }
.contentAreaG { width:96.5%; }
.contentAreaF { width:96.5%; }
.contentAreaA { width:96.5%; }
.contentAreaE { width:96.5%; }
.contentAreaD { width:96.5%; }
.contentAreaC  { width:100%;margin:0 0 1.5em; }

#wrapper{ margin:0 auto;}
.taptocall {display:block;}
.rslides {width: auto; margin: -10px; box-shadow:none;}
#topNav {width: 100%;}
#identityContact img {width: 95%; margin: 0 auto;}

/* MOBILE NAV SETTINGS */
a#nav-toggle:hover { text-decoration:none; }
.js #topNav { clip: rect(0 0 0 0); max-height: 0;position:absolute; display: block; zoom: 1; overflow:hidden; }
#topNav.opened { max-height: 9999px; }
#topNav { margin:0;}
#topNav ul {width: auto; padding:0;border-radius:0;border:none;box-shadow:none;}
#topNav ul li{ width:100%;}

a#nav-toggle{
background:#00A0B0; 
color: #fff;
padding:15px 0;
width:100%;
text-align:center;
float:left;
font-size:1em;
text-transform:uppercase;
}
#topNav ul li a{ 
height:auto; 
width:100%; 
padding:10px 0 !important;
border-top:1px solid #ddd;
}
#topNav ul li a:hover {
    background: none;
    color: #202020;
}
#topNav ul li a.active, #topNav ul li a.active:hover {
 color: #00A0B0;
 background: none;
}
/* COLUMNS FULL WIDTH MOBILE */
.contentArea .imagetextcolumn.three-column .column, .imagetwocolumn, .imagethreecolumn, .imagefourcolumn{
width:96.5%;
}


} /* ------------------ query end ----------------------- */

@media (max-width: 480px) {

/* RESPONSIVE NAV TOGGLE CLOSED */
#nav-toggle { display: block; }

} /* ------------------ query end ----------------------- */

/* EXTRAS */ 

/* EI NÄYTETÄ */
#breadcrumbWrapper, #poweredByContainer{
display:none;
}
.divider, .border hr, .linklist ul, .linklist li, .comments .h4, .feeds .h2, .formbuilder .h2, .focus .h2, .feeds .h2, .feeds dd, .comments dd{
border:none;
}
/*CLEARFIX FOR WRAPPER */
#wrapper:after{
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

p.readmore a.button:hover, .formbuilder .button:hover{text-decoration:none;}

#contentWrapper{ overflow-x:hidden; }
.module { font-size:inherit; line-height:inherit; width:auto; margin-bottom: 10px; margin-top:10px; }
.contentAreaA .formbuilder.normal .text, .contentAreaA .formbuilder.normal .text-container, .contentAreaA .formbuilder.normal .textarea, .contentAreaA .formbuilder.normal .textarea-container, .contentAreaE .formbuilder.normal .text, .contentAreaE .formbuilder.normal .text-container, .contentAreaE .formbuilder.normal .textarea, .contentAreaE .formbuilder.normal .textarea-container, .contentAreaD .formbuilder.normal .text, .contentAreaD .formbuilder.normal .text-container, .contentAreaD .formbuilder.normal .textarea, .contentAreaD .formbuilder.normal .textarea-container, .contentAreaC .formbuilder.normal .text, .contentAreaC .formbuilder.normal .text-container, .contentAreaC .formbuilder.normal .textarea, .contentAreaC .formbuilder.normal .textarea-container, .contentAreaB .formbuilder .text, .contentAreaB .formbuilder .textarea, .contentAreaB .formbuilder .text-container, .contentAreaB .formbuilder .textarea-container, .contentAreaD .formbuilder.normal fieldset, .contentAreaD .width-container, .contentAreaC .formbuilder.normal fieldset, .contentAreaC .width-container{
border:none;
width:98% !important;
background:transparent;
}