@charset "utf-8";
/* CSS Document */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	margin: 0px;
	padding: 0px;
	/*min-width:1200px;*/
	min-width:1340px;
}

h1 {
	font-size:36px;
	color:#0059c2;
}

h2 {
	font-size:24px;
	color:#B9CA2E;
}

h3 {
	font-size:20px;
	color:#B9CA2E;
}

p {
	color:#606062;
}

hr {
	width:50%;
	color:#348ee1;
	border: 3px solid #0059c2;
	margin:0px 0px 10px 0px;	
}

img {
   /* max-width: 100%;*/
    height: auto;
}

legend {
	font-size:20px;
}
/* ------------------ header ------------------- */

#topBar {
	background-color:#348ee1;
	width: 100% !important;
}

#logIn {
	height: 40px;
	width: 95px;
	text-align:right;
	float:right;
	line-height: 40px;
	padding-right:5px;
}

#logIn a:link  {
	color: #ffffff;
}

#logIn a:hover {
	color: #0f2d4c;
}

#logo {
	height: 95px;
	width: 315px;
	float:left;
}

#icons {
	float: right;
	margin-top: 25px;
}

header {
	background-color:#0059c2;
	height: 95px;
	width: 100%;
}

/* ------------------ navigation ------------------- */

 /* Style the list */
ul.tab {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}

/* Float the list items side by side */
ul.tab li {
	border-right: 1px solid #ccc;
	float: left;
}

/* Style the links inside the list items */
ul.tab li a {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}

/* Change background color of links on hover */
ul.tab li a:hover {background-color: #ddd;}

/* Create an active/current tablink class */
ul.tab li a:focus, .active {
	/*background-color: #ccc;
	font-weight:bold;
	text-decoration:underline;*/
}

/* Style the tab content */
.tabcontent {
    display: none;
    /*padding: 6px 12px;*/
    /*border: 1px solid #ccc;*/
    border-top: none;
	-webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}	
   
/* ------------------ section ------------------- */

/*section { 
	background-image:url(images/homepagePic.png);
	background-repeat:no-repeat;
	background-color: #348ee1;
}*/

#wrapper {
	width:100%;
	/*position: absolute;*/
	/*background-color: #99CCFF;*/
	color:#606062;
	margin: 0 auto;
	/*border: 1px solid #0059c2;*/
}

#wrappermaininside {
	width:1340px;
	/*position: absolute;*/
	/*background-color: #99CCFF;*/
	color:#606062;
	margin: 0 auto;
	/*border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;*/
}
#wrappermenu{
	width: 900px;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	color: #606062;
	background-color: #f0f0f0;
	border-radius:25px;
	-moz-border-radius:20px;
	-webkit-border-radius: 20px;
	-ms-border-radius: 20px;
	border: 1px solid #348ee1;
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
}


#wrapperadmin {
	width: 900px;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	color: #606062;
	background-color: #FFFFFC;
	border-radius:25px;
	-moz-border-radius:25px;
	-webkit-border-radius: 25px;
	-ms-border-radius: 25px;
	border: 1px solid #0059c2;
	margin: 50px auto;
}

#wrapperinneradmin {
	width: 60%;
	color: #606062;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	-ms-border-radius: 5px;
	border: 1px solid #B8B8B8;
	margin: 30px auto;
}

#wrapperlogin {
	width: 550px;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	color: #606062;
	background-color: #FFF;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	-ms-border-radius: 5px;
	border: 1px solid #B8B8B8;
	margin: 125px auto;
}

#wrapperassetform{
	width: auto;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	color: #606062;
	background-color: #FFF;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	-ms-border-radius: 5px;
	border: 1px solid #B8B8B8;
	margin: 50px auto;
}

#wrappermaps{
	width: 1280px;
	margin: 50px auto;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	color: #606062;
	background-color: #FFF;
	border-radius:25px;
	-moz-border-radius:25px;
	-webkit-border-radius: 25px;
	-ms-border-radius: 25px;
}

#headermaps {
	height: 100px;
	background-color:#0059c2;
	border-top-right-radius:20px;
	border-top-left-radius:20px;
	-moz-border-top-right-radius:20px;
	-webkit-border-top-right-radius: 20px;
	-ms-border-top-right-radius: 20px;
	-moz-border-top-left-radius:20px;
	-webkit-border-top-left-radius: 20px;
	-ms-border-top-left-radius: 20px;
}

