* { padding: 0; margin: 0; outline: 0; }

html { height: 100%; }
body { height: 100%; font-family: Verdana, Sans-Serif; font-size: 15px; font-weight: normal; color: #222222; background-color: #ffffff; }

::selection { background-color: #0072bc; color: #ffffff; }

p { padding: 10px 0; }
ul { padding: 10px 0 10px 20px; }
ol { padding: 10px 0 10px 40px; }

h1 { margin: 0 0 40px 0; font-size: 30px; font-weight: normal; color: #328dc8; }
h2 { margin: 0 0 40px 0; font-size: 30px; font-weight: normal; color: #328dc8; }
h2.white { color: #ffffff; }

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }

a:link    { font-size: 12px; text-decoration: none; font-weight: bold; color: #383838; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
a:visited { font-size: 12px; text-decoration: none; font-weight: bold; color: #383838; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
a:hover   { font-size: 12px; text-decoration: none; font-weight: bold; color: #000000; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
a:active  { font-size: 12px; text-decoration: none; font-weight: bold; color: #383838; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

a:link img    { border: 0; }
a:visited img { border: 0; }
a:hover img   { border: 0; }
a:active img  { border: 0; }

.clearDiv { position: relative; clear: both; height: 0; line-height: 0; overflow: hidden; }
.hidden { display: none; }
.no-script-panel { position: fixed; top: 0; left: 50%; width: 450px; padding: 5px 10px; margin-left: -235px; text-align: center; display: block; color: #222222; font-weight: bold; z-index: 5; background-color: #fff6bf; border: 1px solid #fdd845; border-top: 0; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; }

.icon-up { position: fixed; bottom: 10px; right: 10px; width: 45px; height: 45px; font-size: 45px; color: #328dc8; overflow: hidden; cursor: pointer; z-index: 1000; display: none; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.icon-up:hover { color: #0072bc; }

.parallax { position: relative; width: 100%; height: auto; color: #ffffff; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; overflow: hidden; }
.parallax h1, 
.parallax h2 { color: #ffffff; }

.col-50 { position: relative; width: 50%; padding: 10px; overflow: hidden; float: left; box-sizing: border-box; -webkit-box-sizing: border-box; }
.col-100 { position: relative; width: 100%; padding: 10px; overflow: hidden; float: left; box-sizing: border-box; -webkit-box-sizing: border-box; }

.overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: 0.6; z-index: 6; }
.padding-top-lg { padding-top: 160px; }
.container { position: relative; width: 940px; margin: 0 auto; z-index: 7; }

@media (min-width: 1920px) {
    .container { position: relative; padding: 90px 0; }
}

@media (min-width: 992px) {
    .container { position: relative; padding: 90px 0; }
}

@media (min-width: 768px) and (max-width: 991px) {
    .container { width: 700px; padding: 60px 0; }
}

@media (min-width: 480px) and (max-width: 767px) {
    .container { width: 460px; padding: 40px 0; }
    .col-50 { width: 100%; }
    .container > table td { display: inline-block; margin: 10px; }
    .icon-up { display: none !important; }
}

@media (max-width: 479px) {
    .container { width: 310px; padding: 30px 0; }
    .col-50 { width: 100%; }
    .container > table td { display: inline-block; margin: 10px; }
    .icon-up { display: none !important; }
}

/*Header
---------------------------------------------------*/

.header { position: fixed; width: 100%; top: 0; left: 0; height: 70px; margin: 0 auto; background-color: #dbdbdb; opacity: 0.9; border-bottom: 1px solid #959595; box-sizing: border-box; -webkit-box-sizing: border-box; z-index: 10; }

.header .container { padding: 0; }

.header a.title { position: relative; float: left; width: auto; height: auto; padding-top: 3px; font-size: 25px; font-weight: normal; color: #0072bc; text-transform: uppercase; text-align: center; }

.header .menu-collapse { display: none; }
.header .menu { position: relative; display: block; width: auto; height: auto; float: right; }

.header .menu a:link,
.header .menu a:visited { display: inline-block; margin: 20px; font-size: 20px; font-weight: normal; text-transform: uppercase; color: #404040; }
.header .menu a:hover, 
.header .menu a:active,
.header .menu a.active{ color: #0072bc; }

@media (max-width: 991px) {
    .header { position: relative; }
    .header .menu-collapse { position: relative; display: block; margin: 20px 20px 0 0; font-size: 24px; color: #404040; cursor: pointer; border: 0; background-color: transparent;  float: right; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
    .header .menu-collapse:hover { color: #0072bc; }
    
    .header .menu { position: absolute; top: 70px; display: none; width: 100%; height: auto; background-color: #ffffff; }
    .header .menu a:link,
    .header .menu a:visited { display: block; width: 100%; padding: 0; margin: 0; text-align: center; line-height: 50px; border-bottom: 1px solid #959595; }
    
    .header .menu a:hover, 
    .header .menu a:active,
    .header .menu a.active{ color: #ffffff; background-color: #0072bc; }
}

/*Slider
---------------------------------------------------*/

.content-rotator-container { position: relative; width: 100%; height: 540px; overflow: hidden; }

.content-rotator { position: relative; top: 0px; left: 0px; width: 100%; height: 540px; background-image: url(images/loading.gif); background-position: center center; background-repeat: no-repeat; }
.content-rotator .item { position: absolute; top: 0px; left: 0px; width: 100%; height: 540px; overflow: hidden; display: none; background-position: center center; background-repeat: no-repeat; background-size: cover; }

.content-rotator .item .content { position: relative; width: auto;  height: 410px; padding: 10px 0; overflow: auto; box-sizing: border-box; -webkit-box-sizing: border-box; }

.content-rotator-nav { position: absolute; width: 100%; height: 20px; bottom: 20px; left: 0px; text-align: center; z-index: 5; }

.content-rotator-nav div       { display: inline-block; width: 22px; height: 20px; text-decoration: none; background-image: url(/content/public/images/bullets.png); background-position: top left; background-repeat: no-repeat; cursor: pointer; }
.content-rotator-nav div:hover { display: inline-block; width: 22px; height: 20px; text-decoration: none; background-image: url(/content/public/images/bullets.png); background-position: bottom left; background-repeat: no-repeat; cursor: pointer;  }

.content-rotator-nav div.active       { display: inline-block; width: 22px; height: 20px; text-decoration: none; background-image: url(/content/public/images/bullets.png); background-position: bottom left; background-repeat: no-repeat; cursor: pointer;  }
.content-rotator-nav div.active:hover { display: inline-block; width: 22px; height: 20px; text-decoration: none; background-image: url(/content/public/images/bullets.png); background-position: bottom left; background-repeat: no-repeat; cursor: pointer;  }

@media (max-width: 991px) {
    .content-rotator .item .container { padding: 30px 0; }
    .content-rotator .item .content { height: 450px; text-align: center; }
    .content-rotator .item .content table td { display: inline-block; margin-bottom: 20px; text-align: center; }
}

/*Home
---------------------------------------------------*/

.home-insulations { position: relative; width: auto; height: auto; text-align: center; padding-top: 40px; }

a.home-insulation-item { position: relative; display: inline-block; width: auto; height: auto; padding: 0 35px; margin-top: 40px; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.home-insulation-item-icon { display: block; width: 150px; height: 150px; margin: 0 auto 20px auto; overflow: hidden; border: 1px solid #434343; background-color: #f2f2f2; border-radius: 150px; -webkit-border-radius: 150px; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.home-insulation-item-icon object { margin-top: 5px; }
.home-insulation-item-icon:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } 
.home-insulation-item-button { display: inline-block; width: auto; height: auto; padding: 7px 10px; color: #404040; text-transform: uppercase; border: 1px solid #acacac; background-color: #cccccc; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

a.home-insulation-item:hover .home-insulation-item-icon { border: 1px solid #0072bc; transform: rotateY(180deg); }
a.home-insulation-item:hover .home-insulation-item-button { color: #ffffff; border: 1px solid #0072bc; background-color: #37a4ea; }
a.pageAnchor { display: block; position: relative; top: -160px; visibility: hidden; }

.why-choose-us-item { position: relative; width: 520px; height: auto; min-height: 200px; color: #ffffff; }
.why-choose-us-item-guide { position: absolute; width: 1px; height: 100%; background-color: #ffffff; }
.why-choose-us-item-icon { position: relative; width: 90px; height: 90px; margin: 0 5px; font-size: 60px; color: #434343; line-height: 90px; text-align: center; overflow: hidden; border: 1px solid #434343; background-color: #ffffff; float: left; border-radius: 90px; -webkit-border-radius: 90px; box-sizing: border-box; -webkit-box-sizing: border-box; }
.why-choose-us-item-content { position: relative; width: 420px; height: auto; float: left; }
.why-choose-us-item-content h3 { text-transform: uppercase; }

.why-choose-us-item:hover { color: #37a4ea; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.why-choose-us-item:hover .why-choose-us-item-icon { color: #37a4ea; border: 1px solid #37a4ea; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.why-choose-us-item-left { left: 0; text-align: right; }
.why-choose-us-item-left .why-choose-us-item-content {  float: right; }
.why-choose-us-item-left .why-choose-us-item-icon { top: 0; right: 0; float: right; }
.why-choose-us-item-left .why-choose-us-item-guide { top: 0; right: 49px; }

.why-choose-us-item-right { left: 420px; }
.why-choose-us-item-right .why-choose-us-item-guide { top: 0; left: 50px; }

@media (min-width: 768px) and (max-width: 991px) {
    .why-choose-us-item { margin: 0 auto; }
    .why-choose-us-item .why-choose-us-item-guide { display: none; }

    .why-choose-us-item-left,
    .why-choose-us-item-right { left: 0; }
}

@media (max-width: 767px) {
    .why-choose-us-item { width: 100%; margin: 40px 0; min-height: auto; }
    .why-choose-us-item-content { width: 100%; text-align: center; }
    
    .why-choose-us-item-guide { display: none; }
    .why-choose-us-item-icon { display: block; float: none !important; margin: 10px auto; }

    .why-choose-us-item-left,
    .why-choose-us-item-right { left: 0; }
}

/*Services
---------------------------------------------------*/

.manti-ceramic-is-content h2 { font-size: 22px; margin: 0; }
.manti-ceramic-is-content img { margin: 40px 0 10px 0; }
.manti-ceramic-is-content img:first-of-type { margin-top: 0; }

/*References
---------------------------------------------------*/

.reference-items { position: relative; width: 980px; height: auto; text-align: center; overflow: hidden; }

a.reference-item { position: relative; display: inline-block; width: 220px; height: 210px; margin: 0 20px 20px 0; font-weight: normal; color: #ffffff; text-align: center; border: 1px solid #404040; overflow: hidden; box-sizing: border-box; -webkit-box-sizing: border-box; }

.reference-item-title { position: relative; display: block; margin: 65px 0 15px 0; font-size: 18px; text-transform: uppercase; z-index: 3; opacity: 0; }
.reference-item-more-details { position: relative; display: inline-block; padding: 5px 10px; text-transform: uppercase; border: 1px solid #ffffff; z-index: 3; opacity: 0; }
.reference-item-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #37a4ea; opacity: 0; z-index: 2; }
.reference-item-image { position: absolute; display: block; top: -50%; left: -50%; min-width: 220px; min-height: 210px; z-index: 1; }

a.reference-item:hover .reference-item-overlay { opacity: 0.6; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
a.reference-item:hover .reference-item-title,
a.reference-item:hover .reference-item-more-details { opacity: 1; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.tags { position: relative; width: auto; height: auto; margin-bottom: 20px; }

.reference-detail { position: relative; width: auto; height: auto; margin-bottom: 30px; display: none; }
.reference-detail-image { position: relative; width: 470px; height: auto; float: left; }
.reference-detail-content { position: relative; width: 470px; height: auto; padding-left: 20px; float: left; box-sizing: border-box; -webkit-box-sizing: border-box; }
.reference-detail-content h2 { font-size: 22px; margin: 0; }

@media (max-width: 991px) {
    .reference-items { width: 100%; }
    a.reference-item { margin: 10px; }
    
    .reference-detail-image { width: 100%; }
    .reference-detail-content { width: 100%; padding: 20px 0 0 0; }
    
    .tags { text-align: center; }
    .tags .btn { width: 50%; margin-bottom: 10px; }
}

/*Prices
---------------------------------------------------*/

.prices-house { position: relative; width: auto; height: auto; display: inline-block; margin: 10px 30px; cursor: pointer; }
.prices-house span { display: block; margin-bottom: 10px; }

.prices-house .prices-detached-house { }
.prices-house:hover .prices-detached-house { }

.prices-house .prices-detached-house { position: relative; width: 84px; height: 75px; margin: 0 auto 10px auto; background-image: url(/content/public/images/detached-house.png); background-position: top center; background-repeat: no-repeat; background-size: 84px 150px; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house:hover .prices-detached-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house.active .prices-detached-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.prices-house .prices-semi-detached-house { position: relative; width: 133px; height: 75px; margin: 0 auto 10px auto; background-image: url(/content/public/images/semi-detached-house.png); background-position: top center; background-repeat: no-repeat; background-size: 133px 150px; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house:hover .prices-semi-detached-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house.active .prices-semi-detached-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.prices-house .prices-mid-terraced-house { position: relative; width: 163px; height: 75px; margin: 0 auto 10px auto; background-image: url(/content/public/images/mid-terraced-house.png); background-position: top center; background-repeat: no-repeat; background-size: 163px 150px; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house:hover .prices-mid-terraced-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house.active .prices-mid-terraced-house { background-position: bottom center; transition: all 300ms linear; -webkit-transition: all 300ms linear; }

.prices-house:hover span,
.prices-house.active span{ color: #37a4ea; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.prices-house:hover button,
.prices-house.active button{ color: #ffffff; border: 1px solid #0072bc; background-color: #37a4ea; }

@media (max-width: 991px) {
    .prices-house { margin: 10px 10px; }
    .prices-house .btn { font-size: 11px; }
}

/*Footer
---------------------------------------------------*/

.footer-contact-content { position: relative; width: 440px; height: auto; color: #ffffff; overflow: hidden; float: left; }
.footer-contact-content a { color: #ffffff; } 

.footer-contact-form { position: relative; width: 460px; height: auto; overflow: hidden; float: left; }

.footer-contact-form label { color: #ffffff;  }
.footer-contact-form input,
.footer-contact-form textarea { margin-top: 5px; color: #ffffff; border: 1px solid #959595; background-color: transparent; background-image: url(/content/public/images/input-background.png); background-repeat: repeat; }

.footer { position: relative; width: 100%; height: 60px; text-align: center; color: #ffffff; text-transform: uppercase; line-height: 60px; background-color: #3a3b3c; }

@media (max-width: 991px) {
    .footer-contact-content { float: none; width: 100%; }
    .footer-contact-form { float: none; width: 100%; margin-top: 20px; }
}

/*Form container
---------------------------------------------------*/

.form-element { position: relative; width: auto; height: auto; padding-bottom: 10px; margin: 0; box-sizing: border-box; -webkit-box-sizing: border-box; }
.form-element label { display: block; text-transform: uppercase; }
.form-element label.required:after { content: "*"; color: #ff0000; margin-left: 5px; }

/*Default Inputs
---------------------------------------------------*/

input, select, textarea { width: 100%; font-size: 13px; padding: 5px; margin-bottom: 5px; border: 1px solid #acacac; background-color: #f5f5f5; -webkit-box-sizing: border-box; box-sizing: border-box; }

textarea { resize: none; }

input[type="checkbox"] { cursor: pointer; width: auto; padding: 1px; }
input[type="checkbox"]:focus, input[type="radio"]:focus, input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus { border: 1px solid #0072bc; transition: border 300ms linear; -webkit-transition: border 300ms linear; }
option[selected] { background-color: #0072bc; color: #ffffff; }

a.btn,
.btn { display: inline-block; width: auto; height: auto; padding: 7px 10px; margin-bottom: 5px; color: #404040; text-transform: uppercase; cursor: pointer; border: 1px solid #acacac; background-color: #cccccc; transition: all 300ms linear; -webkit-transition: all 300ms linear; }
.btn:hover { color: #ffffff; border: 1px solid #0072bc; background-color: #37a4ea; }

a.btn-blue,
.btn-blue { color: #ffffff; border: 1px solid #0072bc; background-color: #37a4ea; }
.btn-blue:hover { color: #404040; border: 1px solid #acacac; background-color: #cccccc; }

.checkBoxRadioButtonList { position: relative; width: auto; height: auto; }
.checkBoxRadioButtonList div { position: relative; width: auto; height: auto; padding: 0 5px 5px 5px; float: left; }
.checkBoxRadioButtonList div label { margin-left: 5px; }