@charset "UTF-8";
:root {
    --font_light: "Almarai_Light";
    --font_regular: "Almarai_Regular";
    --font_bold:"Almarai_Bold";
    --font_extra_bold:"Almarai_Extrabold";
    --light_gray: rgb(140, 150, 170);
    --dark_gray: rgb(90, 100, 120);
    --light_green: rgb(15, 165, 150);
    --dark_green: rgb(60, 200, 190);
}


* {
    padding: 0;
    margin: 0;
    outline: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent; /* for removing the highlight */
}

body {
    font-family: "Almarai", sans-serif;
    font-weight: 400;
    font-size: 10px;
}

::placeholder {
    /*color: #b4b8c6;*/
    /*color: #455066;*/
    /*color: rgb(129, 135, 159);*/
    color: #6d788b;
    opacity: 0.7;
}
/*::placeholder {
    color:#b7c0d3;
    opacity: 1;
}*/



/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f7f7f7;
}

/* Handle */
::-webkit-scrollbar-thumb {
    /*background: linear-gradient(to top, rgb(90, 220, 200) , rgb(110, 100, 240));*/
    background: var(--light_gray);
}

a {
    text-decoration: none;
}

li {
    list-style-type: none;
}

.container {
    padding: 0 12px;
    max-width: 768px;
    margin: auto;
    position: relative;
}

.container::after {
    content: " ";
    clear: both;
    display: block;
}
.clear {
    clear: both;
}

/*Lang page start*/

.lang-page .container {
    padding-top: 230px;
}

.lang-page .logo {
    margin-bottom: 180px !important;
}


.lang-page .lang-links a:last-of-type {
    margin-bottom: 90px;
}



/*Lang page end*/


/*
    entry page style start
*/
.entry-page,
.lang-page{
    text-align: center;
    background: linear-gradient(to bottom, #68e0d2, #827ef3);
    min-height: 100vh;
}

.entry-page .container {
    /*max-width: 480px;*/
    padding-top: 140px;
    margin: auto;
}

.entry-page .logo, .lang-page .logo {
    width: 121px;
    height: 121px;
    margin: 0 auto 75px;
    line-height: 121px;
    background: url(../images/printo-white-icon.svg) no-repeat center center;
}

.entry-page-text {
    color: #fff;
    font-weight: 300;
    font-size: 22px;
    font-family: var(--font_bold);
    line-height: 34px;
    max-width: 280px;
    margin: 0 auto 95px;
}

.login-register a,
.lang-page .lang-links a{
    display: block;
    margin-bottom: 16px;
    background: #fff;
    font-size: 16px;
    color: #6d788b;
    border-radius: 25px;
    height: 40px;
    line-height: 37px;
}

.login-register a.login {
    background-color: #68e1d2;
    color: #fff;
}

.entry-page .entry-page-terms {
    font-size: 10px;
    line-height: 16px;
    max-width: 240px;
    margin: 0 auto 40px;
    padding-top: 4px;
    font-family: var(--font_regular);
    color: #fff;
}

.entry-page .entry-page-terms a {
    color: #fff;
}

.entry-page .copyright,
.lang-page .copyright {
    font-size: 10px;
    line-height: 24px;
    color: #fff;
}
/* entry page end */


/* login page start */
.login-page,
.register-page {
    background: #f9f9f9;
    min-height: 100vh;
}

.login-page .container,
.register-page .container {
    margin: auto;
    padding: 80px 16px 16px;
}

.login-page h2:first-of-type {
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    font-family: var(--font_bold);
    color: #68e1d2;
    text-align: center;
    margin-bottom: 35px;
}

.login-page .login-logo, .register-page .register-logo {
    width: 121px;
    height: 121px;
    background: url(../images/printo-color-icon.svg) no-repeat center center;
    margin: 0 auto 40px;
}

.login-form input,
.register-form input {
    display: block;
    width: 100%;
    height: 42px;
    border: 2px solid #e2e4e7;
    background: #f9f9f9;
    border-radius: 25px;
    font-family: var(--font_regular);
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 14px;
    padding: 0 8px 0 45px;
}

.login-form .form-group:last-of-type input,
.register-form .form-group:last-of-type input {
    margin-bottom: 0;
}

.login-form input[type=submit],
.register-form input[type=submit] {
    border: none;
    height: 40px;
    line-height: 24px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-family: var(--font_regular);
    margin-top: 35px;
    margin-bottom: 25px;
    background-image: linear-gradient(to left, #6bd7d5, #799fe8);
    padding: 0;
    border-radius: 25px;
}
.login-form .form-group,
.register-form .form-group {
    position: relative;
}

.login-form .form-group .icon,
.register-form .form-group .icon {
    content: "";
    position: absolute;
    background: url("../images/edit.icon.svg") no-repeat center;
    background-size: 17px;
    /*width: 17px;*/
    width: 50px;
    height: 40px;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    display: block;
    z-index: 222;
}

.loading-div {
    position: fixed;
    z-index: 999999999999999999;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.2);
    display: none;
}

.loading-div img {
    width: 65px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.login-page .forget-password {
    text-align: center;
    font-size: 14px;
    line-height: 24px;
    font-family: var(--font_bold);
    margin-top: 35px;
}

.loading-div.active {
    display: block;
}

.login-page .forget-password a {
    color: #acb2bc;
}


.login-page .login-by-text {
    text-align: center;
    font-size: 12px;
    line-height: 24px;
    font-family: var(--font_bold);
    color: #acb2bc;
    margin-bottom: 20px;
}

.login-page .copyright,
.register-page .copyright {
    text-align: center;
    color: #6d788b;
    font-size: 10px;
    line-height: 24px;
    margin-top: 155px;
}

.login-page .email-icon .icon{
    background-image: url("../images/email.gray.icon.svg");
}

.login-page .password-icon .icon {
    background-image: url("../images/eye.hide.icon.svg");
    cursor: pointer;
}
.login-page .password-icon .icon.eye {
    background-image: url("../images/eye.show.icon.svg");
}

.login-page .social-links {
    text-align: center;
    display: flex;
    justify-content: space-between;
    align-content: center;
}

/*.login-page .social-links::after {
    content: "";
    clear: both;
    display: block;
}*/

.login-page .social-links a {
    position: relative;
    min-width: 40px;
    height: 40px;
}

.login-page .social-links a:not(:last-child) {
    margin-left: 15px;
}

.login-page .social-links a:last-child {
    color: #acb2bc;
    line-height: 35px;
    font-size: 12px;
    font-family: var(--font_bold);
    border: 2px solid #e6e7ea;
    border-radius: 25px;
    height: 40px;
    padding: 0 17px 0 50px;
    width: 80%;
}

.login-page .social-links a::after {
    content: "";
    position: absolute;
    width: 40px;
    height: 40px;
    background: no-repeat center;
    background-size: 40px;
    top: 0;
    left: 0;
}

.login-page .social-links .twitter::after {
    background-image: url("../images/twitter.icon.svg");

}
.login-page .social-links .facebook::after {
    background-image: url("../images/facebook.icon.svg");
}
.login-page .social-links .google::after {
    background-image: url(../images/google.icon.svg);
    background-size: 24px;
    width: 24px;
    height: 24px;
    top: 50%;
    left: 18px;
    transform: translatey(-50%);
}


    /* login page end */

/*resister page start*/

.register-page .social-register a {
    position: relative;
    display: block;
    height: 40px;
    background: #827ef3;
    margin-bottom: 16px;
    border-radius: 7px;
    line-height: 40px;
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    font-family: var(--font_bold);
    padding-right: 8px;
}

.register-page .social-register a:last-of-type {
    margin-bottom: 20px;
}

.register-page .social-register a::after {
    content: "";
    position: absolute;
    display: block;
    width: 24px;
    height: 24px;
    left: 9px;
    top: 50%;
    background-color: #000000;
    transform: translateY(-50%);
}

.register-page .social-register a.google::after {
    background: url("../images/google.icon.svg") no-repeat center;
    background-size: 24px;
}

.register-page .social-register a.facebook::after {
    background: url("../images/facebook.icon.svg") no-repeat center;
    background-size: 24px;
}

.register-page .or, .login-page .or {
    position: relative;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    color: #68e1d2;
    margin-bottom: 10px;
}

.register-page .or::after,
.register-page .or::before {
    position: absolute;
    content: "";
    height: 2px;
    width: 46%;
    background: #e6e7ea;
    top: 62%;

}

.register-page .or::after {
    left: 0;
}

.register-page .or::before {
    right: 0;
}

.register-page .register-form label {
    font-size: 12px;
    line-height: 24px;
    font-family: var(--font_bold);
    color: #6d788b;
}

.register-form input {
    background: #f4f5f6;
    margin-bottom: 20px;
}

.register-form input[type=submit] {
    margin-top: 18px;
}

.register-form .terms {
    color: #6d788b;
    max-width: 240px;
    margin: auto;
    text-align: center;
    font-size: 10px;
    line-height: 16px;
}

.register-page .copyright {
    margin-top: 43px;
}


    /*resister page end*/


/* home page start */
.app-page {
    background: #f2f2f2;
    min-height: 100vh;
    padding-bottom: 64px;
}

.app-page header {
    background: linear-gradient(to left, rgb(90, 220, 200) , rgb(110, 100, 240));
    /*height: 56px;*/
    height: 80px;
}

.app-page header h3 {
    float: right;
    /*margin-top: 21px;*/
    margin-top: 45px;
    color: #fff;
    font-weight: normal;
    font-family: var(--font_bold);
    font-size: 18px;
    line-height: 35px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 55px);
}

.app-page header .drop-menu,
.app-page header .notifications {
    float: left;
    /*margin-top: 32px;*/
    margin-top: 56px;
    cursor: pointer;
    position: relative;
}
.app-page header .notifications {
    margin-left: 10px;
}

.app-page header .drop-menu .menu-icon {
    width: 21px;
    height: 16px;
    background: url(../images/menu.icon.svg) no-repeat center;
    background-size: 21px 16px;
}

.app-page header .notifications .notifications-icon {
    position: relative;
    width: 17px;
    height: 17px;
    background: url(../images/notifications.svg) no-repeat center;
    background-size: 17px;
}

.app-page header .notifications .notifications-icon i {
    font-style: normal;
    font-family: var(--font_light);
    color: #fff;
    background: #ff5720;
    min-width: 15px;
    height: 15px;
    display: block;
    border-radius: 50%;
    position: absolute;
    top: -5px;
    left: 11px;
    font-size: 10px;
    line-height: 16px;
    text-align: center;
}

.app-page header .notifications .notifications-icon.has-notifications {
    background: url(../images/has-notifications-icon.svg) no-repeat center;
    background-size: 17px;
}

.app-page header .back-btn {
    display: inline-block;
    float: left;
    position: relative;
    padding: 20px;
    margin-top: 35px;
}

.app-page header .back-btn:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/left-arrow.icon.svg") no-repeat center;
    background-size: 24px;
}