/*#wrapperMain {
	width: 1900px;
	box-shadow: 0 0 25px rgba(0,0,0,0.3);
	background-color: #FFcc33;
	border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius: 20px;
	-ms-border-radius: 20px;
	border: 1px solid #f48309;
	margin: 0 auto;
	position: absolute;
}
*/

#headeradmin {
	height: 100px;
	background-color:#0059c2;
	border-top-right-radius:20px;
	border-top-left-radius:20px;
	-moz-border-top-right-radius:20px;
	-webkit-border-top-right-radius: 20px;
	-ms-border-top-right-radius: 20px;
	-moz-border-top-left-radius:20px;
	-webkit-border-top-left-radius: 20px;
	-ms-border-top-left-radius: 20px;
}

#headermenu {
	height: 75px;
	background-color: #333333;
	border-top-right-radius:20px;
	border-top-left-radius:20px;
	-moz-border-top-right-radius:20px;
	-webkit-border-top-right-radius: 20px;
	-ms-border-top-right-radius: 20px;
	-moz-border-top-left-radius:20px;
	-webkit-border-top-left-radius: 20px;
	-ms-border-top-left-radius: 20px;
}

#content {
	background-color:#f0f0f0;
}

#contentmenu {
	color: #606062;
	padding: 20px;
	background-image: url(images/gradientbg.png);
	background-repeat: repeat-x;	
}

#contentmaps {
	background-color: #FFFFFF;
	border-bottom: 1px solid #0059c2;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	border-left: 1px solid #0059c2;
	border-right: 1px solid #0059c2;
	color: #606062;
}

#leftCol {
	padding-right: 20px;
	float:left;
	width: 750px;
	margin-left: 10px;

}

#rightCol {
	float:left;
	width: 400px;
}

#leftColReport {
	padding-right: 10px;
	width: 1200px;
	margin-left: 10px;
}

#rightColReport {
	float:left;
	width: 250px;
}

#mapImgs {
	float: left;
	width: 750px;
	margin-top: 20px;
}

#borderline {
	width: 100%;
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #B9CA2E;
}


#whiteSpace {
	height:700px;
	/*font-family:Verdana, Arial, Helvetica, sans-serif;*/
	font-weight:bold;
	font-size:36px;
	text-align:right;
	line-height:750px;
	padding: 0;
	float: right;
}

#homePagePic {
	/*height: 700px;*/
	width: 300px;
	float: left;
}

/* ------------------ form elements ------------------- */


input[type=text],
input[type=email],
input[type=password], 
input[type=reset],
input[type=login],
input[type=submit], 
input[type=edit], 
input[type=delete], 
input[type=add], 
input[type=cancel],
input[type=save],
select, textarea
{
	border: 1px solid #ccc;
	/*line-height: 20px;*/
	padding: 3px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-ms-border-radius: 5px;
	border-radius: 5px;
/*
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));  
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);*/ 
}

input[type=reset], input[type=submit], input[type=login], input[type=edit], input[type=delete], input[type=add], input[type=cancel], input[type=save] 
{
	color:#FFFFFF;
	text-align:center;
	background-color:#0059c2;
	cursor:pointer;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	background: #0059c2; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(#0059c2, #0f2d4c); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#0059c2, #0f2d4c); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#0059c2, #0f2d4c); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#0059c2, #0f2d4c); /* Standard syntax */

	letter-spacing: 3px;
}

input[type=reset]:hover, input[type=submit]:hover, input[type=login]:hover, input[type=edit]:hover, input[type=delete]:hover, input[type=add]:hover, input[type=cancel]:hover, input[type=save]:hover 
{
	/*background-color: #0f2d4c; */
	font-weight: bold;
	cursor:pointer;  
}

input[type=checkbox],
input[type=radio]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  /* -webkit-transform: scale(1.3, 1.3);for Safari if first approach doesn't work */
  -o-transform: scale(1.5); /* Opera */
  padding: 10px;
  margin-left:10px;
  border: none !important; /*Remove the borders for IE 7 and 8*/
  outline: 0 !important; /*Remove the the dotted borders in IE 6 and up*/
}

input[type=text]{
	width:150px;
}

input[type=text2]{
	width:450px;
	height:25px;
}

input {
	color: #606062;
	margin: 0px;
	padding: 0px;
}

select, textarea {
	color: #606062;
}

textarea {
	/*font-size: 12px;*/
	font-family: Arial, Helvetica, sans-serif;
	line-height: 30px;
	resize:none;
}

select, input, textarea, button, label {
	font-size: 120%;
}

/*label {
	font-weight:bold;
}*/

