﻿@font-face {
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot');
    src: url('../fonts/icomoon.eot#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf') format('truetype'), url('../fonts/icomoon.woff') format('woff'), url('../fonts/icomoon.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"],
[class*=" icon-"],
.iconstyle {
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-cross:before {
    content: "\e903";
}

.icon-close:before {
    content: "\e903";
}
.abcRioButton.abcRioButtonLightBlue {
    height: 44px!important;
    width: 100%!important;
    border-radius:14px;
}
.abcRioButtonIcon {
    padding: 13px!important;
}
.abcRioButtonContents {
    line-height: 44px!important;
}
/*modal*/
.modalcontent {
    display: none;
}
input[type=button]{
    outline:none;
}
.modal {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10000;
}

.modal .modal-overlay {
    position: absolute;
    cursor: pointer;
    opacity: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #1d1d1d;    z-index: 1110;
    -webkit-transition: opacity 200ms ease 150ms;
    transition: opacity 200ms ease 150ms;
}

.modal .modal-element {
    position: absolute;
    opacity: 0;
    width: 78.33333333rem;
    max-width: 770px;
    max-height: calc(100% - 150px);
    box-sizing: border-box;
    top: 50%;
    left: 50%;
    z-index: 1115;
    border: 1px solid #e4e4e4;
    background: #FFF;
    -webkit-transition: opacity 200ms ease, transform 200ms ease, height 200ms ease;
    transition: opacity 200ms ease, transform 200ms ease, height 200ms ease;
    -webkit-transform: translate(-50%, -50%) scale(.9);
    -ms-transform: translate(-50%, -50%) scale(.9);
    transform: translate(-50%, -50%) scale(.9);
}
@media (max-width:1200px) {
    .modal .modal-element {
        max-width: calc(100% - 40px);
    }
    .form-container .activation-container {
        margin: 48px 0px;
    }
    .form-container .resend-activation {
        margin-bottom: 16px
    }
}
.modal .modal-element .modal-close {
    position: absolute;
    top: 34px;
    right: 27px;
    width: auto;
    height: auto;
    border:none;
    z-index: 160;
    font-size: 14px;
    background-color: transparent;
}

.modal .modal-element .modal-close .icon {
    display: inline-block;
    vertical-align: middle;
    margin: -0.16666667rem -0.08333333rem 0rem 0rem;
}

.modal .modal-element .modal-close:hover,
.modal .modal-element .modal-close:active,
.modal .modal-element .modal-close:focus {
    background-color: #fafafa;
}

.modal .modal-element .modal-innerwrap {
    overflow: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.modal-content{
    border:none;
}
.modal .modal-element .modal-content {
    font-size: 1.1rem;
    line-height: 1.875rem;
    padding: 60px 27px 30px 27px;
}

.modal .modal-element .modal-content:after {
    display: block;
    content: ' ';
    clear: both;
    height: 0px;
    overflow: hidden;
}

.modal .modal-element .modal-content .modal-section {
    float: left;
    width: 100%;
    clear: both;
}

.modal .modal-element .modal-content .modal-section.left,
.modal .modal-element .modal-content .modal-section.right {
    clear: none;
    width: 44.469%;
}

.modal .modal-element .modal-content .modal-section.right {
    margin-left: 11.062%;
    clear: right;
}

.modal .modal-element .modal-content .modal-section.bottomcontrols .bottomwrap {
    float: left;
}

.modal .modal-element .modal-content .modal-section.bottomcontrols .bottomwrap.right {
    float: right;
}

.modal .modal-element .modal-content .modal-wrap {
    margin-bottom: 1.66666667rem;
    font-weight: 500;
}

.modal .modal-element .modal-content .modal-wrap:after {
    display: block;
    content: ' ';
    clear: both;
    height: 0px;
    overflow: hidden;
}

.modal .modal-element .modal-content .modal-wrap textarea {
    height: 10.66666667rem;
}

.modal .modal-element .modal-content .modal-wrap .label {
    line-height: 1.66666667rem;
    font-size: 1.0375rem;
    letter-spacing: .11em;
    font-weight: 500;
    margin-bottom: 0.83333333rem;
    display: block;
}

.modal .modal-element .modal-content .modal-wrap .radiowrap label,
.modal .modal-element .modal-content .modal-wrap .checkwrap label {
    padding-left: 2.08333333rem;
    font-size: 1.0375rem;
    letter-spacing: .11em;
}

.modal .modal-element .modal-content .modal-wrap .radiowrap.full,
.modal .modal-element .modal-content .modal-wrap .checkwrap.full {
    margin: 1.66666667rem 0rem 1.66666667rem 0rem;
}

.modal .modal-element .modal-content .modal-wrap .radiowrap.narrow label,
.modal .modal-element .modal-content .modal-wrap .checkwrap.narrow label {
    letter-spacing: 0;
}

.modal .modal-element .modal-content .modal-subtitle {
    line-height: 1.66666667rem;
    padding: 1.08333333rem 0rem 1.08333333rem 0rem;
    font-size: 1.1rem;
    margin-bottom: 1.66666667rem;
    border-bottom: 1px dotted #b6b6b6;
    font-weight: 500;
}

.modal .modal-element .modal-content .modal-subtitle.nogap {
    margin-bottom: 0;
}

.modal .modal-element .modal-content .modal-subtitle.noline {
    border-bottom: none;
}

.modal.enabled {
    display: block;
}

.modal.enabled.show .modal-overlay {
    opacity: .87;
    -webkit-transition: opacity 200ms ease 0ms;
    transition: opacity 200ms ease 0ms;
}

.modal.enabled.show .modal-element {
    -webkit-transform: translate(-50%, -50%) scale(1);
    -ms-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    -webkit-transition: opacity 200ms ease 150ms, transform 200ms ease 150ms;
    transition: opacity 200ms ease 150ms, transform 200ms ease 150ms;
    opacity: 1;
}

.modal.notrans .modal-overlay,
.modal.notrans .modal-element {
    -webkit-transition: none !important;
    transition: none !important;
}

.modal.beforeloading .modal-element:after {
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\e900';
}

.modal.beforeloading .modal-element:before {
    content: ' ';
    overflow: hidden;
    cursor: normal;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 150;
    background-color: #FFF;
    opacity: 0;
    -webkit-transition: opacity 250ms ease 0ms;
    transition: opacity 250ms ease 0ms;
}

.modal.beforeloading .modal-element:after {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 2.18333333rem;
    z-index: 155;
    opacity: 0;
    -webkit-transition: opacity 250ms ease 0ms;
    transition: opacity 250ms ease 0ms;
    -webkit-animation: spin 3s infinite linear;
    -moz-animation: spin 3s infinite linear;
    -animation: spin 3s infinite linear;
}

.modal.beforeloading.loading .modal-element:before,
.modal.beforeloading.loading .modal-element:after {
    opacity: 1;
}

.modal#confirmmodal {
    text-align: center;
}

.modal#confirmmodal .modal-element {
    width: 33.33333333rem;
}

.modal#confirmmodal .modal-element .modal-content .confirmmodal-content {
    font-size: 1.18333333rem;
}

.modal#confirmmodal .modal-element .modal-content .confirmmodal-opts {
    margin-top: 1.66666667rem;
}

.modal#confirmmodal .modal-element .modal-content .confirmmodal-opts .btn {
    margin-left: 0.83333333rem;
}

.modal#confirmmodal .modal-element .modal-content .confirmmodal-opts .btn:first-child {
    margin-left: 0;
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 11000;
}

    .preloader .centered {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 8px;
        height: 8px;
        margin-left: -4px;
        margin-top: -4px;
    }

    .preloader .circle {
        margin: 40px auto;
        position: relative;
        width: 8px;
        height: 8px;
        background-color: rgba(255, 255, 255, 0.5);
        box-shadow: -14px 0px 0px #ffffff;
        border-radius: 50%;
        -webkit-animation: typing 1s linear infinite alternate;
        -moz-animation: Typing 1s linear infinite alternate;
        animation: typing 1s linear infinite alternate;
    }

@-webkit-keyframes circle_classic {
    0% {
        opacity: 0.1;
        -webkit-transform: rotate(0deg) scale(0.5);
    }

    100% {
        opacity: 1;
        -webkit-transform: rotate(360deg) scale(1.2);
    }
}

.preloader .typing_loader {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    -webkit-animation: typing 1s linear infinite alternate;
    -moz-animation: Typing 1s linear infinite alternate;
    animation: typing 1s linear infinite alternate;
    margin: 46px auto; /* Not necessary- its only for layouting*/
    position: relative;
    left: -12px;
}

