
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background-color: white;
}

::-webkit-scrollbar-thumb {
    background-color: lightslategrey;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #aaaaaa;

}

html {
    scroll-behavior: smooth;
}

@font-face {
    font-family: "yekan";
    src: url("fonts/yekan.ttf") format("truetype"),
    url("fonts/yekan.eot?#iefix") format("embedded-opentype");
}


ul {
    padding: 0;
    margin: 0;
    text-decoration: none;
    list-style-type: none;
}

a {
    text-decoration: none;
    color: black;

}


.firoze {
    background: #19bea5;
}

.text-justify {
    text-align: justify;
}

.border-bottom-light {
    border-bottom: 1px solid #eeeeee;
}

.border-bottom-red {
    border-bottom: 2px solid #f20800;
}

.border-top-light {
    border-top: 1px solid #eeeeee;
}

.bg-blue-light {
    background: rgba(3, 249, 249, 0.13);
}

.bg-green-light {
    background: rgba(0, 186, 22, 0.13);
}

.fs-7 {
    font-size: 11pt;
}

.fs-8 {
    font-size: 10pt;
}

.fs-9 {
    font-size: 9pt;
}

.fs-10 {
    font-size: 8pt;
}

.titleFontMd {
    font-size: 14pt;

}

.titleFontMd12 {
    font-size: 14pt;
}

.titleFontMd11 {
    font-size: 13pt;
}

.titleFontMd10 {
    font-size: 12pt;
}

.footer .titleFooter {

    font-size: 12pt;

}

a.disabled {
    pointer-events: none;
    cursor: default;
}

.yellow {
    color: #fef200;
}

.bgYellow {
    background: #fef200;
}

.pointer {
    cursor: pointer;
}

.color-red {

    color: #f20800;
}

.color-light {
    color: #aaaaaa;
}


.btn-self {

    background: #fef200;
    width: max-content;
    height: 55px;
    font-size: 13pt;
    color: black;
    padding: 15px;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    position: relative;
    top: 0;
    transition: all .25s ease-in;
}

.btn-normal {

    background: linear-gradient(to right, rgba(144, 30, 193, 0.90) 0%, rgb(107, 73, 238, 0.90) 51%, rgba(144, 30, 193, 0.90) 100%);
    color: white;
    width: 250px;
    height: 50px;
    font-size: 12pt;

    padding: 10px;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    font-weight: 999;
    line-height: 30px;
    transition: all .1s ease-in;
    display: block;
}

.btn-normal:hover {
    color: black;
    background: #fef200;
}

.btn-self:hover {

    position: relative;
    top: -5px;
    box-shadow: 0 10px 20px 0 rgba(54, 1, 73, 0.1);

}

.mainTop {

    width: 100%;
    height: 100vh;
    position: relative;
    top: 0;
    background: url("images/dubai-cityscape.jpeg") no-repeat center;
    background-size: 100% 100%;
}

.mainTop::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    right: 0;

    background: linear-gradient(to right, rgba(144, 30, 193, 0.90) 0%, rgb(107, 73, 238, 0.90) 51%, rgba(144, 30, 193, 0.90) 100%);

}


.menu .bg-body-tertiary {


    background: rgba(0, 0, 0, 0) !important;


}

.line {
    width: 90%;
    height: 1px;
    background: #9400de;
    position: relative;
    top: 12px;
    margin: 0 auto;
}

.mainTop .menu .logo .navbar-brand img {
    height: 80px;
    width: 90px;
    max-height: 80px;
    max-width: 300px;
    margin-top: 1px;
}

.menu {
    position: fixed;
    top: 10px !important;
    padding: 0;
    height: 75px;
    width: 100%;
    transition: top 100ms linear;
    z-index: 101;
}

.menu.active {

    top: 0 !important;
}

