@font-face {
  font-family: "SuisseIntl-Regular";
  src: url('http://pitchworx.com/wp-content/uploads/2023/09/SuisseIntl-Regular.woff') format('woff2'),
       
}
* {
    color: #161519;
    font-size: 18px;
    font-family: 'DM Sans', Arial, sans-serif;
}
body p,input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="date"], input[type="url"],label, textarea, select,select option, .select2-container--default .select2-selection--single,.plan-perk,.sub-heading,header ul li a,.template-popup-list-item-text,.checkout-form-total-field-cost,footer .elementor-widget-container,footer .elementor-widget-container a,footer .elementor-widget-container b,footer .elementor-widget-container .wpcf7-list-item-label{
    font-family: 'SuisseIntl-Regular', sans-serif!important;
    font-size: 18px;
    font-style: normal;
}

header.navbar {
    padding: 0.5rem 16px 0.5rem 12px;
    background-color: #FBF0F1;
}
.navbar-brand img {
        width: 100px;
    }

/* humbuger */
/* Define the shape and color of the hamburger lines */
.navbar-toggler span {
    display: block;
	border-radius: 50px;
    background-color: #4f4f4f;
    height: 3px;
    width: 25px;
    margin-top: 0px;
    margin-bottom: 0px;
    position: relative;
    left: 0;
    opacity: 1;
    transition: all 0.35s ease-out;
    transform-origin: center left;
}


/* top line needs a little padding */
.navbar-toggler span:nth-child(1) {
       margin-top: 0em;
}

/**
 * Animate collapse into X.
 */

/* top line rotates 45 degrees clockwise and moves up and in a bit to close the center of the X in the center of the button */
.navbar-toggler:not(.collapsed) span:nth-child(1) {
    transform: translate(15%, -55%) rotate(45deg);
	
}
/* center line goes transparent */
.navbar-toggler:not(.collapsed) span:nth-child(2) {
    opacity: 0;
}
/* bottom line rotates 45 degrees counter clockwise, in, and down a bit to close the center of the X in the center of the button  */
.navbar-toggler:not(.collapsed) span:nth-child(3) {
    transform: translate(15%, 0%) rotate(-45deg) ;
	
}


/**
 * Animate collapse open into hamburger menu
 */

/* top line moves back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(1) {
    transform: translate(0%, 0%) rotate(0deg) ;
}
/* middle line goes back to regular color and opacity */
.navbar-toggler span:nth-child(2) {
    opacity: 1;
}
/* bottom line goes back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(3) {
    transform: translate(0%, 0%) rotate(0deg) ;
}



/* humbuger end */



/* footer {
    background-color: #F9F8FA;
    padding: 3rem 3rem 2rem 3rem;
} */

section {
    padding: 0.5rem 28px;
}

.section-container {
    max-width: 1460px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    position: relative;
}

.header-section {
    background-color: #FBF0F1;
    padding-top: 10rem;
}

.content-section {
    background-color: #ffffff;
}

.navbar-nav {
    display: flex;
    flex-direction: row;
}

.navbar-nav .nav-link {
    padding: 5px 8px!important;
    font-weight: bold;
    color: #161519;
	font-size:16px;
	margin-right: 8px;
    margin-left: 8px;
}

.navbar-nav .nav-link:hover {
    color: #199bfc;
}

.outline-button {
    display: block;
    text-decoration: none;
    color: #283742;
    border: 2px solid #283742;
    background-color: transparent;
    border-radius: 5px;
    padding: 0.5rem 1rem;
    font-weight: bold;
    white-space: nowrap;
    outline: none;
}

.outline-button:hover {
       color: #ffffff!important;
    border-color: #199bfc !important;
    background-color: #199bfc !important;
    transition: none;
}
.plan-card-header .outline-button:hover {
    color: #199bfc!important;
    border-color: #199bfc !important;
    background-color: #f6f6f61a !important;
    transition: none;
}


.outline-button:hover .outline-button-inner-text {
    color: #ffffff!important;
}

.outline-button.selected-plan {
    color: #ffffff;
    border-color: #199bfc;
    background-color: #199bfc;
}

.outline-button.selected-plan:hover {
    border-color: #1292f1;
    background-color: #1292f1;
}

.navbar-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.navbar-center {
    justify-content: center;
}

.navbar-right {
    display: flex;
    gap: 10px;
}

.navbar-right .navbar-toggler {
    border: none;
    border-radius: 0;
    background-color: #ffffff;
    padding: 6px 8px;
    box-shadow: none !important;
}

/* .row {
    width: 100%;
} */

.social-links {
    display: flex;
    gap: 10px;
    font-size: 18px;
    flex-wrap: nowrap;
}

.social-links .social-link-seperator {
    color: #161519;
    font-size: 18px;
    font-weight: bold;
}

.a-link {
    text-decoration: none;
    color: #161519;
    font-weight: bold;
    cursor: pointer;
}

.a-link:hover {
    color: #199bfc;
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.footer-logo {
    width: 100px;
}

footer h5 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 1rem;
}

footer h6 {
    font-size: 16px;
    font-weight: bold;
}

footer p {
    margin: 0;
}