@-webkit-keyframes typing {
    0% {
        background-color: rgba(255,255,255, 1);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    25% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    75% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,1);
    }
}

@-moz-keyframes typing {
    0% {
        background-color: rgba(255,255,255, 1);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    25% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    75% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,1);
    }
}

@keyframes typing {
    0% {
        background-color: rgba(255,255,255, 1);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    25% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2), 24px 0px 0px 0px rgba(255,255,255,0.2);
    }

    75% {
        background-color: rgba(255,255,255, 0.4);
        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2), 24px 0px 0px 0px rgba(255,255,255,1);
    }
}

@-moz-keyframes circle_classic {
    0% {
        opacity: 0.1;
        -moz-transform: rotate(0deg) scale(0.5);
    }

    100% {
        opacity: 1;
        -moz-transform: rotate(360deg) scale(1.2);
    }
}

.select2-container.select2-container--open {
    z-index: 99999;
}
.content-area {
    width: 100%;
}

.body-area {
    width: 50%;
    float: left;
}

.slider-area {
    width: 50%;
    float: right;
}

.carousel-indicators {
    margin-bottom: 55px;
}

    .carousel-indicators li {
        border-radius: 100%;
        width: 10px;
        height: 10px;
    }

    .carousel-indicators .active {
        background-color: #ED1C24;
    }

    .carousel-indicators li:nth-child(2) {
        margin: 0 8px;
    }

@media screen and (max-width:992px) {
    .slider-area {
        display: none
    }

    .body-area {
        width: 100%;
    }
    .abcRioButton.abcRioButtonLightBlue {
        margin-bottom: 10px;
    }
}
.sigup-container {
    font-family: Roboto,sans-serif !important;
    /*margin-left: 35px;*/
}

p {
    margin-bottom: 0;
}

.sigup-container .inputwrap input.input-validation-error {
    border: 1px dashed #ED1C24 !important;
}

.sigup-container .sigin-logo img {
    width: 189px;
    height: 69px;
    margin-top: 30px;
}

.sigup-container .sigup-info .sigup-title {
    color: #1B1B19;
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 26px;
}

.sigup-container .sigup-info .sigup-text {
    color: #737373;
    font-family: Roboto,sans-serif !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px;
    margin-bottom: 37px;
}

.sigup-container .form-signup-info-area,
.endsigup-container .form-signup-info-area {
    width: 100%;
    display: table;
    margin-top:24px;
    margin-bottom: 24px;
}

.sigup-container .form-signup-info-area .form-signup-info,
.endsigup-container .form-signup-info-area .form-signup-info{
    color: #1B1B19;
    font-family: Roboto,sans-serif !important;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    float: left;
    margin-right: 30px;
    line-height:30px;
}

.sigup-container .form-signup-info-area .representation-button-area,
.endsigup-container .form-signup-info-area .representation-button-area{
    float: left;
    position: relative;
    top: 6px;
}

.sigup-container .form-signup-info-area .representation-button-area span,
.endsigup-container .form-signup-info-area .representation-button-area span{
    float: left;
}

.sigup-container .form-signup-info-area .representation-button-area .button-border,
.endsigup-container .form-signup-info-area .representation-button-area .button-border{
    width: 30px;
    height: 1px;
    background: #ED1C24;
    display: inline-block;
    position: relative;
    top: 8px;
}

.sigup-container .form-signup-info-area .representation-button-area .button-number,
.endsigup-container .form-signup-info-area .representation-button-area .button-number{
    font-family: Roboto,sans-serif !important;
    font-size: 11px;
    font-weight: 600;
    border-radius: 5px;
    width: 18px;
    height: 18px;
    color: #ED1C24;
    border: 1px solid #ED1C24;
    display: inline-block;
    text-align: center;
    line-height:16px;
}

.sigup-container .form-signup-info-area .representation-button-area .button-number.active,
.endsigup-container .form-signup-info-area .representation-button-area .button-number.active{
    background: #ED1C24;
    color: #fff;
}

.input-container {
    color: #1B1B19;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 15px;
    position: relative;
}

.input-container.referance-area {
    width: calc(100% - 245px);
    float: right;
    margin-bottom:10px;
}

.input-container.is-electrician-area {
    width: 192px;
    float: left;
    margin-bottom:10px;
}

.input-container .label {
    margin-bottom: 0;
}

.select2-container--default .select2-selection--single {
    margin-top: 8px !important;
    border-radius: 8px !important;
    border: 1px solid #BEBEBE;
    height: 50px !important;
    font-family: "Roboto-Light";
    font-weight:300;
    font-size:14px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    position: relative !important;
    top: 8px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 13px !important;
}

.input-container input::placeholder {
    color: rgba(116, 116, 116, 0.24);
    font-weight: 600;
}

.input-container input:focus {
    outline: none;
}

.input-container .label span {
    color: #F23333;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 15px;
}

.see-password-active {
    display: none;
}

.see-password {
    display: flex;
    align-items: center;
}

.see-password-active.active {
    display: inline-flex !important;
    align-items:center;
}

.see-password.hidden {
    display: none;
}

.next-step-button {
    border-radius: 14px;
    background: #ED1C24;
    width: 177px;
    height: 44px;
    float: right;
    color: #FFF;
    text-align: center;
    font-family: Roboto,sans-serif !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center;
    line-height: 44px;
}

.next-step-button:hover {
    text-decoration: none;
    color: #fff;
}

.second-step-area {
    display: none;
}

.is-electrician {
    width: 100%;
    border-radius: 5px;
    margin-top: 14px;
    display: table;
    height: 58px;
}

.is-electrician span {
    width: 50%;
    float: left;
    border: 1px solid #BEBEBE;
    color: #737373;
    text-align: center;
    font-family: Roboto,sans-serif !important;
    font-size: 15px;
    font-style: normal;
    font-weight: 300;
    line-height: 15px; /* 100% */
    padding: 21px;
}

.is-electrician span.active {
    background: #1B1B19;
    border: 1px solid #1B1B19;
    color: #fff;
}

.is-electrician span.yes {
    border-radius: 5px 0px 0px 5px;
}

.is-electrician span.no {
    border-radius: 0px 5px 5px 0px;
}

.login-opts label {
    line-height: 15px; /* 125% */
    float: left;
    width: calc(100% - 20px);
    left: 5px;
    position: relative;
    color: #1B1B19;
    font-family: "Roboto-Light"!important;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: 17px; 
}

.login-opts u {
    color: #1B1B19;
    font-family: Roboto,sans-serif !important;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 125% */
}

.login-opts input {
    float: left;
}

#previous {
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 14px;
    font-weight: 400;
    border-radius: 8px;
    border: 1px solid #1B1B19;
    text-decoration: none;
    float: right;
    padding: 10px 64px;
    margin-top: 12px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.js-submit-btn {
    border-radius: 14px;
    background: #ED1C24;
    margin-left: 15px;
    width: 176px;
    height: 44px;
    color: #FFF;
    font-family: Roboto,sans-serif !important;
    font-size: 14px;
    font-weight: 700;
    border:none;
}

.currentInfo {
    cursor: pointer;
}

.currentInfoBox {
    border: 1px solid #e6e6e6;
    visibility: hidden;
    width: 270px;
    background-color: #fff;
    color: #ccc;
    text-align: center;
    border-radius: 10px;
    padding: 15px;
    z-index: 1;
    font-size: 12px;
    box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
    position: absolute;
    right: -130px;
}

.infoBoxShow {
    visibility: visible;
}

.currentInfoBox::after {
    content: "";
    position: absolute;
    top: -10px;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
}

.infoBoxClose {
    right: 5px;
    position: absolute;
    width: 8px;
    top: 5px;
}

.description-area {
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 10px;
    font-style: normal;
    font-weight: 200;
    line-height: 13px;
}

.custom-close-popup {
    border-radius: 8px;
    border: 1px solid #1B1B19;
    color: #1B1B19;
    height: 50px;
    font-family: "Roboto-Regular",sans-serif !important;
    font-weight: 400;
    padding: 16px 24px;
}