.menu.active .bg-body-tertiary {

    background: var(--fs-menu-bg, #fef200) !important;

}

.menu .navbar {
    height: 75px;
    padding: 0;
    z-index: 10;
}

.mainTop .menuTel {
    color: white;
}

.mainTop .menuTel a {
    color: inherit;
}

.menu.active .menuTel,
.menu.active .menuTel a {
    color: var(--fs-menu-text, #000000) !important;
}

@keyframes Car {

    0% {
        opacity: 1;
        left: -10px;
    }

    50% {
        opacity: .3;
        left: 25px;
    }
    100% {
        opacity: 1;
        left: -10px;
    }

}

.pointer-event {
    pointer-events: none;
}

.animation .wave {

    position: absolute;
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 100px;
    background: url("images/wave.svg");
    background-size: 2000px 200px;
    opacity: .9;
}

.wave .wave1 {
    animation: animate 20s linear infinite;
    z-index: 9;
    animation-delay: 0s;
    opacity: .8;

}

.animation .wave2 {
    animation: animate2 15s linear infinite;
    z-index: 8;
    animation-delay: 0s;
    opacity: .5;


}

.animation .wave3 {
    animation: animate3 10s linear infinite;
    z-index: 8;
    animation-delay: 0s;
    opacity: .5;


}

.animation .wave4 {
    animation: animate4 10s linear infinite;
    z-index: 8;
    animation-delay: 0s;
    opacity: .5;


}

@keyframes animate {
    0% {
        background-position-x: 0;
    }
    100% {
        background-position-x: 3000px;
        padding-bottom: 40px;


    }
}

@keyframes animate2 {
    0% {
        background-position-x: 0;

    }
    100% {
        background-position-x: -2000px;
        padding-bottom: 40px;

    }
}

@keyframes animate3 {
    0% {
        background-position-x: 0;

    }
    100% {
        background-position-x: 1000px;

    }
}

@keyframes animate4 {
    0% {
        background-position-x: 0;

    }
    100% {
        background-position-x: -500px;

    }
}


.sliderAll {
    width: 100%;
    height: 80vh;
    position: relative;
    top: 90px;
}

.sliderAll .content {
    width: 100%;
    height: 80vh;


}

.slider {

    width: 100%;
    height: 80vh;
    overflow-x: auto;
    position: relative;
    /* scroll-snap-type: x mandatory;*/
}

.slider::-webkit-scrollbar {
    display: none;
}

.slider {
    -ms-overflow-style: none;
    scrollbar-width: none;
    touch-action: pan-y;       /* اجازه اسکرول عمودی */
    -ms-touch-action: pan-y;   /* برای IE قدیمی */

}

.right4500 {
    width: 100%;
    height: 100%;
}

.slider-content {

    height: 100%;
    width: 100%;
    text-align: center;

}

.sliderComplete {
    width: 100%;
    height: 100%;
    scroll-snap-align: center;
}

.sliderRight {
    width: 50%;
    height: 100%;
}

.sliderLeft {
    width: 50%;
    height: 86%;
}


.slider .slider-content .sliderRight img {
    width: 90%;
    height: 100%;

}

.sliderRight a {
    width: 100%;
    height: 90%;
}

.hidden {
    width: 100%;
    height: 20px;
    position: absolute;
    bottom: 0;
    z-index: 1;
    background: white;
}

.arrow-right-slider {
    content: '';
    width: 55px;
    height: 55px;
    border-radius: 100%;
    display: none;
    background: white url("images/arrow-right-slider.png") no-repeat center;
    margin: 0 auto;
    cursor: pointer;
    border: 1px solid #aaaaaa;
    position: absolute;
    top: 85%;
    left: 25%;
    z-index: 8;
}

.arrow-left-slider {
    content: '';
    width: 55px;
    height: 55px;
    border-radius: 100%;
    display: none;
    background: white url("images/arrow-left-slider.png") no-repeat center;
    cursor: pointer;
    border: 1px solid #aaaaaa;
    position: absolute;
    top: 85%;
    left: 20%;
    z-index: 8;
}

.navigator {
    display: flex;
    bottom: 5%;
    position: absolute;
    right: 50px;
    left: 0;
    margin: 0 auto;

}

.navigator span {
    width: 20px;
    height: 20px;
    background: #6c757d;
    border-radius: 100%;
    margin-right: 10px;

    z-index: 9;
}

.sliderAll .sliderP {
    font-size: 13pt;
    color: white;
}

.sliderAll .sliderTitle {
    font-size: 25pt;
    font-weight: bolder;

}

.dark {
    min-width: 100%;
    display: none;
    width: 100%;
    height: 100%;
    min-height: 650px;
    max-height: max-content;
    position: fixed;
    top: 0;
    right: 0;
    overflow-x: auto;

    background: rgba(15, 0, 71, 0.6);
    z-index: 1000;
}

.requestModal {
    width: 40%;
    min-width: 40%;
    height: 80%;
    min-height: 80%;
    background: white;
    z-index: 20;
    position: relative;
    top: 10%;
    right: 0;
    left: 0;
    border-radius: 10px;
    margin: 0 auto;
    overflow: hidden;
    box-shadow: 0 0 10px 6px #6610f2;

}

.dark .modelP {

    font-size: 13pt;
}

.dark .inputModel {
    width: 100%;

    text-align: center;

}


.inputDiv {
    width: 50%;
    height: 40px;
    position: relative;
}

.inputDiv .input {
    width: 90%;
    height: 36px;
    border: none;
    border-bottom: 1px solid #cccccc;
    border-radius: 5px;
    font-size: 10pt;

}

.inputDiv .label {
    position: absolute;
    right: 20px;
    top: 0;
    font-size: 10pt;
    color: #aaaaaa;
    transition: all .1s linear;
}

input:focus {
    outline: none;
}

.inputDiv .label.active {
    right: 7px;
    top: -15px;
    font-size: 9pt;
    color: rgba(0, 0, 0, 0.77);
}

.birthday {
    position: relative;
    top: -7px;
    width: 50%;
    z-index: 20;
}

.select-birthday {
    width: 87%;
    height: 45px;
    background: white;
    border-bottom: 1px solid #cccccc;
    border-radius: 10px;
    margin-left: 10px;
    z-index: 2;
    line-height: 12px;

}

.show-birthday {
    width: 100%;
    height: 150px;
    border: 1px solid #cccccc;
    border-radius: 10px;
    overflow-y: auto;
    font-size: 10pt;
    font-weight: bold;
    background: white;
    display: none;
}

.underSlider {
    height: max-content;
}

.underSlider .left img {
    max-width: 200px;
    max-height: 40px;

}


.underSlider .callImg {

    width: 55px;
    height: 55px;
    background: #fef200;
    border-radius: 100%;
    overflow: hidden;
    text-align: center;
}

.underSlider .callImg span {
    background: url("images/call-40.png") no-repeat center;
    display: block;
    width: 55px;
    height: 55px;

}

.underSlider .card {

    box-shadow: 0 0 4px 4px #f0f0f0;
    border: none;
    padding: 10px;
}


.underSlider .card img {
    width: 50%;
    height: 50%;
}

.picturePosition {
    width: 100%;
    height: max-content;

}

.picturePosition .allImg {
    width: 100%;
    height: 100%;
    position: relative;
}

.picturePosition .allImg .img1 {
    position: absolute;
    top: -80px;
    left: 20px;
    width: 55%;
    height: 380px;
    z-index: 2;
}

.picturePosition .allImg .img2 {
    position: absolute;
    top: -20px;
    right: 20px;
    width: 200px;
    height: 150px;
    z-index: 2;
}

.picturePosition .allImg .img3 {
    position: absolute;
    bottom: 0;

    right: 15px;
    width: 60%;
    height: 330px;
}

.cardAll {
    background: #f5f5f5;

}

.cardAll .card {
    height: 400px;
}

.cardAll .card-img-top {

    width: 100% !important;
    height: 399px !important;

}

.icon-searchRead {
    width: 30px;
    height: 30px;
}

.cardAll .titleCard .titleSpan {
    position: relative;
    margin-right: 107px;

    bottom: 80px;
    color: white;
    font-size: 14pt;
    font-weight: bolder;
    width: 70%;
    text-align: justify;
    text-shadow: 1px 2px 2px 2px black;
    z-index: 10;

}

.cardAll .cardDark {
    width: 100%;
    position: absolute;
    bottom: 0;
    height: 200px;

    background: linear-gradient(180deg, rgba(0, 0, 0, .01) 0%, rgba(0, 0, 0, .9) 100%);

}

.cardAll .titleCard .circleImgCard {
    width: 90px;
    height: 90px;
    background: #fef200;
    border-radius: 100%;
    position: absolute;
    z-index: 10;
    bottom: 20px;
    right: 10px;
    overflow: hidden;
    padding: 10px;
    border: .3px solid black;
}

.cardAll .titleCard .circleImgCard img {

    width: 80%;
    height: 80%;
    margin-top: 6px;

}

.footer {
    background: black;
    width: 100%;
    height: 550px;
}

.footer .imgLogoFooter img {
    width: 100%;
    height: max-content;
}

.footer .sotial div {

    width: 50px;
    height: 50px;
    padding: 5px;
    display: block;
    border-radius: 100%;
    background: rgb(42 42 42);
    overflow: hidden;
}

.footer .sotial .instagram {

    width: 100%;
    height: 100%;
    display: block;
    background: url("images/instagram.png") no-repeat center;
    cursor: pointer;
}

.footer .sotial div:hover {
    background: #fef200 !important;
}

.footer .sotial div:hover .instagram {

    background: url("images/instagramBlack.png") no-repeat center;
}

.footer .sotial div:hover .whatsapp {

    background: url("images/whatsappBlack.png") no-repeat center;
}

.footer .sotial .whatsapp {

    width: 100%;
    height: 100%;
    display: block;
    background: url("images/whatsapp-30.png") no-repeat center;
    cursor: pointer;
}

.footer .titleFooter {
    color: #fef200;
    font-size: 17pt;
    font-weight: bolder;
}

.footer .footerUl ul {
    width: 100%;
}

.footer .footerUl ul li {
    width: 100%;
    padding: 10px 0;
    color: white;
    text-align: justify;

}

.footer .footerUl ul li::before {

    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #fef200;
    border-radius: 100%;
    margin-left: 10px;


}

.footer .aboutUs {
    color: white;
}

.footer .locationIcon {
    width: 30px;
    height: 30px;
    display: block;
    background: url("images/location-30.png") no-repeat center;
}

.footer .clockIcon {
    width: 30px;
    height: 30px;
    display: block;
    background: url("images/clock-30.png") no-repeat center;
}

/*

order

*/


.menuSticky::-webkit-scrollbar {
    display: none;

}

.menuSticky {
    -ms-overflow-style: none;
    scrollbar-width: none;

}

.menuSticky {
    position: sticky;
    overflow-y: auto;
    top: 0;
    width: 100% !important;
    z-index: 9;
}


.line-muted {
    width: 80%;
    height: 1px;
    background: #ced4da;
    margin: 12px 10px;


}

.lineRed {
    width: 100px;
    height: 1px;
    border: 1.5px solid rgba(144, 30, 193, 0.99);

    right: 0;
    margin-top: 1rem;
}

.index {
    display: block;
}

.allTitle {
    position: relative;
    height: 50px;
}

a.disabled {
    pointer-events: none;
    cursor: default;
}

.icon-arrow-left {
    display: block;
    background: url("images/arrow-left.png") center no-repeat;
    width: 32px;
    height: 32px;
    transform: scale(.7);
    position: relative;
    top: -5px;
}

.right {
    width: 20%;
}

.left {
    width: 100%;
}

.circle {

    width: 18px;
    height: 18px;
    border-radius: 100%;
    display: block;
    border: 1px solid #cccccc;
    position: relative;
}

.circle-into {

    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    display: none;
    background: linear-gradient(to right, rgba(144, 30, 193, 0.90) 0%, rgb(107, 73, 238, 0.90) 51%, rgba(144, 30, 193, 0.90) 100%);
    z-index: 1;
    left: 3px;
    top: 3px;

}

.letter {
    background: url("images/letter.png") no-repeat;
    width: 18px;
    height: 18px;
    display: block;
}

.iconContact {
    width: 16px;
    height: 16px;

    background: url("images/icons8-contact-16.png") no-repeat;

}


.iphone {
    background: url("images/iphone.png") no-repeat;
    width: 18px;
    height: 18px;
    display: block;
}

.user {
    background: url("images/user.png") no-repeat;
    width: 18px;
    height: 18px;
    display: block;
}

.plate {
    background: url("images/plate.png") no-repeat;
    width: 18px;
    height: 18px;
    display: block;
}

.circle-bank {

    width: 18px;
    height: 18px;
    border-radius: 100%;
    display: block;
    border: 1px solid #cccccc;
    position: relative;
}

.circle-into-bank {

    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    display: none;
    background: linear-gradient(to right, rgba(144, 30, 193, 0.90) 0%, rgb(107, 73, 238, 0.90) 51%, rgba(144, 30, 193, 0.90) 100%);
    z-index: 1;
    left: 3px;
    top: 3px;

}


.address {
    width: 80%;
}

.address p {

    font-size: 9pt;
    text-align: justify;
    width: max-content;
    max-width: 80%;
    overflow-wrap: break-word;

}

.address-modal-into {

    position: fixed;
    top: 10%;
    width: 50%;
    height: 70%;
    background: white;
    z-index: 112;
    border-radius: 10px;
    display: none;
    overflow: hidden;
    color: #6c757d;
    font-size: 10pt;
}

.repeat {
    position: fixed;
    top: 30%;
    width: 70%;
    height: 30%;
    background: white;
    color: rgba(0, 52, 255, 0.84);
    display: none;
    z-index: 2000;
    border: 1px solid #cccccc;

}

.dark-repeat {
    width: 100vw;
    z-index: 100;
    height: 100vh;
    background: rgba(0, 0, 0, 0.12);
    position: fixed;
    top: 0;
    display: none;
}

.close-repeat {
    background: url("images/close.png") no-repeat;
    width: 32px;
    height: 32px;
    position: absolute;
    left: 15px;
    top: 15px;
    z-index: 1999;
    transform: scale(.7);
}


.sep img {
    background: url("images/saman1.jpg") no-repeat center;
    width: 100px;
    height: 50px;
    position: relative;
    top: -15px;
    margin-right: 15px;


}

.dark {
    width: 100%;
    height: 100%;
    background: rgba(15, 0, 71, 0.36);
    position: fixed;
    display: none;
    top: 0;
    z-index: 101;

}

.dark2 {
    width: 100%;
    height: 100%;
    background: rgba(15, 0, 71, 0.36);
    position: fixed;
    display: none;
    top: 0;
    z-index: 101;

}

.dark1 {
    width: 100%;
    height: 100%;
    background: rgba(15, 0, 71, 0.36);
    position: fixed;
    display: none;
    top: 0;
    z-index: 101;

}

.dark3 {
    width: 100%;
    height: 100%;
    background: rgba(15, 0, 71, 0.36);
    position: fixed;
    display: none;
    top: 0;
    z-index: 101;

}

.color-yellow {

    color: #fef200;
}


.motorcycle {
    background: url("images/motorcycle.png");
    width: 45px;
    height: 45px;
    display: block;
    position: relative;
    top: -19px;

}

.delivery {
    background: url("images/delivery.png");
    width: 45px;
    height: 45px;
    display: block;
    position: relative;
    top: -19px;

}

.section {
    display: flex;

}

.layout {
    min-height: 900px;
}

.inputDiv {
    width: 50%;
    height: 40px;
    position: relative;
}

.inputDiv .input {
    width: 90%;
    height: 36px;
    border: none;
    border-bottom: 1px solid #cccccc;
    border-radius: 5px;
    font-size: 10pt;

}

.inputDiv .label {
    position: absolute;
    right: 20px;
    top: 0;
    font-size: 10pt;
    color: #aaaaaa;
    transition: all .1s linear;
}

input:focus {
    outline: none;
}

.inputDiv .label.active {
    right: 7px;
    top: -15px;
    font-size: 9pt;
    color: rgba(0, 0, 0, 0.77);
}


.select-birthday {
    width: 97%;
    height: 55px;
    background: white;
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin-left: 10px;
    z-index: 2;

}

.show-birthday {
    width: 100%;
    height: 150px;
    border: 1px solid #cccccc;
    border-radius: 10px;
    overflow-y: auto;
    font-size: 10pt;
    font-weight: bold;
    background: white;
    display: none;
}

.maleDiv input {
    width: 17px;
    height: 17px;
}

.icon-location {
    background: url("images/circle.png") no-repeat center;
    width: 38px;
    height: 32px;
    display: block;
    position: relative;
    top: -6px;
    z-index: 1;
}

.edit-icon {
    background: url("images/edit-18.png") no-repeat center;
    width: 18px;
    height: 18px;
    display: block;
}

.delete-icon {
    background: url("images/delete-18.png") no-repeat center;
    width: 18px;
    height: 18px;
    display: block;
}

.divEdit:hover {
    background: #ced4da;
}

.divDelete:hover {
    background: rgba(255, 0, 25, 0.64);

}

.divWhite {
    width: 35px;
    height: 35px;
    border-radius: 100%;
    background: #ff3640;
    text-align: center;
    cursor: pointer;
    padding: .38rem;
}

.divGreen {
    width: 35px;
    height: 35px;
    border-radius: 100%;
    background: springgreen;
    text-align: center;
    cursor: pointer;
    padding: .38rem;
}

.icon-delete-white {
    background: url("images/closeWhite.png") no-repeat center;
    width: 22px;
    height: 22px;
    display: block;

}

.icon-tick-white {
    background: url("images/tickWhite.png") no-repeat center;
    width: 22px;
    height: 22px;
    display: block;

}

.arrow-left {

    background: url("images/arrow-left1.png") no-repeat center;
    width: 18px;
    height: 18px;
    display: block;

}

.w-icon {
    width: 60px;
}

.w-divDay {
    width: 400px;
}

.w-arrow {
    width: 300px;
}

.top-blue {
    width: 100%;
    height: 250px;

}

.parentIcon {
    width: 150px;
    height: 150px;
    border-radius: 100%;
    border: 1px solid #cccccc;
    margin-top: 1rem;
    padding: 1rem;
    text-align: center;
}




.img-map img {
    width: 100%;
    max-height: 270px;
}
.line2 {
    width: 90%;
    height: 1.2px;
    background: rgba(144, 30, 193, 0.99);
    margin: auto;
    margin-bottom: 30px;
}


.google {

    border: 1px solid #cccccc;
    border-radius: 8px;
    width: 200px;
    height: 60px;
    text-align: center;

}

.google:hover {

    background: #f9fcfc;
    border: 1px solid black;
}

.google img {
    margin-top: 3px;
    width: 70%;
    height: 90%;
}

.row-add span {

    width: 20%;
    display: block;
    line-height: 35px;

}


#table {
    text-align: center !important;

}

#table tbody tr:nth-of-type(odd) {

    background: rgba(24, 255, 0, 0.13) !important;

}