/*

fieldset {
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF)); 
    background: -moz-linear-gradient(bottom, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px); 
}

.radioBtns {
	-ms-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius:5px;
	border: 1px solid #ccc;
	padding:0.2em;
	margin:0.5em;
	cursor:pointer;
	text-align: center;
	background-color: #f0f0f0;
	display: block;	//background-image: url(images/btn2.png);
	//background-repeat: no-repeat;
}

.radioBtns:hover {
    background:#ccc;   
}

label.btns {
	color: #606062;
	background-color: #CCCCCC;
	border-radius:20px;*/
	/*-moz-border-radius:50px;*/ /* presetting the height */
	/*border: 3px solid #333333;
	cursor: pointer;
	width:450px;
	height: 50px;
}*/


 /* tooltip styling. by default the element to be styled is .tooltip  

.tooltip {
	font-size:12px;
	height:70px;
	width:160px;
	padding:25px;
	color:#eee;
	background-color: #0066CC;
  }*/

span.anchorlink {/*this fix the anchor links and fixed header*/
	padding: 117px 0 0 0; 
}

.line {
	border-bottom-style:dotted;
	border-bottom-color:#f48309;
	border-bottom-width:1px;
	width:100%;
	margin-top: 20px;
	margin-bottom: 20px;
}

.viewPort_container {
	border: 1px solid #606062;
	float: left;
	width: 740px;
}

.textField {         
    font-size:14px;
    font-weight:normal;
}

.headerField {         
    font-size:14px;
    font-weight:bold;
}

.reportText {
	font-size:24px;
	font-weight:bold;
}

/* ------------------ footer ------------------- */

footer {
	text-align:center;
	color: #FFFFFF;
	background-color: #0059c2;
	width:100% !important;;
}

.footerTextColor {
	line-height: 50px;
	color: #FFFFFF;
}

#footeradmin {
	font-size: 10px;
	color: #606062;
	text-align: center;
	height: 50px;
	width: 900px;
	line-height: 50px;
	margin: 0px auto;	
}

/* ------------------ links ------------------- */

a:link {
	color: #ffffff;
	text-decoration: none;
	outline: 0;
}

a:visited {
	color: #B9CA2E;
	text-decoration: none;
}

a:hover {
	color: #0059c2;
	text-decoration: none;
}

a:active {
	color: #000000;
	text-decoration: none;
}

/*.active {
	background-color: #0059c2;
}*/

/* ------------------ misc. ------------------- */

.break {
	clear: both;
}

.fixed {
	position:fixed;
}

.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.floating-box {
    display: inline-block;
    width: 242px;
    height: 321px;
    margin: 10px;
    border: 3px solid #73AD21;  
}

.padding {
	padding-right: 18px;
	padding-bottom:18px;
}

.padding2 {
	padding-bottom:18px;
}

table {
	width:500px;
}

.tableMapsStyle {
	width: 400px;
}
.tableReportsStyle {
	width: 250px;
}

.tableStyle {
	border-collapse: collapse;
	/*overflow-y:auto;*/
}

.tableStyle th{
	font-weight:normal;
	color:#FFFFFF;
	background-color:#348ee1;
	border-right-color:#666666;
}

.tableStyle tr:nth-child(even){
	background-color: #f2f2f2
}

.tableStyle tr:hover {
	background-color: #ddd;
}

/*.scroll {
    overflow:auto;
	 overflow-y: auto;
	  overflow-x: auto;
	  overflow:scroll;
	 overflow-y: scroll;
	  overflow-x: scroll;
    height:100px;
	width:50%;

}*/

#row {
	/*height: 350px;*/
	width: 50%;
	text-align:center;
	margin: 100px auto;
	padding-top: 75px;
	padding-bottom: 75px;
	border: 1px solid #0059c2;
	background-image: url(images/bg.jpg);
	background-repeat: no-repeat;
}

#Box1 {
	width: 950px;
	height: 220px;
	float: left;
	border-right: 1px solid #23629d;
}

#Box2 { 
	width: 950px;
	height: 220px;
	float: left;
	border-right: 1px solid #23629d;
}

.column {
	/*background-color: #23629d;*/
	border: none;
	padding-right: 12px;
	/*padding: 15px 32px;*/
    /*text-align: center;*/
    text-decoration: none;
	/*display: inline-block;*/
    /*margin: 4px 2px;*/
	width: 525px;
	/*height: 100%;*/
	/*width:56.2%;*/
	/*width: 42.5%;*/
	/*width: 16.6667%;   fallback for non-calc() browsers */
    /*width: calc(100% / 2);*/
    float: left;
}

