@font-face {
	font-family: Roboto-Light;
    src: url('../font/Roboto-Light.ttf') format('truetype');
}

@font-face {
	font-family: Roboto-Regular;
    src: url('../font/Roboto-Regular.ttf') format('truetype');
}

@font-face {
	font-family: Roboto-Medium;
    src: url('../font/Roboto-Medium.ttf') format('truetype');
}

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

::-webkit-scrollbar-track {
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 8px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}



/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }

.splash {
	width: 100%;
	height: 100%;
	background: #eee;
	color: #636363;
	font: 48px Roboto-Light;
	letter-spacing: 2px;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-end {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.splash img {
	width: 60px;
	height: 60px;
	margin-right: 10px;
}

.splash span {
	height: 60px;
	font-family: Roboto-Medium;
	vertical-align: middle;
}

/*header {
	width: 100%;
	padding: 30px 0px;
	color: #636363;
	font: 36px Roboto-Light;
	letter-spacing: 3px;
	text-align: center;
}

header img {
	width: 50px;
	height: 50px;
	margin-right: 10px;
	vertical-align: middle;
}

header span {
	vertical-align: middle;
}

header strong {
	color: black;
	font: 20px Roboto-Medium;
}*/



.row {
	margin: 0px;
}

.title {
	height: 48px;
	padding: 14px 12px;
 	font: 20px Roboto-Medium;
}


.halfCardtitleOrangeBorder {
	height: 32px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: white;  
    border: 1px solid #FF6E2B;       
}

.halfCardtitleGreenBorder {
	height: 32px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: white;  
    border: 1px solid #92d050;       
}

.halfCardtitleOrangeBox {
	height: 32px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #FF6E2B;         
}

.halfCardtitleOrangeBox_List {
	height: 32px;
    width:100%;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #FF6E2B;         
}

.halfCardtitleRedBox_List {
	height: 32px;
    width:100%;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #ff0000;         
}

.halfCardtitleGreenBox_List {
	height: 32px;
    width:100%;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #92d050;         
}


.halfCardtitlelastInfoOrangeBox {
	height: 29px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #FF6E2B;      
}

.halfCardtitlelastInfoOrangeBorder {
	height: 29px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: white;  
    border: 1px solid #FF6E2B;  
}

.halfCardtitlelastInfoGreenBorder {
	height: 29px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: white;  
    border: 1px solid #92d050;  
}

.GenetecPermitDetails {
	height: 23px;
    width:260px;
    vertical-align:middle;
    text-align: left; 
    font: 16px Roboto-Medium;
    background-color:none;      
}

.PermitHeader {
	height: 23px;
    width:50px;
    margin-top:4px;
    float:left;
    vertical-align:middle;
    text-align: left; 
    font: 16px Roboto-Medium;
    background-color:none;      
}

.PermitValueTxt {
	height: 23px;
    width:90px;
    margin-top:4px;
    vertical-align:middle;
    text-align: left; 
    font: 16px Roboto-Medium;
    background-color:none;      
}


.halfCardtitlelastInfoOrangeBox_List {
	height: 29px;
    width:83.5%;
    margin-top:13px;
    vertical-align:middle;
    text-align: center; 
    background-color: #FF6E2B;      
}

.halfCardtitlelastInfoGreenBox_List {
	height: 29px;
    width:83.5%;
    margin-top:13px;
    vertical-align:middle;
    text-align: center; 
    background-color: #92d050;      
}

.halfCardtitlelastInfoRedBox_List {
	height: 29px;
    width:83.5%;
    margin-top:13px;
    vertical-align:middle;
    text-align: center; 
    background-color: #ff0000;      
}

.halfCardtitlelastInfoGreenBox {
	height: 29px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #92d050;      
}

.halfCardtitlelastInfoRedBox {
	height: 29px;
    width:260px;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #ff0000;      
}

.halfCardtitlelastInfoRedBox_Fullcard {
	height: 29px;
    width:96%;
    vertical-align:middle;
  
    text-align: center; 
    background-color: #ff0000;      
}

.halfCardtitleGreenErrorBox {
	height: 32px;
    width:260px;
    vertical-align:middle;
    text-align: left; 
    background-color: #FF6E2B;    
    margin-bottom:5px;  
}

.BootBox {
	height: 30px;
    width:260px;
    vertical-align:middle;
    text-align: left; 
    background-color: #ff0000; 
    margin-bottom:15px;  
}

.BootAbandonEligibleRedBox {
	height: 30px;
    width:250px;
    vertical-align:middle;
    font: 15px Roboto-Medium;
    text-align: left; 
    background-color: #ff0000;    
    
    margin-top:8px;
}

.BootAbandonEligibleRedBox_Fullcard {
	height: 30px;
    width:96%;
    vertical-align:middle;
    font: 15px Roboto-Medium;
    text-align: left; 
    background-color: #ff0000;    
    
    margin-top:8px;
}

.BootAbandonEligibleGreenBox {
	height: 30px;
    width:260px;
    vertical-align:middle;
    font: 15px Roboto-Medium;
    text-align: left; 
    background-color: #92d050;    
    
    margin-top:8px;
}

.halfCardtitleRedBox {
	height: 32px;
    width:260px;
    vertical-align:middle;
    text-align: center; 
    background-color: #ff0000;      
}

.halfCardtitleGreenBox {
	height: 32px;
    width:260px;
    vertical-align:middle;
    text-align: center; 
    background-color: #92d050;      
}



.halfCardTitleText {
    border: none;
    height: 30px;
    font: 16px Roboto-Medium;
    color: black;
    font-weight:600;
    border-radius: 1px;
    vertical-align:middle;
    background-color: transparent;
    
}

.geneticErrorMessage {
    border: none;
    height: 30px;
    font: 20px Roboto-Medium;
    color: white;
    border-radius: 1px;margin-left:10px;
    width:5px;float:left;margin-right:15px;
    background-color: transparent;
    
}

.plateErrorMessage {
    border: none;
    height: 30px;
    font: 12px Roboto-Medium;
    margin-top:9px;
    color: black;
    border-radius: 1px;
   
    background-color: transparent;
    
}

.rotateArrowUp
{
   
/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}


.rotateArrow {
   
/* Safari */
-webkit-transform: rotate(90deg);

/* Firefox */
-moz-transform: rotate(90deg);

/* IE */
-ms-transform: rotate(90deg);

/* Opera */
-o-transform: rotate(90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

halfCardTitleTextSmall {
     vertical-align:middle;
     border: none;
    height: 30px;
    font: 13px Roboto-Medium;
    font-weight:800;
    color: black;
    border-radius: 1px;
    background-color: orange;
}

halfCardTitleTextSmall_border {
     vertical-align:middle;
     border: none;
    height: 30px;
    font: 13px Roboto-Medium;
    font-weight:800;
    color: black;
    border-radius: 1px;
    background-color: white;
}



halfCardTitleTextSmall_Red {
     vertical-align:middle;
     border: none;
    height: 30px;
    font: 13px Roboto-Medium;
    font-weight:800;
    color: black;
    border-radius: 1px;
    background-color: #ff0000;
}

halfCardTitleTextSmall_Green {
     vertical-align:middle;
     border: none;
    height: 30px;
    font: 13px Roboto-Medium;
    font-weight:800;
    color: black;
    border-radius: 1px;
    background-color: #92d050;
}

.statusHeaders {
    margin-top:5px;
    margin-bottom:2px;
    height:15px;
     font: 13px Roboto-Medium;
     color: black;
     vertical-align:middle;
}

.statusLeftHeaderText {
  height:17px;float:left;margin-left:13px;width:174px;
}

.statusRightHeaderText {
  height:17px;
}

.sub-title {
	height: 48px;
	padding: 17px 12px;
 	font: 14px Roboto-Medium;
}



.icon-button {
	height: 48px;
	padding: 6px 0px;
	color: rgba(0, 0, 0, .54);
}

.icon-button.active {
	color: rgba(0, 0, 0, .87);
}

.google-map-section {
 	position: relative;
 	/*height: calc(100% - 48px);*/
     height: calc(100% - 0px);
 	display: flex;
    align-items: flex-end;
}

.google-map {
 	position: absolute;
 	left: 0;
 	top: 0;
 	width: 100%;
 	height: 100%;
}
/*
.gmnoprint {
	display: none;
}

.gm-style div a {
	display: none !important;
}*/

.google-map-section .row {
	width: 100%;
}

.icon-bottom-right {
	margin-top: -48px;
	padding: 0;
}

.space-card {
	position: absolute;
	left: 20px;
	top: calc(50% - 100px);
	width: calc(100% - 40px);
	height: 200px;
	padding: 20px;
	background: #eee;
	border: 1px solid black;
	border-top-left-radius: 2px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

.gm-style-iw div {
	overflow: hidden !important;
}

.info-width {
	width: 255px !important;
	margin-top: 8px;
	overflow: hidden;
}

.alignleft {
    float: left;
}
.alignright {
    margin-right:0px;
	
}

.info-time {
	height: 22px;
    vertical-align:middle;
	/*padding: 3px 0px;*/
	font: 16px Roboto-Medium;
    font-weight:600;
	border: 1px solid black;
	background: #F0F0F0;
}


.info-timeExclamation {
	height: 29px;
    width: 8px;
    color:white;
    vertical-align:middle;
    text-align:center;
	
	font: 20px Roboto-Medium;
	border: 1px solid black;
	background: #FF6E2B;
}

.info-timeBootAbandon {
	height: 29px;
    color:white;
    vertical-align:middle;
    text-align:center;
	width: 28px;
	font: 20px Roboto-Medium;
	border: 1px solid black;
	background: #ff0000;
}

.info-timeBootAbandon_Green {
	height: 29px;
    color:white;
    vertical-align:middle;
    text-align:center;
	width: 28px;
	font: 20px Roboto-Medium;
	border: 1px solid black;
	background: #92d050;
}


.info-timeBootAbandonOrange {
	height: 29px;
    color:white;
    vertical-align:middle;
    text-align:center;
	width: 28px;
	font: 20px Roboto-Medium;
	border: 1px solid black;
	background: #FF6E2B;
}



.thickLine {
	height: 2px;
	font: 20px Roboto-Medium;
	border: 0.5px solid black;
	background-color:gray;
    opacity:0.3;
}

.thinLine {
	 border-top: 1px solid gray; 
  border-bottom: 1px solid gray; 
}

.info-timeRed {
	height: 33px;
	padding: 6px 0px;
	font: 20px Roboto-Medium;
	border: 1px solid black;
	background: #F0F0F0;
}

.info-box {
	width: 32px;
	height: 32px;
	margin-left: calc(50% - 16px);
	border: 1px solid black;
}

.info-red {
	background: #f44336;
}

.info-green {
	background: #F0F0F0;
}

.info-orange {
	background: #F0F0F0;
}

.info-icon-button {
	height: 48px;
	padding: 6px 0px;
}

.map-filter {
	position: absolute;
	left: calc(51% - 160px);
	bottom: -58px;
	width: 100%;
	height: 100%;
	padding: 20px;
	/*background:white;*/
  
    background-image:url('../images/FilterPanel.png');
    background-repeat:no-repeat;
	/*border: 1px solid #eee;*/
	/*box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.5);*/
	overflow: hidden;
	display: none;
}



.main-filter {
	position: absolute;
	width: 218px;
	height: 396px;
	left: 20px;
	top: 12px;
}

.sub-filter {
	position: absolute;
	width: 218px;
	height: 396px;
	left: 878px;
	top: 20px;
}

.section {
	height: 300px;
	padding: 12px;
	padding-top: 0px;
	/*overflow: auto;*/
}

.sub-filter .section {
	height: 252px;
}

.filter-active {
	padding: 0;
	margin-bottom: 10px;
}

.section ul {
	padding: 0;
	margin-bottom: 10px;
	list-style-type: none;
	display: none;
}

.section ul li {
	padding: 0px 5px;
}

.section ul li.active {
	background: rgba(0, 0, 0, .38);
}

.profile ul {
	display: block;
}

.category {
	min-width: 125px;
	margin-bottom: 10px;
	background: #454545;
	color: white;
	text-align: left;
}

.sub-filter .category {
	margin-left: 12px;
}

#filter_on_off {
	padding: 10px 0px;
}

.filter-on-off {
	margin-top: 10px;
	font: 14px Roboto-Medium;
}

.filter-on-off div {
	padding: 0px !important;
}

.left-button {
	padding: 0px;
	text-align: left;
}

.right-button {
	padding: 0px;
	text-align: right;
}

.modal-button {
	margin-top: -66px;
    background: #454545;
	color: white;
}

.sections {
	width: 100%;
	height: calc(100% - 48px);
	position: absolute;
	left: 0;
	top: 48px;
	display: none;
}

.activities {
	height: calc(100% - 100px);
	margin: 5px;
	margin-top: 47px;
	border: 1px solid #eee;
	overflow-y: auto;
}

.activity {
	margin: 8px;
	padding: 16px 8px;
	background: #eee;
	color: #0d0d0d;
}

.activity div {
	display: inline-block;
	vertical-align: top;
}

.activity-content {
	width: calc(100% - 60px);
}

.activity-content div + div {
	margin-top: 20px;
}

.activity .icon-button {
	width: 48px;
}

.log-content {
	padding: 12px;
}

.log-content div {
	padding: 0;
}

.log-content div + div {
	padding-left: 5px;
}

.input-group-addon {
	padding: 5px;
}

.form-control {
	padding: 4px 8px;
}

.form-group {
	margin-bottom: 0px;
}

.notes {
	width: 100%;
	padding: 8px !important;
	background: #fbfbfb;
}

.note {
	width: calc(100% - 16px);
	margin: 8px;
	padding: 0px 8px !important;
	border: none;
	border-bottom: 1px solid #ccc;
	background: none;
	color: #eee;
}

.notes input + input {
	margin-top: 20px;
}

.entry-form {
	height: calc(100% - 100px);
	margin: 8px;
	margin-top: 92px;
	overflow-y: auto;
}

.entry-form-left .row {
	margin-top: 20px;
}

.entry-form .title + .row {
	margin-top: 0px;
}

.entry-form label {
	width: 100%;
	font-family: Roboto-Light;
	color: #0d0d0d;
}

input[type="checkbox"]
{
    vertical-align:middle;
    margin-top:-6px;
    margin-right:2px;
}

.entry-form input {
	width: 100%;
	padding: 0px 4px;
	background: #eee;
	border: 1px solid #0d0d0d;
	color: #0d0d0d;
}

.entry-form input[type="button"] {
	margin-top: 27px;
	background: #b7b7b7;
}

.entry-form-left {
	width: calc(100% - 60px);
	margin-right: 7px;
	display: inline-block;
	vertical-align: top;
}

.entry-form-right {
	width: 48px;
	height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
}

#align_bottom {
	position: absolute;
	left: 0;
	top: calc(100% - 48px);
}

.entry-form textarea {
	width: 100%;
	height: 96px;
	padding: 4px;
	background: #eee;
	border: 1px solid #0d0d0d;
	color: #0d0d0d;
	resize: none;
}

.citation-new {
	position: absolute;
	left: calc(50% - 140px);
	top: 188px;
	width: 280px;
	height: 400px;
	padding: 20px;
	background: white;
	border: 1px solid #0d0d0d;
	display: none;
}