@font-face{font-family:'Yekan';src:url('../Fonts/BYekan.ttf') format('truetype'), url('../Fonts/BYekan.eot?#') format('eot'), url('../Fonts/BYekan.woff') format('woff');font-style:normal;font-weight:normal;}

.cu-container{
    /*background-color: lightblue;*/
    display: flex;
    flex-direction: column;
    font-family: Yekan;
}

.cu-navbar{
    background-color: #0096FF;
    height: 60px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.cu-brand{
    background-color: white;
    border-radius: 4px;
    margin-left: 10px;
    padding: 3px 8px 7px 7px;
}

.cu-brand-organ{
    background-color: #000110;
    margin-left: 10px;
    padding: 3px 8px 3px 8px;
}

.cu-brand img{
    width: 100px;
}

.cu-brand-organ img{
    width: 100px;
}


.cu-main{
    /*background-color: lightsalmon;*/
    display: flex;
    flex-direction: row;
}


.cu-side{
    height: 723px;
    background-color: #0096FF;
    flex:1.6;
    margin: 10px;
    border-radius: 15px;
}

.cu-profile-pic{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 25px;
    margin-bottom: 10px;
}

.cu-profile-info{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 15px;
}

.cu-profile-info-item{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    color: white;
    margin-top: 7px;
    font-size: 16px;
}

.cu-profile-pic img{
    width: 150px;
    border-radius: 150px;
}


.cu-body{
    /*background-color: yellow;*/
    flex: 6;
    display: flex;
    flex-direction: column;
}

.cu-top-body{
    background-color: #fdc702;
    height: 115px;
    margin: 10px 0px 10px 10px;
    border-radius: 15px;
}

.cu-bottom-body{
    /*background-color: #99452b;*/
    height: 600px;
    border-radius: 20px;
    display: flex;
}

#customer_map{
    width: 100%;
    height: 600px;
    margin: 0px 0px 0px 10px;
    border-radius: 10px;
}

.cu-status{
    color: white;
    padding: 10px 15px 12px 15px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 24px;
    margin-bottom: 17px;
}

.cu-status-done{
    background-color: #06e80f;
    font-size: 16px;
}

.cu-status-started{
    background-color: #fdc702;
    font-size: 16px;
}

.cu-status-failed{
    background-color: #f50707;
    font-size: 16px;
}

.cu-task-info{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 15px;
}

.cu-task-info-item{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    color: white;
    margin-top: 15px;
}

.cu-task-info-item i{
    margin-left: 5px;
}

.cu-organ-info{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.cu-organ-info-item{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    color: white;
    margin-top:10px;
}
.cu-organ-info-right{
   /*  padding: 7px 23px 10px 10px; */
    font-size: 18px;
    font-family: Yekan;
    font-weight: Bold;
    padding-top: 15px;
}

.cu-organ-info-item i{
    margin-left: 10px;
}

.cu-rating{
    margin-top: 86px;
    margin-bottom: 53px;
}

.star_text{
    color: #ffa812;
}

@media all and (max-width: 980px) {
    .cu-side{
        flex: 3;
    }
}

@media all and (max-width: 750px) {
    .cu-main{
        flex-direction: column;
    }
    .cu-body{
        order: 2;
        margin-right: 10px;
    }
    .cu-side{
        order: 1;
    }
}

.customMarker {
    position:absolute;
    cursor:pointer;
    background:#0096FF;
    width:58px;
    height:58px;
    /* -width/2 */
    margin-left:-38px;
    /* -height + arrow */
    margin-top:-67px;
    border-radius:10px;
    padding:0px;
}
.customMarker:after {
    content:"";
    position: absolute;
    bottom: -13px;
    left: 24px;
    border-width: 14px 6px 0;
    border-style: solid;
    border-color: #0096FF transparent;
    display: block;
    width: 0;
}
.customMarker img {
    width:48px;
    height:48px;
    margin:5px;
    border-radius:50px;
}

.mlogout{
    background-color:#424242
}
.mlogout:after {
    border-color: #424242 transparent;
}

.m0{
    background-color:#42c060
}
.m0:after {
    border-color: #42c060 transparent;
}

.m1{
    background-color:#ed2727
}
.m1:after {
    border-color: #ed2727 transparent;
}


.cu-page-title{
    font-family: Yekan;
    color: white;
    padding: 30px;
    font-size: 18px;
}

.cu-verify-footer{
    text-align: end;
}

.cu-verify-footer span{
    font-family: Yekan;
    font-size: 12px;
    padding: 6px;
    color: gray;
    cursor: pointer;
}


/*modal style*/

.modal-header{
    direction: rtl !important;
    text-align: right !important;
    background-color: #0096FF !important;
    color: white !important;
}

.modal-body{
    direction: rtl !important;
    text-align: right !important;
}

.modal-footer{
    text-align: center !important;
}

.modal-success{
    padding: 88px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.modal-success .fa{
    font-size: 63px;
    color: #4CAF50;
}

#rate_error{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-bottom: 10px;
    color: #ffffff;
    background-color: #fb6565;
    font-family: Yekan;
    padding-top: 8px;
}

.act{
    color:orange;
}

.nct{
    color: lightgrey;
}

.rated-star{
    display: flex;
    justify-content: center;
    margin-top: 86px;
}

.rated-star i{
    font-size: 21px;
}

.rate_desc_wr{
    display: flex;
    justify-content: center;
    color: f5f5f5;
    margin-top: 18px;
    margin-bottom: 47px;
}

#sign_wr{
    display: flex;
    justify-content: center
}

#sign_img{
    width: 200px;
}

#sign_btn{
    color: white;
    cursor: pointer;
    background-color: orange;
    padding: 6px 22px 6px 22px;
    border-radius: 9px;
}
#sign_btn:active{
    opacity: 0.3
}

#sign_btn_wr{
    display: flex;
    justify-content: center
}