﻿
/* PLAN PAGE */

/* Menu */
.top-row-container {
background-color: none;
}

/* New Layout */

#breadcrumb {
margin-bottom: 7px;
}

.details {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 8px;
padding: 0px;
width: 100%;
min-width: 162px;
min-height: 645px;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
}

.details .detail-cell {
flex: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
margin: 0px 0px;
font-family: DM Sans;
font-style: normal;
}

.details .detail-cell .detail-label {
color: #555555;
font-weight: normal;
font-size: 17px;
line-height: 24px;
}

.details .detail-cell .detail-value {
color: #333333;
font-weight: bold;
font-size: 22px;
line-height: 24px;
}

@media only screen and (max-width: 1150px) {
.details {
min-height: 580px;
}
}
/* Slider Desktop */
#pinttop {
position: absolute;
left: 15px;
top: 18px;
width: 100%;
margin-right: 0;
z-index: 10;
}

#pintbottom {
position: absolute; /*right: 20px;*/
bottom: 30px; /*width: 100%;*/ /*text-align: right;*/
margin-right: 0;
z-index: 10;
}


.mainimagecopyright {
float: right;
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 22px;
color: #ff0000;
text-align: right;
}
/*.photographs {position: absolute;right: 20px;top: 33px;width: 100%;margin-right: 0;z-index: 1;text-align: right;font-size: 12px;color: #333;}*/
.photographs {
width: 100%;
font-size: 14px;
color: #333;
line-height: 22px;
}

.photographs a {
color: #555555;
}

/* Quicklinks */
.command-options-container .command-width {
position: relative;
min-width: 168px;
}

.quicklinks {
position: absolute;
min-width: 168px;
background: #FFFFFF;
box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25);
border-radius: 6px;
z-index: 20;
transition-duration: 0.3s;
margin-top: -1px;
}

#quiclicks-d-open, #quiclicks-m-open, #quiclicks-d-close, #quiclicks-m-close {
position: relative;
text-align: center;
cursor: pointer;
margin: 0 7px -5px 0;
}

#quiclicks-d-open #quiclicks-m-open {
height: 32px;
}

#quiclicks-d-close, #quiclicks-m-close {
display: none;
height: 20px;
}

.quicklinks .more-options-container {
padding: 12px 12px 5px 12px;
}

.quicklinks .more-options-container > .option {
position: relative;
font-family: DM Sans;
font-weight: normal;
font-size: 14px;
line-height: 16px;
height: 28px;
color: #333333;
}

.quicklinks .more-options-container > .option a {
color: #333;
}

.quicklinks .more-options-container > .option a svg {
width: 20px;
margin: 0 5px -5px 0;
}

.quicklinks .option-d-expanded {
display: none;
}

.quicklinks > a {
height: 67px;
}

.quicklinks .explore-arch {
display: none;
max-width: 168px;
margin: 0px -12px;
padding: 6px 12px;
background: #FAFAFA;
font-family: DM Sans;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 122%;
text-align: center;
color: #22262A;
}

/* Socials */
.Socials { /*display: inline-block;*/
min-width: 45px;
min-height: 100%;
padding-top: 22px 0 0 0;
margin: auto;
}

.Socials .items {
min-height: 160px;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 20px;
}

.Socials .items a {
flex: auto;
flex-grow: 1;
}

/* Plan Description */
.plan-description {
/*position: absolute;*/
display: inline-block;
max-width: 100%;
font-style: normal;
padding-top: 13px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 35px;
/*min-height: 200px;*/
}

.plan-description-header {
font-weight: bold;
font-size: 20px;
line-height: 35px;
text-transform: uppercase;
color: #333333;
}

.plan-description-content {
font-weight: normal;
font-size: 16px;
line-height: 22px;
color: #000000;
}

.plan-desc-button {
padding: 0 10px;
background: #555555;
border-radius: 3px;
}


.plan-desc-buttons {
display: flex !important;
flex-direction: row;
justify-content: space-between;
padding: 18px 0px 0px 0px;
margin: 0;
}

.plan-desc-buttons a {
flex-grow: 1;
flex-basis: 0;
text-decoration: none;
min-width: 275px;
max-width: 275px;
}

.plan-desc-buttons a:nth-child(even) {
margin: 0 14px;
}

.plan-desc-buttons a .desc-button {
background: #555555;
border-radius: 3px;
color: #F2F2F2;
padding: 0px 0;
text-align: center;
font-family: DM Sans;
font-style: normal;
font-size: 18px;
line-height: 32px;
transition: background 0.3s;
}

.plan-desc-buttons a .desc-button:hover {
background: #4D4D4D;
}

.plan-desc-buttons a .desc-button svg {
margin: 0 5px -5.5px 0;
}

.plan-desc-view-package {
/*display: flex !important;
flex-direction: row;
justify-content: space-between;*/
padding: 18px 0px 0px 0px;
margin: 0;
}

.plan-desc-view-package a {
flex-grow: 1;
flex-basis: 0;
text-decoration: none;
min-width: 255px;
max-width: 275px;
}


.plan-desc-view-package a .desc-button {
background: #555555;
border-radius: 3px;
color: #F2F2F2;
padding: 0px 0;
text-align: center;
font-family: DM Sans;
font-style: normal;
font-size: 18px;
line-height: 46px;
}

.plan-desc-view-package a .desc-button svg {
margin: 0 5px -5.5px 0;
}

