/* ProductPageTemplate1 styles */

/* Scroll to top button */
.cd-top {
    display: inline-block !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    position: fixed !important;
    bottom: 40px !important;
    right: 10px !important;
    overflow: hidden !important;
    text-indent: 100% !important;
    white-space: nowrap !important;
    background: transparent url(https://staging.abcsys.com/MMWebDev/Images/arrow_up.png) no-repeat center 50% !important;
    visibility: hidden !important;
    opacity: 0 !important;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s !important;
    -moz-transition: opacity .3s 0s, visibility 0s .3s !important;
    transition: opacity .3s 0s, visibility 0s .3s !important;
}

.cd-top.cd-is-visible,
.cd-top.cd-fade-out,
.no-touch .cd-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s !important;
    -moz-transition: opacity .3s 0s, visibility 0s 0s !important;
    transition: opacity .3s 0s, visibility 0s 0s !important;
}

.cd-top.cd-is-visible {
    visibility: visible !important;
    opacity: 1 !important;
}

.cd-top.cd-fade-out {
    opacity: .5 !important;
}

.no-touch .cd-top:hover {
    background-color: #e86256 !important;
    opacity: 1 !important;
}

.box {
    width: 150px !important;
    background-color: black !important;
    color: #fff !important;
    position: relative !important;
    margin: 6px !important;
    float: left !important;
}

.box.arrow-right1:after {
    content: " " !important;
    position: absolute !important;
    right: -12px !important;
    top: 10px !important;
    border-top: 12px solid transparent !important;
    border-right: none !important;
    border-left: 12px solid #f5f5f5 !important;
    border-bottom: 12px solid transparent !important;
}

.divcontainer {
    text-align: center !important;
    cursor: pointer !important;
    position: relative !important;
}

/* Banner notifications */
#EditBanner {
    color: white !important;
    font-size: 30px !important;
    padding: 20px !important;
    border-radius: 10px !important;
    position: fixed !important;
    top: 5px !important;
    left: 40% !important;
    width: 20% !important;
    z-index: 100000 !important;
    background: red !important;
    display: none !important;
    text-align: center !important;
}

#MasterBanner,
#ViewSpecific,
#NgIf {
    line-height: 1.2 !important;
    color: white !important;
    font-size: 30px !important;
    padding: 20px !important;
    border-radius: 10px !important;
    position: fixed !important;
    bottom: 100px !important;
    vertical-align: middle !important;
    left: 30% !important;
    width: 40% !important;
    z-index: 100000 !important;
    background: red !important;
    display: none !important;
    text-align: center !important;
}

/* Overlays / masks */
#BlockProduct {
    width: 100% !important;
    height: 5000px !important;
    position: fixed !important;
    z-index: 10000 !important;
    top: 0px !important;
    left: 0px !important;
    display: none !important;
}

#Calculate {
    background-color: rgba(215, 215, 215, 0.34) !important;
    width: 100% !important;
    height: 5000px !important;
    position: fixed !important;
    z-index: 10000 !important;
    top: 0px !important;
    left: 0px !important;
    display: none !important;
}

.pp-calc-object {
    position: fixed !important;
    width: 960px !important;
    height: 420px !important;
    margin-left: -500px !important;
    left: 50% !important;
    margin-top: 10% !important;
}

/* Video modal */
#MainVideodiv {
    background-color: black !important;
    padding-top: 30px !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: 60% !important;
    height: 60% !important;
    z-index: 10001 !important;
    margin-left: -30% !important;
    margin-top: -20% !important;
    display: none !important;
}

.pp-video-close-btn {
    margin-top: 20px !important;
}

#MainVideo {
    padding: 15px !important;
    height: 380px !important;
}

.pp-video-info {
    padding: 15px !important;
}

#VideoTitle {
    color: white !important;
    padding-bottom: 0px !important;
}

#VideoDesc {
    color: white !important;
}

/* Quick link panels */
#ProductQuickLink {
    position: fixed !important;
    height: 43px !important;
    width: 43px !important;
    right: 20px !important;
    top: 250px !important;
    border-radius: 10px !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    z-index: 10 !important;
}

#ProductQuickLinkStatic {
    position: fixed !important;
    height: 43px !important;
    width: 17% !important;
    right: 20px !important;
    top: 95px !important;
    border-radius: 10px !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    z-index: 10 !important;
}