.send-my-information {
    background: #ED1C24;
    color: #FFF;
    font-family: "Roboto-Bold",sans-serif !important;
    font-size: 14px;
    font-weight: 700;
    border: none;
}
@media (max-width:992px) {
    .sigup-container{
        margin:0;
    }
    .next-step-button{
        width:100%;
        height:50px;
        line-height:50px;
        margin-bottom:30px;
    }
    .input-container.referance-area{
        width:100%;
    }
    .input-container.is-electrician-area{
        margin-bottom:32px;
    }
}
@media (max-width:767px) {
    .js-submit-btn{
        width:100%;
        margin-bottom:15px;
    }
    #previous{
        width:100%;
    }
    .custom-close-popup.float-right, .custom-close-popup {
        width: 100%;
        margin-bottom: 15px;
    }
    .modal .modal-element .modal-content {
        padding: 60px 0 30px 0;
    }

    .form-container.login, .form-container.sigup-container {
        padding: 0 16px !important;
    }

    .form-container .input-container .js-captcha-container{
        display:inline !important;
    }
        .form-container .input-container .js-captcha-container #CaptchaInputText {
            width: 100% !important;
            margin-top: 24px !important;
        }

    .form-container .send-button{
        width:100% !important;
    }

    .form-container.change-password.login .form, .form-container.success-changed-password .info, .form-container #loginform-forgot-password {
        margin-top: 40px !important;
    }
}

.form-container {
    font-family: Roboto,sans-serif !important;
}

    .form-container label {
        margin-bottom: 0rem !important;
    }

    .form-container p {
        margin-bottom: 0rem !important;
    }

    .form-container input:focus {
        outline: none;
    }

    .form-container .logo img {
        width: 189px;
        /*height: 69px;*/
        margin-top: 30px;
    }


    .form-container .title {
        color: #1B1B19;
        font-size: 26px;
        font-style: normal;
        font-weight: 300;
        line-height: 3rem;
        font-family:"Roboto-Light";
    }

    .form-container .text {
        color: #1B1B19;
        font-size: 14px;
        font-style: normal;
        font-weight: 200;
        font-family: "Roboto-Light", sans-serif;
    }
    .form-container .text.registration-pending{
        line-height:17px;
    }
    .form-container .text.registration-pending strong{
        text-decoration:underline;
        font-family: "Roboto-Regular";
        font-weight: 400;
    }
    .input-container .otp-message {
        color: #737373;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 15px;
        margin-top: 26px;
    }

    .form-container .login-with-other {
        margin-top: 24px;
    }

        .form-container .login-with-other .facebook-button {
            cursor: pointer;
            line-height: normal;
            font-size: 13px;
            height: 50px;
            border-radius: 8px;
            background-color: transparent;
            width: 100%;
            background-color: #fff;
            color: #757575;
            border: 1px solid #D9D9D9;
            white-space: nowrap;
            overflow: hidden;
            position: relative;
        }

            .form-container .login-with-other .facebook-button .facebook-icon {
                padding: 13px !important;
                position: absolute;
            }

            .form-container .login-with-other .facebook-button .facebook-text {
                font-family:"Roboto-Regular", sans-serif;
                font-size: 13px;
                font-weight: 500;
                letter-spacing: .21px;
                vertical-align: top;
                line-height: 44px;
            }

    .form-container .other-text {
        color: #979494;
        font-size: 16px;
        font-style: normal;
        font-weight: 300;
        line-height: 15px;
    }

    .form-container .form {
        margin-top: 24px;
    }

        .form-container .form .activation-mail {
            float: right;
            color: #000;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 15px;
            text-decoration-line: underline;
        }

        .form-container .form .resend-activation-mail {
            color: #000;
            font-size: 13px;
            font-style: normal;
            font-family: "Roboto-Light";
            font-weight: 300;
            text-decoration-line: underline;
            float: right;
            display: none;
            position: relative;
            z-index: 9;
        }

        .form-container .form .resend-activation-mail:hover {
            color: #000;
        }

        .form-container .form .errorwrap {
            color: #ED1C24;
            font-size: 13px;
            font-style: normal;
            font-weight: 300;
            line-height: 23.5px;
            font-family: "Roboto-Regular",sans-serif;
            display: none;
            position: relative;
            bottom: 0px;
            margin-bottom:16px;
        }

        .form-container .form .successwrap {
            color: #4CAF50;
            font-size: 13px;
            font-style: normal;
            font-weight: 300;
            line-height: 23.5px;
            display: none;
            position: relative;
            bottom: 0px;
            margin-bottom: 16px;
        }

        .form-container .form .input-container {
            color: #1B1B19;
            font-size: 13px;
            font-style: normal;
            font-weight: 300;
            line-height: 15px;
            font-family:"Roboto-Light"
        }

            .form-container .form .input-container .input-span {
                color: #F23333;
                text-align: center;
                font-size: 12px;
                font-style: normal;
                font-weight: 300;
                line-height: 15px;
            }

            .form-container .form .input-container .login-input {
                margin-top: 4px;
                border-radius: 8px;
                border: 1px solid #D9D9D9;
                height: 50px;
                padding:0 16px !important;
            }

                .form-container .form .input-container .login-input::placeholder {
                    font-size: 13px;
                    font-family: "Roboto-Light";
                    line-height: 15px;
                }

                .form-container .form .input-container .login-input.input-validation-error {
                    border: 1px solid #ED1C24 !important;
                }

                    .form-container .form .input-container .login-input.input-validation-error::placeholder {
                        font-style: normal;
                        font-weight: 300;
                        line-height: 15px
                    }

                .form-container .form .password-container .psw-container{
                    position: relative;
                }

                .form-container .form .password-container .psw-container .icon-container {
                    position: absolute;
                    right: 19px;
                    top: 57%;
                    transform: translateY(-50%);
                    cursor: pointer;
                }

                    .form-container .form .password-container .psw-container .icon-container u{
                        font-size: 12px;
                        font-weight: 200;
                        line-height: 13px;
                        font-family: 'Roboto-Light';
                        margin-left: 4px;
                    }

                    .form-container .form .password-container .psw-container .icon-container .see-password-active{
                        display: none;
                    }

        .form-container .form .add-features {
            display: flex;
            justify-content: space-between;
        }

            .form-container .form .add-features .remember-me {
                font-size: 12px;
                display: flex;
                align-items: center;
            }

            .form-container .form .add-features .password-forget {
                color: #1B1B19;
                font-size: 13px;
                font-family: "Roboto-Regular";
                font-weight: 400;
                line-height: 125.188%;
                text-decoration-line: underline;
            }

        .form-container .form .signin-button {
            margin-top: 16px;
            border-radius: 8px;
            background: #ED1C24;
            height: 44px;
            flex-shrink: 0;
            color: #FFF;
            text-align: center;
            font-size: 16px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
            border: none;
            margin-bottom:8px;
        }

    .form-container .redirect-signup {
        margin-top: 105px;
        clear: both;
        display: block;
        font-size: 16px;
        font-style: normal;
        line-height: 15px;
        color: #737373;
        font-weight: 400;
    }

        .form-container .redirect-signup .signup {
            color: #1B1B19;
            font-weight: 600;
            text-decoration-line: underline
        }

.form-container.change-password.login .form, .form-container #loginform-forgot-password {
    margin-top: 64px;
}

.form-container.change-password.login .password-container {
    margin-bottom:16px;
}

.form-container.success-changed-password .info{
    margin-bottom:76px;
}

/*custom checkbox*/
.custom-checkbox input[type="checkbox"] {
    display: none;
}

.custom-checkbox label {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
}

    .custom-checkbox label:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 20px;
        height: 20px;
        background: url("../images/checkbox_line.svg") no-repeat center center;
    }

.custom-checkbox input[type="checkbox"]:checked + label:before {
    background: url("../images/checkbox.svg") no-repeat center center;
}

.custom-checkbox label span {
    position: relative;
    z-index: 1;
}
.carousel-item img {
    height: 100vh;
    object-fit: cover;
}
.same-phonenumber-error, .same-email-error {
    color: #ED1C24;
    margin-top: 5px;
    font-size: 14px;
}
.next-step-button img {
    position: relative;
    top: -2px;
    margin-left: 3px;
}
.is-electrician-content {
    display: table;
    width: 100%;
}
.is-electrician-content .is-electrician-area label{
   position:relative;
}
.is-electrician-content .is-electrician-area label .currentInfo{
    position: relative;
    top: -2px;
}
.is-electrician-content .is-electrician-area label .currentInfoBox span{
   color:#737373;
}
.login-opts .checkwrap div {
    margin-top: 20px;
    font-size: 10px;
}

.form-container.login,.form-container.sigup-container{
    margin-top:32px;
    padding:0 64px;
}

.form-container .top-content div {
    padding: 12px;
    border-radius: 24px;
    background: #F5F5F5;
}

    .form-container .top-content div > a > img {
        width: 16px;
    }

    .form-container .top-content img {
        width: 30px;
        margin: 0;
    }