/* Floor Plan Slider */
.slider-plan-opened {
position: fixed;
display: none;
justify-content: center;
align-items: center;
top: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
z-index: 100;
background: #fff /*rgba(0, 0, 0, 0.45)*/;
}

.slider-plan-opened .close {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
z-index: 10;
}

.slider-plan-opened #all-floorplans {
position: absolute;
top: 10px;
left: 10px;
cursor: pointer;
z-index: 10;
}

.slider-plan-opened #all-images {
position: absolute;
top: 10px;
left: 10px;
z-index: 10;
}

.slider-plan-opened .carousel {
display: flex;
align-items: center;
overflow-x: auto;
overflow-y: hidden;
width: 100vw;
height: 100%;
-webkit-overflow-scrolling: touch;
margin: 0;
padding: 0;
list-style: none;
}

.slider-plan-opened .carousel .section {
width: 100%;
height: 100%;
}

.slider-plan-opened .carousel .section > div {
width: 100vw;
height: 100%;
display: flex;
align-items: center;
}

.slider-plan-opened .carousel .section > div img {
object-fit: contain;
width: 100%;
height: 100%;
}


@supports (scroll-snap-align: start) {
/* modern scroll snap points */
.slider-plan-opened .carousel {
scroll-snap-type: x mandatory;
}

.slider-plan-opened .carousel .section {
scroll-snap-align: center;
}
}

@supports not (scroll-snap-align: start) {
/* old scroll snap points spec */
.slider-plan-opened .carousel {
-webkit-scroll-snap-type: mandatory;
scroll-snap-type: mandatory;
-webkit-scroll-snap-destination: 0 50%;
scroll-snap-destination: 0 50%;
-webkit-scroll-snap-points-x: repeat(100%);
scroll-snap-points-x: repeat(100%);
}

.slider-plan-opened .carousel .section {
scroll-snap-coordinate: 0 0;
}
}

.secondary-container {
position: fixed;
top: 100%;
left: 0;
right: 0;
height: 100%;
width: 100%;
z-index: 100;
padding-top: 50px;
background: #fff /*rgba(0, 0, 0, 0.45)*/;
}

.secondary-container::before {
content: "";
position: absolute;
top: 42px;
width: 100%;
border: 0.2px solid rgba(0, 0, 0, 0.45);
}

.secondary-container .close {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
z-index: 10;
}

.secondary-container .popup-small-image {
display: inline-block;
margin: 7px;
border: 1px solid rgba(0, 0, 0, 0.45);
width: calc((100% / 5) - 20px);
height: calc((100vw / 5) - 20px);
cursor: pointer;
}

.secondary-container > div img {
object-fit: contain;
width: 100%;
height: 100%;
}

#floor-plan-popup-left-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
left: 10px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

#floor-plan-popup-right-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
right: 10px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

#images-popup-left-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
left: 10px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

#images-popup-right-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
right: 10px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

.slider-plan-opened > div {
}

.slider-plan-opened img {
}

.slider-plan-opened div .close {
position: absolute;
right: 10px;
top: 10px;
cursor: pointer;
z-index: 10;
}

.floor-plan-title {
font-family: DM Sans;
font-style: normal;
font-weight: bolder;
font-size: 28px;
line-height: 42px;
text-transform: uppercase;
}

.floor-plan-title-small {
font-size: 1rem;
line-height: 24px;
}



.floor-plan-name {
font-family: DM Sans;
font-style: normal;
font-weight: 500;
font-size: 26px;
line-height: 34px;
text-align: center;
width: 100%;
}

.floor-plan-mag {
position: absolute;
top: 10px;
left: 0;
margin-left: 5px;
}

.floor-plan-save {
position: absolute;
top: 10px;
right: 0;
margin-right: 5px;
}

#MainImagesDesktop {
position: absolute;
top: 22px;
right: 11px;
z-index: 100;
}

#middle-page-row {
margin-top: 25px;
}

#floor-plan-left-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
left: 17px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

#floor-plan-right-arrow {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 50%;
right: 17px;
width: 40px;
height: 40px;
border-radius: 50%;
z-index: 10;
cursor: pointer;
}

.floor-plan-small-container {
}

.floor-plan-right-fade {
position: absolute;
width: 22px;
height: calc(100% - 10px);
top: 0;
right: 0.6875rem;
background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
z-index: 10;
}

.owl-carousel {
margin: 10px 0;
}

.owl-carousel .owl-item {
width: 100%;
}

/*#small-car .owl-stage-outer {
overflow-x: scroll;
scrollbar-width: thin;
scrollbar-color: #982225 #E6E7E8;
padding-bottom: 10px;
}

#small-car .owl-stage-outer::-webkit-scrollbar {
height: 5px;
}

#small-car .owl-stage-outer::-webkit-scrollbar-track {
background: #E6E7E8;
border-radius: 20px;
}

#small-car .owl-stage-outer::-webkit-scrollbar-thumb {
background-color: #982225;
border-radius: 20px;
}
*/

#small-car .owl-item {
border-radius: 6px;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}

#small-car .owl-item:last-child {
background-color: #555555;
}

#small-car .owl-item img {
height: 100%;
display: flex;
justify-content: center;
}

#small-car .owl-item .item-overlay {
position: absolute;
top: 0;
height: 100%;
width: 100%;
background: rgba(0, 0, 0, 0.45)
}