#maskVideo {
    display: none !important;
    position: absolute !important;
    width: 2000px !important;
    height: 10000px !important;
    top: 0px !important;
    left: 0px !important;
    background-color: rgba(194, 194, 194, 0.51) !important;
    z-index: 12 !important;
}

#LastUpdatedByDate {
    position: fixed !important;
    top: 20px !important;
    right: 10px !important;
    color: white !important;
    z-index: 1000000 !important;
}

/* Main banner container */
#MainBannerDiv {
    width: 100% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin: 0px auto !important;
}

/* Flyer overlays on banners */
.pp-flyer-opaque {
    padding: 1.5em !important;
    border: 1px solid rgba(174, 174, 174, 0.41) !important;
    max-width: 60% !important;
    position: absolute !important;
    top: 40% !important;
    left: 8% !important;
    z-index: 10 !important;
    border-radius: 3px !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
}

.pp-flyer-transparent {
    padding: 1.5em !important;
    border: 1px solid rgba(174, 174, 174, 0.41) !important;
    max-width: 60% !important;
    position: absolute !important;
    top: 25% !important;
    left: 4% !important;
    z-index: 10 !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    border-radius: 3px !important;
}

.pp-flyer-ge {
    padding: 1.5em !important;
    border: 1px solid rgba(174, 174, 174, 0.41) !important;
    max-width: 60% !important;
    position: absolute !important;
    top: 40% !important;
    left: 8% !important;
    z-index: 10 !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    border-radius: 3px !important;
}

.pp-flyer-dark {
    padding: 1.5em !important;
    border: 1px solid rgba(174, 174, 174, 0.41) !important;
    max-width: 60% !important;
    position: absolute !important;
    top: 25% !important;
    left: 4% !important;
    z-index: 10 !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    border-radius: 3px !important;
}

.pp-banner-subtitle {
    padding-bottom: 15px !important;
}

.pp-cr-btn {
    border-radius: 3px !important;
    width: 180px !important;
}

.pp-cr-btn-full {
    border-radius: 3px !important;
    width: 100% !important;
}

.pp-cr-btn-auto {
    border-radius: 3px !important;
}

.pp-h3-white {
    color: white !important;
}

/* GE zip code input */
#idZipCode {
    width: 60px !important;
    height: 28px !important;
    margin-bottom: 20px !important;
}

.pp-ei-quote-first {
    width: 69px !important;
}

.pp-ei-quote {
    margin-left: 7% !important;
    width: 69px !important;
}

/* Preview padding */
.pp-preview-padding {
    padding-top: 35px !important;
}

/* Mobile banner content */
#Div1 {
    z-index: 10 !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 15px !important;
}

.pp-mobile-banner-inner {
    padding: 1.5em !important;
}

.pp-mobile-product-name {
    padding: 10px !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    font-size: 30px !important;
    border-radius: 3px !important;
}

/* Tiles navigation */
#SquereTiles {
    vertical-align: middle !important;
    background: #fff !important;
    width: 100% !important;
    margin-top: 140px !important;
    padding-top: 0px !important;
}

#SquereTilesPrview {
    border-color: #808080 !important;
    z-index: 9999 !important;
    position: fixed !important;
    top: 0px !important;
    left: 0px !important;
    vertical-align: middle !important;
    background: #fff !important;
    width: 100% !important;
    padding-top: 0px !important;
}

.pp-tiles-row {
    margin: 0px auto !important;
}

.pp-tiles-quicklink-col {
    width: 300px !important;
}

#QuickLinks,
#Div2 {
    display: none !important;
}

#QuickLinkImage {
    position: absolute !important;
    left: -45px !important;
    top: 0px !important;
    height: 41px !important;
    cursor: pointer !important;
    z-index: 6 !important;
}

.pp-preview-quicklink-img {
    position: absolute !important;
    top: 0px !important;
    height: 41px !important;
    cursor: pointer !important;
    z-index: 6 !important;
}

.pp-quicklink-label {
    color: white !important;
    position: absolute !important;
    right: 35px !important;
    top: 10px !important;
    width: 300px !important;
    text-align: right !important;
    z-index: 7 !important;
    font-size: 18px !important;
}

