@charset "UTF-8";

@font-face {
    font-family: "font-electro";
    src: url("https://transvelo.github.io/electro-html/2.0/assets/fonts/font-electro.eot");
    src: url("https://transvelo.github.io/electro-html/2.0/assets/fonts/font-electro.eot?#iefix")
            format("embedded-opentype"),
        url("https://transvelo.github.io/electro-html/2.0/assets/fonts/font-electro.woff")
            format("woff"),
        url("https://transvelo.github.io/electro-html/2.0/assets/fonts/font-electro.ttf")
            format("truetype"),
        url("https://transvelo.github.io/electro-html/2.0/assets/fonts/font-electro.svg#font-electro")
            format("svg");
    font-weight: normal;
    font-style: normal;
}

[data-icon]:before {
    font-family: "font-electro" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
    font-family: "font-electro" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ec {
    display: inline-block;
    font: normal normal normal 14px/1 font-electro;
    font-size: inherit;
    text-rendering: auto;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ec-menu:before {
    content: "\61";
}
.ec-list-view-medium:before {
    content: "\62";
}
.ec-transport:before {
    content: "\63";
}
.ec-add-to-cart:before {
    content: "\64";
}
.ec-arrow-right-categproes:before {
    content: "\65";
}
.ec-comment:before {
    content: "\66";
}
.ec-compare:before {
    content: "\67";
}
.ec-customers:before {
    content: "\68";
}
.ec-dollar:before {
    content: "\69";
}
.ec-favorites:before {
    content: "\6a";
}
.ec-grid-view:before {
    content: "\6b";
}
.ec-list-view:before {
    content: "\6c";
}
.ec-blog-likes:before {
    content: "\6d";
}
.ec-phone:before {
    content: "\6e";
}
.ec-returning:before {
    content: "\6f";
}
.ec-search:before {
    content: "\70";
}
.ec-shopping-bag:before {
    content: "\71";
}
.ec-support:before {
    content: "\72";
}
.ec-tag:before {
    content: "\73";
}
.ec-thing-arrow-right:before {
    content: "\74";
}
.ec-user:before {
    content: "\75";
}
.ec-category-icon:before {
    content: "\76";
}
.ec-mail:before {
    content: "\77";
}
.ec-map-pointer:before {
    content: "\78";
}
.ec-newsletter:before {
    content: "\79";
}
.ec-close-remove:before {
    content: "\7a";
}
.ec-payment:before {
    content: "\41";
}
.ec-arrow-down-search:before {
    content: "\42";
}
.ec-list-view-small:before {
    content: "\43";
}
.ec-cameras:before {
    content: "\44";
}
.ec-drone:before {
    content: "\45";
}
.ec-gamepad:before {
    content: "\46";
}
.ec-headphones:before {
    content: "\47";
}
.ec-laptop:before {
    content: "\48";
}
.ec-printer:before {
    content: "\49";
}
.ec-smartphones:before {
    content: "\4a";
}
.ec-smartwatch:before {
    content: "\4b";
}
.ec-speaker:before {
    content: "\4c";
}
.ec-tvs:before {
    content: "\4d";
}
/*-------- 21. My account style ---------*/
.myaccount-tab-menu {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.myaccount-tab-menu a {
    border: 1px solid #eee;
    border-bottom: none;
    font-weight: 500;
    font-size: 16px;
    display: block;
    color: #444;
    padding: 15px 30px;
    text-transform: capitalize;
}

.myaccount-tab-menu a:last-child {
    border-bottom: 1px solid #eee;
}

.myaccount-tab-menu a:hover,
.myaccount-tab-menu a.active {
    background-color: var(--yellow);
    border-color: var(--yellow);
    color: #ffffff;
}

.myaccount-tab-menu a i.fa {
    font-size: 14px;
    text-align: center;
    width: 25px;
}

@media only screen and (max-width: 767px) {
    #myaccountContent {
        margin-top: 30px;
    }
}

.myaccount-content .welcome p {
    font-size: 15px;
    margin: 0 0 23px;
}

.myaccount-content .welcome p a {
    color: #444;
}

.myaccount-content .welcome p a:hover {
    color: var(--yellow);
}

.myaccount-content .welcome p strong {
    font-weight: 700;
}

.myaccount-content p {
    font-size: 15px;
    line-height: 1.74;
}

.myaccount-content p a {
    color: #444;
}

.myaccount-content p a:hover {
    color: var(--yellow);
}

.myaccount-content .account-details-form .account-info label {
    font-size: 15px;
    color: #444;
    margin: 0 0 3px;
}

@media only screen and (max-width: 767px) {
    .myaccount-content .account-details-form .account-info.mb-30 {
        margin-bottom: 15px;
    }
}

.myaccount-content .account-details-form span {
    font-style: italic;
    font-size: 15px;
    color: #444;
    margin: 5px 0 0;
    display: block;
}

.myaccount-content .account-details-form fieldset {
    padding: 1.55em 1.625em 3em;
    border: 1px solid #eee;
    margin: 30px 0 36px;
}

@media only screen and (max-width: 767px) {
    .myaccount-content .account-details-form fieldset {
        padding: 1.55em 1em 3em;
    }
}

.myaccount-content .account-details-form fieldset legend {
    font-size: 18px;
    width: auto;
    float: inherit;
}

.myaccount-content .account-details-form .account-info-btn button {
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
    background-color: var(--yellow);
    border-radius: 26px;
    padding: 11px 41px 13px;
    border: none;
}

.myaccount-content .account-details-form .account-info-btn button:hover {
    background-color: #ffbd59;
}

.myaccount-content.myaccount-address .myaccount-address-wrap {
    margin: 20px 0 0px;
}

.myaccount-content.myaccount-address .myaccount-address-wrap h3 {
    font-size: 25px;
    font-weight: 600;
    margin: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .myaccount-content.myaccount-address .myaccount-address-wrap h3 {
        font-size: 22px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .myaccount-content.myaccount-address .myaccount-address-wrap h3 {
        font-size: 22px;
    }
}

@media only screen and (max-width: 767px) {
    .myaccount-content.myaccount-address .myaccount-address-wrap h3 {
        font-size: 20px;
    }
}

.myaccount-content.myaccount-address
    .myaccount-address-wrap
    .myaccount-address-content {
    margin: 20px 0 0;
}

@media only screen and (max-width: 767px) {
    .myaccount-content.myaccount-address
        .myaccount-address-wrap
        .myaccount-address-content {
        margin: 14px 0 0;
    }
}

.myaccount-content.myaccount-address
    .myaccount-address-wrap
    .myaccount-address-content
    h4 {
    font-size: 18px;
    font-size: 500;
    margin: 0 0 5px;
}

.myaccount-content.myaccount-address
    .myaccount-address-wrap
    .myaccount-address-content
    p {
    font-size: 15px;
    color: #444;
    line-height: 1.74;
    margin: 0;
}

.myaccount-table {
    white-space: nowrap;
    font-size: 14px;
}

.myaccount-table table th,
.myaccount-table .table th {
    padding: 10px;
    font-weight: 600;
    background-color: #f8f8f8;
    border-color: #eee;
    border-bottom: 0;
    font-size: 15px;
    color: #333;
}

.myaccount-table table td,
.myaccount-table .table td {
    padding: 10px;
    vertical-align: middle;
    border-color: #eee;
    color: #333;
}