.signup-field {
    position: relative;
}

.signup-field input[type="email"] {
    width: 100%;
    min-height: 3rem;
    padding: 0 1rem;
    padding-right: calc(1rem + 102px);
    background-color: rgba(150, 144, 162, .08);
    border: 2px solid transparent;
    font-size: 1.025rem;
    border-radius: 0.35rem;
    outline: none;
}

.signup-field input[type="email"]:hover,
.signup-field input[type="email"]:focus {
    border: 2px solid rgb(40 55 66);
}

.signup-field button[type="submit"] {
    position: absolute;
    top: 0;
    right: 0;
    min-height: 3rem;
    width: 102px;
    background-color: #283742;
    border: 2px solid #283742;
    color: #ffffff;
    border-radius: 0.35rem;
    padding: 2px 1.15rem;
    font-weight: 700;
    text-align: center;
    margin-left: -3px;
}

.signup-field button[type="submit"]:hover {
    background-color: #199bfc;
    border-color: #199bfc;
}

.signup-checkbox {
    display: flex;
    flex-wrap: nowrap;

}

.signup-checkbox input[type="checkbox"],.agreement-checkbox input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    outline: none;
    box-shadow: none;
    border: 2px solid #635d6f;
    border-radius: 5px;
    margin-right: 10px;
    background-color: transparent;
}

.signup-checkbox input[type="checkbox"]:checked ,.agreement-checkbox input[type="checkbox"]:checked {
    background-color: #199bfc;
    border-color: #199bfc;
}

.heading-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 3rem;
}

.heading-1 {
    font-weight: bold;
    font-size: 3rem;
    text-align: center;
}

.sub-heading {
    font-size: 18px;
    font-weight: 500;
    text-align: center;
}

.step-form-container {
    padding: 5rem 0;
}

.plan-card {
    background-color: #F9F8FA;
    padding: 2.5rem 2rem;
    margin: 0 0rem;
    border-radius: 15px;
    height: 100%;
}

.plan-card .plan-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.plan-card .plan-card-header .outline-button {
    border-width: 2px;
    padding: 0.5rem 0.8rem;
    font-size: 16px;
    line-height: 1;
}

.plan-card .plan-card-header .outline-button:hover {
    color: #199bfc;
    border-color: #199bfc;
    background-color: transparent;
}

.plan-card .plan-card-title {
    font-size: 1.2rem;
    font-weight: bold;
    white-space: nowrap;
}

.plan-card .price-title {
    font-size: 4rem;
    font-weight: bold;
}

.plan-card .price-badge {
    display: inline-block;
    background-color: rgba(150, 144, 162, .15);
    font-size: 14px;
    padding: 5px 10px;
    border-radius: 0.35rem;
}

.plan-card .plan-desc {
    margin: 1.5rem 0;
    font-size: 1rem;
    line-height: 1.2;
}

.plan-card .plan-perks {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 1.5rem;
}

.plan-card .plan-perks .plan-perk {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    line-height: 1;
    padding: 5px 0;
	font-size:0.9rem;
}

.plan-card .plan-perks .plan-perk.plan-perk-disabled {
    opacity: 0.7;
}

.plan-card .outline-button {
    display: inline-block;
    border-width: 1px;
    padding: 0.5rem 0.8rem;
    white-space: nowrap;
    font-size: 1rem;
    position: absolute;
    bottom: 0;
    left: 0;
}

.step-form-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0 0;
    gap: 1rem;
	flex-wrap: wrap;
}

.dark-button {
    background-color: #283742;
    border: 2px solid #283742;
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    padding: 0.5rem 1.5rem;
    border-radius: 0.35rem;
}

.dark-button:hover {
    background-color: #199bfc;
    border-color: #199bfc;
}

.light-button {
    background-color: #F1F0F3;
    border: 2px solid #F1F0F3;
    color: #283742;
    font-size: 18px;
    font-weight: bold;
    padding: 0.5rem;
    border-radius: 0.35rem;
}

.light-button:hover {
    border-color: #e1e0e3;
    background-color: #e1e0e3;
}

.plan-card-heading {
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 1.3;
    padding-bottom: 1rem;
}

.slide-count-range {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 1rem 0 2rem;
}

.slide-count-range input.slide-count-range-input {
    accent-color: black;
    flex: 1 1 auto;
}

.slide-count-range output.slide-count-range-display {
    font-size: 1.5rem;
    font-weight: bold;
    width: 40px;
    text-align: center;
}

.plan-select-container {
    padding: 1rem 0 3rem;
}

.plan-select-container select.plan-select {
    background-color: #ffffff;
    border: 1px solid #AEAEAE;
    width: 100%;
    font-size: 18px;
    padding: 0.5rem 2rem 0.5rem 1rem;
    border-radius: 8px;
    appearance: none;
    outline: none;
    background-image: url("/wp-content/themes/ohio/orderAssets/New/image/Polygon2.webp");
    background-repeat: no-repeat;
    background-position-x: 97%;
    background-position-y: 22px;
}