#table tbody tr:nth-of-type(even) {

    background: #fff3fc !important;

}

.close-notification {
    cursor: pointer;
    width: 18px;
    height: 18px;
    background: url("images/closeNotification.png") no-repeat center;
    z-index: 100;
    display: block;
    left: -5px;
    top: -3px;
    position: relative;

}

.backText {

    width: 300px;
    max-height: 40%;
    overflow-y: auto;
    position: fixed;
    right: 40%;
    top: 5%;
    background: black;
    color: white;
    z-index: 2000;

    border-radius: 5px;
    padding: 1rem;
    font-size: 11pt;
    display: none;
    line-height: 30px;
}

.normalSize .toman {

    font-size: 9pt;
}


.star-light {
    position: relative;

    background: url("images/star-light.png") right;
    width: 80px;
    height: 16px;
    overflow: hidden;

}

.star-gold {
    position: absolute;
    top: 0;
    right: 0;
    background: url("images/star.png") right;
    width: 69px;
    height: 16px;

}

.sm-issue {
    width: 270px;
    height: 210px;
    overflow: hidden;
    margin-right: 1rem;
}

.opinion {
    background: white;
    z-index: 9;

}

.opinionHeight .issue-titleHeight {

    height: 500px;
    overflow: hidden;

}

.issue-titleHeight.active {

    height: auto !important;

}

