body { padding-right: 0 !important; }
.navbar {margin:0!important;padding:0!important;padding-right: 8px!important;}
.navbar-toggler {margin: 0!important;padding-left: 4px!important;padding-right: 4px!important;color: #343a40!important;}
.navbar-toggler i {text-shadow: 2px 2px #00000;}

.top-banner {margin-bottom: 10px;}

/*.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
-webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
 }
 .carousel-item-next,
 .active.carousel-item-right {
   -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
 }
 .carousel-item-prev,
 .active.carousel-item-left {
 -webkit-transform: translate3d(0, +100%, 0);
        transform: translate3d(0, +100, 0);
 }
 */
 .carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .6s;
 transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}

#sidebar-wrapper {z-index: 1000;margin-top:55px;}
#sidebar-wrapper .list-group {width: 17rem;}
#success {color:red; text-align:center;}
.green {color:green;text-align:center;margin-top:-40px!important;}
.yts-form {
	width: 95%;
	margin: auto;
}

@media (min-width: 1024px) {
    .fa-1x {font-size: 2em;}
	.yts-form {width: 60%; }
	/*.navbar {display:none;}*/
	.navbar-nav {padding-inline-start:0px;}
	.navbar-nav .nav-link {padding-right:15px;}
	.nav-item {border-bottom:solid 1px #cfcfcf;}
	#sidebar-wrapper {z-index: 1000;margin-top:0px;}
	.navbar-toggler {margin-top: 20px;}  
	.top-banner {margin-bottom: 60px;}
	.navbar {margin:0!important;padding:0!important;padding-right: 16px!important;}
}
.navbar-nav .nav-link {padding-right:8px;}
.navbar-nav {padding-inline-start:12px;}
.form-control {
	display: inline-block;
	width: 100%;
    /*min-width: 200px;*/
}

@media (max-width: 320px) {
  .form-control {
	display: inline-block;
	width: 60%;
    /*min-width: 200px;*/
  }
}

.arabic-label {display:block;text-align:right;}
.modal-title {text-align:right;}
h4.modal-title {font-size:1.2rem;}
.modal-header .close {margin: 0px;display:inline-block;margin: 0;margin-top: -20px;margin-left: -15px;}
.list-group {text-align:right;}
.yts-vcentered {margin: auto 16px;}

.modal-body {padding: 0px;}
.modal-content img {width:100%;}

@media (min-width: 320px) {
	/*.modal-dialog {
		max-width: 300px; 
	}*/
}

@media (min-width: 576px) {
	.modal-dialog {
		max-width: 800px; 
	}
}

nav {direction: rtl;}
.input-group {margin-bottom:2px !important;}
.error {color:red;text-align:center;width:95%;margin-bottom:10px;}
.navbar-light .navbar-toggler {color:white;}
.navbar-light .navbar-nav {min-width:300px;text-align:right;color:black;}
.navbar-light .navbar-nav .active>.nav-link {color:black;}
.navbar-light .navbar-nav .nav-link {color:black;background-color:#f8f9fa !important;}


@media only screen 
    and (device-width : 375px) 
    and (device-height : 667px) 
    and (-webkit-device-pixel-ratio : 2) { 
     .navbar-toggler {font-size:.8em;margin-top:-4px;}   
    }
    
@media only screen 
    and (device-width : 414px) 
    and (device-height : 736px) 
    and (-webkit-device-pixel-ratio : 3) { 
    .navbar-toggler {font-size:.8em;margin-top:-4px;}   
    }
    
@media only screen 
    and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3) { 
    .navbar-toggler {font-size:.8em;margin-top: -5px;}   
    }

@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px)
    and (width : 736px) 
    and (orientation : landscape) 
    and (color : 8)
    and (device-aspect-ratio : 414/736)
    and (aspect-ratio : 736/414)
    and (device-pixel-ratio : 3)
    and (-webkit-min-device-pixel-ratio : 3)
    { 
        .navbar-toggler {font-size:.8em;margin-top: -4px;}   
    }

@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
    .navbar-toggler {font-size:.8em;margin-top: -4px;}   
}

@media screen 
  and (device-width: 411px) 
  and (device-height: 731px) 
  and (-webkit-device-pixel-ratio: 3.5) 
  and (orientation: portrait) {
    .navbar-toggler {font-size:.8em;margin-top: -4px;}   
}

@media (max-width: 1024px) {
    .navbar-toggler {font-size:.8em;margin-top: -4px;}   
}

@media (max-width: 1080px) {
    .navbar-toggler {font-size:1em;margin-top: 10px;}   
}

@media screen 
    and (min-device-width : 1080px) 
    and (max-device-width : 1920px) 
    and (min-resolution: 401dpi) 
    and (device-aspect-ratio:16/9) 
{ 
    .navbar-toggler {font-size:.8em;margin-top: -4px;}   
}

/* 2688x1242px at 458ppi */
@media only screen 
    and (device-width : 414px) 
    and (device-height : 896px) 
    and (-webkit-device-pixel-ratio : 3) {
        .navbar-toggler {font-size:.8em;margin-top: -4px;}   
        }
    
.card {border: 0!important;}
@media (orientation: landscape) {
  body {
    
  }
 .modal-dialog {width: 70%;}
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #555; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 50px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
  width: 55px;
  height: 55px;
  color: #bbb;
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}