.btn-dark-outline {
    font-size: 14px;
    font-family: 'Roboto-Medium';
    height: 50px;
    padding: 12px 24px;
    color: black;
    background: white;
    border: 1px solid #1B1B19;
}

.btn-dark {    
    font-size: 14px;
    font-family: 'Roboto-Medium';
    height: 50px;
    padding: 12px 24px;
    background: #1B1B19;
}

.form-container .login-or-register .login {
    border-radius: 8px 0px 0px 8px;
}

.form-container .login-or-register .register {
    border-radius: 0px 8px 8px 0px;
}

@media screen and (max-width:992px) {
    .form-container {
        margin-left: 0;
    }

        .form-container .logo {
            display: flex;
            justify-content: center;
            height: auto;
        }

        .form-container .logo img {
            margin-top: 24px;
        }

        .form-container .title {
            font-weight: 500;
        }

        .form-container .text {
            font-size: 14px;
            margin-top: 16px;
        }                

        .form-container .login-with-other button {
            font-size: 14px;
        }

        .form-container .login-with-other .google-button {
            margin-bottom: 10px;
        }


        .form-container .form {
            margin-top: 25px;
        }

        .form-container .form .successwrap, .form-container .form .errorwrap {
            text-align: left;
        }

        .form-container .form .input-container label {
            float: left;
            font-size: 14px;
        }
        .form-container .form .password-container{
            margin-top:25px;
        }
        .form-container .form .signin-button {
            margin-top: 29px;
            margin-bottom:28px;
        }

        .form-container .redirect-signup {
            margin-top: 0px;
            margin-bottom: 27px;
            font-size: 14px;
        }

        .form-container .form .resend-activation-mail {
           display:none;
        }
}

/*forgot-password*/
.form-container .forgoterror {
    color: #ED1C24;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: 16px;
    display: block;
    position: relative;
    bottom: 8px;
}

.form-container .forgot-input {
    margin-bottom: 20px !important;
    margin-top:48px;
}

.form-container .send-button {
    border-radius: 8px;
    background: #1B1B19;
    height: 50px;
    padding:14px;
    color: #FFF;
    font-family: "Roboto-Bold";
    font-size: 16px;
    width:27%;
}

.form-container .input-container .js-captcha-container {
    display: ruby;
}

    .form-container .input-container .js-captcha-container #CaptchaInputText {
        border-radius: 8px;
        border: 1px solid #DEDEDE;
        height: 50px;
        width: calc(100% - 28%);
        font-family: "Roboto-Light";
        font-weight: 300;
        margin-top:44px;
    }

    .form-container .input-container .field-validation-error {
        color: #ED1C24;
        font-size: 13px;
        font-style: normal;
        font-weight: 300;
        line-height: 23.5px;
        padding-top: 8px;
    }

    .form-container .input-container .js-captcha-container #CaptchaImage {
        height:76px;
        width:100%
    }

    .form-container .input-container .js-captcha-container a {
        text-decoration: underline;
        color: #1B1B19;
        font-size: 12px;
        font-style: normal;
        font-weight: 300;
        line-height: 21px;
        float: none;
        position: absolute;
        right: 0;
        margin-top:12px;
    }

        .form-container .input-container .js-captcha-container a:hover {
            text-decoration: none;
        }

.form-container .capctha-description-container {
    color: #979494;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 21px;
}

    .form-container .capctha-description-container span {
        color: #737373;
        font-size: 12px;
        font-style: normal;
        font-weight: 300;
        line-height: 21px;
        font-family:"Roboto-Light";
    }

.form-container .forgot-password {
    margin-bottom: 125px;
}

    .form-container .forgot-password .text {
        line-height: 21px;
    }

.form-container .redirect-login {
    border-radius: 8px;
    border: 1px solid #1B1B19;
    height: 50px;
    padding: 12px;
    align-items:center;
}

    .form-container .redirect-login img {
        margin-right: 8px;
    }

    .form-container .redirect-login .login {
        color: #3B3838 !important;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }

.CaptchaInputText-error {
    display: none;
    color: #F44 !important;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: 23.5px;
}

@media screen and (max-width:992px) {
    .form-container .redirect-login {
        display: inline-flex;
        margin-top: 10px;
        margin-bottom: 36px;
        justify-content: center;
    }

    .form-container.password-has-been-sent .redirect-login {
        margin-top: 32px;
    }

    .form-container .forgot-input {
        margin-bottom: 16px !important;
    }

    .form-container .forgot-input label {
        float:left;
        font-size:14px;
    }

    .form-container .forgoterror {
        float: left;
    }

    .form-container .capctha-description-container {
        float: left;
    }

    .form-container .forgot-password {
        margin-bottom: 17px;
    }
}


/*passwordhasbeensent*/
.form-container .mail-check-container img {
    max-width: 100%
}

.form-container .password-info {
    margin-top:16px;
    margin-bottom: 76px;
}

    .form-container .password-info .text {
        line-height: 19.5px
    }


/*change password*/
.form-container .info .remaining-time {
    color: #3B3B3B;
    font-style: normal;
    font-weight: 500;
    line-height: 23.5px;
    font-family:"Roboto-Medium"
}

.form-container .underline {
    display: none;
}

.form-container.change-password .send-button {
    border-radius: 8px;
    background: #1B1B19;
    height: 44px;
    float: right;
}

@media screen and (max-width:992px) {
    .form-container .underline {
        display: block;
        margin-top: 17px;
        border-bottom: 1px solid rgba(190, 190, 190, 0.22)
    }
}

/*registration*/
.form-container .registration-info .text {
    color: #979494;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 23.5px;
}

    .form-container .registration-info .text strong {
        color: #3B3B3B;
        font-weight: 500;
    }

.form-container .resend-activation {
    height: 50px;
    border-radius: 8px;
    border: 1px solid #1B1B19;
    background: #1B1B19;
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
}

.form-container .activation-container {
    margin: 76px 0;
}

@media screen and (max-width:992px) {
    .form-container .registration-info .text {
        font-size: 14px;
    }
}

.sigup-container .warning-message {
    display: none;
    color: #ED1C24;
    text-align: right;
    font-family: "Roboto-Light";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 15px;
    float:right;
    padding-right: 10px;
}

.form-container .input-container .js-captcha-container #CaptchaInputText.input-validation-error {
    border: 1px solid #ED1C24 !important;
}

    .form-container .input-container .js-captcha-container #CaptchaInputText.input-validation-error::placeholder {
        font-size: 15px;
        font-style: normal;
        font-weight: 300;
        line-height: 15px;
    }

 .select2-results__options::-webkit-scrollbar {
    width: 8px !important;
}

.select2-results__options::-webkit-scrollbar-thumb {
    background: #D9D9D9;
    border-radius: 18px;
    height: 18px !important;
}

.select2-results__options::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 18px;
    height: 18px !important;
}

/*.select2-container--default .select2-results > .select2-results__options {
    margin-right: 20px;
    margin-left: 20px;
    padding-right: 50px;
}*/

.select2-results__options {
    border-radius: 10px; 
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border-radius: 14px 14px 0px 0px;
    text-indent:20px;
}

.select2-container--open .select2-dropdown--below {
    border-radius: 14px;
}

.select2-results__option--selectable {
    cursor: pointer;
    border-bottom: 1px solid rgba(190, 190, 190, 0.30);
}

input.select2-search__field::placeholder{
    color:#BEBEBE
}

.custom-border-error {
    border:1px dashed #ED1C24;
}
@media (min-width:992px) and (max-width:1400px){
    .form-container.login, .form-container.endsigup-container {
        min-width: 100% !important;
        width: 100%;
        margin-left: 0;
    }
}
.js-password-btn {
    margin-top: 34px;
    border-radius: 14px;
    background: #ED1C24;
    height: 44px;
    flex-shrink: 0;
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    border: none;
    margin-bottom: 15px;
    height: 44px !important;
    width: 207px !important;
    font-family: 'Roboto-Medium'!important;
}
.endsigup-container .form-signup-info-area{
    line-height:inherit;
}
.endsigup-container p.text {
    margin-bottom:20px!important;
}
.endsigup-container .logo{
    display:block;
    width:100%;
}

#sessionTimer {
    font-size: 16px;
    font-style: normal;
    line-height: 15px;
    margin-top: 10px;
    font-family: 'Roboto-Medium';
    margin-bottom: 20px;
}
.phonenumber-container , .password-input{
    text-align: left;
}
.password-input label {
    text-transform: capitalize;
    font-weight: 300;
}
.js-password-btn.second {
    background: white !important;
    color: #ED1C24 !important;
    text-decoration: underline !important;
}