.opinionHeight .issue {

    border: 1px solid #eeeeee;
    border-radius: 10px;

}

.opinionHeight .line-score {

    background: #cccccc;
    height: 7px;
    border-radius: 5px;
    overflow: hidden;

}

.opinionHeight .line-score .green {

    background: #00e205;

}

.opinionHeight .line-score .red {

    background: #f20800;

}

.opinionHeight .all-issue {

    position: sticky;
    top: 60px;

}

.issue-title .score-green {
    width: 35px;
    height: 20px;
    background: #00b504;
    color: white;
    border-radius: 5px;
    text-align: center;
    padding: 5px;
    font-size: 9pt;
    line-height: 11px;

}

.opinionHeight .circle-issue {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    background: #cccccc;
}

.opinionHeight .issue-Proposal {

    border-top: 1px solid #eeeeee;
}

.like-proposal-green {

    width: 18px;
    height: 18px;
    display: block;
    background: url("images/like-18.png") no-repeat;

}

.like-proposal-red {

    width: 18px;
    height: 18px;
    display: block;
    background: url("images/dislike-18.png") no-repeat;

}

.like-proposal-not {

    width: 50px;
    height: 50px;
    display: block;
    background: url("images/uncertain.png") no-repeat;
    transform: scale(.5);
}