#small-car .owl-item .item-overlay .text, #small-car .text {
padding: 10px;
justify-content: center;
height: 100%;
width: 100%;
font-family: DM Sans;
font-style: normal;
/*font-weight: bold;*/
font-size: 20px;
line-height: 23px;
display: flex;
align-items: center;
text-align: center;
color: #FFFFFF;
}

#small-car .SamplePlanButton {
padding: 10px;
justify-content: center;
height: 100%;
width: 100%;
font-family: DM Sans;
font-style: normal;
/*font-weight: bold;*/
font-size: 20px;
line-height: 23px;
display: flex;
align-items: center;
text-align: center;
color: #FFFFFF;
}

/* Features and Details */
#plan-deets {
margin-top: 25px;
margin-bottom: 15px;
}

.feature-containers {
background: #FFFFFF;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
border-radius: 8px;
padding: 15px 13px 10px 13px;
}

.plan-detail-title {
color: #333333;
font-family: DM Sans;
font-style: normal;
font-weight: 700;
font-size: 30px;
line-height: 35px;
text-transform: uppercase;
margin-bottom: 10px;
}

@media only screen and (max-width: 625px) {
.plan-detail-title {
font-size: 20px;
}
}

.details-expandable {
position: relative;
overflow: hidden;
max-height: 316px;
transition: max-height 1s;
}

.details-expanded {
max-height: 2000px;
}

.details-expandable .expand-option {
position: absolute;
top: calc(100% - 32px);
width: calc(100% - 20px);
font-family: DM Sans;
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
align-items: center;
text-align: center;
color: #FFFFFF;
margin: 0 10px;
z-index: 20;
}

.details-expandable .expand-option > div:first-child {
position: absolute;
top: -18px;
height: 20px;
width: 100%;
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.85) 85%, rgba(255,255,255,0.65) 95%, rgba(255,255,255,0) 100%);
}

.details-expandable .expand-option > div:last-child {
position: absolute;
height: 32px;
width: 100%;
border-radius: 3px;
cursor: pointer;
padding: 7px 0 7px 0;
background: rgba(77,77,77,1);
transition: background 0.3s;
}

.details-expandable .expand-option > div:last-child:hover {
background: #555555;
}


.details-expandable .expand-option svg {
margin: 0px 0px -3px 10px;
}

#featureshide-click, #detailshide-click {
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 18px;
align-items: center;
text-align: center;
color: #4D4D4D;
cursor: pointer;
}

.sub-sqared {
vertical-align: super;
font-size: 7px;
display: inline-block;
}

@media only screen and (max-width: 1025px) {
.details-expandable {
max-height: 300px;
}

.details-expanded {
max-height: 2000px;
}
}

.PlanSpecRight {
font-family: DM Sans;
font-style: normal;
font-weight: normal;
font-size: 13px;
line-height: 26px;
text-align: right;
float: right;
clear: right;
}

.PlanSpecLeft {
font-family: DM Sans;
font-style: normal;
font-weight: 500;
font-size: 14px;
line-height: 26px;
text-transform: uppercase;
color: #555555;
float: left;
clear: left;
}

/* Reviews */
/*.review-container {
background: #FAFAFA;
box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25);
border-radius: 8px;
margin: 20px 0;
}*/
.review-header-padding {
padding-bottom: 10px;
}

.review-header > span {
font-style: normal;
font-weight: bold;
font-size: 20px;
line-height: 35px;
text-transform: uppercase;
color: #333333;
}


.review-title {
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 25px;
color: #000000;
padding-bottom: 10px;
}

.review-date {
float: right;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 25px;
color: #000000;
}

.review-rating {
font-size: 12px;
line-height: 24px;
font-style: normal;
font-weight: normal;
font-size: 12px;
line-height: 22px;
color: #000000;
padding-bottom: 10px;
}

.review-rating svg {
margin: 0 4px -2px;
}

.review-text {
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 22px;
color: #000000;
min-height: 200px;
overflow: scroll;
overflow-x: hidden;
margin-bottom: 7px;
}

@media (min-width: 40em) {
.review-text {
max-height: 208px;
}
}

.review-buttons {
display: flex;
justify-content: space-evenly;
max-width: 344px;
}

.review-buttons .review-button:first-child {
margin-right: 20px;
}

.review-buttons .review-button {
flex-grow: 1;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 14px;
text-align: center;
color: #FFFFFF;
padding: 10px 0;
cursor: pointer;
background: #555555;
border-radius: 5px;
transition: background 0.3s;
}

.review-buttons .review-button:hover {
background: #4D4D4D;
}

/* Old Layout*/
.plan-controls {
height: 35px;
background-color: rgba(54, 54, 54, 0.58);
border-color: #a1a1a1;
background-opacity: 0.58;
border-width: 0.625px;
border-style: solid;
color: white;
line-height: 40px;
padding: 0 1em;
}

@media (max-width: 35em) {
.plan-controls {
height: 75px;
line-height: 30px;
margin-bottom: 10px;
}
}

.plan-controls-items {
margin: 0;
}

.plan-controls-items li {
list-style: none;
float: left;
line-height: 30px;
}

@media (max-width: 40em) {
.plan-controls-items li {
line-height: 30px;
}
}

.plan-controls-items li a {
color: white;
}

/*.plan-controls-items li::after {
content: "|";
margin-right: 1em;
margin-left: 1em;
}

.plan-controls-items li:last-child::after {
content: "";
margin: 0;
}*/