.column2 {
	border: none;
	padding-right: 12px;
	/*padding: 15px 32px;*/
    /*text-align: center;*/
	text-decoration: none;
	/*display: inline-block;*/
	/* margin: 4px 2px;*/
	/*width: 250px;*/
	/*height: 100%;*/
	/*width:43.8%;*/
	width:785px;
	position:relative;
	/*left:540px;*/
	/*width: 16.6667%;  fallback for non-calc() browsers */
	/*width: calc(100% / 2);*/
	float: left;
}

.button1 {
    background-color: #23629d; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
   /* cursor: pointer;*/
}

.button1data {
    background-color: #ffffff; 
    border: 1px solid #23629d;
    color: #23629d;
    padding: 15px 32px;
    text-align: center;
    /*text-decoration: none;*/
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
	width:250px;
   /* cursor: pointer;*/
}

.button2 {
    background-color: #20b0d9; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
   /* cursor: pointer;*/
}

.button2data {
    background-color: #ffffff; 
    border: 1px solid #20b0d9; 
    color: #20b0d9; 
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
	width:250px;
   /* cursor: pointer;*/
}

.button3 {
    background-color: #79ba4a; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}

.button3data {
    background-color: #ffffff; 
    border: 1px solid #79ba4a; 
    color: #79ba4a;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
	width:250px;
   /* cursor: pointer;*/
}

.button4 {
    background-color: #0e2c4b; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
   /* cursor: pointer;*/
}

.button4data {
    background-color: #ffffff; 
    border: 1px solid #0e2c4b;  
    color: #0e2c4b;  
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
	width:250px;
   /* cursor: pointer;*/
}

#rcorners1 {
	display: inline-block;
	/*width: inherit;*/
	border-radius: 25px;
	/*background: #ffffff;*/
	width: 370px;
	height: 210px;
	border: 1px solid #999;
	/*float: left;*/
	margin: 20px;
	/*margin: 0 5px 2em 0;*/
  	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
}

#rcorners1 a {
	color:#0f2d4c;
}

#rcorners1 a:visited {
	color:#000000;
}

#rcorners1 a:hover {
	color:#348ee1;
}

#rcorners1 a:active{
	color:#79ba4a;
}

#rcorners2 {
	border-radius: 25px 25px 0px 0px;
	/* -moz-border-radius-topleft: 25px;
  -moz-border-radius-topright: 25px;
  -webkit-border-top-left-radius: 25px;
  -webkit-border-top-right-radius: 25px;*/
  /*border-radius: 25px;*/
	background-color: #348ee1;
	width: 370px;
	height: 40px;
}

#Sidewalks{
  /* background: #f0f0f0; For browsers that do not support gradients */
  /*background: -webkit-linear-gradient(#f0f0f0, #fff); Safari 5.1-6*/
  /*background: -o-linear-gradient(#f0f0f0, #fff); Opera 11.1-12*/
  /*background: -moz-linear-gradient(#f0f0f0, #fff); Fx 3.6-15*/
  /*background: linear-gradient(#f0f0f0, #fff); Standard*/
}

#Ramps{
  /*background: #fafac2;  For browsers that do not support gradients */
  /*background: -webkit-linear-gradient(#fafac2, #fff); Safari 5.1-6*/
  /*background: -o-linear-gradient(#fafac2, #fff); Opera 11.1-12*/
  /*background: -moz-linear-gradient(#fafac2, #fff); Fx 3.6-15*/
  /*background: linear-gradient(#fafac2, #fff); Standard*/
}

#Crossings{
  /*background: #dffcc8;  For browsers that do not support gradients */
  /*background: -webkit-linear-gradient(#dffcc8, #fff); Safari 5.1-6*/
  /*background: -o-linear-gradient(#dffcc8, #fff); Opera 11.1-12*/
  /*background: -moz-linear-gradient(#dffcc8, #fff); Fx 3.6-15*/
  /*background: linear-gradient(#dffcc8, #fff); Standard*/
}


/*//////////////////////////////////////Responsive Web Design////////////////////////////////////////////*/
/*
* {
    box-sizing: border-box;
}
.row::after {
    content: "";
    clear: both;
    display: block;

	width: 100%;   fallback for non-calc() browsers 
	margin: 100px auto;
	text-align:center;
	}
[class*="col-"] {
    float: left;
    padding: 15px;
}
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
*/
