* {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    --webkit-box-sizing: border-box;
    --moz-box-sizing: border-box;
    --moz-box-sizing: border-box;
}

:root {
    --main_color: #5349f8;
    --gray_light: #F9F9F9;
    --black_color: #292d32;
    --green_color: #36AE7C;
    --white_color: #fff;
    --input_bg_color: #EEf3ff;
    --border_color: #CBCBCB;
    --pink_color: #ED3573;
}

@font-face {
  font-family: "IranSansX";
  src: url("../font/IranSansX/Farsi-numerals/Webfonts/Woff2/IRANSansXFaNum-Regular.woff2")
      format("woff2"),
    url("../font/IranSansX/Farsi-numerals/Webfonts/Woff/IRANSansXFaNum-Regular.woff")
      format("woff");
  font-weight: normal;
}

body {
    font-family: "IranSansX";
}

.label_red {
    background: var(--pink_color);
    border-radius: 20px;
    padding: 6px 13px;
    color: var(--white_color);
}

.card_attribute {
    background: var(--white_color);
    border: 1px solid var(--border_color);
    border-radius: 10px;
}

.swiper {
    width: 100%;
    border-radius: 20px;
}

.swiper-wrapper {
    -webkit-transition-timing-function: linear !important;
    -o-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
}

.swiper-slide {
    text-align: center;
    font-size: 16px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 20px;
    padding-top: 8px;
}

.swiper-button-next,
.swiper-button-prev {
    top: 28% !important;
    background-color: var(--white_color);
    color: var(--black_color) !important;
    border: 1px solid var(--border_color);
    border-radius: 50px;
    padding: 20px !important;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 25px !important;
}

.swiper-slide .card {
    background: var(--white_color);
    border-radius: 10px;
    border: none;
    width: 100%;
    height: 335px;
}

.swiper a {
    text-decoration: none;
}

.view img {
    border-radius: 10px 10px 0px 65px;
    width: 100%;
    height: 208px;
}

.card {
    border: none;
    border-radius: 15px;
    transition: all .5s;
    text-align: start;
}

.card:hover {
    -ms-transform: scale(1.02);
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
}

.card .card-img-top {
    border-radius: 15px;
    height: 198px;
}

.card .outline_heart {
    background-image: url('../img/outline_heart.svg');
    background-repeat: no-repeat;
    width: 21.5px;
    height: 19.3px;
}

.card .bold_heart {
    background-image: url('../img/bold_heart.svg');
    background-repeat: no-repeat;
    width: 25px;
    height: 23px;
}

.card .card-body .card-text {
    color: var(--black_color);
    font-size: 14px;
}

.card .card-body .card-title {
    color: var(--black_color);
}

.card .meter {
    padding: 5px 13px;
    background: var(--gray_light);
    border-radius: 20px;
    font-size: 12px;
    color: var(--black_color);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 1vh;
    right: 1vh;
    box-shadow: 0px 0px 20px rgba(136, 136, 136, 0.3);
}

.card .ofeer {
    padding: 5px 10px;
    background: var(--pink_color);
    border-radius: 20px;
    font-size: 12px;
    color: var(--white_color);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 1vh;
    left: 1vh;
    box-shadow: 0px 0px 20px rgba(136, 136, 136, 0.3);
}

.card .heart {
    width: 37px;
    height: 37px;
    background: var(--gray_light);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 1vh;
    right: 1vh;
}

.card .card-body .code {
    padding: 3px 15px;
    background: var(--pink_color);
    border-radius: 20px;
    font-size: 12px;
    color: var(--white_color);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* //////////////// */

.bg_check_attribute {
    width: 100%;
    height: 50px;
    background: var(--white_color);
    border: 1px solid var(--border_color);
    border-radius: 28px;
}

.form-control {
    width: 100%;
    height: 40px;
    background: var(--white_color);
    border: 1px solid var(--border_color);
    border-radius: 28px;
}

.btn_record {
    width: 100%;
    height: 40px;
    background: var(--green_color) !important;
    border-radius: 25px;
    color: var(--white_color) !important;
    -webkit-transition: all 0.50s ease-in-out;
    -moz-transition: all 0.50s ease-in-out;
    -ms-transition: all 0.50s ease-in-out;
    transition: all 0.50s ease-in-out;
    border: none;
    outline: none;
}

.btn_record:hover {
    box-shadow: 0px 2px 8px var(--green_color);
    color: var(--black_color) !important;
}

.bg_specification {
    width: 100px;
    height: 76px;
    background: var(--gray_light);
    box-shadow: 0px 0px 15px rgba(136, 136, 136, 0.3);
    border-radius: 7px;
}

.bg_icon_specification {
    width: 63px;
    height: 63px;
    background: var(--gray_light);
    box-shadow: 0px 0px 15px rgba(136, 136, 136, 0.3);
    border-radius: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.img_bilbord {
    width: 100%;
    height: 534px;
    border-radius: 15px;
}

.map {
    width: 100%;
    height: 542px;
}

@media screen and (max-width:576px) {
    .img_bilbord {
        height: 350px;
    }

    .map {
        height: 350px;
    }
}