/* app menu start */
.app-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgb(0 0 0 / 59%);
    z-index: 9999999;
    display: none;
    overflow: auto;
}

.app-menu .container {
    position: relative;
}

.app-menu .wrapper {
    min-width: 280px;
    left: -280px;
    background: #FFFFFF;
    transition: .5s ease;
    height: 100vh;
    overflow: auto;
    position: fixed;
}

.app-menu .wrapper.slide-menu {
    left: 0;
}

.app-menu-header {
    padding: 48px 0 24px;
    background: linear-gradient(239deg, rgb(90, 220, 200) , rgb(110, 100, 240));
}

.app-menu-header .logo {
    height: 80px;
    width: 80px;
    margin: auto;
    background: url("../images/printo-white-icon.svg") no-repeat center center;
    background-size: 80px;
}

.app-menu-header .title {
    text-align: center;
    padding-bottom: 10px;
    color: #fff;
    font-size: 1.9em;
}

.app-menu ul {
    padding-top: 8px;
}

.app-menu ul li a {
    color: #6d788b;
    display: block;
    font-size: 14px;
    line-height: 24px;
    border-bottom: 2px solid #f1f2f4;
    padding: 7px 8px;
}

.app-menu ul li a:hover {
    color: #72e3d5;
}

.app-menu ul li.active a {
    color: #72e3d5;
}
.app-menu .logout a {
    transition: 0.2s ease;
    font-size: 1.4em;
    padding: 10px 15px;
    display: block;
    color: #455161;
    border-top: 2px solid rgb(230 230 230);
    margin-top: 50px;
}

.app-menu .logout a:hover {
    color: #43cabe;
}

.app-menu .menu-item {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: flex-start;
}

.app-menu .menu-item .icon svg {
    width: 24px;
    height: 24px;
    line-height: 0;
    display: block;
    margin: 0 7px 0 15px;
    fill: #9ca2ae;
    stroke: #9ca2ae;
}

.app-menu .menu-item .text {
    flex-grow: 2;
    padding-right: 5px;
}

.app-menu ul li.active svg {
    fill: #5adcc8!important;
    stroke: #5adcc8 !important;
}

.app-menu ul li a:hover svg {
    stroke: #72e3d5 !important;
    fill: #72e3d5 !important;
}
/* app menu end */


.search-box {
    margin: 16px 0;
}

.search-box input[type="text"] {
    height: 48px;
    display: block;
    width: 100%;
    margin: auto;
    padding: 0 8px 0;
    border-radius: 7px;
    border: none;
    background: #fff;
    box-shadow: 0 0 5px 2px #e1e1e1;
    font-family: var(--font_regular);
    font-size: 14px;
}

.search-box form {
    position: relative;
}

.search-box button[type="submit"] {
    position: absolute;
    width: 24px;
    height: 24px;
    background: transparent;
    top: 50%;
    transform: translateY(-50%);
    left: 8px;
    border: none;
    cursor: pointer;
}

.search-box .search-icon {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/search.icon.svg) no-repeat center;
    background-size: 24px;
}

.categories .categories-flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}


.categories .category {
    width: calc(50% - 4px);
    margin-bottom: 8px;
    text-align: center;
    background: #fff;
    border-radius: 9px;
    box-shadow: 0 0 5px 2px #e1e1e1;
    min-height: 183px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
}

.categories .category .icon {
    width: 73px;
    height: auto;
    margin-top: -30px;
}

.categories .category .icon img {
    width: 100%;
}

.categories .category h2 {
    font-family: var(--font_regular);
    font-weight: 300;
    font-size: 14px;
    color: #6d788b;
    padding: 0 6%;
    line-height: 20px;
    position: absolute;
    bottom: 16px;
    width: 100%;
}

.category.more .icon img {
    position: relative;
    width: 32px;
    bottom: -15px;
}
/* home page end */



/* fixed nav start */
.fixed-nav {
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 99999;
    height: 56px;
    background: #fff;
    box-shadow: -3px -4px 7px 0 #eee;
}

.fixed-nav .home-icon,
.fixed-nav .chat-icon,
.fixed-nav .add-ad-icon,
.fixed-nav .sheets-icon,
.fixed-nav .person-icon {
    width: 20px;
    height: 20px;
    margin: 0 auto 5px;
    background-size: 20px !important;
}

.fixed-nav .home-icon {
    background: url(../images/home.icon.svg) no-repeat center;
}

.fixed-nav .home:hover .home-icon, .fixed-nav .home.active .home-icon {
    background: url(../images/home.green.icon.svg) no-repeat center;
}

.fixed-nav .chat-icon {
    background: url(../images/chat.icon.svg) no-repeat center;
}

.fixed-nav .chat:hover .chat-icon, .chat.active .chat-icon {
    background: url(../images/chat.green.icon.svg) no-repeat center;
}


.fixed-nav .add-ad-icon {
    background: url(../images/add.ad.svg) no-repeat center;
    position: relative;
    bottom: 21px;
    background-size: 48px !important;
    width: 48px;
    height: 48px;
    margin-bottom: 6px;
}

.fixed-nav .add-ad-icon {
    margin-bottom: 3px;
    bottom: 24px;
}

.fixed-nav .notifications:hover .notifications-icon {
    background: url(../images/notifications.green.icon.svg) no-repeat center;
}

.fixed-nav .sheets-icon {
    background: url(../images/sheets.icon.svg) no-repeat center;
}

.fixed-nav .my-ads:hover .sheets-icon, .my-ads.active .sheets-icon {
    background: url(../images/sheets.green.icon.svg) no-repeat center;
}

.fixed-nav .person-icon {
    background: url(../images/person.icon.svg) no-repeat center;
}

.fixed-nav .profile.active .person-icon, .fixed-nav .profile:hover .person-icon {
    background: url("../images/person.green.icon.svg") no-repeat center;
}

.fixed-nav .container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
}

.fixed-nav .container::after {display: none;}

.fixed-nav .container > a {
    position: relative;
    text-align: center;
    display: block;
    color: #6d738d;
    font-size: 10px;
    line-height: 11px;
    padding: 10px 0;
    min-width: 40px;
}

.fixed-nav .container > a .notifications {
    position: absolute;
    top: 10px;
    right: 0;
    font-style: normal;
    background: #ff5720;
    color: #fff;
    border-radius: 50%;
    line-height: 15px;
    height: 15px;
    min-width: 15px;
    text-align: center;
    display: inline-block;
}

.fixed-nav .container > a {
    transition: .2s ease;
}

.fixed-nav .container > a span {
    display: inline-block;
    position: relative;
}

.fixed-nav .add-ad span {
    bottom: 25px;
}

.fixed-nav .container > a.active, .fixed-nav .container > a:hover {
    color: #3eac9a;
}

/* fixed nav end */

/* profile page start */
main .profile {
    padding-top: 45px;
}


.profile .img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #e6e6e6;
    text-align: center;
    line-height: 75px;
}

.profile .img .icon {
    width: 50px;
    height: 50px;
    display: block;
    margin: auto;
    position: relative;
    top: calc(50% - 25px);
}

.profile .my-links {
    margin-bottom: 20px;
    padding: 0 25px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
}

.profile .my-links a {
    font-size: 11px;
    display: block;
    color: #6d788b;
    width: 33.3%;
    position: relative;
    margin-bottom: 10px;
    transition: .2s ease;
    padding: 10px 0;
}

.profile .my-links a:hover {
    background: #f1f1f1;
}

.profile .my-links a:not(:last-of-type):after {
    content: "";
    width: 1px;
    height: 12px;
    left: 0;
    bottom: 50%;
    transform: translateY(50%);
    position: absolute;
    background: #acb2bc;
}

.profile .my-links span {
    display: block;
    color: #acb2bc;
    font-size: 12px;
}

.profile .my-info .form-group span.icon {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 7px;
    background: url(../images/edit.gray.icon.svg) no-repeat center;
    background-size: 18px;
    width: 18px;
    height: 18px;
}

.profile .my-info .form-group span.icon.email {
    background: url(../images/email.gray.icon.svg) no-repeat center;
}