.password-button-area{
    width:100%;
    display:none;
    max-width:392px;
}
.password-button-area .js-submit-btn {
    display: block;
    border-radius: 14px;
    background: #ED1C24;
    height: 44px;
    flex-shrink: 0;
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    border: none;
    float:left;
    font-weight:300;
    margin:0;
    font-family: 'Roboto-Medium' !important;
    font-weight: 300;
    border-radius: 14px !important;
    letter-spacing: .01em;
    float:right;
    width:200px;
}
.password-button-area .js-back-button{
    width: 177px;
    font-family: 'Roboto-Medium';
    font-weight:300;
    display: block;
    font-size: 14px;
    text-align: center;
    float:left;
    border-radius: 14px !important;
    border: 1px solid #1B1B19;
    color: #1B1B19;
    padding: 10px;
    margin-right:15px;
}
.password-button-area .js-back-button img{
    position: relative;
    left: 50px;
    float: left;
    top: 5px;
}
.password-button-area.active {
    display: table;
}
.input-group.password-input{
    display:none;
}
@media (max-width:992px) {
    .password-button-area .js-submit-btn {
        width: 100%!important;
        margin-bottom: 10px;
    }

    .js-password-btn {
        width: 100%!important;
    }
    .password-button-area .js-back-button {
        width: 100% !important;
        margin-right: 0;
    }
    .password-button-area {
        max-width: 100%;
    }
    .endsigup-container .logo img{
        margin:0 auto;
        margin-top:24px;
    }
}

@media (max-width:576px) {
    .form-container.login, .form-container.sigup-container {
        margin-top: 16px;
    }
    .form-container .password-info {
        margin-top: 8px;
        margin-bottom: 40px;
    }
    .form-container .activation-container {
        margin: 24px 0px 40px 0;
    }
    .form-container .resend-activation {
        margin-bottom: 12px
    }
    .modal.preSignUp .title {
        font-size:16px !important;
    }
    .modal.preSignUp .modal-content{
        padding:16px 0 !important;
    }
    .custom-close-popup{
        padding:16px;
    }
    .select2-container{
        width:100% !important;
    }
}

.form-container .login-with-other .custom-google-btn {
    height: 50px !important;
    width: 100% !important;
    border-radius: 8px;
    background-color: #fff;
    color: #757575;
    width: 100%;
    background-color: #fff;
    color: #757575;
    white-space: nowrap;
    overflow: hidden;
    font-family: "Roboto-Regular", sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .21px;
    vertical-align: top;
    border: 1px solid #D9D9D9;
    line-height: 44px;
}

    .form-container .login-with-other .custom-google-btn .google-text {
        color: #1B1B19;
        font-family: "Roboto-Medium";
        font-size: 14px;
        margin-left:8px;
    }

.g_id_signin {
    display: none;
}
.wattp-main-content .currentInfo .currentInfoBox{
    top:auto;
}
#popup_TaxOffice {
    margin-top: 14px !important;
    border-radius: 14px !important;
    border: 1px solid #BEBEBE;
    height: 58px;
    font-family: "Roboto-Light";
    font-weight: 300;
}
.current-inquiry-error {
    display: table;
    background-color: #ff4546;
    padding: 10px 20px;
    color: #fff;
    font-size: 15px;
    border-radius: 4px;
    margin: 20px 0;
}

.current-inquiry-success {
    display: table;
    background-color: #4FA026;
    padding: 10px 20px;
    color: #fff;
    font-size: 15px;
    border-radius: 4px;
    margin: 20px 0;
}

/*Order Details*/
.customer-order-details .siparis-takip{
    background:none;
}
.customer-order-details .updateBtn {
    padding: 10px;
    width: 65% !important;
}
.customer-order-details .siparis-ozet h3 {
    border-bottom: 1px solid #e1e1e1 !important;
    font-size: 16px;
    padding-bottom: 10px !important;
}
.customer-order-details .siparis-ozet p {
    font-size: 14px;
}
.customer-order-details .invoiceUploadBtn {
    margin-top: 25px;
    font-size: 24px;
    font-weight: 700;
}
.customer-order-details .invoiceViewBtn {
    margin-top: 20px;
}
.customer-order-details .returnForm tbody {
    font-size: 14px;
}
.customer-order-details .returnForm .order-items {
    height: 180px;
    border: 1px solid #e1e1e1;
}
    .customer-order-details .returnForm .order-items .siparisdetaytable .table-title {
        height: 45px;
    }
.customer-order-details .btn.print {
    width: auto;
    padding-left: 10px;
    padding-right: 10px;
    padding: 0 !important;
    margin-bottom: 5px;
}
.customer-order-details .btn.cargo-btn {
    padding: 0 !important;
    margin-bottom: 5px;
    width: auto
}
.customer-order-details .returnForm .p-code {
    padding: 0 5%
}
.customer-order-details .returnForm .order-extra-info {
    margin-left: +10%
}
.customer-order-details .siparisdetaySumtable .order-summary-title {
    font-size: 16px;
    padding: 15px;
}
.customer-order-details .siparisdetayfiyatdiv .promotion {
    color: red;
    justify-content: center;
    margin-left: +4%
}
.customer-order-details .continue-shopping-buttons .continue-shopping img {
    top: 4px;
}
.customer-order-details .continue-shopping-buttons input {
    padding: 17px 33px;
}
.customer-order-details .new-order-status-code {
    width: 65% !important;
}
#empty-status .address-contentwrap, #update-status .address-contentwrap {
    text-align: center
}
    #empty-status .address-contentwrap span, #update-status .address-contentwrap span {
        font-size: 14px
    }
.customer-order-details .siparis-ozet.tmz .kolon3 .selectboxit-container.selectbox {
    width: 65% !important;
}
.customer-order-details input[type=radio] + label:before, .customer-order-details input[type=radio] + input[type=hidden] + label:before {
    margin-top: -15px !important
}
@media (min-width:769px) {
    .customer-order-details .others.clearfix ul.info {
        width: 22% !important;
    }
}
@media (max-width:768px) {
    .customer-order-details .others.clearfix ul {
        width: 100% !important;
    }
        .customer-order-details .others.clearfix ul li {
            padding: 0;
        }
}
.customer-order-details table td {
    padding: 0px;
}
.customer-order-details tr:nth-child(2n+3) {
    background: rgba(225,225,225,0.3)
}
.customer-order-details table tr td:first-child {
    border-left: 1px solid #e1e1e1;
}
.customer-order-details table tr td:last-child {
    border-right: 1px solid #e1e1e1;
}
.customer-order-details .modalcontent {
    min-height: 300px !important;
}
#popup_TaxOffice {
    margin-top: 8px !important;
    border-radius: 8px !important;
    border: 1px solid #D9D9D9;
    height: 50px;
    font-family: "Roboto-Light";
    font-weight: 300;
}
.current-inquiry-error {
    display: table;
    background-color: #ff4546;
    padding: 10px 20px;
    color: #fff;
    font-size: 15px;
    border-radius: 4px;
    margin: 20px 0;
}

.current-inquiry-success {
    display: table;
    background-color: #4FA026;
    padding: 10px 20px;
    color: #fff;
    font-size: 15px;
    border-radius: 4px;
    margin: 20px 0;
}

/*Order Details*/
.customer-order-details .siparis-takip{
    background:none;
}
.customer-order-details .updateBtn {
    padding: 10px;
    width: 65% !important;
}
.customer-order-details .siparis-ozet h3 {
    border-bottom: 1px solid #e1e1e1 !important;
    font-size: 16px;
    padding-bottom: 10px !important;
}
.customer-order-details .siparis-ozet p {
    font-size: 14px;
}
.customer-order-details .invoiceUploadBtn {
    margin-top: 25px;
    font-size: 24px;
    font-weight: 700;
}
.customer-order-details .invoiceViewBtn {
    margin-top: 20px;
}
.customer-order-details .returnForm tbody {
    font-size: 14px;
}
.customer-order-details .returnForm .order-items {
    height: 180px;
    border: 1px solid #e1e1e1;
}
    .customer-order-details .returnForm .order-items .siparisdetaytable .table-title {
        height: 45px;
    }
