*{box-sizing: border-box;padding:0px;margin:0px;}
body{padding:0px;margin:0px;font-family:Yekan;}
:root{
--topcolor:#3D9AEB;
--darktext:#11589B;
--btnfinder:#032B44;
--btnBRDfinder:#72C8F1;
--btn_amir:rgb(5, 158, 120);
--base:rgb(2, 107, 168);


--head1:rgba(50,130,255,0.2);
--head:rgba(7,60,82,0.6);
--navbar:rgb(2, 107, 168);
--withe:#fff;
--newnav:rgb(242,242,242);
--shadow1:#212788;
--amirMatn:#eee;
--amirMatn2:#333;
--olivergba:rgba(176,203,31,0.2);
--olive:#b0cb1f;
--yellow:rgb(177, 196, 6);
--darkgreen:#096430;
--darkgreen:#096430;
--newgreen1:rgb(106,209,213);
--newgreen:rgb(56,159,163);
--newgreenlight:rgb(112,175,190);
--newblue:rgb(92,154,191);
--newbludark:rgb(152,165,174);
--newolive:rgb(135,159,80);


}

.trans0_25{transition:0.25s;-webkit-transition:0.25s;-moz-transition:0.25s;-ms-transition:0.25s;-o-transition:0.25s;}
.trans0_5{transition:0.5s;-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;-o-transition:0.5s;}
.trans1{transition:1s;-webkit-transition:1s;-moz-transition:1s;-ms-transition:1s;-o-transition:1s;}
/*-------------------------------------------------------------------------------------------------------------------------*/