.plan-card .dashed-textarea-lg {
    width: 100%;
    padding: 1rem 1.5rem;
    margin: 1rem 0 0;
    background-color: #ffffff;
    border-radius: 10px;
    background-repeat: no-repeat;
    border: 2px dashed #BEBEBE;
    resize: none;
    font-size: 18px;
}

.plan-card .dashed-textarea-lg:focus {
    border: 2px dashed #199bfc;
    outline: transparent;
}

.plan-card .drop-file-input {
    padding: 3rem 2rem;
    background-color: #F8F8F8;
    border-radius: 10px;
    border: 2px dashed #BEBEBE;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;
}

.plan-card .drop-file-input input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    appearance: none;
    opacity: 0;
    border-radius: 10px;
    cursor: pointer;
}

.plan-card .drop-file-input .file-label {
    color: #003CD3;
    font-size: 18px;
    font-weight: bold;
}

.checkout-detail-form {
    display: flex;
    flex-direction: column;
    gap: 1.8rem;
}

.checkout-detail-form .checkout-detail-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.checkout-detail-form .checkout-detail-form-row.checkout-detail-form-row-3 {
    grid-template-columns: 1fr 1fr 1fr;
}

.checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field {
    display: flex;
	flex-direction:column;
}

.checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field label,
.checkout-detail-form-note {
    font-size: 18px;
}

.checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field input, .checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field select{
    padding: 0.4rem 0.8rem;
    width: 100%;
    border: 1px solid #D9D9D9;
    border-radius: 8px;
    font-size: 18px;
    background-color: #ffffff;
}

.checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field input:focus, .checkout-detail-form .checkout-detail-form-row .checkout-detail-form-field select:focus {
    outline: 2px solid #199bfc;
}

.checkout-detail-form .checkout-detail-form-note .a-login-link {
    font-size: 18px;
    font-weight: bold;
    color: #199bfc;
    text-decoration: underline;
    text-decoration-thickness: 2px;
}


.checkout-form-total-container-header {
    text-align: center;
    font-family: "Amiri", Sans-serif;
    font-weight: 500;
    font-size: 39px;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.checkout-form-total {
    display: flex;
    flex-direction: column;
}

.checkout-form-total .checkout-form-total-header {
    background-color: #EEF4FC;
    padding: 0.5rem 2rem;
    border-radius: 10px;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
}

.checkout-form-total .checkout-form-total-field {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 1rem;
    font-size: 20px;
	align-items: center;
}

.checkout-form-total .checkout-form-total-field label {
    font-size: 18px;
}

.checkout-form-total .checkout-form-total-field .checkout-form-total-field-cost {
    font-weight: bold;
    font-size: 18px;
}

.checkout-form-total .checkout-form-total-field.checkout-form-total-field-lg * {
    font-size: 24px;
    font-weight: 600;
}

.checkout-form-total .checkout-form-spacer {
    min-height: 1rem;
}

.checkout-form-total .hr-form-divider {
    min-height: 1px;
    background-color: #dddddd;
    margin: 10px 0;
}

.checkout-form-total .checkout-form-total-note {
    display: flex;
    background-color: #E1F8EA;
    border-radius: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 0.5rem;
    margin-bottom: 1rem;
}

.checkout-form-total .checkout-form-total-note label {
    color: #1CB13D;
    font-size: 18px;
    font-weight: 600;
}

.accet-agreement-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-left: 1rem;
    margin-top: 3rem;
}

.accet-agreement-container p {
    margin: 0;
}

.accet-agreement-container .agreement-checkbox {
    display: flex;
    align-items: center;
}

.accet-agreement-container .agreement-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    aspect-ratio: 1/1;
    margin: 0;
    margin-right: 10px;   
}


.accet-agreement-container .agreement-checkbox label .agreement-link {
    text-decoration: none;
    color: #199bfc;
    font-weight: 600;
}