#copyrightbydesigner {
font-style: normal;
font-weight: normal;
font-size: 12px;
line-height: 16px;
text-align: right;
color: #ff0000;
float: right;
}

#samplePlan {
font-size: 1.2em;
font-weight: bold;
margin-left: 20px;
}

#samplePlan a {
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 16px;
text-align: center;
color: #000000;
}

@media (max-width: 43em) {
#samplePlan {
font-size: .8em;
float: none;
}
}

.ButtonFloorplan {
background-color: #585551;
border-radius: 5px;
border-left: 2px #cccccc solid;
border-right: 2px #cccccc solid;
border-bottom: 2px #cccccc solid;
margin: 0.5em;
padding: 6px;
text-align: center;
}

.ButtonFloorplan a {
font-size: 1.2em;
color: #fff;
}

.ImagesMaxWidth {
max-width: 600px;
}

.ImagesFixedWidth {
width: 600px;
}

.hasphotoicon {
background-image: url('/images/has-photos.png');
background-repeat: no-repeat;
background-position: right center;
top: 30px;
right: 5px;
text-align: right;
float: right;
width: 100%;
height: 25px;
margin-top: -30px;
position: relative;
z-index: 100;
border: 0px #ff0000 solid;
}

.planonsale {
background-image_no: url('/images/on-sale.png');
background-repeat_no: no-repeat;
background-position_no: right center;
background-color: #7e0000;
bottom: -30px;
left: 0px;
float: left;
width: 72px;
height: 16px;
margin-top: -30px;
position: relative;
z-index: 10000;
border: 0px #ff0000 solid;
color: #ffffff;
font-size: .85em;
}

.plan-designer-link {
display: block;
margin-bottom: 0.5em;
font-style: normal;
font-weight: bold;
font-size: 24px;
line-height: 15px;
align-items: center;
text-align: center;
text-transform: uppercase;
color: #555555;
}

.plan_details_subheaders {
font-style: normal;
font-weight: 500;
font-size: 14px;
line-height: 26px;
text-transform: uppercase;
color: #555555;
text-align: left;
padding-left: 25px;
}

.plan_details_items {
font-style: normal;
font-weight: normal;
font-size: 13px;
line-height: 20px;
text-align: right;
color: #333333;
padding: 5px 25px 0 0;
}

.plan-assistance-links {
text-align: left;
font-family: DM Sans;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 16px;
color: #000000;
}

@media (max-width: 60em) {
.plan-assistance-links {
font-size: .9em;
}
}


/* Plan Options */
.plan-options {
background-color: #e9e9e9;
padding-top: 1em;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 1em;
}


.plan-designer-image {
display: block;
width: 100%;
height: 150px;
background-size: cover;
background-position: center;
border-radius: 7px;
}

.plan-designer-image-pn {
color: #ffffff;
font-size: 10px;
background-color: rgba(83, 88, 179, 0.75);
background: #555555;
position: absolute;
top: 128px;
left: 17px;
padding: 3px 6px 2px 6px;
margin: 0;
border-radius: 4.24912px;
}

.plan-designer-image-pn a {
color: #ffffff;
}

@media (max-width: 625px) {
.plan-architects-preferred-products-products h5, .plan-architects-preferred-products-products .h5 {
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 24px;
text-transform: uppercase;
color: #333333;
}

.plan-assistance-links {
margin-bottom: 8px;
}

.SimilarPlans, .MorePlans {
padding-top: 20px;
}

.plan-designer-link {
font-size: 18px;
line-height: 24px;
}

.plan-designer-link svg {
height: 16px;
width: 16px;
}

.plan-designer-image {
height: 115px;
}

.plan-designer-image-pn {
top: 96px;
}
}


#PlanAddToFavorites {
padding: 0 0 2px 0;
border-bottom: 1px #585551 solid;
}

/* Plan Specifications */
.plan-specifications {
font-size: .875em;
}

.plan-specifications-row {
border-top: 1px solid #e9e9e9;
padding-top: 8px;
padding-bottom: 8px;
}

.plan-specifications-row:last-child {
border-bottom: 1px solid #e9e9e9;
}

.plan-specifications-row-header {
color: #89a9c2;
}

.PlanSpecHeader {
clear: both;
}

/*.PlanSpecLine {
max-width: 20em;
}*/

.PlanSpecLeft {
float: left;
clear: left;
}

.PlanSpecRight {
float: right;
clear: right;
}


/* plan preferred products */
.plan-preferred-products li {
padding-bottom: 0.4em;
}

.plan-preferred-products li:nth-child(2n+1) {
padding-right: 0.2em;
}

.plan-preferred-products li:nth-child(2n) {
padding-left: 0.2em;
}

.plan-preferred-products img {
/*width: 100%;*/
}

.plan-preferred-products-captioned {
display: block;
position: relative;
}

.plan-preferred-products-caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: rgba(50, 50, 50, 0.6);
color: #fff;
font-size: 0.7em;
text-align: right;
padding-right: 0.2em;
}


/* plan page (continued) */
.plan-related-plans, .plan-related-plans.row {
margin-top: 1.25em;
margin-bottom: 1.25em;
}

.plan-testimonials {
background: #e9e9e9;
padding: 20px;
padding-bottom: 0;
margin-top: 1.25em;
}