.customer-order-details .btn.print {
    width: auto;
    padding-left: 10px;
    padding-right: 10px;
    padding: 0 !important;
    margin-bottom: 5px;
}
.customer-order-details .btn.cargo-btn {
    padding: 0 !important;
    margin-bottom: 5px;
    width: auto
}
.customer-order-details .returnForm .p-code {
    padding: 0 5%
}
.customer-order-details .returnForm .order-extra-info {
    margin-left: +10%
}
.customer-order-details .siparisdetaySumtable .order-summary-title {
    font-size: 16px;
    padding: 15px;
}
.customer-order-details .siparisdetayfiyatdiv .promotion {
    color: red;
    justify-content: center;
    margin-left: +4%
}
.customer-order-details .continue-shopping-buttons .continue-shopping img {
    top: 4px;
}
.customer-order-details .continue-shopping-buttons input {
    padding: 17px 33px;
}
.customer-order-details .new-order-status-code {
    width: 65% !important;
}
#empty-status .address-contentwrap, #update-status .address-contentwrap {
    text-align: center
}
    #empty-status .address-contentwrap span, #update-status .address-contentwrap span {
        font-size: 14px
    }
.customer-order-details .siparis-ozet.tmz .kolon3 .selectboxit-container.selectbox {
    width: 65% !important;
}
.customer-order-details input[type=radio] + label:before, .customer-order-details input[type=radio] + input[type=hidden] + label:before {
    margin-top: -15px !important
}
@media (min-width:769px) {
    .customer-order-details .others.clearfix ul.info {
        width: 22% !important;
    }
}
@media (max-width:768px) {
    .customer-order-details .others.clearfix ul {
        width: 100% !important;
    }
        .customer-order-details .others.clearfix ul li {
            padding: 0;
        }
}
.customer-order-details table td {
    padding: 0px;
}
.customer-order-details tr:nth-child(2n+3) {
    background: rgba(225,225,225,0.3)
}
.customer-order-details table tr td:first-child {
    border-left: 1px solid #e1e1e1;
}
.customer-order-details table tr td:last-child {
    border-right: 1px solid #e1e1e1;
}
.customer-order-details .modalcontent {
    min-height: 300px !important;
}

span.field-validation-error span {
    color: #F44 !important;
}

.modal.preSignUp  .modal-content{
    padding:24px !important;
}

.modal.preSignUp .modal-element{
    border-radius: 8px !important;
}

.modal.preSignUp .vkn {
    border: 1px solid #D9D9D9;
    border-radius: 8px;
    height: 50px;
    margin-top: 8px;
}

.modal.preSignUp .input-container .label {
    color: #1B1B19;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: 15px;
    font-family: "Roboto-Light";
}

.modal.preSignUp .title {
    color: #1B1B19;
    font-family: "Roboto-Medium";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 125.188%;
    margin-bottom:12px;
}

.modal.preSignUp .content img {
    height: 147px;
    width: 100%;
    object-fit: cover;
}

.modal.preSignUp .desc {
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 13px;
    font-style: normal;
    font-weight: 200;
}

.select2-selection[aria-expanded="true"] {
    border: 1px solid #1B1B19 !important;
    box-shadow:none !important;
}

.select2-results__options::-webkit-scrollbar {
    width: 10px;
}

.select2-results__options::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
    margin: 5px; 
}

.select2-results__options::-webkit-scrollbar-thumb {
    background: #b0b0b0;
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: content-box;
}
.sigup-container .input-container{
    margin-bottom:2rem;
}

.next-step-button,
.next-step-button:hover {
    width: 100%;
    background: white;
    color: #1B1B19;
    border-radius: 8px;
    border: 1px solid #1B1B19;
    color: #1B1B19;
    font-family: "Roboto-Regular" !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    height:50px;
}
.next-step-button svg{
    margin-left:8px;
}
.next-step-button svg path{
    fill:black;
}
.input-container.is-electrician-area {
    width: 100%;
}
.is-electrician-area input{
    accent-color: #ED1C24;
    -webkit-appearance: auto;
    opacity: 1;
    width: 20px;
    height: 20px;
    position: revert;
}
.is-electrician-area .radio-buttons{
    margin-top:20px;
}
.is-electrician-area .radio-buttons .radio-button-area{
    display:flex;
    align-items:center;
}
.is-electrician-area .radio-buttons .radio-button-area input{
    margin-right:8px;
}
.buttons-area .js-submit-btn {
    float: none;
    width: 100%;
    color: #FFF;
    font-family: "Roboto-Bold" !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    height:50px;
    border-radius:8px;
    margin:0;
    margin-top:24px;
}
.custom-agreement-checkbox-error{
    color: #F44;    
    display:table;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    font-family: "Roboto-Light";
    line-height: 23.5px;
}
.sigup-container.form-container .form .password-container{
    margin-top:0!important;
}

.login-opts .currentInfoBox{
    right:0!important;
    top: 20px!important;
}
.login-opts .currentInfoBox::after{
    left: 95%!important;
}
.login-opts .currentInfoBox span {
    color: #737373;
}
.sigup-container .buttons-area{
    padding:0 16px;
}
.sigup-container .login-opts {
    padding: 0 10px;
}
@media (max-width:767px) {
    .form-container.sigup-container {
        padding: 0 32px;
    }
    .form-container .col-d-100.col-m-100{
        padding:0 16px;
    }
    .form-container .form .input-container label{
        font-size:13px;
    }
    .form-container .title{
        font-size:24px;
    }
    .modal#agreementchart .modal-innerwrap, .modal#bayiaydinlatmasizechart .modal-innerwrap, .modal#wattpuanagreementchart .modal-innerwrap {
        margin: 16px 16px 0 16px !important;
    }
    .modal .modal-element .modal-close {
        top: 28px !important;
        right: 20px !important;
    }

    .modal-content .wrapper {
        max-width: 100% !important;
        width: 100% !important;
        font-size: 13px !important;
        font-family: 'Roboto-Light';
    }

    .modal.preSignUp .modal-innerwrap {
        margin: 16px 16px 0 16px !important;
    }

    .modal-content .main-title {
        font-size: 24px !important;
        font-family: "Roboto-Medium" !important;
    }

    .modal-content .sub-title {
        font-size: 13px !important;
        font-family: "Roboto-Medium" !important;
    }

}

.modal#agreementchart .modal-element, .modal#bayiaydinlatmasizechart .modal-element, .modal#wattpuanagreementchart .modal-element {
    height: 500px !important;
    border-radius: 8px;
}

.modal#agreementchart .modal-content, .modal#bayiaydinlatmasizechart .modal-content, .modal#wattpuanagreementchart .modal-content {
    padding: 3px 8px 0 0 !important
}

.modal .modal-element .modal-close{
    background-color:none !important;
}

.modal .modal-element .modal-close .icon-close:before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-image: url('../images/x-lg.svg');
    background-size: contain;
    background-repeat: no-repeat;
}

.modal#agreementchart .modal-innerwrap, .modal#bayiaydinlatmasizechart .modal-innerwrap, .modal#wattpuanagreementchart .modal-innerwrap {
    margin: 24px 22px 0 24px;
}

    .modal#agreementchart .modal-innerwrap::-webkit-scrollbar, .modal#bayiaydinlatmasizechart .modal-innerwrap::-webkit-scrollbar, .modal#wattpuanagreementchart .modal-innerwrap::-webkit-scrollbar {
        width: 8px;
    }

    .modal#agreementchart .modal-innerwrap::-webkit-scrollbar-track, .modal#bayiaydinlatmasizechart .modal-innerwrap::-webkit-scrollbar-track, .modal#wattpuanagreementchart .modal-innerwrap::-webkit-scrollbar-track {
        background: white;
    }

    .modal#agreementchart .modal-innerwrap::-webkit-scrollbar-thumb, .modal#bayiaydinlatmasizechart .modal-innerwrap::-webkit-scrollbar-thumb, .modal#wattpuanagreementchart .modal-innerwrap::-webkit-scrollbar-thumb {
        background: #F5F5F5;
        border-radius: 32px;
        height: 67px
    }

.form-container .form .errorwrap {
    color: #F44;
    font-family: "Roboto-Light";
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 17px;
    letter-spacing: normal;
}

.form-container .arrow-left{
    height:16px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: solid #1B1B19 !important;
    border-width: 0 1px 1px 0 !important;
    display: inline-block !important;
    padding: 3px !important;
    transform: rotate(45deg) !important;
}

.modal-blur {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 90px;
    backdrop-filter: blur(1px);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) -99.07%, rgba(255, 255, 255, 0.60) 44.19%, #FFF 81.82%);
    pointer-events: none;
}

.modal#agreementchart .modal-innerwrap p.main-title {
    font-size: 24px !important;
    font-family: "Roboto-Medium" !important;
}