.opinionHeight .ِintroduction-issueHeight {

    height: 120px;
    overflow: hidden;

}

.opinionHeight .ِintroduction-issueHeight.active {

    height: auto;

}

.opinionHeight .col-lg-9Height {

    height: 700px;
    overflow: hidden;
    background: white;
    z-index: 9;

}

.opinionHeight .col-lg-9Height.active {

    height: auto;

}

.opinionHeight .ِintroduction-issueHeight .positive-icon {
    width: 16px;
    height: 16px;
    display: block;
    background: url("images/positive-16.png");
    margin-top: 4px;

}

.opinionHeight .ِintroduction-issueHeight .negative-icon {
    width: 16px;
    height: 16px;
    display: block;
    background: url("images/negative-16.png");
    margin-top: 4px;
}

.close-attr {
    cursor: pointer;
    width: 18px;
    height: 18px;
    position: absolute;
    left: 25px;
    top: 20px;
    display: none;
    background: url("images/close.png") no-repeat center;
    z-index: 14;

}

.close-tell {
    cursor: pointer;
    width: 18px;
    height: 18px;
    background: url("images/close.png") no-repeat center;
    z-index: 14;

}

.close-notification {
    cursor: pointer;
    width: 18px;
    height: 18px;
    background: url("images/closeNotification.png") no-repeat center;
    z-index: 100;
    display: block;
    left: -5px;
    top: -3px;
    position: relative;

}