.plan-hero-testimonial-text {
font-size: 26px;
font-family: serif;
font-style: italic;
text-align: center;
position: relative;
padding: 0 .7em;
line-height: 1.2;
}

.plan-hero-testimonial-text:before, .plan-hero-testimonial-text:after {
content: "\"";
position: absolute;
top: -6px;
height: 100%;
display: block;
font-size: 48px;
color: #88a6bf;
}

.plan-hero-testimonial-text:before {
left: 0;
}

.plan-hero-testimonial-text:after {
right: 0;
}

.plan-hero-testimonial-lower-half {
text-align: center;
max-width: 40em;
margin-left: auto;
margin-right: auto;
}

.plan-hero-testimonial-rating {
display: inline-block;
}

.plan-hero-testimonial-attribution {
display: inline-block;
font-size: 24px;
color: #88a6bf;
}

.plan-hero-testimonial-attribution:before {
content: "- ";
}

@media only screen and (max-width: 600px) {
.plan-hero-testimonial-rating {
display: block;
}

.plan-hero-testimonial-attribution {
display: block;
margin-bottom: 20px;
}
}

.plan-testimonial-see-all {
text-align: right;
font-size: 19px;
}

.plan-testimonial-see-all a {
color: #88a6bf;
}

.plan-testimonial {
margin-bottom: 1.25em;
}

.plan-favorite-products {
background: #e9e9e9 none repeat scroll 0 0;
margin: 0px 0px 10px 0px;
text-align: center;
}

@media (max-width: 43em) {
.plan-favorite-products h5, .plan-favorite-products .h5 {
font-size: .8em;
}
}

.plan-favorite-products.row {
margin: 0px 0px 20px 0px;
padding: 4px;
}

.plan-favorite-products h4, .plan-favorite-products .h4 {
text-align: left;
}

.plan-favorite-products-columns {
margin: 0px;
padding: 3px;
}

.plan-favorite-products a {
font-size: .75em;
color: #030303;
}

.plan-architects-preferred-products-products {
margin: 0px 0px 10px 0px;
background: #fff none repeat scroll 0 0;
text-align: left;
}

.plan-architects-preferred-products-products h5, .plan-architects-preferred-products-products .h5 {
font-size: 2em;
font-weight: bold;
}

@media (max-width: 43em) {
.plan-architects-preferred-products-products h5, .plan-architects-preferred-products-products .h5 {
font-size: 18px;
}
}

.plan-architects-preferred-products-products.row {
margin: 15px 0px 0px 0px;
padding: 4px;
}

.plan-architects-preferred-products-products-columns {
margin: 0px;
padding: 3px;
}

.plan-architects-preferred-products-products-columns img {
border-radius: 8px;
}

.plan-architects-preferred-products-products a {
color: #030303;
}

.plan-q-a {
background-color: #F4F4F4;
color: white;
padding: 20px;
margin-top: 1.25em;
margin-bottom: 1.25em;
}

.plan-q-a-heading {
font-weight: bold;
text-align: center;
}

.plan-q-a-let-us-help {
font-weight: normal;
text-align: center;
}

@media (max-width: 40rem) {
.plan-description-header {
font-style: normal;
font-weight: bold;
font-size: 17px;
line-height: 24px;
text-transform: uppercase;
color: #333333;
}
}

.plan-description {
padding-bottom: 31px;
min-height: 210px;
}

.plan-desc-view-package {
display: inline-block;
padding: 8px 10px 15px 10px;
margin: 0;
}

.mobile-plan-specs {
padding-bottom: 10px;
}

.mobile-plan-specs-item {
width: 20%;
text-align: center;
float: right;
font-size: 1rem;
}

@media (max-width: 40rem) {
.mobile-plan-specs-item {
font-size: .7rem;
}
}

.mobile-plan-specs-sqft {
width: 20%;
text-align: center;
font-size: 1rem;
}

@media (max-width: 40rem) {
.mobile-plan-specs-sqft {
font-size: .7rem;
}
}

.plan-controls {
height: 30px;
line-height: 27px;
margin-bottom: 10px;
padding: 0 4px 0 4px;
}

@media (max-width: 40rem) {
.plan-controls-items li::after {
content: "|";
margin-right: .1rem;
margin-left: .1rem;
}

.plan-controls-items li {
font-size: .8rem;
}
}

.mobile-purchase {
background-color: #f5f5f5;
text-align: center;
margin-top: 10px;
padding-top: 5px;
}

.mobile-purchase p {
line-height: 16px;
margin: 0 0 6px 0;
padding: 0;
}

.mobile-purchase .button {
background-color: #ffff31;
color: #000000;
padding-top: 0;
padding-bottom: 0;
margin-bottom: 10px;
}

.mobile-we-offer {
background-color: #dbdbdb;
margin-top: 10px;
padding: 10px 5px 0px 10px;
text-align: center;
}

.mobile-we-offer h3, .mobile-we-offer .h3 {
font-size: 18px;
}

.mobile-we-offer p {
line-height: 13px;
font-size: 13px;
text-align: left;
margin: 0 0 8px 0;
padding: 0;
}

.mobile-we-offer .button {
background-color: #ffff31;
color: #000000;
text-align: center;
padding-top: 0;
padding-bottom: 0;
margin-bottom: 10px;
font-size: 14px;
}

#planslides {
cursor: default;
position: relative;
top: 0px;
left: 240px;
/*width: 720px;*/ width: 880px;
height: 480px;
overflow: hidden;
}