.profile .my-info .form-group span.icon.tel {
    background: url(../images/tel.gray.icon.svg) no-repeat center;
}
.profile .my-info .form-group span.icon.mobile {
    background: url(../images/mobile.gray.icon.svg) no-repeat center;
}
.profile .my-info .form-group span.icon.whatsapp {
    background: url(../images/whatsapp.gray.icon.svg) no-repeat center;
}
.profile .my-info .form-group span.icon.address {
    background: url(../images/location.gray.icon.svg) no-repeat center;
}
.profile .my-info .form-group span.icon.crown {
    background: url(../images/crown.gray.icon.svg) no-repeat center;
}
.profile .my-info .form-group span.icon.close-pass {
    background: url(../images/close-pass.icon.svg) no-repeat center;
}
.profile .my-info .form-group #showPass {
    cursor: pointer;
}
.profile .my-info .form-group span.icon.open-pass {
    background: url(../images/open-pass.icon.svg) no-repeat center;
}

.profile .my-info .form-group:not(:first-of-type) {
    height: 36px;
    margin-bottom: 16px;
}

.profile .my-info input,
.profile .my-info select,
.extra-address .form-group input,
.extra-address .form-group select
{
    position: relative;
    border: none;
    width: 100%;
    padding: 0 8px 0 45px;
    font-family: var(--font_regular);
    font-size: 14px;
    line-height: 1;
    height: 36px;
    background: #f1f2f4;
    border-radius: 5px;
    color: #6d788b;
}

.profile .my-info select {
    appearance: none;
}
.form-group span.icon.required {
    left: 26px;
    line-height: 1.28;
    background: none;
    display: block;
    text-align: center;
    cursor: pointer;
    content: "";
    position: absolute;
    top: 25px;
    transform: translateY(-50%);
    width: 18px;
}
.form-group span.icon.required:before {
    content: "*";
    text-align: center;
    font-size: 23px;
    color: #fca1a9;
}

.form-group span.icon.required:hover:after {
    content: "مطلوب";
    position: absolute;
    background: #fca1a9;
    color: #fff;
    padding: 2px 3px;
    border-radius: 2px;
    left: 15px;
    top: 1px;
    min-width: 34px;
}

.form-group.contain-price span.icon.required {
    left: 80px;
}

.profile .my-info .form-group span.icon.required {
    left: 26px;
    line-height: 1.28;
    background: none;
    display: block;
    text-align: center;
    cursor: pointer;
}

.profile .my-info .form-group span.icon.required:before {
    content: "*";
    text-align: center;
    font-size: 23px;
    color: #fca1a9;
}

.profile .my-info .form-group span.icon.required:hover:after {
    content: "مطلوب";
    position: absolute;
    background: #fca1a9;
    color: #fff;
    padding: 2px 3px;
    border-radius: 2px;
    left: 15px;
    top: 1px;
}

#address {
    cursor: pointer;
}

/*.profile .my-info input[type=submit] {
    border: none;
    padding: 12px;
    margin: 16px 0;
    cursor: pointer;
    color: #ffffff;
    transition: .2s ease;
    background: linear-gradient(to left,#69ded3 , #8183f1);
    border-radius: 25px;
    height: 40px;
    font-size: 22px;
    font-family: var(--font_bold);
    line-height: 17px;
}*/

.profile .form-group.pretty-file input[type=file] + label {
    padding: 0;
}

.extra-address {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: hsl(0deg 0% 0% / 75%);
    z-index: 99999;
}

.extra-address.active {
    display: block;
}


.extra-address .inner {
    background: #fff;
    padding: 30px 10px 10px 10px;
    margin-top: 15vh;
    border-radius: 4px;
    color: var(--dark_gray);
}

.extra-address .inner label {
    display: block;
    font-size: 12px;
    padding: 5px 7px;
    color: #6e66ef;
}

.extra-address .inner .locating {
    display: inline-block;
    border: none;
    background: #6e66ef;
    font-size: 12px;
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    font-family: var(--font_regular);
    cursor: pointer;
}

.extra-address .form-group {
    height: 36px !important;
    margin-bottom: 16px !important;
}

.extra-address .form-group select {
    padding-left: 45px !important;
    appearance: none;
}
.alert {
    padding: 6px;
    margin: 16px 0;
    background: #eee;
    border-radius: 2px;
    color: #fff;
    font-size: 12px;
    font-family: var(--font_regular);
    line-height: 2;
    border: 1px solid transparent;
}

.alert.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #eeafb5;
}

.alert.alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #a9dab5;
}

.has-error {
    color: #fff;
    font-style: normal;
    position: absolute;
    top: 0;
    right: 5px;
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
    transform: translateY(-100%);
    background: #fca1a9;
    padding: 2px 5px;
    font-size: 9px;
    line-height: 1.2;
}
.has-error:empty {
    display: none;
}

.login-page .has-error {
    right: 20px;
}


.error-control,.pretty-control.error-control {
    border: 1px solid #fca1a9 !important;
}

select[name=membership] {
    padding: 0 8px;
    background: transparent;
    border: none;
    color: #6d788b;
    font-family: var(--font_regular);
    font-size: 14px;
    width: 100%;
    appearance: none;
    line-height: 36px;
}

.form-group.membership {
    font-family: var(--font_regular);
    font-size: 14px;
    color: #455066;
    background: #f1f2f4;
    border-radius: 5px;
}

.form-group.membership label {
    float: right;
    line-height: 2.4;
}

/* profile page end */

/* my ads page start*/
/*top nav start*/
.top-nav {
    background: #fff;
    box-shadow: 0 10px 10px 0 #eee;
    /*height: 48px;*/
    position: sticky;
    top: 0;
    z-index: 99999;
}

.top-nav .top-nav-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 48px;
}

.top-nav .container .nav-item {
    width: 33.3%;
    position: relative;
}

.top-nav .container .nav-item:nth-of-type(2n) {
    text-align: center;
}

.top-nav .container .nav-item:last-of-type {
    text-align: left;
}

.top-nav .container .nav-item .icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-size: 24px !important;
    margin-left: 10px;
    position: relative;
    top: 10px;
}

.top-nav .container .nav-item:first-of-type .icon {
    background: url("../images/arrange.icon.svg") no-repeat center;
}

.top-nav .container .nav-item:nth-of-type(2) .icon {
    background: url("../images/filter.icon.svg") no-repeat center;
}

.top-nav .container .nav-item:last-of-type .icon {
    background: url("../images/map.filter.icon.svg") no-repeat center;
}

.top-nav .container .nav-item a {
    font-size: 12px;
    line-height: 18px;
    font-family: var(--font_regular);
    display: block;
    color: #485066;
    padding-bottom: 10px;
}

.filters {
    position: absolute;
    top: 100%;
    z-index: 555;
    width: 100%;
    display: none;
}

.active + .filters {
    display: block;
}

.filters select {
    width: 200%;
    border: 2px solid #6e66ef;
    background: #ffffff;
    padding: 7px 0;
    font-family: var(--font_regular);
    font-size: 12px;
    border-radius: 5px;
}

.filters::after {
    content: "";
    display: block;
    top: -4px;
    right: 35px;
    position: absolute;
    border-top: 10px solid #6e66ef;
    border-right: 10px solid transparent;
    transform: rotate(45deg);
}


.price-filter, .map-filter {
    width: 300%;
    background: #fff;
    border: 2px solid #6e66ef;
    left: -100%;
    padding: 10px;
    border-radius: 5px;
}

.price-filter::after {
    right: 50%;
    top: -6px;
}

.map-filter {
    left: 0;
    text-align: center ;
}

.map-filter::after {
    right: calc(100% - 35px);
    top: -6px;
}

.price-filter h4, .map-filter h4 {
    font-family: var(--font_regular);
    font-size: 12px;
    color: var(--dark_gray);
    font-weight: 300;
    padding: 2px 0;
}

.price-filter input[type="number"], .map-filter input[type="text"], .filters select[name=gov] {
    width: 100%;
    border: 1px solid rgb(219 219 219);
    padding: 7px 5px;
    font-size: 12px;
    border-radius: 2px;
    font-family: var(--font_regular);
}
.filters select[name=gov] {
    appearance: none;
    background: url(../images/left-o-arrow.icon.svg) no-repeat 7px center;
    background-size: 16px;
}

.price-filter input[type="submit"],  input[type="submit"]{
    display: inline-block;
    border: none;
    background: #6e66ef;
    font-size: 12px;
    color: #fff;
    margin-top: 10px;
    padding: 2px 10px;
    border-radius: 3px;
    font-family: var(--font_regular);
    cursor: pointer;
}

.filters-result-outer {
    background: #ffffff;
    color: #808080;
    font-size: 12px;
    line-height: 16px;
    border-bottom: 1px solid #e1e1e1;
    border-top: 1px solid #e1e1e1;
}

.filters-result-outer .container {
    padding: 8px 12px 8px 60px;
}

.filters-result p, .filters-result button {
    display: inline-block;
    margin-left: 8px;
}

.filters-result p span {
    color: #5ec2d0;
}

.filters-result-outer button {
    border: none;
    padding: 4px 5px;
    color: #808080;
    background: #fff;
    cursor: pointer;
    border-radius: 2px;
    width: 45px;
    font-family: var(--font_regular);
    font-size: 12px;
    position: absolute;
    top: 4px;
    left: 0;
    text-align: left;
}
/*top nav end*/


.ads {
    padding-top: 16px;
}

.ads .ad-item {
    margin-bottom: 16px;
    background: #fff;
    box-shadow: 0 0 10px 5px #ededed;
    line-height: 1;
    position: relative;
}

.ad-item .pin {
    position: absolute;
    z-index: 222;
    top: 0;
    right: 0;
    background: #F00;
    color: #fff;
    padding: 4px 6px;
    font-family: var(--font_regular);
    font-size: 12px;
}

.ads .ad-item > * {
    float: right;
}

.ads .ad-item:after {
    content: "";
    display: block;
    clear: both;
}