/*------------------------------------------------Titr-head-----------------------------------------------GENERAL----------*/
.Titr-head{background:#222;color:#e01e38;padding:7px;}

/*------------------------------------------------radioBox-----------------------------------------------GENERAL----------*/
/* The radioBox */
.radioBox {display: inline-block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
  
/* Hide the browser's default radio button */
.radioBox input[type="radio"] {position: absolute;opacity: 0;cursor: pointer;}
  
/* Create a custom radio button */
.radioBox .checkmark{position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #eee;border-radius: 50%;border:1px solid #aaa;}
  
/* On mouse-over, add a grey background color */
.radioBox:hover input[type="radio"] ~ .checkmark {background-color: #ccc;}
.radioBox:hover input[type="radio"] ~ .checkmark {background-color: #e01e38;}
  
/* When the radio button is checked, add a blue background */
.radioBox input[type="radio"]:checked ~ .checkmark {background-color: #e01e38;}
  
/* Create the indicator (the dot/circle - hidden when not checked) */
.radioBox .checkmark:after {content: "";position: absolute;transition-duration: 0.3s;transform: scale(0);opacity:0;}

/* Style the indicator (dot/circle) */
.radioBox .checkmark:after{top: 5px;left: 5px;width: 13px;height: 13px;border-radius: 50%;background: white;}


/* Show the indicator (dot/circle) when checked */
.radioBox input[type="radio"]:checked ~ .checkmark:after {opacity:1;transform: scale(1);}
/*------------------------------------------------checkBox-----------------------------------------------GENERAL----------*/
/* The checkBox */
.checkBox {display: inline-block;position: relative;font-size:16px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.checkBox,.checkBox *{cursor: pointer;}
/* Hide the browser's default radio button */
.checkBox input[type="checkbox"] {display:none;}
  
/* Create a custom radio button */
.checkBox .checkmark{display:inline-block;position: relative;margin:0px 5px;top:7px;height: 25px;width: 25px;background-color: #f2f2f2;border-radius: 2px;border:1px solid #aaa;}
  
/* On mouse-over, add a grey background color */
.radioBox:hover input[type="checkbox"] ~ .checkmark {background-color: #3b6bfe;}
  
/* When the radio button is checked, add a blue background */
.checkBox input[type="checkbox"]:checked ~ .checkmark {background-color: #fff;}
  
/* Create the indicator (the dot/circle - hidden when not checked) */
.checkBox .checkmark:after {content: "\2714";position: absolute;font-size:22px;transition-duration: 0.3s;transform: scale(0);opacity:0;top: 0px;left: 3px;background: none;margin-top: -5px;color:#3b6bfe ;}


/* Show the indicator (dot/circle) when checked */
.checkBox input[type="checkbox"]:checked ~ .checkmark:after {opacity:1;transform: scale(1);}

/*--------------------------------------------------line-overflow-----------------------------------------------------------------------*/

.text-elips {
    white-space: nowrap; 
    display:block;
    overflow: hidden;
    text-overflow: ellipsis; 
  }


.scrollHide {
    scrollbar-visibility: hidden; /* <--- I wish we had this one !! */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
}

.scrollHide::-webkit-scrollbar { 
    display: none; /* Chrome Safari */
}

.scrollHide::-webkit-scrollbar { 
    width: 0;
    height: 0;
}
.Hscroll_v5{scroll-behavior: smooth;scrollbar-width: thin;scrollbar-color: rgba(200, 200, 200, 0.687) rgba(200, 200, 200, 0.272);}
.Hscroll_v5::-webkit-scrollbar {height:5px;}
/* Track */.Hscroll_v5::-webkit-scrollbar-track {box-shadow: inset 0 0 5px rgba(200, 200, 200, 0.272); border-radius: 10px;}
/* Handle */.Hscroll_v5::-webkit-scrollbar-thumb {background: rgba(200, 200, 200, 0.687); border-radius: 10px;}  
/* Handle on hover */.Hscroll_v5::-webkit-scrollbar-thumb:hover {background: rgb(200, 200, 200,0.8) ; }



/*------------------------------------------------switch-----------------------------------------------GENERAL----------*/
.switch {position: relative;display: inline-block;top:10px;cursor: pointer;}
.switch *{cursor: pointer;}
.switch input[type=checkbox] {display: none;width:0px;height:0px;;}
.switch .slider {position: relative;display:inline-block;cursor: pointer;top: 0px;right:0px;width: 60px;height: 14px;background-color: #f3b7b7;-webkit-transition:0.4s;transition:0.4s;}
.switch .slider:before {position: absolute;content: "";height: 20px;width: 20px;left: -2px;top: -3px;background-color: #e80000;-webkit-transition: .4s;transition: .4s;}
.switch input[type=checkbox]:checked + .slider {background-color:#b7f3be ;}/*#2196F3;*/
.switch input[type=checkbox]:focus + .slider {box-shadow: 0 0 1px #08ab00;background:#08ab00}/*#2196F3*/
.switch input[type=checkbox]:checked + .slider:before {left:calc(100% - 20px);background:#08ab00;}
/* Rounded sliders */
.switch .slider.round {border-radius: 34px;}
.switch .slider.round:before {border-radius: 50%;}


.check-items{text-align: right;color:#555;}
.check-items>b{padding:5px;}
/*.check-items label{position: relative;top:10px;display:inline-block !important;overflow: hidden;width:65px !important;}*/

.check-items label span{}
/*.check-items{padding:5%;}*/

/*-----------------------------------------------form-box---------------------------------------------------*/
.form-box{background:#fff;box-shadow:0px 2px 7px #ccc;border-radius:5px;position:relative;}
.form-box .Titr1{color:#d5bd65;}
.form-box form{width:95%;margin:auto;display:block;}
.form-box form textarea{border:1px solid #aaa;border-radius:3px;padding:10px;display:block;width:100%;height:200px;color:#444;}
.form-box form input[type="submit"]{float: left;max-width:200px;background:#d3b92e;border:1px solid #d3b92e;cursor: pointer;padding:6px 6px;width:100%;color:#fff;font-family: Yekan;border-radius:5px;;}
.form-box form input[type="submit"]:hover{color:#d3b92e;border-color:#d3b92e;background:#fff;}
/*----------------------------------------------- end---------------------------------------------------*/

#modal{z-index:1000;display:none;position: fixed;width: 100%;height:100%;top:0px;right:0px;overflow:auto;}
#modal #Cover{position: fixed;width: 100%;height:100%;top:0px;right:0px;background-color: rgba(0,0,0,0.5);opacity:0;}
#modal #modal-body-box{position: absolute;overflow:auto;width: 80%;top:-150%;right:50%;background-color:#f7f7f7;border-radius:10px;transform: translate(50%,-50%);-webkit-transform:translate(50%,-50%);-moz-transform:translate(50%,-50%);-o-transform:translate(50%,-50%);-ms-transform:translate(50%,-50%);}
#modal #modal-body-box #close{position: absolute;top:10px;left:10px;color:rgb(236, 77, 77);padding:7px;cursor: pointer;}


.model_optionsCheck .listOfOptions{display: block;text-align: center;padding:7px 1px;background:#fff;color:#333;}
.model_optionsCheck .listOfOptions:nth-child(2n-1){background:#eee;}
.model_optionsCheck .checked{background: #04AA6D !important;color:#fff;}
.model_optionsCheck .abeyance{background: #d5bd65 !important;color:#333;}



.Image-upload .img-box{position:relative;padding-top:65%;margin:auto;width:90%;border:2px dashed #ccc;overflow:hidden;}
.Image-upload .img-box,.Image-upload .img-box *{cursor: pointer;}
.Image-upload .img-box .showax{position: absolute;background-position: center center;background-repeat: no-repeat;background-size: contain;width:100%;height:100%;top:0px;right:0px;}
.Image-upload .img-box .showax span{position: absolute;display:block;color:#aaa;width:100%;text-align: center;font-size:25px;top:50%;right:0%;transform: translateY(-50%);z-index: -200;}
.Image-upload .img-box .showax span i{display:block;font-size:30px;}
.Image-upload .img-box .add-img{position: absolute;font-size:30px;display:none;color:#95CF2F;background-color:#fff;border-radius:50%;padding:0px;text-align: center;z-index:5;bottom:5px;right:5px;}
.Image-upload .img-box .remove-img{position: absolute;font-size:30px;color:#c00;background-color:rgba(255,255,255,0.4);border-radius:50%;padding:0px;text-align: center;z-index:5;left:5px;}
.Image-upload .img-box .remove-img:hover{transform: rotate(-25deg);}

.show-btn{animation: show_btn 1s ease-out;bottom:5px;}
@keyframes show_btn {
    0%{bottom:-100px;opacity: 0;}
    70%{bottom:10px;}
    100%{bottom:5px;opacity: 1;}
}

.hide-btn{animation: hide_btn 1s ease-in;bottom:-100px;}
@keyframes hide_btn {
    0%{bottom:5px;opacity:1;}
    30%{bottom:10px;}
    100%{bottom:-100px;opacity: 0;}
}

.Hcmbox{display: block;font-family: Yekan;position:relative;}
.Hcmbox .cmb_head{position: relative;display: block;}
.Hcmbox .cmb_head input[type=text]{display:block;border-radius: 4px;color:#333;border:1px solid #aaa;width:100%;}
.Hcmbox .cmb_head b{position: absolute;background:#aaa;color:#333;cursor:pointer;top:0px ;left:0px;width:40px;height:100%;border-radius: 4px;text-align: center;padding-top:14px;}
.Hcmbox .cmb_ops{width:100%;position: absolute;top:40px;z-index:100;background:#fff;display:none;box-shadow: 0px 3px 5px #aaa;padding-top:10px;max-height: 230px;overflow-y:auto;}
.Hcmbox .cmb_ops>span{display:block;padding:5px;}
.Hcmbox .cmb_ops .filter_adjusted{display:none;}

.announcements_lst_filter{background:#fff;}

/* xss 320*/
@media only screen and (max-width : 320px) {
    #modal #modal-body-box{font-size:14px;width:95%;top:-150%;right:50%;padding:1%;transform: translate(50%,-35%);-webkit-transform:translate(50%,-35%);-moz-transform:translate(50%,-35%);-o-transform:translate(50%,-35%);-ms-transform:translate(50%,-35%);}

}
/* xs */
@media only screen and (min-width : 321px) and (max-width : 481px) {
    #modal #modal-body-box{font-size:15px;width:95%;top:-150%;right:50%;padding:1%;transform: translate(50%,-45%);-webkit-transform:translate(50%,-45%);-moz-transform:translate(50%,-45%);-o-transform:translate(50%,-45%);-ms-transform:translate(50%,-45%);}

}
/* sm */
@media only screen and (min-width : 481px) and (max-width : 623px) {

}
/* xsm */
@media only screen and (min-width : 624px) and (max-width : 767px) {
 


}
/* md */
@media only screen and (min-width : 768px) and (max-width : 879px) {
  


}

/* md to dpwn for menu*/
@media only screen and (max-width : 879px) {



}
/* xmd */
@media only screen and (min-width : 880px) and (max-width : 991px) {
 


}
/* lg */
@media only screen and (min-width : 992px) and (max-width : 1200px) {


}
/* xlg */
@media only screen and (min-width : 1201px) {



}

/*----------- md TO down --------------*/
@media only screen and (max-width : 879px){



}
/*----------- xsm TO down --------------*/
@media only screen and (max-width : 767px) {


}
/*----------- sm TO down --------------*/
@media only screen and (max-width : 623px) {


}
@media only screen and (max-width : 623px){


}
@media only screen and (max-width : 623px) {

}

@media only screen and (min-width : 481px) and (max-width : 991px) {

}