#ImageViewer {
background-color: #fff;
}

#ImageViewer .bkg {
filter: blur(2px);
-webkit-filter: blur(2px);
width: 1127px;
height: 500px;
margin-left: 3px;
}

#ImageViewer .ivcontainer {
margin-top: -506px;
margin-left: 0px;
background-color: #24262e;
}

#jssor_1 {
border: 6px solid #24262e;
overflow: hidden;
visibility: hidden;
border-top: solid -5px rgb(36, 38, 46);
border-right: solid 10px rgb(36, 38, 46);
}

#exclusivelyours, #exclusivephotos {
position: absolute;
top: 77px;
right: 11px;
z-index: 10;
}

@media only screen and (max-width: 590px) {
#exclusivelyours, #exclusivephotos {
top: 15px;
right: 4px;
}

#BestSellingPlan {
position: absolute;
top: 77px;
right: 11px;
z-index: 10;
}
}

@media only screen and (max-width: 590px) {
#BestSellingPlan {
top: 15px;
right: 11px;
}
}

.planimagemeta {
margin: 0px 0px 10px 0px;
background-color: #24262e;
}

.planseeallphotos, a.planseeallphotos {
color: #ffffff;
}

.planseeallphotoshighlight {
font-size: .8em;
background-color: #928f31;
}


/* BEGIN PLAN DETAILS SPECS */
.plan-specifications- {
line-height: 1.5px;
}

.plan-specifications-row-header {
font-weight: bold;
color: #68696b;
font-size: 1.7em;
padding-top: 10px;
padding-left: 10px;
}

.plan-specs-title-holder {
width: 100%;
border-bottom: 2px solid #adafaf;
margin-bottom: 15px;
}

.specsection {
margin-bottom: 10px;
}

.specification-column {
background-color: #eef2f4;
margin-left: 0px;
margin-right: 0px;
padding-left: 10px;
padding-right: 10px;
}

.nopadding {
padding: 0 0 0 0
}

.plan-specs-feature-title {
text-transform: uppercase;
font-weight: bold;
color: #91aec5;
line-height: 24px;
}

.plan-specs-feature-value {
line-height: 20px;
}

.plan-specs-spacer {
padding: 7px;
}

.plan-guarantee-holder {
border: 1px solid #9db0bd;
padding-top: 20px;
}

.plan-guarantee-holder ul li {
padding-top: 12px;
padding-bottom: 12px;
}

.plan-spec-padding {
margin-top: 45px;
}
/* END PLAN DETAILS SPECS */


/* MOBILE */

@media only screen and (max-width: 625px) {

/* Main Car */
#main-car {
max-height: 340px;
}

#main-car .owl-height {
box-shadow: 0px 0px 4px rgb(0 0 0 / 25%);
height: 230px;
}

#main-car-left-arrow {
position: absolute;
top: calc(50% - 30px);
left: 15px;
z-index: 10;
cursor: pointer;
}

#main-car-right-arrow {
position: absolute;
top: calc(50% - 30px);
right: 15px;
z-index: 10;
cursor: pointer;
}

.image-name {
font-family: DM Sans;
font-weight: 500;
font-size: 12px;
line-height: 15px;
text-align: center;
color: #000000;
padding: 4px;
}

#pintbottom {
top: 15px;
}

/* Details top*/
.details {
flex-direction: row;
margin-top: 0;
margin-bottom: 15px;
padding-bottom: 3px;
min-width: 0;
min-height: 0;
}

.details .detail-cell .detail-label {
color: #333333;
font-weight: normal;
font-size: 13px;
line-height: 24px;
}

.details .detail-cell .detail-value {
color: #333333;
font-weight: bold;
font-size: 15px;
line-height: 18px;
}

/* Description */
.plan-description {
padding: 7px;
}

.plan-desc-view-package {
display: inline-block;
padding: 8px 0px 15px 0px;
margin: 0;
}

.Socials {
padding-top: 5px;
}

.mobile-desc-buttons {
width: 100%;
position: relative;
}

.mobile-desc-buttons .columns:first-child {
padding-right: 0.3437rem;
}

.mobile-desc-buttons .columns:last-child {
padding-left: 0.3437rem;
}

.mobile-desc-buttons .price-button {
background: #656565;
color: #FFFFFF;
text-align: center;
font-family: DM Sans;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 16px;
padding: 10px 0;
margin-bottom: 10px;
}

.mobile-desc-buttons .price-button svg {
margin: 0 0 -1px 3px;
}

.mobile-desc-buttons .desc-button {
background: #555555;
border-radius: 3px;
color: #F2F2F2;
text-align: center;
font-family: DM Sans;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 38px;
margin-bottom: 10px;
}

.mobile-desc-buttons .desc-button svg {
margin: 0 5px -3.5px 0;
width: 16px;
height: 16px;
}

.mobile-desc-buttons a:last-child .desc-button {
margin-bottom: 50px;
}

.quicklinks {
min-width: 0;
width: calc(100% - 1.0311rem);
margin-top: 0px;
}

.quicklinks .more-options-container {
padding: 12px 12px 5px 12px;
}

/* Floorplans*/
.floor-plan-container {
padding: 0;
}

.floor-plan-title {
font-size: 18px;
line-height: 24px;
}

.floor-plan-name {
margin-bottom: -8px;
font-size: 16px;
line-height: 24px;
}

