@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap); @import url(https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap); .designerEnvisionContainer .designerEnvisionSec h6, .form-group, .housePlanFeatureCard .featureBadgeList li, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent h3, .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li, address, dl, ol, p, pre, ul { margin-bottom: 1rem } .bs-popover-auto[x-placement^=top], .bs-popover-top, dd, label { margin-bottom: .5rem } progress, sub, sup { vertical-align: baseline } .contactSec .contactContentSec img, .housePlans-Slider ul img, .img-fluid, .img-responsive, .img-thumbnail, .planFilterFormGroup.sqrFt, legend { max-width: 100% } .card, fieldset { min-width: 0 } .badge, .dropdown-header, .dropdown-item, .dropdown-toggle, .fix-chk tbody tr td:last-child, .input-group-text, .navbar-brand, .progress-bar { white-space: nowrap } #additional-options .options, *, .slick-slider, ::after, ::before, legend { box-sizing: border-box } .carousel.pointer-event, .slick-slider { touch-action: pan-y } .slick-slider, html { -webkit-tap-highlight-color: transparent } h1 { margin: .67em 0 } .housePlanDetailPageContentHolder h5+h3, .housePlanDetailPageContentHolder ul+h3, .input-group-text input[type=checkbox], .input-group-text input[type=radio], .list-group-horizontal .list-group-item.active, dl, h1, h2, h3, h4, h5, h6, ol, p, ul { margin-top: 0 } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15 } [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring { outline: ButtonText dotted 1px } [type=checkbox], [type=radio], input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0 } [type=search] { -webkit-appearance: textfield; outline-offset: -2px; outline-offset: -2px; -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } address, legend { line-height: inherit } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, pre, section { display: block } .pgwSlideshow { width: 100%; background: #333; display: none } .browseHousePlan .browseContentSec h3, .contactInfoSec ul li a, .costBuiltCalcSec .contentSp h3, .costBuiltCalcSec .contentSp h5, .costBuiltCalcSec .contentSp p, .customDreamContainer .customDreamHolder .customDreamSec>h2, .customDreamContainer .customDreamHolder .customDreamSec>h3, .customDreamContainer .customDreamHolder .customDreamSec>h4, .customDreamContainer .customDreamHolder .customDreamSec>h6, .customDreamContainer .customDreamHolder .customDreamSec>p, .farmHouseDetailContainer .farmHouseDetailHolder *, .findHomeContentHolder h3, .findHomeContentHolder h4, .findHomeContentHolder p, .navbar-dark .navbar-brand, .navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link, .navbar-dark .navbar-text a, .navbar-dark .navbar-text a:focus, .navbar-dark .navbar-text a:hover, .pgwSlideshow a, .purchaseOnlinePlanContainer .purchaseOnlinePlanSec * { color: #fff } .pgwSlideshow .ps-current { text-align: center; position: relative; min-height: 150px; overflow: hidden } .buildCostTabContainer.contentSp *, .directContent.farmHouseDetailContainer .farmHouseDetailHolder *, .housePlanActionSp.housePlanSliderActionoHolder ul li a span, body, caption { text-align: left } .pgwSlideshow .ps-current>ul>li { text-align: center; width: 100%; z-index: 1; opacity: 0; display: block } .pgwSlideshow .ps-current>ul>li img { display: block; max-width: 100%; margin: auto } .pgwSlideshow .ps-caption { background: rgba(0, 0, 0, .5); text-align: left; font-size: 1rem; color: #fff; position: absolute; left: 0; bottom: 0; width: 100%; padding: 10px; display: none } .pgwSlideshow .ps-caption span { padding: 7px; display: inline-block } .pgwSlideshow .ps-list { border-top: 1px solid #555; box-shadow: 0 10px 10px -5px #333 inset; background: #555; overflow: hidden; position: relative } .pgwSlideshow .ps-nextIcon, .pgwSlideshow .ps-prevIcon { border-color: transparent #fff; border-style: solid; display: block } .btn.focus, .btn:focus, .custom-control-input:focus~.custom-control-label::before, .form-control:focus { box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25) } .pgwSlideshow .ps-list ul { position: relative; list-style: none; margin: 0; padding: 0; left: 0 } .pgwSlideshow .ps-list li { float: left } .pgwSlideshow .ps-list li .ps-item { display: block; margin: 15px 8px; opacity: .6 } .pgwSlideshow .ps-list li img { display: block; border: 1px solid #777; width: 80px; height: 80px } .housePlans-Slider ul li.slick-slide, .img-fluid, select.form-control[multiple], select.form-control[size], textarea.form-control { height: auto } .pgwSlideshow .ps-list li .ps-item.ps-selected { float: left; opacity: 1; border: 4px solid #fff; overflow: hidden } .pgwSlideshow .ps-list li .ps-item.ps-selected img { margin: -4px } .pgwSlideshow .ps-prevIcon { border-width: 10px 10px 10px 0 } .pgwSlideshow .ps-nextIcon { border-width: 10px 0 10px 10px } .pgwSlideshow .ps-current .ps-prev { background: rgba(0, 0, 0, .5); border: 1px solid #777; border-left: 0; border-radius: 0 4px 4px 0; position: absolute; padding: 20px 20px 20px 15px; left: 0; top: 45%; cursor: pointer } .pgwSlideshow .ps-current .ps-next { background: rgba(0, 0, 0, .5); border: 1px solid #777; border-right: 0; border-radius: 4px 0 0 4px; position: absolute; padding: 20px 15px 20px 20px; right: 0; top: 45%; cursor: pointer } .pgwSlideshow .ps-list .ps-next, .pgwSlideshow .ps-list .ps-prev { background: rgba(0, 0, 0, .5); cursor: pointer; position: absolute; top: 25px; z-index: 1000; display: none } .pgwSlideshow .ps-list .ps-prev { border: 1px solid #777; border-left: 0; border-radius: 0 4px 4px 0; padding: 20px 15px 20px 12px; left: 0 } .pgwSlideshow .ps-list .ps-next { border: 1px solid #777; border-right: 0; border-radius: 4px 0 0 4px; padding: 20px 12px 20px 15px; right: 0 } .pgwSlideshow.narrow .ps-list li img { width: 60px; height: 60px } .pgwSlideshow.narrow .ps-current .ps-prev { padding: 15px 15px 15px 12px; top: 40% } .pgwSlideshow.narrow .ps-current .ps-next { padding: 15px 12px 15px 15px; top: 40% } .pgwSlideshow.narrow .ps-list .ps-prev { padding: 15px 12px 15px 10px; top: 20px } .pgwSlideshow.narrow .ps-list .ps-next { padding: 15px 10px 15px 12px; top: 20px } .pgwSlideshow.narrow .ps-caption { font-size: .8rem; padding: 8px } :root { --weight-100: 100; --weight-200: 200; --weight-300: 300; --weight-400: 400; --weight-500: 500; --weight-600: 600; --weight-700: 700; --weight-800: 800; --weight-900: 900; --family-montserrat: Montserrat, sans-serif; --family-lato: 'Lato', sans-serif; --blue: #007bff; --indigo: #6610f2; --purple: #6f42c1; --pink: #e83e8c; --red: #dc3545; --orange: #fd7e14; --yellow: #ffc107; --green: #28a745; --teal: #20c997; --cyan: #17a2b8; --white: #fff; --gray: #6c757d; --gray-dark: #343a40; --primary: #007bff; --secondary: #6c757d; --success: #28a745; --info: #17a2b8; --warning: #ffc107; --danger: #dc3545; --light: #f8f9fa; --dark: #343a40; --breakpoint-xs: 0; --breakpoint-sm: 576px; --breakpoint-md: 768px; --breakpoint-lg: 992px; --breakpoint-xl: 1200px; --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace } html { -webkit-text-size-adjust: 100%; font-family: sans-serif; -webkit-text-size-adjust: 100% } body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; background-color: #fff } .alert-link, dt, kbd kbd { font-weight: 700 } [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important } abbr[data-original-title], abbr[title] { -webkit-text-decoration: underline dotted; text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none } .breadcrumb-item+.breadcrumb-item:hover::before, .btn-link, .btn:hover, .card-link:hover, .nav-link:focus, .nav-link:hover, .navbar-brand:focus, .navbar-brand:hover, .navbar-toggler:focus, .navbar-toggler:hover, a, a.badge:focus, a.badge:hover, a:hover { text-decoration: none } .btn, .multiselect-container .multiselect-group.dropdown-item, .multiselect-container .multiselect-group.dropdown-toggle, .multiselect-container .multiselect-group>span>.form-check-label, .multiselect-container>.multiselect-option.dropdown-item, .multiselect-container>.multiselect-option.dropdown-toggle, .multiselect-container>.multiselect-option>span>.form-check-label, [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled), summary { cursor: pointer } address { font-style: normal } .additionalContent>p, .btn-group-toggle>.btn, .btn-group-toggle>.btn-group>.btn, .card-text:last-child, .form-check-label, .modal-title, .stepsPlanSets, .total p, ol ol, ol ul, ul ol, ul ul { margin-bottom: 0 } .dropdown-toggle-split::after, .dropdown-toggle:empty::after, .dropleft .dropdown-toggle:empty::after, .dropright .dropdown-toggle-split::after, .dropright .dropdown-toggle:empty::after, .dropup .dropdown-toggle-split::after, .dropup .dropdown-toggle:empty::after, dd { margin-left: 0 } blockquote, figure { margin: 0 0 1rem } b, strong { font-weight: bolder } sub, sup { position: relative; font-size: 75%; line-height: 0 } sub { bottom: -.25em } sup { top: -.5em } .btn-outline-primary.disabled, .btn-outline-primary:disabled, a { color: #007bff; background-color: transparent } .btn-link:hover, a:hover { color: #0056b3 } a:not([href]), a:not([href]):hover { color: inherit; text-decoration: none } code, kbd, pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em } pre { margin-top: 0; overflow: auto } img { border-style: none } .accordion>.card, .collapsing, .modal-open, .progress, .progress-bar, .testimonialSec .testimonialSlideSec .slick-list, .toast, svg { overflow: hidden } table { border-collapse: collapse } caption { padding-top: .75rem; padding-bottom: .75rem; color: #6c757d; caption-side: bottom } th { text-align: inherit } .figure, .inputHold, .list-inline-item, .option, label, output { display: inline-block } button { border-radius: 0 } button:focus { outline: dotted 1px; outline: -webkit-focus-ring-color auto 5px } button, input, optgroup, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit } button, input { overflow: visible } button, select { text-transform: none } select { word-wrap: normal } .card, .popover, .tooltip, code { word-wrap: break-word } [type=button], [type=reset], [type=submit], button { -webkit-appearance: button } [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { padding: 0; border-style: none } input[type=date], input[type=datetime-local], input[type=month], input[type=time] { -webkit-appearance: listbox } textarea { overflow: auto; resize: vertical; resize: vertical } legend { color: inherit; display: block; width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; white-space: normal } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto } [type=search]::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button } .display-1, .display-2, .display-3, .display-4 { line-height: 1.2 } summary { display: list-item } .collapse:not(.show), template { display: none } .d-none, .hidden, .pgwSlideshow .ps-current .ps-next, .pgwSlideshow .ps-current .ps-prev, [hidden] { display: none !important } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { margin-bottom: .5rem; font-weight: 500; line-height: 1.2 } .display-1, .display-2, .display-3, .display-4, .lead { font-weight: 300 } .h1, h1 { font-size: 2.5rem } .h2, .instantCostBuildFaqSec .faqSec .card .card-header h2, h2 { font-size: 2rem } .h3, h3 { font-size: 1.75rem } .h4, .purchaseDsc h3, h4 { font-size: 1.5rem } .h5, .lead, .purchaseDsc h4, h5 { font-size: 1.25rem } .h6, h6 { font-size: 1rem } .display-1 { font-size: 6rem } .display-2 { font-size: 5.5rem } .display-3 { font-size: 4.5rem } .display-4 { font-size: 3.5rem } .btn, .btn-link, .dropdown-item, .form-control, .small, small { font-weight: 400 } .small, small { font-size: 80% } code, kbd, pre { font-size: 87.5% } .mark, mark { padding: .2em; background-color: #fcf8e3 } .list-inline, .list-unstyled { padding-left: 0; list-style: none } .bs-popover-auto[x-placement^=left], .bs-popover-left, .list-inline-item:not(:last-child) { margin-right: .5rem } .initialism { font-size: 90%; text-transform: uppercase } .blockquote { margin-bottom: 1rem; font-size: 1.25rem } .blockquote-footer { display: block; font-size: 80%; color: #6c757d } .blockquote-footer::before { content: "\2014\A0" } .img-thumbnail { padding: .25rem; background-color: #fff; border: 1px solid #dee2e6; border-radius: .25rem; height: auto } .figure-img { margin-bottom: .5rem; line-height: 1 } .figure-caption { font-size: 90%; color: #6c757d } .alert-heading, a>code, pre code { color: inherit } code { color: #e83e8c } kbd { padding: .2rem .4rem; color: #fff; background-color: #212529; border-radius: .2rem } .btn:hover, .table, pre { color: #212529 } kbd kbd { padding: 0; font-size: 100% } pre code { font-size: inherit; word-break: normal } .pre-scrollable { max-height: 340px; overflow-y: scroll } .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto } @media (min-width:576px) { .container { max-width: 540px } } @media (min-width:768px) { .container { max-width: 720px } } @media (min-width:992px) { .container { max-width: 960px } } @media (min-width:1200px) { .container { max-width: 1140px } } @media (min-width:576px) { .container, .container-sm { max-width: 540px } } @media (min-width:768px) { .container, .container-md, .container-sm { max-width: 720px } } .row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px } .card>hr, .no-gutters { margin-right: 0; margin-left: 0 } .form-control-plaintext.form-control-lg, .form-control-plaintext.form-control-sm, .navbar-nav .nav-link, .no-gutters>.col, .no-gutters>[class*=col-] { padding-right: 0; padding-left: 0 } .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { position: relative; width: 100%; padding-right: 15px; padding-left: 15px } .col { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-12, .filterRefineForm .filterFormRow .filterFieldSec.full-width, .footerNavBlock h6, .row-cols-1>*, ul.mega-menu li { flex: 0 0 100%; max-width: 100% } .col-6, .row-cols-2>* { flex: 0 0 50%; max-width: 50% } .col-4, .row-cols-3>* { flex: 0 0 33.333333%; max-width: 33.333333% } .col-3, .row-cols-4>* { flex: 0 0 25%; max-width: 25% } .row-cols-5>* { flex: 0 0 20%; max-width: 20% } .col-2, .row-cols-6>* { flex: 0 0 16.666667%; max-width: 16.666667% } .col-auto { flex: 0 0 auto; width: auto; max-width: 100% } .col-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .col-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .col-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .col-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .col-9 { flex: 0 0 75%; max-width: 75% } .col-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .col-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .order-first { order: -1 } .order-last { order: 13 } .order-0 { order: 0 } .order-1 { order: 1 } .order-2 { order: 2 } .order-3 { order: 3 } .order-4 { order: 4 } .order-5 { order: 5 } .order-6 { order: 6 } .order-7 { order: 7 } .order-8 { order: 8 } .order-9 { order: 9 } .order-10 { order: 10 } .order-11 { order: 11 } .order-12 { order: 12 } .offset-1 { margin-left: 8.333333% } .offset-2 { margin-left: 16.666667% } .offset-3 { margin-left: 25% } .offset-4 { margin-left: 33.333333% } .offset-5 { margin-left: 41.666667% } .offset-6 { margin-left: 50% } .offset-7 { margin-left: 58.333333% } .offset-8 { margin-left: 66.666667% } .offset-9 { margin-left: 75% } .offset-10 { margin-left: 83.333333% } .offset-11 { margin-left: 91.666667% } .table { width: 100%; margin-bottom: 1rem } .table td, .table th { padding: .75rem; vertical-align: top; border-top: 1px solid #dee2e6 } .table thead th { vertical-align: bottom; border-bottom: 2px solid #dee2e6 } .table tbody+tbody { border-top: 2px solid #dee2e6 } .table-sm td, .table-sm th { padding: .3rem } .table-bordered, .table-bordered td, .table-bordered th { border: 1px solid #dee2e6 } .table-bordered thead td, .table-bordered thead th { border-bottom-width: 2px } .table-borderless tbody+tbody, .table-borderless td, .table-borderless th, .table-borderless thead th, .table-dark.table-bordered, .table-responsive>.table-bordered { border: 0 } .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, .05) } .table-hover tbody tr:hover { color: #212529; background-color: rgba(0, 0, 0, .075) } .table-primary, .table-primary>td, .table-primary>th { background-color: #b8daff } .table-primary tbody+tbody, .table-primary td, .table-primary th, .table-primary thead th { border-color: #7abaff } .table-hover .table-primary:hover, .table-hover .table-primary:hover>td, .table-hover .table-primary:hover>th { background-color: #9fcdff } .table-secondary, .table-secondary>td, .table-secondary>th { background-color: #d6d8db } .table-secondary tbody+tbody, .table-secondary td, .table-secondary th, .table-secondary thead th { border-color: #b3b7bb } .table-hover .table-secondary:hover, .table-hover .table-secondary:hover>td, .table-hover .table-secondary:hover>th { background-color: #c8cbcf } .table-success, .table-success>td, .table-success>th { background-color: #c3e6cb } .table-success tbody+tbody, .table-success td, .table-success th, .table-success thead th { border-color: #8fd19e } .table-hover .table-success:hover, .table-hover .table-success:hover>td, .table-hover .table-success:hover>th { background-color: #b1dfbb } .table-info, .table-info>td, .table-info>th { background-color: #bee5eb } .table-info tbody+tbody, .table-info td, .table-info th, .table-info thead th { border-color: #86cfda } .table-hover .table-info:hover, .table-hover .table-info:hover>td, .table-hover .table-info:hover>th { background-color: #abdde5 } .table-warning, .table-warning>td, .table-warning>th { background-color: #ffeeba } .table-warning tbody+tbody, .table-warning td, .table-warning th, .table-warning thead th { border-color: #ffdf7e } .table-hover .table-warning:hover, .table-hover .table-warning:hover>td, .table-hover .table-warning:hover>th { background-color: #ffe8a1 } .table-danger, .table-danger>td, .table-danger>th { background-color: #f5c6cb } .table-danger tbody+tbody, .table-danger td, .table-danger th, .table-danger thead th { border-color: #ed969e } .table-hover .table-danger:hover, .table-hover .table-danger:hover>td, .table-hover .table-danger:hover>th { background-color: #f1b0b7 } .table-light, .table-light>td, .table-light>th { background-color: #fdfdfe } .table-light tbody+tbody, .table-light td, .table-light th, .table-light thead th { border-color: #fbfcfc } .table-hover .table-light:hover, .table-hover .table-light:hover>td, .table-hover .table-light:hover>th { background-color: #ececf6 } .table-dark, .table-dark>td, .table-dark>th { background-color: #c6c8ca } .table-dark tbody+tbody, .table-dark td, .table-dark th, .table-dark thead th { border-color: #95999c } .table .thead-dark th, .table-dark td, .table-dark th, .table-dark thead th { border-color: #454d55 } .table-hover .table-dark:hover, .table-hover .table-dark:hover>td, .table-hover .table-dark:hover>th { background-color: #b9bbbe } .table-active, .table-active>td, .table-active>th, .table-hover .table-active:hover, .table-hover .table-active:hover>td, .table-hover .table-active:hover>th { background-color: rgba(0, 0, 0, .075) } .badge-dark, .table .thead-dark th, .table-dark { background-color: #343a40; color: #fff } .table .thead-light th { color: #495057; background-color: #e9ecef; border-color: #dee2e6 } .table-dark.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, .05) } .table-dark.table-hover tbody tr:hover { color: #fff; background-color: rgba(255, 255, 255, .075) } .table-responsive { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch } .form-control { display: block; width: 100%; padding: .375rem .75rem; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out } .form-control::-ms-expand { background-color: transparent; border: 0 } .form-control:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057 } .form-control:focus { color: #495057; background-color: #fff } .form-control::-moz-placeholder { color: #6c757d; opacity: 1 } .form-control:-ms-input-placeholder { color: #6c757d; opacity: 1 } .form-control::placeholder { color: #6c757d; opacity: 1 } .form-control:disabled, .form-control[readonly] { background-color: #e9ecef !important; opacity: 1 } select.form-control:focus::-ms-value { color: #495057; background-color: #fff } .btn-block, .form-control-file, .form-control-range { display: block; width: 100% } .col-form-label { padding-top: calc(.375rem + 1px); padding-bottom: calc(.375rem + 1px); margin-bottom: 0; font-size: inherit; line-height: 1.5 } .col-form-label-lg { padding-top: calc(.5rem + 1px); padding-bottom: calc(.5rem + 1px); font-size: 1.25rem; line-height: 1.5 } .col-form-label-sm { padding-top: calc(.25rem + 1px); padding-bottom: calc(.25rem + 1px); font-size: .875rem; line-height: 1.5 } .form-control-plaintext { display: block; width: 100%; padding: .375rem 0; margin-bottom: 0; font-size: 1rem; line-height: 1.5; color: #212529; background-color: transparent; border: solid transparent; border-width: 1px 0 } .form-control-sm { height: calc(1.5em + .5rem + 2px); padding: .25rem .5rem; font-size: .875rem; line-height: 1.5; border-radius: .2rem } .form-control-lg, .input-group-lg>.custom-select, .input-group-lg>.form-control:not(textarea) { height: calc(1.5em + 1rem + 2px) } .btn-group-lg>.btn, .btn-lg, .form-control-lg, .input-group-lg>.custom-select, .input-group-lg>.form-control, .input-group-lg>.input-group-append>.btn, .input-group-lg>.input-group-append>.input-group-text, .input-group-lg>.input-group-prepend>.btn, .input-group-lg>.input-group-prepend>.input-group-text { padding: .5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: .3rem } .form-text { display: block; margin-top: .25rem } .form-row { display: flex; flex-wrap: wrap; margin-right: -5px; margin-left: -5px } .form-row>.col, .form-row>[class*=col-] { padding-right: 5px; padding-left: 5px } .form-check { position: relative; display: block; padding-left: 1.25rem } .form-check-input { position: absolute; margin-top: .3rem; margin-left: -1.25rem } .breadcrumb-item.active, .custom-control-input:disabled~.custom-control-label, .custom-control-input[disabled]~.custom-control-label, .form-check-input:disabled~.form-check-label, .form-check-input[disabled]~.form-check-label { color: #6c757d } .form-check-inline { display: inline-flex; align-items: center; padding-left: 0; margin-right: .75rem } .invalid-tooltip, .valid-tooltip { top: 100%; z-index: 5; display: none; padding: .25rem .5rem; border-radius: .25rem; line-height: 1.5; position: absolute; max-width: 100% } .form-check-inline .form-check-input { position: static; margin-top: 0; margin-right: .3125rem; margin-left: 0 } .valid-feedback { display: none; width: 100%; margin-top: .25rem; font-size: 80%; color: #28a745 } .valid-tooltip { margin-top: .1rem; font-size: .875rem; color: #fff; background-color: rgba(40, 167, 69, .9) } .is-valid~.valid-feedback, .is-valid~.valid-tooltip, .was-validated :valid~.valid-feedback, .was-validated :valid~.valid-tooltip { display: block } .form-control.is-valid, .was-validated .form-control:valid { border-color: #28a745; padding-right: calc(1.5em + .75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(.375em + .1875rem) center; background-size: calc(.75em + .375rem) calc(.75em + .375rem) } .form-control.is-valid:focus, .was-validated .form-control:valid:focus { border-color: #28a745; box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .25) } .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + .75rem); background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem) } .custom-select.is-valid, .was-validated .custom-select:valid { border-color: #28a745; padding-right: calc(.75em + 2.3125rem); background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") right .75rem center/8px 10px no-repeat, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") center right 1.75rem/calc(.75em + .375rem) calc(.75em + .375rem) no-repeat #fff } .custom-select.is-valid:focus, .was-validated .custom-select:valid:focus { border-color: #28a745; box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .25) } .form-check-input.is-valid~.form-check-label, .was-validated .form-check-input:valid~.form-check-label { color: #28a745 } .form-check-input.is-valid~.valid-feedback, .form-check-input.is-valid~.valid-tooltip, .was-validated .form-check-input:valid~.valid-feedback, .was-validated .form-check-input:valid~.valid-tooltip { display: block } .custom-control-input.is-valid~.custom-control-label, .was-validated .custom-control-input:valid~.custom-control-label { color: #28a745 } .custom-control-input.is-valid~.custom-control-label::before, .was-validated .custom-control-input:valid~.custom-control-label::before { border-color: #28a745 } .custom-control-input.is-valid:checked~.custom-control-label::before, .was-validated .custom-control-input:valid:checked~.custom-control-label::before { border-color: #34ce57; background-color: #34ce57 } .custom-control-input.is-valid:focus~.custom-control-label::before, .was-validated .custom-control-input:valid:focus~.custom-control-label::before { box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .25) } .custom-control-input.is-valid:focus:not(:checked)~.custom-control-label::before, .was-validated .custom-control-input:valid:focus:not(:checked)~.custom-control-label::before { border-color: #28a745 } .custom-file-input.is-valid~.custom-file-label, .was-validated .custom-file-input:valid~.custom-file-label { border-color: #28a745 } .custom-file-input.is-valid:focus~.custom-file-label, .was-validated .custom-file-input:valid:focus~.custom-file-label { border-color: #28a745; box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .25) } .invalid-feedback { display: none; width: 100%; margin-top: .25rem; font-size: 80%; color: #dc3545 } .invalid-tooltip { margin-top: .1rem; font-size: .875rem; color: #fff; background-color: rgba(220, 53, 69, .9) } .is-invalid~.invalid-feedback, .is-invalid~.invalid-tooltip, .was-validated :invalid~.invalid-feedback, .was-validated :invalid~.invalid-tooltip { display: block } .form-control.is-invalid, .was-validated .form-control:invalid { border-color: #dc3545; padding-right: calc(1.5em + .75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(.375em + .1875rem) center; background-size: calc(.75em + .375rem) calc(.75em + .375rem) } .form-control.is-invalid:focus, .was-validated .form-control:invalid:focus { border-color: #dc3545; box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25) } .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + .75rem); background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem) } .custom-select.is-invalid, .was-validated .custom-select:invalid { border-color: #dc3545; padding-right: calc(.75em + 2.3125rem); background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") right .75rem center/8px 10px no-repeat, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") center right 1.75rem/calc(.75em + .375rem) calc(.75em + .375rem) no-repeat #fff } .custom-select.is-invalid:focus, .was-validated .custom-select:invalid:focus { border-color: #dc3545; box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25) } .form-check-input.is-invalid~.form-check-label, .was-validated .form-check-input:invalid~.form-check-label { color: #dc3545 } .form-check-input.is-invalid~.invalid-feedback, .form-check-input.is-invalid~.invalid-tooltip, .was-validated .form-check-input:invalid~.invalid-feedback, .was-validated .form-check-input:invalid~.invalid-tooltip { display: block } .custom-control-input.is-invalid~.custom-control-label, .was-validated .custom-control-input:invalid~.custom-control-label { color: #dc3545 } .custom-control-input.is-invalid~.custom-control-label::before, .was-validated .custom-control-input:invalid~.custom-control-label::before { border-color: #dc3545 } .custom-control-input.is-invalid:checked~.custom-control-label::before, .was-validated .custom-control-input:invalid:checked~.custom-control-label::before { border-color: #e4606d; background-color: #e4606d } .custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before, .custom-radio .custom-control-input:disabled:checked~.custom-control-label::before, .custom-switch .custom-control-input:disabled:checked~.custom-control-label::before { background-color: rgba(0, 123, 255, .5) } .custom-control-input.is-invalid:focus~.custom-control-label::before, .was-validated .custom-control-input:invalid:focus~.custom-control-label::before { box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25) } .custom-control-input.is-invalid:focus:not(:checked)~.custom-control-label::before, .was-validated .custom-control-input:invalid:focus:not(:checked)~.custom-control-label::before { border-color: #dc3545 } .custom-file-input.is-invalid~.custom-file-label, .was-validated .custom-file-input:invalid~.custom-file-label { border-color: #dc3545 } .custom-file-input.is-invalid:focus~.custom-file-label, .was-validated .custom-file-input:invalid:focus~.custom-file-label { border-color: #dc3545; box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25) } .form-inline { display: flex; flex-flow: row wrap; align-items: center } .blogSection .blogImg img, .btn-group-vertical>.btn, .btn-group-vertical>.btn-group, .competitiveComparisionTableHolder table, .form-inline .form-check, .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec form, .housePlanFilterTabSec, .housePlanSliderActionoHolder.stick ul li a i img, .housePlanSliderHolder .slider-nav .slick-list, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder img, .multiselect-native-select .btn-group, .multiselect-native-select .dropdown-menu, .productFilterRefineSec .accordion .card .card-header h2, .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp .adviceImgSec, .searchBarholder .headerSearchBar, .selectPlanFormHolder .selectPlanAmountSec, .selectPlanFormHolder form, .sidebar .sidebar-title .mhpLogo img, input[type=button].btn-block, input[type=reset].btn-block, input[type=submit].btn-block { width: 100% } .btn { display: inline-block; color: #212529; text-align: center; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; line-height: 1.5; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .btn-link:hover, .dream-home-section .head-wrapper a:hover, .myAccount-wrapper .card .linkList a:hover { text-decoration: underline } .btn.focus, .btn:focus, .custom-range:focus, .custom-select:focus, .slick-list:focus, :focus { outline: 0 } .btn-primary.focus, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(38, 143, 255, .5) } .btn.disabled, .btn:disabled { opacity: .65 } .slick-slide.dragging img, a.btn.disabled, a.close.disabled, fieldset:disabled a.btn { pointer-events: none } .btn-primary.focus, .btn-primary:focus { color: #fff; background-color: #0069d9; border-color: #0062cc } .btn-secondary.focus, .btn-secondary:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(130, 138, 145, .5) } .btn-outline-secondary:hover, .btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-secondary, .btn-secondary.disabled, .btn-secondary:disabled, .show>.btn-outline-secondary.dropdown-toggle { color: #fff; background-color: #6c757d; border-color: #6c757d } .btn-secondary.focus, .btn-secondary:focus, .btn-secondary:hover { background-color: #5a6268; border-color: #545b62; color: #fff } .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle { color: #fff; background-color: #545b62; border-color: #4e555b } .btn-success.focus, .btn-success:focus, .btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show>.btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(72, 180, 97, .5) } .btn-outline-success:hover, .btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, .btn-success, .btn-success.disabled, .btn-success:disabled, .show>.btn-outline-success.dropdown-toggle { color: #fff; background-color: #28a745; border-color: #28a745 } .btn-success.focus, .btn-success:focus, .btn-success:hover { background-color: #218838; border-color: #1e7e34; color: #fff } .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show>.btn-success.dropdown-toggle { color: #fff; background-color: #1e7e34; border-color: #1c7430 } .btn-info.focus, .btn-info:focus, .btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, .show>.btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(58, 176, 195, .5) } .btn-info, .btn-info.disabled, .btn-info:disabled, .btn-outline-info:hover, .btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, .show>.btn-outline-info.dropdown-toggle { color: #fff; background-color: #17a2b8; border-color: #17a2b8 } .btn-info.focus, .btn-info:focus, .btn-info:hover { background-color: #138496; border-color: #117a8b; color: #fff } .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show>.btn-info.dropdown-toggle { color: #fff; background-color: #117a8b; border-color: #10707f } .btn-warning.focus, .btn-warning:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, .show>.btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(222, 170, 12, .5) } .btn-outline-warning:hover, .btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, .btn-warning, .btn-warning.disabled, .btn-warning:disabled, .show>.btn-outline-warning.dropdown-toggle { color: #212529; background-color: #ffc107; border-color: #ffc107 } .btn-warning.focus, .btn-warning:focus, .btn-warning:hover { background-color: #e0a800; border-color: #d39e00; color: #212529 } .btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, .show>.btn-warning.dropdown-toggle { color: #212529; background-color: #d39e00; border-color: #c69500 } .btn-danger.focus, .btn-danger:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, .show>.btn-danger.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(225, 83, 97, .5) } .btn-danger, .btn-danger.disabled, .btn-danger:disabled, .btn-outline-danger:hover, .btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, .show>.btn-outline-danger.dropdown-toggle { color: #fff; background-color: #dc3545; border-color: #dc3545 } .btn-danger.focus, .btn-danger:focus, .btn-danger:hover { background-color: #c82333; border-color: #bd2130; color: #fff } .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, .show>.btn-danger.dropdown-toggle { color: #fff; background-color: #bd2130; border-color: #b21f2d } .btn-light { border-color: #f8f9fa } .btn-light.focus, .btn-light:focus, .btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, .show>.btn-light.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(216, 217, 219, .5) } .btn-dark.focus, .btn-dark:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, .show>.btn-dark.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(82, 88, 93, .5) } .btn-light.disabled, .btn-light:disabled, .btn-outline-light:hover, .btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, .show>.btn-outline-light.dropdown-toggle { color: #212529; background-color: #f8f9fa; border-color: #f8f9fa } .btn-dark, .btn-dark.disabled, .btn-dark:disabled, .btn-outline-dark:hover, .btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, .show>.btn-outline-dark.dropdown-toggle { color: #fff; background-color: #343a40; border-color: #343a40 } .btn-dark.focus, .btn-dark:focus, .btn-dark:hover { background-color: #23272b; border-color: #1d2124; color: #fff } .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, .show>.btn-dark.dropdown-toggle { color: #fff; background-color: #1d2124; border-color: #171a1d } .btn-outline-primary { color: #007bff; border-color: #007bff } .btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle { color: #fff; background-color: #007bff; border-color: #007bff } .btn-outline-primary.focus, .btn-outline-primary:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-primary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5) } .btn-outline-secondary { color: #6c757d; border-color: #6c757d } .btn-outline-secondary.focus, .btn-outline-secondary:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(108, 117, 125, .5) } .btn-outline-secondary.disabled, .btn-outline-secondary:disabled { color: #6c757d; background-color: transparent } .btn-outline-success { color: #28a745; border-color: #28a745 } .btn-outline-success.focus, .btn-outline-success:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-success.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .5) } .btn-outline-success.disabled, .btn-outline-success:disabled { color: #28a745; background-color: transparent } .btn-outline-info { color: #17a2b8; border-color: #17a2b8 } .btn-outline-info.focus, .btn-outline-info:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-info.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(23, 162, 184, .5) } .btn-outline-info.disabled, .btn-outline-info:disabled { color: #17a2b8; background-color: transparent } .btn-outline-warning { color: #ffc107; border-color: #ffc107 } .btn-outline-warning.focus, .btn-outline-warning:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-warning.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .5) } .btn-outline-warning.disabled, .btn-outline-warning:disabled { color: #ffc107; background-color: transparent } .btn-outline-danger { color: #dc3545; border-color: #dc3545 } .btn-outline-danger.focus, .btn-outline-danger:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-danger.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .5) } .btn-outline-danger.disabled, .btn-outline-danger:disabled { color: #dc3545; background-color: transparent } .btn-outline-light { color: #f8f9fa; border-color: #f8f9fa } .btn-outline-light.focus, .btn-outline-light:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-light.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(248, 249, 250, .5) } .btn-outline-light.disabled, .btn-outline-light:disabled { color: #f8f9fa; background-color: transparent } .btn-outline-dark { color: #343a40; border-color: #343a40 } .dropdown-toggle::after, .dropup .dropdown-toggle::after { vertical-align: .255em; content: ""; border-right: .3em solid transparent; border-left: .3em solid transparent; display: inline-block } .btn-outline-dark.focus, .btn-outline-dark:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-dark.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(52, 58, 64, .5) } .btn-outline-dark.disabled, .btn-outline-dark:disabled { color: #343a40; background-color: transparent } .btn-link { color: #007bff } .btn-link.focus, .btn-link:focus { text-decoration: underline; box-shadow: none } .btn-link.disabled, .btn-link:disabled { color: #6c757d; pointer-events: none } .btn-group-sm>.btn, .btn-sm, .input-group-sm>.custom-select, .input-group-sm>.form-control, .input-group-sm>.input-group-append>.btn, .input-group-sm>.input-group-append>.input-group-text, .input-group-sm>.input-group-prepend>.btn, .input-group-sm>.input-group-prepend>.input-group-text { padding: .25rem .5rem; font-size: .875rem; line-height: 1.5; border-radius: .2rem } .bs-popover-auto[x-placement^=bottom], .bs-popover-bottom, .btn-block+.btn-block { margin-top: .5rem } .fade { transition: opacity .15s linear } .fade:not(.show), .modal-backdrop.fade, header.height-0 { opacity: 0 } .collapsing { position: relative; height: 0; transition: height .35s } .alert, .box-over-container, .btn .badge, .card, .carousel, .check-new>p, .dropdown, .dropleft, .dropright, .dropup, .farmHouseDetailContainer, .findHomeSec, .housePlanSliderHolder ul li, .housePlans-Slider ul .imageHolder, .list-group-item, .navbar, .page-link, .primary-slider, .productBox .productBlock, .sliderSec ul li, .sticky_parent, span.multiselect-native-select { position: relative } .dropdown-toggle::after { margin-left: .255em; border-top: .3em solid; border-bottom: 0 } .dropdown-menu { color: #212529; text-align: left; list-style: none } .dropdown-menu-left { right: auto; left: 0 } .dropdown-menu-right { right: 0; left: auto } .dropup .dropdown-menu { top: auto; bottom: 100%; margin-top: 0; margin-bottom: .125rem } .dropup .dropdown-toggle::after { margin-left: .255em; border-top: 0; border-bottom: .3em solid } .dropleft .dropdown-toggle::before, .dropright .dropdown-toggle::after { content: ""; border-top: .3em solid transparent; border-bottom: .3em solid transparent } .dropright .dropdown-menu { top: 0; right: auto; left: 100%; margin-top: 0; margin-left: .125rem } .dropright .dropdown-toggle::after { display: inline-block; margin-left: .255em; border-right: 0; border-left: .3em solid; vertical-align: 0 } .dropleft .dropdown-menu { top: 0; right: 100%; left: auto; margin-top: 0; margin-right: .125rem } .dropleft .dropdown-toggle::after { margin-left: .255em; vertical-align: .255em; content: ""; display: none } .dropleft .dropdown-toggle::before { display: inline-block; margin-right: .255em; border-right: .3em solid; vertical-align: 0 } .dropdown-menu[x-placement^=bottom], .dropdown-menu[x-placement^=left], .dropdown-menu[x-placement^=right], .dropdown-menu[x-placement^=top] { right: auto; bottom: auto } .dropdown-divider { height: 0; margin: .5rem 0; overflow: hidden; border-top: 1px solid #e9ecef } .dropdown-item { display: block; width: 100%; padding: .25rem 1.5rem; clear: both; color: #212529; text-align: inherit; background-color: transparent; border: 0 } .dropdown-item:focus, .dropdown-item:hover { color: #16181b; text-decoration: none; background-color: #f8f9fa } .dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; background-color: #007bff } .dropdown-item.disabled, .dropdown-item:disabled { color: #6c757d; pointer-events: none; background-color: transparent } .alert-reverse.active, .carousel-item-next, .carousel-item-prev, .carousel-item.active, .dropdown-menu.show, .housePlanDetailPageContentHolder ul.dropdown-menu.show, .nav-link, .navBarHolder .navbar .navbar-nav .nav-item:hover>.dropdown-menu, .orderCostBuildSec .wizard .wizardBody.current, .productBox .productBlock .productImageSec a, .searchdropDown, .slick-initialized .slick-slide, .slick-slide img, .tab-content>.active, .tab-content>.tab-pane.active { display: block } .dropdown-header { display: block; padding: .5rem 1.5rem; margin-bottom: 0; font-size: .875rem; color: #6c757d } .dropdown-item-text { display: block; padding: .25rem 1.5rem; color: #212529 } .btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle } .btn-group-vertical>.btn, .btn-group>.btn { position: relative; flex: 1 1 auto } .btn-group-vertical>.btn.active, .btn-group-vertical>.btn:active, .btn-group-vertical>.btn:focus, .btn-group-vertical>.btn:hover, .btn-group>.btn.active, .btn-group>.btn:active, .btn-group>.btn:focus, .btn-group>.btn:hover { z-index: 1 } .btn-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-start } .btn-toolbar .input-group, .contactInfoSec ul li i img { width: auto } .btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child), .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li, .input-group-append, .input-group-append .btn+.btn, .input-group-append .btn+.input-group-text, .input-group-append .input-group-text+.btn, .input-group-append .input-group-text+.input-group-text, .input-group-prepend .btn+.btn, .input-group-prepend .btn+.input-group-text, .input-group-prepend .input-group-text+.btn, .input-group-prepend .input-group-text+.input-group-text, .input-group>.custom-file+.custom-file, .input-group>.custom-file+.custom-select, .input-group>.custom-file+.form-control, .input-group>.custom-select+.custom-file, .input-group>.custom-select+.custom-select, .input-group>.custom-select+.form-control, .input-group>.form-control+.custom-file, .input-group>.form-control+.custom-select, .input-group>.form-control+.form-control, .input-group>.form-control-plaintext+.custom-file, .input-group>.form-control-plaintext+.custom-select, .input-group>.form-control-plaintext+.form-control { margin-left: -1px } .btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle), .input-group>.custom-file:not(:last-child) .custom-file-label, .input-group>.custom-file:not(:last-child) .custom-file-label::after, .input-group>.custom-select:not(:last-child), .input-group>.form-control:not(:last-child), .input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle), .input-group>.input-group-append:last-child>.input-group-text:not(:last-child), .input-group>.input-group-append:not(:last-child)>.btn, .input-group>.input-group-append:not(:last-child)>.input-group-text, .input-group>.input-group-prepend>.btn, .input-group>.input-group-prepend>.input-group-text { border-top-right-radius: 0; border-bottom-right-radius: 0 } .btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:not(:first-child), .input-group>.custom-file:not(:first-child) .custom-file-label, .input-group>.custom-select:not(:first-child), .input-group>.form-control:not(:first-child), .input-group>.input-group-append>.btn, .input-group>.input-group-append>.input-group-text, .input-group>.input-group-prepend:first-child>.btn:not(:first-child), .input-group>.input-group-prepend:first-child>.input-group-text:not(:first-child), .input-group>.input-group-prepend:not(:first-child)>.btn, .input-group>.input-group-prepend:not(:first-child)>.input-group-text { border-top-left-radius: 0; border-bottom-left-radius: 0 } .dropdown-toggle-split { padding-right: .5625rem; padding-left: .5625rem } .blogDetailContentSec img.w-100, .dropleft .dropdown-toggle-split::before { margin-right: 0 } .btn-group-sm>.btn+.dropdown-toggle-split, .btn-sm+.dropdown-toggle-split { padding-right: .375rem; padding-left: .375rem } .btn-group-lg>.btn+.dropdown-toggle-split, .btn-lg+.dropdown-toggle-split { padding-right: .75rem; padding-left: .75rem } .btn-group-vertical { flex-direction: column; align-items: flex-start; justify-content: center } .btn-group-vertical>.btn-group:not(:first-child), .btn-group-vertical>.btn:not(:first-child) { margin-top: -1px } .btn-group-vertical>.btn-group:not(:last-child)>.btn, .btn-group-vertical>.btn:not(:last-child):not(.dropdown-toggle) { border-bottom-right-radius: 0; border-bottom-left-radius: 0 } .accordion>.card:not(:first-of-type), .btn-group-vertical>.btn-group:not(:first-child)>.btn, .btn-group-vertical>.btn:not(:first-child) { border-top-left-radius: 0; border-top-right-radius: 0 } .custom-select, .input-group-text { font-size: 1rem; line-height: 1.5; border: 1px solid #ced4da; color: #495057; font-weight: 400 } .btn-group-toggle>.btn input[type=checkbox], .btn-group-toggle>.btn input[type=radio], .btn-group-toggle>.btn-group>.btn input[type=checkbox], .btn-group-toggle>.btn-group>.btn input[type=radio] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none } .input-group { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100% } .input-group>.custom-file, .input-group>.custom-select, .input-group>.form-control, .input-group>.form-control-plaintext { position: relative; flex: 1 1 0%; min-width: 0; margin-bottom: 0 } .input-group-append .btn:focus, .input-group-prepend .btn:focus, .input-group>.custom-file .custom-file-input:focus~.custom-file-label, .input-group>.custom-select:focus, .input-group>.form-control:focus { z-index: 3 } .input-group>.custom-file .custom-file-input:focus { z-index: 4 } .buildCostSampleReportSec .buildCostSampleReportContent a.btn, .errorRequired, .housePlanFilterTabSec .housePlanCountSec, .housePlanFilterTabSec .housePlanCountSec .housePlanProductStyleFilter, .housePlanFilterTabSec .housePlanProductStyleFilterHolder, .input-group>.custom-file, .topBarSec { display: flex; align-items: center } .housePlanSliderHolder .slider-nav, .input-group-append, .input-group-prepend, .makeUniqueSec .uniquePlanBlockSec, .productBrowseSlider .slick-track, .slider-for .slick-track, .testimonialSec .testimonialSlideSec .slick-track { display: flex } .input-group-append .btn, .input-group-prepend .btn { position: relative; z-index: 2 } .input-group-prepend { margin-right: -1px } .input-group-text { display: flex; align-items: center; padding: .375rem .75rem; margin-bottom: 0; text-align: center; background-color: #e9ecef; border-radius: .25rem } .blogContentHolder, .featureStyleMenu .mega-menu, .nav, .navbar { flex-wrap: wrap } .input-group-sm>.custom-select, .input-group-sm>.form-control:not(textarea) { height: calc(1.5em + .5rem + 2px) } .custom-control-label::after, .custom-control-label::before { top: .25rem; left: -1.5rem; display: block; height: 1rem; content: ""; width: 1rem } .input-group-lg>.custom-select, .input-group-sm>.custom-select { padding-right: 1.75rem } .custom-control { position: relative; display: block; min-height: 1.5rem; padding-left: 1.5rem } .custom-control-inline { display: inline-flex; margin-right: 1rem } .custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; height: 1.25rem; opacity: 0 } .custom-control-input:checked~.custom-control-label::before { color: #fff; border-color: #007bff; background-color: #007bff } .custom-control-input:focus:not(:checked)~.custom-control-label::before { border-color: #80bdff } .custom-control-input:not(:disabled):active~.custom-control-label::before { color: #fff; background-color: #b3d7ff; border-color: #b3d7ff } .custom-control-input:disabled~.custom-control-label::before, .custom-control-input[disabled]~.custom-control-label::before, .custom-file-input:disabled~.custom-file-label, .custom-file-input[disabled]~.custom-file-label { background-color: #e9ecef } .custom-control-label { position: relative; margin-bottom: 0; vertical-align: top } .custom-select, .navbar-toggler-icon, audio, canvas, iframe, img, svg, video { vertical-align: middle } .custom-control-label::before { position: absolute; pointer-events: none; background-color: #fff; border: 1px solid #adb5bd } .custom-checkbox .custom-control-label::before, .custom-select, .nav-pills .nav-link { border-radius: .25rem } .custom-file-input:focus~.custom-file-label, .custom-select:focus { border-color: #80bdff; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25) } .custom-control-label::after { position: absolute; background: 50%/50% 50% no-repeat } .custom-checkbox .custom-control-input:checked~.custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e") } .custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before { border-color: #007bff; background-color: #007bff } .custom-checkbox .custom-control-input:indeterminate~.custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e") } .custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label::before { background-color: rgba(0, 123, 255, .5) } .custom-radio .custom-control-label::before { border-radius: 50% } .custom-radio .custom-control-input:checked~.custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") } .custom-switch { padding-left: 2.25rem } .custom-switch .custom-control-label::before { left: -2.25rem; width: 1.75rem; pointer-events: all; border-radius: .5rem } .custom-switch .custom-control-label::after { top: calc(.25rem + 2px); left: calc(-2.25rem + 2px); width: calc(1rem - 4px); height: calc(1rem - 4px); background-color: #adb5bd; border-radius: .5rem; transition: transform .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .custom-switch .custom-control-input:checked~.custom-control-label::after { background-color: #fff; transform: translateX(.75rem) } .custom-select { display: inline-block; width: 100%; height: calc(1.5em + .75rem + 2px); padding: .375rem 1.75rem .375rem .75rem; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") right .75rem center/8px 10px no-repeat #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none } .custom-select:focus::-ms-value { color: #495057; background-color: #fff } .custom-select[multiple], .custom-select[size]:not([size="1"]) { height: auto; padding-right: .75rem; background-image: none } .custom-select:disabled { color: #6c757d; background-color: #e9ecef } .custom-select::-ms-expand { display: none } .custom-select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057 } .custom-select-sm { height: calc(1.5em + .5rem + 2px); padding-top: .25rem; padding-bottom: .25rem; padding-left: .5rem; font-size: .875rem } .custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: .5rem; padding-bottom: .5rem; padding-left: 1rem; font-size: 1.25rem } .custom-file, .custom-file-input, .custom-file-label { height: calc(1.5em + .75rem + 2px) } .custom-file-label, .custom-file-label::after { padding: .375rem .75rem; color: #495057; top: 0; line-height: 1.5; right: 0 } .custom-file { position: relative; display: inline-block; width: 100%; margin-bottom: 0 } .custom-file-input { position: relative; z-index: 2; width: 100%; margin: 0; opacity: 0 } .custom-file-input:lang(en)~.custom-file-label::after { content: "Browse" } .custom-file-input~.custom-file-label[data-browse]::after { content: attr(data-browse) } .custom-file-label { position: absolute; left: 0; z-index: 1; font-weight: 400; background-color: #fff; border: 1px solid #ced4da; border-radius: .25rem } .custom-file-label::after { position: absolute; bottom: 0; z-index: 3; display: block; height: calc(1.5em + .75rem); content: "Browse"; background-color: #e9ecef; border-left: inherit; border-radius: 0 .25rem .25rem 0 } .custom-range { width: 100%; height: 1.4rem; padding: 0; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none } .custom-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 .2rem rgba(0, 123, 255, .25) } .custom-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 .2rem rgba(0, 123, 255, .25) } .custom-range:focus::-ms-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 .2rem rgba(0, 123, 255, .25) } .custom-range::-moz-focus-outer { border: 0 } .custom-range::-webkit-slider-thumb { width: 1rem; height: 1rem; margin-top: -.25rem; background-color: #007bff; border: 0; border-radius: 1rem; -webkit-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; -webkit-appearance: none; appearance: none } .custom-range::-webkit-slider-thumb:active { background-color: #b3d7ff } .custom-range::-webkit-slider-runnable-track { width: 100%; height: .5rem; color: transparent; cursor: pointer; background-color: #dee2e6; border-color: transparent; border-radius: 1rem } .custom-range::-moz-range-thumb { width: 1rem; height: 1rem; background-color: #007bff; border: 0; border-radius: 1rem; -moz-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; -moz-appearance: none; appearance: none } .custom-range::-moz-range-thumb:active { background-color: #b3d7ff } .custom-range::-moz-range-track { width: 100%; height: .5rem; color: transparent; cursor: pointer; background-color: #dee2e6; border-color: transparent; border-radius: 1rem } .custom-range::-ms-thumb { width: 1rem; height: 1rem; margin-top: 0; margin-right: .2rem; margin-left: .2rem; background-color: #007bff; border: 0; border-radius: 1rem; -ms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; appearance: none } .custom-range::-ms-thumb:active { background-color: #b3d7ff } .custom-range::-ms-track { width: 100%; height: .5rem; color: transparent; cursor: pointer; background-color: transparent; border-color: transparent; border-width: .5rem } .custom-range::-ms-fill-lower { background-color: #dee2e6; border-radius: 1rem } .custom-range::-ms-fill-upper { margin-right: 15px; background-color: #dee2e6; border-radius: 1rem } .custom-range:disabled::-webkit-slider-thumb { background-color: #adb5bd } .custom-range:disabled::-webkit-slider-runnable-track { cursor: default } .custom-range:disabled::-moz-range-thumb { background-color: #adb5bd } .custom-range:disabled::-moz-range-track { cursor: default } .custom-range:disabled::-ms-thumb { background-color: #adb5bd } .custom-control-label::before, .custom-file-label, .custom-select { transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .badge, .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a { transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .nav { display: flex; padding-left: 0; margin-bottom: 0; list-style: none } .nav-link, .navbar { padding: .5rem 1rem } .nav-link.disabled { color: #6c757d; pointer-events: none; cursor: default } .nav-tabs { border-bottom: 1px solid #dee2e6 } .nav-tabs .nav-item { margin-bottom: -1px } .nav-tabs .nav-link { border: 1px solid transparent; border-top-left-radius: .25rem; border-top-right-radius: .25rem } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: #e9ecef #e9ecef #dee2e6 } .nav-tabs .nav-link.disabled { color: #6c757d; background-color: transparent; border-color: transparent } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { color: #495057; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff } .nav-tabs .dropdown-menu { margin-top: -1px; border-top-left-radius: 0; border-top-right-radius: 0 } .badge-primary, .nav-pills .nav-link.active, .nav-pills .show>.nav-link { color: #fff; background-color: #007bff } .animated-label-field .form-control:not([disabled=disabled]), .animated-label-field .form-control:not([readonly=readonly]), .navbar-toggler, button.close { background-color: transparent } .nav-fill .nav-item { flex: 1 1 auto; text-align: center } .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center } #additional-options, #example-basic .wizard-buttons, .badge:empty, .banner.bannerBlank:after, .headerSearchWithoutDropdown, .hide, .housePlanDetailPageContentHolder ul.dropdown-menu, .housePlanDetailPageContentHolder ul.faq li:after, .housePlanDetailPageContentHolder ul.foundation li:after, .housePlanDetailTitleHolder.xs-sp, .instantCostBuildFaqSec .faqSec .card .card-header .btn::before, .multiselect.dropdown-toggle:after, .navbar .filterTrigger, .navbar-collapse .topSearchSec, .navbar-expand .navbar-toggler, .orderCostBuildSec .wizard .content .title, .orderCostBuildSec .wizard .steps ul li a .current-info, .orderCostBuildSec .wizard .steps ul li a .number, .orderCostBuildSec .wizard .steps ul li:first-child::before, .orderCostBuildSec .wizard .wizardBody, .popover-header:empty, .productBox .productBlock .productTopIconHolder>a.active .far, .productBox .productBlock .productTopIconHolder>a:not(.active) .fas, .slick-arrow.slick-hidden, .slick-slide.slick-loading img, .tab-content>.tab-pane, .toast.hide, .topBarRightInfoSec ul li a.active i .far, .topBarRightInfoSec ul li a:not(.active) i .fas, .update-banner-slider.sliderSec .mainSlider .slick-next.slick-arrow i, .update-banner-slider.sliderSec .mainSlider .slick-prev.slick-arrow i { display: none } .navbar { display: flex; align-items: center; justify-content: space-between } .navbar .container, .navbar .container-fluid, .navbar .container-lg, .navbar .container-md, .navbar .container-sm, .navbar .container-xl { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between } .navbar-brand { display: inline-block; padding-top: .3125rem; padding-bottom: .3125rem; margin-right: 1rem; font-size: 1.25rem; line-height: inherit } .card-header-pills, .card-header-tabs { margin-right: -.625rem; margin-left: -.625rem } .navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none } .navbar-nav .dropdown-menu { position: static; float: none } .card-img-overlay, .navbar-expand .navbar-nav .dropdown-menu { position: absolute } .navbar-text { display: inline-block; padding-top: .5rem; padding-bottom: .5rem } .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center } .navbar-toggler { padding: .25rem .75rem; font-size: 1.25rem; line-height: 1; border: 1px solid transparent; border-radius: .25rem } .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; content: ""; background: center center/100% 100% no-repeat } @media (max-width:575.98px) { .table-responsive-sm { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch } .table-responsive-sm>.table-bordered { border: 0 } .navbar-expand-sm>.container, .navbar-expand-sm>.container-fluid, .navbar-expand-sm>.container-lg, .navbar-expand-sm>.container-md, .navbar-expand-sm>.container-sm, .navbar-expand-sm>.container-xl { padding-right: 0; padding-left: 0 } } @media (max-width:767.98px) { .table-responsive-md { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch } .table-responsive-md>.table-bordered { border: 0 } .navbar-expand-md>.container, .navbar-expand-md>.container-fluid, .navbar-expand-md>.container-lg, .navbar-expand-md>.container-md, .navbar-expand-md>.container-sm, .navbar-expand-md>.container-xl { padding-right: 0; padding-left: 0 } } @media (max-width:991.98px) { .table-responsive-lg { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch } .table-responsive-lg>.table-bordered { border: 0 } .navbar-expand-lg>.container, .navbar-expand-lg>.container-fluid, .navbar-expand-lg>.container-lg, .navbar-expand-lg>.container-md, .navbar-expand-lg>.container-sm, .navbar-expand-lg>.container-xl { padding-right: 0; padding-left: 0 } } @media (max-width:1199.98px) { .table-responsive-xl { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch } .table-responsive-xl>.table-bordered { border: 0 } .navbar-expand-xl>.container, .navbar-expand-xl>.container-fluid, .navbar-expand-xl>.container-lg, .navbar-expand-xl>.container-md, .navbar-expand-xl>.container-sm, .navbar-expand-xl>.container-xl { padding-right: 0; padding-left: 0 } } .navbar-expand { flex-flow: row nowrap; justify-content: flex-start } .list-group-horizontal, .navbar-expand .navbar-nav { flex-direction: row } .navbar-expand .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem } .navbar-expand>.container, .navbar-expand>.container-fluid, .navbar-expand>.container-lg, .navbar-expand>.container-md, .navbar-expand>.container-sm, .navbar-expand>.container-xl { padding-right: 0; padding-left: 0; flex-wrap: nowrap } .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-light .navbar-brand, .navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-text a, .navbar-light .navbar-text a:focus, .navbar-light .navbar-text a:hover { color: rgba(0, 0, 0, .9) } .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-text { color: rgba(0, 0, 0, .5) } .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: rgba(0, 0, 0, .7) } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, .3) } .navbar-light .navbar-toggler { color: rgba(0, 0, 0, .5); border-color: rgba(0, 0, 0, .1) } .navbar-light .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") } .navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-text { color: rgba(255, 255, 255, .5) } .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { color: rgba(255, 255, 255, .75) } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, .25) } .navbar-dark .navbar-toggler { color: rgba(255, 255, 255, .5); border-color: rgba(255, 255, 255, .1) } .navbar-dark .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") } .card { display: flex; flex-direction: column; background-color: #fff; background-clip: border-box; border: 1px solid rgba(0, 0, 0, .125); border-radius: .25rem } .card>.list-group:first-child .list-group-item:first-child, .list-group-item:first-child { border-top-left-radius: .25rem; border-top-right-radius: .25rem } .card>.list-group:last-child .list-group-item:last-child, .list-group-item:last-child { border-bottom-right-radius: .25rem; border-bottom-left-radius: .25rem } .card-body { flex: 1 1 auto; min-height: 1px; padding: 1.25rem } .card-footer, .card-header { padding: .75rem 1.25rem; background-color: rgba(0, 0, 0, .03) } .card-columns .card, .card-title, .toast:not(:last-child) { margin-bottom: .75rem } .card-subtitle { margin-top: -.375rem; margin-bottom: 0 } .card-link+.card-link { margin-left: 1.25rem } .card-header { margin-bottom: 0; border-bottom: 1px solid rgba(0, 0, 0, .125) } .card-header:first-child { border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0 } .card-header+.list-group .list-group-item:first-child, .faqSec .card:first-child, .productFilterRefineSec .accordion .card+.card { border-top: 0 } .card-footer { border-top: 1px solid rgba(0, 0, 0, .125) } .card-footer:last-child { border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px) } .card-header-tabs { margin-bottom: -.75rem; border-bottom: 0 } .card-img-overlay { top: 0; right: 0; bottom: 0; left: 0; padding: 1.25rem } .card-img, .card-img-bottom, .card-img-top { flex-shrink: 0; width: 100% } .card-img, .card-img-top { border-top-left-radius: calc(.25rem - 1px); border-top-right-radius: calc(.25rem - 1px) } .card-img, .card-img-bottom { border-bottom-right-radius: calc(.25rem - 1px); border-bottom-left-radius: calc(.25rem - 1px) } .breadcrumb, .pagination { display: flex; border-radius: .25rem; list-style: none } .card-deck .card, .card-group>.card { margin-bottom: 15px } .accordion>.card:not(:last-of-type) { border-bottom: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0 } .accordion>.card>.card-header { border-radius: 0; margin-bottom: -1px } .breadcrumb { flex-wrap: wrap; padding: .75rem 1rem; margin-bottom: 1rem; background-color: #e9ecef } .breadcrumb-item+.breadcrumb-item { padding-left: .5rem } .breadcrumb-item+.breadcrumb-item::before { display: inline-block; padding-right: .5rem; color: #6c757d; content: "/" } .pagination { padding-left: 0 } .page-link { display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; color: #007bff; background-color: #fff; border: 1px solid #dee2e6 } .badge, .close { font-weight: 700; line-height: 1 } .page-link:hover { z-index: 2; color: #0056b3; text-decoration: none; background-color: #e9ecef; border-color: #dee2e6 } .page-link:focus { z-index: 3; outline: 0; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25) } .btn-gray:focus, .btn-light.blue.focus, .btn-light.blue:focus, .btn-light.focus, .btn-light:focus, .btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .button-blue:focus, .show>.btn-light.dropdown-toggle:focus, .show>.btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(58, 123, 29, .5) } .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem } .page-item:last-child .page-link { border-top-right-radius: .25rem; border-bottom-right-radius: .25rem } .page-item.active .page-link { z-index: 3; color: #fff; background-color: #007bff; border-color: #007bff } .page-item.disabled .page-link { color: #6c757d; pointer-events: none; cursor: auto; background-color: #fff; border-color: #dee2e6 } .pagination-lg .page-link { padding: .75rem 1.5rem; font-size: 1.25rem; line-height: 1.5 } .pagination-lg .page-item:first-child .page-link { border-top-left-radius: .3rem; border-bottom-left-radius: .3rem } .pagination-lg .page-item:last-child .page-link { border-top-right-radius: .3rem; border-bottom-right-radius: .3rem } .pagination-sm .page-link { padding: .25rem .5rem; font-size: .875rem; line-height: 1.5 } .pagination-sm .page-item:first-child .page-link { border-top-left-radius: .2rem; border-bottom-left-radius: .2rem } .pagination-sm .page-item:last-child .page-link { border-top-right-radius: .2rem; border-bottom-right-radius: .2rem } .badge { display: inline-block; padding: .25em .4em; font-size: 75%; text-align: center; vertical-align: baseline; border-radius: .25rem } .spinner-border, .spinner-grow, .topSearchSec .btn i { vertical-align: text-bottom } .btn .badge { top: -1px } .badge-pill { padding-right: .6em; padding-left: .6em; border-radius: 10rem } a.badge-primary:focus, a.badge-primary:hover { color: #fff; background-color: #0062cc } a.badge-primary.focus, a.badge-primary:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5) } .badge-secondary { color: #fff; background-color: #6c757d } a.badge-secondary:focus, a.badge-secondary:hover { color: #fff; background-color: #545b62 } a.badge-secondary.focus, a.badge-secondary:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(108, 117, 125, .5) } .badge-success { color: #fff; background-color: #28a745 } a.badge-success:focus, a.badge-success:hover { color: #fff; background-color: #1e7e34 } a.badge-success.focus, a.badge-success:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .5) } .badge-info { color: #fff; background-color: #17a2b8 } a.badge-info:focus, a.badge-info:hover { color: #fff; background-color: #117a8b } a.badge-info.focus, a.badge-info:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(23, 162, 184, .5) } .badge-warning { color: #212529; background-color: #ffc107 } a.badge-warning:focus, a.badge-warning:hover { color: #212529; background-color: #d39e00 } a.badge-warning.focus, a.badge-warning:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .5) } .badge-danger { color: #fff; background-color: #dc3545 } a.badge-danger:focus, a.badge-danger:hover { color: #fff; background-color: #bd2130 } a.badge-danger.focus, a.badge-danger:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .5) } .badge-light { color: #212529; background-color: #f8f9fa } a.badge-light:focus, a.badge-light:hover { color: #212529; background-color: #dae0e5 } a.badge-light.focus, a.badge-light:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(248, 249, 250, .5) } a.badge-dark:focus, a.badge-dark:hover { color: #fff; background-color: #1d2124 } a.badge-dark.focus, a.badge-dark:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(52, 58, 64, .5) } .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; background-color: #e9ecef; border-radius: .3rem } .jumbotron-fluid { padding-right: 0; padding-left: 0; border-radius: 0 } .alert { padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem } .alert-dismissible { padding-right: 4rem } .alert-dismissible .close { position: absolute; top: 0; right: 0; padding: .75rem 1.25rem; color: inherit } .alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff } .alert-primary hr { border-top-color: #9fcdff } .alert-primary .alert-link { color: #002752 } .alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db } .alert-secondary hr { border-top-color: #c8cbcf } .alert-secondary .alert-link { color: #202326 } .alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb } .alert-success hr { border-top-color: #b1dfbb } .alert-success .alert-link { color: #0b2e13 } .alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb } .alert-info hr { border-top-color: #abdde5 } .alert-info .alert-link { color: #062c33 } .alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba } .alert-warning hr { border-top-color: #ffe8a1 } .alert-warning .alert-link { color: #533f03 } .alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb } .alert-danger hr { border-top-color: #f1b0b7 } .alert-danger .alert-link { color: #491217 } .alert-light { color: #818182; background-color: #fefefe; border-color: #fdfdfe } .alert-light hr { border-top-color: #ececf6 } .alert-light .alert-link { color: #686868 } .alert-dark { color: #1b1e21; background-color: #d6d8d9; border-color: #c6c8ca } .alert-dark hr { border-top-color: #b9bbbe } .alert-dark .alert-link { color: #040505 } @-webkit-keyframes progress-bar-stripes { from { background-position: 1rem 0 } to { background-position: 0 0 } } @keyframes progress-bar-stripes { from { background-position: 1rem 0 } to { background-position: 0 0 } } .progress { display: flex; height: 1rem; font-size: .75rem; background-color: #e9ecef; border-radius: .25rem } .progress-bar { display: flex; flex-direction: column; justify-content: center; color: #fff; text-align: center; background-color: #007bff; transition: width .6s } .progress-bar-striped { background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); background-size: 1rem 1rem } .progress-bar-animated { -webkit-animation: 1s linear infinite progress-bar-stripes; animation: 1s linear infinite progress-bar-stripes } .img-col-2, .media { display: flex; align-items: flex-start } .media-body { flex: 1 } .list-group { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0 } .list-group-item-action { width: 100%; color: #495057; text-align: inherit } .list-group-item-action:focus, .list-group-item-action:hover { z-index: 1; color: #495057; text-decoration: none; background-color: #f8f9fa } .list-group-item-action:active { color: #212529; background-color: #e9ecef } .list-group-item { display: block; padding: .75rem 1.25rem; background-color: #fff; border: 1px solid rgba(0, 0, 0, .125) } .list-group-item.disabled, .list-group-item:disabled { color: #6c757d; pointer-events: none; background-color: #fff } .list-group-item.active { z-index: 2; color: #fff; background-color: #007bff; border-color: #007bff } .list-group-flush .list-group-item:first-child, .list-group-item+.list-group-item { border-top-width: 0 } .list-group-item+.list-group-item.active { margin-top: -1px; border-top-width: 1px } .list-group-horizontal .list-group-item:first-child { border-bottom-left-radius: .25rem; border-top-right-radius: 0 } .list-group-horizontal .list-group-item:last-child { border-top-right-radius: .25rem; border-bottom-left-radius: 0 } .list-group-horizontal .list-group-item+.list-group-item { border-top-width: 1px; border-left-width: 0 } .list-group-horizontal .list-group-item+.list-group-item.active { margin-left: -1px; border-left-width: 1px } .list-group-flush .list-group-item { border-right-width: 0; border-left-width: 0; border-radius: 0 } .list-group-flush:last-child .list-group-item:last-child { border-bottom-width: 0 } .list-group-item-primary { color: #004085; background-color: #b8daff } .list-group-item-primary.list-group-item-action:focus, .list-group-item-primary.list-group-item-action:hover { color: #004085; background-color: #9fcdff } .list-group-item-primary.list-group-item-action.active { color: #fff; background-color: #004085; border-color: #004085 } .list-group-item-secondary { color: #383d41; background-color: #d6d8db } .list-group-item-secondary.list-group-item-action:focus, .list-group-item-secondary.list-group-item-action:hover { color: #383d41; background-color: #c8cbcf } .list-group-item-secondary.list-group-item-action.active { color: #fff; background-color: #383d41; border-color: #383d41 } .list-group-item-success { color: #155724; background-color: #c3e6cb } .list-group-item-success.list-group-item-action:focus, .list-group-item-success.list-group-item-action:hover { color: #155724; background-color: #b1dfbb } .list-group-item-success.list-group-item-action.active { color: #fff; background-color: #155724; border-color: #155724 } .list-group-item-info { color: #0c5460; background-color: #bee5eb } .list-group-item-info.list-group-item-action:focus, .list-group-item-info.list-group-item-action:hover { color: #0c5460; background-color: #abdde5 } .list-group-item-info.list-group-item-action.active { color: #fff; background-color: #0c5460; border-color: #0c5460 } .list-group-item-warning { color: #856404; background-color: #ffeeba } .list-group-item-warning.list-group-item-action:focus, .list-group-item-warning.list-group-item-action:hover { color: #856404; background-color: #ffe8a1 } .list-group-item-warning.list-group-item-action.active { color: #fff; background-color: #856404; border-color: #856404 } .list-group-item-danger { color: #721c24; background-color: #f5c6cb } .list-group-item-danger.list-group-item-action:focus, .list-group-item-danger.list-group-item-action:hover { color: #721c24; background-color: #f1b0b7 } .list-group-item-danger.list-group-item-action.active { color: #fff; background-color: #721c24; border-color: #721c24 } .list-group-item-light { color: #818182; background-color: #fdfdfe } .list-group-item-light.list-group-item-action:focus, .list-group-item-light.list-group-item-action:hover { color: #818182; background-color: #ececf6 } .list-group-item-light.list-group-item-action.active { color: #fff; background-color: #818182; border-color: #818182 } .list-group-item-dark { color: #1b1e21; background-color: #c6c8ca } .toast, .toast-header { background-color: rgba(255, 255, 255, .85); background-clip: padding-box } .list-group-item-dark.list-group-item-action:focus, .list-group-item-dark.list-group-item-action:hover { color: #1b1e21; background-color: #b9bbbe } .list-group-item-dark.list-group-item-action.active { color: #fff; background-color: #1b1e21; border-color: #1b1e21 } .close { float: right; font-size: 1.5rem; color: #000; text-shadow: 0 1px 0 #fff; opacity: .5 } .popover, .tooltip { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-weight: 400; text-transform: none; letter-spacing: normal; word-break: normal; word-spacing: normal; line-break: auto; white-space: normal; font-style: normal; text-decoration: none } .modal-title, .popover, .tooltip { line-height: 1.5 } .popover, .text-hide, .tooltip { text-shadow: none } .toast, .tooltip { opacity: 0; font-size: .875rem } .close:hover { color: #000; text-decoration: none } .close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover { opacity: .75 } button.close { padding: 0; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none } .toast { max-width: 350px; border: 1px solid rgba(0, 0, 0, .1); box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .1); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: .25rem } .carousel-indicators .active, .housePlanSliderHolder .pgwSlideshow .ps-list li .ps-item, .toast.showing { opacity: 1 } .toast.show { display: block; opacity: 1 } .toast-header { display: flex; align-items: center; padding: .25rem .75rem; color: #6c757d; border-bottom: 1px solid rgba(0, 0, 0, .05) } .animated-label-field textarea.form-control, .toast-body { padding: .75rem } .modal-open .modal { overflow-x: hidden; overflow-y: auto } .modal { position: fixed; top: 0; left: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0 } .modal-dialog { position: relative; width: auto; margin: .5rem; pointer-events: none } .modal.fade .modal-dialog { transition: transform .3s ease-out; transform: translate(0, -50px) } .modal.show .modal-dialog { transform: none } .modal.modal-static .modal-dialog { transform: scale(1.02) } .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem) } .modal-dialog-scrollable .modal-content { max-height: calc(100vh - 1rem); overflow: hidden } .modal-dialog-scrollable .modal-footer, .modal-dialog-scrollable .modal-header { flex-shrink: 0 } .modal-dialog-scrollable .modal-body { overflow-y: auto } .modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 1rem) } .modal-dialog-centered::before { display: block; height: calc(100vh - 1rem); content: "" } .modal-dialog-centered.modal-dialog-scrollable { flex-direction: column; justify-content: center; height: 100% } .modal-dialog-centered.modal-dialog-scrollable .modal-content { max-height: none } .modal-dialog-centered.modal-dialog-scrollable::before, .purchase-option-wrapper .dropdown-menu li:after { content: none } .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); border-radius: .3rem; outline: 0 } .modal-backdrop { position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000 } .modal-backdrop.show { opacity: .5 } .modal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 1rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: calc(.3rem - 1px); border-top-right-radius: calc(.3rem - 1px) } .modal-header .close { padding: 1rem; margin: -1rem -1rem -1rem auto } .modal-body { position: relative; flex: 1 1 auto; padding: 1rem } .modal-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; padding: .75rem; border-top: 1px solid #dee2e6; border-bottom-right-radius: calc(.3rem - 1px); border-bottom-left-radius: calc(.3rem - 1px) } .modal-footer>* { margin: .25rem } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll } @media (min-width:992px) { .container, .container-lg, .container-md, .container-sm { max-width: 960px } .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-lg-12, .row-cols-lg-1>* { flex: 0 0 100%; max-width: 100% } .col-lg-6, .row-cols-lg-2>* { flex: 0 0 50%; max-width: 50% } .col-lg-4, .row-cols-lg-3>* { flex: 0 0 33.333333%; max-width: 33.333333% } .col-lg-3, .row-cols-lg-4>* { flex: 0 0 25%; max-width: 25% } .row-cols-lg-5>* { flex: 0 0 20%; max-width: 20% } .col-lg-2, .row-cols-lg-6>* { flex: 0 0 16.666667%; max-width: 16.666667% } .col-lg-auto { flex: 0 0 auto; width: auto; max-width: 100% } .col-lg-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .col-lg-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .col-lg-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .col-lg-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .col-lg-9 { flex: 0 0 75%; max-width: 75% } .col-lg-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .col-lg-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .order-lg-first { order: -1 } .order-lg-last { order: 13 } .order-lg-0 { order: 0 } .order-lg-1 { order: 1 } .order-lg-2 { order: 2 } .order-lg-3 { order: 3 } .order-lg-4 { order: 4 } .order-lg-5 { order: 5 } .order-lg-6 { order: 6 } .order-lg-7 { order: 7 } .order-lg-8 { order: 8 } .order-lg-9 { order: 9 } .order-lg-10 { order: 10 } .order-lg-11 { order: 11 } .order-lg-12 { order: 12 } .offset-lg-0 { margin-left: 0 } .offset-lg-1 { margin-left: 8.333333% } .offset-lg-2 { margin-left: 16.666667% } .offset-lg-3 { margin-left: 25% } .offset-lg-4 { margin-left: 33.333333% } .offset-lg-5 { margin-left: 41.666667% } .offset-lg-6 { margin-left: 50% } .offset-lg-7 { margin-left: 58.333333% } .offset-lg-8 { margin-left: 66.666667% } .offset-lg-9 { margin-left: 75% } .offset-lg-10 { margin-left: 83.333333% } .offset-lg-11 { margin-left: 91.666667% } .dropdown-menu-lg-left { right: auto; left: 0 } .dropdown-menu-lg-right { right: 0; left: auto } .list-group-horizontal-lg .list-group-item:first-child { border-bottom-left-radius: .25rem; border-top-right-radius: 0 } .list-group-horizontal-lg .list-group-item:last-child { border-top-right-radius: .25rem; border-bottom-left-radius: 0 } .list-group-horizontal-lg .list-group-item.active { margin-top: 0 } .list-group-horizontal-lg .list-group-item+.list-group-item { border-top-width: 1px; border-left-width: 0 } .list-group-horizontal-lg .list-group-item+.list-group-item.active { margin-left: -1px; border-left-width: 1px } .modal-lg, .modal-xl { max-width: 800px } .d-lg-none { display: none !important } .d-lg-inline { display: inline !important } .d-lg-inline-block { display: inline-block !important } .d-lg-block { display: block !important } .d-lg-table { display: table !important } .d-lg-table-row { display: table-row !important } .d-lg-table-cell { display: table-cell !important } .d-lg-flex { display: flex !important } .d-lg-inline-flex { display: inline-flex !important } } .tooltip { position: absolute; z-index: 1070; display: block; margin: 0; text-align: left; text-align: start } .tooltip.show { opacity: .9 } .tooltip .arrow { position: absolute; display: block; width: .8rem; height: .4rem } .tooltip .arrow::before { position: absolute; content: ""; border-color: transparent; border-style: solid } .bs-tooltip-auto[x-placement^=bottom], .bs-tooltip-auto[x-placement^=top], .bs-tooltip-bottom, .bs-tooltip-top { padding: .4rem 0 } .bs-tooltip-auto[x-placement^=top] .arrow, .bs-tooltip-top .arrow { bottom: 0 } .bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before { top: 0; border-width: .4rem .4rem 0; border-top-color: #000 } .bs-tooltip-auto[x-placement^=left], .bs-tooltip-auto[x-placement^=right], .bs-tooltip-left, .bs-tooltip-right { padding: 0 .4rem } .bs-tooltip-auto[x-placement^=right] .arrow, .bs-tooltip-right .arrow { left: 0; width: .4rem; height: .8rem } .bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before { right: 0; border-width: .4rem .4rem .4rem 0; border-right-color: #000 } .bs-tooltip-auto[x-placement^=bottom] .arrow, .bs-tooltip-bottom .arrow, .orderCostBuildSec .wizard .steps ul li.i-empty.active:after, .orderCostBuildSec .wizard .steps ul li.i-empty.current:after { top: 0 } .bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before { bottom: 0; border-width: 0 .4rem .4rem; border-bottom-color: #000 } .bs-tooltip-auto[x-placement^=left] .arrow, .bs-tooltip-left .arrow { right: 0; width: .4rem; height: .8rem } .bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before { left: 0; border-width: .4rem 0 .4rem .4rem; border-left-color: #000 } .tooltip-inner { max-width: 200px; padding: .25rem .5rem; color: #fff; text-align: center; background-color: #000; border-radius: .25rem } .carousel-indicators li, .popover { background-color: #fff; background-clip: padding-box } .popover { position: absolute; top: 0; left: 0; z-index: 1060; display: block; max-width: 276px; text-align: left; text-align: start; font-size: .875rem; border: 1px solid rgba(0, 0, 0, .2); border-radius: .3rem } .popover .arrow { position: absolute; display: block; width: 1rem; height: .5rem; margin: 0 .3rem } .popover .arrow::after, .popover .arrow::before { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid } .bs-popover-auto[x-placement^=top]>.arrow, .bs-popover-top>.arrow { bottom: calc(-.5rem - 1px) } .bs-popover-auto[x-placement^=top]>.arrow::before, .bs-popover-top>.arrow::before { bottom: 0; border-width: .5rem .5rem 0; border-top-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=top]>.arrow::after, .bs-popover-top>.arrow::after { bottom: 1px; border-width: .5rem .5rem 0; border-top-color: #fff } .bs-popover-auto[x-placement^=right], .bs-popover-right { margin-left: .5rem } .bs-popover-auto[x-placement^=right]>.arrow, .bs-popover-right>.arrow { left: calc(-.5rem - 1px); width: .5rem; height: 1rem; margin: .3rem 0 } .bs-popover-auto[x-placement^=right]>.arrow::before, .bs-popover-right>.arrow::before { left: 0; border-width: .5rem .5rem .5rem 0; border-right-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=right]>.arrow::after, .bs-popover-right>.arrow::after { left: 1px; border-width: .5rem .5rem .5rem 0; border-right-color: #fff } .bs-popover-auto[x-placement^=bottom]>.arrow, .bs-popover-bottom>.arrow { top: calc(-.5rem - 1px) } .bs-popover-auto[x-placement^=bottom]>.arrow::before, .bs-popover-bottom>.arrow::before { top: 0; border-width: 0 .5rem .5rem; border-bottom-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=bottom]>.arrow::after, .bs-popover-bottom>.arrow::after { top: 1px; border-width: 0 .5rem .5rem; border-bottom-color: #fff } .bs-popover-auto[x-placement^=bottom] .popover-header::before, .bs-popover-bottom .popover-header::before { position: absolute; top: 0; left: 50%; display: block; width: 1rem; margin-left: -.5rem; content: ""; border-bottom: 1px solid #f7f7f7 } .bs-popover-auto[x-placement^=left]>.arrow, .bs-popover-left>.arrow { right: calc(-.5rem - 1px); width: .5rem; height: 1rem; margin: .3rem 0 } .bs-popover-auto[x-placement^=left]>.arrow::before, .bs-popover-left>.arrow::before { right: 0; border-width: .5rem 0 .5rem .5rem; border-left-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=left]>.arrow::after, .bs-popover-left>.arrow::after { right: 1px; border-width: .5rem 0 .5rem .5rem; border-left-color: #fff } .popover-header { padding: .5rem .75rem; margin-bottom: 0; font-size: 1rem; background-color: #f7f7f7; border-bottom: 1px solid #ebebeb; border-top-left-radius: calc(.3rem - 1px); border-top-right-radius: calc(.3rem - 1px) } .popover-body { padding: .5rem .75rem; color: #212529 } .carousel-inner { position: relative; width: 100%; overflow: hidden } .carousel-inner::after, .clearfix::after, .detailContentList:after { display: block; clear: both; content: "" } .carousel-item { position: relative; display: none; float: left; width: 100%; margin-right: -100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: transform .6s ease-in-out } .active.carousel-item-right, .carousel-item-next:not(.carousel-item-left) { transform: translateX(100%) } .active.carousel-item-left, .carousel-item-prev:not(.carousel-item-right) { transform: translateX(-100%) } .carousel-fade .carousel-item { opacity: 0; transition-property: opacity; transform: none } .carousel-fade .carousel-item-next.carousel-item-left, .carousel-fade .carousel-item-prev.carousel-item-right, .carousel-fade .carousel-item.active { z-index: 1; opacity: 1 } .carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-right { z-index: 0; opacity: 0; transition: opacity 0s .6s } .carousel-control-next, .carousel-control-prev { position: absolute; top: 0; bottom: 0; z-index: 1; display: flex; align-items: center; justify-content: center; width: 15%; color: #fff; text-align: center; opacity: .5; transition: opacity .15s } .carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover { color: #fff; text-decoration: none; outline: 0; opacity: .9 } .carousel-control-prev, .housePlanSliderHolder .pgwSlideshow .ps-list:after, .slider-for .slick-arrow.slick-prev { left: 0 } .carousel-control-next, .housePlanSliderHolder .pgwSlideshow .ps-list::before, .slider-for .slick-arrow.slick-next, .testimonialSec .testimonialSlideSec .slick-arrow.slick-next { right: 0 } .carousel-control-next-icon, .carousel-control-prev-icon { display: inline-block; width: 20px; height: 20px; background: 50%/100% 100% no-repeat } .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e") } .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e") } .carousel-indicators { position: absolute; right: 0; bottom: 0; left: 0; z-index: 15; display: flex; justify-content: center; padding-left: 0; margin-right: 15%; margin-left: 15%; list-style: none } .carousel-indicators li { box-sizing: content-box; flex: 0 1 auto; width: 30px; height: 3px; margin-right: 3px; margin-left: 3px; text-indent: -999px; cursor: pointer; border-top: 10px solid transparent; border-bottom: 10px solid transparent; opacity: .5; transition: opacity .6s } @media (prefers-reduced-motion:reduce) { .badge, .btn, .carousel-control-next, .carousel-control-prev, .carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-right, .carousel-indicators li, .carousel-item, .collapsing, .custom-control-label::before, .custom-file-label, .custom-select, .custom-switch .custom-control-label::after, .fade, .form-control, .modal.fade .modal-dialog, .progress-bar { transition: none } .custom-range::-webkit-slider-thumb { -webkit-transition: none; transition: none } .custom-range::-moz-range-thumb { -moz-transition: none; transition: none } .custom-range::-ms-thumb { -ms-transition: none; transition: none } .progress-bar-animated { -webkit-animation: none; animation: none } } .carousel-caption { position: absolute; right: 15%; bottom: 20px; left: 15%; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: center } @-webkit-keyframes spinner-border { to { transform: rotate(360deg) } } @keyframes spinner-border { to { transform: rotate(360deg) } } .spinner-border { display: inline-block; width: 2rem; height: 2rem; border: .25em solid currentColor; border-right-color: transparent; border-radius: 50%; -webkit-animation: .75s linear infinite spinner-border; animation: .75s linear infinite spinner-border } .spinner-border-sm { width: 1rem; height: 1rem; border-width: .2em } @-webkit-keyframes spinner-grow { 0% { transform: scale(0) } 50% { opacity: 1 } } @keyframes spinner-grow { 0% { transform: scale(0) } 50% { opacity: 1 } } .spinner-grow { display: inline-block; width: 2rem; height: 2rem; background-color: currentColor; border-radius: 50%; opacity: 0; -webkit-animation: .75s linear infinite spinner-grow; animation: .75s linear infinite spinner-grow } .spinner-grow-sm { width: 1rem; height: 1rem } .align-baseline { vertical-align: baseline !important } .align-top { vertical-align: top !important } .align-middle { vertical-align: middle !important } .align-bottom { vertical-align: bottom !important } .align-text-bottom { vertical-align: text-bottom !important } .align-text-top { vertical-align: text-top !important } .bg-primary { background-color: #007bff !important } a.bg-primary:focus, a.bg-primary:hover, button.bg-primary:focus, button.bg-primary:hover { background-color: #0062cc !important } .bg-secondary { background-color: #6c757d !important } a.bg-secondary:focus, a.bg-secondary:hover, button.bg-secondary:focus, button.bg-secondary:hover { background-color: #545b62 !important } .bg-success { background-color: #28a745 !important } a.bg-success:focus, a.bg-success:hover, button.bg-success:focus, button.bg-success:hover { background-color: #1e7e34 !important } .bg-info { background-color: #17a2b8 !important } a.bg-info:focus, a.bg-info:hover, button.bg-info:focus, button.bg-info:hover { background-color: #117a8b !important } .bg-warning { background-color: #ffc107 !important } a.bg-warning:focus, a.bg-warning:hover, button.bg-warning:focus, button.bg-warning:hover { background-color: #d39e00 !important } .bg-danger { background-color: #dc3545 !important } a.bg-danger:focus, a.bg-danger:hover, button.bg-danger:focus, button.bg-danger:hover { background-color: #bd2130 !important } .bg-light { background-color: #f8f9fa !important } a.bg-light:focus, a.bg-light:hover, button.bg-light:focus, button.bg-light:hover { background-color: #dae0e5 !important } .bg-dark { background-color: #343a40 !important } a.bg-dark:focus, a.bg-dark:hover, button.bg-dark:focus, button.bg-dark:hover { background-color: #1d2124 !important } .bg-white { background-color: #fff !important } .bg-transparent { background-color: transparent !important } .border { border: 1px solid #dee2e6 !important } .border-top { border-top: 1px solid #dee2e6 !important } .border-right { border-right: 1px solid #dee2e6 !important } .border-bottom { border-bottom: 1px solid #dee2e6 !important } .border-left { border-left: 1px solid #dee2e6 !important } .b-0, .border-0 { border: 0 !important } .border-top-0 { border-top: 0 !important } .border-right-0 { border-right: 0 !important } .border-bottom-0 { border-bottom: 0 !important } .border-left-0 { border-left: 0 !important } .border-primary { border-color: #007bff !important } .border-secondary { border-color: #6c757d !important } .border-success { border-color: #28a745 !important } .border-info { border-color: #17a2b8 !important } .border-warning { border-color: #ffc107 !important } .border-danger { border-color: #dc3545 !important } .border-light { border-color: #f8f9fa !important } .border-dark { border-color: #343a40 !important } .border-white { border-color: #fff !important } .rounded-sm { border-radius: .2rem !important } .rounded-right, .rounded-top { border-top-right-radius: .25rem !important } .rounded-bottom, .rounded-right { border-bottom-right-radius: .25rem !important } .rounded-left, .rounded-top { border-top-left-radius: .25rem !important } .rounded-bottom, .rounded-left { border-bottom-left-radius: .25rem !important } .rounded { border-radius: .25rem !important } .rounded-lg { border-radius: .3rem !important } .rounded-circle { border-radius: 50% !important } .rounded-pill { border-radius: 50rem !important } .rounded-0 { border-radius: 0 !important } .d-inline { display: inline !important } .d-inline-block { display: inline-block !important } .d-block { display: block !important } .d-table { display: table !important } .d-table-row { display: table-row !important } .d-table-cell { display: table-cell !important } .d-flex { display: flex !important } .d-inline-flex { display: inline-flex !important } .embed-responsive { position: relative; display: block; width: 100%; padding: 0; overflow: hidden } .embed-responsive::before { display: block; content: "" } .embed-responsive .embed-responsive-item, .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0 } .embed-responsive-21by9::before { padding-top: 42.857143% } .embed-responsive-16by9::before { padding-top: 56.25% } .embed-responsive-4by3::before { padding-top: 75% } .embed-responsive-1by1::before { padding-top: 100% } .flex-row { flex-direction: row !important } .flex-column { flex-direction: column !important } .flex-row-reverse { flex-direction: row-reverse !important } .flex-column-reverse { flex-direction: column-reverse !important } .flex-wrap { flex-wrap: wrap !important } .flex-nowrap { flex-wrap: nowrap !important } .flex-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-fill { flex: 1 1 auto !important } .flex-grow-0 { flex-grow: 0 !important } .flex-grow-1 { flex-grow: 1 !important } .flex-shrink-0 { flex-shrink: 0 !important } .flex-shrink-1 { flex-shrink: 1 !important } .justify-content-start { justify-content: flex-start !important } .justify-content-end { justify-content: flex-end !important } .justify-content-center { justify-content: center !important } .justify-content-between { justify-content: space-between !important } .justify-content-around { justify-content: space-around !important } .align-items-start { align-items: flex-start !important } .align-items-end { align-items: flex-end !important } .align-items-center { align-items: center !important } .align-items-baseline { align-items: baseline !important } .align-items-stretch { align-items: stretch !important } .align-content-start { align-content: flex-start !important } .align-content-end { align-content: flex-end !important } .align-content-center { align-content: center !important } .align-content-between { align-content: space-between !important } .align-content-around { align-content: space-around !important } .align-content-stretch { align-content: stretch !important } .align-self-auto { align-self: auto !important } .align-self-start { align-self: flex-start !important } .align-self-end { align-self: flex-end !important } .align-self-center { align-self: center !important } .align-self-baseline { align-self: baseline !important } .align-self-stretch { align-self: stretch !important } .float-left, .pull-left { float: left !important } .float-right, .pull-right { float: right !important } .float-none { float: none !important } .overflow-auto { overflow: auto !important } .overflow-hidden { overflow: hidden !important } .position-static { position: static !important } .position-relative { position: relative !important } .position-absolute { position: absolute !important } .position-fixed { position: fixed !important } .position-sticky { position: sticky !important } .fixed-bottom, .fixed-top, header.fixHeader { position: fixed; right: 0 } .fixed-top { top: 0; left: 0; z-index: 1030 } .fixed-bottom { bottom: 0; left: 0; z-index: 1030 } @supports (position:sticky) { .sticky-top { position: sticky; top: 0; z-index: 1020 } } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal } .shadow-sm { box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important } .shadow { box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important } .shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important } .shadow-none { box-shadow: none !important } .w-25 { width: 25% !important } .w-50 { width: 50% !important } .w-75 { width: 75% !important } .w-100 { width: 100% !important } .w-auto { width: auto !important } .h-25 { height: 25% !important } .h-50 { height: 50% !important } .h-75 { height: 75% !important } .h-100 { height: 100% !important } .h-auto { height: auto !important } .mw-100 { max-width: 100% !important } .mh-100 { max-height: 100% !important } .min-vw-100 { min-width: 100vw !important } .min-vh-100 { min-height: 100vh !important } .vw-100 { width: 100vw !important } .vh-100 { height: 100vh !important } .stretched-link::after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; pointer-events: auto; content: ""; background-color: rgba(0, 0, 0, 0) } .housePlanSliderHolder .pgwSlideshow .ps-list ul, .m-0 { margin: 0 !important } .mt-0, .my-0 { margin-top: 0 !important } .mr-0, .mx-0 { margin-right: 0 !important } .mb-0, .my-0 { margin-bottom: 0 !important } .ml-0, .mx-0 { margin-left: 0 !important } .m-1 { margin: .25rem !important } .mt-1, .my-1 { margin-top: .25rem !important } .mr-1, .mx-1 { margin-right: .25rem !important } .mb-1, .my-1 { margin-bottom: .25rem !important } .ml-1, .mx-1 { margin-left: .25rem !important } .m-2 { margin: .5rem !important } .mt-2, .my-2 { margin-top: .5rem !important } .mr-2, .mx-2 { margin-right: .5rem !important } .mb-2, .my-2 { margin-bottom: .5rem !important } .ml-2, .mx-2 { margin-left: .5rem !important } .m-3 { margin: 1rem !important } .mt-3, .my-3 { margin-top: 1rem !important } .mr-3, .mx-3 { margin-right: 1rem !important } .mb-3, .my-3 { margin-bottom: 1rem !important } .ml-3, .mx-3 { margin-left: 1rem !important } .m-4 { margin: 1.5rem !important } .mt-4, .my-4 { margin-top: 1.5rem !important } .mr-4, .mx-4 { margin-right: 1.5rem !important } .mb-4, .my-4 { margin-bottom: 1.5rem !important } .ml-4, .mx-4 { margin-left: 1.5rem !important } .m-5 { margin: 3rem !important } .mt-5, .my-5 { margin-top: 3rem !important } .mr-5, .mx-5 { margin-right: 3rem !important } .mb-5, .my-5 { margin-bottom: 3rem !important } .ml-5, .mx-5 { margin-left: 3rem !important } .p-0 { padding: 0 !important } .pt-0, .py-0 { padding-top: 0 !important } .pr-0, .px-0 { padding-right: 0 !important } .pb-0, .py-0 { padding-bottom: 0 !important } .pl-0, .px-0 { padding-left: 0 !important } .p-1 { padding: .25rem !important } .pt-1, .py-1 { padding-top: .25rem !important } .pr-1, .px-1 { padding-right: .25rem !important } .pb-1, .py-1 { padding-bottom: .25rem !important } .pl-1, .px-1 { padding-left: .25rem !important } .p-2 { padding: .5rem !important } .pt-2, .py-2 { padding-top: .5rem !important } .pr-2, .px-2 { padding-right: .5rem !important } .pb-2, .py-2 { padding-bottom: .5rem !important } .pl-2, .px-2 { padding-left: .5rem !important } .p-3 { padding: 1rem !important } .pt-3, .py-3 { padding-top: 1rem !important } .pr-3, .px-3 { padding-right: 1rem !important } .pb-3, .py-3 { padding-bottom: 1rem !important } .pl-3, .px-3 { padding-left: 1rem !important } .p-4 { padding: 1.5rem !important } .pt-4, .py-4 { padding-top: 1.5rem !important } .pr-4, .px-4 { padding-right: 1.5rem !important } .pb-4, .py-4 { padding-bottom: 1.5rem !important } .pl-4, .px-4 { padding-left: 1.5rem !important } .p-5 { padding: 3rem !important } .pt-5, .py-5 { padding-top: 3rem !important } .pr-5, .px-5 { padding-right: 3rem !important } .pb-5, .py-5 { padding-bottom: 3rem !important } .pl-5, .px-5 { padding-left: 3rem !important } .m-n1 { margin: -.25rem !important } .mt-n1, .my-n1 { margin-top: -.25rem !important } .mr-n1, .mx-n1 { margin-right: -.25rem !important } .mb-n1, .my-n1 { margin-bottom: -.25rem !important } .ml-n1, .mx-n1 { margin-left: -.25rem !important } .m-n2 { margin: -.5rem !important } .mt-n2, .my-n2 { margin-top: -.5rem !important } .mr-n2, .mx-n2 { margin-right: -.5rem !important } .mb-n2, .my-n2 { margin-bottom: -.5rem !important } .ml-n2, .mx-n2 { margin-left: -.5rem !important } .m-n3 { margin: -1rem !important } .mt-n3, .my-n3 { margin-top: -1rem !important } .mr-n3, .mx-n3 { margin-right: -1rem !important } .mb-n3, .my-n3 { margin-bottom: -1rem !important } .ml-n3, .mx-n3 { margin-left: -1rem !important } .m-n4 { margin: -1.5rem !important } .mt-n4, .my-n4 { margin-top: -1.5rem !important } .mr-n4, .mx-n4 { margin-right: -1.5rem !important } .mb-n4, .my-n4 { margin-bottom: -1.5rem !important } .ml-n4, .mx-n4 { margin-left: -1.5rem !important } .m-n5 { margin: -3rem !important } .mt-n5, .my-n5 { margin-top: -3rem !important } .mr-n5, .mx-n5 { margin-right: -3rem !important } .mb-n5, .my-n5 { margin-bottom: -3rem !important } .ml-n5, .mx-n5 { margin-left: -3rem !important } .m-auto { margin: auto !important } .mt-auto, .my-auto { margin-top: auto !important } .mr-auto, .mx-auto { margin-right: auto !important } .mb-auto, .my-auto { margin-bottom: auto !important } .ml-auto, .mx-auto { margin-left: auto !important } .text-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important } .text-justify { text-align: justify !important } .text-wrap { white-space: normal !important } .text-nowrap { white-space: nowrap !important } .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .text-left { text-align: left !important } .text-right { text-align: right !important } .text-center { text-align: center !important } @media (min-width:576px) { .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-sm-12, .row-cols-sm-1>* { flex: 0 0 100%; max-width: 100% } .col-sm-6, .row-cols-sm-2>* { flex: 0 0 50%; max-width: 50% } .col-sm-4, .row-cols-sm-3>* { flex: 0 0 33.333333%; max-width: 33.333333% } .col-sm-3, .row-cols-sm-4>* { flex: 0 0 25%; max-width: 25% } .row-cols-sm-5>* { flex: 0 0 20%; max-width: 20% } .col-sm-2, .row-cols-sm-6>* { flex: 0 0 16.666667%; max-width: 16.666667% } .col-sm-auto { flex: 0 0 auto; width: auto; max-width: 100% } .col-sm-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .col-sm-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .col-sm-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .col-sm-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .col-sm-9 { flex: 0 0 75%; max-width: 75% } .col-sm-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .col-sm-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .order-sm-first { order: -1 } .order-sm-last { order: 13 } .order-sm-0 { order: 0 } .order-sm-1 { order: 1 } .order-sm-2 { order: 2 } .order-sm-3 { order: 3 } .order-sm-4 { order: 4 } .order-sm-5 { order: 5 } .order-sm-6 { order: 6 } .order-sm-7 { order: 7 } .order-sm-8 { order: 8 } .order-sm-9 { order: 9 } .order-sm-10 { order: 10 } .order-sm-11 { order: 11 } .order-sm-12 { order: 12 } .offset-sm-0 { margin-left: 0 } .offset-sm-1 { margin-left: 8.333333% } .offset-sm-2 { margin-left: 16.666667% } .offset-sm-3 { margin-left: 25% } .offset-sm-4 { margin-left: 33.333333% } .offset-sm-5 { margin-left: 41.666667% } .offset-sm-6 { margin-left: 50% } .offset-sm-7 { margin-left: 58.333333% } .offset-sm-8 { margin-left: 66.666667% } .offset-sm-9 { margin-left: 75% } .offset-sm-10 { margin-left: 83.333333% } .offset-sm-11 { margin-left: 91.666667% } .form-inline label { display: flex; align-items: center; justify-content: center; margin-bottom: 0 } .form-inline .form-group { display: flex; flex: 0 0 auto; flex-flow: row wrap; align-items: center; margin-bottom: 0 } .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle } .form-inline .form-control-plaintext { display: inline-block } .form-inline .custom-select, .form-inline .input-group { width: auto } .form-inline .form-check { display: flex; align-items: center; justify-content: center; width: auto; padding-left: 0 } .form-inline .form-check-input { position: relative; flex-shrink: 0; margin-top: 0; margin-right: .25rem; margin-left: 0 } .form-inline .custom-control { align-items: center; justify-content: center } .form-inline .custom-control-label { margin-bottom: 0 } .dropdown-menu-sm-left { right: auto; left: 0 } .dropdown-menu-sm-right { right: 0; left: auto } .navbar-expand-sm { flex-flow: row nowrap; justify-content: flex-start } .list-group-horizontal-sm, .navbar-expand-sm .navbar-nav { flex-direction: row } .navbar-expand-sm .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-sm .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem } .navbar-expand-sm>.container, .navbar-expand-sm>.container-fluid, .navbar-expand-sm>.container-lg, .navbar-expand-sm>.container-md, .navbar-expand-sm>.container-sm, .navbar-expand-sm>.container-xl { flex-wrap: nowrap } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-sm .navbar-toggler { display: none } .card-deck { display: flex; flex-flow: row wrap; margin-right: -15px; margin-left: -15px } .card-deck .card { flex: 1 0 0%; margin-right: 15px; margin-bottom: 0; margin-left: 15px } .card-group { display: flex; flex-flow: row wrap } .card-group>.card { flex: 1 0 0%; margin-bottom: 0 } .card-group>.card+.card { margin-left: 0; border-left: 0 } .card-group>.card:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0 } .card-group>.card:not(:last-child) .card-header, .card-group>.card:not(:last-child) .card-img-top { border-top-right-radius: 0 } .card-group>.card:not(:last-child) .card-footer, .card-group>.card:not(:last-child) .card-img-bottom { border-bottom-right-radius: 0 } .card-group>.card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0 } .card-group>.card:not(:first-child) .card-header, .card-group>.card:not(:first-child) .card-img-top { border-top-left-radius: 0 } .card-group>.card:not(:first-child) .card-footer, .card-group>.card:not(:first-child) .card-img-bottom { border-bottom-left-radius: 0 } .card-columns { -moz-column-count: 3; column-count: 3; -moz-column-gap: 1.25rem; column-gap: 1.25rem; orphans: 1; widows: 1 } .card-columns .card { display: inline-block; width: 100% } .jumbotron { padding: 4rem 2rem } .list-group-horizontal-sm .list-group-item:first-child { border-bottom-left-radius: .25rem; border-top-right-radius: 0 } .list-group-horizontal-sm .list-group-item:last-child { border-top-right-radius: .25rem; border-bottom-left-radius: 0 } .list-group-horizontal-sm .list-group-item.active { margin-top: 0 } .list-group-horizontal-sm .list-group-item+.list-group-item { border-top-width: 1px; border-left-width: 0 } .list-group-horizontal-sm .list-group-item+.list-group-item.active { margin-left: -1px; border-left-width: 1px } .modal-dialog { max-width: 500px; margin: 1.75rem auto } .modal-dialog-scrollable { max-height: calc(100% - 3.5rem) } .modal-dialog-scrollable .modal-content { max-height: calc(100vh - 3.5rem) } .modal-dialog-centered { min-height: calc(100% - 3.5rem) } .modal-dialog-centered::before { height: calc(100vh - 3.5rem) } .modal-sm { max-width: 300px } .d-sm-none { display: none !important } .d-sm-inline { display: inline !important } .d-sm-inline-block { display: inline-block !important } .d-sm-block { display: block !important } .d-sm-table { display: table !important } .d-sm-table-row { display: table-row !important } .d-sm-table-cell { display: table-cell !important } .d-sm-flex { display: flex !important } .d-sm-inline-flex { display: inline-flex !important } .flex-sm-row { flex-direction: row !important } .flex-sm-column { flex-direction: column !important } .flex-sm-row-reverse { flex-direction: row-reverse !important } .flex-sm-column-reverse { flex-direction: column-reverse !important } .flex-sm-wrap { flex-wrap: wrap !important } .flex-sm-nowrap { flex-wrap: nowrap !important } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-sm-fill { flex: 1 1 auto !important } .flex-sm-grow-0 { flex-grow: 0 !important } .flex-sm-grow-1 { flex-grow: 1 !important } .flex-sm-shrink-0 { flex-shrink: 0 !important } .flex-sm-shrink-1 { flex-shrink: 1 !important } .justify-content-sm-start { justify-content: flex-start !important } .justify-content-sm-end { justify-content: flex-end !important } .justify-content-sm-center { justify-content: center !important } .justify-content-sm-between { justify-content: space-between !important } .justify-content-sm-around { justify-content: space-around !important } .align-items-sm-start { align-items: flex-start !important } .align-items-sm-end { align-items: flex-end !important } .align-items-sm-center { align-items: center !important } .align-items-sm-baseline { align-items: baseline !important } .align-items-sm-stretch { align-items: stretch !important } .align-content-sm-start { align-content: flex-start !important } .align-content-sm-end { align-content: flex-end !important } .align-content-sm-center { align-content: center !important } .align-content-sm-between { align-content: space-between !important } .align-content-sm-around { align-content: space-around !important } .align-content-sm-stretch { align-content: stretch !important } .align-self-sm-auto { align-self: auto !important } .align-self-sm-start { align-self: flex-start !important } .align-self-sm-end { align-self: flex-end !important } .align-self-sm-center { align-self: center !important } .align-self-sm-baseline { align-self: baseline !important } .align-self-sm-stretch { align-self: stretch !important } .float-sm-left { float: left !important } .float-sm-right { float: right !important } .float-sm-none { float: none !important } .m-sm-0 { margin: 0 !important } .mt-sm-0, .my-sm-0 { margin-top: 0 !important } .mr-sm-0, .mx-sm-0 { margin-right: 0 !important } .mb-sm-0, .my-sm-0 { margin-bottom: 0 !important } .ml-sm-0, .mx-sm-0 { margin-left: 0 !important } .m-sm-1 { margin: .25rem !important } .mt-sm-1, .my-sm-1 { margin-top: .25rem !important } .mr-sm-1, .mx-sm-1 { margin-right: .25rem !important } .mb-sm-1, .my-sm-1 { margin-bottom: .25rem !important } .ml-sm-1, .mx-sm-1 { margin-left: .25rem !important } .m-sm-2 { margin: .5rem !important } .mt-sm-2, .my-sm-2 { margin-top: .5rem !important } .mr-sm-2, .mx-sm-2 { margin-right: .5rem !important } .mb-sm-2, .my-sm-2 { margin-bottom: .5rem !important } .ml-sm-2, .mx-sm-2 { margin-left: .5rem !important } .m-sm-3 { margin: 1rem !important } .mt-sm-3, .my-sm-3 { margin-top: 1rem !important } .mr-sm-3, .mx-sm-3 { margin-right: 1rem !important } .mb-sm-3, .my-sm-3 { margin-bottom: 1rem !important } .ml-sm-3, .mx-sm-3 { margin-left: 1rem !important } .m-sm-4 { margin: 1.5rem !important } .mt-sm-4, .my-sm-4 { margin-top: 1.5rem !important } .mr-sm-4, .mx-sm-4 { margin-right: 1.5rem !important } .mb-sm-4, .my-sm-4 { margin-bottom: 1.5rem !important } .ml-sm-4, .mx-sm-4 { margin-left: 1.5rem !important } .m-sm-5 { margin: 3rem !important } .mt-sm-5, .my-sm-5 { margin-top: 3rem !important } .mr-sm-5, .mx-sm-5 { margin-right: 3rem !important } .mb-sm-5, .my-sm-5 { margin-bottom: 3rem !important } .ml-sm-5, .mx-sm-5 { margin-left: 3rem !important } .p-sm-0 { padding: 0 !important } .pt-sm-0, .py-sm-0 { padding-top: 0 !important } .pr-sm-0, .px-sm-0 { padding-right: 0 !important } .pb-sm-0, .py-sm-0 { padding-bottom: 0 !important } .pl-sm-0, .px-sm-0 { padding-left: 0 !important } .p-sm-1 { padding: .25rem !important } .pt-sm-1, .py-sm-1 { padding-top: .25rem !important } .pr-sm-1, .px-sm-1 { padding-right: .25rem !important } .pb-sm-1, .py-sm-1 { padding-bottom: .25rem !important } .pl-sm-1, .px-sm-1 { padding-left: .25rem !important } .p-sm-2 { padding: .5rem !important } .pt-sm-2, .py-sm-2 { padding-top: .5rem !important } .pr-sm-2, .px-sm-2 { padding-right: .5rem !important } .pb-sm-2, .py-sm-2 { padding-bottom: .5rem !important } .pl-sm-2, .px-sm-2 { padding-left: .5rem !important } .p-sm-3 { padding: 1rem !important } .pt-sm-3, .py-sm-3 { padding-top: 1rem !important } .pr-sm-3, .px-sm-3 { padding-right: 1rem !important } .pb-sm-3, .py-sm-3 { padding-bottom: 1rem !important } .pl-sm-3, .px-sm-3 { padding-left: 1rem !important } .p-sm-4 { padding: 1.5rem !important } .pt-sm-4, .py-sm-4 { padding-top: 1.5rem !important } .pr-sm-4, .px-sm-4 { padding-right: 1.5rem !important } .pb-sm-4, .py-sm-4 { padding-bottom: 1.5rem !important } .pl-sm-4, .px-sm-4 { padding-left: 1.5rem !important } .p-sm-5 { padding: 3rem !important } .pt-sm-5, .py-sm-5 { padding-top: 3rem !important } .pr-sm-5, .px-sm-5 { padding-right: 3rem !important } .pb-sm-5, .py-sm-5 { padding-bottom: 3rem !important } .pl-sm-5, .px-sm-5 { padding-left: 3rem !important } .m-sm-n1 { margin: -.25rem !important } .mt-sm-n1, .my-sm-n1 { margin-top: -.25rem !important } .mr-sm-n1, .mx-sm-n1 { margin-right: -.25rem !important } .mb-sm-n1, .my-sm-n1 { margin-bottom: -.25rem !important } .ml-sm-n1, .mx-sm-n1 { margin-left: -.25rem !important } .m-sm-n2 { margin: -.5rem !important } .mt-sm-n2, .my-sm-n2 { margin-top: -.5rem !important } .mr-sm-n2, .mx-sm-n2 { margin-right: -.5rem !important } .mb-sm-n2, .my-sm-n2 { margin-bottom: -.5rem !important } .ml-sm-n2, .mx-sm-n2 { margin-left: -.5rem !important } .m-sm-n3 { margin: -1rem !important } .mt-sm-n3, .my-sm-n3 { margin-top: -1rem !important } .mr-sm-n3, .mx-sm-n3 { margin-right: -1rem !important } .mb-sm-n3, .my-sm-n3 { margin-bottom: -1rem !important } .ml-sm-n3, .mx-sm-n3 { margin-left: -1rem !important } .m-sm-n4 { margin: -1.5rem !important } .mt-sm-n4, .my-sm-n4 { margin-top: -1.5rem !important } .mr-sm-n4, .mx-sm-n4 { margin-right: -1.5rem !important } .mb-sm-n4, .my-sm-n4 { margin-bottom: -1.5rem !important } .ml-sm-n4, .mx-sm-n4 { margin-left: -1.5rem !important } .m-sm-n5 { margin: -3rem !important } .mt-sm-n5, .my-sm-n5 { margin-top: -3rem !important } .mr-sm-n5, .mx-sm-n5 { margin-right: -3rem !important } .mb-sm-n5, .my-sm-n5 { margin-bottom: -3rem !important } .ml-sm-n5, .mx-sm-n5 { margin-left: -3rem !important } .m-sm-auto { margin: auto !important } .mt-sm-auto, .my-sm-auto { margin-top: auto !important } .mr-sm-auto, .mx-sm-auto { margin-right: auto !important } .mb-sm-auto, .my-sm-auto { margin-bottom: auto !important } .ml-sm-auto, .mx-sm-auto { margin-left: auto !important } .text-sm-left { text-align: left !important } .text-sm-right { text-align: right !important } .text-sm-center { text-align: center !important } } @media (min-width:1200px) { .container, .container-lg, .container-md, .container-sm, .container-xl, .modal-xl { max-width: 1140px } .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-xl-12, .row-cols-xl-1>* { flex: 0 0 100%; max-width: 100% } .col-xl-6, .row-cols-xl-2>* { flex: 0 0 50%; max-width: 50% } .col-xl-4, .row-cols-xl-3>* { flex: 0 0 33.333333%; max-width: 33.333333% } .col-xl-3, .row-cols-xl-4>* { flex: 0 0 25%; max-width: 25% } .row-cols-xl-5>* { flex: 0 0 20%; max-width: 20% } .col-xl-2, .row-cols-xl-6>* { flex: 0 0 16.666667%; max-width: 16.666667% } .col-xl-auto { flex: 0 0 auto; width: auto; max-width: 100% } .col-xl-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .col-xl-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .col-xl-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .col-xl-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .col-xl-9 { flex: 0 0 75%; max-width: 75% } .col-xl-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .col-xl-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .order-xl-first { order: -1 } .order-xl-last { order: 13 } .order-xl-0 { order: 0 } .order-xl-1 { order: 1 } .order-xl-2 { order: 2 } .order-xl-3 { order: 3 } .order-xl-4 { order: 4 } .order-xl-5 { order: 5 } .order-xl-6 { order: 6 } .order-xl-7 { order: 7 } .order-xl-8 { order: 8 } .order-xl-9 { order: 9 } .order-xl-10 { order: 10 } .order-xl-11 { order: 11 } .order-xl-12 { order: 12 } .offset-xl-0 { margin-left: 0 } .offset-xl-1 { margin-left: 8.333333% } .offset-xl-2 { margin-left: 16.666667% } .offset-xl-3 { margin-left: 25% } .offset-xl-4 { margin-left: 33.333333% } .offset-xl-5 { margin-left: 41.666667% } .offset-xl-6 { margin-left: 50% } .offset-xl-7 { margin-left: 58.333333% } .offset-xl-8 { margin-left: 66.666667% } .offset-xl-9 { margin-left: 75% } .offset-xl-10 { margin-left: 83.333333% } .offset-xl-11 { margin-left: 91.666667% } .dropdown-menu-xl-left { right: auto; left: 0 } .dropdown-menu-xl-right { right: 0; left: auto } .navbar-expand-xl { flex-flow: row nowrap; justify-content: flex-start } .list-group-horizontal-xl, .navbar-expand-xl .navbar-nav { flex-direction: row } .navbar-expand-xl .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-xl .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem } .navbar-expand-xl>.container, .navbar-expand-xl>.container-fluid, .navbar-expand-xl>.container-lg, .navbar-expand-xl>.container-md, .navbar-expand-xl>.container-sm, .navbar-expand-xl>.container-xl { flex-wrap: nowrap } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-xl .navbar-toggler { display: none } .list-group-horizontal-xl .list-group-item:first-child { border-bottom-left-radius: .25rem; border-top-right-radius: 0 } .list-group-horizontal-xl .list-group-item:last-child { border-top-right-radius: .25rem; border-bottom-left-radius: 0 } .list-group-horizontal-xl .list-group-item.active { margin-top: 0 } .list-group-horizontal-xl .list-group-item+.list-group-item { border-top-width: 1px; border-left-width: 0 } .list-group-horizontal-xl .list-group-item+.list-group-item.active { margin-left: -1px; border-left-width: 1px } .d-xl-none { display: none !important } .d-xl-inline { display: inline !important } .d-xl-inline-block { display: inline-block !important } .d-xl-block { display: block !important } .d-xl-table { display: table !important } .d-xl-table-row { display: table-row !important } .d-xl-table-cell { display: table-cell !important } .d-xl-flex { display: flex !important } .d-xl-inline-flex { display: inline-flex !important } .flex-xl-row { flex-direction: row !important } .flex-xl-column { flex-direction: column !important } .flex-xl-row-reverse { flex-direction: row-reverse !important } .flex-xl-column-reverse { flex-direction: column-reverse !important } .flex-xl-wrap { flex-wrap: wrap !important } .flex-xl-nowrap { flex-wrap: nowrap !important } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-xl-fill { flex: 1 1 auto !important } .flex-xl-grow-0 { flex-grow: 0 !important } .flex-xl-grow-1 { flex-grow: 1 !important } .flex-xl-shrink-0 { flex-shrink: 0 !important } .flex-xl-shrink-1 { flex-shrink: 1 !important } .justify-content-xl-start { justify-content: flex-start !important } .justify-content-xl-end { justify-content: flex-end !important } .justify-content-xl-center { justify-content: center !important } .justify-content-xl-between { justify-content: space-between !important } .justify-content-xl-around { justify-content: space-around !important } .align-items-xl-start { align-items: flex-start !important } .align-items-xl-end { align-items: flex-end !important } .align-items-xl-center { align-items: center !important } .align-items-xl-baseline { align-items: baseline !important } .align-items-xl-stretch { align-items: stretch !important } .align-content-xl-start { align-content: flex-start !important } .align-content-xl-end { align-content: flex-end !important } .align-content-xl-center { align-content: center !important } .align-content-xl-between { align-content: space-between !important } .align-content-xl-around { align-content: space-around !important } .align-content-xl-stretch { align-content: stretch !important } .align-self-xl-auto { align-self: auto !important } .align-self-xl-start { align-self: flex-start !important } .align-self-xl-end { align-self: flex-end !important } .align-self-xl-center { align-self: center !important } .align-self-xl-baseline { align-self: baseline !important } .align-self-xl-stretch { align-self: stretch !important } .float-xl-left { float: left !important } .float-xl-right { float: right !important } .float-xl-none { float: none !important } .m-xl-0 { margin: 0 !important } .mt-xl-0, .my-xl-0 { margin-top: 0 !important } .mr-xl-0, .mx-xl-0 { margin-right: 0 !important } .mb-xl-0, .my-xl-0 { margin-bottom: 0 !important } .ml-xl-0, .mx-xl-0 { margin-left: 0 !important } .m-xl-1 { margin: .25rem !important } .mt-xl-1, .my-xl-1 { margin-top: .25rem !important } .mr-xl-1, .mx-xl-1 { margin-right: .25rem !important } .mb-xl-1, .my-xl-1 { margin-bottom: .25rem !important } .ml-xl-1, .mx-xl-1 { margin-left: .25rem !important } .m-xl-2 { margin: .5rem !important } .mt-xl-2, .my-xl-2 { margin-top: .5rem !important } .mr-xl-2, .mx-xl-2 { margin-right: .5rem !important } .mb-xl-2, .my-xl-2 { margin-bottom: .5rem !important } .ml-xl-2, .mx-xl-2 { margin-left: .5rem !important } .m-xl-3 { margin: 1rem !important } .mt-xl-3, .my-xl-3 { margin-top: 1rem !important } .mr-xl-3, .mx-xl-3 { margin-right: 1rem !important } .mb-xl-3, .my-xl-3 { margin-bottom: 1rem !important } .ml-xl-3, .mx-xl-3 { margin-left: 1rem !important } .m-xl-4 { margin: 1.5rem !important } .mt-xl-4, .my-xl-4 { margin-top: 1.5rem !important } .mr-xl-4, .mx-xl-4 { margin-right: 1.5rem !important } .mb-xl-4, .my-xl-4 { margin-bottom: 1.5rem !important } .ml-xl-4, .mx-xl-4 { margin-left: 1.5rem !important } .m-xl-5 { margin: 3rem !important } .mt-xl-5, .my-xl-5 { margin-top: 3rem !important } .mr-xl-5, .mx-xl-5 { margin-right: 3rem !important } .mb-xl-5, .my-xl-5 { margin-bottom: 3rem !important } .ml-xl-5, .mx-xl-5 { margin-left: 3rem !important } .p-xl-0 { padding: 0 !important } .pt-xl-0, .py-xl-0 { padding-top: 0 !important } .pr-xl-0, .px-xl-0 { padding-right: 0 !important } .pb-xl-0, .py-xl-0 { padding-bottom: 0 !important } .pl-xl-0, .px-xl-0 { padding-left: 0 !important } .p-xl-1 { padding: .25rem !important } .pt-xl-1, .py-xl-1 { padding-top: .25rem !important } .pr-xl-1, .px-xl-1 { padding-right: .25rem !important } .pb-xl-1, .py-xl-1 { padding-bottom: .25rem !important } .pl-xl-1, .px-xl-1 { padding-left: .25rem !important } .p-xl-2 { padding: .5rem !important } .pt-xl-2, .py-xl-2 { padding-top: .5rem !important } .pr-xl-2, .px-xl-2 { padding-right: .5rem !important } .pb-xl-2, .py-xl-2 { padding-bottom: .5rem !important } .pl-xl-2, .px-xl-2 { padding-left: .5rem !important } .p-xl-3 { padding: 1rem !important } .pt-xl-3, .py-xl-3 { padding-top: 1rem !important } .pr-xl-3, .px-xl-3 { padding-right: 1rem !important } .pb-xl-3, .py-xl-3 { padding-bottom: 1rem !important } .pl-xl-3, .px-xl-3 { padding-left: 1rem !important } .p-xl-4 { padding: 1.5rem !important } .pt-xl-4, .py-xl-4 { padding-top: 1.5rem !important } .pr-xl-4, .px-xl-4 { padding-right: 1.5rem !important } .pb-xl-4, .py-xl-4 { padding-bottom: 1.5rem !important } .pl-xl-4, .px-xl-4 { padding-left: 1.5rem !important } .p-xl-5 { padding: 3rem !important } .pt-xl-5, .py-xl-5 { padding-top: 3rem !important } .pr-xl-5, .px-xl-5 { padding-right: 3rem !important } .pb-xl-5, .py-xl-5 { padding-bottom: 3rem !important } .pl-xl-5, .px-xl-5 { padding-left: 3rem !important } .m-xl-n1 { margin: -.25rem !important } .mt-xl-n1, .my-xl-n1 { margin-top: -.25rem !important } .mr-xl-n1, .mx-xl-n1 { margin-right: -.25rem !important } .mb-xl-n1, .my-xl-n1 { margin-bottom: -.25rem !important } .ml-xl-n1, .mx-xl-n1 { margin-left: -.25rem !important } .m-xl-n2 { margin: -.5rem !important } .mt-xl-n2, .my-xl-n2 { margin-top: -.5rem !important } .mr-xl-n2, .mx-xl-n2 { margin-right: -.5rem !important } .mb-xl-n2, .my-xl-n2 { margin-bottom: -.5rem !important } .ml-xl-n2, .mx-xl-n2 { margin-left: -.5rem !important } .m-xl-n3 { margin: -1rem !important } .mt-xl-n3, .my-xl-n3 { margin-top: -1rem !important } .mr-xl-n3, .mx-xl-n3 { margin-right: -1rem !important } .mb-xl-n3, .my-xl-n3 { margin-bottom: -1rem !important } .ml-xl-n3, .mx-xl-n3 { margin-left: -1rem !important } .m-xl-n4 { margin: -1.5rem !important } .mt-xl-n4, .my-xl-n4 { margin-top: -1.5rem !important } .mr-xl-n4, .mx-xl-n4 { margin-right: -1.5rem !important } .mb-xl-n4, .my-xl-n4 { margin-bottom: -1.5rem !important } .ml-xl-n4, .mx-xl-n4 { margin-left: -1.5rem !important } .m-xl-n5 { margin: -3rem !important } .mt-xl-n5, .my-xl-n5 { margin-top: -3rem !important } .mr-xl-n5, .mx-xl-n5 { margin-right: -3rem !important } .mb-xl-n5, .my-xl-n5 { margin-bottom: -3rem !important } .ml-xl-n5, .mx-xl-n5 { margin-left: -3rem !important } .m-xl-auto { margin: auto !important } .mt-xl-auto, .my-xl-auto { margin-top: auto !important } .mr-xl-auto, .mx-xl-auto { margin-right: auto !important } .mb-xl-auto, .my-xl-auto { margin-bottom: auto !important } .ml-xl-auto, .mx-xl-auto { margin-left: auto !important } .text-xl-left { text-align: left !important } .text-xl-right { text-align: right !important } .text-xl-center { text-align: center !important } } .text-lowercase { text-transform: lowercase !important } .text-uppercase { text-transform: uppercase !important } .text-capitalize { text-transform: capitalize !important } .font-weight-light { font-weight: 300 !important } .font-weight-lighter { font-weight: lighter !important } .font-weight-normal { font-weight: 400 !important } .font-weight-bold { font-weight: 700 !important } .font-weight-bolder { font-weight: bolder !important } .font-italic { font-style: italic !important } .text-primary { color: #007bff !important } a.text-primary:focus, a.text-primary:hover { color: #0056b3 !important } .text-muted, .text-secondary { color: #6c757d !important } a.text-secondary:focus, a.text-secondary:hover { color: #494f54 !important } .text-success { color: #28a745 !important } a.text-success:focus, a.text-success:hover { color: #19692c !important } .text-info { color: #17a2b8 !important } a.text-info:focus, a.text-info:hover { color: #0f6674 !important } .text-warning { color: #ffc107 !important } a.text-warning:focus, a.text-warning:hover { color: #ba8b00 !important } .text-danger { color: #dc3545 !important } a.text-danger:focus, a.text-danger:hover { color: #a71d2a !important } .text-light { color: #f8f9fa !important } a.text-light:focus, a.text-light:hover { color: #cbd3da !important } .text-dark { color: #343a40 !important } a.text-dark:focus, a.text-dark:hover { color: #121416 !important } .text-body { color: #212529 !important } .text-black-50 { color: rgba(0, 0, 0, .5) !important } .text-white-50 { color: rgba(255, 255, 255, .5) !important } .text-hide { color: transparent; background-color: transparent; border: 0 } .bold, .competitiveComparisionTableHolder table thead tr th, .contentSp h3, .modify-inner a, .page404-inner h1, .page404-inner h2, .resultNullHolder p, .sliderSec ul li .sliderCaption h2, .strong, strong { font-family: var(--family-montserrat) } .text-decoration-none { text-decoration: none !important } .text-break { word-break: break-word !important; overflow-wrap: break-word !important } .text-reset { color: inherit !important } .visible { visibility: visible !important } .invisible { visibility: hidden !important } span.multiselect-native-select select { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px -1px -1px -3px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; left: 50%; top: 30px } .multiselect-container { position: absolute; list-style-type: none; margin: 0; padding: 0 } .multiselect-container .multiselect-reset .input-group { width: 93% } .multiselect-container .multiselect-group>span, .multiselect-container>.multiselect-option>span { padding: 3px 20px } .form-inline .multiselect-container span.form-check { padding: 3px 20px 3px 40px } .wizard-pane { position: absolute; top: 0; visibility: hidden; opacity: 0; transition: opacity .2s } .wizard-pane.active { position: relative; visibility: visible; opacity: 1 } .wizard-pane.activing { visibility: visible } .wizard-content { position: relative; padding: 0; transition: height .2s; border: 1px solid #aaa } .current { color: #00f !important } .done { color: green !important } .error, .required { color: red !important } .disabled { cursor: not-allowed !important } .wizard-pane { padding: 10px } .wizard-steps { padding: 0; margin: 0; list-style: none } .wizard-steps>li { display: inline-block; padding: 5px 10px; color: #666; cursor: pointer } .wizard-steps>li:hover { color: #333 } .wizard-buttons { margin-top: 10px } .wizard-buttons>a { padding: 5px 10px; margin-right: 5px; border: 1px solid #aaa; border-radius: 20px } fieldset, hr { border: 0; padding: 0 } .wizard-buttons>a.disabled { color: #aaa; border-color: #aaa } html { color: #222; font-size: 1em; line-height: 1.4 } ::-moz-selection { background: #b3d4fc; text-shadow: none } ::selection { background: #b3d4fc; text-shadow: none } hr { box-sizing: content-box; overflow: visible; display: block; height: 1px; border-top: 1px solid #ccc; margin: 1em 0 } #additional-options .options p, .customTooltip p, .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead p, .purchase-option-wrapper .options:last-child>p, .sliderSec.searchPage, fieldset { margin: 0 } .browserupgrade { margin: .2em 0; background: #ccc; color: #000; padding: .2em 0 } .btn-primary, .productFilterRefineSec .filterCheckList ul li .filterCheckBox input:checked+label i:after, ul.slick-dots li button:hover, ul.slick-dots li.slick-active button { background: #3a7b1d } .bold, .strong, strong { font-weight: var(--weight-600) } .btn, .form-control { font-size: 14px; font-family: var(--family-lato) } .adviceSection a, .banner .banner-text .desc h2, .blogDetailContentSec h2, .blogSection .blogDesc, .btn, .contentSp h3, .footerBlockHolder h6, .terms h4, .terms ol li, .topBarleftInfoSec ul li p a, .update-house-plan-product-container .housePlanProductSec .housePlanProductHolder .house-Plan-Product-Head p span { font-weight: var(--weight-700) } .btn-primary { border-color: #3a7b1d; color: #fff } .btn-primary:focus, .btn-primary:hover, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle { color: #fff; background-color: #2a5f13; border-color: #2a5f13 } .btn-light.focus, .btn-light:focus, .btn-light:hover, .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .btn-primary.disabled, .btn-primary:disabled, .show>.btn-light.dropdown-toggle { color: #fff; background-color: #3a7b1d; border-color: #3a7b1d } .btn-light.blue.focus, .btn-light.blue:focus, .btn-light.blue:hover, .btn-light.blue:not(:disabled):not(.disabled).active, .btn-light.blue:not(:disabled):not(.disabled):active, .show>.btn-light.blue.dropdown-toggle { color: #fff; background-color: #0e56a5; border-color: #0e56a5 } .btn-light { border-color: #ffff } .btn-light.blue:not(:disabled):not(.disabled).active:focus, .btn-light.blue:not(:disabled):not(.disabled):active:focus, .show>.btn-light.blue.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(14, 86, 165, .5) } .btn { border-radius: 0; text-transform: uppercase; white-space: nowrap; padding: .698rem 2.1rem } .btn.btn-lg { font-size: 16px; padding: 1rem 2rem } .btn.btn-med { padding: .85rem 2rem } .btn.btn-sm { padding: .65rem 1rem; font-size: 12px } .btn i { margin-right: 10px } .form-control { border-radius: 2px; font-weight: var(--weight-400); height: calc(2em + .75rem + 2px) } select.form-control { appearance: none; -moz-appearance: none; -webkit-appearance: none; background-image: url('/images/nav-dropdown-arrow.png?b20f3fcc53762110e186c73358023c24'); background-position: calc(100% - 20px) center; background-repeat: no-repeat } .form-control:focus { box-shadow: none; outline: 0; border-color: #ebebeb } .btn-gray:focus, .btn-gray:hover { background-color: #3a7b1d; border-color: #3a7b1d; color: #fff } .btn-gray { background-color: #f7f9fb; border-color: #f7f9fb; color: #666 } .housePlanDetailPageHolder .housePlanDetailPageRightSec.stick .slimScrollBar, .nicescroll-rails, .slimScrollBar { opacity: 1 !important } .nicescroll-rails:after { content: ''; height: 100%; background: #d8e1eb; width: 2px; border-radius: 5px; position: absolute; left: 50%; margin-left: -1px; top: 0; z-index: 1 } .nicescroll-rails .nicescroll-cursors { z-index: 2 } @media (min-width:1340px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1310px } } .contentSp h3 { font-size: 48px; color: #141f2b; margin: 0 0 1.6rem } .contentSp p, .productFilterRefineHolder>p { font-family: var(--family-lato); font-weight: var(--weight-400); font-size: 16px; color: #141f2b; margin-bottom: 1.2rem; line-height: 30px } .contentSp h4, .contentSp h5, .contentSp h6 { color: #141f2b; margin: 0 0 1.5rem; line-height: 36px; font-weight: var(--weight-400) } .contentSp h5 { font-family: var(--family-lato); font-size: 24px } .contentSp h4, .topBarleftInfoSec ul li p a { font-family: var(--family-lato); font-size: 22px } .contentSp h6 { font-family: var(--family-lato); font-size: 18px } .topBarContainer { background: #3b8beb; padding: 9px 0 } .navBarHolder { border-bottom: 1px solid #f0f0f0; background: #fff } .navBarHolder .container, .topBarContainer .container { max-width: 1752px } .topBarleftInfoSec ul { height: 60px; display: flex; list-style-type: none; margin: 0; padding: 0; color: #fff; align-items: center } .topBarleftInfoSec ul li+li { margin-left: 10px } .topBarleftInfoSec ul li p { font-family: var(--family-lato); font-weight: var(--weight-400); font-size: 16px; display: flex; align-items: center; margin: 0 0 0 10px } .topBarleftInfoSec ul li p a { color: #fff; text-decoration: none; display: flex; align-items: center; margin-left: 10px } .topBarleftInfoSec ul li p a i { display: flex; margin: 0 5px 0 0 } .topBarleftInfoSec ul li p a i svg { width: 16px } .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li span a svg path, .topBarleftInfoSec ul li p a i svg path { fill: #fff } .topBarRightInfoSec { margin-left: auto; display: flex; align-items: center; position: relative; z-index: 9 } .topBarRightInfoSec ul { display: flex; list-style-type: none; margin: 0; padding: 0; color: #fff; align-items: center } .topBarRightInfoSec ul li { margin: 0 0 0 15px; position: relative } .topBarRightInfoSec ul li a i { background: #fff; border-radius: 100%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; position: relative } .topBarRightInfoSec ul li a i .fa-heart { color: #2f83e8 } .topBarRightInfoSec ul li a span { background: #42861e; color: #fff; width: 15px; height: 15px; border-radius: 3px; font-size: 75%; display: flex; align-items: center; justify-content: center; position: absolute; bottom: calc(100% - 11px); left: calc(100% - 7px) } .topBarRightInfoSec ul li a i .count { width: 20px; height: 20px; position: absolute; left: 20px; bottom: calc(100% - 19px); color: #fff; background: #3a7b1d; font-size: 10px; padding: 4px; border-radius: 100%; z-index: 1; font-style: normal } .topSearchSec .form-control { border-radius: 0; min-width: 19rem; border-color: #fff; height: calc(1.358em + .75rem + 2px) } .topSearchSec .btn { border-radius: 0; padding: .25rem 2rem } .navBarHolder .navbar, .table-padding-0 tr td { padding-left: 0; padding-right: 0 } .navBarHolder .navbar .navbar-brand { padding-top: 0; padding-bottom: 0 } .navBarHolder .navbar .navbar-brand img, header.fixHeader .navBarHolder .navbar .navbar-brand img { height: 90px; transition: .25s ease-in } .navBarHolder .navbar .navbar-nav { width: 100%; justify-content: space-between; margin-left: 6rem } .navBarHolder .navbar .navbar-nav .nav-link { font-size: 13px; color: #333; font-family: var(--family-montserrat); font-weight: var(--weight-600) } .navBarHolder .navbar .navbar-nav .dropdown-toggle::after { width: 10px; height: 6px; background: url(/images/nav-dropdown-arrow.png?6c12ed7b39a8f5dcf46890724df6de2e) center center no-repeat; border: 0 } .navBarHolder .navbar .navbar-nav .nav-item.dropdown.show .dropdown-toggle::after { transform: rotate(180deg) } header { transition: .25s ease-in } header.fixHeader { left: 0; top: 0; z-index: 100; opacity: 1; box-shadow: 0 0 12px 0 rgba(0, 0, 0, .15) } .sliderSec { position: relative; margin-bottom: 70px } .sliderSec ul, .testimonialSec .testimonialSlideSec ul { list-style-type: none; margin: 0; padding: 0 } .sliderSec ul li:after { content: ''; background: rgba(0, 0, 0, .1); width: 100%; height: 100%; left: 0; top: 0; position: absolute } .sliderSec ul li>img { width: 100%; height: 100%; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; position: absolute; left: 0; right: 0; top: 0; bottom: 0 } .sliderSec ul li .sliderCaption { color: #fff; text-align: center; max-width: 100%; position: relative; z-index: 1; padding: 30px 15px; min-height: 730px; display: flex; flex-direction: column; justify-content: center; align-items: center } .sliderSec ul li .sliderCaption h2 { text-shadow: 0 0 12px #000; font-size: 63px; font-weight: var(--weight-600); margin: 0 } .sliderSec ul li .sliderCaption .btn { min-width: 12rem; margin-top: 2.5rem; font-size: 18px; line-height: 1.4 } .sliderSec ul li .sliderCaption p { font-size: 40px; font-family: var(--family-lato); font-weight: var(--weight-400); margin: 0 } .planFilterSec { position: absolute; top: 100%; left: 0; width: 100%; transform: translateY(-50%); margin-top: -7px } .planFilterSec.saleBanner { position: absolute; top: 100%; left: 0; width: 100%; transform: translateY(-50%); margin-top: 25px } .planFilterFieldSec { padding: 0; position: relative; display: flex; align-items: center; gap: 2rem; flex-direction: row-reverse; justify-content: center } .planFilterFieldSec>form { width: 100%; max-width: 1100px } .planFilterFieldSp { background: #fff; border-radius: 15px; box-shadow: 0 0 50px 0 rgba(0, 0, 0, .2); padding: 25px 40px; display: flex; align-items: center } .housePlanSliderActionoHolder, .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockSp:hover { box-shadow: 0 0 40px 0 rgba(0, 0, 0, .07) } .planFilterFieldSp .planFilterFieldHolder { width: 100%; display: flex } .planFilterFormGroup { width: 100%; max-width: 125px; padding: 0 10px } .planFilterFormGroup label { font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #333 } .planFilterFormGroup .form-control { border-color: #ebebeb; border-radius: 0 } .planFilterFormGroup.sqrFt .d-flex span { padding: 0 10px } .planFilterFormGroup.sqrFt .d-flex .form-control { max-width: 95px } .planFilterBtnSec .btn { min-width: 220px } .mainSlider .slick-arrow { position: absolute; top: 50%; background: 0 0; border: 0; outline: 0; box-shadow: none; z-index: 9 } .mainSlider .slick-arrow.slick-next { right: 15px; transform: rotate(180deg) } .mainSlider .slick-arrow.slick-prev { left: 15px } .planToFindHomeSec { padding: 100px 0 } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec h4, .planToFindHomeSec h6 { color: #3b8beb } .planCalloutSec ul { display: flex; list-style-type: none; width: 100%; justify-content: space-evenly; margin: 60px 0 40px; padding: 0 } .planCalloutSec ul li { max-width: 220px } .planCalloutSec ul li h3 { font-size: 26px; margin-top: 1rem } .browseHousePlan { background: #3b8beb; color: #fff; padding: 80px 0 40px; position: relative } .browseHousePlanSec { display: flex; position: relative; z-index: 1; width: 50%; margin-left: auto } .browseHousePlan .browseContentSec { width: 100%; padding: 80px 15px 40px; position: absolute; right: 0; top: 0 } .browseHousePlan .browseContentSec .browseContentSecSp { width: 45%; padding: 0 15px } .browseHousePlan .browseContentSec h6 { color: #fff; margin-bottom: 2rem } .browseHousePlan .browseContentSec h6 strong, .purchase-option-wrapper .dropdown-menu.plan-set-ddown li { font-family: var(--family-lato); font-weight: var(--weight-700) } .browseHousePlan .browseContentSec h6 strong b { font-size: 22px } .browseHousePlanSec .browseSliderSec { width: 100%; padding: 0 15px } .browseHousePlanSec .browseSliderSec .productBox { margin: 0 5px; max-width: 570px } .productBox { background: #fff; padding: 5px; display: flex; flex-direction: column; color: #fff; border: 1px solid #eee } .designerEnvisionContainer, .findHomeSec, .housePlanProductContainer, .housePlanStyleSec, .makeUniqueSec, .onlineHouseBenefitsContainer, .testimonialSec { padding: 90px 0 } .productBox .productBtnHolder { display: flex; flex-wrap: wrap; margin: 5px -5px 0; position: relative } .productBox .productBtnHolder>span { padding: 0 5px; flex: 1 } .productBox .productBtnHolder .btn-product { border: 1px solid #1f1f1f; border-radius: 0; font-size: 14px; text-transform: uppercase; white-space: nowrap; padding: .698rem 15px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #1f1f1f; width: 100%; display: block; text-align: center; transition: .15s ease-in } .productBox .productBtnHolder .btn-product:hover { background: #1f1f1f; color: #fff } .productBox .productBtnHolder>a { margin: 5px; flex: 0 0 calc(30% - 10px); max-width: calc(30% - 10px) } .productBox .productBlock .productTopIconHolder { position: absolute; left: 0; top: 0; display: flex; justify-content: space-between; width: 100%; padding: 5px; align-items: flex-start; z-index: 2 } .productBox .productBlock .productTopIconHolder>a { background: #fff; padding: 8px 7px; display: flex; align-items: center } .orderCostBuildSec .wizard .steps ul li.active a, .orderCostBuildSec .wizard .steps ul li.current a, .productBox .productBlock .productTopIconHolder>a .fa-heart { color: #3a7b1d } .productBox .productBlock .productTopIconHolder .rightIconHolder { display: flex; margin-left: auto; flex: 0 0 79px; max-width: 79px; justify-content: flex-end } .productBox .productBlock .productTopIconHolder .rightIconHolder ul { list-style: none; margin: 0; padding-left: 0 } .productBox .productBlock .productTopIconHolder .rightIconHolder a { background: rgba(255, 255, 255, .3); padding: 5px 8px; display: flex; align-items: center; justify-content: center; margin-left: 5px } .productBox .productBlock .productBottomInfoSec { position: absolute; left: 0; bottom: 0; width: 100%; display: flex; flex-direction: column; align-items: flex-end; z-index: 2 } .productBox .productBlock .productBottomInfoSec .productInfoSec { background: rgba(0, 0, 0, .4); width: 100% } .productBox .productBlock .productImageSec { position: relative; z-index: 1; max-width: 100% } .productBox .productBlock .productImageSec a:after { content: ''; background: url(/images/product-shadow.png?a3cdd7da49b161415e3def913fa71ad4) top left repeat-x; width: 100%; height: 100%; left: 0; top: 0; position: absolute } .productBox .productBlock .productImageSec img { width: 100%; height: 395px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; display: block } .productBox .productBlock .productBottomInfoSec .productInfoSec ul { display: flex; list-style-type: none; margin: 0; padding: 0; width: 100% } .productBox .productBlock .productBottomInfoSec .productInfoSec ul li { flex: 1; border-right: 1px solid rgba(255, 255, 255, .2); padding: 10px 15px; display: flex; flex-direction: column; align-items: center; font-size: 16px; font-family: var(--family-lato); font-weight: var(--weight-600) } .productBox .productBlock .productBottomInfoSec>span { padding: 5px 15px; background: #fff; font-size: 16px; color: #000; font-family: var(--family-lato); font-weight: var(--weight-600); margin: 10px } .productBox .productBtnHolder .productImageHover { position: absolute; bottom: calc(100% + 5px); z-index: -1; left: 10px; padding: 5px; background: #fff; box-shadow: 0 0 10px 10px rgba(0, 0, 0, .2); opacity: 0; transition: .2s ease-in; width: 100%; height: 330px; max-width: 450px; display: none } .productBox .productBtnHolder .btn-product:hover+.productImageHover { opacity: 1; z-index: 9 } .productBox .productBtnHolder .productImageHover img { width: calc(100% - 10px); height: 320px } .listSpec { font-size: 20px; display: none } @media (max-width:1199px) { .housePlanFilterTabSec .housePlanCountSec .housePlanProductStyleFilter { display: none !important } } @media (min-width:1199px) { .listView .listSpec.raw-img { max-width: 40%; flex: 0 0 40% } .housePlanProductContainer.housePlanThreeColumn .housePlanProductHolder .listView .productBox { width: 100%; flex-direction: unset; align-items: flex-start; flex-wrap: wrap } .listView .productBox .productBtnHolder { max-width: 25%; flex: 0 0 25%; margin: 0; padding: 0 10px 0 15px } .listView .productBox .productBtnHolder>div { flex: 100%; max-width: 100% } .listView .productBox .productBlock { padding-right: 15px; max-width: 75%; flex: 0 0 75%; display: flex } .listView .productBox .productBlock .productImgHolder { max-width: 40%; position: relative } .housePlanProductHolder .listView .productBox .productBlock .productImageSec img { height: auto } .listView .productBox .productBtnHolder>div .btn-product { font-size: 14px } .listView .productBox .productBlock .productBottomInfoSec { position: static; align-items: flex-start; flex-direction: row } .listView .productBox .productBlock .productBottomInfoSec>span { position: absolute; left: 0; bottom: 0 } .listView .productBox .productBlock .productBottomInfoSec .productInfoSec { background: 0 0; padding-left: 15px; flex: 0 0 60%; max-width: 60% } .listView .productBox .productBlock .productBottomInfoSec .productInfoSec ul { flex-direction: column } .listView .productBox .productBlock .productBottomInfoSec .productInfoSec ul li { display: block; color: #000; padding: 5px 15px } .listView .listSpec { display: block; color: #3b8beb; font-family: var(--family-lato); font-weight: var(--weight-600); margin-bottom: 10px } } .productBrowseSlider { overflow: hidden; position: relative } .productBrowseSlider:after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 58px; background: url(/images/browse-right-shadow.png?289696eb5f232de7ab15b2156e23a3ab) top right repeat-y } .productBrowseSlider .slick-arrow { position: absolute; z-index: 9; top: 0; bottom: 0; background: 0 0; border: 0; box-shadow: none; opacity: 1; visibility: visible; transition: .15s ease-in; outline: 0 } .customTooltip, .slick-loading .slick-slide, .slick-loading .slick-track { visibility: hidden } .productBrowseSlider .slick-arrow.slick-disabled, .slick-arrow.slick-disabled { opacity: 0; visibility: hidden } .arrow-left { width: 30px; height: 30px; display: block; border-top: 4px solid #fff; border-left: 4px solid #fff; transform: rotate(-45deg) } .productBrowseSlider .slick-arrow.slick-prev { left: 10px } .productBrowseSlider .slick-arrow.slick-next { right: 10px; transform: rotate(180deg) } .housePlanStyleSec .fetauredProductTab { display: flex; list-style-type: none; margin: 40px 0 50px; padding: 0; align-items: center; justify-content: center; border: 0 } .housePlanStyleSec .fetauredProductTab li { margin: 0 10px } .housePlanStyleSec .fetauredProductTab li a { padding: 8px 20px; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 16px; text-align: center; display: block; width: 100%; background: #f7f9fb; color: #131f2b } .housePlanStyleSec .fetauredProductTab li a.active { background: #3b8beb; color: #fff; position: relative } .housePlanStyleSec .fetauredProductTab li a.active:after { content: ''; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #3b8beb; position: absolute; top: 100%; left: 50%; margin-left: -5px } .housePlanProductContainer .housePlanProductSec, .housePlanProductHolder .productHolder, .housePlanStyleSec .productHolder { display: flex; flex-wrap: wrap } .housePlanStyleSec .productHolder .productBox { margin: 15px; width: calc(50% - 30px) } .housePlanStyleSec .btnHolder, .loginPanel .loginField form { margin-top: 20px } .findHomeSec .btnHolder, .testimonialSec .btnHolder { margin-top: 40px } .findHomeSec .findHomeBanner { position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .findHomeSec .findHomeBanner:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .8); content: '' } .findHomeSec .findHomeBanner img { -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; width: 100%; height: 100% } .findHomeContentHolder { position: relative; z-index: 1; color: #fff } .findHomeContentHolder h4 { margin-bottom: 35px } .favorite-content, .housePlanFeatureCardBody, .makeUniqueSec .uniquePlanBlockHolder { padding: 15px } .makeUniqueSec .uniquePlanBlockHolder h5 { font-size: 25px; font-family: var(--family-lato); font-weight: var(--weight-600); margin: 0 } .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockSp { display: flex; flex-direction: column; height: calc(100% - 20px); border: 1px solid #f7f9fb } .makeUniqueSec .uniquePlanBlockHolder .planProductAvatarHolder { width: 100%; position: relative } .makeUniqueSec .uniquePlanBlockHolder .planProductAvatarHolder img { width: 650px; height: 438px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .makeUniqueSec .uniquePlanBlockHolder .planProductAvatarHolder span { position: absolute; bottom: 0; right: 0; padding: 5px 15px; background: #fff; font-size: 16px; color: #000; font-family: var(--family-lato); font-weight: var(--weight-600); margin: 10px } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec { padding: 15px; text-align: left } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec p { color: #1f2d3d; margin-bottom: 15px } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .btnHolder { margin-top: 25px; margin-bottom: 35px } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing { display: flex; align-items: flex-start; justify-content: space-between; list-style-type: none; margin: 0 0 30px; padding: 0 } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li { display: flex; flex-direction: column; padding: 0 15px } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li i { width: 100%; display: block; height: 55px; display: flex; align-items: flex-start; justify-content: center } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li span { font-size: 20px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #131e26 } .qucikAdviceSec .btnHolder, .testimonialSec .testimonialSlideSec { margin-top: 60px } .testimonialSec .testimonialSlideSec .slick-slider { position: relative; overflow: hidden; padding: 0 20px } .testimonialSec .testimonialSlideSec .slick-arrow { position: absolute; top: 50%; text-indent: -999em; z-index: 2; width: 13px; height: 24px; background: url(/images/testimonial-arrow.png?1b060b479ba9b692f339c11704bd11f4) center center no-repeat; border: 0; margin-top: -12px; outline: 0 } .testimonialSec .testimonialSlideSec .slick-arrow.slick-prev { left: 0; transform: rotate(-180deg) } .testimonialSec .testimonialSlideSec .testimonialBlock { padding: 0 100px; display: flex; text-align: left } .footerBlockHolder>*, .footerBottomSec>*, .orderCostBuildSec .wizard .wizardBody .billingAndPaymentSec .ShippingAmountList label, .testimonialSec .testimonialSlideSec .testimonialBlock .testimonialContent, .testimonialSec .testimonialSlideSec .testimonialBlock>i { padding: 0 15px } .testimonialSec .testimonialSlideSec .testimonialBlock>i img { width: 124px; height: 124px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .testimonialSec .testimonialSlideSec .testimonialBlock .testimonialContent p { font-size: 24px; color: #141f2b; line-height: 40px; margin-bottom: 40px; font-family: var(--family-lato); font-weight: var(--weight-400); font-style: italic } .testimonialSec .testimonialSlideSec .testimonialBlock .testimonialContent b { color: #3b8beb; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 18px } .qucikAdviceSec { background: #f7f9fb; padding: 90px 0 } .qucikAdviceSec h5 a { color: #3a8beb; font-family: var(--family-lato); font-weight: var(--weight-600) } .qucikAdviceSec .adviceBlockHolder { display: flex; flex-wrap: wrap; margin-top: 20px } .qucikAdviceSec .adviceBlockHolder .adviceBlock { width: 50%; padding: 0 15px } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp { border: 1px solid #e0e7ed; display: flex; flex-direction: column; height: 100% } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp .adviceImgSec img { width: 100%; height: 438px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec { padding: 30px 20px; text-align: left } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec h5 { font-size: 26px; font-family: var(--family-lato); font-weight: var(--weight-600); margin-bottom: 10px } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec>b { font-family: var(--family-lato); font-weight: var(--weight-400); font-weight: 400; font-size: 16px; display: block; margin-bottom: 1.5rem } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec>b span { color: #3a8beb } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec .link { font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #3a8beb; text-transform: uppercase } .housePlanProductContainer .housePlanProductSec .productFilterRefineHolder { width: 28.7%; padding-right: 25px } .housePlanProductContainer .housePlanProductSec .housePlanProductHolder { width: 71.3%; padding-left: 25px } .housePlanFilterTabSp { display: flex; justify-content: space-between; width: 100%; margin-bottom: 70px } .housePlanFilterTabSec .housePlanCountSec p { font-size: 16px; color: #1f2d3d; margin: 0 15px 0 0 } .housePlanFilterTabSec .housePlanCountSec p span { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 22px } .housePlanFilterTabSec .housePlanSearchSec { margin-left: 15px; max-width: 205px } .housePlanFilterTabSec .housePlanSearchSec .form-control { height: calc(2.572em + .75rem + 2px) } .housePlanFilterTabSec .housePlanCountSec .housePlanProductStyleFilter>a { margin: 0 5px; display: flex; align-items: center } .button-group .btn+.btn, .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder { margin-left: 15px } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul { display: flex; align-items: center; list-style-type: none; margin: 0; padding: 0 } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a { border-radius: 0; font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-700); white-space: nowrap; padding: .844rem 1rem; display: flex; color: #888; border: 1px solid #f0f0f0; min-width: 160px; justify-content: center; cursor: pointer } .buildCostContainer .nav-tabs .nav-item.show .nav-link, .buildCostContainer .nav-tabs .nav-link.active, .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a.active, .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a:hover { background: #2f83e8; color: #fff; border-color: #2f83e8 } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a.active.deactive { background: 0 0; color: #888; border-color: #f0f0f0 } .housePlanProductHolder .row { margin-left: -5px; margin-right: -5px } .housePlanProductHolder .productBox { margin: 10px 5px; width: calc(50% - 10px) } .productFilterRefineHolder .link, .productFilterRefineHolder>h4 { margin-bottom: 1.2rem; font-family: var(--family-montserrat); line-height: 30px } .housePlanProductHolder .productBox .productBlock .productImageSec img { height: 340px } .housePlanProductHolder .productBox .productBtnHolder .btn-product { font-size: 12px; padding: .5rem 5px } .productFilterRefineHolder>h4 { font-weight: var(--weight-700); font-size: 26px; color: #141f2b } .productFilterRefineHolder .link { font-weight: var(--weight-600); font-size: 14px; color: #2e83e7; display: inline-block } .productFilterRefineHolder .productFilterRefineSec { display: flex; flex-direction: column } .productFilterRefineHolder .productFilterRefineSec .filterCard { margin-bottom: 1rem; margin-top: 1rem; width: 100% } .productFilterRefineSec .card { background: #f7f9fb; border: 0; border-radius: 0 } .productFilterRefineSec .card .card-header { background: 0 0; border-bottom-color: #e9eef3; font-family: var(--family-montserrat); font-weight: var(--weight-600); font-size: 20px; color: #1f2c3d; display: flex; align-items: center; padding-top: 1.1rem; padding-bottom: 1.1rem } .productFilterRefineSec .card .card-header h4 { margin: 0; font-family: var(--family-montserrat); font-weight: var(--weight-600); font-size: 20px; color: #1f2c3d } .housePlanFieldSetHolder ul li .btn, .productFilterRefineSec .card .card-header a, .selectPlanFormSec .purchase-option-wrapper .option-wrapper .btn .pull-right { margin-left: auto } .productFilterRefineSec .card .card-header a.link { color: #2f83e8; font-size: 14px; margin-bottom: 0 } .productFilterRefineSec .accordion .card { border: 1px solid #e9eef3 } .productFilterRefineSec .accordion .card .card-header, .productFilterRefineSec .featureBadgeListHolder, footer { padding: 0 } .productFilterRefineSec .accordion .card .card-header h2 button { padding-top: 1.1rem; padding-bottom: 1.1rem; width: 100%; text-align: left; font-family: var(--family-montserrat); font-weight: var(--weight-600); font-size: 20px; color: #1f2c3d; line-height: 1.2; border: 0; text-decoration: none; text-transform: capitalize; position: relative } .productFilterRefineSec .accordion .card .card-header h2 button:after { content: ''; width: 14px; height: 8px; background: url(/images/accordion-arrow.png); position: absolute; right: 15px; top: 50%; margin-top: -4px; transform: rotate(180deg) } .productFilterRefineSec .accordion .card .card-header h2 button.collapsed:after { transform: rotate(0) } .filterRefineForm label { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 16px; color: #1f2c3d } .filterRefineForm .filterFormRow { margin-left: -5px; margin-right: -5px; display: flex; flex-wrap: wrap } .filterRefineForm .filterFormRow .filterFieldSec { padding: 0 5px; flex: 0 0 50%; max-width: 50% } .productFilterRefineSec .filterCheckList ul { display: flex; margin: 0; padding: 0 15px 0 0; list-style-type: none; flex-direction: column; max-height: 295px } .productFilterRefineSec .filterCheckList ul li { display: flex; margin: 0; padding: 0; list-style-type: none; width: 100% } .productFilterRefineSec .filterCheckList ul li+li { margin-top: 13px } .productFilterRefineSec .filterCheckList ul li .filterCheckBox { position: relative; width: 100% } .productFilterRefineSec .filterCheckList ul li .filterCheckBox input { position: absolute; opacity: 0; width: 0; height: 0 } .productFilterRefineSec .filterCheckList ul li .filterCheckBox label { font-size: 16px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #1f2c3d; display: flex; align-items: flex-start; margin: 0; width: 100%; line-height: 22px } .productFilterRefineSec .filterCheckList ul li .filterCheckBox label i { width: 22px; height: 22px; background: #fff; border: 1px solid #1f1f1f; position: relative; min-width: 22px } .productFilterRefineSec .filterCheckList ul li .filterCheckBox label i:after { width: 12px; height: 12px; background: #fff; position: absolute; top: 4px; left: 4px; content: '' } .productFilterRefineSec .filterCheckList ul li .filterCheckBox input:checked+label i { border-color: #3a7b1d } .productFilterRefineSec .filterCheckList ul li .filterCheckBox label b { margin-left: auto; background: #e3eaf0; border-radius: 20px; font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-600); color: #1f2d3d; padding: 1px 12px } .signUp-container, .staticText { border: 1px solid #d0d0d0 } .productFilterRefineSec .filterCheckList ul li .filterCheckBox label span { padding-left: 15px; padding-right: 15px } .demo-page { padding: 80px 0 0 } .staticText { padding: 30px 30px 35px; width: 90%; margin: 0 auto; text-align: center; font-size: 15px } .staticText h3 { margin: 0; font-weight: 700; font-size: 1.5rem } .blogDetailContentSec p span, .blogDetailContentSec ul li, .costCalcList li, .customDreamContainer .costEffectiveContainer .costEffectiveSec h2, .customDreamContainer .customDreamContentHolder .customDreamLeftSec h4, .designerEnvisionContainer .designerEnvisionSec .designerEnvisionCallout h3, .designerEnvisionContainer .designerEnvisionSec h4, .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li .floorPlanContent h6, .modifyPage h5, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent h5, .onlineHouseBenefitsContainer .onlineHouseBenefitsSec h4, .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder h4, .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul li, .sidebar, .testimonialList li .testimonial .author p { font-family: var(--family-lato); font-weight: var(--weight-600) } .contactInfoSec ul li, .contactInfoSec ul li b, .faqSec .card .card-body, .footerNavBlock ul li a, .terms { font-weight: var(--weight-400) } .signUp-container .signUp-inner { padding: 15px 20px } .customDreamContainer { position: relative; margin-bottom: 66px } .customDreamContainer .customDreamBgHolder, .farmHouseDetailContainer .farmHouseDetailBgHolder { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .customDreamContainer .customDreamBgHolder:after, .farmHouseDetailContainer .farmHouseDetailBgHolder:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background: rgba(0, 0, 0, .8) } .customDreamContainer .customDreamBgHolder img, .farmHouseDetailContainer .farmHouseDetailBgHolder img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .customDreamContainer .customDreamHolder { position: relative; z-index: 1; color: #fff; padding: 90px 0 } .customDreamContainer .customDreamContentHolder { display: flex; text-align: left; margin-left: -40px; margin-right: -40px; padding-top: 40px; padding-bottom: 40px } .customDreamContainer .customDreamContentHolder .customDreamLeftSec { padding: 0 60px 0 40px; width: 50%; position: relative } .customDreamContainer .customDreamContentHolder .customDreamLeftSec h6 { color: #fff; margin: 0 } .customDreamContainer .customDreamContentHolder .customDreamLeftSec h4 { color: #51ad29; margin: 0; font-style: italic } .customDreamContainer .customDreamContentHolder .customDreamLeftSec::before { content: ''; position: absolute; right: 20px; top: 0; bottom: 0; background: url(/images/custom-dream-sep.png?ab6387886e9bad1e625fff00fdea6892) center center no-repeat; width: 14px } .customDreamContainer .customDreamContentHolder .customDreamRightSec { padding: 0 40px; width: 50%; position: relative } .customDreamContainer .customDreamContentHolder .customDreamRightSec h6 { color: #fff; margin: 10px 0 } .customDreamContainer .costEffectiveContainer { position: absolute; top: 100%; transform: translateY(-50%); left: 0; width: 100% } .customDreamContainer .costEffectiveContainer .costEffectiveSec { background: #3a7b1d; padding: 35px 100px; display: flex; text-align: left; align-items: center } .customDreamContainer .costEffectiveContainer .costEffectiveSec h2 { color: #fff; margin: 0; font-size: 26px; padding-right: 50px } .designerEnvisionContainer .designerEnvisionSec h4 { color: #398beb } .designerEnvisionContainer .designerEnvisionSec .designerEnvisionCallout { display: flex; flex-direction: column; margin: 40px 0 } .designerEnvisionContainer .designerEnvisionSec .designerEnvisionCallout i { height: 65px; display: flex; align-items: center; justify-content: center; margin-bottom: 25px } .designerEnvisionContainer .designerEnvisionSec .designerEnvisionCallout h3 { font-size: 20px } .homeFloorPlanContainer { padding: 90px 0; background: url(/images/floor-plan-bg.jpg?d559d01764f5706f6c19a0a474acee1e) center right no-repeat #f7f9fb } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0; padding: 0; list-style-type: none } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li { max-width: 558px; display: flex; margin: 38px 0 } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li i, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i { background: #fff; width: 110px; height: 110px; display: flex; align-items: center; justify-content: center; margin-right: 30px } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li .floorPlanContent, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent { width: calc(100% - 140px) } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li .floorPlanContent h6 { font-size: 20px; margin-bottom: 10px; line-height: 20px } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li .floorPlanContent p { margin-bottom: 0; line-height: 28px } .onlineHouseBenefitsContainer .onlineHouseBenefitsSec h4 { color: #398beb; font-size: 22px } .housePlanFeatureCard .relatedList, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder { margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: column } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li { margin: 0; padding: 30px 0 15px; text-align: left; border-bottom: 1px solid #eaeaea } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li:last-child { border-bottom: 0; padding-bottom: 0 } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList { margin: 0; padding: 0; display: flex } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent p { font-size: 18px } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent h6 { font-style: italic; font-size: 20px; font-family: var(--family-lato); font-weight: var(--weight-600) } .purchaseOnlinePlanContainer { padding: 90px 0 70px; background: #3b8beb } .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul { display: flex; flex-wrap: wrap; list-style-type: none; margin: 0; padding: 0; text-align: left } .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul li { width: 33.3333%; padding: 0 0 0 30px; position: relative; font-size: 20px; margin: 5px 0 } .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul li::before { content: ''; width: 8px; height: 8px; border-radius: 100%; display: block; position: absolute; left: 0; top: 12px; background: rgba(255, 255, 255, .4) } .costBuiltCalcSec { background: #3b8beb; padding: 5rem 0 } .costBuiltCalcSec .contentSp h5 span { padding: 0 3px; background: #fff; color: #3b8beb } .costCalcList { list-style: none; padding: 0; margin: 60px 0; display: flex; flex-wrap: wrap; justify-content: center } .costCalcList li { width: calc(100% / 6); padding: 20px 15px; color: #fff; font-size: 18px; height: inherit; display: flex; flex-direction: column; justify-content: center; border-color: #4f97ed !important; border-right: 1px solid #61a2ef } .costCalcList li img { display: block; margin: 0 auto 10px } .costCalcList li span { width: -webkit-min-content; width: -moz-min-content; width: min-content; margin: 0 auto; line-height: 20px } .costCalcList li:nth-child(-n+6) { border-bottom: 1px solid #61a2ef } .costCalcList li:last-child, .costCalcList li:nth-child(6n), .housePlanSliderActionoHolder ul li:last-child { border-right: 0 } footer p { font-size: 14px; color: #23303a; margin: 0 } .footerBlockHolder { display: flex; justify-content: space-between; margin: 0 -15px; align-items: flex-start; flex-wrap: wrap; padding: 5rem 0; border-bottom: 1px solid #dfdfdf } .footerBlockHolder h6 { font-size: 13px; font-family: var(--family-montserrat) } .adviceSection a, .blogDetailContentSec h2, .blogSection .blogDesc, .footerNavBlock ul li a, .terms, .terms h4, .terms ol li { font-family: var(--family-lato) } .footerSearchBlock { flex: 0 0 380px } .footerSearchBlock .input-group, .housePlans-Slider { margin-top: 30px } .footerSearchBlock .input-group .form-control { height: calc(2.5em + .75rem + 2px) } .footerSearchBlock .input-group .btn { padding-top: .75rem; padding-bottom: .75rem } .cardImgSec { margin: 20px -5px; display: flex; align-items: center; flex-wrap: wrap } .cardImgSec span { max-width: 33.33%; padding: 0 5px } .adviceSection a { font-size: 22px; color: #3b8beb; display: flex; align-items: center; margin-top: 15px } .adviceSection a i { margin-right: 10px; display: flex } .footerSearchBlock .topSearchSec .form-control { min-width: auto } .footerNavBlock { display: flex; flex-wrap: wrap; max-width: 390px; flex-direction: column } .footerNavBlock ul { flex: 0 0 100%; max-width: 100%; list-style: none; padding: 0; margin: 0 } .footerNavBlock ul li { padding-top: 8px; padding-bottom: 8px } .footerNavBlock ul li a { text-decoration: none; color: #23303a; font-size: 15px } .footerNavBlock ul.double-inner { display: flex; flex-wrap: wrap; margin: 0 -10px } .footerNavBlock ul.double-inner li { width: 50%; padding-left: 10px; padding-right: 10px } .footerBottomSec { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 -15px; padding: 30px 0 } .footerBottomSec p a { color: #23303a; text-decoration: none } .footerBottomSec ul { list-style: none; margin: 0; display: flex; align-items: center; padding-right: 0 } .footerBottomSec ul li { padding: 0 30px } .blogSection .blogDesc, .footerBottomSec ul li:last-child, .housePlanHeaderBlock .downloadIcon i { padding-right: 15px } .byPlan-wrapper, .myAccount-wrapper, .pg { padding: 50px 0 } .banner { position: relative; min-height: 500px; display: flex; align-items: center; justify-content: center; flex-direction: column; margin-bottom: 30px } .banner::after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5) } .banner .banner-img { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0 } .banner .banner-img img, .testimonialList li .testimonial .author .a-img img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } .banner .banner-text { padding: 3rem 0; width: 100%; text-align: center; position: relative; z-index: 1 } .banner .banner-text .desc, .housePlanSliderActionoHolder ul li a span, .tableSets>tbody>tr>td:not(:first-child), .tableSets>thead>tr>th { text-align: center } .banner .banner-text .desc h2 { font-size: 73px; margin: 0; color: #fff; font-family: var(--family-montserrat) } .banner .banner-text .desc .btn { min-width: 190px } .banner.bannerBlank .banner-text .desc h2 { font-size: 32px } .banner.bannerBlog .banner-text .desc h2 { font-size: 50px } .banner.bannerBlank { height: auto; background: 0 0; min-height: auto; margin: 0 } .banner.bannerBlank .banner-text { padding: 1.5rem 0 } .terms { color: #444 } .terms h4 { font-size: 22px; margin: 15px 0 5px } .terms p { font-size: 18px; margin: 0 0 10px } .terms p+h4 { margin-top: 35px } .terms ol { list-style-type: none; counter-reset: li; padding: 0; margin: 0 0 10px } .blogDetailContentSec ul, .detailContentListholder { counter-reset: my-sec-counter } .terms ol li { position: relative; padding: 10px 0; font-size: 22px } .terms ol li:before { counter-increment: li; content: counter(li, decimal-leading-zero); margin-right: 1.25em } .test-par { display: flex; flex-wrap: wrap; justify-content: space-between } .testimonialList { list-style: none; padding: 0; margin: 0; max-width: 45% } .blogContentHolder, .contactSec { margin-left: -15px; margin-right: -15px; display: flex } .testimonialList li { width: 100%; padding: 30px 0 130px } .testimonialList li .testimonial { padding-bottom: 35px; padding-left: 30px; position: relative; background: #f7f9fb } .testimonialList li .testimonial:after { content: ''; position: absolute; left: 30px; top: -25px; bottom: 0; height: calc(100% - 30px + 30px); width: 2px; background: #e9eef3; margin: auto; z-index: 0 } .testimonialList li .testimonial .quoteSign { width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; z-index: 1; top: -30px; border-radius: 100%; background: #fff; box-shadow: 1px 6px 20px 0 rgba(0, 0, 0, .2) } .testimonialList li .testimonial .desc { padding: 50px 30px 15px 20px } .testimonialList li .testimonial p { font-family: var(--family-lato); font-weight: var(--weight-400); font-size: 18px; color: #1f2c3d; margin: 0; line-height: 34px } .testimonialList li .testimonial .author { display: flex; align-items: center; position: absolute; top: calc(100% - 26px); left: 20px; right: 0 } .testimonialList li .testimonial .author .a-img { width: 90px; height: 90px; border-radius: 100%; overflow: hidden; margin-right: 15px } .testimonialList li .testimonial .author p { font-size: 20px; margin: 23px 0 0; color: #0a54a5 } .blogSection { display: flex; flex-direction: column; width: 50%; padding: 0 15px } .blogSection .blog { padding: 10px; width: 100%; border: 1px solid #f8fafb; border-radius: 10px; margin-bottom: 45px } .blogSection .blog .blogSp { padding: 10px; width: 100%; border-radius: 10px; background: #f7f9fb } .blogSection .blogImg { width: 100%; margin-bottom: 15px } .blogSection .blogDesc h5 { font-size: 22px; color: #444 } .blogSection .blogDesc a { text-decoration: none; color: #003f97; font-size: 16px } .blogDetailContentSec h2 { font-size: 26px; color: #333; margin-top: 2rem; display: flex; align-items: flex-start } .blogDetailContentSec p { font-size: 18px; color: #444; margin: 10px 0 } .blogDetailContentSec p span { color: #003f97 } .blogDetailContentSec img { max-width: 100%; margin: 10px 30px 10px 0; float: left } .blogDetailContentSec ul, .contactInfoSec ul, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock ul, .housePlanFeatureCard .featureBadgeList, .housePlanFieldSetHolder ul, .housePlanSliderHolder ul, .productFilterRefineSec .featureBadgeListHolder .featureBadgeList { margin: 0; padding: 0; list-style-type: none } .blogDetailContentSec ul li { font-size: 22px; color: #444; margin: 22px 0; display: flex; align-items: flex-start } .blogDetailContentSec ul li:before, .detailContentList h2:before { padding-right: 10px; counter-increment: my-sec-counter; content: counter(my-sec-counter) ". " } .sidebar { width: 100%; background: #f7f9fb } .sidebar .sidebar-title { background: #1f2c3d; padding: 10px 85px 10px 30px; position: relative; margin-bottom: 13px } .sidebar .sidebar-title .mhpLogo { width: 70px; height: 70px; position: absolute; right: 15px; top: 50%; transform: translateY(-50%) } .sidebar .sidebar-title h2 { color: #fff; margin: 0; font-size: 20px } .contactInfoSec h3, .contactSec .contactContentSec h3 { font-size: 48px; font-family: var(--family-montserrat); font-weight: var(--weight-700) } .housePlans-Slider ul, .sidebar .sidebar-body ul { list-style: none; padding: 0; margin: 0 } .sidebar .sidebar-body ul li { border-bottom: 1px solid #e9eef3 } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock ul li:last-child, .costBuiltFaq .faqSec .card:last-child, .housePlanDetailPageContentHolder ul.faq li:last-child, .instantCostBuildFaqSec .faqSec .card:last-child, .sidebar .sidebar-body ul li:last-child { border-bottom: 0 } .sidebar .sidebar-body ul li a { padding: 14px 20px; text-decoration: none; display: flex; align-items: center; color: #424251; font-size: 14px } .sidebar .sidebar-body ul li a .fa { margin-right: 15px; color: #9797a6 } .sidebar+.sidebar { margin-top: 50px } .blogContentSec { width: 71%; padding: 0 30px 0 15px } .blogInfoListSec { width: 29%; padding: 0 15px } .contactContainer { padding: 40px 0 70px } .contactLeftSec, .contactRightSec { padding: 0 15px; width: 50% } .contactRightSec { display: flex; justify-content: center } .contactSec .contactContentSec h3 { color: #131f2b; margin: 0 0 2.7rem } .contactSec .contactContentSec h3:after { content: ''; width: 251px; height: 1px; background: #194982; display: inline-block; margin-left: 25px } .contactSec .contactContentSec p { font-size: 26px; color: #131f2b; margin: 0 0 2.7rem; font-family: var(--family-lato); font-weight: var(--weight-600) } .contactSec .contactFormSec { max-width: 430px; width: 100% } .contactSec .contactFormSec ul { margin: 0 0 3rem; padding: 0; list-style-type: none } .contactSec .contactFormSec ul li { margin: 0 0 20px; padding: 0; list-style-type: none } .contactSec .contactFormSec .form-control { border-radius: 0; border-width: 0 0 1px; font-size: 16px; height: calc(3.5em + .75rem + 2px); padding-left: 0; padding-right: 0 } .contactSec .contactFormSec .form-control:focus { box-shadow: none } .contactSec .contactFormSec textarea.form-control { height: 110px; resize: none } .contactSec .contactFormSec .btn { min-width: 10rem } .contactMapContainer>img { width: 100%; position: relative; height: 782px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .contactMapSec { position: relative; z-index: 1 } .contactInfoSec { position: absolute; background: rgba(255, 255, 255, .15); padding: 20px; top: 65px; left: 0; display: flex; flex-direction: column; align-items: center; width: 500px } .contactInfoSec ul li { font-size: 22px; color: #fff; font-family: var(--family-lato); display: flex; align-items: flex-start; line-height: 45px; margin: 35px 0 } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent li, .keyElementSec ul li { font-size: 20px; max-width: 550px; font-weight: var(--weight-600); text-align: left; font-family: var(--family-lato); width: 50%; position: relative } .contactInfoSec ul li i { display: flex; align-items: center; margin-right: 20px; width: 22px; height: 45px } .contactInfoSec ul li b { font-size: 30px; color: #fff; font-family: var(--family-lato); font-weight: 400 } .contactInfoSec h3 { color: #fff; margin: 0; text-align: center } .farmHouseDetailContainer .farmHouseDetailHolder { position: relative; z-index: 1; color: #fff; padding: 90px 0 70px } .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent { display: flex; margin-left: -50px; margin-right: -50px; text-align: left } .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent .farmHouseDetailLeftSec, .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent .farmHouseDetailRightSec { padding: 0 50px; width: 50% } .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent .farmHouseDetailRightSec p { font-style: italic } .keyElementContainer { background: #f7f9fb; padding: 90px 0 70px } .keyElementSec ul { display: flex; flex-wrap: wrap; list-style-type: none; align-items: flex-start; margin: 0 0 2rem; padding: 0; justify-content: space-between } .keyElementSec ul li { color: #131f2b; padding: 0 0 0 30px; margin: 10px 0 } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent li::before, .keyElementSec ul li::before { content: ''; width: 8px; height: 8px; border-radius: 100%; display: block; position: absolute; left: 0; top: 12px; background: #3b8beb } .housePlanDetailPageContainer, .interiorExteriorContainer .interiorExteriorSec { padding: 20px 0 } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow { padding: 70px 0; display: flex; margin: 0 -35px; align-items: center } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow:nth-child(2n+2) { flex-direction: row-reverse } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder { width: 50%; padding: 0 35px } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent h4 { font-family: var(--family-lato); font-weight: var(--weight-600); color: #398beb } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent ul { display: flex; flex-wrap: wrap; list-style-type: none; align-items: flex-start; margin: 0; padding: 0; justify-content: space-between } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent li { color: #131f2b; padding: 0 0 0 30px; margin: 5px 0 } .onlineHouseBenefitsContainer.farmHouseStyleContainer { background: #f7f9fb; padding-bottom: 70px } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i { width: 160px; height: 160px; background: 0 0; margin-right: 40px } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i img { width: 160px; height: 160px; border-radius: 100% } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent { width: calc(100% - 200px) } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li:last-child { padding-bottom: 15px } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder { margin-bottom: 3rem } .faqContainer { padding: 40px 0 80px } .faqSec .card { border-left: 0; border-right: 0; border-radius: 0 } .faqSec .card .card-header { padding: 0; background: 0 0; border: 0 } .faqSec .card .card-header .btn { font-size: 22px; text-decoration: none; font-family: var(--family-lato); font-weight: var(--weight-600); padding: 1.4rem 5rem 1.4rem 40px; text-transform: initial; color: #1f2c3d; position: relative; width: 100%; white-space: initial; text-align: left } .faqSec .card .card-header .btn::before { content: 'Q'; font-family: var(--family-lato); font-weight: var(--weight-700); font-size: 26px; color: #0a56a5; position: absolute; left: 0; top: 18px } .faqSec .card .card-header .btn::after { content: '-'; font-family: var(--family-montserrat); font-weight: var(--weight-600); font-size: 26px; color: #3a7b1d; position: absolute; right: 0; top: 22px } .faqSec .card .card-header .btn.collapsed::after { content: '+' } .faqSec .card .card-body { padding: 0 5rem 15px 0; font-size: 16px; color: #1f2c3d; font-family: var(--family-lato); line-height: 30px } .housePlanDetailPageSec .housePlanDetailTitleHolder { display: flex; align-items: flex-end; margin: 30px 0 } .housePlanDetailPageSec .housePlanDetailTitleHolder p { color: #666; font-size: 16px; margin: 0 0 10px } .housePlanDetailPageSec .housePlanDetailTitleHolder p span { color: #1f2c3d; font-family: var(--family-lato); font-weight: var(--weight-600) } .housePlanDetailPageSec .housePlanDetailTitleHolder h2 { font-size: 26px; color: #333; font-family: var(--family-lato); font-weight: var(--weight-600); margin: 0 } .housePlanDetailTitleHolder .housePlanDetailTitleRightSec { margin-left: auto; display: flex; align-items: center } .housePlanDetailTitleHolder .housePlanDetailTitleRightSec>span { font-size: 13px; color: #3b8beb; font-family: var(--family-montserrat); font-weight: var(--weight-600); padding: 0 15px } .housePlanDetailTitleHolder .housePlanDetailTitleRightSec a.twitter { width: 40px; height: 40px; border-radius: 100%; border: 1px solid #eee; display: flex; align-items: center; justify-content: center; margin: 0 10px } .housePlanDetailTitleHolder .housePlanDetailTitleRightSec a.twitter svg { width: 50%; height: 50% } .housePlanDetailTitleHolder .housePlanDetailTitleRightSec a.twitter svg path { fill: #444 } .housePlanSliderHolder { width: 100%; margin: 0; padding: 0; position: relative } .housePlanSliderHolder .slider-for { border: 1px solid #ddd } .slider-for .slick-arrow { position: absolute; top: 50%; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .5); border-radius: 0; transform: translateY(-50%); border: 0; z-index: 1; transition: .5s } .slider-for .slick-arrow:hover { background: rgba(0, 0, 0, .75) } .housePlanSliderHolder .slider-for li { display: flex; align-items: center; justify-content: center; height: inherit } .housePlanSliderHolder .slider-nav li { padding: 15px 5px } .housePlanSliderHolder .slider-nav li iframe, .housePlanSliderHolder .slider-nav li img, .housePlanSliderHolder .slider-nav li video { max-width: 100%; height: 90px; -o-object-fit: cover; object-fit: cover; border: 4px solid transparent; margin: 0 auto } .housePlanSliderHolder .pgwSlideshow .ps-list li .ps-item.ps-selected, .housePlanSliderHolder .slider-nav li.slick-current img { border-color: #3b8beb } .housePlanSliderHolder .slider-nav .slick-arrow { background: 0 0; border: 0; padding: 5px; box-shadow: none } .housePlanSliderHolder .slider-nav .slick-arrow .fa { font-size: 24px; color: #ccc } .housePlanSliderHolder .slider-for .slick-arrow .fa { font-size: 30px; color: #ccc } .housePlanSliderHolder .slider-nav .slick-arrow:hover .fa:before { border-color: #9e9e9e } .featured-plan-carousel.sliderSec ul li:after, .housePlanSliderHolder .slider-nav .slick-arrow:focus, .housePlanSliderHolder .slider-nav .slick-arrow:hover { background: 0 0 } .housePlanSliderHolder ul img { max-height: 800px } .housePlanSliderHolder .pgwSlideshow { background: 0 0; box-shadow: none } .housePlanSliderHolder .pgwSlideshow .ps-list { background: 0 0; box-shadow: none; border-top: 0; padding: 0 25px } .housePlanSliderHolder .pgwSlideshow .ps-list::before, .housePlanSliderHolder .pgwSlideshow .ps-list:after { content: ''; background: #fff; height: 100%; width: 25px; position: absolute; top: 0; z-index: 2 } .housePlanSliderHolder .pgwSlideshow .ps-list li img { width: 145px; height: 90px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; border: 0 } .housePlanSliderHolder .pgwSlideshow .ps-list .ps-prev { width: 25px; border-radius: 0; padding-left: 0; padding-right: 0; background: 0 0; border: 0; top: 32px } .housePlanSliderHolder .pgwSlideshow .ps-list .ps-prev .ps-prevIcon { width: 8px; height: 14px; background: url(../img/arrow-left.png?f739853f0183aae2f300438bec984ddf) center center no-repeat; border: 0 } .housePlanSliderHolder .pgwSlideshow .ps-list .ps-next { width: 25px; border-radius: 0; padding-left: 0; padding-right: 0; background: 0 0; border: 0; text-align: right; top: 32px; z-index: 8 } .housePlanSliderHolder .pgwSlideshow .ps-list .ps-next .ps-nextIcon { width: 8px; height: 14px; background: url(../img/arrow-left.png?f739853f0183aae2f300438bec984ddf) center center no-repeat; border: 0; transform: rotate(180deg); display: inline-block } .sliderReverseIcon { position: absolute; bottom: 0; right: 0; z-index: 5 } .housePlanDetailPageHolder { display: flex; margin: 0 -25px; padding: 40px 0; position: relative } .housePlanDetailPageHolder .housePlanDetailPageLeftSec { width: calc(100% - 390px); padding: 0 25px } .housePlanDetailPageHolder .housePlanDetailPageRightSec { padding: 0 25px; width: 390px; right: 0 } .housePlanDetailPageHolder .housePlanDetailPageRightSec .fixRight.stick .rightSec { height: calc(100vh - 130px); overflow: hidden } .housePlanDetailPageHolder .housePlanDetailPageRightSec .stick .featureCardSection { max-height: calc(100% - 300px); overflow: auto !important } .housePlanDetailPageHolder .housePlanDetailPageRightSec .slimScrollBar, .housePlanDetailPageHolder .housePlanDetailPageRightSec .slimScrollRail, .housePlanDetailPageHolder .housePlanDetailPageRightSec.stick .slimScrollRail { opacity: 0 !important } .housePlanSliderActionoHolder { background: #fff; margin-bottom: 3rem } .housePlanSliderActionoHolder ul { margin: 0; padding: 0; width: 100%; list-style-type: none; display: flex } .housePlanSliderActionoHolder ul li { border-right: 1px solid #eaeaea } .housePlanSliderActionoHolder ul li a { display: flex; flex-direction: column; align-items: center; font-size: 16px; color: #1f2c3d; font-family: var(--family-lato); font-weight: var(--weight-600); padding: 25px } .housePlanSliderActionoHolder ul li a i { width: 70px; height: 70px; border-radius: 100%; background: #f7f9fb; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; transition: .3s } .housePlanSliderActionoHolder.stick ul li a i { width: 0; height: 0; margin: 0 } .housePlanKeySpecsHolder, .orderCostBuildSec .wizard .steps { margin-bottom: 30px } .housePlanDetailPageContentHolder h4, .housePlanFieldSetHolder h4, .housePlanKeySpecsHolder h4, .relatedHousePlanThumbSec h4 { color: #333; font-size: 22px; font-family: var(--family-lato); font-weight: var(--weight-700); margin-top: 1.5rem; margin-bottom: 1rem } .housePlanKeySpecs { border: 1px solid #ddd; position: relative; padding: 2rem 1.5rem; width: 100%; margin: 3rem 0 0 } .housePlanFieldSetHolder .legend, .housePlanKeySpecs .legend { display: inline-block; position: absolute; left: 120px; top: 0; transform: translateY(-50%) } .housePlanFieldSetHolder .legend span, .housePlanKeySpecs .legend span { color: #fff; font-size: 22px; font-family: var(--family-lato); font-weight: var(--weight-700); background: #0a56a5; padding: 5px 25px; position: relative; z-index: 1 } .housePlanFieldSetHolder .legend:after, .housePlanKeySpecs .legend:after { content: ''; left: -25px; width: calc(100% + 50px); height: 100%; background: #fff; position: absolute; top: 0 } .housePlanKeySpecs ul { margin: 2rem 0 1rem; padding: 0; width: 100%; list-style-type: none; display: flex; align-items: center; justify-content: center; justify-content: space-between } .housePlanKeySpecs ul li { display: flex; flex-direction: column; align-items: center; padding: 0 25px } .housePlanKeySpecs ul li span { font-size: 16px; color: #1f2c3d; font-family: var(--family-lato); font-weight: var(--weight-600); text-align: center; margin-top: 1rem } .housePlanDetailPageContentHolder h3 { color: #0c58a5; font-size: 22px; font-family: var(--family-lato); font-weight: var(--weight-700); margin-top: 1.5rem; margin-bottom: 1rem } .housePlanDetailPageContentHolder h5 { color: #1f2c3d; font-size: 20px; font-family: var(--family-lato); font-weight: var(--weight-600); margin-top: 1.5rem; margin-bottom: 1rem } .housePlanDetailPageContentHolder p, .housePlanDetailPageContentHolder ul li, .housePlanDetailPageContentHolder ul.foundation li span { font-size: 16px; font-weight: var(--weight-600); font-family: var(--family-lato) } .housePlanDetailPageContentHolder ul { margin: 0 0 1rem; padding: 0; width: 100%; list-style-type: none; display: flex; flex-direction: column } .housePlanDetailPageContentHolder ul li { color: #1f2c3d; position: relative; padding-left: 30px; margin: 10px 0 } .housePlanDetailPageContentHolder ul li:after { content: ''; width: 8px; height: 14px; background: url(/images/arrow-left.png?f739853f0183aae2f300438bec984ddf) center center no-repeat; border: 0; transform: rotate(180deg); display: inline-block; position: absolute; left: 0; top: 6px } .housePlanDetailPageContentHolder p { color: #1f2c3d; margin-bottom: 12px } .housePlanDetailPageCard .housePlanCardBody table th, .housePlanDetailPageContentHolder p strong, .housePlanDetailPageContentHolder ul.faq li h4:after, .housePlanDetailPageContentHolder ul.foundation li, .housePlanHeaderBlock h4 { font-weight: var(--weight-700); font-family: var(--family-lato) } .housePlanDetailPageContentHolder p strong { color: #0c58a5; font-size: 22px } .housePlanDetailPageContentHolder p a { color: #0c58a5 } .housePlanDetailPageContentHolder ul.foundation { flex-wrap: wrap; flex-direction: row; margin-bottom: 2rem } .housePlanDetailPageContentHolder ul.foundation li { padding: 0; width: 50%; color: #0c58a5; font-size: 22px } .housePlanDetailPageContentHolder ul.foundation li span { color: #1f2c3d } .housePlanDetailPageContentHolder ul.faq li { border-bottom: 1px solid #eee; padding: 0 0 15px } .housePlanDetailPageContentHolder ul.faq li h4 { padding-left: 40px; margin-top: 0; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 22px; color: #1f2c3d; line-height: 34px } .housePlanDetailPageContentHolder ul.faq li h4:after { content: 'Q'; font-size: 26px; color: #0a56a5; position: absolute; left: 0; top: 2px; background: 0 0; transform: translate(0) } .housePlanDetailPageContentHolder ul.faq li p, .multiselect-native-select .dropdown-menu .form-check-label { font-family: var(--family-lato); font-weight: var(--weight-400) } .housePlanHeaderBlock { display: flex; background: #f7f9fb; padding: 17px 20px; align-items: center; justify-content: space-between } .housePlanHeaderBlock h4 { margin: 0; color: #333; font-size: 22px } .housePlanHeaderBlock .downloadIcon { text-transform: uppercase; color: #3b8beb; font-size: 14px; display: flex; align-items: center; font-family: var(--family-lato); font-weight: var(--weight-600) } .housePlanFieldSetHolder { border: 1px solid #ddd; position: relative; padding: 2rem 2.5rem; width: 100%; margin: 3rem 0 4rem } .housePlanFieldSetHolder ul li { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 1rem } .housePlanFieldSetHolder ul li img { transition: .25s; margin: 1rem auto; max-width: 100% } .flipImage img, img.flipImage { transform: scaleX(-1) } .housePlanDetailPageCard { padding: 0 20px; background: #f7f9fb } .housePlanDetailPageCard .housePlanHeaderBlock h4 { margin: 1rem 0 } .housePlanDetailPageCard .housePlanCardBody table { width: 100%; table-layout: fixed; margin-bottom: 3rem } .housePlanDetailPageCard .housePlanCardBody table td, .housePlanDetailPageCard .housePlanCardBody table th { width: 33.333%; min-height: 110px; padding: 15px 25px; background: #fff } .housePlanDetailPageCard .housePlanCardBody table th { color: #1f2c3d; font-size: 22px; text-align: center } .housePlanDetailPageCard .housePlanCardBody table tr:nth-child(odd) th { background: #1f2c3d; color: #fff } .housePlanDetailPageCard .housePlanCardBody table tr:nth-child(2n+2) td { background: #ebf0f5 } .housePlanDetailPageCard .housePlanCardBody table td { padding-left: 30px } .housePlanDetailPageCard .housePlanCardBody table td p { margin: 0; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 16px; color: #1f2c3d; line-height: 30px; white-space: nowrap } .relatedHousePlanThumbSec { padding-bottom: 2rem } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder { margin: 0 -5px; display: flex; flex-wrap: wrap } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb { width: calc(33.3333% - 10px); margin: 5px; position: relative } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb img { width: 100%; height: 250px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb span { position: absolute; bottom: 10px; right: 0; background: rgba(10, 86, 165, .8); padding: 1px 30px; color: #fff; font-size: 22px; font-family: var(--family-lato); font-weight: var(--weight-700) } .relatedHousePlanThumbSec .btnHolder { text-align: center; padding-top: 1.5rem } .relatedHousePlanThumbSec .btnHolder .btn { min-width: 130px } .housePlanFeatureCard { background: #f7f9fb; margin-bottom: 30px } .housePlanFeatureCard h4 { color: #fff; font-size: 21px; font-family: var(--family-montserrat); font-weight: var(--weight-600); background: #1f2c3d; padding: 13px 20px; margin: 0 } .housePlanFeatureCard .featureBadgeList li h5, .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li h5 { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 18px; color: #1f2c3d; margin: 0 0 10px } .housePlanFeatureCard .featureBadgeList li a, .housePlanFeatureCard .relatedList li a { font-size: 14px; color: #666; font-weight: var(--weight-600); font-family: var(--family-lato) } .housePlanFeatureCard .featureBadgeList li a { margin: 0 15px 10px 0; background: #e1e9f0; display: inline-block; padding: 4px 15px; border-radius: 15px; pointer-events: none } .housePlanFeatureCard .relatedList li { margin: 10px 0 } .housePlanFeatureCard .relatedList li a { position: relative; display: block } .housePlanFeatureCard .relatedList li a:after { content: ''; width: 8px; height: 14px; background: url(/images/arrow-left.png?f739853f0183aae2f300438bec984ddf) center center no-repeat; border: 0; transform: rotate(180deg); display: inline-block; position: absolute; right: 0; top: 4px } .selectPlanFormHolder { background: #f7f9fb; margin-bottom: 20px; display: flex; align-items: center; padding: 0 } .selectPlanFormHolder .selectPlanFormSec { padding: 0 10px; width: 100% } .selectPlanFormHolder .selectPlanFormSec .form-control { background-color: transparent; border-radius: 0; border-width: 0 0 1px; font-size: 15px; color: #1f2c3d; background-position: 100% center } .selectPlanFormHolder .selectPlanFormSec .form-control:first-child { margin-top: 5px } .selectPlanFormHolder .selectPlanFormSec .form-control:last-child { border-bottom: 0; margin-bottom: 5px } .selectPlanFormHolder .selectPlanAmountSec { padding: 0 10px; display: flex; flex-direction: column } .selectPlanFormHolder .selectPlanAmountSec p { font-size: 14px; color: #333; font-family: var(--family-lato); font-weight: var(--weight-400); text-align: center } .selectPlanFormHolder .selectPlanAmountSec p span { font-size: 22px; color: #3a8beb; font-family: var(--family-lato); font-weight: var(--weight-700) } .orderCostBuildSec .wizard { padding: 60px } .orderCostBuildSec .wizard .steps ul { margin: 0; padding: 0; width: 100%; display: flex; justify-content: center; list-style-type: none; justify-content: center } .orderCostBuildSec .wizard .steps ul li { position: relative; flex: auto; text-align: center } .orderCostBuildSec .wizard .steps ul li a { font-size: 18px; color: #d1d3d7; font-family: var(--family-lato); font-weight: var(--weight-600); text-align: center; padding: 0 25px; display: flex; flex-direction: column; width: auto; position: relative; z-index: 3 } .orderCostBuildSec .wizard .steps ul li a i { height: 80px; margin-bottom: 50px; display: flex; justify-content: center; align-items: flex-start } .orderCostBuildSec .wizard .steps ul li:after { content: ''; height: 30px; width: 30px; border: 4px solid #d1d3d7; border-radius: 100%; background: #fff; position: absolute; top: 80px; left: 50%; transform: translateX(-50%); z-index: 2 } .orderCostBuildSec .wizard .steps ul li::before { content: ''; height: 2px; width: 100%; background: #c0c2c7; position: absolute; top: 94px; left: -50% } .orderCostBuildSec .wizard .steps ul li.done a { color: #5d6174 } .orderCostBuildSec .wizard .steps ul li.done a i svg defs feFlood { flood-color: #5d6174 } .orderCostBuildSec .wizard .steps ul li.done:after { width: 50px; height: 50px; border: 0; top: 68px; background: url(/images/step-done.png?ff71cd5b92bdb135c1f4ecfdb5cb6186) center center no-repeat #5d6174 } .orderCostBuildSec .wizard .steps ul li.active a i svg defs feFlood, .orderCostBuildSec .wizard .steps ul li.current a { flood-color: #3a7b1d } .orderCostBuildSec .wizard .steps ul li.active:after, .orderCostBuildSec .wizard .steps ul li.current:after { width: 50px; height: 50px; border: 10px solid #3a7b1d; top: 68px } .orderCostBuildSec .wizard .steps ul li.i-empty a i { height: 50px; margin-bottom: 10px } .orderCostBuildSec .wizard .steps ul li.i-empty:after { top: 12px } .orderCostBuildSec .wizard .steps ul li.i-empty::before { top: 25px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder { background: #f7f9fb; padding: 0 120px 60px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group { margin-bottom: 2.6rem } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group label { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 22px; color: #1f2c3d } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group .form-control { font-size: 16px; height: calc(2.9em + .75rem + 2px) } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder h3 { color: #0651a0; font-size: 26px; font-family: var(--family-lato); font-weight: var(--weight-700); margin: 2.2rem 0 1.7rem } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .btnHolder { padding-top: 2rem; padding-bottom: 1rem; display: flex; align-items: center } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .btnHolder .link { font-size: 16px; font-family: var(--family-lato); font-weight: var(--weight-700); color: #003f97; margin-right: 15px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control-label::after, .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control-label::before { top: 8px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control-label::before { background: 0 0; border-color: #1f2c3d } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-radio .custom-control-input:checked~.custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23000'/%3e%3c/svg%3e") } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead { display: flex; align-items: flex-end; justify-content: space-between } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead h4 { font-size: 48px; font-family: var(--family-montserrat); font-weight: var(--weight-700); color: #1f2c3d; margin: 0; line-height: 72px } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead p span { font-size: 48px; font-family: var(--family-montserrat); font-weight: var(--weight-700); color: #3a7b1d } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead p b { font-size: 22px; font-family: var(--family-montserrat); font-weight: var(--weight-700); color: #131f2b; padding-right: 20px; text-decoration: line-through } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormImgHolder { display: flex; align-items: flex-end; flex-direction: column } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormImgHolder img { width: 100%; max-height: 361px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormImgHolder span { font-size: 22px; font-family: var(--family-lato); font-weight: var(--weight-700); color: #0a55a5; margin: 1rem 0 1.5rem } .orderCostBuildSec .wizard .wizardBody .billingAndPaymentSec .ShippingAmountList { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin: 0 -15px 1rem } .orderCostBuildSec .wizard .wizardBody .billingAndPaymentSec .ShippingAmountList label span { color: #666; padding-left: 10px } .risk { color: #c6022c !important } .green { color: #3a7b1d !important } .buildCostContainer, .buildCostTabContainer { padding: 70px 0 0 } .buildCostContainer .nav-tabs { justify-content: center; border: 0; padding-left: 15px; padding-right: 15px } .buildCostContainer .nav-tabs .nav-link { border-color: #f0f0f0; border-radius: 0; padding: .85rem 2rem; font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-700); color: #878787 } .buildCostTabContainer h2 { font-size: 48px; color: #131f2b; font-family: var(--family-montserrat); font-weight: var(--weight-700); text-align: center; margin-bottom: 2.5rem } .buildCostTabContainer h3 { font-size: 26px; color: #131f2b; font-family: var(--family-lato); font-weight: var(--weight-600); text-align: center; margin-bottom: 1rem } .instantCostBuildSec .bulletList { display: flex; list-style-type: none; margin: 0; padding: 0; text-align: left; flex-direction: column } .instantCostBuildSec .bulletList li { padding: 0 0 0 30px; position: relative; font-family: var(--family-lato); font-weight: var(--weight-400); font-size: 16px; margin: 10px 0; color: #1f2c3d } .instantCostBuildSec .bulletList li::before { content: ''; width: 8px; height: 8px; border-radius: 100%; display: block; position: absolute; left: 0; top: 9px; background: #2f83e8 } .instantCostBuildSec .decimalList { display: flex; list-style-type: none; margin: 0; padding: 0; text-align: left; flex-direction: column; counter-reset: section } .instantCostBuildSec .decimalList li { padding: 0 0 0 50px; position: relative; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 16px; margin: 10px 0; color: #1f2c3d; line-height: 30px } .instantCostBuildSec .decimalList li::before { counter-increment: section; content: counter(section); width: 30px; height: 30px; border-radius: 100%; display: block; position: absolute; left: 0; top: 1px; background: #3a7b1d; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 16px; color: #fff; display: flex; justify-content: center; align-items: center } .instantCostBuildSec { text-align: center; margin-bottom: 70px } .instantCostBuildSec .buildCostSampleSec { display: flex; flex-direction: column; align-items: center; margin-bottom: 40px } .instantCostBuildSec .buildCostSampleSec>img { max-width: 100%; box-shadow: 0 0 50px 0 rgba(0, 0, 0, .2); margin: 10px 0 } .instantCostBuildSec .buildCostSampleSec h4 { font-size: 22px; color: #398beb; font-family: var(--family-montserrat); font-weight: var(--weight-600); text-align: center; margin: 55px 0; position: relative; padding: 0 35px } .instantCostBuildSec .buildCostSampleSec h4:after { content: ''; background: url(/images/eg-arrow.png?234384ce22cd18866e94419602fb9893) center center no-repeat; width: 23px; height: 47px; position: absolute; right: 0; top: 100%; margin-top: -7px } .instantCostBuildSec .instantSubContainer { padding: 0 70px } .buildCostSampleReportSec { display: flex; background: #f7f9fb; overflow: hidden; margin: 80px 0 60px } .buildCostSampleReportSec .buildCostSampleReportThumb { padding: 15px 15px 15px 50px; width: 270px; position: relative; z-index: 1 } .buildCostSampleReportSec .buildCostSampleReportThumb img { box-shadow: 0 0 30px 0 rgba(0, 0, 0, .2) } .buildCostSampleReportSec .buildCostSampleReportContent { padding: 15px 90px 15px 120px; width: calc(100% - 270px); background: #3a7b1d; display: flex; align-items: center; justify-content: space-between; position: relative } .buildCostSampleReportSec .buildCostSampleReportContent h4 { color: #fff; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 26px; margin: 0 } .buildCostSampleReportSec .buildCostSampleReportContent:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -120px; width: 0; height: 0; border-top: 120px solid transparent; border-bottom: 120px solid transparent; border-left: 80px solid #2e6118 } .buildCostSampleReportSec .buildCostSampleReportContent:after { content: ''; position: absolute; left: -10px; top: 50%; margin-top: -120px; width: 0; height: 0; border-top: 120px solid transparent; border-bottom: 120px solid transparent; border-left: 80px solid #f7f9fb } .instantCostBuildFaqContainer { background: #3b8beb; color: #fff; padding: 70px 0 } .competitiveComparisionTableHolder table tbody tr:nth-child(odd), .costBuiltFaqAlert { background: #f7f9fb } .instantCostBuildFaqSec>h3 { font-size: 26px; color: #fff; font-family: var(--family-lato); font-weight: var(--weight-600); text-align: left } .instantCostBuildFaqSec .faqSec .card { background: 0 0; border-style: dotted; border-color: #ccc } .instantCostBuildFaqSec .faqSec .card .card-header .btn { padding-left: 0; color: #fff; font-size: 16px; font-family: var(--family-montserrat); font-weight: var(--weight-600); padding-top: 1rem; padding-bottom: 1rem } .instantCostBuildFaqSec .faqSec .card .card-header .btn::after { color: #ccc; top: 11px } .instantCostBuildFaqSec .faqSec .card .card-body { color: #fff; line-height: 26px } .instantCostBuildFaqSec .btnHolder { margin-top: 2rem } .instantCostBuildFaqSec .btnHolder .link { color: #fff; font-size: 20px; font-family: var(--family-lato); font-weight: var(--weight-700) } .competitiveComparisionTableHolder { margin: 70px auto; overflow: auto; max-width: 1110px } .competitiveComparisionTableHolder table thead tr th { color: #398beb; font-size: 18px; font-weight: var(--weight-600); text-align: center; white-space: nowrap; padding: 15px 2rem; height: 60px } .competitiveComparisionTableHolder table tbody tr td, .costBuiltFaqAlert { color: #404051; font-size: 16px; font-weight: var(--weight-400); font-family: var(--family-lato); text-align: center } .competitiveComparisionTableHolder table thead tr th:first-child i { min-width: 200px; display: block } .competitiveComparisionTableHolder table tbody tr td { white-space: nowrap; padding: 15px 2rem; height: 60px; width: 20%; border-left: 1px solid #e9eef3; border-bottom: 1px solid #e9eef3 } .competitiveComparisionTableHolder table tbody tr td:first-child { text-align: left; font-family: var(--family-lato); font-weight: var(--weight-600); white-space: normal; width: 60%; border-left: 0 } .costBuilQaulityLevelsHolder { margin: 70px 0 } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow { margin-bottom: 20px; display: flex; background: #f7f9fb } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle { background: #1f2c3d; padding: 20px; display: flex; align-items: center; width: 210px } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle h4 { color: #fff; font-size: 24px; margin: 0; font-family: var(--family-lato); font-weight: var(--weight-600) } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle h4 span { font-size: 16px } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent { width: calc(100% - 210px); padding: 30px 20px 20px } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListHolder, .mega-menu { display: flex; margin: 0 -10px } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock { margin: 0 10px; width: calc(33.3333% - 20px); background: #fff; border: 1px solid #e9eef3 } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock h6 { color: #1f2c3d; font-size: 16px; margin: 0; font-family: var(--family-lato); font-weight: var(--weight-700); background: #e4ebf1; padding: 12px 20px } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock ul li { margin: 0; padding: 12px 20px; list-style-type: none; border-bottom: 1px solid #e9eef3 } .costBuiltFaq .faqSec { margin: 30px 0 90px } .costBuiltFaqAlert { padding: 20px 90px; margin-top: 2rem } #show_additional_options, .dropdown-menu, .options p { font-size: 14px } .myAccount-wrapper .card { border: 1px solid #e3e7f4; background: #fff; box-shadow: 0 3px 5px rgba(0, 0, 0, .17376); margin: 15px 0; height: calc(100% - 30px) } .myAccount-wrapper .card .card-header { background: 0 0; border: 0; display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem .75rem } .myAccount-wrapper .card .card-header h4 { font-size: 20px; margin: 0; font-family: var(--family-lato); font-weight: var(--weight-600) } .myAccount-wrapper .purchaseFieldSet .form-group { margin-bottom: 1.5rem; position: relative; display: inline-block; width: 100% } .myAccount-wrapper .purchaseFieldSet .form-group .form-control+label { position: absolute; margin: 0; left: 0; bottom: 10px; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: .85rem; transition: .25s ease-in; padding: 0 10px 2px; border-radius: 100px; text-transform: capitalize } .myAccount-wrapper .purchaseFieldSet .form-group .form-control.has-val+label:not(.error), .myAccount-wrapper .purchaseFieldSet .form-group .form-control:focus+label { font-size: .75rem; color: #000; bottom: 100% } .myAccount-wrapper .card .card-header .btn { padding: .3rem .5rem; font-size: .7rem; letter-spacing: .1em; margin: 0; background: #dc3545 } .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border:after, .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border:before { content: ""; position: absolute; top: 0; left: 0; width: 0; height: 2px; background-color: #39f; transition: .3s } .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border:after { top: auto; bottom: 0; left: auto; right: 0 } .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border i:after, .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border i:before { content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #39f; transition: .4s } .myAccount-wrapper .purchaseFieldSet .form-group .form-control~.focus-border i:after { left: auto; right: 0; top: auto; bottom: 0 } .myAccount-wrapper .purchaseFieldSet .form-group .form-control:focus~.focus-border:after, .myAccount-wrapper .purchaseFieldSet .form-group .form-control:focus~.focus-border:before { width: 100%; transition: .3s } .myAccount-wrapper .purchaseFieldSet .form-group .form-control:focus~.focus-border i:after, .myAccount-wrapper .purchaseFieldSet .form-group .form-control:focus~.focus-border i:before { height: 100%; transition: .4s } .myAccount-wrapper .purchaseFieldSet .form-group .blueCheck { position: absolute; top: 0; right: 0; bottom: 0; background: #0a56a5; border: 0; box-shadow: none; color: #fff; font-size: .8rem; font-family: var(--family-lato); font-weight: var(--weight-700); text-transform: uppercase; letter-spacing: 1px } .myAccount-wrapper .card .linkList a { display: block; padding: 3px 0; font-size: .92rem; font-family: var(--family-lato); font-weight: var(--weight-600); text-decoration: none; color: #3a7b1d } .myAccount-wrapper .card .saved-items label, .myAccount-wrapper .card .saved-items p { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: .9rem } .selectPlanFormSec .purchase-option-wrapper .option-wrapper .btn { padding: .375rem .75rem; background-color: transparent; border-radius: 0; border-width: 0 0 1px; font-size: 15px; color: #1f2c3d; font-family: var(--family-lato); font-weight: var(--weight-400); border-color: #ebebeb; display: block; width: 100%; min-height: calc(2em + .75rem + 2px); font-weight: 400; line-height: 1.5; display: flex; align-items: center } .selectPlanFormSec .purchase-option-wrapper .option-wrapper .btn .pull-left { max-width: 60%; white-space: break-spaces; text-align: left } .selectPlanFormSec .purchase-option-wrapper .option-wrapper .dropdown-toggle::after { background-image: url(/images/nav-dropdown-arrow.png?b20f3fcc53762110e186c63358023c24); width: 14px; height: 8px; border: 0; background-repeat: no-repeat; margin-left: 9px } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; background-color: #fff; border: 1px solid rgba(0, 0, 0, .15); border-radius: 4px; box-shadow: 0 6px 12px rgba(0, 0, 0, .175); background-clip: padding-box } .multiselect-native-select .dropdown-item.active, .multiselect-native-select .dropdown-item:active, .purchase-option-wrapper .dropdown-menu li.selected { background: #ebebeb } .purchase-option-wrapper .dropdown-menu li { cursor: pointer; padding: 10px 15px; border-bottom: 1px solid #ebebeb; font-weight: 200; width: 100%; white-space: normal; margin: 0 } .purchase-option-wrapper .dropdown-menu li p { margin-bottom: 0; font-size: 12px; font-family: var(--family-lato); font-weight: var(--weight-400) } .options { display: inline-block; width: 100% } .purchase-option-wrapper .dropdown-menu li:hover { background: #f8f8f8 } .purchase-option-wrapper .dropdown-menu li.selected .icon-checkmark { display: inline } .purchase-option-wrapper .dropdown-menu li .icon-checkmark { color: #89b560; display: none; margin: 3px 3px 0 0 } .purchase-option-wrapper .dropdown-menu { top: 100% !important; width: 100% !important; transform: inherit !important; max-height: 59.2vh; overflow: auto } .purchase-option-wrapper .dropdown-menu li .clearfix .pull-right, [dir=rtl] .slick-slide { float: right } .highlighted-chkbox label, .purchase-option-wrapper .dropdown-menu li .clearfix { font-size: 13px } .color-red { color: #ca0202 } #additional-options .options { background: #fff; margin: 0; padding: 12px; border-bottom: 1px solid #e9e9e9; display: flex; font-size: 14px } #additional-options .options .pull-right { margin-left: auto; white-space: nowrap } #additional-options .options .pull-left { width: 69% } .options select, .options span input[type=checkbox] { margin-right: 8px } .options .pull-right.textSpacing { margin-top: 7px } #show_additional_options .caret { position: relative; top: 6px; transform: rotate(-360deg); transition: transform 450ms } .options select { border: 1px solid #e9e9e9; padding: 6px 8px; font-size: 14px } #show_additional_options.open .caret { transition: transform 450ms; transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg) } .check-new input[type=checkbox], .check-new label::before { width: 14px; height: 14px; top: 0; left: 0; margin-top: 3px; border-radius: 3px; position: absolute; cursor: pointer; border: 2px solid #959595; content: '' } .check-new label { position: relative; padding: 0 0 0 20px; margin: 0 } .span-new-line { display: block; padding-left: 20px } .selectPlanFormHolder { flex-direction: column } .selectPlanAmountSec .btn-buy { margin: 0 -10px } .selectPlanFormHolder .selectPlanAmountSec p { display: flex; justify-content: space-between; margin: 10px; align-items: center } .selectPlanFormHolder .selectPlanAmountSec p b { display: flex; align-items: center; font-weight: 400 } .selectPlanFormHolder .selectPlanAmountSec p b span { margin-left: 5px } @media (min-width:1640px) { .container-xxl { max-width: 1610px } } @media only screen and (max-width:991px) { .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li span, .navBarHolder .navbar .navbar-nav .nav-link { font-size: 16px } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li span br, .planFilterFieldSec>i, .topBarRightInfoSec .topSearchSec, .topBarleftInfoSec ul li:last-child span { display: none } .topBarleftInfoSec ul li:last-child { margin-left: auto } .navBarHolder .navbar .navbar-brand img { max-height: 60px } .navbar-light .navbar-toggler { border: 0; padding: 0 } .navbar-collapse { position: fixed; top: 0; left: 0; height: 100% !important; overflow: auto; background: #3b8beb; z-index: 9999; width: 100%; padding: 20px; display: block !important; transition: left .3s ease-in-out } .navbar-collapse.collapse { left: -100% } .navbar-collapse.collapse.show { left: 0 } .navBarHolder .navbar .navbar-nav { margin-left: 0; padding: 0 } .navBarHolder .navbar .navbar-nav .nav-link, .navbar-nav .dropdown-menu .dropdown-item { border-bottom: 1px solid #4f97ed; color: #fff; font-family: var(--family-montserrat); font-weight: var(--weight-600); padding: .8rem 1rem } .navBarHolder .navbar .navbar-nav .dropdown-toggle::after { height: 26px; float: right; background: url(/images/nav-dropdown-arrow-white.png?3e2058f3fbbd07316541538be44f2427) center center no-repeat } .navbar-nav .dropdown-menu { background: rgba(0, 0, 0, .2); box-shadow: none; border: 0; border-radius: 0; padding: 0 } .navbar-nav .dropdown-menu .dropdown-item { font-size: 14px } .navbar-nav .dropdown-menu .dropdown-item:hover { background: #4f97ed } .navbar-collapse .navbar-toggler { float: right } .navbar-collapse .navbar-toggler-icon { background: url(/images/navbar-cross.png?083f8c2dfec28d36dea7818fde4b069d) center center no-repeat } .navbar-collapse .topSearchSec { padding: 20px; display: flex; width: 100% } .navbar-collapse .topSearchSec .form-control { height: calc(2.6em + .75rem + 2px); min-width: auto } .navbar-collapse .topSearchSec .btn { padding: .25rem 1.2rem } .navbar-collapse .topSearchSec .btn i { margin: 0 } .browseHousePlan .browseContentSec { position: static; padding: 0; text-align: center } .browseHousePlan .browseContentSec .browseContentSecSp { width: 100%; padding: 0 } .browseHousePlanSec { width: 100%; margin-top: 2rem; margin-bottom: 1rem } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing { flex-wrap: wrap } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec .planViewListing li { width: 50%; margin-top: 2rem } .topBarleftInfoSec ul li p a { font-size: 18px } .footerBottomSec { flex-direction: column; align-items: center; text-align: center; margin: 0 } .footerBottomSec ul { padding: 0; width: 100%; justify-content: center } .footerBottomSec ul li { padding: 0 15px } .footerBottomSec p { margin-bottom: 1rem } .footerNavBlock { margin-top: 3rem } .footerSearchBlock { flex: auto; text-align: center } .footerSearchBlock .input-group .btn { padding-left: 1rem; padding-right: 1rem } .instantCostBuildSec .instantSubContainer { padding: 0 } .housePlanDetailPageHolder .housePlanDetailPageRightSec .fixRight.stick { position: static } .housePlanDetailPageHolder .housePlanDetailPageRightSec .fixRight.stick .rightSec { height: auto } .housePlanDetailPageHolder .housePlanDetailPageRightSec .stick .featureCardSection { max-height: max-content } } @media only screen and (max-width:767px) { .blogInfoListSec, .blogSection, .contactLeftSec, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle, .filterBtnHolder .btn, .housePlanProductHolder .productHolder, .makeUniqueSec .uniquePlanBlockHolder, .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent, .planFilterBtnSec .btn, .qucikAdviceSec .adviceBlockHolder .adviceBlock, .topBarleftInfoSec { width: 100% } .buildCostSampleReportSec .buildCostSampleReportContent:after, .buildCostSampleReportSec .buildCostSampleReportContent:before, .contactSec .contactContentSec h3:after, .contactSec .contactContentSec p br, .filtersActive .customDreamContainer, .filtersActive .designerEnvisionContainer, .filtersActive .farmHouseDetailContainer, .filtersActive .filterBtnHolder, .filtersActive .homeFloorPlanContainer, .filtersActive .housePlanFilterTabSec, .filtersActive .housePlanProductHolder, .filtersActive .interiorExteriorContainer, .filtersActive .keyElementContainer, .filtersActive .navbar .navbar-brand, .filtersActive .navbar .navbar-toggler, .filtersActive .onlineHouseBenefitsContainer, .filtersActive .productFilterRefineHolder>p, .filtersActive .purchaseOnlinePlanContainer, .filtersActive .qucikAdviceSec, .filtersActive .sliderSec, .housePlanDetailTitleHolder .housePlanDetailTitleRightSec, .productBrowseSlider:after, .productFilterRefineHolder .productFilterRefineSec, .sidebar .sidebar-title .mhpLogo, .sliderCaption .btn, .topBarRightInfoSec form { display: none } .sliderSec ul li .sliderCaption { width: 100%; min-height: 300px } .sliderSec ul li .sliderCaption h2 { font-size: 30px } .blogDetailContentSec h2, .housePlanDetailPageContentHolder h3, .housePlanDetailPageContentHolder h4, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent h5, .sliderSec ul li .sliderCaption p { font-size: 22px } .planFilterFieldSec { padding: 0 } .planFilterFieldSp { display: flex; flex-direction: column; padding: 26px } .planFilterFieldSp .planFilterFieldHolder { flex-wrap: wrap; margin: 0 -10px; width: auto } .planFilterFormGroup { max-width: 50% } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList .onlineHouseBenefitsContent, .planFilterBtnSec { width: 100%; margin-top: 1rem } .planFilterFormGroup.sqrFt .d-flex .form-control { max-width: inherit; margin-top: 10px } .filtersActive .productFilterRefineHolder .productFilterRefineSec .filterCard.accordion, .footerNavBlock, .qucikAdviceSec .adviceBlockHolder .adviceBlock+.adviceBlock { margin-top: 2rem } .planCalloutSec ul li:last-child, .sliderSec { margin-bottom: 0 } .sliderSec ul .arrow-left, .sliderSec ul .arrow-right { width: 20px; height: 20px } .sliderSec:not(.searchPage) ul li .sliderCaption { padding-bottom: 70px } .sliderSec ul li>img { height: 100% } .planFilterSec { top: -50px; transform: none; position: relative } .contentSp h3 { font-size: 32px } .contentSp h4, .contentSp h5, .costBuiltCalcSec .contentSp p { font-size: 18px; line-height: 30px } .contentSp p { line-height: 26px; margin-bottom: .9rem } .planCalloutSec ul { flex-wrap: wrap } .planCalloutSec ul li { max-width: 100%; width: 100%; margin-bottom: 1rem } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle h4, .costBuiltCalcSec .contentSp h5, .housePlanKeySpecsHolder h4, .makeUniqueSec .uniquePlanBlockHolder h5, .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder h3, .planCalloutSec ul li h3, .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder h4, .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec h5 { font-size: 20px } .browseHousePlan { padding-top: 40px } .planToFindHomeSec { padding-bottom: 40px; padding-top: 150px } .productBox .productBtnHolder .btn-product { font-size: 8px; padding: 5px } .browseHousePlanSec .browseSliderSec .productBox { width: calc(100vw - 30px) } .housePlanProductHolder .productBox .productBlock .productImageSec img, .productBox .productBlock .productImageSec img { height: 260px } .productBox .productBlock .productBottomInfoSec .productInfoSec ul li { font-size: 11px; padding: 10px } .productBox .productBlock .productBottomInfoSec>span { font-size: 11px } .productBox .productBtnHolder>span { padding: 0 1px } .productBox { padding: 2px } .productBox .productBlock .productTopIconHolder>a { padding: 5px } .productBox .productBlock .productTopIconHolder>a img { max-height: 15px } .buildCostSampleReportSec .buildCostSampleReportContent h4, .housePlanStyleSec .btnHolder, .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder, .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li { margin-bottom: 1rem } .housePlanStyleSec .fetauredProductTab li a { font-size: 14px; white-space: nowrap } .housePlanStyleSec .fetauredProductTab { overflow: auto; justify-content: flex-start; flex-wrap: nowrap; height: 50px; margin: 30px -15px } .housePlanStyleSec .fetauredProductTab li { margin: 0 } .housePlanStyleSec .productHolder .productBox { width: calc(100% - 30px); margin-top: 5px; margin-bottom: 5px } .costBuiltCalcSec, .designerEnvisionContainer, .farmHouseDetailContainer .farmHouseDetailHolder, .findHomeSec, .housePlanStyleSec, .keyElementContainer, .makeUniqueSec, .onlineHouseBenefitsContainer, .purchaseOnlinePlanContainer, .qucikAdviceSec, .testimonialSec { padding: 40px 0 } .makeUniqueSec .uniquePlanBlockSec { flex-wrap: wrap; width: 100% } .makeUniqueSec .uniquePlanBlockHolder .planProductAvatarHolder img { height: 220px; max-width: 100% } .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockSp { height: auto; box-shadow: none; border: 0 } .makeUniqueSec .uniquePlanBlockHolder .planProductContentSec, .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceContentSec { padding-left: 0; padding-right: 0 } .housePlanSliderActionoHolder, .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockSp:hover { box-shadow: none } .costCalcList li { width: 50%; font-size: 16px; padding-left: 10px; padding-right: 10px; border-bottom: 1px solid #61a2ef } .costCalcList li:nth-child(2n+2) { border-right: 0 } .costCalcList li:last-child { border-bottom: 0; border-right: 1px solid #61a2ef } .costCalcList li img { max-height: 50px } .costCalcList { margin-bottom: 1rem; justify-content: flex-start } .blogInfoListSec, .blogSection .blog, .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li:nth-child(-n+2) { margin-bottom: 15px } .testimonialSec .testimonialSlideSec .testimonialBlock { padding: 0; flex-direction: column; align-items: center } .testimonialSec .testimonialSlideSec .testimonialBlock .testimonialContent { text-align: center; padding-top: 1rem; padding-left: 0; padding-right: 0 } .testimonialSec .testimonialSlideSec .testimonialBlock .testimonialContent p { font-size: 20px; line-height: 32px; margin-bottom: 1rem } .testimonialSec .testimonialSlideSec .testimonialBlock>i img { width: 80px; height: 80px } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp .adviceImgSec img, .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb img { height: 230px } .qucikAdviceSec .btnHolder { margin-top: 30px } .footerNavBlock { width: 100%; max-width: 100% } .adviceSection a, .cardImgSec, .relatedHousePlanThumbSec .relatedHousePlanThumbHolder { justify-content: center } .adviceSection { text-align: center } .footerBlockHolder { padding: 2.5rem 0 } .banner { min-height: 300px } .banner.bannerBlank { height: auto } .buildCostContainer, .pg { padding: 30px 0 } .banner .banner-text .desc h2, .banner.bannerBlank .banner-text .desc h2, .housePlanDetailPageSec .housePlanDetailTitleHolder h2 { font-size: 24px } .blogContentSec { width: 100%; padding-right: 15px } .blogSection .blogDesc h5, .competitiveComparisionTableHolder table thead tr th, .contactInfoSec ul li b, .instantCostBuildSec .buildCostSampleSec h4 { font-size: 16px } .blogSection .blogDesc, .faqSec .card .card-body, .orderCostBuildSec .wizard .steps ul li:last-child a { padding-right: 0 } .blogContentHolder, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow:nth-child(2n+2) { flex-direction: column-reverse } .sidebar+.sidebar { margin-top: 15px } .sidebar .sidebar-title { padding: 10px 30px 10px 15px } .sidebar .sidebar-title:after { display: inline-block; margin-left: .255em; vertical-align: .255em; position: absolute; top: 50%; right: 15px; margin-top: -2px; content: ""; border-top: .3em solid #fff; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent } .sidebar .sidebar-title[aria-expanded=true]:after { transform: rotate(180deg) } .blogDetailContentSec ul li { font-size: 18px; margin: 5px 0 } .blogDetailContentSec img { width: 100%; float: none; margin-left: 0; margin-right: 0 } .buildCostContainer .nav-tabs .nav-item { width: 100%; text-align: center } .buildCostTabContainer h2, .contactInfoSec h3, .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead p span { font-size: 26px } .buildCostTabContainer h3, .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group label { font-size: 18px } .buildCostSampleReportSec { flex-direction: column; margin: 40px 0 } .buildCostSampleReportSec .buildCostSampleReportThumb { width: 100%; padding: 15px } .buildCostSampleReportSec .buildCostSampleReportContent { flex-direction: column; padding: 15px; width: 100% } .contactSec, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow, .housePlanDetailTitleHolder, .housePlanFilterTabSec .housePlanProductStyleFilterHolder, .housePlanFilterTabSp, .orderCostBuildSec .wizard .wizardBody .billingAndPaymentSec .ShippingAmountList { flex-direction: column } .competitiveComparisionTableHolder { margin: 40px 0 } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListHolder { overflow: auto } .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent .costBuilQaulityListBlock { width: 100%; min-width: 225px } .faqSec .card .card-header .btn { font-size: 16px; padding: 1.4rem 2rem 1.4rem 30px } .costBuiltFaqAlert { padding: 20px } .faqSec .card .card-header .btn::before { font-size: 18px; top: 21px } .faqSec .card .card-header .btn::after { font-size: 18px; top: 18px } .page-link { padding: .3rem .5rem; font-size: .75rem } .productBox .productBtnHolder>div { flex: 0 0 auto; max-width: -webkit-max-content; max-width: -moz-max-content; max-width: max-content } .contactRightSec, .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li .floorPlanContent { width: 100%; margin-top: 2rem } .contactSec .contactContentSec h3 { font-size: 32px; margin-bottom: 1rem } .contactSec .contactContentSec p { font-size: 20px; margin-bottom: 2rem } .contactInfoSec { right: 0; width: auto } .contactInfoSec ul li { font-size: 16px; margin: 15px 0 } .contactMapContainer>img { height: 550px } .faqContainer { padding: 0 0 40px } .housePlanProductContainer .housePlanProductSec .productFilterRefineHolder { width: 100%; padding-right: 0 } .housePlanProductContainer .housePlanProductSec .housePlanProductHolder { width: 100%; padding-left: 0 } .housePlanProductHolder .productBox { width: calc(100% - 10px) } .housePlanProductHolder .productBox .productBtnHolder .btn-product { font-size: 8px; padding: 6px 5px } .housePlanFilterTabSp { position: relative; margin-bottom: 40px } .housePlanFilterTabSec .housePlanCountSec { flex-direction: column; position: relative } .housePlanFilterTabSec .housePlanSearchSec { width: 100%; margin-left: 0; max-width: 100%; margin-top: 1rem; padding-right: 80px } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul { flex-wrap: wrap; margin-top: 1.5rem } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li { width: 50% } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder { margin-left: 0 } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a { padding-left: 5px; padding-right: 5px; min-width: inherit; font-size: 12px } .housePlanFilterTabSec .housePlanCountSec .housePlanProductStyleFilter { position: absolute; bottom: 15px; right: 0 } .filterBtnHolder { margin: 0; text-align: center; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 500 } .filtersActive .filterBtnHolder.applyHolder, .filtersActive .navbar .filterCloseTrigger, .filtersActive .productFilterRefineHolder .productFilterRefineSec { display: block } .filtersActive .housePlanProductContainer { padding-top: 0; padding-bottom: 0 } .topBarContainer { padding: 4px 0 } .housePlanDetailTitleHolder.xs-sp, .topBarleftInfoSec ul li, .topBarleftInfoSec ul li a { display: flex; align-items: center } .topBarRightInfoSec ul li a i { width: 28px; height: 28px } .filtersActive .navbar .filterTrigger { display: block; margin: 7.35px 0 } .filtersActive .productFilterRefineHolder>.filterBtnHolder, .housePlanSliderHolder .pgwSlideshow .ps-list { display: none !important } .filtersActive .navBarHolder, .filtersActive .productFilterRefineSec .accordion .card:last-child { border-bottom: 0 } .filtersActive .productFilterRefineSec .accordion .card { border-left: 0; border-right: 0 } .filtersActive .productFilterRefineSec .accordion .card:first-child { border-top: 0 } .customDreamContainer .customDreamHolder { padding: 40px 0 110px } .customDreamContainer .customDreamContentHolder { flex-direction: column; margin: 0 } .customDreamContainer .customDreamContentHolder .customDreamLeftSec { width: 100%; padding-right: 0; padding-left: 0; padding-bottom: 40px; margin-bottom: 20px } .customDreamContainer .customDreamContentHolder .customDreamRightSec { width: 100%; padding-right: 0; padding-left: 0 } .customDreamContainer .customDreamContentHolder .customDreamLeftSec::before { transform: rotate(90deg); width: 14px; height: 229px; margin-left: -7px; margin-bottom: calc(-229px / 2); content: ''; position: absolute; right: 50%; top: auto; bottom: 0 } .customDreamContainer .costEffectiveContainer .costEffectiveSec { padding: 25px 15px; flex-direction: column } .customDreamContainer { margin-bottom: 100px } .customDreamContainer .costEffectiveContainer .costEffectiveSec h2 { font-size: 20px; padding-right: 0; text-align: center; margin-bottom: 1rem } .customDreamContainer .costEffectiveContainer .costEffectiveSec .btn { width: 100%; min-width: inherit; padding-left: 15px; padding-right: 15px; font-size: 13px } .designerEnvisionContainer .designerEnvisionSec .designerEnvisionCallout { margin: 15px 0 } .homeFloorPlanContainer { background-position: bottom right; padding: 40px 0; text-align: center } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li { flex-direction: column; align-items: center; margin: 15px 0 } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li i, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i { margin-right: 0; width: 80px; height: 80px } .homeFloorPlanContainer .homeFloorPlanSec .floorPlanPoints li i img { max-width: 50%; max-height: 50% } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li { padding: 10px 0 5px } .housePlanHeaderBlock, .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList { flex-direction: column; align-items: center; text-align: center } .onlineHouseBenefitsContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i img { width: 70%; height: 70% } .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul li { width: 100%; font-size: 18px } .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent { margin: 0; flex-direction: column } .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent .farmHouseDetailLeftSec, .farmHouseDetailContainer .farmHouseDetailSec .farmHouseDetailContent .farmHouseDetailRightSec, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent { padding: 0; width: 100% } .housePlanProductContainer { padding-bottom: 40px; padding-top: 40px } .sliderSec:not(.searchPage)+* { padding-top: 10px } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent li, .keyElementSec ul li { width: 100%; max-width: 100%; font-size: 16px } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow { margin: 0; flex-direction: column-reverse; padding: 40px 0 } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder { padding: 0; width: 100%; margin-bottom: 1rem } .onlineHouseBenefitsContainer.farmHouseStyleContainer { padding-bottom: 40px } .onlineHouseBenefitsContainer.farmHouseStyleContainer .onlineHouseBenefitsListHolder li .onlineHouseBenefitsList i { margin-right: 0 } .housePlanDetailPageSec .housePlanDetailTitleHolder p { font-size: 14px } .pgwSlideshow .ps-current>ul>li img { height: 250px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .housePlanDetailTitleHolder.xs-sp .housePlanDetailTitleRightSec { display: flex; margin-left: 0 } .housePlanDetailPageHolder { margin: 0; flex-direction: column; padding-top: 0 } .housePlanDetailPageHolder .housePlanDetailPageLeftSec { width: 100%; padding: 0 } .housePlanDetailPageHolder .housePlanDetailPageRightSec { width: auto; padding: 0; margin: 0 -19px } .selectPlanFormHolder { margin-bottom: 20px } .housePlanSliderActionoHolder ul { flex-wrap: wrap; justify-content: center } .housePlanSliderActionoHolder ul li { border: 0; max-width: 50% } .housePlanSliderActionoHolder ul li a { font-size: 13px; padding-left: 10px; padding-right: 10px } .housePlanFieldSetHolder .legend, .housePlanKeySpecs .legend { left: 40px } .housePlanFieldSetHolder .legend span, .housePlanKeySpecs .legend span { font-size: 18px; padding-top: 7px; padding-bottom: 7px } .housePlanKeySpecs ul { flex-wrap: wrap; justify-content: flex-start; margin-top: 0; margin-bottom: 0 } .housePlanKeySpecs ul li { border: 0; width: 33.3333%; padding-left: 10px; padding-right: 10px; margin-top: 20px } .housePlanKeySpecs { padding-left: 5px; padding-right: 5px } .housePlanHeaderBlock a { margin-top: 1rem } .housePlanDetailPageCard .housePlanCardBody table td, .housePlanFieldSetHolder, .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder { padding-left: 15px; padding-right: 15px } .housePlanFieldSetHolder ul li .btn { margin-right: auto } .housePlanDetailPageContentHolder ul.foundation li { width: 100%; font-size: 20px } .housePlanDetailPageContentHolder ul.faq li h4 { font-size: 18px; padding-left: 30px } .housePlanDetailPageContentHolder ul.faq li h4:after { font-size: 20px; top: 0 } .housePlanDetailPageCard .housePlanHeaderBlock { text-align: left; padding-left: 0; padding-right: 0 } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb { width: 100%; max-width: 350px } .housePlanDetailPageCard .housePlanCardBody table tbody tr { display: flex; flex-direction: column; width: 100%; padding-left: 40%; position: relative } .housePlanDetailPageCard .housePlanCardBody table tbody tr th { position: absolute; left: 0; height: 100%; width: 40%; padding-left: 10px; padding-right: 10px; font-size: 18px; display: flex; align-items: center } .housePlanDetailPageCard .housePlanCardBody table tbody tr td { width: 100%; height: auto; padding-bottom: 0 } .housePlanDetailPageCard .housePlanCardBody table tbody tr td:last-child { padding-bottom: 15px } .housePlanDetailPageCard .housePlanCardBody table tbody tr td+td { padding-top: 0 } .orderCostBuildSec .wizard { padding-left: 0; padding-right: 0; padding-top: 0 } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead { flex-direction: column; align-items: flex-start } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead h4 { font-size: 26px; line-height: 32px } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormImgHolder img { height: 180px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group .form-control { height: calc(2.5em + .75rem + 2px) } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .form-group { margin-bottom: 1.8rem } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control { width: 100%; margin-bottom: 1rem } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control-label::after, .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder .custom-control-label::before { top: 5px } .orderCostBuildSec .wizard .steps ul { justify-content: flex-start; overflow-x: auto; overflow-y: hidden } .orderCostBuildSec .wizard .steps ul li a { padding-left: 10px; padding-right: 10px; min-width: auto; font-size: 12px; color: #636363 } .orderCostBuildSec .wizard .steps ul li:first-child a { padding-left: 0 } .orderCostBuildSec .wizard .steps ul li a i svg { height: 40px } .orderCostBuildSec .wizard .steps ul li.active:after, .orderCostBuildSec .wizard .steps ul li.current:after, .orderCostBuildSec .wizard .steps ul li.done:after { width: 30px; height: 30px; border: 5px solid #3a7b1d; top: 65px } .orderCostBuildSec .wizard .steps ul li.i-empty.active:after, .orderCostBuildSec .wizard .steps ul li.i-empty.current:after { top: 10px } .orderCostBuildSec .wizard .steps ul li a i { height: 65px } .orderCostBuildSec .wizard .steps ul li::before { top: 79px } .orderCostBuildSec .wizard .steps ul li:after { top: 65px } .testimonialList { max-width: 100% } .testimonialList li { width: 100%; padding: 30px 0 80px } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp { border: 0 } .relatedHousePlanThumbSec>h4 { margin-top: 2.5rem; margin-bottom: 2rem; text-align: center } .housePlanCardBody .relatedHousePlanThumbSec>h4 { margin-top: 1.5rem; margin-bottom: 1rem; text-align: left } .orderCostBuildSec .wizard .steps { margin-bottom: 30px } .banner .banner-text { padding: 1.5rem 0 } } @media only screen and (max-width:374px) { .sliderSec ul li .sliderCaption h2 { font-size: 32px } .housePlanKeySpecs ul li { width: 50% } } @media only screen and (min-width:768px) and (max-width:991px) { .banner .banner-text .desc h2, .sliderSec ul li .sliderCaption h2 { font-size: 48px } .sliderSec ul li .sliderCaption { top: 30% } .planFilterFieldSec { padding: 0 } .planFilterFieldSp { flex-direction: column; align-items: center; padding: 25px } .planFilterFormGroup { max-width: 33.333% } .planFilterFieldSp .planFilterFieldHolder { flex-wrap: wrap } .planFilterFormGroup.sqrFt { max-width: 66.666% } .planFilterFormGroup.sqrFt .d-flex .form-control { max-width: inherit } .planFilterBtnSec { padding: 0 10px; text-align: center; margin-top: 1rem } .planFilterSec { top: auto; bottom: -100px; transform: none } .planCalloutSec ul li h3 { font-size: 22px } .contentSp h3 { font-size: 40px } .housePlanStyleSec .fetauredProductTab li a { font-size: 14px; white-space: nowrap; padding-left: 15px; padding-right: 15px } .housePlanStyleSec .fetauredProductTab li { margin: 0 5px } .housePlanStyleSec .productHolder .productBox { width: calc(100% - 30px) } .makeUniqueSec .uniquePlanBlockHolder, .purchaseOnlinePlanContainer .purchaseOnlinePlanHolder ul li { width: 50% } .makeUniqueSec .uniquePlanBlockHolder .planProductAvatarHolder img { height: 300px } .costBuiltCalcSec .costCalcList li { width: calc(100% / 4); border-right: 1px solid #61a2ef; border-bottom: 1px solid #61a2ef } .costBuiltCalcSec .costCalcList li:nth-last-child(-n+3) { border-bottom: 0 } .costBuiltCalcSec .costCalcList li:last-child, .costCalcList li:nth-child(4n) { border-right: 0 } .testimonialSec .testimonialSlideSec .testimonialBlock { padding: 0; flex-direction: column; align-items: center; text-align: center } .testimonialSec .testimonialSlideSec .testimonialBlock>i { margin-bottom: 2rem } .buildCostContainer .nav-tabs .nav-link { padding-left: 1rem; padding-right: 1rem } .competitiveComparisionTableHolder table thead tr th:first-child i { min-width: 430px } .contactSec, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow, .housePlanDetailPageSec .housePlanDetailTitleHolder { flex-direction: column } .contactLeftSec, .contactSec .contactContentSec img, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelContent, .costBuilQaulityLevelsHolder .costBuilQaulityLevelRow .costBuilQaulityLevelTitle, .housePlanProductHolder .productHolder { width: 100% } .buildCostSampleReportSec .buildCostSampleReportContent:after, .buildCostSampleReportSec .buildCostSampleReportContent:before, .sidebar .sidebar-title .mhpLogo { display: none } .buildCostSampleReportSec .buildCostSampleReportThumb { width: 35%; padding: 15px } .buildCostSampleReportSec .buildCostSampleReportContent { flex-direction: column; padding: 15px; width: 65%; justify-content: center } .buildCostSampleReportSec .buildCostSampleReportContent h4 { margin-bottom: 1rem } .blogContentSec { width: 100%; padding-right: 15px } .blogContentHolder, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow:nth-child(2n+2) { flex-direction: column-reverse } .blogInfoListSec { width: 100%; margin-bottom: 15px } .sidebar+.sidebar { margin-top: 15px } .sidebar .sidebar-title { padding: 10px 30px 10px 15px } .housePlanDetailPageHolder .housePlanDetailPageLeftSec, .housePlanDetailPageHolder .housePlanDetailPageRightSec, .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent { padding: 0; width: 100% } .sidebar .sidebar-title:after { display: inline-block; margin-left: .255em; vertical-align: .255em; position: absolute; top: 50%; right: 15px; margin-top: -2px; content: ""; border-top: .3em solid #fff; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent } .sidebar .sidebar-title[aria-expanded=true]:after { transform: rotate(180deg) } .contactRightSec { width: 100%; margin-top: 2rem } .contactSec .contactFormSec { max-width: 100% } .housePlanFilterTabSp { flex-direction: column; align-items: center } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder { margin-left: 0; margin-top: 2rem } .housePlanProductContainer .housePlanProductSec .productFilterRefineHolder { width: 40%; padding-right: 10px } .housePlanProductContainer .housePlanProductSec .housePlanProductHolder { width: 60%; padding-left: 10px } .housePlanProductHolder .productBox { width: calc(100% - 10px) } .housePlanProductHolder .productBox .productBtnHolder .btn-product { font-size: 10px } .customDreamContainer .costEffectiveContainer .costEffectiveSec { padding: 25px } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow { margin: 0; flex-direction: column-reverse } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder { padding: 0; width: 100%; margin-bottom: 1rem } .keyElementSec ul li { width: 100%; max-width: 100% } .housePlanDetailPageHolder { flex-direction: column-reverse; margin: 0 } .housePlanSliderActionoHolder ul li a { padding-left: 10px; padding-right: 10px } .housePlanSliderActionoHolder ul li a i { width: 50px; height: 50px } .housePlanSliderActionoHolder ul li a i img { width: 50%; height: 50% } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb img { height: 200px } .orderCostBuildSec .wizard { padding-left: 0; padding-right: 0 } .orderCostBuildSec .wizard .steps ul li a { width: 180px } .orderCostBuildSec .wizard .wizardBody .orderCostFormHolder { padding-left: 25px; padding-right: 25px } .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead h4, .orderCostBuildSec .wizard .wizardBody .planDetailFormSec .planDetailFormHead p span { font-size: 36px } .housePlanDetailPageCard .housePlanCardBody table td, .housePlanDetailPageCard .housePlanCardBody table th { padding: 15px } .housePlanDetailPageCard .housePlanCardBody table th { font-size: 20px } } @media only screen and (min-width:992px) and (max-width:1199px) { .footerBottomSec p, .planFilterBtnSec { margin-bottom: 1rem } .topBarleftInfoSec ul li:last-child p span { display: none } .topSearchSec .form-control { min-width: 15rem } .navBarHolder .navbar .navbar-nav { margin-left: 1rem } .navBarHolder .navbar .navbar-brand img { max-height: 70px } .navBarHolder .navbar .navbar-nav .nav-link { font-size: 12px } .sliderSec ul li .sliderCaption h2 { font-size: 48px } .sliderSec ul li .sliderCaption { width: 70%; top: 40% } .planFilterFieldSec>i { right: 0; left: auto } .planFilterFieldSp { align-items: flex-end; padding: 25px } .planFilterFormGroup { max-width: 33.333% } .planFilterFieldSp .planFilterFieldHolder { flex-wrap: wrap } .planFilterFormGroup.sqrFt { max-width: 66.666% } .planFilterFormGroup.sqrFt .d-flex .form-control { max-width: inherit } .planFilterBtnSec { padding: 0 10px; text-align: center } .productHolder.twoColumn-md .productBox .productBtnHolder .btn-product { padding-left: 5px; padding-right: 5px; font-size: 12px } .productHolder.twoColumn-md .productBox .productBlock .productBottomInfoSec .productInfoSec ul li { font-size: 14px } .productHolder.twoColumn-md .productBox .productBlock .productImageSec img { height: 300px } .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockHead { height: calc(102px + 1.2rem) } .testimonialSec .testimonialSlideSec .testimonialBlock { padding: 0 50px } .footerBottomSec { flex-direction: column; align-items: center; text-align: center } .footerNavBlock { margin-top: 3rem } .footerSearchBlock { flex: auto; width: 100% } .footerSearchBlock>section { width: 380px } .blogContentSec { padding-right: 15px; width: 70% } .blogInfoListSec { width: 30% } .blogDetailContentSec ul { display: inline-block; width: 100% } .buildCostSampleReportSec .buildCostSampleReportContent { padding: 15px 20px 15px 90px; width: calc(100% - 230px) } .buildCostSampleReportSec .buildCostSampleReportThumb { width: 230px } .housePlanFilterTabSp { flex-direction: column; align-items: center } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder { margin-left: 0; margin-top: 2rem } .housePlanProductContainer .housePlanProductSec .productFilterRefineHolder { width: 35% } .housePlanProductContainer .housePlanProductSec .housePlanProductHolder { width: 65% } .housePlanProductHolder .productBox { width: calc(100% - 10px) } .housePlanProductHolder .productHolder { width: 100% } .housePlanProductHolder .productBox .productBtnHolder .btn-product { font-size: 10px } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow { margin: 0; flex-direction: column-reverse } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorContent { padding: 0; width: 100% } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder { padding: 0; width: 100%; margin-bottom: 1rem } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow .interiorExteriorImgHolder img { max-height: 400px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center } .interiorExteriorContainer .interiorExteriorSec .interiorExteriorContentrow:nth-child(2n+2) { flex-direction: column-reverse } .housePlanSliderActionoHolder ul li a { padding-left: 10px; padding-right: 10px } .housePlanSliderActionoHolder ul li a i { width: 50px; height: 50px } .housePlanSliderActionoHolder ul li a i img { width: 50%; height: 50% } .housePlanDetailPageHolder { margin: 0 -15px } .housePlanDetailPageHolder .housePlanDetailPageLeftSec, .housePlanDetailPageHolder .housePlanDetailPageRightSec { padding: 0 15px } .housePlanDetailPageCard .housePlanCardBody table tr:nth-child(2n+2) td { padding-left: 25px } .relatedHousePlanThumbSec .relatedHousePlanThumbHolder .relatedHousePlanThumb { width: calc(50% - 10px) } .orderCostBuildSec .wizard { padding-left: 0; padding-right: 0 } .orderCostBuildSec .wizard .steps ul { overflow: hidden } .housePlanDetailPageCard .housePlanCardBody table th { font-size: 20px } .housePlanDetailPageCard .housePlanCardBody table td, .housePlanDetailPageCard .housePlanCardBody table th { padding: 10px; width: auto } } @media only screen and (min-width:1200px) and (max-width:1339px) { .sliderSec ul li .sliderCaption { width: 80% } .planFilterFieldSec>i { right: 0; left: auto } .planFilterFieldSp { align-items: flex-end; padding: 25px } .planFilterFormGroup { max-width: 33.333% } .planFilterFieldSp .planFilterFieldHolder { flex-wrap: wrap } .planFilterFormGroup.sqrFt { max-width: 66.666% } .planFilterFormGroup.sqrFt .d-flex .form-control { max-width: inherit } .planFilterBtnSec { padding: 0 10px; text-align: center; margin-bottom: 1rem } .housePlanSliderActionoHolder ul li a, .productBox .productBtnHolder .btn-product { padding-left: 10px; padding-right: 10px } .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockHead { height: calc(102px + 1.2rem) } .housePlanFilterTabSp { flex-direction: column; align-items: center } .housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder { margin-left: 0; margin-top: 2rem } .housePlanProductContainer .housePlanProductSec .productFilterRefineHolder { padding-right: 10px } .productBox .productBlock .productBottomInfoSec .productInfoSec ul li { font-size: 12px } .housePlanProductHolder .productBox .productBtnHolder .btn-product { font-size: 10px } .housePlanProductContainer .housePlanProductSec .housePlanProductHolder { padding-left: 10px } .housePlanSliderActionoHolder ul li a i { width: 50px; height: 50px } .housePlanSliderActionoHolder ul li a i img { width: 50%; height: 50% } } @media only screen and (min-width:991px) { .sidebar .sidebar-body { display: block !important } } @media only screen and (min-width:768px) { .makeUniqueSec .uniquePlanBlockHolder .uniquePlanBlockSp:hover .btn-gray { background-color: #3a7b1d; border-color: #3a7b1d; color: #fff } .qucikAdviceSec .adviceBlockHolder .adviceBlock .adviceBlockSp:hover { background: #fff; box-shadow: 0 0 40px 0 rgba(0, 0, 0, .07) } .housePlanSliderHolder .pgwSlideshow .ps-list { position: absolute; top: 100%; width: 100%; left: 0; right: 0 } } .sr-only { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px } .sr-only.focusable:active, .sr-only.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; white-space: inherit; width: auto } .clearfix:after, .clearfix:before { content: " "; display: table } .clearfix:after, .slick-track:after { clear: both } @media print { *, ::after, ::before, :after, :before { box-shadow: none !important; text-shadow: none !important } .d-print-none { display: none !important } .d-print-inline { display: inline !important } .d-print-inline-block { display: inline-block !important } .d-print-block { display: block !important } .d-print-table { display: table !important } .d-print-table-row { display: table-row !important } .d-print-table-cell { display: table-cell !important } .d-print-flex { display: flex !important } .d-print-inline-flex { display: inline-flex !important } a, a:not(.btn), a:visited { text-decoration: underline } abbr[title]::after, abbr[title]:after { content: " (" attr(title) ")" } @page { size: a3 } .container, body { min-width: 992px !important } .navbar { display: none } .badge { border: 1px solid #000 } .table { border-collapse: collapse !important } .table td, .table th { background-color: #fff !important } .table-bordered td, .table-bordered th { border: 1px solid #dee2e6 !important } .table-dark { color: inherit } .table-dark tbody+tbody, .table-dark td, .table-dark th, .table-dark thead th { border-color: #dee2e6 } .table .thead-dark th { color: inherit; border-color: #dee2e6 } blockquote, img, pre, tr { page-break-inside: avoid } *, :after, :before { background: 0 0 !important; color: #000 !important } a[href]:after { content: " (" attr(href) ")" } a[href^="#"]:after, a[href^="javascript:"]:after { content: "" } pre { white-space: pre-wrap !important } blockquote, pre { border: 1px solid #999 } thead { display: table-header-group } h2, h3, p { orphans: 3; widows: 3 } h2, h3 { page-break-after: avoid } } .stick { position: fixed; z-index: 1; top: 0 } .slimScrollRail { width: 2px !important; right: 0 !important } .loginModal button.close { position: absolute; left: calc(100% - 12px); bottom: calc(100% - 12px); width: 25px; height: 25px; color: #fff; border-radius: 100%; background: #000; opacity: 1; display: flex; justify-content: center; align-items: center; padding: 0; font-size: 20px; font-weight: 400 } .loginPanel .loginField, .loginPanel .loginImage { width: 50%; flex-direction: column; position: relative; display: flex } .loginModal button.close span { line-height: 11px; margin-top: -6px; margin-right: -1px } .loginModal .modal-content { border-radius: 0; border: 0 } .loginPanel { display: flex; min-height: 500px } .loginPanel .loginImage { background: #3a7b1d; justify-content: center } .loginPanel .loginField { padding: 3.5em 4em 2em; justify-content: center } .loginPanel .loginImage>img { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } .loginPanel .loginImage .imageContent { padding: 2em 4em; color: #fff; text-align: center; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; background: rgba(0, 0, 0, .45); position: relative; z-index: 1 } .btn-round { border-radius: 100px } .animated-label-field { margin-bottom: 2rem; position: relative } .animated-label-field label:not(.error) { margin: 0; position: absolute; top: 10px; left: 10px; color: #b3b3b3; font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 15px; background: #fff; padding: 0 10px; transition: .25s ease-in; z-index: 1 } .animated-label-field .form-control { z-index: 2; position: relative } .animated-label-field .form-control.has-val+label+label:not(.error), .animated-label-field .form-control.has-val+label:not(.error), .animated-label-field .form-control:focus+label:not(.error) { top: -20px; left: -10px; color: #000; font-size: 13px } .loginPanel .loginField h2 { font-size: 22px; font-weight: 700; text-transform: capitalize; margin: 0 0 4px } .loginPanel .loginField p { font-size: 14px; color: #4e4e4e } .alternateSection { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; position: absolute; top: 1.5em; right: 4em } .loginPanel .loginField .alternateSection p { margin: 0; font-size: 12px } .loginPanel .loginField .alternateSection .btn { padding: .4em .75em; font-size: 12px; margin-left: 15px } .signup .loginPanel .loginImage { width: 40% } .signup .loginPanel .loginImage .imageContent { padding: 2em } .signup .loginPanel .loginField { width: 60%; padding: 3.5em 2em 2em } .signup .alternateSection { right: 2em } .modifyPage { background: #f7f9fb; padding: 50px 0 } .modify-form { margin-top: 40px; background: #fff; padding: 30px; border-radius: 4px; box-shadow: 0 0 20px 0 rgba(0, 0, 0, .08) } .modify-inner a { color: #3b8beb; font-weight: var(--weight-700) } .modify-form p { text-align: left; margin: 0 0 5px; font-size: .85rem } .modify-form .btnRmv img { width: 20px } .byPlan-box { height: inherit; padding: 30px 0 } .byPlan-boxInner { padding: 20px 25px; border: 1px solid #e1e1e1; min-height: 200px; display: flex } .page-404 { background: #f7f9fb; padding: 50px 0 0 } .page-error { padding: 50px 15px; background: #fff; border-radius: 7px; min-height: 50vh; display: flex; flex-direction: column; justify-content: center; text-align: center } .page404-inner h1 { font-size: 9rem; font-weight: var(--weight-700); margin: 0 } .page404-inner h1 .colorGreen { color: #42861e } .colorBlue, .page404-inner h1 .colorBlue { color: #0a56a5 } .page404-inner h2 { font-weight: var(--weight-700); text-transform: uppercase; font-size: 1.5rem } .blue-title, .inputHold-inputText, .option, .total p, button#hideMe { text-transform: capitalize } .page404-inner p { margin: 0; font-size: .85rem } .housePlans-Slider .slick-dots { display: flex; align-items: center; justify-content: center } ul.slick-dots li { padding: 5px; line-height: normal } ul.slick-dots li button { box-shadow: none; font-size: 1px; border: 0; width: 12px; height: 12px; border-radius: 100%; padding: 0; background: #d0d0d0; line-height: normal } .housePlans-Slider ul span { background: rgba(0, 0, 0, .8); position: absolute; left: 0; bottom: 0; color: #fff; padding: 10px 15px; font-family: var(--family-lato); font-weight: var(--weight-700) } .multiselect-native-select .btn-group .multiselect { border-radius: 2px; font-size: 14px; font-family: var(--family-lato); font-weight: var(--weight-400); height: calc(2em + .75rem + 2px); text-align: left } .stepsPlanBoundry { padding: 25px; border: 1px solid #e1e1e1 } .blue-title { width: 100%; border: 0; font-size: 16px; color: #fff; padding: 7px 0; display: block; text-align: center; background-color: #3b8beb; font-weight: 700 } .planSetsInnerTable { margin-bottom: 25px; overflow: auto } .tableSets { border-width: 1px; border-style: solid; border-color: #ddd #ddd #0a56a5 } .table-bordered>tbody>tr>th, .tableSets>tbody>tr>td, .tableSets>tfoot>tr>td, .tableSets>tfoot>tr>th, .tableSets>thead>tr>td, .tableSets>thead>tr>th { padding: 10px; border: 1px solid #ddd } .tableSets tbody tr th:nth-child(2) { text-align: center; font-size: 14px; padding: 3px; font-family: opensans-bold; font-weight: 400; border: 1px solid #e1e1e1 } .btnForm-green { border: #42851e; font-size: 12px; border-radius: 5px; width: 80px; cursor: pointer } .btnForm-green:hover { text-decoration: none; color: #fff } .btn-green, .btnForm-green { background: #42851e; color: #fff !important; padding: 5px; display: inline-block; text-align: center } .stepsPlanSets>.planSetsInnerTable .tableSets tbody tr td:nth-child(2) { width: 10% } .tableSets tbody tr td:last-child { white-space: normal } .tableSets tbody tr td:nth-child(2) { color: #0b56a7 } .red { color: #c60232 } .fix-chk tbody tr td:first-child { width: 35%; white-space: normal } .quantity.option { padding-left: 5% } .option { width: 45% } .extraSeatsAmmount>.pull-right { padding-right: 25%; float: right } .purchaseDsc h3, .purchaseDsc h4 { color: #0a56a5; margin-bottom: 10px } .purchaseDsc p, .purchaseStep2-billingInfo { margin-bottom: 25px } .purchaseDsc p { font-size: 14px; line-height: 2 } .purchaseStep2-inner { padding: 15px; border: 1px solid #e1e1e1 } .favorite-content .btn, .inputHold-input, ul.mega-menu li { padding: 5px 10px } .inputHold { margin-top: 1em; width: 100%; margin-bottom: 1em } .inputHold-inputText { width: 20%; float: left; text-align: left; font-size: 16px; font-weight: 700 } .inputHold-input { width: 80%; float: left; border: 1px solid #e1e1e1; text-align: left } .purchaseFieldSet, .total { width: 100%; display: inline-block } .total { border-color: #ededed; border-style: solid; border-width: 0 1px 1px; padding: 10px 20px } .purchaseFieldSet { border: 1px solid #ededed; padding: 10px 20px 20px; margin-bottom: 1em } .purchaseFieldSet .radioWrap { border-bottom: 1px solid #0a56a5; margin-bottom: 1em } .purchaseFieldSet .radioWrap>label.inputHold-inputText { color: #d2022a } .purchaseFieldSet .inputHold-inputText { width: 41% } .purchaseFieldSet .radioHold { display: inline-block; width: 59%; text-align: left } .purchaseFieldSet .radioHold .radioButton { display: inline-block; text-align: left; padding-right: 10px; text-transform: capitalize } .purchaseFieldSet .inputHold { margin: 5px 0; text-align: center } .purchaseFieldSet .inputHold-input { width: 59% } .check input[type=checkbox], .check input[type=checkbox]:checked+label::after, .check label::before { width: 17px; height: 17px; border-radius: 3px; cursor: pointer; border: 1px solid #0a56a5 } .check label { width: auto; font-size: 14px; vertical-align: top; cursor: pointer; text-align: left; font-weight: 400; margin-left: 5px } .radioStyle label { width: auto; font-size: 14px; vertical-align: top; cursor: pointer; text-align: left; font-weight: 600; margin: 0 } .ammountRight span { text-transform: uppercase; color: #ca022e; font-weight: 700 } .inputHold .error+label { float: right; color: red; margin: 0; padding: 0 } .headerSteps .orderCostBuildSec .wizard { padding: 20px } .mega-menu-tile h2 { font-size: 1.25rem; text-align: center } ul.mega-menu { list-style: none; margin: auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start; max-width: 100%; width: 100% } ul.mega-menu li a { font-weight: 400; color: #212529; display: block; line-height: 2; font-size: 15px } @media (min-width:768px) { .col-md { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-md-12, .row-cols-md-1>* { flex: 0 0 100%; max-width: 100% } .col-md-6, .row-cols-md-2>*, ul.mega-menu li { flex: 0 0 50%; max-width: 50% } .col-md-4, .row-cols-md-3>* { flex: 0 0 33.333333%; max-width: 33.333333% } .col-md-3, .row-cols-md-4>* { flex: 0 0 25%; max-width: 25% } .row-cols-md-5>* { flex: 0 0 20%; max-width: 20% } .col-md-2, .row-cols-md-6>* { flex: 0 0 16.666667%; max-width: 16.666667% } .col-md-auto { flex: 0 0 auto; width: auto; max-width: 100% } .col-md-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .col-md-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .col-md-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .col-md-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .col-md-9 { flex: 0 0 75%; max-width: 75% } .col-md-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .col-md-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .order-md-first { order: -1 } .order-md-last { order: 13 } .order-md-0 { order: 0 } .order-md-1 { order: 1 } .order-md-2 { order: 2 } .order-md-3 { order: 3 } .order-md-4 { order: 4 } .order-md-5 { order: 5 } .order-md-6 { order: 6 } .order-md-7 { order: 7 } .order-md-8 { order: 8 } .order-md-9 { order: 9 } .order-md-10 { order: 10 } .order-md-11 { order: 11 } .order-md-12 { order: 12 } .offset-md-0 { margin-left: 0 } .offset-md-1 { margin-left: 8.333333% } .offset-md-2 { margin-left: 16.666667% } .offset-md-3 { margin-left: 25% } .offset-md-4 { margin-left: 33.333333% } .offset-md-5 { margin-left: 41.666667% } .offset-md-6 { margin-left: 50% } .offset-md-7 { margin-left: 58.333333% } .offset-md-8 { margin-left: 66.666667% } .offset-md-9 { margin-left: 75% } .offset-md-10 { margin-left: 83.333333% } .offset-md-11 { margin-left: 91.666667% } .dropdown-menu-md-left { right: auto; left: 0 } .dropdown-menu-md-right { right: 0; left: auto } .navbar-expand-md { flex-flow: row nowrap; justify-content: flex-start } .list-group-horizontal-md, .navbar-expand-md .navbar-nav { flex-direction: row } .navbar-expand-md .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-md .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem } .navbar-expand-md>.container, .navbar-expand-md>.container-fluid, .navbar-expand-md>.container-lg, .navbar-expand-md>.container-md, .navbar-expand-md>.container-sm, .navbar-expand-md>.container-xl { flex-wrap: nowrap } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-md .navbar-toggler { display: none } .list-group-horizontal-md .list-group-item:first-child { border-bottom-left-radius: .25rem; border-top-right-radius: 0 } .list-group-horizontal-md .list-group-item:last-child { border-top-right-radius: .25rem; border-bottom-left-radius: 0 } .list-group-horizontal-md .list-group-item.active { margin-top: 0 } .list-group-horizontal-md .list-group-item+.list-group-item { border-top-width: 1px; border-left-width: 0 } .list-group-horizontal-md .list-group-item+.list-group-item.active { margin-left: -1px; border-left-width: 1px } .d-md-none { display: none !important } .d-md-inline { display: inline !important } .d-md-inline-block { display: inline-block !important } .d-md-block { display: block !important } .d-md-table { display: table !important } .d-md-table-row { display: table-row !important } .d-md-table-cell { display: table-cell !important } .d-md-flex { display: flex !important } .d-md-inline-flex { display: inline-flex !important } .flex-md-row { flex-direction: row !important } .flex-md-column { flex-direction: column !important } .flex-md-row-reverse { flex-direction: row-reverse !important } .flex-md-column-reverse { flex-direction: column-reverse !important } .flex-md-wrap { flex-wrap: wrap !important } .flex-md-nowrap { flex-wrap: nowrap !important } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-md-fill { flex: 1 1 auto !important } .flex-md-grow-0 { flex-grow: 0 !important } .flex-md-grow-1 { flex-grow: 1 !important } .flex-md-shrink-0 { flex-shrink: 0 !important } .flex-md-shrink-1 { flex-shrink: 1 !important } .justify-content-md-start { justify-content: flex-start !important } .justify-content-md-end { justify-content: flex-end !important } .justify-content-md-center { justify-content: center !important } .justify-content-md-between { justify-content: space-between !important } .justify-content-md-around { justify-content: space-around !important } .align-items-md-start { align-items: flex-start !important } .align-items-md-end { align-items: flex-end !important } .align-items-md-center { align-items: center !important } .align-items-md-baseline { align-items: baseline !important } .align-items-md-stretch { align-items: stretch !important } .align-content-md-start { align-content: flex-start !important } .align-content-md-end { align-content: flex-end !important } .align-content-md-center { align-content: center !important } .align-content-md-between { align-content: space-between !important } .align-content-md-around { align-content: space-around !important } .align-content-md-stretch { align-content: stretch !important } .align-self-md-auto { align-self: auto !important } .align-self-md-start { align-self: flex-start !important } .align-self-md-end { align-self: flex-end !important } .align-self-md-center { align-self: center !important } .align-self-md-baseline { align-self: baseline !important } .align-self-md-stretch { align-self: stretch !important } .float-md-left { float: left !important } .float-md-right { float: right !important } .float-md-none { float: none !important } .m-md-0 { margin: 0 !important } .mt-md-0, .my-md-0 { margin-top: 0 !important } .mr-md-0, .mx-md-0 { margin-right: 0 !important } .mb-md-0, .my-md-0 { margin-bottom: 0 !important } .ml-md-0, .mx-md-0 { margin-left: 0 !important } .m-md-1 { margin: .25rem !important } .mt-md-1, .my-md-1 { margin-top: .25rem !important } .mr-md-1, .mx-md-1 { margin-right: .25rem !important } .mb-md-1, .my-md-1 { margin-bottom: .25rem !important } .ml-md-1, .mx-md-1 { margin-left: .25rem !important } .m-md-2 { margin: .5rem !important } .mt-md-2, .my-md-2 { margin-top: .5rem !important } .mr-md-2, .mx-md-2 { margin-right: .5rem !important } .mb-md-2, .my-md-2 { margin-bottom: .5rem !important } .ml-md-2, .mx-md-2 { margin-left: .5rem !important } .m-md-3 { margin: 1rem !important } .mt-md-3, .my-md-3 { margin-top: 1rem !important } .mr-md-3, .mx-md-3 { margin-right: 1rem !important } .mb-md-3, .my-md-3 { margin-bottom: 1rem !important } .ml-md-3, .mx-md-3 { margin-left: 1rem !important } .m-md-4 { margin: 1.5rem !important } .mt-md-4, .my-md-4 { margin-top: 1.5rem !important } .mr-md-4, .mx-md-4 { margin-right: 1.5rem !important } .mb-md-4, .my-md-4 { margin-bottom: 1.5rem !important } .ml-md-4, .mx-md-4 { margin-left: 1.5rem !important } .m-md-5 { margin: 3rem !important } .mt-md-5, .my-md-5 { margin-top: 3rem !important } .mr-md-5, .mx-md-5 { margin-right: 3rem !important } .mb-md-5, .my-md-5 { margin-bottom: 3rem !important } .ml-md-5, .mx-md-5 { margin-left: 3rem !important } .p-md-0 { padding: 0 !important } .pt-md-0, .py-md-0 { padding-top: 0 !important } .pr-md-0, .px-md-0 { padding-right: 0 !important } .pb-md-0, .py-md-0 { padding-bottom: 0 !important } .pl-md-0, .px-md-0 { padding-left: 0 !important } .p-md-1 { padding: .25rem !important } .pt-md-1, .py-md-1 { padding-top: .25rem !important } .pr-md-1, .px-md-1 { padding-right: .25rem !important } .pb-md-1, .py-md-1 { padding-bottom: .25rem !important } .pl-md-1, .px-md-1 { padding-left: .25rem !important } .p-md-2 { padding: .5rem !important } .pt-md-2, .py-md-2 { padding-top: .5rem !important } .pr-md-2, .px-md-2 { padding-right: .5rem !important } .pb-md-2, .py-md-2 { padding-bottom: .5rem !important } .pl-md-2, .px-md-2 { padding-left: .5rem !important } .p-md-3 { padding: 1rem !important } .pt-md-3, .py-md-3 { padding-top: 1rem !important } .pr-md-3, .px-md-3 { padding-right: 1rem !important } .pb-md-3, .py-md-3 { padding-bottom: 1rem !important } .pl-md-3, .px-md-3 { padding-left: 1rem !important } .p-md-4 { padding: 1.5rem !important } .pt-md-4, .py-md-4 { padding-top: 1.5rem !important } .pr-md-4, .px-md-4 { padding-right: 1.5rem !important } .pb-md-4, .py-md-4 { padding-bottom: 1.5rem !important } .pl-md-4, .px-md-4 { padding-left: 1.5rem !important } .p-md-5 { padding: 3rem !important } .pt-md-5, .py-md-5 { padding-top: 3rem !important } .pr-md-5, .px-md-5 { padding-right: 3rem !important } .pb-md-5, .py-md-5 { padding-bottom: 3rem !important } .pl-md-5, .px-md-5 { padding-left: 3rem !important } .m-md-n1 { margin: -.25rem !important } .mt-md-n1, .my-md-n1 { margin-top: -.25rem !important } .mr-md-n1, .mx-md-n1 { margin-right: -.25rem !important } .mb-md-n1, .my-md-n1 { margin-bottom: -.25rem !important } .ml-md-n1, .mx-md-n1 { margin-left: -.25rem !important } .m-md-n2 { margin: -.5rem !important } .mt-md-n2, .my-md-n2 { margin-top: -.5rem !important } .mr-md-n2, .mx-md-n2 { margin-right: -.5rem !important } .mb-md-n2, .my-md-n2 { margin-bottom: -.5rem !important } .ml-md-n2, .mx-md-n2 { margin-left: -.5rem !important } .m-md-n3 { margin: -1rem !important } .mt-md-n3, .my-md-n3 { margin-top: -1rem !important } .mr-md-n3, .mx-md-n3 { margin-right: -1rem !important } .mb-md-n3, .my-md-n3 { margin-bottom: -1rem !important } .ml-md-n3, .mx-md-n3 { margin-left: -1rem !important } .m-md-n4 { margin: -1.5rem !important } .mt-md-n4, .my-md-n4 { margin-top: -1.5rem !important } .mr-md-n4, .mx-md-n4 { margin-right: -1.5rem !important } .mb-md-n4, .my-md-n4 { margin-bottom: -1.5rem !important } .ml-md-n4, .mx-md-n4 { margin-left: -1.5rem !important } .m-md-n5 { margin: -3rem !important } .mt-md-n5, .my-md-n5 { margin-top: -3rem !important } .mr-md-n5, .mx-md-n5 { margin-right: -3rem !important } .mb-md-n5, .my-md-n5 { margin-bottom: -3rem !important } .ml-md-n5, .mx-md-n5 { margin-left: -3rem !important } .m-md-auto { margin: auto !important } .mt-md-auto, .my-md-auto { margin-top: auto !important } .mr-md-auto, .mx-md-auto { margin-right: auto !important } .mb-md-auto, .my-md-auto { margin-bottom: auto !important } .ml-md-auto, .mx-md-auto { margin-left: auto !important } .text-md-left { text-align: left !important } .text-md-right { text-align: right !important } .text-md-center { text-align: center !important } } #preview { position: absolute; display: block; z-index: 101; transition: .25s } .box-over-modal img { max-width: 100%; max-height: 800px } .menu ul { list-style: none; padding: 0; margin: 15px 0 0 } .menu a { color: #42861e; text-decoration: none; font-weight: 600; display: block; padding: 2px 0 } span.downloadBar { margin-left: -15px; text-transform: uppercase; font-size: 13px; background: #42861e; margin-bottom: 1em; position: relative; color: #fff; padding: 3px 20px 3px 15px; overflow: hidden; text-overflow: ellipsis; display: inline-block; font-family: var(--family-lato); font-weight: var(--weight-600) } span.downloadBar::after { content: ''; position: absolute; border-style: solid; border-color: #42861e #f5f5f5; border-width: 12px 10px 12px 0; top: 50%; right: -1px; transform: translateY(-50%) } .byPlan-img img { border-radius: 100%; position: absolute; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; left: 0; top: 0 } .byPlan-img { width: 100%; padding-bottom: 100%; position: relative } .button-group { display: flex; width: 100%; align-items: center } .image-modal-fluid .modal-lg { max-width: 900px } .headAc { padding-top: 130px } #myEmailToFriendModal .form-control { border-color: #adadad } .favorite-container { margin: 50px 0; border: 1px solid #0a56a5 } .row.f-inner.fav-tableStyle~.row.f-inner.fav-tableStyle { margin-top: 20px; padding-top: 20px; border-top: 1px solid #0a56a5 } .form-control, .multiselect-native-select .btn-group .multiselect { border-color: #9a9a9a } .form-control.search_keyword { font-weight: 700; color: #000; font-size: 18px; padding: 5px 15px; height: 42px } button#hideMe { max-width: 400px !important; font-size: 14px; z-index: 999999; position: absolute; top: 10px; left: 10px; background: #ce4646; border: 1px solid #721c24; font-family: OpenSans-Semibold; color: #fff } .p_photos { position: absolute; top: 5px; right: 4px; width: 38px; height: 24px; overflow: hidden; z-index: 10; opacity: 0 } .resultNullHolder { display: flex; align-items: center; justify-content: center; height: 40rem; width: 100%; flex-direction: column } .slick-list, .slick-slider, .slick-track { display: block; position: relative } .resultNullHolder p { text-align: center; font-weight: var(--weight-600); color: #141f2b; display: flex; flex-direction: column } .directContent.farmHouseDetailContainer .farmHouseDetailHolder span, .materials-list h1 { font-weight: var(--weight-700); font-family: var(--family-montserrat) } .resultNullHolder h4 { font-size: 3rem; color: #42861e; text-transform: uppercase; margin-bottom: 1.5rem } @media (max-width:768px) { #preview { display: none } #preview.active { display: flex; align-items: center; justify-content: center; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 999; height: 100%; padding: 0 5px; background: rgba(0, 0, 0, .2) } } .slick-slider { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none } .slick-list { overflow: hidden; margin: 0; padding: 0 } .slick-list.dragging { cursor: pointer; cursor: hand } .slick-slider .slick-list, .slick-slider .slick-track { transform: translate3d(0, 0, 0) } .slick-track { top: 0; left: 0; margin-left: auto; margin-right: auto } .slick-track:after, .slick-track:before { display: table; content: '' } .slick-slide { display: none; float: left; height: 100%; min-height: 1px } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent } .button-blue:focus, .button-blue:hover, .button-blue:not(:disabled):not(.disabled).active, .button-blue:not(:disabled):not(.disabled):active, .show>.button-blue.dropdown-toggle { background-color: #084788; border-color: #084788; color: #fff } .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li span { font-family: var(--family-lato); font-weight: var(--weight-600); font-size: 14px; color: #fff; margin: 0 15px 10px 0; background: #3b8beb; display: inline-block; padding: 4px 35px 4px 15px; border-radius: 15px; position: relative } .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li span a { position: absolute; top: 50%; transform: translateY(-50%); right: 14px } .productFilterRefineSec .featureBadgeListHolder .featureBadgeList li span a svg { width: 10px; height: 10px } .filterCloseTrigger { display: none; border: 0; background: 0 0 } .filterCloseTrigger svg path { fill: #7f7f7f } .paymentConfirmModal .modal-body { position: relative; padding: 3rem 1rem } .paymentConfirmModal .close { position: absolute; top: 1rem; right: 1rem } .paymentConfirmModal .modal-body h4 { font-weight: 700; margin: 1rem; color: #42861e; font-size: 2rem } .paymentConfirmModal .modal-body p { font-size: 1.3rem } .button-blue { background: #3b8beb; border-color: #3b8beb; color: #fff } .btn-light, .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a i { background: #fff } .button-blue:not(:disabled):not(.disabled).active:focus, .button-blue:not(:disabled):not(.disabled):active:focus, .show>.button-blue.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(10, 86, 165, .5) } .button-blue.disabled, .button-blue:disabled { color: #fff; background-color: #3b8beb; border-color: #3b8beb } .btn-light { border-color: #ffff; color: #3b8beb } .directContent.farmHouseDetailContainer .farmHouseDetailHolder .wrapper1 ul { padding-left: 35px } .directContent.farmHouseDetailContainer .farmHouseDetailHolder :not(.btn) { color: #000 } .directContent.farmHouseDetailContainer .farmHouseDetailHolder .center-block { margin: 0 auto; display: block; max-width: 100% } .directContent.farmHouseDetailContainer .farmHouseDetailHolder h2, .directContent.farmHouseDetailContainer .farmHouseDetailHolder h6 { font-family: var(--family-montserrat); font-weight: var(--weight-700); margin: 0 } .primary-slider .video_play { position: absolute; right: 10px; top: 10px; background: rgba(0, 0, 0, .65); padding: 15px; width: 100px; height: 55px; z-index: 1; border-radius: 4px; display: flex; align-items: center; justify-content: center; transition: .25s; cursor: pointer } .primary-slider .video_play .video { line-height: 1 } .primary-slider .video_play:hover { background: rgba(0, 0, 0, .8) } .primary-slider .video_play:after { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, .25); z-index: -1; border-radius: 4px; transition: .5s } .primary-slider .video_play:hover:after { left: -10px; right: -10px; top: -10px; bottom: -10px } .contentSp p a { color: #3b8beb !important } .sliderSec .sale-banner { position: absolute; left: 0; top: 0; bottom: 0; z-index: 1 } .topBarRightInfoSec .saleBannerSec { padding: 5px 0 5px 10px } .topBarRightInfoSec .saleBannerSec img { max-height: 60px } .sliderSec .sale-banner img { height: 100% } .topBarContainer.saleBannerActive .topBarRightInfoSec { padding-right: 240px } header .saleBannerSec { position: absolute; top: 10px; right: 0; z-index: 1 } header .saleBannerSec img { max-width: 240px } @media (min-width:1920px) { .topBarContainer.saleBannerActive .topBarRightInfoSec { padding-right: 160px } } @media (min-width:2000px) { .topBarContainer.saleBannerActive .topBarRightInfoSec { padding-right: 60px } } @media (min-width:2250px) { .topBarContainer.saleBannerActive .topBarRightInfoSec { padding-right: 0 } } @media (max-width:767px) { .loginPanel { min-height: 400px } .loginModal button.close { left: auto; right: 0; top: 0; bottom: auto; border-radius: 0; z-index: 9 } .loginPanel .loginImage { display: none } .loginPanel .loginField { width: 100%; padding: 1.5em } .alternateSection { position: static; margin-top: 1em; justify-content: center; flex-direction: column } .loginPanel .loginField .alternateSection .btn { margin: 5px 0 0 } .loginPanel .loginField h2 { font-size: 18px } .loginPanel .loginField .form-group { margin-bottom: 1.25em } .loginPanel .loginField form { margin-top: 10px } .navBarHolder .navbar { justify-content: space-between } .navBarHolder .navbar .navbar-brand { margin: 0 1em } .navBarHolder .navbar .btn-login { padding: 5px 10px; border-radius: 4px } .signup .loginPanel .loginField { width: 100%; padding: 1.5em; height: 90vh; overflow: auto; display: block } .navbarOpened { height: 100vh; overflow: hidden } .h1, h1 { font-size: 1.5rem } .h2, h2 { font-size: 1.25rem } .mega-menu-tile h2, ul.mega-menu li a { color: #fff } .sticky { position: static } .inputHold-input, .inputHold-inputText { width: 100% !important } .headerSteps .orderCostBuildSec .wizard { padding-left: 0; padding-right: 0 } .btn { padding-left: 1rem; padding-right: 1rem } .stepsPlanBoundry { padding: 10px } .topBarleftInfoSec ul li img { width: 20px } .topBarleftInfoSec ul li p a { font-size: 16px } .topBarContainer.saleBannerActive .topBarRightInfoSec { padding-right: 0 } } .dropdown-menu.mega-menu-section { left: 0; right: auto; min-width: 450px; width: 100%; padding: 20px 15px } .mega-menu .singleMenu { flex: 1; text-align: left; padding: 0 10px } .mega-menu .singleMenu ul.mega-menu { width: 100%; max-width: max-content; flex-direction: column; margin: 5px 0 0 } .mega-menu .singleMenu .mega-menu-tile h2 { margin: 0; font-size: 16px; text-align: left; background: #3b8beb; padding: 3px 8px; color: #fff } .mega-menu .singleMenu ul.mega-menu li { flex: auto; max-width: max-content; padding: 5px 0 } .mega-menu .singleMenu ul.mega-menu li a { font-size: 14px; line-height: normal } .alert-reverse { color: #721c24; display: none } .additionalContent { padding-right: 10px } .errorRequired #modified-error { order: 3; margin-bottom: 0; margin-left: 10px } .disabled-purchase-options .dropdown-menu:after, .disabled-purchase-options:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; cursor: not-allowed } .rightPanelheading { color: #fff !important; background-color: #3a7b1d; font-size: 21px; font-family: var(--family-montserrat); font-weight: var(--weight-600); padding: 13px 20px; margin: 0; width: 100% } .disabled-purchase-options button { cursor: not-allowed } .purchase-option-wrapper .planDropdown li { padding-left: 35px; position: relative } .purchase-option-wrapper .planDropdown li:before { width: 14px; height: 14px; top: 0; left: 10px; margin-top: 13px; border-radius: 3px; position: absolute; cursor: pointer; border: 2px solid #959595; content: '' } .purchase-option-wrapper .planDropdown li.selected:before { background: #007bff } .purchase-option-wrapper .planDropdown li.selected::after { content: ''; width: 14px; height: 14px; top: 0; left: 10px; margin-top: 13px; border-radius: 3px; position: absolute; cursor: pointer; content: ''; color: #fff; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSI4cHgiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE4IDE1IiB3aWR0aD0iOHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PHRpdGxlLz48ZGVzYy8+PGRlZnMvPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiPjxnIGZpbGw9IiNmZmZmZmYiIGlkPSJDb3JlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNDIzLjAwMDAwMCwgLTQ3LjAwMDAwMCkiPjxnIGlkPSJjaGVjayIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDIzLjAwMDAwMCwgNDcuNTAwMDAwKSI+PHBhdGggZD0iTTYsMTAuMiBMMS44LDYgTDAuNCw3LjQgTDYsMTMgTDE4LDEgTDE2LjYsLTAuNCBMNiwxMC4yIFoiIGlkPSJTaGFwZSIvPjwvZz48L2c+PC9nPjwvc3ZnPg=="); background-repeat: no-repeat; background-position: center center } .disabled-purchase-options:hover .customTooltip { visibility: visible; opacity: 1 } .customTooltip { width: 100%; position: absolute; background: #000; z-index: 999; border-radius: 5px; padding: 10px 20px; color: #fff; left: -100%; top: -15px; opacity: 0 } .customTooltip:after { content: ''; height: 10px; width: 10px; background: #000; transform: rotate(45deg); position: absolute; right: -5px; inset-block: 0; margin: auto } .highlighted-chkbox { background: #e1e1e1; padding: 5px 15px; border-radius: 3px; border: 2px dashed #b9b9b9; position: relative } .highlighted-chkbox input[type=checkbox] { top: 6px; left: 15px } .mml-banner { color: #fff !important; font-size: 70%; padding-left: 5px } ul.navbar-nav li.nav-item.dropdown:nth-child(5) { position: initial !important } .dropdown-menu.feature-menu-section { padding: 15px; width: 100% } ul.navbar-nav li.nav-item.dropdown:nth-child(5) .dropdown-menu { margin: 0; top: calc(100% - 38px) } @media screen and (max-width:767px) { .mml-banner { font-size: 92% } .padding-left-xs-0 { padding-left: 0 !important } .margin-top-xs-0 { margin-top: 0 !important } } @media screen and (max-width:500px) { .mml-banner { font-size: 70% } } @media screen and (min-width:768px) and (max-width:991px) { .mml-banner { font-size: 72% } } @media screen and (min-width:992px) and (max-width:1199px) { .mml-banner { font-size: 92% } } @media screen and (min-width:1200px) and (max-width:1339px) { .mml-banner { font-size: 68% } } @media screen and (min-width:1400px) { .mml-banner { font-size: 80% } } @media (min-width:1800px) { .housePlanProductContainer.housePlanThreeColumn .housePlanProductHolder .productBox { width: calc(33.3333% - 10px) } .housePlanProductContainer.housePlanThreeColumn>.container { padding: 0 50px; max-width: 2100px } .housePlanProductContainer.housePlanThreeColumn .housePlanProductSec .productFilterRefineHolder { width: 100%; max-width: 340px } .housePlanProductContainer.housePlanThreeColumn .housePlanProductSec .housePlanProductHolder { width: calc(100% - 340px) } .housePlanProductContainer.housePlanThreeColumn .housePlanFilterTabSp { margin-left: auto; margin-right: auto } .mml-banner { font-size: 82% } } @media (min-width:1900px) { .mml-banner { font-size: 92% } } .materials-list h1 { font-size: 48px !important; color: #131f2b; text-align: center; margin-bottom: .5rem } .materials-list h2 { font-size: 2rem !important } .materials-list h2>span { display: block; font-family: var(--family-montserrat); font-weight: var(--weight-600); font-size: 1.5rem } .dropdown-menu.sizeFlexibleMenu { width: 750px } .dropdown-menu.sizeFlexibleMenu ul.mega-menu { flex-direction: row; flex-wrap: wrap; width: 100%; max-width: inherit; gap: 0 1rem; justify-content: flex-start } .dropdown-menu.sizeFlexibleMenu ul.mega-menu li, .featureStyleMenu .mega-menu .singleMenu:first-child ul.mega-menu li { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - .5rem) } .styleFlexibleMenu ul.mega-menu li { flex: 0 0 200px; max-width: 200px; padding: 0 10px } .featureStyleMenu .mega-menu .singleMenu:first-child { flex: 0 0 450px; max-width: 450px } .featureStyleMenu .mega-menu .singleMenu:first-child ul.mega-menu { max-width: 100%; flex-wrap: wrap; flex-direction: row; gap: 0 1rem } .img-col-2>img { max-width: 50% !important; flex: 0 0 50% } .img-center { display: block; text-align: center } .fixRight.sec_sticky_1 { position: sticky !important; top: 155px !important } .gap-2 { gap: 1.5rem } .editorImgBlock { border: 1px solid #dedede; display: flex; align-items: center; justify-content: center; flex: 0 0 calc(50% - 0.75rem); max-width: calc(50% - .75rem) } .editorImgBlock img { max-width: 100%; max-height: 500px } .custom-sub-heading { font-size: 18px !important; font-weight: var(--weight-700) !important; margin: 0 !important; font-family: var(--family-montserrat) !important; line-height: 36px !important } .buildCostTabContainer.contentSp h1, .buildCostTabContainer.contentSp h2, .buildCostTabContainer.contentSp h3, .buildCostTabContainer.contentSp h4, .buildCostTabContainer.contentSp h5, .buildCostTabContainer.contentSp h6 { margin-bottom: 1rem !important; margin-top: 1.5rem !important } .buildCostTabContainer.contentSp .contentheading { font-size: 26px !important; color: #131f2b; font-family: var(--family-lato); font-weight: var(--weight-600) } .headerOveride .navBarHolder .navbar .navbar-nav { width: auto; gap: .8rem; margin: 0 auto } @media only screen and (max-width:1710px) { .headerOveride .navBarHolder .navbar .navbar-nav { gap: .4rem } } .headerSearchBar { position: relative; width: 220px } .headerSearchBar .form-control { background: #3b8beb; color: #fff; border-radius: 30px; padding-left: 45px; border: 0; height: 33px } .headerSearchBar .form-control::-ms-input-placeholder { color: #fff } .headerSearchBar .form-control::placeholder { color: #fff } .headerSearchBar .btnSearch, .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec .housePlanSearchSec .btnSearch { position: absolute; top: 0; left: 0; width: 45px; height: 100%; background: 0 0; border: 0; display: flex; align-items: center; justify-content: center } .headerOveride .topBarRightInfoSec ul li a i { box-shadow: 0 1px 4px rgba(0, 0, 0, .6) } .adviceContact { background: #3a7b1d; border-radius: 8px; padding: .5rem .7rem; display: flex; flex-direction: column; color: #fff; align-items: center; text-align: center; font-size: 13px; justify-content: center } .btn-searchIcon, .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem.modifyPlanListItem, .searchBarholder { background: #3b8beb } .adviceContact span { display: flex; align-items: center; gap: .3rem; white-space: nowrap } .adviceContact span svg { width: 16px; fill: #fff } @media only screen and (max-width:991px) { .navBarHolder .navbar .navbar-brand img { max-height: 60px; width: auto } .headerOveride .navbar-collapse { z-index: 999999999 } } .text-white { color: #fff !important } .btn-searchIcon { display: flex; align-items: center; justify-content: center; width: 33px; height: 33px; border: 0; border-radius: 100% } .searchdropDown.dropdown .dropdown-menu { left: auto; right: 0; padding: 15px } .searchBarholder { position: absolute; top: 100%; right: 0; width: 350px; z-index: 999; padding: 10px 15px } @media only screen and (min-width:1670px) { .headerSearchWithoutDropdown { display: block } .searchdropDown { display: none } } @media only screen and (min-width:1300px) { .navbar-expand-lg { flex-flow: row nowrap; justify-content: flex-start } .list-group-horizontal-lg, .navbar-expand-lg .navbar-nav { flex-direction: row } .navbar-expand-lg .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-lg .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem } .navbar-expand-lg>.container, .navbar-expand-lg>.container-fluid, .navbar-expand-lg>.container-lg, .navbar-expand-lg>.container-md, .navbar-expand-lg>.container-sm, .navbar-expand-lg>.container-xl { flex-wrap: nowrap } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-lg .navbar-toggler { display: none } } @media only screen and (max-width:1299px) { .navbar-collapse { position: fixed; top: 0; left: 0; height: 100% !important; overflow: auto; background: #3b8beb; z-index: 9999; width: 100%; padding: 20px; display: block !important; transition: left .3s ease-in-out } .navbar-collapse.collapse { left: -100% } .navbar-collapse.collapse.show { left: 0 } .navBarHolder .navbar .navbar-nav { margin-left: 0; padding: 0 } .navBarHolder .navbar .navbar-nav .nav-link, .navbar-nav .dropdown-menu .dropdown-item { border-bottom: 1px solid #4f97ed; color: #fff; font-family: var(--family-montserrat); font-weight: var(--weight-600); padding: .8rem 1rem } .navBarHolder .navbar .navbar-nav .dropdown-toggle::after { height: 26px; float: right; background: url(/images/nav-dropdown-arrow-white.png?3e2058f3fbbd07316541538be44f2427) center center no-repeat } .navbar-nav .dropdown-menu { background: rgba(0, 0, 0, .2); box-shadow: none; border: 0; border-radius: 0; padding: 0 } .navbar-nav .dropdown-menu .dropdown-item { font-size: 14px } .navbar-nav .dropdown-menu .dropdown-item:hover { background: #4f97ed } .navbar-collapse .navbar-toggler { float: right } .navbar-collapse .navbar-toggler-icon { background: url(/images/navbar-cross.png?083f8c2dfec28d36dea7818fde4b069d) center center no-repeat } .navbar-collapse .topSearchSec { padding: 20px; display: flex; width: 100% } .navbar-collapse .topSearchSec .form-control { height: calc(2.6em + .75rem + 2px); min-width: auto } .navbar-collapse .topSearchSec .btn { padding: .25rem 1.2rem } .navbar-collapse .topSearchSec .btn i { margin: 0 } .searchdropDown { display: none } } @media only screen and (max-width:1482px) { .adviceContact { display: none } } .housePlanActionSp.housePlanSliderActionoHolder { box-shadow: none; background: 0 0 } .housePlanActionSp.housePlanSliderActionoHolder ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; align-items: stretch } .housePlanActionSp.housePlanSliderActionoHolder ul li { border: 0; box-shadow: 0 0 40px 0 rgba(0, 0, 0, .07); border-radius: 50px } .housePlanActionSp.housePlanSliderActionoHolder ul li a { flex-direction: row; align-items: center; gap: .5rem; font-size: 13px; padding: 5px 15px; text-align: left; color: #3a7b1d; height: 100% } .housePlanActionSp.housePlanSliderActionoHolder ul li a i { margin: 0; width: 30px; height: 30px; background: 0 0 } .housePlanActionSp.housePlanSliderActionoHolder ul li a i img { max-width: 100%; max-height: 22px } .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - .5rem); background: #3a7b1d; padding: 7px 15px } .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a { font-size: 21px; color: #fff; padding: 0 } .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a span { margin: 0 auto; text-decoration: underline } @media only screen and (min-width:1200px) { .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a i { background: #fff; width: 44px; height: 44px } .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a i img { max-width: 100%; max-height: 28px } } @media only screen and (max-width:1199px) { .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem a { font-size: 14px } } @media only screen and (max-width:575px) { .housePlanActionSp.housePlanSliderActionoHolder ul li.costPlanListItem { flex: 0 0 100%; max-width: 100% } } .video_play.videoIconSp { height: auto; width: auto; padding: 0 10px } .video_play.videoIconSp img { filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(274deg) brightness(110%) contrast(101%); width: 70px } @media (min-width:992px) { .flex-lg-row { flex-direction: row !important } .flex-lg-column { flex-direction: column !important } .flex-lg-row-reverse { flex-direction: row-reverse !important } .flex-lg-column-reverse { flex-direction: column-reverse !important } .flex-lg-wrap { flex-wrap: wrap !important } .flex-lg-nowrap { flex-wrap: nowrap !important } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-lg-fill { flex: 1 1 auto !important } .flex-lg-grow-0 { flex-grow: 0 !important } .flex-lg-grow-1 { flex-grow: 1 !important } .flex-lg-shrink-0 { flex-shrink: 0 !important } .flex-lg-shrink-1 { flex-shrink: 1 !important } .justify-content-lg-start { justify-content: flex-start !important } .justify-content-lg-end { justify-content: flex-end !important } .justify-content-lg-center { justify-content: center !important } .justify-content-lg-between { justify-content: space-between !important } .justify-content-lg-around { justify-content: space-around !important } .align-items-lg-start { align-items: flex-start !important } .align-items-lg-end { align-items: flex-end !important } .align-items-lg-center { align-items: center !important } .align-items-lg-baseline { align-items: baseline !important } .align-items-lg-stretch { align-items: stretch !important } .align-content-lg-start { align-content: flex-start !important } .align-content-lg-end { align-content: flex-end !important } .align-content-lg-center { align-content: center !important } .align-content-lg-between { align-content: space-between !important } .align-content-lg-around { align-content: space-around !important } .align-content-lg-stretch { align-content: stretch !important } .align-self-lg-auto { align-self: auto !important } .align-self-lg-start { align-self: flex-start !important } .align-self-lg-end { align-self: flex-end !important } .align-self-lg-center { align-self: center !important } .align-self-lg-baseline { align-self: baseline !important } .align-self-lg-stretch { align-self: stretch !important } .float-lg-left { float: left !important } .float-lg-right { float: right !important } .float-lg-none { float: none !important } .m-lg-0 { margin: 0 !important } .mt-lg-0, .my-lg-0 { margin-top: 0 !important } .mr-lg-0, .mx-lg-0 { margin-right: 0 !important } .mb-lg-0, .my-lg-0 { margin-bottom: 0 !important } .ml-lg-0, .mx-lg-0 { margin-left: 0 !important } .m-lg-1 { margin: .25rem !important } .mt-lg-1, .my-lg-1 { margin-top: .25rem !important } .mr-lg-1, .mx-lg-1 { margin-right: .25rem !important } .mb-lg-1, .my-lg-1 { margin-bottom: .25rem !important } .ml-lg-1, .mx-lg-1 { margin-left: .25rem !important } .m-lg-2 { margin: .5rem !important } .mt-lg-2, .my-lg-2 { margin-top: .5rem !important } .mr-lg-2, .mx-lg-2 { margin-right: .5rem !important } .mb-lg-2, .my-lg-2 { margin-bottom: .5rem !important } .ml-lg-2, .mx-lg-2 { margin-left: .5rem !important } .m-lg-3 { margin: 1rem !important } .mt-lg-3, .my-lg-3 { margin-top: 1rem !important } .mr-lg-3, .mx-lg-3 { margin-right: 1rem !important } .mb-lg-3, .my-lg-3 { margin-bottom: 1rem !important } .ml-lg-3, .mx-lg-3 { margin-left: 1rem !important } .m-lg-4 { margin: 1.5rem !important } .mt-lg-4, .my-lg-4 { margin-top: 1.5rem !important } .mr-lg-4, .mx-lg-4 { margin-right: 1.5rem !important } .mb-lg-4, .my-lg-4 { margin-bottom: 1.5rem !important } .ml-lg-4, .mx-lg-4 { margin-left: 1.5rem !important } .m-lg-5 { margin: 3rem !important } .mt-lg-5, .my-lg-5 { margin-top: 3rem !important } .mr-lg-5, .mx-lg-5 { margin-right: 3rem !important } .mb-lg-5, .my-lg-5 { margin-bottom: 3rem !important } .ml-lg-5, .mx-lg-5 { margin-left: 3rem !important } .p-lg-0 { padding: 0 !important } .pt-lg-0, .py-lg-0 { padding-top: 0 !important } .pr-lg-0, .px-lg-0 { padding-right: 0 !important } .pb-lg-0, .py-lg-0 { padding-bottom: 0 !important } .pl-lg-0, .px-lg-0 { padding-left: 0 !important } .p-lg-1 { padding: .25rem !important } .pt-lg-1, .py-lg-1 { padding-top: .25rem !important } .pr-lg-1, .px-lg-1 { padding-right: .25rem !important } .pb-lg-1, .py-lg-1 { padding-bottom: .25rem !important } .pl-lg-1, .px-lg-1 { padding-left: .25rem !important } .p-lg-2 { padding: .5rem !important } .pt-lg-2, .py-lg-2 { padding-top: .5rem !important } .pr-lg-2, .px-lg-2 { padding-right: .5rem !important } .pb-lg-2, .py-lg-2 { padding-bottom: .5rem !important } .pl-lg-2, .px-lg-2 { padding-left: .5rem !important } .p-lg-3 { padding: 1rem !important } .pt-lg-3, .py-lg-3 { padding-top: 1rem !important } .pr-lg-3, .px-lg-3 { padding-right: 1rem !important } .pb-lg-3, .py-lg-3 { padding-bottom: 1rem !important } .pl-lg-3, .px-lg-3 { padding-left: 1rem !important } .p-lg-4 { padding: 1.5rem !important } .pt-lg-4, .py-lg-4 { padding-top: 1.5rem !important } .pr-lg-4, .px-lg-4 { padding-right: 1.5rem !important } .pb-lg-4, .py-lg-4 { padding-bottom: 1.5rem !important } .pl-lg-4, .px-lg-4 { padding-left: 1.5rem !important } .p-lg-5 { padding: 3rem !important } .pt-lg-5, .py-lg-5 { padding-top: 3rem !important } .pr-lg-5, .px-lg-5 { padding-right: 3rem !important } .pb-lg-5, .py-lg-5 { padding-bottom: 3rem !important } .pl-lg-5, .px-lg-5 { padding-left: 3rem !important } .m-lg-n1 { margin: -.25rem !important } .mt-lg-n1, .my-lg-n1 { margin-top: -.25rem !important } .mr-lg-n1, .mx-lg-n1 { margin-right: -.25rem !important } .mb-lg-n1, .my-lg-n1 { margin-bottom: -.25rem !important } .ml-lg-n1, .mx-lg-n1 { margin-left: -.25rem !important } .m-lg-n2 { margin: -.5rem !important } .mt-lg-n2, .my-lg-n2 { margin-top: -.5rem !important } .mr-lg-n2, .mx-lg-n2 { margin-right: -.5rem !important } .mb-lg-n2, .my-lg-n2 { margin-bottom: -.5rem !important } .ml-lg-n2, .mx-lg-n2 { margin-left: -.5rem !important } .m-lg-n3 { margin: -1rem !important } .mt-lg-n3, .my-lg-n3 { margin-top: -1rem !important } .mr-lg-n3, .mx-lg-n3 { margin-right: -1rem !important } .mb-lg-n3, .my-lg-n3 { margin-bottom: -1rem !important } .ml-lg-n3, .mx-lg-n3 { margin-left: -1rem !important } .m-lg-n4 { margin: -1.5rem !important } .mt-lg-n4, .my-lg-n4 { margin-top: -1.5rem !important } .mr-lg-n4, .mx-lg-n4 { margin-right: -1.5rem !important } .mb-lg-n4, .my-lg-n4 { margin-bottom: -1.5rem !important } .ml-lg-n4, .mx-lg-n4 { margin-left: -1.5rem !important } .m-lg-n5 { margin: -3rem !important } .mt-lg-n5, .my-lg-n5 { margin-top: -3rem !important } .mr-lg-n5, .mx-lg-n5 { margin-right: -3rem !important } .mb-lg-n5, .my-lg-n5 { margin-bottom: -3rem !important } .ml-lg-n5, .mx-lg-n5 { margin-left: -3rem !important } .m-lg-auto { margin: auto !important } .mt-lg-auto, .my-lg-auto { margin-top: auto !important } .mr-lg-auto, .mx-lg-auto { margin-right: auto !important } .mb-lg-auto, .my-lg-auto { margin-bottom: auto !important } .ml-lg-auto, .mx-lg-auto { margin-left: auto !important } .text-lg-left { text-align: left !important } .text-lg-right { text-align: right !important } .text-lg-center { text-align: center !important } .subContainer { width: 100%; margin: 0 auto; max-width: 75% } .makeUniqueSec .subContainer { max-width: 85% } .customDreamSec .subContainer, .qucikAdviceSec .subContainer { max-width: 90% } .navBarHolder { position: relative } .navBarHolder .mg-conteainer, .navBarHolder .navbar { position: static } .navBarHolder .navbar-expand-lg .navbar-nav .mega-menu-container { width: 100%; left: 0; right: 0; top: 59px } .navBarHolder .navbar .navbar-nav .nav-item { padding: 5px 0 } .navbar-expand-lg .navbar-nav .dropdown-menu { margin: 0; top: calc(100% - 5px) } ul.mega-menu li { flex: 0 0 33.33%; max-width: 10.33% } .modal-dialog.modal-lg-sp { max-width: 800px } } @media only screen and (min-width:768px) and (max-width:1299px) { .headerSearchWithoutDropdown { display: block } } .update-banner-slider.sliderSec .mainSlider .slick-arrow { top: 10% } .update-banner-slider.sliderSec .mainSlider .slick-arrow.slick-prev { left: 3% } .update-banner-slider.sliderSec .mainSlider .slick-arrow.slick-next { transform: rotate(0); top: 9%; right: 3% } .update-banner-slider.sliderSec .mainSlider .slick-prev.slick-arrow::before { background: #fff !important; content: "View Previous Plans"; padding: 5px 15px 5px 25px; color: #3b8beb; border-radius: 30px; border: 0; font-weight: 700 } .update-banner-slider.sliderSec .mainSlider .slick-prev.slick-arrow::after { content: ""; position: absolute; background: url("../img/left-arrow.svg") 0 0/contain no-repeat; top: 3px; left: 10px; width: 30px; height: 20px } .update-banner-slider.sliderSec .mainSlider .slick-next.slick-arrow::before { background: #fff !important; content: "View Next Plans"; padding: 5px 32px 5px 15px; color: #3b8beb; border-radius: 30px; border: 0; font-weight: 700 } .update-banner-slider.sliderSec .mainSlider .slick-next.slick-arrow::after { content: ""; position: absolute; background: url("../img/right-arrow.svg") 0 0/contain no-repeat; top: 4px; right: 1px; width: 30px; height: 15px } .update-banner-slider.sliderSec .btn-view-plan { position: absolute; z-index: 9; top: 17%; padding-left: 10px; left: 3% } .update-banner-slider.sliderSec .btn-view-plan h1 { font-size: 25px; color: #fff; font-weight: var(--weight-600); font-family: var(--family-montserrat) } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanProductStyleFilter, .update-banner-slider.sliderSec .btn-view-plan span { display: flex; align-items: center; justify-content: center; gap: 10px } .update-banner-slider.sliderSec .btn-view-plan span a { color: #fff; font-family: var(--family-montserrat); padding-bottom: 2px; border-bottom: 1px solid #fff; font-weight: var(--weight-500) } .update-banner-slider.sliderSec ul li .sliderCaption { justify-content: space-evenly; flex-direction: row } .custom-plan-filter-Section .planFilterSec { position: absolute; top: 55%; left: 0; width: 100%; transform: translateY(0); margin-top: inherit; z-index: 99 } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec { padding: 0; position: relative; display: flex; gap: 0; align-items: start; flex-direction: column } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec img.lazyloaded { position: absolute; bottom: 86px; left: -66px; width: 150px; height: 120px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec>form { width: 100%; max-width: 100% } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp { border-radius: 30px; gap: 4rem; padding: 25px 45px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterBtnSec button { border-radius: 10px; gap: 10px; font-size: 18px; display: flex; align-items: center; justify-content: center } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder { justify-content: space-around } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup.sqrFt { max-width: 200px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup.sqrFt input::placeholder { color: #a7a7a7 } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup { max-width: 170px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup .form-control { background: #f0f0f0; color: #a7a7a7; border-radius: 30px; border: 0; height: 30px; line-height: 1; margin-top: 0 } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup .form-control:not(.form-control.squre-foot) { appearance: none; -moz-appearance: none; -webkit-appearance: none; background-image: url('/images/nav-dropdown-arrow.png?b20f3fc…'); background-position: calc(100% - 20px) center; background-repeat: no-repeat } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup .form-group { display: flex; flex-direction: column; align-items: center; justify-content: center } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup label { font-weight: var(--weight-700); font-size: 17px; font-family: var(--family-lato); color: #093265; display: flex; align-items: end } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup img, .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup label img { position: inherit; margin-right: 5px } .custom-plan-filter-Section .planFilterSec .direction-arrow { display: flex; align-items: center; justify-content: center; margin-top: 2rem } .custom-plan-filter-Section .planFilterSec .direction-arrow img { transform: rotate(-90deg); filter: brightness(4.1); animation: 1s infinite bounce; transition: transform .3s, filter .3s } @keyframes bounce { 0%, 100%, 20%, 50%, 80% { transform: translateY(0) rotate(-90deg) } 40% { transform: translateY(-20px) rotate(-90deg) } 60% { transform: translateY(-10px) rotate(-90deg) } } .dream-home-section { padding: 30px 0 } .dream-home-section .container { max-width: 1500px } .dream-home-section .head-wrapper { display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center } .dream-home-section .head-wrapper .heading h2 { font-weight: var(--weight-700); font-family: var(--family-montserrat); font-size: 36px; line-height: 1 } .dream-home-section .bottom-paragraph p, .dream-home-section .head-wrapper p { font-weight: var(--weight-600); font-family: var(--family-montserrat); margin: 30px 0 } .dream-home-section .head-wrapper a { font-weight: var(--weight-600); font-family: var(--family-montserrat); margin-bottom: 20px; font-size: 18px } .dream-home-section .card-container { display: flex; align-items: center; justify-content: center; width: 100%; gap: 25px; flex-wrap: wrap; padding: 3rem 0 } .dream-home-section .card-container .card { max-width: 340px; width: 100%; height: 240px; border-radius: 20px; overflow: hidden; border: 0; box-shadow: 1px 1px 2px 0 } .dream-home-section .card-container .card a, .dream-home-section .card-container .card a img { width: 100%; height: 100%; object-position: center; object-fit: cover } .dream-home-section .card-container .card .card-text { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .1) } .dream-home-section .card-container .card .card-text h3 { color: #fff } .dream-home-section .bottom-paragraph { width: 100%; max-width: 1100px; text-align: center; margin: 0 auto } .featured-plan-section .container h2 { font-weight: var(--weight-700); font-family: var(--font-family-sans-serif); font-size: 36px; line-height: 1; text-align: center; margin: 3% } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow { filter: brightness(0) !important; position: absolute; top: 50%; border: 0 !important; outline: 0 !important; background: 0 0 } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow.slick-disabled { opacity: 1; visibility: visible; filter: brightness(.5) !important } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow.slick-next { right: -40px; transform: rotate(180deg) } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow.slick-prev { left: -40px } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container { display: flex; align-items: center; justify-content: space-around } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card { max-width: 380px; width: 100%; overflow: hidden; height: 340px; border-radius: 20px; position: relative; z-index: 999; box-shadow: 1px 1px 8px 0; margin: 15px 0 } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card > img { object-fit: cover; object-position: center; height: 100%; width: 100% } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card:hover>.featured-plan-card-text { top: 0 !important; background: rgba(0, 0, 0, .5) } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-card-text { height: 100%; position: absolute; left: 0; right: 0; top: calc(100% - 78px); transition: .3s; display: flex; align-items: center; justify-content: space-around; background: rgba(0, 0, 0, .5); flex-direction: column; color: #fff } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-card-text h2 { font-size: 30px; font-weight: var(--weight-700); font-family: var(--family-lato); margin-bottom: 20px; text-shadow: 0 0 12px #000 } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-details { display: flex; align-items: center; justify-content: center; flex-direction: column } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-details p { margin: 5px 0; font-size: 18px; font-family: var(--family-lato) } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-card-text a { font-weight: var(--weight-700); font-family: var(--family-lato); font-size: 20px; display: flex; align-items: center; gap: 5px } .update-house-plan-product-container.housePlanProductContainer.housePlanThreeColumn { padding: 90px 70px } .housePlanFilterTabSec.house-plan-search-section { margin-bottom: 6rem } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp { margin-bottom: 0; padding: 20px; max-width: 100%; margin-left: inherit; margin-right: inherit } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanProductStyleFilter a img { width: 40px; height: 100% } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder { margin-right: auto; margin-left: 30px } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul { gap: 15px; flex-wrap: wrap; justify-content: center } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a { border-radius: 10px; font-size: 16px; font-family: var(--family-lato); font-weight: var(--weight-800); white-space: nowrap; padding: .844rem 1rem; color: #1d4371; background-color: #fff; box-shadow: 1px 3px 8px 0 #b1b1b1; border: 0; width: 100%; min-width: 200px; cursor: pointer } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a.virtul-btn{ background: #157EE5; color: #fff; } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li a.active { background: #3a7b1d; color: #fff } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec .housePlanSearchSec { position: relative; padding-right: 0 } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec { max-width: 320px; width: 100% } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanSearchSec { max-width: 100%; margin-left: 0 } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec .housePlanSearchSec .form-control::placeholder { color: #4892eb; font-weight: var(--weight-600) } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec .housePlanSearchSec .form-control { background: #f0f0f0; color: #000; border-radius: 30px; padding-left: 45px; border: 0; height: 45px; width: 100%; font-size: 17px; font-family: var(--family-montserrat) } .update-house-plan-product-container .housePlanProductSec .housePlanProductHolder .house-Plan-Product-Head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap } .update-house-plan-product-container .housePlanProductSec .housePlanProductHolder .house-Plan-Product-Head p { font-weight: var(--weight-500); font-size: 18px } .productHolder.twoColumn-md.listView .productBox .productBtnHolder>a { flex: auto; max-width: 100% } @media only screen and (max-width:820px) { .update-banner-slider.sliderSec .mainSlider .slick-arrow { font-size: 14px } .update-banner-slider.sliderSec .btn-view-plan { left: 35% !important } .update-banner-slider.sliderSec ul li .sliderCaption { min-height: 400px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder { justify-content: flex-start } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec img.lazyloaded { bottom: 183px; left: -30px; width: 100px; height: 90px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp { gap: 0; padding: 20px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterBtnSec button { position: absolute; right: 85px; bottom: 51px; padding: 5px 0; font-size: 16px } .custom-plan-filter-Section .planFilterSec .direction-arrow img { display: none } .featured-plan-carousel.sliderSec .mainSlider .carousel-container { flex-direction: column; justify-content: center; gap: 10px; height: auto } .featured-plan-carousel.sliderSec .mainSlider .carousel-container .featured-plan-card { max-width: 100% } .featured-plan-section .container .featured-plan-card h2 { font-size: 26px } .update-house-plan-product-container.housePlanProductContainer.housePlanThreeColumn { padding: 90px 0 } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder { margin-left: 0 } .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanProductStyleFilter { margin-top: 20px } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card { max-width: 310px } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow { top: 110% } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow.slick-prev { left: 40% } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow.slick-next { right: 40% } } @media only screen and (max-width:540px) { .update-banner-slider.sliderSec .mainSlider .slick-arrow { font-size: 11px } .update-banner-slider.sliderSec .mainSlider .slick-next.slick-arrow::after { height: 11px } .update-banner-slider.sliderSec .mainSlider .slick-prev.slick-arrow::after { width: 18px; height: 14px } .update-banner-slider.sliderSec .btn-view-plan { left: 15% !important; text-align: center } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup { max-width: 155px } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterBtnSec button { position: inherit; padding: 3px 0; font-size: 15px; width: 100px; margin: 0 auto } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder { justify-content: center; zoom: 0.8 } .custom-plan-filter-Section .planFilterSec .planFilterFieldSec img.lazyloaded { bottom: inherit; left: -15px; width: 75px; height: 65px; top: -27px; transform: rotate(-20deg) } .dream-home-section { padding-top: 140px !important } .dream-home-section .head-wrapper .heading h2 { font-size: 23px; line-height: 1 } .dream-home-section .head-wrapper a { margin: 0 } .dream-home-section .card-container { justify-content: center } .dream-home-section .card-container .card, .house-plan-search-section.housePlanFilterTabSec .housePlanFilterTabSp .housePlanCountSec { max-width: 100% } .featured-plan-section .container h2 { font-size: 26px } .featured-plan-section .container .featured-plan-card h2 { font-size: 23px } .featured-plan-carousel.sliderSec .mainSlider .carousel-container .featured-plan-card .featured-plan-details p { font-size: 18px } .featured-plan-carousel.sliderSec .mainSlider .carousel-container .featured-plan-card .featured-plan-card-text a { font-size: 17px } .featured-plan-carousel.sliderSec .mainSlider .slick-arrow.slick-next { right: 0 } .featured-plan-carousel.sliderSec .mainSlider .slick-arrow.slick-prev { left: 0 } .featured-plan-carousel.sliderSec .mainSlider .carousel-container .featured-plan-card { height: 350px; max-width: 96% } .featured-plan-carousel.sliderSec .mainSlider .carousel-container .featured-plan-card .featured-plan-card-text { top: 130% } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul { gap: 5px; zoom: 0.8 } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li { width: auto } .housePlanFilterTabSec.house-plan-search-section { margin-bottom: 2rem } .update-house-plan-product-container.housePlanProductContainer.housePlanThreeColumn { padding: 50px 0 } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card { max-width: 350px } .featured-plan-carousel.sliderSec .featuredSlider .slick-arrow { top: 100% } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-card-text { top: 125% } } @media only screen and (max-width:375px) { .custom-plan-filter-Section .planFilterSec .planFilterFieldSec .planFilterFieldSp .planFilterFieldHolder .planFilterFormGroup { max-width: 132px } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul { gap: 10px; zoom: 0.8 } .house-plan-search-section.housePlanFilterTabSec .housePlanProductStyleFilterHolder .housePlanCatTabHolder ul li { width: 100% } } .salePriceTag strong { font-weight: 400; color: #ca0202 } .salePriceTag b { font-weight: 400; text-decoration: line-through; color: #212529; padding-right: 5px } .cookie-consent { position: fixed; bottom: 15px; right: 15px; width: 400px; border-radius: 15px; padding: 2rem; border: 1px solid #3b8beb; background: #fff; text-align: center; z-index: 99999999999; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; justify-content: center; box-shadow: 0 0 15px rgba(0, 0, 0, .3) } .btn-cookie, .btn-deny { padding: 1rem 2rem; text-align: center; text-transform: uppercase; font-size: 12px; font-weight: 500; color: #fff; white-space: nowrap } .cookie-consent p { font-size: 14px; margin-bottom: 1rem; margin-top: .5rem; width: 100%; line-height: 22px } .btn-cookie { border-radius: .7rem; background-color: #3b8beb; border: 1px solid transparent } .cookie-consent svg path { stroke: #3b8beb } .btn-deny { background-color: #b11919; border-radius: .7rem; border: 1px solid transparent } @media (min-width:767px) { .cookie-consent { bottom: 0; right: 0; width: 100%; padding: 12px; border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0 } .btn-cookie, .btn-deny { border-radius: 5px; padding: .4rem 1.5rem } .cookie-consent p { margin-bottom: 0; padding: 0 12px } .cookie-consent svg { width: 40px; height: 40px } } .dreamBookBar a{ display: flex; padding: 15px 30px; gap: 2rem; justify-content: space-between; background: #157EE5; color: #fff; align-items: center; font-size: 18px; font-weight: 600; } .dreamBookBar a img{ margin: 0 15px; } .planIconBar{ position: absolute; top: 10px; right:10px; display: flex; align-items: center; gap: 1rem; z-index: 1; } .planIconBar .dreamBookIcon{ background: #fff; border-radius: 100%; width: 59px; height: 59px; display: flex; align-items: center; justify-content: center; box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.75); position: relative; } .featured-plan-card .planIconBar .dreamBookIcon img{ width: auto !important; height: auto !important; object-fit: inherit !important; object-position: inherit !important; } .primary-slider .planIconBar .video_play{ position: relative; top: auto; right: auto; bottom: auto; left: auto; } .dreamBookIcon .tooltip{ position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 4px; padding: 8px; color: #9D9D9D; font-size: 12px; display: none; opacity: 1; width: max-content; box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.75); margin-top: 15px; } .dreamBookIcon .tooltip:after{ border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 8px solid white; content: ''; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); } .dreamBookIcon:hover .tooltip{ display: block; } .dreamBookModalContent > *{ margin: 0; } .dreamBookModalContent{ display: flex; gap: 1rem; flex-direction: column; align-items: center; padding: 3rem 0;; max-width: 668px; margin: 0 auto; text-align: center; } .dreamBookModalContent p{ color: #0A3365; font-size: 24px; font-weight: 600; } .dreamBookModalContent h2{ font-size: 32px; } .virtualBox{ padding: 2rem; background: #F7F9FB; width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1rem; } .virtualBox img{ max-width: 100%; } .virtualBox > *{ margin: 0; } .dreamBookModalContent .labelText{ color: #1F2C3D; font-size: 16px; font-weight: 600; } .app-store-section{ padding: 1rem 0; display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; justify-content: center; } .dreamBookModalContent .btn{ border-radius: 10px; display: flex; align-items: center; gap: 1rem; justify-content: center; width: 100%; } .dreamBookFeaturedSection{ background: #F7F9FB; } .dreamBookFeaturedSection .btnHolder{ display: flex; align-items: center; justify-content: center; margin-bottom: 70px; } .dreamBookFeaturedSection .btnHolder a{ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.75); background: #fff; color: #007bff; border-radius: 15px; } .dreamBookFeaturedSection .sliderSec{ margin-bottom: 30px; } .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card .featured-plan-card-text a.design3D{ color: #fff; } .dreamBookFeaturedSection .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card{ height: 390px; } .dreamBookFeaturedSection .featured-plan-carousel.sliderSec .featuredSlider .carousel-container .featured-plan-card:hover .dreamBookIcon{ display: none; } .dreamBookHeadBar{ display: flex; align-items: center; gap: 1rem; justify-content: center; background: #61C8D8; color: #fff; padding: 9px 0; } .dreamBookHeadBar > *{ margin: 0; } .dreamBookHeadBar p{ color: #0A3365; font-weight: 600; } .btnHeaddreamBook{ text-decoration: underline; color: #fff; display: flex; align-items: center; gap: 0.5rem; } .btnHeaddreamBook:hover{ color: #fff; text-decoration: underline; } @media (min-width: 992px) { .mhp-modal-lg{ max-width: 1100px; } } @media (min-width:768px) { .dreamBookModalContent .btn{ font-size: 25px; padding: 1.2rem 2rem; } } @media (max-width:767px) { .dreamBookModalContent .btn{ /* font-size: 25px; border-radius: 10px; display: flex; align-items: center; gap: 1rem; padding: 1.2rem 2rem; width: 100%; justify-content: center; */ } .dreamBookModalContent h2{ font-size: 24px; } .dreamBookModalContent p{ font-size: 16px; } .dreamBookModalContent p.labelText{ font-size: 14px; } .dreamBookBar a{ padding: 10px 15px; gap: 1rem; font-size: 16px; font-weight: 400; } } .productBottomBtnSp{ display: flex; padding: 10px; width: 100%; } .productBottomBtnSp a.virtul-btn{ background: #157EE5; color: #fff; display: flex; align-items: center; justify-content: center; padding: 5px 10px; } .productBottomBtnSp a.virtul-btn i{ display: flex; } .productBottomBtnSp > span{ padding: 5px 15px; background: #fff; font-size: 16px; color: #000; font-family: var(--family-lato); font-weight: var(--weight-600); margin: 0 0 0 auto; }