.modal#agreementchart .modal-innerwrap p.sub-title {
    font-size: 13px !important;
    font-family: "Roboto-Medium" !important;
}

.modal#agreementchart .modal-innerwrap p, .modal#bayiaydinlatmasizechart .modal-innerwrap p, .modal#wattpuanagreementchart .modal-innerwrap p {
    font-size: 13px !important;
    font-family: "Roboto-Light";
}
.is-electrician-error{
    position:absolute;
    color: #F44;
    display: table;
    width:100%;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    font-family: "Roboto-Light";
    line-height: 23.5px;
}
@media(max-width:992px){
    .is-electrician-error{
        top:13px;
    }
    .is-electrician-area .radio-buttons {
        margin-top: 40px;
    }
}
@media(max-width:767px){
    .is-electrician-error{
        top:13px;
    }
    .is-electrician-area .radio-buttons {
        margin-top: 40px;
    }
    .currentInfoBox::after {
        left: 95% !important;
    }
    .is-electrician-area .currentInfoBox {
        right: -8px !important;
        top: 20px !important;
    }
}
.custom-district-error {
    color: #F44;
    display: table;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    font-family: "Roboto-Light";
    line-height: 23.5px;
}
span[aria-labelledby="select2-Main_DistrictID-container"] {
    pointer-events: none;
}
.custom-login-mailorphone-error {
    color: #F44 !important;
}

.custom-login-password-error {
    color: #F44 !important;
}
@media(min-width:1155px){
    .for-desctop-currentInfo{
        position: relative;
        float: left;
        margin-left: 10px;
    }
    .custom-checkbox label.contact-agreement-checkbox{
        width:auto;
    }
    .login-opts .currentInfoBox{
        right: -8px !important;
    }
}
@media(min-width:500px) and (max-width:992px){
    .for-desctop-currentInfo {
        position: relative;
        float: left;
        margin-left: 10px;
    }

    .custom-checkbox label.contact-agreement-checkbox {
        width: auto;
    }

    .login-opts .currentInfoBox {
        right: -8px !important;
    }
}

/*Quick Login*/
.quick-login-btn {
    border-radius: 8px;
    border: 1px solid #1B1B19;
    height: 44px;
    margin-bottom: 24px;
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 14px;
}
.verify-container .otp-input-wrapper{
    gap:12px;
}
.verify-container .otp-input {
    flex: 1;
    min-width: 0;
    max-width: 100%;
    height: 50px;
    font-size: 24px;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 8px;
    transition: all 0.2s ease-in-out;
}
.verify-container .otp-input:focus {
    border: 1px solid #ED1C24;
    outline: none;
}
.verify-container .otp-sms-login .verify-btn {
    background: rgba(237, 28, 36, 0.20) !important;
}
.verify-container .verify-btn.selected {
    background: #ED1C24 !important;
}
.verify-container .verify-code {
    color: #1B1B19;
    font-family: "Roboto-Bold";
    font-size: 20px;
}
.verify-container .customer-phone {
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 14px;
}
.verify-container .duration {
    color: #ED1C24;
    text-align: right;
    font-family: "Roboto-Bold";
    font-size: 14px;
}
.verify-container .resend-code {
    border-radius: 8px;
    border: 1px solid #1B1B19;
    height: 50px;
    padding: 16px;
}
.verify-container .warning-message {
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 14px;
}
.verify-container .error-message {
    border-radius: 8px;
    background: #FFF5F5;
    color: #E30D18;
    font-family: "Roboto-Light";
    font-size: 13px;
    padding: 8px 8px 8px 12px;
}

/* Favorilerim */
.customer-content {
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    padding: 16px;
}
.customer-content .page-title {
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 16px;
}
.customer-content .page-desc {
    font-family: "Roboto-Light";
    font-size: 14px;
}
.custom-btn-red {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height:40px;
    margin: 16px 0 24px 0;
    padding: 4px 16px;
    border-radius: 8px;
    background: #ED1C24;
    color: #FFF;
    font-family: "Roboto-Medium";
    font-size: 13px;
}
#favorites-page .delete-selected-products img, #favorites-page .add-all-to-cart img {
    margin-right: 8px;
}
#favorites-page .checkwrap input {
    position:absolute;
}
#favorites-page .add-all-to-cart {
    color: #ED1C24;
    font-family: "Roboto-Regular";
    font-size: 14px;
    padding:0px 15px;
}
#favorites-page .delete-selected-products {
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 14px;
}
#favorites-page .favorite-product {
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    padding: 8px 16px;
    margin: 12px 0;
}
#favorites-page .favorite-product .product-code {
    color: #979797;
    font-family: "Roboto-Light";
    font-size: 13px;
}
#favorites-page .remove-favorite-item {
    color: #979797;
    font-family: "Roboto-Light";
    font-size: 14px;
}
#favorites-page .basket-btn {
    color: #ED1C24;
    font-family: "Roboto-Medium";
    font-size: 14px;
}
#favorites-page .product-info {
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 14px;
}
#favorites-page .old-price {
    color: #979797;
    font-size: 12px;
    font-family: "Roboto-Light";
    text-decoration: line-through;
}
#favorites-page .discount-price {
    color: #1B1B19;
    font-size: 14px;
    font-family: "Roboto-Medium";
}
#favorites-page .vatrateplus{
    display:none;
}
#favorites-page .numberbox.sided .numberbox-button.number-decrease, #favorites-page .numberbox.sided .numberbox-button.number-increase {
    border-bottom: none;
}
#favorites-page .numberbox.sided .numberbox-button.number-decrease img, #favorites-page .numberbox.sided .numberbox-button.number-increase img {
    margin:0;
}
#favorites-page .numberbox.sided .numberbox-button {
    width: 4rem;
    border-radius:4px;
}
#favorites-page .checkwrap input:checked + label:before {
    background: url(../images/check-square-fill.svg) no-repeat center center;
    border: 1px solid #fff;
}
#favorites-page .checkwrap label:before {
    width: 20px;
    height: 20px;
    border-radius: 4px;
}
#favorites-page .checkwrap {
    width: auto;
    margin-top: 0;
}
#favorites-page .numberbox input {
    width: 11rem !important;
}
#favorites-page .top-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#favorites-page .category-item {
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    padding: 8px;
    color: #979797;
    font-family: "Roboto-Light";
    font-size: 13px;
    width:max-content;
}
#favorites-page .category-item.active {
    border: 1px solid #1B1B19;
    color: #1B1B19;
}
#favorites-page .filter-category-area {
    overflow-x: auto;
}
#favorites-page .filter-category-area  ul{
   gap: 8px;
}
#favorites-page .filter-category-area::-webkit-scrollbar {
    height: 4px;
    cursor:pointer;
}
#favorites-page .filter-category-area::-webkit-scrollbar-thumb {
    background-color: #D9D9D9;
}
#favorites-page .filter-category-area::-webkit-scrollbar-track {
    background: #f1f1f1;
}
@media (max-width:1199px) {
    .customer-content {
        border: none;
        padding: 0;
        margin-top: 0px !important;
    }
    .customer-content .title {
        display: none;
    }
}
@media (max-width: 992px) {
    #favorites-page .favorite-product {
        flex-direction: column;
    }
    #favorites-page .favorite-product {
        padding: 12px;
    }
    #favorites-page .action-buttons {
        justify-content: space-between;
    }
    #favorites-page .product-info {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: max-content;
    }
    #favorites-page .top-content {
        display: inline;
    }
    #favorites-page .add-all-to-cart {
        padding: 0px;
    }
}
/* Favorilerim */


/*Pagination Start*/
.page-item {
    border-radius: 8px;
    background: #FFF;
}
.page-item.disabled a.page-link {
    fill: #979797;
}
.page-item.active .page-link {
    color: #1B1B19;
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    background: #F5F5F5;
}
.page-link {
    color: #1B1B19;
    font-family: "Roboto-Medium";
    font-size: 13px;
    background: #FFF;
    border-radius: 8px;
    margin-right:8px;
}
.page-item:first-child .page-link, .page-item:last-child .page-link{
    border-radius:8px;
}
.page-item:first-child .page-link{
    margin-right:16px;
}
.page-item:last-child .page-link {
    margin-left:6px;
}
/*Pagination End*/