.more {

    padding-bottom: 1rem;
}

.opinion .introduction2 {
    display: block;
}

.sum-icon-positive {
    background: url("images/sum.png") no-repeat;
    width: 24px;
    height: 24px;
    display: flex;
    position: absolute;
    left: 4px;
    top: 16px;
    cursor: pointer;
}

.darkOpinion {
    position: fixed;
    right: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    top: 0;
    z-index: 1;
    background: rgba(0, 0, 0, .4);
    display: none;
}

.uncertain-message {

    background: url("images/uncertain.png") no-repeat;
    width: 60px;
    height: 60px;
    display: block;
}

.like-message {

    background: url("images/like-message.png") no-repeat;
    width: 50px;
    height: 50px;
    display: block;
}

.dislike-message {

    background: url("images/dislike-message.png") no-repeat;
    width: 50px;
    height: 50px;
    display: block;
}

.likeAndDislike {
    border: 1px solid #6c757d;
}

.likeAndDislike.active {
    border: 6px solid #0018ff;
}

.likeAndDislike span {
    color: #6c757d;
}

.likeAndDislike.active span {
    color: #0018ff;
}

.icon-sum-add {

    background: url("images/sum.png");
    width: 24px;
    height: 24px;
    transform: scale(.6);
    display: block;
}

.icon-negative-add {

    background: url("images/negative.png");
    width: 24px;
    height: 24px;
    transform: scale(.6);
    display: block;
}

.recycle-bin {
    background: url("images/recycle-bin.png") no-repeat;
    width: 24px;
    height: 24px;
    display: block;
    cursor: pointer;
}

.closeModalAccount {
    background: url("images/closeWhite.png") no-repeat center;
    width: 32px;
    height: 32px;
    display: block;
    cursor: pointer;
    transform: scale(.6);

    margin-right: 20px;
}

.days .day {
    position: relative;
}

.days .day span {
    color: #5c636a;
    font-weight: bold;
}

.days .day.active span:last-child {

    border-bottom: 4px solid deepskyblue;
    padding-bottom: 1rem;
    padding-right: .4rem;
    padding-left: .4rem;
}

.days .day.active span:first-child {
    color: deepskyblue;
    font-weight: bold;
}

.days .day .friday {
    color: #ff0043 !important;

}

.days1 .day1 {
    position: relative;
}

.days1 .day1 span {
    color: #5c636a;
    font-weight: bold;
}

.days1 .day1.active span:last-child {

    border-bottom: 4px solid deepskyblue;
    padding-bottom: 1rem;
    padding-right: .4rem;
    padding-left: .4rem;
}

.days1 .day1.active span:first-child {
    color: deepskyblue;
    font-weight: bold;
}

.days1 .day1 .friday {
    color: #ff0043 !important;

}

@media (max-width: 768px) {
    .picture {
        font-size: 9pt;
    }

    .picture a {
        font-size: 9pt;
    }
}

@media (min-width: 577px) {

}