.pp-quicklink-label-preview {
    color: white !important;
    position: absolute !important;
    right: 70px !important;
    top: 10px !important;
    width: 300px !important;
    text-align: right !important;
    z-index: 7 !important;
    font-size: 18px !important;
}

.pp-tiles-nav-wrapper {
    width: auto !important;
    padding-top: 0.7em !important;
    padding-bottom: .4em !important;
}

.pp-tiles-nav-center {
    text-align: center !important;
    line-height: 24px !important;
}

.pp-nav-link {
    display: inline-block !important;
}

.pp-nav-link-inline {
    display: inline !important;
}

.pp-nav-link-inline-sp {
    display: inline !important;
}

.pp-section-header-nowrap {
    white-space: nowrap !important;
}

#SaveContent {
    display: none !important;
}

.pp-edit-btn {
    cursor: pointer !important;
    padding: 0px 5px !important;
    background-color: blue !important;
    color: white !important;
    border-radius: 3px !important;
}

.pp-save-btn {
    cursor: pointer !important;
    padding: 0px 5px !important;
    background-color: green !important;
    color: white !important;
    border-radius: 3px !important;
}

.pp-cancel-btn {
    cursor: pointer !important;
    padding: 0px 5px !important;
    background-color: gray !important;
    color: white !important;
    border-radius: 3px !important;
}

/* Product sections */
#divIntroductionProd {
    padding-top: 40px !important;
}

.pp-section-content {
    margin: 0px 20% 0px 5% !important;
    padding: 3% !important;
    background-color: white !important;
}

.pp-section-content-sm {
    margin: 0px 5% 0px 5% !important;
    padding: 3% !important;
    background-color: white !important;
}

.pp-section-title {
    margin: 0px !important;
    padding-left: 0px !important;
}

.pp-section-title-inner {
    margin: 0px !important;
    padding-left: 13px !important;
}

/* FAQ section */
#FAQDiv {
    padding-left: 3% !important;
    padding-right: 3% !important;
    width: 100% !important;
    padding-top: 40px !important;
}

.pp-faq-header-row {
    padding: 0px !important;
    margin: 0px !important;
}

.pp-faq-header-col {
    padding: 15px !important;
}

.pp-faq-expand-link {
    cursor: pointer !important;
}

.pp-faq-section {
    background-color: rgba(255, 255, 255, .9) !important;
    z-index: 10 !important;
    padding: 0px !important;
    margin: 0px 0px 15px 0px !important;
}

.pp-faq-item {
    margin: 15px 15px 15px 15px !important;
    padding: 10px 10px 10px 10px !important;
    border-bottom: 1px solid rgba(174, 174, 174, 0.41) !important;
}

.pp-faq-toggle {
    font-size: 20px !important;
    cursor: pointer !important;
    margin-top: 5px !important;
}

.pp-faq-question {
    font-size: 16px !important;
}

.pp-faq-answer {
    padding-top: 10px !important;
    padding-left: 25px !important;
    padding-bottom: 10px !important;
}

.pp-faq-footer {
    margin: 15px 15px 15px 15px !important;
    padding: 10px 10px 10px 10px !important;
    border-bottom: 1px solid rgba(174, 174, 174, 0.41) !important;
}

.pp-faq-footer-text {
    font-size: 12px !important;
    color: rgb(66, 66, 66) !important;
}

/* Secured Personal Info modal */
#SecuredPersonalInfo {
    display: none !important;
    border-radius: 5px !important;
    width: 50% !important;
    margin-left: -25% !important;
    margin-right: 100px !important;
    top: 30% !important;
    left: 50% !important;
    z-index: 10000001 !important;
    position: fixed !important;
    background-color: white !important;
    padding: 10px 30px 10px 30px !important;
}

.pp-spi-title-row {
    text-align: center !important;
}

.pp-spi-description {
    font-size: 18px !important;
}

.pp-spi-form-group {
    text-align: center !important;
}

.pp-spi-label {
    padding-top: 5px !important;
    font-size: 16px !important;
}

.pp-spi-input {
    width: 50% !important;
}

.pp-spi-buttons {
    margin-bottom: 20px !important;
    margin-top: 50px !important;
    text-align: center !important;
}

.pp-spi-btn-save {
    border-width: 2px !important;
    margin-top: 0px !important;
    margin-left: 15px !important;
    width: 140px !important;
}

.pp-spi-btn-cancel {
    z-index: 100002 !important;
    border-width: 2px !important;
    margin-top: 0px !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
    width: 110px !important;
}