/*Çoklanan css start*/
.customer-content {
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    padding: 16px;
}
.customer-content label {
    font-family: "Roboto-Light";
    font-size: 13px;
    margin-bottom: 4px !important;
}
.customer-content input {
    height: 50px;
    padding: 0px 16px;
    border-radius: 8px;
    position:relative;
}
.customer-content .title {
    margin-bottom: 16px;
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 18px;
}
.customer-content .update-btn {
    height: 44px;
    letter-spacing: 0;
    background: #ED1C24;
    color: #FFF;
    border-radius: 8px;
    font-size: 16px !important;
}
@media (max-width:1199px) {
    .customer-content {
        border: none;
        padding: 0;
        margin-top: 0px !important;
    }
    .customer-content .title {
        display: none;
    }
    .customer-content .form-container {
        display: grid;
        align-items: center;
        gap: 16px;
    }
}
/*Çoklanan css end*/

/*Customer Role Start*/
.customer-list .view-role {
    border-radius: 8px;
    border: 1px solid #1B1B19;
    display: flex;
    height: 44px;
    padding: 8px 24px;
    justify-content: center;
    align-items: center;
    gap: 4px;
}
.customer-list  .view-role:hover {
    background: #ED1C24;
    color: #fff;
    border: 1px solid #ED1C24;
    font-family: "Roboto-Bold";
}
.customer-list .customer-header {
    padding: 8px 0;
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 14px !important;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
     border-bottom: 1px solid #1B1B19 !important
}
.customer-list .role-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 2fr 1.5fr;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid rgba(217, 217, 217, 0.85);
    padding: 24px 0 24px 24px;
}
.customer-list {
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 14px;
}
.customer-list .name, .customer-list .surname {
    font-family: "Roboto-Regular";
}
.customer-list .role-row .fullname{
    display:none; 
}
.role-check{
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle; 
    border-radius: 4px;              
    background: #fff;
    cursor: pointer;
    position: relative;
    transition: border-color .15s, box-shadow .15s, background-color .15s;
    border: 1px solid #1B1B19;
}
.role-check:checked{
    background: url("../images/checkbox.svg") no-repeat center center;
    border:none;
}
.role-list{
    padding:16px 0;
}
.update-role {
    color: #ED1C24;
    font-family: "Roboto-Medium";
    font-size: 16px;
    margin:auto;
}
.modal.customerRole .modal-element {
    width: 515px;
}
.modal.customerRole .modal-element .modal-innerwrap {
    padding: 24px !important;
}
.modal.customerRole .modal-element .modal-content {
    padding: 0px !important;
}
.modal.customerRole .modal-close{
    display:none;
}
.customerRole .modal-header {
    margin-bottom:24px;
}
.customerRole .modal-title {
    color: #1B1B19;
    font-family: "Roboto-Medium";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 125.188%;
}
.customerRole .desc {
    color: #756B66;
    line-height: 122%;
    font-family: "Roboto-Light";
    font-size:14px;
}
.customerRole .success-message {
    border-radius: 8px;
    background: #F3FFF5;
    padding: 8px 8px 8px 12px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: "Roboto-Light";
}
.role-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 0;
    color: #1B1B19;
    font-family: "Roboto-Light";
    font-size: 13px;
    line-height: 99%;
}
.role-name {
    margin: 0;
    font-weight: 500;
    color: #1b1b19;
}
.toggle-switch {
    -webkit-appearance: none;
    appearance: none;
    width: 56px;
    height: 29px;
    background: #E7E7E7;
    border-radius: 999px;
    position: relative;
    outline: none;
    cursor: pointer;
    transition: background-color .2s ease;
    border: none;
}
.toggle-switch::after {
    content: "";
    position: absolute;
    top: 1px;
    left: 2px;
    width: 28px;
    height: 27px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    transition: transform .2s ease;
}
.toggle-switch:checked {
    background: #ED1C24;
}
.toggle-switch:checked::after {
    transform: translateX(20px);
}
@media(max-width:1200px) {
    .customer-header {
        display: none !important;
    }
    .customer-list .role-grid {
        border-radius: 8px;
        border: 1px solid rgba(217, 217, 217, 0.85);
        background: #FFF;
        box-shadow: 0 1px 21.1px 0 rgba(105, 69, 69, 0.16);
        padding: 12px;
    }
    customer-list .customer-header {
        display: none;
    }
    .customer-list .role-row .name,
    .customer-list .role-row .surname {
        display: none;
    }
}
@media (min-width:768px) and (max-width:1200px){
    .customer-list .role-row.role-grid {
        display: grid;
        grid-template-columns:auto;
        grid-template-areas:
            "id fullname"
            "email email"
            "action action";
        column-gap: 16px;
        row-gap: 8px;
        padding: 16px 12px;
        margin-bottom: 16px;
        border: 1px solid rgba(217,217,217,.85);
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 1px 21.1px rgba(105,69,69,.16);
        align-items: center;
        justify-content: space-between;
    }
    .customer-list .role-row .id{ 
        grid-area:id; 
    }
    .customer-list .role-row .fullname {
        grid-area: fullname;
        font-weight: 500;
        display: block;
        border-radius: 8px;
        background: rgba(245, 245, 245, 0.96);
        padding: 8px 12px;
    }
    .customer-list .role-row .fullname::before{
        content:"İsim / Soyisim: ";
        font-weight:700;
        margin-right:8px;
        color:#1B1B19;
        white-space:nowrap;
    }
    .customer-list .role-row .email{ 
        grid-area:email; 
    }
    .customer-list .role-row .email::before{
        content:"E-Mail: ";
        font-weight:700;
        margin-right:8px;
        color:#1B1B19;
        white-space:nowrap;
    }
    .customer-list .role-row .view-role-area{ 
        grid-area:action;
    }
}
@media(max-width:768px){
    .modal.customerRole .modal-body {
        max-height: 350px;
        overflow-y: auto;
    }
    .modal.customerRole .modal-element .modal-innerwrap{
        padding:16px !important;
    }
        .customer-list .role-row.role-grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
        "id"
        "fullname"
        "email"
        "action";
        row-gap: 8px;
        column-gap: 10px;
        padding: 16px 12px;
        margin-bottom: 16px;
        border: 1px solid rgba(217,217,217,.85);
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 1px 21.1px rgba(105,69,69,.16);
    }
    .customer-list .role-row .id {
        grid-area: id;
        align-self: start;
    }
    .customer-list .role-row .name,
    .customer-list .role-row .surname {
        display: none;
    }
    .customer-list .role-row .fullname {
        grid-area: fullname;
        display: block;
        border-radius: 8px;
        background: rgba(245, 245, 245, 0.96);
        padding:8px 12px;
    }
    .customer-list .role-row .email {
        grid-area: email;           
    }
    .customer-list .role-row .view-role-area {
        grid-area: action;
    }
    .customer-list .role-row .fullname::before {
        content: "İsim / Soyisim: ";
        font-weight: 700;
        margin-right: 8px;
        color: #1B1B19;
    }
    .customer-list .role-row .surname::before {
        content: "";
    }
    .customer-list .role-row .surname {
        margin-left: 4px;
    }
    .customer-list .role-row .email::before {
        content: "E‑Mail: ";
        font-weight: bold;
        margin-right: 8px;
        color: #1B1B19;
    }
}
/*Customer Role End*/

/*Customer Invite Start*/
.customer-invite .form-container {
    margin: 16px 0px;
}
#inviteModal .modal-header {
    border: none;
}
#inviteModal .modal-body{
    border: none;
    color: #1B1B19;
    line-height: 157%;
}
#inviteModal .title {
    font-family: "Roboto-Bold";
    font-size: 18px;
}
#inviteModal .desc {
    font-family: "Roboto-Light";
    font-size: 14px;
}
#inviteModal .modal-confirm-btn {
    color: #ED1C24;
    font-family: "Roboto-Medium";
    font-size: 16px;
}
.customer-content .label span {
    color: #f23333;
}
/*Customer Invite End*/

/*Customer Role-Invite start*/
.invitation-role {
    border-radius: 8px;
    border: 1px solid #D9D9D9;
    background: rgba(245, 245, 245, 0.96);
    gap: 4px;
    padding: 8px;
    margin:8px 0;
}
.invitation-role .tab-item {
    flex: 1;
}
.invitation-role .tab-item a {
    width: 100%;
    border-radius: 4px;
    text-decoration: none;
    color: #1B1B19;
    font-family: "Roboto-Regular";
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
}
.invitation-role .tab-item img {
    margin-right: 8px;
}
.invitation-role .tab-item.active a {
    background: #FFF;
    border-radius: 4px;
    padding: 4px 8px;
}
@media(min-width:1200px) {
    .invitation-role {
        display: none !important
    }
}
/*Customer Role-Invite end*/