.accet-agreement-container .agreement-checkbox label .agreement-link:hover {
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.circle-container {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 5% 3rem;
}

.circle-container.circle-container-responsive {
    display: none;
    margin: 0;
}

.circle-container .circle-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.icon-selected,
.icon-visited,
.icon-disabled {
    display: none !important;
    width: 32px;
    aspect-ratio: 1/1;
}

.circle-container .dotted-line {
    flex: 1 1 auto;
    border-top: 3px dotted #AEAEAE;
    height: 1px;
    max-width: 150px;
    margin: 0 2rem;
}

.circle-container .dotted-line.dotted-line-dark {
    border-color: #000000;
}

.circle-container .dotted-line.dotted-line-hidden {
    display: none;
}

.circle-container .circle-content .circle-frame {
    border-width: 2px;
    border-style: solid;
    border-color: #AEAEAE;
    border-radius: 10px;
    padding: 13px;
    margin-bottom: 10px;
}

.circle-container .circle-content.circle-selected .circle-frame {
    border-color: #003CD3;
}

.circle-container .circle-content.circle-visited .circle-frame {
    border-color: #000000;
}

.circle-container .circle-content.circle-disabled .circle-frame {
    border-color: #AEAEAE;
}

.circle-container .circle-content .step-label {
    font-size: 16px;
    font-weight: bold;
    color: #AEAEAE;
    border-width: 2px;
    border-style: solid;
    border-color: #AEAEAE;
    border-radius: 8px;
    padding: 2px 10px;
    text-align: center;
    background-color: transparent;
    line-height: 1.2;
}

.circle-container .circle-content.circle-selected .step-label {
    color: #ffffff;
    border-color: #003CD3;
    background-color: #003CD3;
}

.circle-container .circle-content.circle-visited .step-label {
    color: #ffffff;
    border-color: #000000;
    background-color: #000000;
}

.circle-container .circle-content.circle-disabled .step-label {
    color: #AEAEAE;
    border-color: #AEAEAE;
    background-color: transparent;
}

.circle-container .circle-content.circle-selected .icon-selected,
.circle-container .circle-content.circle-visited .icon-visited,
.circle-container .circle-content.circle-disabled .icon-disabled {
    display: block !important;
}

.circle-container .circle-content.circle-hidden {
    display: none !important;
}

.template-filter-container {
    display: flex;
    justify-content: end;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.template-filter-container .template-filter-select {
    font-size: 18px;
    color: #0000008a;
    background-color: #F7F6F8;
    border: none;
    outline: none;
    padding: 0.8rem 2rem 0.8rem 1rem;
    border-radius: 8px;
    appearance: none;
    background-image: url(/wp-content/themes/ohio/orderAssets/New/image/Vector8.webp);
    background-repeat: no-repeat;
    background-position-x: 92%;
    background-position-y: 50%;
}

.templates-container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0px, 1fr));
    gap: 1rem;
}

.templates-container .design-template {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
    background-color: transparent;
    border-radius: 15px;
}

.templates-container .design-template:hover {
    background-color: #DDE3F2;
}

.templates-container .design-template .design-template-img {
    width: 100%;
}

.templates-container .design-template .design-template-img img {
    width: 100%;
    border: 1px solid #AEAEAE;
    border-radius: 10px;
}

.templates-container .design-template .design-template-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.design-template-view-btn {
    border: none;
    outline: none;
	display:flex;
    background-color: #F7F6F8;
    padding: 12px 14px;
    border-radius: 8px;
}

.design-template-view-btn:hover {
    background-color: #ffffff;
}

.custom-radio-btn-container {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: start;
}

.custom-radio-btn-container label {
    font-size: 18px;
    cursor: pointer;
    line-height: 1;
}

.custom-radio-btn-container input[type="radio"] {
    appearance: none;
    width: 18px;
    height: 18px;
    border: 1px solid #003CD3;
    border-radius: 20px;
}

.custom-radio-btn-container input[type="radio"]:checked {
    appearance: auto;
    border: none;
}

.plan-card.design-style-filter {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: auto;
    margin: 0;
    padding: 2rem;
}

.design-style-filter-category {
    background-color: #ffffff;
    padding: 0.8rem;
    border: 1px solid #AEAEAE;
    border-radius: 8px;
    cursor: pointer;
}

.design-style-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0px, 1fr));
    gap: 1rem;
}

.design-style-grid img {
    width: 100%;
/* 	   border-radius: 10px;
    border: 1px solid #F9F8FA; */
}

.design-style-grid img:hover {
    transform: scale(1.01);
}


#stepUploadFiles,
#stepPickTemplate,
#stepPickStyle {
    display: none;
}

/*new*/
.template-popup .modal-header,
.template-popup .modal-footer {
    border: none;
    padding-bottom: 0;
}

.template-popup-content {
    padding-top: 0;
    padding-bottom: 0;
}

.template-popup-content .template-popup-display-image img {
    width: 100%;
}

.template-popup-display-image-slider .template-popup-slide {
    margin: 0;
}

.template-popup-slider .template-popup-slide {
    margin: 0 5px;
    max-height: 120px;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 8px;
}

.template-popup-slider .template-popup-slide:hover {
    transform: scale(1.05);
}

.template-popup-slider .template-popup-slide.slick-current {
    border-color: #283742;
}

.template-popup-slider .slick-list {
    padding: 5px 0;
}

.outline-button {
    background-color: transparent;
}

.template-popup-content .outline-button {
    border-width: 1px;
    font-size: 16px;
    padding: 0.5rem 0.8rem;
}

.template-popup-content h3 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.template-popup-content h2 {
    font-size: 1.2rem;
}

.template-popup-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.template-popup-list .template-popup-list-item {
    padding: 0 0 20px 30px;
    position: relative;
}

.template-popup-list .template-popup-list-item:after {
    content: '';
    display: block;
    position: absolute;
    left: 6px;
    top: 6px;
    width: 14px;
    aspect-ratio: 1/1;
    background: #ffffff;
    border: 1px solid #F32727;
    border-radius: 20px;
}

.template-popup-list .template-popup-list-item::before {
    content: '';
    display: block;
    position: absolute;
    left: 12px;
    top: 12px;
    width: 1px;
    height: 100%;
    background-color: #F32727;
}

.template-popup-list .template-popup-list-item:last-child:before {
    display: none;
}

.template-popup-list .template-popup-list-item:last-child:before {
    display: none;
}

