body {
	display: flex;
	flex-direction: column;
	background: rgba(0,0,0,0.02);
}
  
@media only screen and (min-width: 601px) {
  	body {
  		min-height: 100vh;
  	}

	.task_details.desktop {
		display: inline-table;
	}

	.task_details.mobile {
		display: none;
	}	
}

@media only screen and (max-width: 600px) {
	.task_details.desktop {
		display: none;
	}

	.task_details.mobile {
		display: inline-table;
	}

	.hideMobile {
		display: none;
	}

	.centerAlignMobile {
		text-align: center !important;
	}

	.card-title {
		text-align: center;
		padding: 0 !important;
		margin-bottom: 0 !important;
		
	}

	.card-subtitle {
		text-align: center;
		padding: 0 !important;
	}

	.card-header-btn {
		text-align: center !important;	
	}

	.card-header-btn a {
		margin: 20px auto !important;
	}

}

.card-header-btn {
	text-align: right;	
}

.card-header-btn a {
	margin: 5px 20px 20px 5px;
}

.switch label input[type=checkbox]:checked+.lever:after {
	background-color: #1a237e;
}	

.switch label input[type=checkbox]:checked+.lever {
	background-color: #959dcd;
}

  main {
    flex: 1 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: -webkit-calc(100vh - 64px);
    min-height: -moz-calc(100vh - 64px);
    min-height: calc(100vh - 64px);
  }

  .collapsible-header.inactive {
	  background-color: #f3ff143d;
  }
  
  nav {
  	height: 64px !important;
  	line-height: 64px !important;
  }
  
  nav .sidenav-trigger {
  	height: 64px !important;
  }
  
  nav .sidenav-trigger i {
  	height: 64px !important;
  	line-height: 64px !important;
  }

  .notification {
	min-height: 75px;
    padding: 5px;
    background-color: white;
    border-bottom: solid 1px #e0e0e0;
  }

  .notification a {
	  text-decoration: underline;
  }

  .notification.error {
	  background-color: #fef4f3;
  }

  .notification-title {
	font-weight: 600;
	font-size: 17px;
	line-height: 18px;
  }

  .notification-title.error {
	  color: #da2a2a;
  }

  .ocean { 
		height: 5%;
		width:100%;
		position:fixed;
		bottom:0;
		left:0;
		background: #b4b9da;
	}

	.wave {
		background: url(/static/img/wa.svg) repeat-x; 
		position: absolute;
		top: -198px;
		width: 6400px;
		height: 198px;
		animation: wave 35s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
		transform: translate3d(0, 0, 0);
	}

	.wave:nth-of-type(2) {
		top: -175px;
		animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite, swell 7s ease -1.25s infinite;
		opacity: 1;
	}

	@keyframes wave {
		0% {
			margin-left: 0;
		}
		100% {
			margin-left: -1600px;
		}
	}

	@keyframes swell {
		0%, 100% {
			transform: translate3d(0,-25px,0);
		}
		50% {
			transform: translate3d(0,5px,0);
		}
	}
  
  .login_background {
  	background-image: url('/static/img/cityoflasvegas.jpg');
  	background-size: cover;
  	background-repeat: no-repeat;
  	margin-top: 0px;
  	height: 100vh;
  	height: -webkit-calc(100vh - 64px);
    height: -moz-calc(100vh - 64px);
    height: calc(100vh - 64px);
  }
  
  .city_seal {
  	height: 15vh;
  	width: auto;
  	display: block;
  	margin: auto;
  }
  
  .no_bottom_margin {
  	margin-bottom: 0;
  }

  .incorrectLoginText, .incorrectInviteText {
    text-align: center;
    font-size: 13px;
    color: #dc282f;
  }

  .hidden {
      display: none !important;
  }
  
  input[type=email]:not(.browser-default):focus:not([readonly]) {
      border-bottom: 1px solid #303f9f;
      box-shadow: 0 1px 0 0 #303f9f;
   }

   textarea.materialize-textarea:focus:not([readonly]) {
	   border-bottom: 1px solid #303f9f;
       box-shadow: 0 1px 0 0 #303f9f;
   }

    textarea.materialize-textarea:focus:not([readonly]) + label {
		color: #303f9f;
	}

   
   input[type=email]:not(.browser-default):focus:not([readonly]) + label {
      color: #303f9f;
   }
   
   input[type=password]:not(.browser-default):focus:not([readonly]) {
      border-bottom: 1px solid #303f9f;
      box-shadow: 0 1px 0 0 #303f9f;
   }
   
   input[type=password]:not(.browser-default):focus:not([readonly]) + label {
      color: #303f9f;
   }

   [type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:after {
		background-color: #303f9f;
	}

	[type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:before, [type="radio"].with-gap:checked+span:after {
		border: 2px solid #303f9f;
	}
   
    input[type=text]:not(.browser-default):focus:not([readonly]) {
      border-bottom: 1px solid #303f9f;
      box-shadow: 0 1px 0 0 #303f9f;
   }
   
   input[type=text]:not(.browser-default):focus:not([readonly]) + label {
      color: #303f9f;
   }
   
   input[type=text]:not(.browser-default):not([readonly]) {
      border-bottom: 1px solid #9e9e9e;
      box-shadow: 0 1px 0 0 white;
   }
   /*
   input[type=text]:not(.browser-default):focus:not([readonly]) + label {
      color: white;
   }*/
   
   input[type=text]:not(.browser-default):not([readonly]) + label {
      /*color: lightgrey;*/
   }

@media only screen and (orientation: landscape) {
	.brand-logo {
		margin-left: 40px;
	}
	
	.login_header {
		font-size: 130%;
	}
}

@media only screen and (max-width: 600px) {
	
	.city_seal {
		height: 12vh;
		width: auto;
	}
	
	.login_header {
		font-size: 150%;
	}
}

.header {
	animation-duration: 2s;
	animation-delay: 1s;
}

.server:nth-child(1) {
	animation-duration: .5s;
	animation-delay: .1s;
}

.server:nth-child(2) {
	animation-duration: .5s;
	animation-delay: .2s;
}

.server:nth-child(3) {
	animation-duration: .5s;
	animation-delay: .3s;
}

.server:nth-child(4) {
	animation-duration: .5s;
	animation-delay: .4s;
}

.server:nth-child(5) {
	animation-duration: .5s;
	animation-delay: .5s;
}

.stationary_bg {
	background: linear-gradient(to bottom right, rgba(255,255,255,.95), rgba(186, 208, 237, .9)), url(/static/img/cityoflasvegas.jpg);
    position: fixed;
    top: 0;
    /* bottom: 0; */
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    background-size: cover;
}



.task_details {
	background-color: white;
}

.task_details thead, .task_details tbody {
	width: 100%;
}

.task_details thead tr td {
	font-weight: bold;
	border-bottom: solid 1px #AEB0B2;
	text-align: center;
}

.task_details thead tr  {
	background-color: #e0e0e0;
}

.task_details tbody tr {
	background-color: #e0e0e02b;
}

.task_details tbody tr td {
	text-align: center;
}

.parallax-container {
	height: 300px;
}

.login_input_animated:nth-child(1) {
	animation-duration: 1s;
	animation-delay: .2s;
}

.login_input_animated:nth-child(2) {
	animation-duration: 1s;
	animation-delay: .3s;
}

.login_input_animated:nth-child(3) {
	animation-duration: 1s;
	animation-delay: .4s;
}

.login_input_animated:nth-child(4) {
	animation-duration: 1s;
	animation-delay: .5s;
}



.fixed-height-nav {
	height: 64px !important;
	line-height: 64px !important;
	z-index: 1000 !important;
}

.sidenav_main {
	z-index: 10000 !important;
}

.sidenav_checkbox {
	margin-left: 30px;
	margin-top: 0;
	margin-bottom: 0;
	margin-right: 20px;
}

.card-title {
	padding-left: 24px;
	margin-bottom: 0 !important;
}

.card-subtitle {
	padding-left: 24px;
	font-size: 80%;
}

.card-stat h2 {
    font-size: 40px;
    font-weight: bold;
    text-align: center;
    margin: 15px;
    color: #303f9f;
}

.card-stat hr {
    width: 80%;
    margin: 0 auto;
    border: solid .5px lightgrey;
}

.card-stat p {
    text-align: center;
    font-size: 15px;
    line-height: 14px;
    margin-top: 10px !important;
}

.sidenav_search {
	margin-left: 30px;
	margin-right: 30px;
}

.center_icon {
	width: 100%;
	height: 100%;
	
}

.collapsible-body {
	padding: 0 !important;
}

.hidden_element {
	display: none !important;
}

@media only screen and (max-width: 992px) {
	.sidenav_map_mobile {
		-webkit-transform: translateX(0%) !important;
		transform: translateX(0%) !important;
	}
}

.overflow-x {
	overflow-x: auto;
}

.loading_bar_cover {
	height: 100%;
	width: 100%;
	position: absolute;
	background: rgba(255,255,255,.4);
	z-index: 995 !important;
	display: none;
}

.full_line_height {
	line-height: 100%;
	margin-top: 50vh;
	width: 40vw;
	margin-left:30vw;
}

.progress {
	z-index: 996 !important;
	background-color: #acc6ec;
}

.progress .indeterminate {
	background-color: #303f9f;
}

.outer_face {
    position: relative;
    width: 200px; /* width of clock */
    height: 200px; /* height of clock */
    border-radius: 200px; /* clock round corner radius */
    background: white;
    box-shadow: inset 0 0 10px #011594;
    border: 1px solid #011594; /* thickness of outer border */
    }

.outer_face::before, .outer_face::after, .outer_face .marker { /* time markers syle */
    content: "";
    position: absolute;
    width: 8px; /* width of 12-6 and 3-9 markers */
    height: 100%;
    background: #1a237e;
    z-index: 0;
    left: 50%;
    margin-left: -4px; /* set this value of 1/2 marker width */
    top: 0
    }

.outer_face::after {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
    }

.outer_face .marker {
    background: #303f9f;
    width: 6px; /* width of all other markers */
    margin-left: -3px /* set this value of 1/2 marker width */
    }

.outer_face .marker.oneseven {
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
    }

.outer_face .marker.twoeight {
    -moz-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg)
    }

.outer_face .marker.fourten {
    -moz-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    -webkit-transform: rotate(120deg);
    transform: rotate(120deg)
    }

.outer_face .marker.fiveeleven {
    -moz-transform: rotate(150deg);
    -ms-transform: rotate(150deg);
    -webkit-transform: rotate(150deg);
    transform: rotate(150deg)
    }

.inner_face {
    position: relative;
    width: 88%;
    height: 88%;
    background: white;
    -moz-border-radius: 1000px;
    -webkit-border-radius: 1000px;
    border-radius: 1000px;
    z-index: 1000;
    left: 6%; /* set this value of 1/2 width value*/
    top: 6% /* set this value of 1/2 height value*/
    }

.inner_face::before {
    /* clock center circle small */
    content: "";
    width: 18px; /* width of inner circle */
    height: 18px; /* height of inner circle */
    border-radius: 18px;
    margin-left: -9px; /* set this value of 1/2 width value*/
    margin-top: -9px; /* set this value of 1/2 height value*/
    background: black;
    position: absolute;
    top: 50%;
    left: 50%;
    box-shadow: 0 0 30px lightgrey;
    }

.inner_face::after {
    content: "AutoGIS";
    position: absolute;
    width: 100%;
    font: normal 0.8em Arial;
    color: gray;
    text-align: center;
    top: 85%
    }

.hand, .hand.hour {
    position: absolute;
    width: 4px; /* width of hour hand */
    height: 30%; /* height of hour hand */
    top: 20%; /* set top to 50% - height */
    left: 50%;
    margin-left: -2px; /* set this value to 1/2 width */
    background: black;
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -moz-transform-origin: bottom;
    -ms-transform-origin: bottom;
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    z-index: -1;
    -moz-box-shadow: 0 0 3px gray;
    -webkit-box-shadow: 0 0 3px gray;
    box-shadow: 0 0 3px gray
    }

.hand.minute {
    height: 45%; /* height of min hand */
    top: 5%; /* set top to 50% - height */
    width: 5px; /* width of min hand */
    margin-left: -2.5px; /* set this value to 1/2 width */
    }

.hand.second {
    height: 50%; /* height of sec hand */
    width: 2px; /* width of sec hand */
    margin-left: -1px; /* set this value to 1/2 width */
    top: 0;
    background: red
    }

.datepicker-table td.is-today {
    color: #0b2af7;
}

.datepicker-date-display, .timepicker-digital-display {
    background-color: #303f9f;
}

.datepicker-today, .datepicker-done, .timepicker-close {
    color: #303f9f;
}

.datepicker-table td.is-selected {
    background-color: #1a237e;
}

.timepicker-canvas line {
    stroke: #303f9f;
}

.timepicker-canvas-bg, .timepicker-canvas-bearing {
    fill: #303f9f;
}