@media (max-width: 992px) {


    .repeat {

        width: 100%;
        height: 40%;


    }

    .backText {


        right: 6%;
        top: 50%;


    }

    .section {
        display: block;
    }

    .section .right {
        display: block;
        padding-bottom: .5rem;
        text-align: center;
        width: 100%;
    }


    .left {
        width: 100%;
    }

    .address p {
        width: max-content;
        max-width: 80%;
        overflow-wrap: break-word;

    }

    .address-modal-into {

        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;

    }


    .main {
        width: 100%;
        height: 280px;
    }

    .slider {


    }

    .slider .slider-content img {
        width: 100%;
        height: 280px;

    }

    .arrow-right-slider {

        top: 180px;
        right: 40px;
    }

    .arrow-left-slider {
        top: 180px;
        right: 100px;
    }


    .icon-close {
        background: url("images/close.png") no-repeat center;
        width: 32px;
        height: 32px;
        display: block;
        cursor: pointer;
        transform: scale(.6);
        position: relative;
        top: 10px;
        margin-right: 20px;
    }

    .inputDiv {
        width: 100%;
        height: 40px;
        position: relative;
    }

    .inputDiv .input {
        width: 100%;
        height: 36px;
        border: none;
        border-bottom: 1px solid #cccccc;
        border-radius: 5px;
        font-size: 10pt;

    }


    .w-icon {
        width: 60px;
    }

    .w-divDay {
        width: 300px;
    }

    .w-arrow {
        width: 60px;
    }

    .menu .navbar-nav {

        background: yellow;
        position: relative;
        top: -11px;
    }

    .mainTop .menu .logo {
        height: 80px;
    }

    .mainTop .menu .logo .navbar-brand img {
        height: 65px;
        width: 119px;
        margin-top: 2px;
    }

    .mainTop .nav-link {
        margin-right: 10px;
    }

    .mainTop .container-fluid {
        padding: 0;
    }

    .mainTop .navbar-toggler {
        margin-left: 15px;
    }

    .mainTop .nav-item {
        border-bottom: 1px solid #cccccc;
        padding: 5px 0;
    }

    .mainTop .nav-item:last-child {
        padding-bottom: 0;
    }

    .mainTop .dropdown-menu {
        background: yellow;
        padding-bottom: 8px;
        padding-right: 5px;
        border: none;

    }

    .mainTop .dropdown-menu .dropdown-item {

        padding-bottom: 10px;
        padding-top: 10px;
        border-bottom: 1px solid #cccccc;
        font-size: 11pt;
        padding-right: 10px;
    }

    .mainTop .dropdown-menu {

        border-top: 1px solid #cccccc;
        border-radius: 0;
        padding-right: 10px;
        padding-top: 0;
        padding-bottom: 0;

    }

    .mainTop .dropdown-menu li:last-child .dropdown-item {

        border: none

    }

    .menu {
        top: 0 !important;
    }

    .mainTop .dropdown-menu li a {
        line-height: 30px;
    }

    .mainTop {
        height: 500px;


    }

    .mainTop::before {
        content: '';
        height: 500px;

    }

    .animation {
        position: relative;
        top: -50px;
        height: 100px !important;
    }

    .waveSlider {
        background: linear-gradient(to right, rgba(144, 30, 193, 1) 0%, rgb(107, 73, 238, 1) 51%, rgba(144, 30, 193, 1) 100%);
        width: 100%;
        height: 60px;
    }

    .titleFontMd12 {
        font-size: 12pt;
    }

    .titleFontMd11 {
        font-size: 11pt;
    }

    .titleFontMd10 {
        font-size: 10pt;
    }

    .footer .titleFooter {

        font-size: 12pt;

    }

    .underSlider .card-title {
        font-size: 10pt;
    }

    .waveSlider .animation .wave2 {
        height: 80px !important;
    }

    .waveSlider .animation .wave3 {
        height: 80px !important;
    }

    .waveSlider .animation .wave4 {
        height: 80px !important;
    }

    .sliderAll {
        height: 410px;
    }

    .sliderAll .content {
        height: 100%;
    }

    .slider {
        height: 100%;
    }

    .slider-content {
        height: 100%;
    }

    .sliderComplete {
        height: 100%;
    }

    .sliderRight {
        width: 100%;
        height: 76%;
    }

    .sliderRight a {
        width: 100%;
        height: 100%;
    }

    .slider .slider-content .sliderRight img {
        width: 70%;
        height: 95%;
        margin-top: 10px;
    }

    .sliderLeft {
        width: 100%;
        height: 26%;
    }

    .fluidMenu {
        height: 75px;
    }

    .right4500 {
        height: 100% !important;
    }

    .sliderAll .btn-self {

        height: 40px;
        font-size: 9pt;
        padding: 10px;

    }

    .navigator {
        display: none;
    }

    .sliderAll .sliderP {
        font-size: 10pt;
        margin-bottom: 6px;

    }

    .sliderAll .sliderTitle {
        font-size: 12pt;
        margin-bottom: 7px;

    }

    .sliderAll .arrow-right-slider {
        display: none;
    }

    .sliderAll .arrow-left-slider {
        display: none;
    }


    .dark {
        width: 100%;

        height: 100%;

        position: fixed;
        top: 0;
        right: 0;
        overflow: hidden;


    }

    .requestModal {
        width: 100%;
        min-width: 100%;
        height: 100%;
        min-height: 100%;
        background: white;
        z-index: 20;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;

        overflow: hidden;

    }

    .birthday {
        position: relative;
        margin-top: 2rem;
        top: 10px;
        width: 100%;
    }

    .select-birthday {
        width: 90%;


    }

    .inputDiv {
        width: 100%;

    }

    .underSlider .card img {
        width: 35%;
        height: 35%;
    }

    .underSlider .card {

        margin: 0 15px;
    }

    .underSlider .card {

        box-shadow: 0 0 3px 3px #f0f0f0;
        border: none;
    }

    .picturePosition .left {


    }

    .picturePosition .allImg .img1 {
        position: absolute;
        top: 20px;
        left: 15px;
        width: 65%;
        height: 300px;
        z-index: 2;
    }

    .picturePosition .colImg {
        width: 100%;
        height: 450px;


    }


    .picturePosition .allImg .img2 {
        position: absolute;
        top: 50px;
        right: 0;
        width: 150px;
        height: 100px;
        z-index: 1;
    }

    .picturePosition .allImg .img3 {
        position: absolute;
        bottom: 0;

        right: 5px;
        width: 60%;
        height: 250px;
    }

    .cardAll {

        position: relative;
        width: 100%;
        top: 0;

    }

    .footer {

        height: max-content;
    }


    .addAddressBtn {
        width: 50%;
        height: 40px;
        font-size: 9pt;
        line-height: 19px;
    }

    .normalSize {

        width: 100%;
        font-size: 10pt;
    }

    .normalSize .toman {

        font-size: 6pt;
    }

    .cardAll .card {
        height: 350px;
    }

    .cardAll .card-img-top {

        width: 100% !important;
        height: 349px !important;

    }

    .cardAll .titleCard .titleSpan {


        font-size: 10pt;


    }

    .appendTax {

        box-shadow: 0 -4px 2px -3px rgba(128,0,255,0.29);
    }

    .opinionHeight .all-issue {

        position: relative !important;
        top: 0 !important;
        margin-bottom: 50px;
        margin-top: 32px;
        background: white;

    }
}


@media (min-width: 992px) {

    .mainTop .nav-item {
        margin-right: 16px;
    }

    .mainTop .nav-link {
        color: white;
    }


}

/* Article overflow guard: keep rich-text and video/embed output inside the viewport. */
.article-page,
.article-page * {
    box-sizing: border-box;
}