.ads .ad-item .ad-img {
    width: 110px;
    height: 120px;
    float: right;
}

.ads .ad-item .ad-img img {
    width: 100%;
    height: 100%;
}

.ads .ad-item .ad-title {
    font-size: 14px;
    line-height: 20px;
    font-family: var(--font_regular);
    width: 100%;
    padding: 4px 8px;
    color: #6d788b;
    height: 46px;
    overflow: hidden
}

.ads .ad-item .ad-title a {
    color: rgb(69, 80, 102);
    display: block;
    font-weight: 300;
}

.ads .ad-item .ad-content {
    width: calc(100% - 110px);
    padding-bottom: 26px;
}

.ads .ad-item .ad-price {
    font-size: 14px;
    line-height: 20px;
    font-family: var(--font_regular);
    color: #6d788b;
    padding: 0 8px 4px;
}

.ads .ad-item .ad-price b {
    font-weight: 300;
    font-size: 18px;
    line-height: 20px;
    display: inline-block;
}

.ads .ad-item span.line {
    display: block;
    height: 1px;
    width: 93%;
    background-color: #bdf2eb;
    margin: 0 auto 4px;
}

.ads .ad-item .ad-location {
    position: relative;
    font-size: 10px;
    line-height: 16px;
    font-family: var(--font_regular);
    color: #a1a7b2;
    padding: 0 28px 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ads .ad-item .ad-location::before {
    content: "";
    background: url(../images/location.icon.svg) no-repeat top center;
    background-size: contain;
    height: 17px;
    width: 13px;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 8px;
}

.ads .ad-item .ad-content-footer {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-top: 4px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% - 110px);
}

.ads .ad-item .ad-content-footer > div {
    font-size: 10px;
    line-height: 16px;
    font-family: var(--font_regular);
    color: #b4bac4;
    width: 42%;
}

.ads .ad-item .ad-content-footer .ad-date {
    padding-right: 28px;
}

.ads .ad-item .ad-content-footer .ad-views {
    text-align: left;
}

.ads .ad-item .ad-content .ad-like {
    direction: ltr;
    padding-left: 10px;
    width: 16%;
}

.ads .ad-item .ad-content .ad-like::after {
    content: "";
    background: url("../images/heart.gray.icon.svg") no-repeat left bottom;
    background-size: contain;
    height: 10px;
    width: 11px;
    display: block;
}

.ads .ad-item .ad-content .ad-like.active::after {
    background: url("../images/heart.icon.svg") no-repeat left bottom;
}

.ads .add-btn-wrapper {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 77777;
}
.ads .add-btn-wrapper .add,
.printing-houses-pages .add,
.profile .my-info input[type=submit]{
    position: relative;
    width: 100%;
    height: 48px;
    display: block;
    text-align: center;
    background: linear-gradient(to left,#69ded3 , #8183f1);
    margin: 0 0 8px;
    color: #fff;
    border-radius: 25px;
    font-size: 22px;
    font-family: var(--font_bold);
    line-height: 48px;
    padding-right: 0;
    padding-left: 0;
}

.ads .add span, .printing-houses-pages .add span {
    content: "";
    background: url(../images/round-plus-white-icon.svg) no-repeat right center;
    background-size: 24px;
    padding-right: 32px;
}

.premium-ads .slider {
    /*height: 235px;*/
    height: 200px;
    background: #ebebeb;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
}

.premium-ads {
    padding: 16px 0;
}

.owl-carousel .owl-stage-outer {
    height: 200px;
}

.owl-item {
    height: 235px;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    /*background: #6e64f0;*/
    background: #5adcc8;
}

.owl-theme .owl-nav.disabled+.owl-dots {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
}

.owl-theme .owl-dots .owl-dot span {
    width: 7px;
    height: 7px;
}

.owl-theme .owl-dots .owl-dot span {
    margin: 2px;
}

.ads-categories .container::after {
    display: none;
}

.ads-categories .container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}

.ads-categories .category {
    position: relative;
    display: block;
    width: calc(100%/3 - 8px/2);
    min-height: 144px;
    margin-bottom: 8px;
    background: #fff;
    text-align: center;
    border-radius: 7px;
    box-shadow: 0 0 6px 2px rgb(221 221 221 / 76%);
    padding-top: 35px;
}

.ads-categories .category .category-content {
    position: absolute;
    width: 100%;
    bottom: 0;
}

/*.ads-categories .category:not(:last-of-type) {
    border-bottom: 1px solid #d6d6d7;
}*/

/*.ads-categories .category:after {*/
/*    content: "";*/
/*    width: 16px;*/
/*    height: 16px;*/
/*    background: url(../images/left-o-arrow.icon.svg) no-repeat left;*/
/*    background-size: 16px;*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    left: 0;*/
/*}*/

.ads-categories .category .category-content h3 {
    font-weight: 300;
    font-family: var(--font_regular);
    font-size: 11px;
    line-height: 15px;
    color: #6d788b;
    padding: 0 7px;
}

.ads-categories .category .category-content span {
    color: #b6bbc5;
    font-size: 8px;
    font-family: var(--font_regular);
    display: inline-block;
    line-height: 22px;
}

.ads-categories .category .category-icon {
    margin-bottom: 20px;
}

.ads-categories .category .category-icon img {
    max-width: 48px;
    height: 48px;
}
.ads-categories .category.more img {
    width: 40px;
}
.ads-categories .adding-your-ad {
    position: relative;
    font-size: 2.4em;
    display: block;
    width: 220px;
    text-align: center;
    color: #ffff;
    margin: 15px auto;
    border-radius: 50px;
    background: linear-gradient(333deg, rgb(61, 192, 174) , rgb(79, 223, 164));
    height: 60px;
    padding-right: 40px;
}

.ads-categories .adding-your-ad::after {
    content: '';
    display: block;
    width: 35px;
    height: 35px;
    position: absolute;
    right: 20px;
    top: 15px;
    background: url(../images/cam.white.svg) no-repeat center;
    background-size: 35px;
}
/* my ads page end*/

/* ad page start*/

.ad-wrapper .deactivated {
    position: fixed;
    display: block;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    background: #f00;
    color: #fff;
    font-size: 14px;
    padding: 4px 8px;
}

.ad-wrapper .ad {
    background: #fff;
    line-height: 1;
    padding-bottom: 10px;
}

.ad-wrapper .ad .ad-header .img {
    height: 235px;
    position: relative;
    overflow: hidden;
}

.ad-wrapper .ad .ad-header .img img {
    display: block;
    width: 100%;
    min-height: 100%;
}

.ad-wrapper .back-btn {
    position: absolute;
    top: 19px;
    left: 8px;
    width: 16px;
    height: 16px;
    border: none;
    z-index: 666;
    cursor: pointer;
    background: url(../images/left-arrow.icon.svg) no-repeat center center;
    background-size: 16px;
}

.ad-wrapper .home-btn {
    position: absolute;
    top: 16px;
    left: 33px;
    width: 20px;
    height: 18px;
    border: none;
    z-index: 666;
    cursor: pointer;
    background: url(../images/ad.home.icon.svg) no-repeat;
}

.ad-images-wrapper .like-btn {
    position: absolute;
    bottom: 40px;
    right: 8px;
    background: transparent;
    border: none;
    z-index: 666;
    cursor: pointer;
}

.ad-images-wrapper .owl-carousel .owl-stage-outer {
    height: 275px;
    background: #000;
}

.owl-carousel .owl-item {
    height: 275px;
    overflow: hidden;
}

.ad-images-wrapper .owl-carousel .owl-stage-outer .item img {
    height: auto;
    width: 100%;
    margin: auto;
}

.ad-images-wrapper .like-btn:after {
    content: "";
    position: absolute;
    width: 18px;
    height: 14px;
    top: 0;
    right: 0;
    background: url(../images/heart.white.icon.svg) no-repeat center;
    background-size: contain;
}

.ad-images-wrapper .like-btn.active:after {
    background: url(../images/heart.icon.svg) no-repeat center;
    background-size: contain;
}

.ad-images-wrapper .report-ad {
    position: absolute;
    bottom: 15px;
    left: 8px;
    display: inline-block;
    color: #f00;
    font-size: 10px;
    line-height: 16px;
    font-weight: 300;
    padding: 0 0 10px 18px;
}

.ad-images-wrapper .report-ad:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/report-icon.svg) no-repeat;
    width: 11px;
    height: 16px;
    background-size: contain;
}

.ad-images-wrapper .like-report-div {
    position: relative;
    top: 21px;
    z-index: 777;
}

.ad-wrapper .ad .ad-header > h2 {
    font-size: 16px;
    font-weight: 300;
    font-family: var(--font_regular);
    color: #5a6478;
    line-height: 24px;
    padding: 16px 0;
    word-break: break-word;
}

.control-btns {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: nowrap;
}

.control-btns a {
    display: block;
    width: 80px;
    height: 20px;
    color: #5a6478;
    position: relative;
    border-radius: 25px;
    padding: 1px 1px;
    overflow: hidden;
}

.control-btns a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to left, #8183f1, #8183f1,#69ded3,#69ded3 );
}

.control-btns a span {
    position: relative;
    background: #fff;
    display: block;
    border-radius: 25px;
    width: 100%;
    height: 100%;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    font-family: var(--font_regular);
}

/*
.edit, .delete, .toggle-active {
    font-weight: 300;
    font-family: var(--font_regular);
    background: #6dccd9;
    color: #fff;
    border-radius: 7px;
    padding: 0 3px;
    font-size: 12px;
    transition: .2s ease;
    display: inline-block;
}

.edit:hover {
    background: #7c95eb;
}

.delete {
    background: #f25858;
}

.delete:hover {
    background: #cd4141;
}

.toggle-active {
    background: #be58f2;
}

.toggle-active:hover {
    background: #9a47c4;
}
*/

