/*================================================ Автор щаблона Роман, для связи воспользуйтесь электронной почтой - rsiretsky@gmail.com Шаблон сделан для сайта копирование и использование шаблона без разрешения автора на других проектах - запрещено! ==================================================*/ html, body {height: 100%; min-height: 100%;} body { background: #fff; font-family: 'Neucha', cursive; font-family: 'Roboto Condensed', sans-serif; font-family: 'Open Sans Condensed', sans-serif; font-family: 'Open Sans', sans-serif; color: #111; } /* Контейнер */ .wrapper {width: 100%;} .wrapper-left {width: 50%;} .wrapper-right {width: 50%;} .container {width: 980px; margin: 0 auto; padding: 0;} .column, .columns {float: left; margin-left: 10px; margin-right: 10px; } .content {overflow:hidden;} .container .sixteen.columns { width: 960px; } .position-relative {position: relative; overflow: hidden;} .marginTop10px {margin-top: 10px;} .marginTop20px {margin-top: 20px;} .marginTop40px {margin-top: 40px;} .marginBot10px {margin-bottom: 10px;} .marginBot20px {margin-bottom: 20px;} .marginBot40px {margin-bottom: 40px;} .paddingTop10px {padding-top: 10px;} .paddingTop20px {padding-top: 20px;} .paddingTop40px {padding-top: 40px;} .paddingBot10px {padding-bottom: 10px;} .paddingBot20px {padding-bottom: 20px;} .paddingBot40px {padding-bottom: 40px;} a {text-decoration: none;} #hTop {position: absolute; overflow: hidden; top: 0px; left: 0px; z-index: 99;} #hTopLogo {position: relative; overflow: hidden; float: left; width: 140px; margin-top: 20px; margin-right: 10px;} #hTopLogo img {width: 120px;} #hTopNav {position: relative; overflow: hidden; float: left; width: 600px;} #hTopNav ul {position: relative; overflow: hidden; margin-top: 44px;} #hTopNav ul li {position: relative; overflow: hidden; float: left; margin-right: 12px; font-family: 'Neucha', cursive;} #hTopNav ul li a {color: #fff; font-size: 20px; display: inline-block;} #hTopNav ul li a:hover {border-bottom: 1px solid #000; color: #000;} #hTopPhone {position: relative; overflow: hidden; float: right; width: 200px; margin-top: 36px;} #hTopPhone p {font-size: 23px; margin-bottom: 10px; font-family: 'Roboto Condensed', sans-serif; color: #fff; margin-top: 7px;} #hTopPhone a {position: relative; background: #fb1c1c; display: inline-block; overflow: hidden; color: #fff; font-size: 20px; font-weight: 900; font-family: 'Open Sans Condensed', sans-serif; text-transform: uppercase; padding: 10px 15px;} #hTopPhone a:hover {background: #000; color: #fff; cursor: pointer;} #hBot {background: url(/img/bg-09.jpg) center top no-repeat; background-size: cover; min-height: 110%; padding-bottom: 40px;} #hBot > div {min-height: 100%;} #hBotBlI {margin-top: 140px; position: relative; overflow: hidden; min-height: 800px;} #hBotLBl {position: relative; overflow: hidden; width: 50%; float: left;} #hBotLBl p {color: #fff; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; text-transform: uppercase;} #hBotLBl p {font-size: 70px; line-height: 86px; margin-top: 0px;} #hBotRBl {position: relative; overflow: hidden; float: right; width: 50%; margin-top: 0px; background: rgba(255,255,255,0.6); top: -15px;} #hBotRBl h1 {color: #000; font-family: 'Roboto Condensed', sans-serif; font-size: 26px; line-height: 32px; font-weight: 900; margin-bottom: 0px; padding: 30px; padding-bottom: 0px; text-align: center;} #hBotForm {width: 338px; position: relative; overflow: hidden; margin: 0 auto; padding: 7px; background: rgba(255,255,255,0.7); min-height: 340px;} #hBotRBl input {background: #fff; border: none; padding: 5px 0px 5px 15px; font-size: 16px; margin: 15px; margin-bottom: 10px; margin-left: 0px; line-height: 26px; height: 26px; width: 320px; display: block;} #hBotRBl input.SubmtiClose {position: relative; overflow: hidden; height: 40px; margin-top: 10px; padding: 0px; width: 335px; text-align: center; background: #000; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer;} #hBotRBl input.SubmtiClose:hover {background: #fff; color: #000;} #hBot h1 {color: #fff; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; text-transform: uppercase; font-size: 50px; line-height: 55px; margin-top: 0px; text-align: center;} #hBot h2 {color: #fff; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; text-transform: uppercase; font-size: 38px; line-height: 38px; margin-top: 20px; margin-bottom: 40px; text-align: center;} #hBotForm h3 {color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; text-transform: uppercase; font-size: 20px; line-height: 24px; margin-top: 15px; margin-bottom: 5px; text-align: center;} #hBotForm p {text-align: center; font-size: 14px; font-weight: bold;} #hBot input {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 15px; margin-left: 0px; line-height: 40px; height: 26px; width: 320px; display: block;} #hBot input.SubmtiClose {position: relative; overflow: hidden; height: 40px; margin-top: 10px; padding: 0px; width: 335px; text-align: center; background: #000; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer;} #hBot input.SubmtiClose:hover {background: #fff; color: #000;} #hBot a {position: relative; margin-top: 0px; left: 50%; margin-left: -10px; background: #fff; display: inline-block; opacity: overflow: hidden; color: #000; font-size: 30px; font-weight: 900; font-family: 'Open Sans Condensed', sans-serif; text-transform: uppercase; padding: 15px 25px;} #hBot a:hover {background: #000; color: #fff;} #IndexProduct {padding: 80px 0px;} #IndexProduct h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold;} .IndexProductBl {position: relative; overflow: hidden; float: left; width: 220px; margin-right: 20px; text-align: center;} .IndexProductBl img {width: 220px; margin-bottom: 10px;} .IndexProductBl:nth-last-child(2) {margin-right: 0px;} .IndexProductBl h3 {text-align: center; font-size: 14px; text-transform: uppercase; font-weight: bold; margin-bottom: 25px;} .IndexProductBl a {position: relative; background: #f1ccd2; display: inline-block; overflow: hidden; color: #000; font-size: 20px; font-weight: 900; font-family: 'Open Sans Condensed', sans-serif; padding: 10px 30px; font-weight: bold; text-transform: uppercase; margin-bottom: 60px;} .IndexProductBl a:hover {color: #000; border-color: #000; cursor: pointer;} #IndexProduct p {font-size: 18px; line-height: 22px; margin-bottom: 18px; font-weight: bold; font-family: 'Open Sans Condensed', sans-serif; padding: 7px 0px; padding-left: 55px;} #IndexProduct p:nth-last-child(2) {background: url(/img/Calendar-4-50.png) left center no-repeat; background-size: 30px auto;} #IndexProduct p:nth-last-child(3) {background: url(/img/Product-50.png) left center no-repeat; background-size: 30px auto;} #IndexProduct p:nth-last-child(1) {background: url(/img/Paint-Palette-50.png) left center no-repeat; background-size: 30px auto;} #IndexHPrice {text-align: center;} #IndexHPrice .nav-toggleStatMenu {position: relative; background: #f1ccd2; display: inline-block; overflow: hidden; color: #000; font-size: 44px; font-weight: 900; font-family: 'Open Sans Condensed', sans-serif; padding: 15px 20px; font-weight: bold; text-transform: uppercase; margin-bottom: 60px; cursor: pointer;} #IndexCalc {padding: 40px 0px; background: #f1ccd2; margin: 0px 0px;} #IndexCalc h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold;} #TMenu img {width: 98%;} #IndexDelivey {background: url(/img/bg-02.jpg) center top no-repeat; min-height: 700px; background-size: cover; padding: 80px 0px; border-bottom: 10px solid #f0e6ec;} #IndexDelivey h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 0px; text-align: center; font-weight: bold;} #IndexDelivey #IndexDeliveryBl h3 {font-family: 'Open Sans Condensed', sans-serif; font-size: 24px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold; margin-top: 60px;} #IndexDelivey #IndexDeliveryBl p {padding-left: 50px; margin-bottom: 10px; font-size: 14px; line-height: 22px; font-weight: bold; position: relative; overflow: hidden; width: 250px; margin-right: 20px; float: left;} #IndexDelivey #IndexDeliveryBl p span {font-size: 12px; line-height: 18px; font-family: 'Open Sans Condensed', sans-serif; font-weight: bold; text-transform: uppercase; display: block; margin-top: 7px;} #IndexDelivey #IndexDeliveryBl p:nth-child(2) {background: url(/img/In-Transit-50.png) left top no-repeat; background-size: 38px auto;} #IndexDelivey #IndexDeliveryBl p:nth-child(3) {background: url(/img/Shop-50.png) left top no-repeat; background-size: 38px auto;} #IndexDelivey #IndexDeliveryBl p:nth-child(4) {background: url(/img/Post-Office-50.png) left top no-repeat; background-size: 38px auto;} #IndexDelivey #IndexPaymentBl h3 {font-family: 'Open Sans Condensed', sans-serif; font-size: 24px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold; margin-top: 60px;} #IndexDelivey #IndexPaymentBl p {padding-top: 50px; margin-bottom: 10px; text-align: center; font-size: 14px; line-height: 22px; font-weight: bold; position: relative; overflow: hidden; width: 330px; margin-right: 25px; float: left;} #IndexDelivey #IndexPaymentBl p:nth-child(2) {background: url(/img/50-Percents-Filled-50.png) center top no-repeat; background-size: 38px auto; margin-left: 190px;} #IndexDelivey #IndexPaymentBl p:nth-child(3) {background: url(/img/50-Percents-Filled-501.png) center top no-repeat; background-size: 38px auto;} #IndexDeliveyMore {position: relative; overflow: hidden; margin-top: 80px;} #IndexDeliveyMore p {font-size: 18px; line-height: 22px; font-family: 'Open Sans Condensed', sans-serif; font-weight: bold; margin-bottom: 40px;} #IndexDeliveyMore span { font-size: 12px; text-transform: uppercase; display: block; margin-top: 7px;} #IndexDeliveyMore a {color: #000; display: inline-block; font-weight: bold; text-transform: uppercase; border-bottom: 2px solid #000; margin-top: 15px; font-size: 16px;} #IndexDeliveyMore a:hover {color: #e13682; border-color: #e13682; cursor: pointer;} #TMenu table {background: rgba(255,255,255,.7); font-size: 14px; display: block; position: relative; width: 99%;} #TMenu table td {border: 1px solid #ddd; padding: 5px; text-align: center; vertical-align: middle;} #TMenu table th {line-height: 18px; font-weight: bold; font-size: 13px; border: 1px solid #ddd; padding: 5px;} #IndexStep {background: #f0e6ec url(/img/bg-06.jpg) center top no-repeat; background-size: cover; height: 783px;} #IndexStep h2 {font-family: 'Open Sans Condensed', sans-serif; color: #fff; font-size: 40px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold; margin-top: 60px;} #IndexStepBL {background: url(/img/steps-items-bg-01.png) left 120px no-repeat; height: 783px;} .IndexStepBl {position: relative; overflow: hidden; float: left; width: 250px; margin: 30px 15px; min-height: 130px;} .IndexStepBl p {font-size: 18px; color: #000; line-height: 22px; font-weight: bold; font-family: 'Open Sans Condensed', sans-serif; position: relative; z-index: 10; padding: 15px 0px 55px 70px;} .IndexStepBl a {color: #000; font-weight: bold; font-size: 18px; display: inline-block; border-bottom: 2px solid #000;} .IndexStepBl span {position: absolute; display: inline-block; top: 0px; left: 0px; color: #FBF6F9; font-size: 144px; font-weight: bold; font-family: 'Roboto Condensed', sans-serif; z-index: 5;} .IndexStepBl:nth-child(2) {position: absolute; top: 147px; left: 120px;} .IndexStepBl:nth-child(3) {position: absolute; top: 147px; left: 520px;} .IndexStepBl:nth-child(4) {position: absolute; top: 342px; left: 620px;} .IndexStepBl:nth-child(5) {position: absolute; top: 342px; left: 220px;} .IndexStepBl:nth-child(6) {position: absolute; top: 537px; left: 300px;} .IndexStepBl:nth-child(7) {position: absolute; top: 536px; left: 707px;} .IndexStepBl:nth-child(7) span {color: #829c37;} #IndexWhy {padding: 80px 0px;} #IndexWhy h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold;} .IndexWhyBl {position: relative; overflow: hidden; float: left; margin-right: 20px; width: 176px; text-align: center; margin-top: 20px;} .IndexWhyBl:nth-last-child(1) {margin-right: 0px;} .IndexWhyBl h3 {font-size: 14px; line-height: 24px; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif; font-weight: bold; width: 95%; padding-top: 60px;} .IndexWhyBl:nth-child(2) {background: url(/img/Hand-Planting-50.png) center top no-repeat; background-size: 50px auto;} .IndexWhyBl:nth-child(3) {background: url(/img/Thumb-Up-50.png) center top no-repeat; background-size: 50px auto;} .IndexWhyBl:nth-child(4) {background: url(/img/Cheap-50.png) center top no-repeat; background-size: 50px auto;} .IndexWhyBl:nth-child(5) {background: url(/img/Delivery-50.png) center top no-repeat; background-size: 50px auto;} .IndexWhyBl:nth-child(6) {background: url(/img/Medal-50.png) center top no-repeat; background-size: 50px auto;} #OurWork {padding: 80px 0px;} #OurWork h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 40px; text-align: center; font-weight: bold;} #OurWork img {width: 220px; margin: 10px; float: left; display: inline-block;} #OurWork a:nth-child(2) img {height: 640px; width: auto;} #OurWork a:nth-child(6) img {top: -130px; position: relative;} .IndexForm {padding: 40px 0px; background: #f1ccd2; margin: 0px 0px; text-align: center;} .IndexForm h3 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 25px; text-align: center; font-weight: bold;} .IndexForm input {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 15px; line-height: 40px; height: 26px; width: 240px;} .IndexForm input.SubmtiClose {position: relative; overflow: hidden; height: 40px; margin-top: 10px; padding: 0px; width: 200px; text-align: center; background: #000; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer;} .IndexForm input.SubmtiClose:hover {background: #fff; color: #000;} #IndexContact {margin: 80px 0px;} #IndexContactLBL {width: 50%; position: relative; overflow: hidden; float: left; height: 400px;} #map {width: 100%; height: 400px;} #IndexContactRBL {width: 50%; float: left; position: relative; overflow: hidden;} #IndexContactRBL h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 65px; font-weight: bold; margin-left: 40px;} #IndexContactRBL p {margin-bottom: 35px; font-size: 18px; margin-left: 40px; padding: 10px 0px; padding-left: 54px;} #IndexContactRBL p:nth-child(2) {background: url(/img/Map-Marker-50.png) left center no-repeat; background-size: 36px auto;} #IndexContactRBL p:nth-child(3) {background: url(/img/Phone-50.png) left center no-repeat; background-size: 36px auto;} #IndexContactRBL p:nth-child(4) {background: url(/img/Clock-50.png) left center no-repeat; background-size: 36px auto;} #TMenu2 {padding: 20px; background: #fff;} #TMenu2 img {width: 100%;} .overlay {display:none; position:fixed; z-index:999; opacity:0.8; filter:alpha(opacity=80); top:0; right:0; left:0; bottom:0; background:#fff; z-index: 9000;} .popup {display:none; position:fixed; background: #f1ccd2; width:400px; height:500px; top:50%; left:50%; margin:-250px 0 0 -200px; z-index:9999;} .close {display:block; width:24px; cursor:pointer; height:24px; position:absolute; top:10px; right:10px;} #popup1 h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 25px; font-weight: bold; margin-left: 40px; margin-top: 40px;} #popup1 input {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 7px 45px; line-height: 40px; height: 26px; width: 280px;} #popup1 input.SubmtiClose {position: relative; overflow: hidden; height: 40px; margin-top: 10px; padding: 0px; width: 200px; text-align: center; background: #000; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer;} #popup1 textarea {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 7px 45px; line-height: 40px; height: 80px; width: 280px;} #popup1.SubmtiClose:hover {background: #fff; color: #000;} .cd-modal-content table {border: 1px solid #fff;} .overlay2 {display:none; position:fixed; z-index:999; opacity:0.8; filter:alpha(opacity=80); top:0; right:0; left:0; bottom:0; background:#fff; z-index: 9000;} .popup2 {display:none; position:fixed; background: #f1ccd2; width:400px; height:300px; top:50%; left:50%; margin:-150px 0 0 -200px; z-index:9999;} .close2 {display:block; width:24px; cursor:pointer; height:24px; position:absolute; top:10px; right:10px;} #popup2 h2 {font-family: 'Open Sans Condensed', sans-serif; font-size: 40px; text-transform: uppercase; margin-bottom: 25px; font-weight: bold; margin-left: 40px; margin-top: 40px;} #popup2 input {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 7px 45px; line-height: 40px; height: 26px; width: 280px;} #popup2 input.SubmtiClose {position: relative; overflow: hidden; height: 40px; margin-top: 10px; padding: 0px; width: 200px; text-align: center; background: #000; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer;} #popup2 textarea {background: #fff; border: none; padding: 7px 0px 7px 15px; font-size: 18px; margin: 7px 45px; line-height: 40px; height: 80px; width: 280px;} #popup2.SubmtiClose:hover {background: #fff; color: #000;} .OptionStep1 {position: relative; overflow: hidden; width: 100%; margin-bottom: 30px;} .OptionStep1 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold;} .OptionStep1 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep2 {position: relative; overflow: hidden; width: 100%;} .OptionStep2 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep2 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep2 p span.ui-slider-handle {padding: 10px 0px;} .SliderBl {position: relative; overflow: hidden; padding-left: 50px; padding-right: 50px;} .OptionStep2 #slider {position: relative; width: auto; margin: 10px 0px 10px 0px; top: 10px; left: 0px;} .OptionStep2 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 70px; margin-left: 25px;} .OptionStep3 {position: relative; overflow: hidden; width: 100%;} .OptionStep3 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep3 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep3 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep3 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 150px; margin-left: 25px;} .OptionStep3 h6 span {font-weight: bold; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif; font-size: 20px;} .OptionStep22 {position: relative; overflow: hidden; width: 100%;} .OptionStep22 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep22 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep22 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep22 #sliderB {position: relative; width: auto; margin: 10px 0px 10px 0px; top: 10px; left: 0px;} .OptionStep22 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 70px; margin-left: 25px;} .OptionStep32 {position: relative; overflow: hidden; width: 100%;} .OptionStep32 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep32 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep32 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep32 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 150px; margin-left: 25px;} .OptionStep32 h6 span {font-weight: bold; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif; font-size: 20px;} .OptionStep23 {position: relative; overflow: hidden; width: 100%;} .OptionStep23 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep23 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep23 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep23 #sliderC {position: relative; width: auto; margin: 10px 0px 10px 0px; top: 10px; left: 0px;} .OptionStep23 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 70px; margin-left: 25px;} .OptionStep33 {position: relative; overflow: hidden; width: 100%;} .OptionStep33 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep33 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep33 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep33 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 150px; margin-left: 25px;} .OptionStep33 h6 span {font-weight: bold; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif; font-size: 20px;} .OptionStep24 {position: relative; overflow: hidden; width: 100%;} .OptionStep24 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep24 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep24 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep24 #sliderD {position: relative; width: auto; margin: 10px 0px 10px 0px; top: 10px; left: 0px;} .OptionStep24 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 70px; margin-left: 25px;} .OptionStep34 {position: relative; overflow: hidden; width: 100%;} .OptionStep34 p {font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 20px; font-weight: bold; margin-bottom: 10px;} .OptionStep34 p span {font-size: 30px; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 900; display: inline-block; margin-right: 7px;} .OptionStep34 p span.ui-slider-handle {padding: 10px 0px;} .OptionStep34 input {background: none; border: none; padding: 7px 15px; font-size: 28px; width: 150px; margin-left: 25px;} .OptionStep34 h6 span {font-weight: bold; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif; font-size: 20px;} .steps { border: 1px solid transparent; /*follows #slider2 style for sizing purposes */ width: 100%; position: relative; height: 30px; margin-bottom: 10px; } .tick { border: 1px solid transparent; /*follows slide handle style for sizing purposes*/ position: absolute; width: 40px; margin-left: -20px; font-size: 12px; text-align:center; left: 0; font-weight: bold; font-family: 'Roboto Condensed', sans-serif; } /*----- Tabs -----*/ .tabs {width:100%; display:inline-block; position: relative;} .tab-links {margin-left: 35px;} .tab-links:after {display:block; clear:both; content:'';} .tab-links li {margin:0px 1px; float:left; list-style:none; margin-bottom: 20px;} .tab-links a {padding: 10px 20px; display: inline-block; font-size: 16px; color: #000; background: #fff; font-weight: bold; transition:all linear 0.15s;} .tab-links a:hover {color: #fff; background: #000;} li.active a, li.active a:hover {color: #fff; background: #000;} .tab-content {} .tab {display:none;} .tab.active {display:block;} .cd-modal { position: fixed; z-index: 2; top: 0; left: 0; height: 100%; width: 100%; visibility: hidden; -webkit-transition: visibility 0s 0.6s; -moz-transition: visibility 0s 0.6s; transition: visibility 0s 0.6s; } .cd-modal svg { position: absolute; top: 0; left: 0; } .cd-modal svg > path { fill: #f1ccd2; } .cd-modal .modal-close { /* 'X' icon */ position: absolute; z-index: 1; top: 20px; right: 5%; height: 50px; width: 50px; border-radius: 50%; background: rgba(0, 0, 0, 0.3) url(/img/cd-icon-close.svg) no-repeat center center; /* image replacement */ overflow: hidden; text-indent: 100%; white-space: nowrap; /* Force hardware acceleration*/ -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; visibility: hidden; opacity: 0; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: -webkit-transform 0.3s 0s, visibility 0s 0.3s, opacity 0.3s 0s; -moz-transition: -moz-transform 0.3s 0s, visibility 0s 0.3s, opacity 0.3s 0s; transition: transform 0.3s 0s, visibility 0s 0.3s, opacity 0.3s 0s; } .no-touch .cd-modal .modal-close:hover { background-color: rgba(0, 0, 0, 0.5); } .cd-modal.modal-is-visible { visibility: visible; -webkit-transition: visibility 0s 0s; -moz-transition: visibility 0s 0s; transition: visibility 0s 0s; } .cd-modal.modal-is-visible .modal-close { visibility: visible; opacity: 1; -webkit-transition: -webkit-transform 0.3s 0s, visibility 0s 0s, opacity 0.3s 0s; -moz-transition: -moz-transform 0.3s 0s, visibility 0s 0s, opacity 0.3s 0s; transition: transform 0.3s 0s, visibility 0s 0s, opacity 0.3s 0s; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .cd-modal-content { position: relative; height: 100vh; overflow-y: auto; padding: 3em 5% 4em; opacity: 0; -webkit-transform: translateY(50px); -moz-transform: translateY(50px); -ms-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); -webkit-transition: opacity 0.3s 0s, -webkit-transform 0.3s 0s; -moz-transition: opacity 0.3s 0s, -moz-transform 0.3s 0s; transition: opacity 0.3s 0s, transform 0.3s 0s; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .cd-modal-content p { color: #f1ccd2; line-height: 1.6; margin: 2em 0; } .modal-is-visible .cd-modal-content { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -webkit-overflow-scrolling: touch; -webkit-transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s; -moz-transition: opacity 0.3s 0.3s, -moz-transform 0.3s 0.3s; transition: opacity 0.3s 0.3s, transform 0.3s 0.3s; } @media only screen and (min-width: 768px) { .cd-modal-content { padding: 3em 10% 4em; } .cd-modal-content p { font-size: 2.4rem; } } /* -------------------------------- Cover Layer - hide main content when modal is fired -------------------------------- */ .cd-cover-layer { position: fixed; z-index: 1; top: 0; left: 0; height: 100%; width: 100%; background-color: #fff; visibility: hidden; opacity: 0; -webkit-transition: opacity 0.3s 0.3s, visibility 0s 0.6s; -moz-transition: opacity 0.3s 0.3s, visibility 0s 0.6s; transition: opacity 0.3s 0.3s, visibility 0s 0.6s; } .cd-cover-layer.modal-is-visible { opacity: 1; visibility: visible; -webkit-transition: opacity 0.3s 0s, visibility 0s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0s; transition: opacity 0.3s 0s, visibility 0s 0s; }