.floor-plan-mag, .floor-plan-save {
top: 3px;
}

#floor-plan-left-arrow, #floor-plan-right-arrow {
width: 20px;
height: 20px;
}

#floor-plan-left-arrow {
left: 10px;
}

#floor-plan-right-arrow {
right: 10px;
}

#small-car .owl-item .item-overlay .text, #small-car .text {
padding: 5px;
font-size: 14px;
line-height: 18px;
}

#small-car .SamplePlanButton {
color: #ffffff;
padding: 2px;
font-size: 16px;
line-height: 16px;
}

#floor-plan-popup-left-arrow, #floor-plan-popup-right-arrow {
width: 20px;
height: 20px;
}

#plan-deets {
margin: 0 -0.6875rem;
}
}

@media only screen and (max-width: 550px) {

/* Main Car */
#main-car {
max-height: 300px;
}
}

.NeedAssistance {
margin: 18px 0 0px 0;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 18px;
align-items: center;
text-align: center;
color: #555555;
}

.NeedAssistance a {
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 18px;
align-items: center;
text-align: center;
color: #555555;
}

.NeedAssistance svg {
height: 18px;
}

@media (max-width: 600px) {
.feature-containers {
margin-top: 20px;
}
}

.planorderheaderviewall {
background: #4D4D4D;
border-radius: 3px;
width: 40%;
text-align: center;
margin: 10px 0 10px 0;
padding: 3px;
}

.planorderheaderviewall a {
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 14px;
align-items: center;
text-align: center;
color: #F2F2F2;
}

.PinItSaveA {
display: inline-block;
position: relative;
z-index: 1;
}

.PinItSaveSpan {
display: inline-block;
}

.PinItSaveObject {
position: relative;
z-index: -1
}

@media (max-width: 600px) {
.PinItSaveObject svg {
height: 15px;
}
}


/* END PLAN PAGE */


/* ORDER FORM */

#OrderFormContainer {
background: #FFFFFF;
mix-blend-mode: normal;
box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, 0.2);
border-radius: 6px;
padding: 12px 15px;
margin-top: 10px;
}

.plan-options-header {
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 24px;
text-transform: capitalize;
color: #555555;
padding: 3px 0 3px 0;
font-size: 1.25em;
}

.plan-options-header svg path {
fill__: #000000;
}

.header-hover:hover, .header-hover:hover svg path {
text-decoration: underline;
color: #555555;
cursor: pointer;
fill: #555555;
}

.header-expanded, .header-hover___ svg path {
color: #555555;
fill: #555555;
}

.header-optional {
font-style: italic;
font-weight: 500;
font-size: 14px;
line-height: 24px;
text-transform: capitalize;
color: #4D4D4D;
}

#OrderFormContainer .ShowPopup {
background: #F5F5F5;
}

#OrderFormContainer .PlanOptions {
padding: 4px 4px 4px 4px;
}

#OrderFormContainer table {
background: #F5F5F5;
width: 100%;
margin: 0px;
padding: 0px;
border: 0px #000 solid;
border-bottom: 5px #ffffff solid;
}

#OrderFormContainer input[type="checkbox"] {
margin-bottom: 0px;
}

#OrderFormContainer .PlanOptionsPopup {
background: #F5F5F5;
}

#OrderFormContainer .tdcellCheck {
vertical-align: top;
width: 5px;
padding-top: 5px;
padding-bottom: 0px;
line-height: 10px;
border: 0px solid #fff;
}

#OrderFormContainer .tdcellTitle {
vertical-align: top;
width: 100%;
padding: 5px 0px;
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 23px;
text-transform: capitalize;
color: #000000;
border: 0px solid #fff;
}

#OrderFormContainer .tdcellTitle a {
cursor: pointer;
color: #000000;
}

#OrderFormContainer .tdcellTitle a.PDFNowOrderForm {
color: #555555;
}

#OrderFormContainer .tdcellTitle a:hover {
color: #555555;
}

#OrderFormContainer .tdcellPrice {
vertical-align: top;
width: 20px;
padding: 0px 5px;
text-align: right;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 24px;
color: #000000;
border: 0px solid #fff;
}
/* not used #OrderFormContainer .PlanOptionsDesc {padding:0px;font-style: normal;font-weight: normal;font-size: 13px;line-height: 15px;color: #333333;}*/
#OrderFormContainer .PlanDesc, #OrderFormContainer .PlanDesc p {
font-weight: normal;
font-size: 12pt;
line-height: 22px;
margin-top: 5px;
text-transform: none;
}

#OrderFormContainer .PDFNowOrderForm {
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 21px;
color: #555555;
}

#AddOnOptions {
padding-bottom: 10px;
}

#Subtotal {
font-weight: bold;
text-align: right;
height: 50px;
}

#OrderFormContainer .Desc {
text-align: left;
width: 300px;
min-height: 70px;
margin: -18px 0 0 -300px;
position: absolute;
background-color: #ffffff;
border: 0px solid gray;
padding: 0.5em;
z-index: 10;
border-radius: 7px;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
display: none;
}

#OrderFormContainer .Desc:before {
content: "";
position: absolute;
z-index: 1;
right: -10px;
top: 22px;
position: absolute;
width: 25px;
height: 25px;
background: #FFFFFF;
box-shadow: 3px -3px 4px -2px rgba(0, 0, 0, 0.25);
transform: rotate(45deg);
}