.ad-wrapper .ad .ad-header .price {
    font-size: 14px;
    line-height: 20px;
    color: #6d788b;
}

.ad-wrapper .ad .ad-header .price b {
    font-weight: 300;
    font-size: 22px;
    line-height: 20px;
    font-family: var(--font_regular);
    margin-left: 4px;
}

.ad-wrapper .ad .ad-header .price span {
    display: inline-block;
    margin-right: 16px;
    font-size: 10px;
    line-height: 16px;
    color: #a1a7b2;
}

.ad-wrapper .ad .ad-header .location {
    position: relative;
    padding: 8px 18px 14px 0;
    margin: 9px 0 0;
    font-family: var(--font_regular);
    font-size: 10px;
    line-height: 16px;
    font-weight: 300;
    color: #6d788b;
    border-bottom: 1px solid #f8f8f8;
}

.ad-wrapper .ad .ad-header .location:before {
    content: "";
    position: absolute;
    width: 13px;
    height: 16px;
    top: 18px;
    transform: translateY(-50%);
    right: 0;
    background: url(../images/location.icon.svg) no-repeat center;
    background-size: contain;
}

.ad-wrapper .ad .ad-content {
    padding: 12px 0;
    font-size: 12px;
    line-height: 20px;
    color: #6d788b;
    word-break: break-word;
}

.ad-wrapper .ad .ad-footer {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    color: var(--light_gray);
    margin-top: 20px;
}

.ad-wrapper .ad .ad-footer .ad-date {
    width: 40%;
}

.ad-wrapper .ad .ad-footer .ad-id {
    width: 20%;
}

.ad-wrapper .ad-author {
    margin: 15px 0;
}

.ad-wrapper .ad-author-img {
    float: right;
}

.ad-wrapper .ad-author-info .name span {
    display: block;
    font-size: 10px;
    line-height: 16px;
    color: #9da3af;
}

.ad-wrapper .ad-author-img a {
    display: block;
    width: 100%;
    height: 100%;
}

.ad-wrapper .ad-author-img a img {
    border-radius: 50%;
    width: 50px;
    height: 50px;
}

.ad-wrapper .ad-author-info {
    padding: 0 10px;
    float: right;
}

.ad-wrapper .ad-author-info .name a {
    color: #6d788b;
    font-size: 14px;
    line-height: 24px;
}


.ad-wrapper .ad-author-info .name div {
    margin-bottom: 0;
    padding: 2px 0;
}

.contact-bar {
    position: fixed;
    z-index: 9999;
    bottom: 10px;
    height: 60px;
    background: transparent;
    width: 100%;
}

.contact-bar .contact-bar-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: space-evenly;
}

.contact-bar .contact-bar-wrapper > a {
    position: relative;
    display: block;
    width: 30.5%;
    height: 40px;
    border-radius: 25px;
    background: #5a6478;
    cursor: pointer;
}

.contact-bar .contact-bar-wrapper > a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: 24px !important;
}

.contact-bar .contact-bar-wrapper .tel:after {
    background: url("../images/phone-white.icon.svg") no-repeat center;
}

.contact-bar .contact-bar-wrapper .tel {
    background-image: linear-gradient(to left, #68dfd3, #6fc5db);
}

.contact-bar .contact-bar-wrapper .whatsapp {
    background-image: linear-gradient(to left, #71bdde, #79a2e7);
}

.contact-bar .contact-bar-wrapper .share {
    background-image: linear-gradient(to left, #7b9aea, #8180f2);
}

.contact-bar .contact-bar-wrapper .whatsapp:after {
    background: url("../images/whatsapp-white.icon.svg") no-repeat center;
}

.contact-bar .contact-bar-wrapper .share:after {
    background: url("../images/share-white.icon.svg") no-repeat center;
}


/* ad page end*/

/*create page start*/

.create-form-wrapper {
    line-height: 1;
    padding-top: 47px;
}

.create-form-wrapper h2 {
    font-size: 18px;
    line-height: 35px;
    font-weight: 300;
    font-family: var(--font_bold);
    position: relative;
    color: #68e1d2;
}

.create-form-wrapper h3 {
    font-size: 12px;
    padding: 8px 0;
    /* line-height: 35px; */
    font-weight: 300;
    font-family: var(--font_regular);
    position: relative;
    color: var(--dark_gray);
    word-break: break-word;
}

.create-form-wrapper h3 span {
    color: #ff5353;
}


.create-form-wrapper h2 a {
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 24px;
    height: 24px;
    background: url(../images/left-arrow-dark.icon.svg) no-repeat center;
    background-size: 20px;
}

.form-group {
    position: relative;
    line-height: 1;
}

.upload-images-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}

.form-group.pretty-file input[type=file] {
    display: none;
}

.form-group.pretty-file input[type=file] + label {
    position: relative;
    padding: 40px;
    background: #f5f5f7;
    margin-top: 20px;
    margin-bottom: 16px;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
}

.form-group.pretty-file input[type=file] + label:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/upload-image-gray.icon.svg) no-repeat center;
    background-size: 26px;
}


.profile .form-group.pretty-file input[type=file] + label:after {
    background: url(../images/upload-image-white.icon.svg) no-repeat center;
    background-size: 26px;
}

.required-size {
    width: 90px;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #fca1a9;
    border: 1px solid #d68e94;
    padding: 3px;
    color: #fff;
    z-index: 222;
    font-size: 10px;
    text-align: center;
    display: none;
}

.required-size::after {
    content: "";
    position: absolute;
    top: -4px;
    right: 50%;
    border-top: 8px solid #d68e94;
    border-right: 8px solid transparent;
    transform: translateX(50%) rotate(45deg);
}

.has-required-size:hover .required-size {
    display: block;
}

.photo-preview img {
    height: 80px;
    width: 80px;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
}

.pretty-file-2 label {
    float: right;
}

.pretty-file-2::after {
    display: block;
    content: "";
    clear: both;
}

.pretty-file-2 span {
    position: absolute;
    top: 0;
    right: 4px;
    font-size: 14px;
    line-height: 24px;
    font-family: var(--font_regular);
    color: var(--light_gray);
}

.pretty-file-2 {
    margin-bottom: 16px;
    border-radius: 5px;
    padding: 5px;
}

.pretty-file-2 .photo-preview {
    float: left;
    width: auto;
}

.activation-btn {
    position: fixed;
    top: 0;
    left: 50%;
    font-size: 12px;
    background: #f35c5c;
    display: block;
    color: #fff;
    padding: 5px 10px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    transform: translatex(-50%);
    transition: .2s ease;
    z-index: 999;
}

.activation-btn:hover {
    background: #c53636;
}

.pretty-control {
    width: 100%;
    margin-bottom: 16px;
    padding: 0 7px 0 45px;
    border: none;
    border-radius: 7px;
    font-size: 13px;
    line-height: 24px;
    font-family: var(--font_regular);
    height: 36px;
    background-color: #f5f5f7;
    color: var(--dark_gray);
}

.form-group.contain-price input[type=number] {
    padding-left: 95px;
}

.create-form-wrapper .negotiable [type="checkbox"] {
    height: 23px;
}


.create-form-wrapper .form-group textarea {
    min-width: 100%;
    max-width: 100%;
    padding-top: 5px;
}

.create-form-wrapper .form-group textarea:focus {
    padding-top: inherit;
    height: auto;
    min-width: 100%;
    max-width: 100%;
}

.create-form-wrapper .form-group select {
    appearance: none;
    color: #5a6478;
}

/*
.create-form-wrapper .form-group label {
    display: inline-block;
    color: #5a6478;
    font-size: 8px;
    line-height: 24px;
    position: relative;
    padding-right: 7px;
}
.create-form-wrapper [type="checkbox"]:before, .create-form-wrapper [type="radio"]:before {
    width: 6px;
    height: 6px;
}
.create-form-wrapper [type="checkbox"]:after, .create-form-wrapper [type="radio"]:after {
    width: 4px;
    height: 4px;
}

.create-form-wrapper  [type="checkbox"],.create-form-wrapper  [type="radio"] {
    right: 4px;
    top: -2px;
}
*/

.pretty-submit{
    border: none;
    width: 100%;
    background: linear-gradient( to left , #69dfd3, #8180f2) !important;
    color: #fff;
    font-size: 22px;
    line-height: 18px;
    font-family: var(--font_bold);
    margin-top: -2px;
    border-radius: 25px !important;
    padding: 3px;
    cursor: pointer;
    height: 48px;
}

.pretty-submit[disabled] {
    background: #e5e5e5 !important;
}


/*

.create-form-wrapper .form-group:not(:first-of-type):not(:last-of-type):after {
    content: "";
    position: absolute;
    top: 9px;
    left: 8px;
    width: 18px;
    height: 18px;
    background-position: center;
    background-size: contain;
}

.create-form-wrapper .form-group:nth-of-type(2):after, .create-form-wrapper .form-group:nth-of-type(4):after {
    background: url(../images/edit.icon.svg) no-repeat center;
    background-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
}

.create-form-wrapper .form-group:nth-of-type(3):after {
    background: url("../images/left-o-arrow.icon.svg") no-repeat center;
    background-size: 20px !important;
}

.create-form-wrapper .form-group:nth-of-type(6):after {
    background: url("../images/location-gray.icon.svg") no-repeat center;
}

.create-form-wrapper .form-group:nth-of-type(7):after {
    background: url("../images/user.icon.svg") no-repeat center;
}

.create-form-wrapper .form-group:nth-of-type(8):after {
    background: url("../images/mobile.icon.svg") no-repeat center;
}

.create-form-wrapper .form-group:nth-of-type(9):after {
    background: url("../images/whatsapp-gray.icon.svg") no-repeat center;
}

.create-form-wrapper .form-group:nth-of-type(10):after {
    background: url("../images/email.icon.svg") no-repeat center;
}
*/

.pretty-checkbox, .pretty-radio {
    appearance: none;
    position: relative;
    right: 8px;
    top: -4px;
    transform: translateY(50%);
    z-index: 99999;
    cursor: pointer;
    width: auto !important;
}

.pretty-checkbox:before, .pretty-radio:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid #c5c9d1;
    background: transparent;
}