.template-popup-list .template-popup-list-item-header {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.7;
}

.template-popup-list .template-popup-list-item-text {
    font-size: 16px;
    line-height: 1.7;
}

.template-popup-slider .slick-prev.slick-arrow {
    left: -18px;
    position: absolute;
    width: 20px;
    height: 20px;
}

.template-popup-slider .slick-arrow.slick-prev:before {
    content: '';
    display: block;
    border: solid #000000;
    border-width: 0 0 2px 2px;
    top: 5px;
    left: 5px;
    position: absolute;
    width: 10px;
    height: 10px;
    transform: rotate(45deg);
}

.template-popup-slider .slick-next.slick-arrow {
    right: -18px;
    position: absolute;
    width: 20px;
    height: 20px;
}

.template-popup-slider .slick-arrow.slick-next:before {
    content: '';
    display: block;
    border: solid #000000;
    border-width: 2px 2px 0 0;
    top: 5px;
    left: 5px;
    position: absolute;
    width: 10px;
    height: 10px;
    transform: rotate(45deg);
}

.drop-file-input:hover,
.drop-file-input.drag-hover {
    border-color: #199bfc;
}

/*new*/

.twentytwenty-slider-popup .twentytwenty-modal-close {
    position: absolute;
    top: 0;
    right: 0;
    background-color: transparent;
    border: 0;
    outline: 0;
}

.twentytwenty-slider-popup .twentytwenty-modal-close img {
    width: 2.5rem;
}

.twentytwenty-slider {
    padding: 0 1rem;
}

.twentytwenty-slider .twentytwenty-overlay:hover {
    background: rgba(17, 16, 19, 0.25);
}

.twentytwenty-slider .twentytwenty-before-label:before,
.twentytwenty-after-label:before {
    background-color: rgba(17, 17, 17, .96);
    border-radius: 5px;
}

.twentytwenty-slider .twentytwenty-handle {
    background-color: white;
}

.twentytwenty-slider .twentytwenty-left-arrow {
    border-right: 6px solid #000;
}

.twentytwenty-slider .twentytwenty-right-arrow {
    border-left: 6px solid #000;
}

.twentytwenty-slider .twentytwenty-container {
    border: 1px solid #ccc;
    border-radius: 20px;
}

.twentytwenty-slider .slick-prev.slick-arrow {
    left: -10px;
    position: absolute;
    width: 20px;
    height: 20px;
}

.twentytwenty-slider .slick-arrow.slick-prev:before {
    content: '';
    display: block;
    border: solid #003CD3;
    border-width: 0 0 3px 3px;
    top: 5px;
    left: 5px;
    position: absolute;
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
}

.twentytwenty-slider .slick-next.slick-arrow {
    right: -10px;
    position: absolute;
    width: 20px;
    height: 20px;
}

.twentytwenty-slider .slick-arrow.slick-next:before {
    content: '';
    display: block;
    border: solid #003CD3;
    border-width: 3px 3px 0 0;
    top: 5px;
    left: 5px;
    position: absolute;
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
}

.plan-card.plan-card-content {
    position: relative;
    padding-bottom: 4.5rem;
}

.plan-card.plan-card-content .outline-button {
    position: absolute;
    bottom: 2rem;
    left: 2rem;

}

.plan-card.plan-card-content .plan-card-header .outline-button {
    position: static;
}

.template-popup-slide .slick-current {
    display: block;
}

.template-popup-content::-webkit-scrollbar {
    width: 8px;
    height: 6px;
}

.template-popup-content::-webkit-scrollbar-track {
    background-color: #dad9dc;
    border-radius: 10px;
}

.template-popup-content::-webkit-scrollbar-track:hover {
    background-color: #d5d4d5;
}

.template-popup-content::-webkit-scrollbar-thumb {
    background-color: #199bfc;
    border-radius: 10px;
}

.template-popup-content::-webkit-scrollbar-thumb:hover {
    background-color: #003CD3;

}

.disable,
.disable:hover {
    background: #ccc !important;
    cursor: none !important;
    border: #ccc !important;
    color: #999 !important;
}

#stepPlan {
    display: block;
}
#stepAddOn {
    display: none;
}
#stepSummary {
    display: none;
}

#stepThankYou {
    display: none;
    flex-direction: column;
    align-items: center;
    margin-top: 0px;
}
#stepThankYou .title{
	padding-bottom:2rem;
}

#wrapper{
    width:100%;
    text-align:center;
}
#center{
/*     display:inline-block;   
    overflow:hidden;
    text-align:left; */
	width: 50%;
    height: 50%;
    margin: 0 auto;
}

@media screen and (max-width: 1440px) {

    .template-popup-slider,
    .template-popup-display-image-slider {
        max-width: 640px;
        margin: auto;
    }

    .twentytwenty-slider {
        max-width: 1000px;
        margin: auto;
    }
}

@media screen and (max-width: 1365px) {
    .templates-container {
        grid-template-columns: repeat(3, minmax(0px, 1fr));
    }

    .design-style-grid {
        grid-template-columns: repeat(2, minmax(0px, 1fr));
    }
}

