html
{
	overflow-x:hidden; 
}

body
{
	/*position: fixed;*/
	width: 100%;
	height: 100%;
	margin:0;
	padding:0;
	background-size: cover;
	min-width:320px;
} 

body::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

body::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

body::-webkit-scrollbar-thumb
{
	background-color: #aaa;
}

*{
	font-family: 'Fira Sans', sans-serif;
	font-family: 'Montserrat', sans-serif;
	font-family: 'Lato', sans-serif;
}

.container-fluid,.col-sm-10, .col-sm-4, .col-sm-2,.col-sm-9, .col-sm-3,.bg-faded,.col-sm-6,.col-md-8
{
	padding:0;
}

.container-fluid
{
	margin:auto;
}

.row
{
	margin:0!important;
}

/* start of top-left */
#top-left
{
	background-color: #16a4fa;  
	color:#fff;
	padding:15px 0;
	position: relative;
}

#log-out-section
{
	position: absolute; 
	top:17px; 
	right:10px;
	display: none;
}

#logo span, #logo i
{
	font-size:20px;
	font-weight:bold;
}

#logo i
{
	margin-right: 10px;
}
/* end or top-left */

/* start of bottom-left */
#bottom-left 
{
	background-color:#3f4c5f;  
	/*min-height:1100px;*/
	min-height:calc(100vh - 60px);
	/*height: calc(100vh - 60px);*/
}

.bg-faded button
{
	margin-top: -63px;
	margin-left: 20px;
	padding: 8px;
	border-radius: 0;
	border: 1px solid rgb(1,137,187);
	background: transparent;
}

/* navbar */
.admin-only
{
	display: none;
}

.navbar-nav
{
	display:block;
	width:100%;
}

#nav-content  .nav-link
{
	padding:15px 0 15px 20px;
	background:none;
	border:none;
	color:#a1acc0;
	border-radius:0;
}

#nav-content  .nav-item
{
	margin-bottom:15px;
}

#nav-content .nav-item .active
{
	color: #e1e5e8;
	border-left: 1px solid rgb(2,148,255)!important;
	background: #4e5f79;
}

#nav-content  .nav-item .nav-link
{
	border-left: 1px solid #3f4c5f;
}

#nav-content  .nav-item:hover .nav-link
{
	background: #4e5f79;
	color: #e1e5e8;
	border-left:1px solid #16a4fa!important;
}

#nav-content  .nav-link i
{
	margin-right:20px;
	font-weight:600;
}
/* end of bottom-left */



/* start of top-right */

#top-right{
	padding:15px 55px;
	background:#fff;
	border-bottom: 1px solid #ddd;
}
#top-right .row{
	padding-top:5px;
}
#top-right .col-sm-9 p{
	margin-bottom:0;
}
#top-right .col-sm-9 strong{
	margin-left:15px;
	color:rgb(2,148,255);
}
#top-right .col-sm-3 {
	color:rgb(2,148,255); 
	text-align:right;
}
#top-right .col-sm-3 i{
	margin-right:10px;
}
/* end of top-right */


/* start of bottom-right */
/*  */
#bottom-right{
	padding-top:20px;
}
#bottom-right b{
	display:block;
	margin:20px 0;
}	
/*#map {
	height: 90%!important;
	width:100%;
}*/
#address {
	margin-top:30px!important;
	/*height:25%!important;*/
}
#address .col-sm-6:first-child{
	padding-right:2rem!important;
}
#routes_{
	padding-right: 1rem!important;
    border-radius:5px!important;
	max-width: 100%;
    /* position: absolute; */

}
#mycalendar{
	/*max-width:800px!important;*/
}
/* end of bottom-right */




/* start css of profile */
#bottom-right .box{
	    padding: 10px 55px 23px 55px;
}
#text-box{
	padding:10px 0 30px 0!important;
	
}
#text-box .col-md-4{
	padding:0 0 0 10px;
}

#text-box .col-md-4 input{
	width:100%;
	padding:5px 10px;
	border-radius:5px;
	border:1px solid #ccc;
}
#update{
	margin-top:10px;
	padding-top:10px;
	padding-bottom:10px;
	border-radius:5px;
	width:30%;
}

/* css of remote */
#tblList{
	background:#c9dff0!important;
}
#bottom-right .text-left{
	background:rgba(238, 238, 238,0.3);
}









/* Responsive */
@media only screen and (min-width:320px) and (max-width: 575px)
{
	.nav-item, #top-right .col-sm-3 
	{
		font-size:18px;
	}
	.nav-item:hover{
		padding-left:0px;
	}
	#nav-content .nav-link
	{
		padding:20px 0 20px 20px;
	}
	#top-right{
		/*background-color:rgb(49,56,62);*/
	}
	#top-right .row {
		text-align:center;
	}
	#top-right .col-sm-3 {
		text-align: center;
		margin-top:10px;
	}
	#top-right .col-sm-9{
		min-height:0px!important;
	}
	#top-right .col-sm-9 p{
		/*color:#fff;*/
	}

	/*#map{
		min-height: 500px;
	}*/
	#address .col-sm-6{
		padding-right:0!important;
	}
	#bottom-right .box {
    	padding: 5px 0 0 0;
	}
	#bottom-right tr:last-child{
		/*text-align:center;
		width:100%;*/
	}
	#update{
		width:99%;
	}
	#bottom-right td{
		/*padding:10px 5px 10px 5px;*/
	}
	#text-box .col-md-4 {
    padding: 0 5px 0 5px;
	}
	#text-box .box-title{
		text-align:center;
	}
	/* history */
	#address .col-sm-6:first-child 
	{
		padding-right:0!important; 
	}
	#bottom-right
	{
		padding:0 10px;
	}
	#address .col-sm-6:first-child
	{
		margin-bottom: 10px;
	}
	#log-out-section
	{
		display: block;
	}
}

@media only screen and (min-width:576px) and (max-width: 767px){
	#nav-content .nav-link i {
		display: block;
	}
	#nav-content .nav-link{
		text-align: center;
		padding-left: 0;
	}
}

@media only screen and (min-width:768px) and (max-width: 1199px){
	#list-devices-view, #date-view, #list-route-view
	{
		font-size: 0.8em;
	}

	.monthly
	{
		font-family: "Trebuchet MS", Helvetica, sans-serif;
		line-height: 22.4px;
		font-size: 0.7em;
	}
}

/*@media (max-width: 991px) { 
	#carousel{
		height: 500px;
	}
}
*/

@media only screen and (max-width: 575px)
{
	#bottom-left 
	{
		min-height:0px;
	}
}