.pretty-checkbox:after, .pretty-radio:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    width: 9px;
    height: 9px;
    background: #68e1d2;
    border-radius: 50%;
    display: none;
}

.pretty-checkbox:checked:after,
.pretty-radio:checked:after {
    display: block;
}

.pretty-checkbox-label .pretty-checkbox {
    margin-left: 15px;
    transform: scale(.8);
}

.pretty-checkbox-label {
    color: var(--dark_gray);
    font-size: 10px;
    cursor: pointer;
}

.form-group.contain-price .checkbox {
    position: absolute;
    top: 15px;
    left: 7px;
}

.negotiable {
    position: absolute;
    top: 8px;
    left: 25px;
}

.create-form-wrapper .form-group .negotiable label {
    font-size: 8px;
    line-height: 24px;
    font-family: var(--font_regular);
}

.has-icon::after {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 9px;
    left: 7px;
    background: rgb(90, 220, 200);
    z-index: 5555;
}

.has-icon.edit-icon::after {
    background: url(../images/edit.gray.icon.svg) no-repeat center;

}

.has-icon.location-icon::after {
    background: url(../images/location.gray.icon.svg) no-repeat center;
}

.has-icon.left-arrow-icon::after {
    background: url(../images/left-o-arrow.icon.svg) no-repeat center;
}

.has-icon.email-icon::after {
    background: url(../images/email.gray.icon.svg) no-repeat center;
}

.has-icon.mobile-icon::after {
    background: url(../images/mobile.gray.icon.svg) no-repeat center;
}

.has-icon.tel-icon::after {
    background: url(../images/tel.gray.icon.svg) no-repeat center;
}

.has-icon.facebook-icon::after {
    background: url(../images/facebook.gray.icon.svg) no-repeat center;
}

.has-icon.instagram-icon::after {
    background: url(../images/instagram.gray.icon.svg) no-repeat center;
}

.has-icon.twitter-icon::after {
    background: url(../images/twitter.gray.icon.svg) no-repeat center;
}

.has-icon.url-icon::after {
    background: url(../images/url.gray.icon.svg) no-repeat center;
}

.has-icon.whatsapp-icon::after {
    background: url(../images/whatsapp.gray.icon.svg) no-repeat center;
}

.has-icon.time-icon::after {
    background: url(../images/time.gray.icon.svg) no-repeat center;
}

/*create page end*/


/* report page start*/

.report-form-wrapper h2 {
    margin: 27px 0 20px;
    color: #68e1d2;
    font-size: 18px;
    font-family: var(--font_bold);
    font-weight: 300;
    line-height: 35px;
}

.report-form-wrapper .form-group {
    line-height: 3;
    color: #5a6478;
}

.report-form-wrapper .form-group:not(:last-of-type) {
    border-bottom: 1px solid #f0f1f3;
}

.report-form-wrapper .form-group label {
    margin-right: 20px;
    font-size: 16px;
    font-family: var(--font_regular);
    cursor: pointer;
}

.report-form-wrapper  .form-fixed-submit {
    position: fixed;
    bottom: 30px;
    right: 0;
    width: 100%;
    z-index: 77777;
}

.report-form-wrapper .form-fixed-submit input[type="submit"] {
    border: none;
    width: 100%;
    height: 48px;
    background: linear-gradient( 316deg , #69ded3, #8180f2);
    color: #fff;
    font-size: 22px;
    line-height: 18px;
    font-family: var(--font_bold);
    font-weight: 300;
    border-radius: 27px;
    cursor: pointer;
}
/* report page end*/

/* printing houses start*/

.ads-slider .slider-wrapper {
    padding: 140px;
    background: #ebebeb;
}

.printing-houses {
    line-height: 1;
}

.printing-houses-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}

.printing-houses-wrapper .item {
    width: calc(100%/3 - 4px);
    height: 144px;
    margin-bottom: 8px;
    background: #fff;
    text-align: center;
    border-radius: 7px;
    box-shadow: 0 0 6px 2px rgb(221 221 221 / 76%);
}

.printing-houses-wrapper .item .title {
    font-size: 11px;
    font-family: var(--font_regular);
    color: #6d788b;
    margin-bottom: 7px;
    line-height: 14px;
}

.printing-houses-wrapper .item .total {
    font-size: 8px;
    font-family: var(--font_regular);
    color: #b6bbc5;
}

.printing-houses-wrapper .item a {
    position: relative;
    display: block;
    color: #5a6478;
    padding-top: 35px;
    height: 100%;
}

.printing-houses-wrapper .item .icon {
    margin-bottom: 27px;
}

.printing-houses-wrapper .item img {
    max-width: 48px;
    height: 48px;
}


.printing-houses-wrapper .item:last-of-type img {
    max-width: 40px;
}

.printing-houses-wrapper .item a .content {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding-bottom: 5px;
}

/* printing houses end*/


/* packages start*/

.packages .packages-wrapper > h2 {
    font-size: 14px;
    line-height: 16px;
    height: 16px;
    font-weight: 300;
    font-family: var(--font_regular);
    margin: 40px 0 31px;
    color: #6d788b;
}

.packages .buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding: 0 7px;
}

.packages .buttons li {
    position: relative;
    margin-bottom: 20px;
}

.packages li input {
    position: absolute;
}

.packages .buttons li label {
    display: block;
    cursor: pointer;
    height: 24px;
    width: 93px;
    text-align: center;
    line-height: 22px;
    border: 1px solid #b3b8c2;
    color: #b3b8c2;
    position: relative;
    font-size: 12px;
    font-family: var(--font_regular);
    border-radius: 20px;
}

.packages [type="radio"] {
    appearance: none;
}

.packages [type="radio"]::before {
    display: none;
}

.packages [type="radio"]::after {
    display: none;
}

.packages [type="checkbox"]:checked:after,
.packages [type="radio"]:checked:after {
    display: none !important;
}

.packages .buttons [type="radio"]:checked + label {
    background: #827ef3;
    border-color: #827ef3;
    color: #fff;
}

.packages .prices > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding: 0 7px;
}

.packages .prices label {
    text-align: center;
    border: 2px solid #ddd;
    display: block;
    cursor: pointer;
    width: 95px;
    height: 82px;
    border-radius: 7px;
    padding-top: 12px;
}

.packages .prices [type="radio"]:checked + label {
    border: 2px solid #827ef3;
}

.packages .prices label p {
    margin-bottom: 3px;
}

.packages .prices label p:first-of-type {
    font-size: 14px;
    line-height: 16px;
    font-family: var(--font_bold);
    color: #6d788b;
}
.packages .prices label p:nth-of-type(2) {
    font-size: 12px;
    line-height: 16px;
    color: #8a86f3;
}
.packages .prices label p:last-of-type {
    font-size: 11px;
    line-height: 16px;
    color: #a5acb7;
}

.packages .prices .package-prices,
.packages .features .package-features {
    display: none;
}

.packages .prices .package-prices.active {
    display: flex;
}

.packages .features .package-features.active {
    display: block;
}

.packages .features h2 {
    font-size: 16px;
    line-height: 35px;
    font-weight: 300;
    font-family: var(--font_bold);
    color: #68e1d2;
    margin-top: 20px;
    margin-bottom: 8px;
}

.features .feature {
    border-top: 2px solid #ebecee;
    padding: 10px 0;
}

.features .feature .feature-title {
    font-size: 14px;
    line-height: 22px;
    font-family: var(--font_bold);
    color: #6d788b;
}

.features .feature .feature-desc {
    font-size: 11px;
    line-height: 22px;
    color: #9fa5b0;
}

.features .feature .feature-desc::after {
    content: "";
    display: table;
    clear: both;
}

.features .feature .feature-desc span {
    float: left;
    margin-right: 15px;
}

.packages .fixed-buy-btn {
    position: fixed;
    width: 100%;
    right: 0;
    bottom: 20px;
}

.packages .fixed-buy-btn input[type=submit] {
    font-size: 22px;
    line-height: 30px;
    font-family: var(--font_bold);
    width: 100%;
    border: none;
    background-image: linear-gradient(to left, #69ded3, #827ff3);
    color: #fff;
    height: 48px;
    border-radius: 25px;
    cursor: pointer;
}

/* packages end*/




.printing-house-pages-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}


.printing-house-pages-wrapper .page {
    width: calc(50% - 4px);
    min-height: 175px;
    text-align: center;
    background: #fff;
    margin-bottom: 8px;
    border-radius: 8px;
    box-shadow: 0 0 6px 3px #e9e9e9;
    line-height: 1;
}

.printing-house-pages-wrapper .page > a {
    display: block;
}

.printing-houses-pages {
    margin: 8px 0;
}

.printing-house-pages-wrapper .page .logo {
    border: 1px solid #ddd;
    height: 80px;
    width: 80px;
    margin: 24px auto 20px;
    border-radius: 50%;
}