@media screen and (max-width: 1024px) {

    .template-popup-slider,
    .template-popup-display-image-slider {
        max-width: 100%;
        margin: auto;
    }

    .twentytwenty-slider {
        max-width: 1000px;
        margin: auto;
    }
}

@media screen and (max-width: 992px) {

    header.navbar {
        padding: 0.5rem 0.8rem;
    }


    .circle-container {
        gap: 10px;
        padding: 0 2% 3rem;
    }

    .circle-container .dotted-line {
        display: none;
    }

    section {
        padding: 0.5rem 1rem;
    }

    footer {
        padding: 3rem 1rem 2rem 1rem;
    }

    .plan-card {
        /* margin: 0; */
        padding: 2.5rem 1.5rem;
    }

    .templates-container {
        grid-template-columns: repeat(2, minmax(0px, 1fr));
    }

}

@media screen and (max-width: 991px) {
    .navbar .navbar-section .navbar-center {
        justify-content: center;
        order: 3;
        width: 100%;
        margin: 0rem -1.8rem 0rem -0.8rem;
    }

    .navbar .navbar-section .navbar-nav {
        display: flex;
        flex-direction: column;
    }

    .navbar-nav .nav-link {
        padding: 10px 70px!important;
        margin-bottom: 2px;
		margin-right:0px;
        font-weight: bold;
        background-color: #ffffff;
    }
	.navbar-scrolling .navbar-section .navbar-right .navbar-toggler{
		background-color: #F9F8FA;
	}
	.navbar-right .outline-button{padding: 0.3rem 1rem;}
	.navbar-right .navbar-toggler{
		font-size: 16px;
		 border-radius: 6px;
		padding: 9px 8px;
	}
	.navbar-toggler:not(.collapsed) span:nth-child(1){
		    transform: translate(15%, -111%) rotate(45deg);
	}
	.navbar-toggler span:nth-child(1){
		    margin-top: 0.3em;
	}
}

@media screen and (max-width: 768px) {
	.navbar-nav .nav-link {
        padding: 10px 20px!important;
    }

    .section-container {
        padding: 0 !important;
    }

    .row {
        margin: 0;
    }

    .row>* {
        padding: 0;
    }

    .circle-container.circle-container-desktop {
        display: none;
    }

    .circle-container.circle-container-responsive {
        display: block;
    }

    .accet-agreement-container {
        margin-left: 0;
        margin-top: 2rem;
    }
}

@media screen and (max-width: 520px) {
    .checkout-detail-form .checkout-detail-form-row {
        grid-template-columns: 1fr;
    }

    .checkout-detail-form .checkout-detail-form-row.checkout-detail-form-row-3 {
        grid-template-columns: 1fr;
    }

    .checkout-form-total .checkout-form-total-header {
        padding: 0.5rem 1rem;
    }

    .checkout-form-total .checkout-form-total-field {
        padding: 0.5rem;
    }

    .checkout-form-total .checkout-form-total-note label {
        font-size: 16px;
        line-height: 1;
    }

    .templates-container {
        grid-template-columns: 1fr;
    }

    .design-style-grid {
        grid-template-columns: 1fr;
    }

    .plan-card {
        margin: 0;
    }
	.navbar-right .outline-button{padding: 0.2rem 1rem;}
	.navbar-right .navbar-toggler{
		font-size: 16px;
		border-radius: 6px;
		padding: 6px 8px;
	}
	.navbar-right .outline-button,.navbar-right .outline-button-inner-text{
		font-size: 16px;
		 
	}
	.navbar-toggler span:nth-child(1){
		margin-top: 0em;
	}
	.navbar-toggler:not(.collapsed) span:nth-child(1) {
    transform: translate(15%, -55%) rotate(45deg);
	
}
}

@media screen and (max-width: 425px) {
    .navbar-brand img {
        width: 75px;
    }

    .plan-card .dashed-textarea-lg {
        padding: 1rem;
        font-size: 16px;
    }

    .plan-card .drop-file-input .file-label {
        font-size: 16px
    }

    .plan-card.design-style-filter {
        padding: 1rem;
    }
}

@media screen and (max-width: 375px) {


    .plan-card {
        padding: 1.5rem 1rem;
    }

    .plan-card .price-title {
        font-size: 2.8rem;
    }

    .plan-card .plan-card-header .outline-button {
       padding: 0.5rem !important;
        font-size: 12px;
    }
	   .plan-card .plan-card-title {
        font-size: 1rem;
    }
}

.design-template.selected{
    background: #DDE3F2;
}
.pick-style,.pick-template{
    display: none !important;
}
.checkout-form-total-field.d-flex{
    display: flex !important;
}

#customer_details .col-1{flex: 0 0 auto;
    width: 100%;}


.plan-select-container select.plan-select {
    background-size: 16px 10px;
}
.template-filter-container select.template-filter-select {
   
    width: auto;
    background-size: 12px 8px;
}
.templates-container .design-template .design-template-img img {
    aspect-ratio: 16/10;
}
.template-popup-display-image-slider .template-popup-slide {
    aspect-ratio: 16/9;
}