#OrderFormContainer .Desc h2, #OrderFormContainer .Desc .h2 {
font-size: 1.3em;
}

#OrderFormContainer .Desc p {
font-size: 16px;
line-height: 24px;
}

#OrderFormContainer .PDFsNowDescSLD {
text-align: left;
width: 300px;
min-height: 70px;
margin: 23px 0 0 -30px;
position: absolute;
background-color: #ffffff;
border: 0px solid gray;
padding: 0.5em;
z-index: 10;
border-radius: 7px;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
text-transform: none;
display: none;
}

#OrderFormContainer .PDFsNowDescNoSLD {
text-align: left;
font-weight: normal;
width: 300px;
min-height: 70px;
margin: -24px 0 0 -320px;
position: absolute;
background-color: #ffffff;
border: 0px solid gray;
padding: 0.5em;
z-index: 10;
border-radius: 7px;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
text-transform: none;
display: none;
}

#OrderFormContainer .PDFsNowDescNoSLD:before {
content: "";
position: absolute;
z-index: 1;
right: -10px;
top: 22px;
position: absolute;
width: 25px;
height: 25px;
background: #FFFFFF;
box-shadow: 3px -3px 4px -2px rgba(0, 0, 0, 0.25);
transform: rotate(45deg);
}

#OrderFormContainer .PDFsNowDesc h2, #OrderFormContainer .PDFsNowDesc .h2 {
font-size: 1.3em;
}

#OrderFormContainer .PDFsNowDesc p {
font-size: 16px;
line-height: 24px;
}



/* Customize the label (the container) */
.container {
display: block;
position: relative;
padding-left: 8px;
margin-bottom: 7px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

/* Hide the browser's default checkbox */
.container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}

/* Create a custom checkbox */
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 16px;
width: 16px;
background-color: #fff;
margin: 3px 1px 0px 0px;
border: 1px solid #5358B3;
border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
background-color: #555555;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
content: "";
position: absolute;
display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
display: block;
}

/* Style the checkmark/indicator */
/* Uncomment for checkbox in box */
.container .checkmark:after {
left: 4px;
top: -2px;
width: 7px;
height: 14px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

.order-see-detailed {
padding: 10px 0 10px 0;
}

.order-see-detailed a {
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 18px;
color: #333333;
}

.order-subtotal-container {
margin: 15px 0px 15px 0px;
padding-top: 4px;
border: 1px solid #E6E7E8;
border-radius: 3px;
height: 50px;
}

/* END ORDER FORM */

/* PREFERRED PRODUCTS */
.plan-architects-preferred-products-products a span {
color: #555555;
}

#PlanAPP {
list-style: none;
padding: 0px 18px 0 20px;
margin-bottom: 0;
width: 100%;
max-width: 1155px;
}

#PlanAPP li {
text-align: center;
max-width: 250px;
}

.PlanAPPTitle {
font-style: normal;
font-weight: 600;
font-size: 28px;
line-height: 28px;
text-align: center;
text-transform: uppercase;
color: #000000;
padding-top: 20px;
margin-top: 0;
margin-bottom: 0;
}

#PlanAPP a {
color: #000000;
font-weight: normal;
}

#PlanAPP a span {
color: #555555;
font-weight: bold;
}

#PlanAPP .spacer {
height: 10px;
}

@media only screen and (min-width: 1030px) {
#PlanAPP {
margin: auto;
text-align: center;
padding-left: 20px;
}
}

@media only screen and (max-width: 625px) {
.PlanAPPTitle {
font-size: 20px;
}

#PlanAPP {
padding: 0px 0px 0 0px;
width: calc(100% + 20px);
margin-left: -10px;
margin-bottom: 10px;
}
}

#receiveproductinfo {
background: #FFFFFF;
border: 0.5px solid #555555;
box-sizing: border-box;
border-radius: 4px;
align-items: center;
text-align: center;
padding: 8px;
margin-top: 8px;
}

#receiveproductinfo a {
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 16px;
letter-spacing: 0.5px;
text-transform: uppercase;
color: #555555;
}
/* END PREFERRED PRODUCTS */

.read-more.active {
max-height: 100px;
margin-bottom: .1em;
}

/* Select Plan Validation */
#PopupOrderValidation {
position: fixed;
top: 150px;
padding: 20px;
width: 100%;
z-index: 10000001;
text-align: left;
font-size: 14px;
font-weight: normal;
max-height: 400px;
display: block;
}

#PopupOrderValidationInner {
border: solid 0px #000000;
background-color: #ffffff;
padding: 0px;
max-width: 350px;
margin: auto;
border-radius: 10px;
}

#PopupOrderValidationInner2 {
border: solid 2px #7e7e7e;
background-color: #ffffff;
padding: 0px;
border-radius: 10px;
}

#PopupOVHeader {
border: solid 1px #7890ac;
background-color: #555555;
padding: 0;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
height: 55px;
padding-top: 20px;
}

.PopupOVTitle {
text-align: center;
margin-bottom: 5px;
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 18px;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
color: #FFFFFF;
text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.55);
}

#PopupOVBody {
max-height: 400px;
overflow: auto;
}

#PopupOVContent {
margin: 20px 25px 20px 25px;
font-size: 18px;
color: #555555;
font-weight: bold;
}

#PopupOrderValidation .btnclose {
float: right;
margin: -20px -20px 0 0;
}
/* End Select Plan Validation */