.printing-house-pages-wrapper .page .title {
    color: #6d788b;
    font-weight: 300;
    font-family: var(--font_bold);
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 2px;
    padding: 0 5px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.printing-house-pages-wrapper .page .address {
    color: var(--light_gray);
    font-size: 8px;
    font-family: var(--font_regular);
    line-height: 15px;
    padding: 0 5px;
    margin-bottom: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.printing-house-pages-wrapper .page .ratings {
    color: var(--light_gray);
    font-family: var(--font_regular);
    font-size: 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    padding: 0 11px;
}

.printing-house-pages-wrapper .page .ratings i {
    font-style: normal;
}

.printing-house-pages-wrapper .page .ratings .stars {
    color: #ddd;
    font-size: 11px;
}

.printing-house-pages-wrapper .page .ratings .stars i.lighted {
    color: #68e1d2;
}


.printing-houses-pages .add-btn-wrapper {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 77777;
}

.printing-houses-pages .add {
    position: relative;
    width: 100%;
    height: 48px;
    display: block;
    text-align: center;
    background: linear-gradient(to left,#69ded3 , #8183f1);
    margin: 0 0 8px;
    color: #fff;
    border-radius: 25px;
    line-height: 48px;
    font-size: 22px;
    font-family: var(--font_bold);
}


.page {
    line-height: 1;
}

.page .top-header {
    height: 200px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.page .top-header .container {
    height: 100%;
}

.page .page-logo {
    position: absolute;
    left: 15px;
    border: 1px solid #fff;
    height: 102px;
    width: 102px;
    bottom: -51px;
    border-radius: 50%;
    overflow: hidden;
}

.page .page-logo img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.page .back-btn {
    position: absolute;
    top: 15px;
    left: 15px;
    width: 40px;
    height: 40px;
    background: url(../images/left-arrow.icon.svg) no-repeat center left;
    background-size: 24px;
}

.page .share-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    background: url("../images/share.icon.svg") no-repeat center right;
    background-size: 28px;
    display: none;
}

.page .like-btn {
    content: "";
    width: 18px;
    height: 14px;
    background: url(../images/heart.white.icon.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    bottom: 10px;
    right: 10px;
    border: none;
    cursor: pointer;
}

.page .like-btn.active {
    background: url(../images/heart.icon.svg) no-repeat center;
    background-size: contain;
}

.page .page-info {
    color: var(--light_gray);
}

.page .page-info .container {
    padding-bottom: 20px;
    border-bottom: 1px solid #ddd;
}

.page .page-title {
    font-size: 18px;
    line-height: 24px;
    color: rgb(90, 100, 120);
    font-weight: 300;
    font-family: var(--font_bold);
    margin: 16px 0 6px;
    width: calc(100% - 102px);
    word-break: break-word;
}

.page .page-location {
    font-size: 11px;
    line-height: 16px;
    color: var(--light_gray);
    font-family: var(--font_regular);
    padding: 0 15px;
    position: relative;
    margin-bottom: 10px;
}

.page .page-location::before {
    position: absolute;
    content: "";
    width: 12px;
    height: 16px;
    right: 0;
    top: 2px;
    background: url(../images/location.icon.svg) no-repeat center right;
    background-size: 12px;
}

.page .rating span {
    font-size: 1.3em;
}

.page .rating span.lighted {
    color: #f9a42c;
}

.page .extra-info {
    margin: 10px 0 20px;
}

.page .extra-info::after {
    content: "";
    display: table;
    clear: both;
}

.page .followers {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
}

.page .followers > div {
    text-align: center;
    font-size: 10px;
    line-height: 16px;
}

.page .followers > div i {
    display: block;
    font-style: normal;
    font-size: 12px;
    line-height: 16px;
}

.page .member-type {
    display: inline-block;
    margin-left: 3px;
    border-radius: 10px;
    padding: 2px 8px;
    height: 16px;
    color: #fff;
    text-align: center;
    font-size: 9px;
    line-height: 11px;
}

.page .member-type.golden {
    background: #d6a800;
;
}

.page .member-type.platinum {
    background: #7ba3ca;
}


.page .member-type.free {
    background: #8f8f8f;
}


.page .join-date {
    display: inline-block;
    font-size: 9px;
}

.page .rating-num {
    text-align: left;
    font-size: 10px;
    float: left;
}

.page .rating-num i {
    font-style: normal;
    font-size: 8px;
    padding: 0 5px;
    border-radius: 5px;
    margin-right: 3px;
    color: #68e1d2;
    border: 1px solid #68e1d2;
}
.page-contacts-wrapper {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 88888;
}

.page .page-contacts {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    margin: 26px 0 0;
}

.page .page-contacts > a {
    width: 32.07%;
    height: 40px;
    border-radius: 24px;
    position: relative;
}

.page .page-contacts > a::after {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-size: 24px !important;
}

.page .page-contacts > a.phone {
    background: linear-gradient(to left, #68e0d2 , #70c4dc);
}

.page .page-contacts > a.phone::after {
    background-image: url("../images/phone-white.icon.svg");

}

.page .page-contacts > a.whatsapp {
    background: linear-gradient(to left, #71bede , #79a1e7);
}

.page .page-contacts > a.whatsapp::after {
    background-image: url("../images/whatsapp-white.icon.svg");

}

.page .page-contacts > a.share {
    background: linear-gradient(to left, #7b9aea , #827ef3);
    cursor: pointer;
}

.page .page-contacts > a.share::after {
    background-image: url("../images/share-white.icon.svg");
}

.page .page-body {
    margin-top: 16px;
}

.page .nav-buttons {
    display: flex;
    margin-bottom: 15px;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.page .nav-buttons > a {
    width: 70px;
    display: block;
    color: #fff;
    text-align: center;
    border-radius: 12px;
    font-family: var(--font_regular);
    font-size: 10px;
    line-height: 16px;
    background: rgba(0,0,0,.2);
}

.page .nav-buttons > a.active {
    background: linear-gradient(to left, #6ad8d5 , #827ef3);
    color: #fff;
}

.content-pages {
    color: var(--dark_gray);
}

.content-pages a {
    color: var(--dark_gray);
}

.content-pages a:hover {
    color: var(--dark_green);
}

.page .about-content {
    color: var(--dark_gray);
    font-size: 12px;
    line-height: 20px;
    word-break: break-word;
}

.page .page-body .container {
    padding-bottom: 15px;
}

.content-pages >div {
    display: none;
}

.content-pages >div.active {
    display: block;
}

#contactSection > div {
    height: 32px;
    border-bottom: 1px solid #dbdbdb;
    position: relative;
    padding-right: 32px;
    display: flex;
    align-items: center;
}

#contactSection > div:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 16px;
    height: 16px;
    transform: translateY(50%);
}

/*
** Share Buttons
*/


.share-buttons {
    position: fixed;
    height: 100vh;
    width: 100%;
    z-index: 999;
    top: 0;
    left: 0;
    /*background: rgb(57 93 97 / 85%);*/
    background: rgb(0 0 0 / 85%);
    display: none;
}

.share-buttons.show {
    display: initial;
}

.share-buttons .container {
    margin-top: 30vh;
    background: #fff;
    padding: 30px 10px;
    text-align: center;
    border-radius: 3px 0 3px 3px;
}

.share-buttons .close {
    position: absolute;
    top: -25px;
    right: 0;
    background: #e85b5b;
    color: #fff;
    font-size: 20px;
    width: 25px;
    height: 25px;
    line-height: 25px;
    border-radius: 2px 2px 0 0;
    cursor: pointer;
}

.share-buttons h3 {
    text-align: center;
    font-size: 14px;
    font-weight: 300;
    font-family: var(--font_regular);
    margin-bottom: 10px;
    color: var(--dark_gray);
}
.a2a_default_style:not(.a2a_flex_style) a {
    float:none !important;
    display: inline-block
}





/*
* Rating Section
*/
.rates input[type=radio] {
    appearance: none;
}

.rates input[type=submit] {
    display: none;
}

.rates-title {
    text-align: center;
    font-size: 12px;
    margin: 10px 0;
}

.stars-wrapper {
    text-align: center;
    font-size: 24px;
    direction: ltr;
    color: #ddd;
    display: block;
    width: 190px;
    margin: 0 auto 15px
}

.stars-wrapper.active {
    color:#e5ab45;
}

.stars-wrapper.active label.active ~ label {
    color: #ddd;
}

.stars-wrapper label {
    cursor: pointer;
    transition: .1s ease;
    display: inline-block;
    margin: 0 5px;
}

.stars-wrapper:hover label {
    color:#e5ab45 !important;
}

.stars-wrapper label:hover ~ label {
    color: #ddd !important;
}


/*rates*/


.rate-wrapper {
    position: relative;
    height: 34px;
    font-size: 11px;
    margin-bottom: 15px;
}

.rate-wrapper::before {
    content: "";
    height: 16px;
    background: rgba(0,0,0,.1);
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.rate-wrapper .rate-value {
    position: absolute;
    top: 0;
    left: 0;
}

.rate-wrapper .rate-name {
    position: absolute;
    top: 0;
    right: 0;
}

.rate-wrapper::after {
    content: "";
    height: 16px;
    bottom: 0;
    background: #827ef3;
    width: 0;
    left: 0;
    z-index: 222;
    position: absolute;
}

.all-rates .rate1::after {
    width: 85%;
}

.all-rates .rate2::after {
    width: 70%;
}

.all-rates .rate3::after {
    width: 55%;
}

.all-rates .rate4::after {
    width: 40%;
}

.all-rates .rate5::after {
    width: 25%;
}

.create-press h2 {
    font-family: var(--font_bold);
    font-size: 18px;
    line-height: 34px;
    color: #68e1d2;
    padding-top: 48px;
    padding-bottom: 15px;
}



/*
.create-printing-form-wrapper h2 {
    font-family: var(--font_bold);
    font-size: 18px;
    line-height: 34px;
    color: #68e1d2;
    padding-top: 48px;
    padding-bottom: 15px;}


.create-printing-form-wrapper .form-group input[type=file] + label {
    margin: 0;
    padding: 50px;
    color: #f5f5f7;
    background: #f5f5f7;
}

.create-printing-form-wrapper .form-group input[type=file] + label:after {
    background-size: 26px;
}

.create-printing-form-wrapper .form-group  {
    margin-bottom: 16px;
}

.create-printing-form-wrapper .form-group input, .create-printing-form-wrapper .form-group select {
    width: 100%;
    border: none;
    background-color: #f5f5f7;
    font-size: 14px;
    line-height: 24px;
    font-family: var(--font_regular);
    padding: 0 8px;
    height: 36px;
    border-radius: 7px;
    color: #6d788b;
}

.create-printing-form-wrapper .form-group select {
    appearance: none;
}

.create-printing-form-wrapper .form-group:not(:first-of-type)::after {
    content: "";
    width: 16px;
    height: 16px;
    background: #76e2d3;
    position: absolute;
    left: 7px;
    top: 50%;
    transform: translateY(-50%);
}
*/


.profile-info {
    margin: 15px 0 8px;
}

.profile-info .profile-img {
    width: 80px;
    float: right;
}

.profile-info .profile-img img {
    max-width: 100%;
    border-radius: 50%;
    width: 80px;
    height: 80px;
}

.profile-info h3 {
    clear: both;
    font-weight: 300;
    font-family: var(--font_regular);
    color: var(--dark_gray);
    font-size: 14px;
    padding-top: 8px;
}

.profile-info .profile-details {
    float: right;
    margin-right: 15px;
    color: var(--dark_gray);
    padding-top: 15px;
    font-size: 12px;
    line-height: 17px;
}

.profile-info .profile-details::after {
    content: "";
    display: block;
    clear: both;
}

.profile-info .profile-details a {
    color: #3a77ff;
}

/*comments*/
.comment-icon {
    background: url(../images/chat.icon.svg) no-repeat;
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-left: 10px;
    background-size: 20px;
    position: relative;
    top: 5px;
}

.comments h3, .ad-author h3 {
    padding: 10px 0 10px 10px;
    color: var(--dark_gray);
    font-size: 14px;
    font-weight: 300;
    font-family: var(--font_bold);
}

.all-comments {
    max-height: 200px;
    overflow: auto;
}
.comments .comment {
    margin-bottom: 3px;
    background: #f9f9f9;
}

.comments .comment::after {
    content: "";
    display: block;
    clear: both;
}

.comments .comment .user {
    float: right;
    width: 60px;
    text-align: center;
    background: #ebebeb;
}

.comments .comment .user a {
    color: #000;
}

.comments .comment .user img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
}

.comments .comment .user span {
    display: block;
}

.comments .comment .comment-body {
    float: right;
    padding: 15px;
    width: calc(100% - 60px);
}

.comments .comment-box {
    margin-bottom: 10px;
    display: flex;
    flex-wrap: nowrap;
}

.comments .comment-box textarea {
    height: auto;
    margin-bottom: 0;
    border-radius: 0 7px 7px 0;
}

.comments .comment-box button {
    font-size: 12px;
    font-family: var(--font_regular);
    border: none;
    padding: 4px 8px;
    border-radius: 7px 0 0 7px;
    color: #fff;
    background: #73b7e0;
    cursor: pointer;
}

.related-ads {
    margin-bottom: 15px;
}

.related-ads .related-title {
    padding: 10px 0 10px 10px;
    color: var(--dark_gray);
    font-size: 14px;
    font-weight: 300;
    font-family: var(--font_regular);
    text-align: center;
}

.related-ads .item {
    background: #fff;
    direction: rtl;
    width: 160px;
    min-height: 220px;
    margin: auto;
}

.related-ads .item a {
    display: block;
    padding-bottom: 7px;
}

.related-ads .item h3,.related-ads .item p {
    font-size: 11px;
    font-family: var(--font_regular);
    font-weight: 300;
    color: #6d788b;
    padding: 2px 7px;
}

.related-ads .price b {
    font-weight: 300;
    font-size: 15px;
    line-height: 15px;
    font-family: var(--font_regular);
}

/*notify*/
.notifications-wrapper {
    padding: 16px 0;
}

.notify {
    position: relative;
    background: #fff;
    margin-bottom: 8px;
    padding: 7px;
    font-size: 12px;
    font-family: var(--font_regular);
    font-weight: 300;
    line-height: 16px;
    color: var(--dark_gray);
    border-radius: 7px;
}

h3.notify {
    margin: 16px 0;
    font-weight: 300;
    color: var(--dark_gray);
    height: 48px;
    display: block;
    width: 100%;
    padding: 0 8px 0;
    border-radius: 7px;
    border: none;
    background: #fff;
    box-shadow: 0 0 5px 2px #e1e1e1;
    font-family: var(--font_regular);
    font-size: 14px;
    text-align: center;
    line-height: 48px;
}

.notify a {
    text-decoration: underline;
    color: #649edc;
}

.notify .notify-date {
    display: block;
    color: #b4bac4;
    font-size: 10px;
    position: absolute;
    bottom: 7px;
    left: 30px;
}

.notify .action {
    display: flex;
    align-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-top: 7px;
}

.notify .action a {
    text-decoration: none;
    display: block;
    height: 20px;
    color: #5a6478;
    position: relative;
    border-radius: 25px;
    padding: 1px 1px;
    overflow: hidden;
    margin-left: 8px;
}

.notify .action a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to left, #8183f1, #8183f1,#69ded3,#69ded3 );
}

.notify .action a span {
    position: relative;
    background: #fff;
    display: block;
    border-radius: 25px;
    width: 100%;
    height: 100%;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    font-family: var(--font_regular);
    padding: 0 8px;
}


.notify.not-read {
    position: relative;
}

.notify.not-read::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ff5720;
    position: absolute;
    left: 7px;
/*    top: 50%;
    transform: translateY(-50%);*/
    bottom: 15px;
}
.hidden {
    display: none;
}

/*
* contact us page
*/

.contact-us {
    padding: 16px 0;
}

.contact-comm {
    padding: 10px 10px 10px 0;
    border-bottom: 1px solid #e6e7ea;
}
.contact-comm a {
    direction: ltr;
    display: inline-block;
    font-size: 14px;
    line-height: 24px;
    color: #6d788b;
    transition: .25s ease;
    padding-right: 32px;
    background: url("../images/tel.contact.icon.svg") no-repeat right center;
    background-size: 18px 18px;
}

.contact-comm a:hover {
    color: #827ef3;
}

.contact-comm a.tel {
    background-image: url("../images/tel.contact.icon.svg");
}
.contact-comm a.mobile {
    background-image: url("../images/mobile.contact.icon.svg");
}
.contact-comm a.link {
    background-image: url("../images/url.contact.icon.svg");
}
.contact-comm a.email {
    background-image: url("../images/email.contact.icon.svg");
}
.contact-comm a.facebook {
    background-image: url("../images/facebook.contact.icon.svg");
}
.contact-comm a.instagram {
    background-image: url("../images/instagram.contact.icon.svg");
}
.contact-comm a.twitter {
    background-image: url("../images/twitter.contact.icon.svg");
}

.contact-form-heading {
    font-size: 18px;
    line-height: 24px;
    color: #827ef3;
    font-weight: 700;
    font-family: var(--font_bold);
    margin: 32px 0 16px;
}
.contact-us .form-group {
    margin-bottom: 8px;
}


.contact-us input, .contact-us textarea {
    font-size: 12px;
    line-height: 24px;
    font-family: var(--font_regular);
    padding: 5px 8px;
    border: 1px solid #edeef0;
    width: 100%;
    border-radius: 7px;
    background: url(../images/edit.gray.icon.svg) no-repeat 10px 11px;
    background-size: 16px;
}

.contact-us textarea {
    min-width: 100%;
    max-width: 100%;
    min-height: 122px;
}

.contact-us input[type=submit] {
    background: #827ef3;
    border: 2px solid transparent;
}

.contact-us input[disabled='disabled'] {
    background: #e5e5e5;
}

.contact-us input:not([type=submit]), .contact-us textarea {
    padding-left: 30px;
}



.pages {
    padding: 50px 15px;
    color: var(--dark_gray);
    font-size: 12px;
    line-height: 1.242;
    word-break: break-word;
}

.vip-ads {
    margin-bottom: 16px;
    border-bottom: 1px solid #ddd;
}

.vip {
    overflow: hidden;
}

.vip:before {
    content: "مميز ★";
    display: block;
    position: absolute;
    left: -19px;
    top: 6px;
    width: 60px;
    font-size: 12px;
    direction: ltr;
    background: #e5ab45;
    color: #fff;
    padding: 5px;
    text-align: center;
    transform: rotate(315deg);
}

.ads .ad-item.vip .ad-title {
    padding-left: 25px;
}

input, select {
    line-height: 1.7 !important;
    padding-bottom: 3px !important;
}

.fav-nav ul {
    display: flex;
    justify-content: space-between;
}

.fav-nav {
    margin: 16px 0 0;
}

.fav-nav li a {
    display: block;
    padding: 3px 0;
    border-radius: 25px;
    background: #d8d9de;
    text-align: center;
    color: #fff;
    font-size: 10px;
}

.fav-nav li {
    width: calc(100%/5 - 28px/4);
}

.fav-nav li a.active {
    background: linear-gradient(to left, #5bd3ca, #6e68f0);
}