.design-style-filter-category.selected-filter-category {
    background-color: #199bfc;
    border-color: #199bfc;
    box-shadow: 0px 0px 3px 0px #838383;
}
.design-style-filter-category.selected-filter-category .custom-radio-btn-container label {
    font-weight: bold;
    color: #ffffff;
}
.checkout-form-total .checkout-form-total-field label *{
    font-size: 18px;
}
.template-filter-container {
    justify-content: center;
    margin-bottom: 50px;
}

.checkout-form-total .checkout-form-total-field .checkout-form-total-field-cost ,
.checkout-form-total .checkout-form-total-field .checkout-form-total-field-cost * {
    font-weight: bold;
    font-size: 18px;
    text-align: right;
    white-space: nowrap;
}

.select-template-option.disable, 
.select-template-option.disable:hover {
    cursor: no-drop !important;
}

.checkout-detail-phoneNumber-field {
    padding-left: 3.5rem !important;
}
.file-upload-indicator .indicator-green,
.file-upload-indicator.no-file .indicator-red {
    display: block;
}
.file-upload-indicator.no-file .indicator-green,
.file-upload-indicator .indicator-red {
    display: none;
}

.popup-payment .modal-header,
.popup-payment .modal-footer {
    border: none;
    padding-bottom: 0;
}
.popup-payment .modal-body {
    padding-top: 0;
    padding-bottom: 0;
}
.checkout-detail-form .checkout-detail-form-row.checkout-detail-form-row-1 {
    grid-template-columns: 1fr;
}
.addtocart_container {
    margin: auto;
    min-width: 300px;
   
}
.payment-selector {
    background-color: #F9F8FA;
    padding: 1rem 1rem 2rem;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.payment-selector .payment-selector-btn {
    outline: none;
    border: none;
    background-color: #ffffff;
    border: 1px solid #e7e7e7;
    color: #283742;
    font-size: 16px;
    font-weight: bold;
    padding: 0.5rem;
    border-radius: 0.35rem;
}
.payment-selector .payment-selector-btn:hover {
    background-color: #F1F0F3;
    border-color: #e7e7e7;
}
.payment-selector .payment-selector-btn.selected-payment {
    color: #ffffff;
    border-color: #199bfc;
    background-color: #199bfc;
}
.addtocart_container form.wpsc-session{
	display:none;
}
.checkout-detail-form-field select.validation-error ,
.checkout-detail-form-field input.validation-error  {
    outline: 2px solid red !important;
}

.checkout-detail-form-field .validation-error-msg {
    color: red;
    font-size: 14px;
    padding-top: 5px;
    padding-left: 5px;
    display: none;
}
.checkout-detail-form-field .validation-error-msg.show-msg {
    display: inline;
}
.elementor-element-0ef4ec1 .ohio-widget.heading.-right .subtitle .d-flex{
	display:inline!important;
}
.elementor-element-4ed41e1{
	padding:0rem 0.5rem;
}
.elementor-element-0ef4ec1 .ohio-widget.heading.-right .subtitle .d-flex a{
	font-size:16px!important;
}

.navbar-brand.navbar-left {
    padding: 0;
    margin: 0;
}

header.navbar{
    transition: background-color 3s ease !important;
}
header.navbar.navbar-scrolling {
    background-color: #ffffff;
}
.-outlined:hover .icon.-left{
	color: #199bfc;
}

.button.-outlined:not(.-pagination):focus .icon.-left{
	color: #199BFC;
}

.-small .icon, .-extra-small .icon {
    font-size: 1.3em!important;
}

.wd-italic{
	font-style: italic;
	font-size: 16px;
    padding: 0px 5px;
}
.btn.-outlined:not(.-pagination):hover, .lazy-load.-outlined .btn.button:not(.-pagination):hover:not(.-flat), .pagination:not(.text-center).-outlined .btn.button:not(.-pagination):hover:not(.-flat), .btn.-outlined:not(.-pagination):active, .lazy-load.-outlined .btn.button:not(.-pagination):active:not(.-flat), .pagination:not(.text-center).-outlined .btn.button:not(.-pagination):active:not(.-flat), .btn.-outlined:not(.-pagination):focus, .lazy-load.-outlined .btn.button:not(.-pagination):focus:not(.-flat), .pagination:not(.text-center).-outlined .btn.button:not(.-pagination):focus:not(.-flat), .button.-outlined:not(.-pagination):hover, .lazy-load.-outlined .button:not(.-pagination):hover:not(.-flat), .pagination:not(.text-center).-outlined .button:not(.-pagination):hover:not(.-flat), .button.-outlined:not(.-pagination):active, .lazy-load.-outlined .button:not(.-pagination):active:not(.-flat), .pagination:not(.text-center).-outlined .button:not(.-pagination):active:not(.-flat), .button.-outlined:not(.-pagination):focus, .lazy-load.-outlined .button:not(.-pagination):focus:not(.-flat), .pagination:not(.text-center).-outlined .button:not(.-pagination):focus:not(.-flat), a.button.-outlined:not(.-pagination):hover, .lazy-load.-outlined a.button:not(.-pagination):hover:not(.-flat), .pagination:not(.text-center).-outlined a.button:not(.-pagination):hover:not(.-flat), a.button.-outlined:not(.-pagination):active, .lazy-load.-outlined a.button:not(.-pagination):active:not(.-flat), .pagination:not(.text-center).-outlined a.button:not(.-pagination):active:not(.-flat), a.button.-outlined:not(.-pagination):focus, .lazy-load.-outlined a.button:not(.-pagination):focus:not(.-flat), .pagination:not(.text-center).-outlined a.button:not(.-pagination):focus:not(.-flat), button[type="submit"].-outlined:not(.-pagination):hover, .lazy-load.-outlined button.button[type="submit"]:not(.-pagination):hover:not(.-flat), .pagination:not(.text-center).-outlined button.button[type="submit"]:not(.-pagination):hover:not(.-flat), button[type="submit"].-outlined:not(.-pagination):active, .lazy-load.-outlined button.button[type="submit"]:not(.-pagination):active:not(.-flat), .pagination:not(.text-center).-outlined button.button[type="submit"]:not(.-pagination):active:not(.-flat), button[type="submit"].-outlined:not(.-pagination):focus, .lazy-load.-outlined button.button[type="submit"]:not(.-pagination):focus:not(.-flat), .pagination:not(.text-center).-outlined button.button[type="submit"]:not(.-pagination):focus:not(.-flat), input[type="submit"].-outlined:not(.-pagination):hover, .lazy-load.-outlined input.button[type="submit"]:not(.-pagination):hover:not(.-flat), .pagination:not(.text-center).-outlined input.button[type="submit"]:not(.-pagination):hover:not(.-flat), input[type="submit"].-outlined:not(.-pagination):active, .lazy-load.-outlined input.button[type="submit"]:not(.-pagination):active:not(.-flat), .pagination:not(.text-center).-outlined input.button[type="submit"]:not(.-pagination):active:not(.-flat), input[type="submit"].-outlined:not(.-pagination):focus, .lazy-load.-outlined input.button[type="submit"]:not(.-pagination):focus:not(.-flat), .pagination:not(.text-center).-outlined input.button[type="submit"]:not(.-pagination):focus:not(.-flat){
	border-color: currentColor;
/*     color: #199BFC!important; */
}
.collapse.navbar-collapse.navbar-center {
    padding-right: 4px;
}

@media screen and (min-width: 1070px) {
    .navbar-brand-left {
        width: 20%;
    }
    .navbar-right {
        width: 20%;
        justify-content: end;
    }
}
@media screen and (max-width: 991px) {
    .collapse.navbar-collapse.navbar-center {
        padding-right: 0;
    }
}
@media screen and ((max-width: 991px) and (min-width: 520px) ) {
    header.navbar {
        padding-right: 32px !important;
    }
}
ul:not(.-unlist) > li, ol:not(.-unlist) > li{
	    margin: 0px 0!important;
}
@media screen and ((max-width: 768px) and (min-width: 767px)) {
    .plan-card {
        margin: 0 5px;
    }
}
.file-input-error-msg {
    color: red;
    padding-top: 5px;
    display: none;
}
.file-input-error-msg.show-msg {
    display: block;
}	


.tempate-pagination {
    display: flex;
    justify-content: start;
    align-items: center;
    margin-top: 3rem;
}
.tempate-pagination .pagination-navigation {
    display: flex;
    flex-wrap: nowrap;
}

.tempate-pagination .pagination-navigation .page-nav {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tempate-pagination .pagination-navigation .page-button {
    outline: transparent;
    border-radius: 5px;
    color: #283742;
    border: 1px solid transparent;
    background-color: transparent;
    line-height: 1;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 2.125rem;
    min-height: 2.125rem;
    padding: 0 8px;
}
.tempate-pagination .pagination-navigation .page-button:hover {
    border-color: rgba(150, 144, 162, 0.01);
    background-color: rgba(150, 144, 162, 0.06);
}
.tempate-pagination .pagination-navigation .page-button.active-page {
    color: #ffffff;
    border-color: #283742;
    background-color: #283742;
}

.tempate-pagination .page-button-nav .nav-arrow-prev .icon-svg{
    transform: scale(-0.9);
}
.tempate-pagination .page-button-nav .nav-arrow-next .icon-svg{
    transform: scale(0.9);
}
.tempate-pagination .page-button.page-button-nav:disabled {
    display: none;
}
.tempate-pagination .page-nav .page-button.nav-frame-hidden {
    display: none;
}
.templates-container .design-template.template-filter-hidden {
    display: none;
}

@media screen and (max-width: 520px) {
    .tempate-pagination .pagination-navigation .page-button {
        border-radius: 5px;
    }
    .tempate-pagination .pagination-navigation .page-nav .page-button {
        padding: 5px;
        min-width: 30px;
        min-height: 30px;
        font-size: 14px;
    }
    .tempate-pagination .page-button.page-button-nav {
        height: 35px;
    }
    .tempate-pagination .page-nav .page-more {
        padding: 0 3px;
    }

    section {
        padding: 0.5rem 12px;
    }

}

.tempate-pagination .page-nav .page-more {
    padding: 0 5px;
    pointer-events: none;
}