/* IZ Conduit Agreement modal */
#IZConduitMessage {
    display: none !important;
    border-radius: 5px !important;
    width: 50% !important;
    margin-left: -25% !important;
    margin-right: 100px !important;
    top: 30% !important;
    left: 50% !important;
    z-index: 10000001 !important;
    position: fixed !important;
    background-color: white !important;
}

.pp-iz-content {
    margin: 20px 20px 0px 20px !important;
}

.pp-iz-description {
    font-size: 18px !important;
}

.pp-iz-buttons {
    margin-bottom: 20px !important;
    margin-top: 50px !important;
}

.pp-iz-btn-agree {
    border-width: 2px !important;
    margin-top: 0px !important;
    margin-left: 15px !important;
    width: 110px !important;
}

.pp-iz-btn-disagree {
    z-index: 100002 !important;
    border-width: 2px !important;
    margin-top: 0px !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
    width: 110px !important;
}

/* Comparative Rater iframe */
#iFrameContent {
    display: none !important;
}

#ComparativeRater {
    overflow-y: hidden !important;
    border: none !important;
    height: 1000px !important;
    width: 100% !important;
}


/* ================================================ */
/* ProductPageTemplate2 styles */
/* ================================================ */

.GetQuoteButton:hover {
    color: white !important;
}

.GapMargin {
    margin-top: -200px !important;
}

#MainBannerDiv.pp-t2-banner {
    z-index: 100 !important;
    width: 100% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin: 0px auto !important;
}

.pp-t2-banner-img {
    margin-top: 58px !important;
}

.pp-t2-banner-overlay {
    position: absolute !important;
    left: 15% !important;
    top: 100px !important;
}

.pp-t2-banner-header {
    font-size: 70px !important;
    color: white !important;
}

.pp-t2-main-section {
    margin-top: -200px !important;
    z-index: 99 !important;
    position: relative !important;
}

.pp-t2-main-section-preview {
    margin-top: -50px !important;
    z-index: 99 !important;
    position: relative !important;
}

.pp-t2-section-padding {
    padding-top: 40px !important;
    padding-bottom: 20px !important;
}

.pp-t2-section-padding-bottom {
    padding-bottom: 20px !important;
}

.pp-t2-section-card {
    margin: 0px 15% 0px 15% !important;
    width: 70% !important;
    border-radius: 8px !important;
    padding: 3% !important;
    background-color: white !important;
    box-shadow: 0 4px 8px rgba(0,0,0,.04) !important;
}

.pp-t2-section-card-faq {
    margin: 0px 15% 0px 15% !important;
    width: 70% !important;
    border-radius: 8px !important;
    padding: 2% !important;
    background-color: white !important;
    box-shadow: 0 4px 8px rgba(0,0,0,.04) !important;
}

.pp-t2-banner-title {
    font-size: 24px !important;
    font-weight: 600 !important;
}

.pp-t2-banner-details {
    font-size: 20px !important;
    font-weight: 600 !important;
}

#FAQDiv.pp-t2-faq {
    width: 100% !important;
}

.pp-t2-faq-section {
    background-color: rgba(255, 255, 255, .9) !important;
    z-index: 10 !important;
    margin: 0px !important;
    padding: 0px !important;
}

.pp-t2-faq-item {
    margin: 15px 15px 15px 15px !important;
    padding: 10px 10px 30px 10px !important;
    border-bottom: 1px solid rgba(174, 174, 174, 0.41) !important;
}

/* RightPane styles */
.rp-gear-content-header {
    padding: 10px 15px 0px 22px !important;
    margin-bottom: 5px !important;
}

.rp-product-name {
    font-size: 14px !important;
}

.rp-list-group {
    margin-bottom: 0px !important;
    padding-top: 12px !important;
}

.rp-message-open {
    font-size: 18px !important;
    color: green !important;
}

.rp-message-closed {
    font-size: 18px !important;
    color: red !important;
}

.rp-message-default {
    font-size: 16px !important;
}

.rp-vendor-detail {
    color: #808080 !important;
    font-size: 12px !important;
}

.rp-tollfree-lg {
    font-size: 14px !important;
    display: inline !important;
}

.rp-tollfree-sm {
    font-size: 12px !important;
    display: inline !important;
}