.article-page {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.article-page .container-fluid {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.article-page .row {
    max-width: 100%;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.article-page .row > * {
    min-width: 0;
}

.article-main-col,
.article-sidebar,
.article-content,
.article-content-fragment,
.article-video-embed {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.article-content,
.article-content-fragment {
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 2;
}

.article-content {
    overflow-x: hidden;
}

.article-content p,
.article-content div,
.article-content span,
.article-content blockquote,
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6,
.article-content ul,
.article-content ol,
.article-content li,
.article-content figure {
    max-width: 100% !important;
    min-width: 0 !important;
}

.article-content img,
.article-content video,
.article-content iframe,
.article-content embed,
.article-content object {
    max-width: 100% !important;
    min-width: 0 !important;
}

.article-content video,
.article-content img:not(.fs-article-img--fixed-height) {
    height: auto !important;
}

.article-content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.article-content .fs-article-img {
    max-width: 100% !important;
}

.article-content .fs-article-img--right {
    display: block;
    margin: .9rem 0 .9rem auto;
}

.article-content .fs-article-img--center {
    display: block;
    margin: .9rem auto;
}

.article-content .fs-article-img--left {
    display: block;
    margin: .9rem auto .9rem 0;
}

.article-content .fs-article-img--full {
    display: block;
    width: 100% !important;
    height: auto !important;
    margin: .9rem 0;
}

.article-content .fs-article-align--right { text-align: right !important; }
.article-content .fs-article-align--center { text-align: center !important; }
.article-content .fs-article-align--left { text-align: left !important; }
.article-content .fs-article-align--justify { text-align: justify !important; }

.article-content iframe {
    width: 100% !important;
    border: 0;
    display: block;
    margin: 1rem auto;
}

.article-video-embed {
    overflow-x: hidden;
}

.article-content table {
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    background: #fff;
}

.article-content table:not([data-fs-width-value]) {
    width: 100%;
}

.article-content .fs-article-table--right {
    margin-left: auto;
    margin-right: 0;
}

.article-content .fs-article-table--center {
    margin-left: auto;
    margin-right: auto;
}

.article-content .fs-article-table--left {
    margin-left: 0;
    margin-right: auto;
}

.article-content thead,
.article-content tbody,
.article-content tr {
    max-width: 100%;
}

.article-content th,
.article-content td {
    max-width: 100%;
    border: 1px solid #b8bec5;
    padding: .65rem .75rem;
    vertical-align: top;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.article-content th {
    background: #f3f5f7;
    font-weight: 700;
}

.article-content pre,
.article-content code,
.article-content a,
.article-sidebar a,
.article-page h1,
.article-page h2,
.article-page h3 {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.article-content pre,
.article-content code {
    white-space: pre-wrap;
}

@media (max-width: 576px) {
    .article-content iframe {
        min-height: 190px;
    }
}

/* Article page layout parity with the management rich editor. */
.article-shell {
    width: 100%;
    max-width: 1480px !important;
    margin-right: auto;
    margin-left: auto;
    padding-right: clamp(.75rem, 2vw, 1.75rem);
    padding-left: clamp(.75rem, 2vw, 1.75rem);
}

.article-title {
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    line-height: 1.8;
}

.article-summary {
    background: linear-gradient(to right, rgba(144, 30, 193, .90) 0%, rgba(107, 73, 238, .90) 51%, rgba(144, 30, 193, .90) 100%);
    line-height: 1.9;
    overflow-wrap: anywhere;
}

.article-content {
    font-size: 1rem;
    color: #495057 !important;
}

.article-content-fragment {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}

.article-content p {
    margin-bottom: 1rem;
}

.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
    margin-top: 1.35rem;
    margin-bottom: .8rem;
    line-height: 1.75;
    color: #212529;
}

.article-content blockquote {
    margin: 1rem 0;
    padding: .75rem 1rem;
    border-right: 3px solid #adb5bd;
    background: #f8f9fa;
}

.article-content ul,
.article-content ol {
    padding-right: 1.5rem;
    padding-left: 0;
}

.article-content a {
    text-decoration-thickness: 1px;
    text-underline-offset: .2em;
}

.article-video-embed,
.article-video-host {
    width: 100%;
    max-width: 100%;
}

.article-video-embed iframe {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    min-height: 0;
    margin: 1rem auto;
    border: 0;
}

.article-video-host {
    display: block;
    height: auto;
    max-height: min(75vh, 760px);
    margin-right: auto;
    margin-left: auto;
    background: #000;
}

.article-date {
    clear: both;
    margin-top: 1.25rem;
}

.article-sidebar .list-group-item a {
    display: block;
    width: 100%;
    text-decoration: none;
    line-height: 1.8;
}

@media (min-width: 768px) {
    .article-sidebar {
        align-self: flex-start;
    }
}

@media (max-width: 767.98px) {
    .article-page {
        margin-top: 1.5rem !important;
    }

    .article-title {
        font-size: 1.1rem !important;
        margin-bottom: 1rem !important;
    }

    .article-summary {
        font-size: .95rem !important;
        padding: .8rem !important;
    }

    .article-content {
        font-size: .96rem;
        line-height: 1.95;
    }

    .article-sidebar {
        margin-top: .5rem;
    }

    .article-sidebar > .row {
        padding-right: 0 !important;
    }
}

@media (max-width: 420px) {
    .article-shell {
        padding-right: .65rem;
        padding-left: .65rem;
    }

    .article-content th,
    .article-content td {
        padding: .5rem;
    }
}

