html{
	/*font-family: helvetica, arial, sans-serif;*/
	font-family: Montserrat, Helvetica, arial, sans-serif;
	line height: 1.0;
	/*font-size: 16px;*/
	font-size: 1em;
	scroll-behavior: smooth;
	}

/*for Google Fonts*/
@font-face {
  font-family: Montserrat;
	src: url(fonts/Montserrat-Regular.ttf);

	/*src: url(fonts/Montserrat-Light.ttf);*/
	/*src: url(fonts/Montserrat-ExtraLight.ttf);*/
  	/*src: url(fonts/Montserrat-Thin.ttf);*/
	}




/*src: url(Audiowide-Regular.ttf);*/
	/*src: url(fonts/Montserrat-Regular.ttf);*/
	/*src: url(fonts/Montserrat-Light.ttf);*/
	/*src: url(fonts/Montserrat-ExtraLight.ttf);*/




@media screen and (min-width: 360px){
	html{
		font-size:8px
	}
}


@media screen and (min-width: 600px){
	html{
		font-size:11px
	}
}


@media screen and (min-width: 900px){
	html{
		font-size:14px
	}
}

@media screen and (min-width: 1500px){
	html{
		font-size:16px
	}
}

@media screen and (min-width: 1900px){
	html{
		font-size:22px
	}
}

@media screen and (min-width: 2400px){
	html{
		font-size:28px
	}
}


body {
	margin: 0px;
	/*background-image: url("background9.jpg"); */

		/*background-color: #85adad;*/
	
		background-color: #236ab9;

	/*background-color: #0080ff;*/

	/*background-color: #0C356A;*/
	/*background-color: #f5f5f7;*/
	/*background-color: #C5FCDF;*/
	/*background-color: #BBF78C;*/
	font-family: Montserrat, Helvetica, arial, sans-serif;
	color: #484848;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	/*background-size: cover;*/
	box-sizing: border-box; /*DIV size is fixed and not add margin and padding to total width*/
	}



/*format header div*/
#headerrow{
	width: 100%;
	height: 100px;
	padding: 5px
	/*position: fixed;*/
	position: absolute;
	z-index: 5;
	top: 0;
	left: 0;
	margin-top: 0px;
	/*background-color: #133863;*/
		background-color: default;
	opacity: 1;
	padding: 2px;
	float: left;
	text-align:center;
	vertical-align:middle;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}


/*format div for logo in upper left corner */
#logobox{
	background-color: default;
	height:100%;
	width: 30%;
	float: left;
	margin-left: 0px;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box;
	}

/*adjust logo size to fit div*/
#logo{
	width:auto;
	max-width: 98%;
	max-height: 92%;
	background-color: default;
	float: left;
	text-align:center;
	margin: 2px;
	}

/*define the information question mark icon size*/
#iconinfo{
	width: 3vw;
	height: 3vw;
	float: left;
	text-align:left;
	margin: 2px;
	cursor: pointer;
	}


#menu{
	border-radius: 0px;
	background-color: default;
	height: 100%;
	width: 12%;
	float: left;
	text-align:center;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}


/*
#menu{
	background-color: default;
	height: 100%;
	width: 12%;
	float: left;
	text-align:center;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-radius: 0px;
	border-color: white;
	border-width: 0px 0px 0px 0px;
	box-sizing: border-box; 
	}
*/


#menunotice{
	border: 0px solid white;
	border-radius: 0px;
	background-color: default;
	height: 100%;
	width: 28%;
	float: left;
	text-align:center;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}


/* added 2022-12-31 */
#menu20language{
	border-radius: 0px;
	background-color: default;
	height: 100%;
	width: 20%;
	float: left;
	text-align:center;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 2px right, 0px bottom and 0px left */
	box-sizing: border-box; 
	}

/* added 2022-12-31 */
#menu20{
	border-radius: 0px;
	background-color: default;
	height: 100%;
	width: 20%;
	float: left;
	text-align:center;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 2px right, 0px bottom and 0px left */
	box-sizing: border-box; 
	}



/* added 2022-12-31 */
/* ***********************************for user account dropdown menu********************************** */ 
.dropdown {
	width: 100%;
	height: 88%
	display: flex;
		justify-content: center;
		align-items: center;
		text-align:center;
	background-color: default;
	
  	display: inline-block;
  	position: relative;
	box-sizing: border-box; 
	}

.dropdown-options {
	
  	display: none;
  	position: absolute;
  	overflow: auto;
	text-align:center;
	
		left: 40%;
		right: auto;
		transform: translate(-50%,0);

		width: 80%;
		background-color:#fff;
		/*background-color:default;*/
		/*background-color:yellow;*/
  		border-radius:0px;
  		box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.4);
		}

.dropdown-options a {
  	display: block;
  	color: #000000;
  	padding: 6px;
  	text-decoration: none;
  	padding:4px 8x;
	} 

.dropdown-options a:hover {
  	color: #0a0a23;
  	background-color: #ddd;
  	border-radius:5px;
	}

.dropdown:hover .dropdown-options {
  	display: block;	
	}

/* *********************************************************************************************************** */



/* ******************************************* DROPDOWN FOR MUNICIPIOS *********************************************** */

#dropdownspacer{
		height: 170px;
		color: default;
		}


/* format dropdown button */
.dropbtnM { 
	/*background-color: #0066cc;*/
	/*background-color: #00b300;*/

		background-color: #133863; 
		
	color: white;
	padding: 30px;
	/*font-size: 16px;*/
	border: none;
	cursor: pointer;
		/*min-width: 500px;*/
			width: 100%;
			margin-left: 0%;
			margin-right: 0%;
		font-size: 4vw;
		font-family: Arial Montserrat, Helvetica, sans-serif;
		line-height: 4.2vw;
		border-radius:8px;
			border-style: solid;
			border-color: white;
			border-width: 3px 3px 3px 3px;
	}



/* DIV for container for the dropdown content*/
.dropdownM {

	/*position: relative;*/


		/* working here 05-18 */

			position: absolute; 
				z-index: 8;

	/*display: inline-block;*/

			display: block;

		width: 60%;
	
		/*height: 98%;*/

		/*height: 1200px;*/

		margin: 0%;
		/*max-height: 800px;*/
		border-radius:6px;
	padding-bottom: 30px;
  			  		
	}


/* Dropdown content formating , the buttons that drop down*/
.dropdownM-content {
	display: none;

	/*display: block;*/	

	/*position: absolute;*/

		/*position: relative;*/
		/*left:0; top 100%;*/

	background-color: #f9f9f9;
	/*min-width: 500px;*/
		width: 100%;
		margin-left: 0%;
		margin-right: 0%;
		*/width: auto;*/
	/*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
	z-index: 1;
		/*transition-delay: 2s;*/

		transition: all 0.5s ease-in;
		transform: translateY(-10px);




		
			/* height determines how far down it will drop */

			height: 800px;

		/*height: 70%;*/
		margin-bottom: 4px;

		overflow-y: auto;

	}


/* Format links within dropdown */
.dropdownM-content a{
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block
	}


/* Change the color of dropdown links on hover */
.dropdownM-content a:hover{ 
	/*background-color: #f1f1f1;*/
	
	background-color: #c8c8c8;


	cursor: pointer;}




/* Show the dropdown menu on hover */
.dropdownM:hover .dropdownM-content{
	display: block;
	}


/* Change background color of dropdown title at top when dropdown content is shown */
.dropdownM:hover .dropbtnM{

		/*background-color: #004d99;*/
		color: #133863;
		border: 4px solid white;

		/*background-color: #008000;*/

		background-color: #cbe432 

		/*#003cb3;*/
	
	}





/* Change the color of dropdown links on active click */
.dropdownM-content a:active{ 
	background-color: 86b300 ;
	color: white;
	}


/* ******************************************* END DROPDOWN FOR MUNICIPIOS *********************************************** */






/* for login button items in header */
#menulogin {
	border-radius: 0px;
	background-color: default;
	height: 30%;
	width: 10%;
	float: left;
	text-align:center;
	vertical-align:middle;
	/*font-size:1.3em; */
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}





/* for menu items in header */
#menuname {
	border-radius: 0px;
	background-color: default;
	height: 30%;
	width: 10%;
	float: left;
	text-align:center;
	vertical-align:middle;
	font-size:1.3em;
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}




/* ******************************* From Manuals ************************* */

#bucket1{
	width: 100%;
	height: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 30px;
	/*background-color: #091d34;*/
	background-color: default;
	opacity: 1;
	float: left;
	text-align:center;
	color: black;	
	vertical-align:middle;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	display: flex;
	}


#introleft{
	width: 100%;
	height: auto;
	margin-left: 0%;
	margin-right:0%;
	padding: 20px;
	/*background-color: #f0f0f5;*/
	background-color: default;
	float: left;	
	box-sizing: border-box;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */	
	}


#introright{
	width: 40%;
	height: auto;
	margin-left: 0%;
	margin-right:0%;
	padding: 20px;
	/*background-color: #ff944d;*/
	background-color: #091d34;
	float: left;
		font-size:1.0em;
		font-family: Montserrat Arial 'sans-serif';
		color: black;
	display: flex;
		justify-content: center;
		align-items: center;
	color: #d1d1e0;
	border-style: solid;
	border-color: grey;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box;

	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	}

#imageheader{
	width: 100%;
	height: auto;
	position: relative;
	background-color: #091d34;
		/*background-image: url(enchente2024.jpg);*/
		/*background-size: 100%, 100%;*/
		/*background-repeat: no-repeat;*/
	float: left;
	box-sizing: border-box;
	}



#photoheader{
	width: 100%;
	height: auto;
	margin-top: 00px;
	margin-bottom: 00px;
	
	background-color: default;
	float: center;
	text-align:center;
	border: 0px solid grey;
	border-radius: 0px;
	}



#image1{
	height: auto;
	max-height: 80%;
	width: 90%;
	margin-top: 20px;
	margin-bottom: 20px;
	
	background-color: default;
	float: center;
	text-align:center;
	border: 0px solid grey;
	border-radius: 6px;
	}


iframe{
	overflow: hidden;
	}



#mainheading{
	width: 100%;
	height: auto;
	padding-left: 30px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-top: 10px;
	background-color: default;
	float: left;
		font-size:3.2em;
		font-family: Montserrat-SemiBold, Arial, 'sans-serif';
		color: white;
	text-align:left;	
	box-sizing: border-box;
	border-style: solid;
	border-color: grey;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	}



#subheading{
	width: 90%;
	height: auto;
	margin-top: 0px;
	margin-right: 5%;
	margin-left: 5%;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 20px;
	padding-top: 20px;
	/*background-color: #ff944d;*/
	background-color: white;
	float: left;
		font-size:1.8em;
		font-family: Montserrat-SemiBold, Arial, 'sans-serif';
		/*color: #14141f;*/
		color: #202020;
	text-align:left;
	border-radius: 6px;
	box-sizing: border-box;
	border-style: solid;
	border-color: grey;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	}


#results{
	width: 80%;
	height: auto;
	margin-right: 20%;
	padding-left: 30px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-top: 10px;
	background-color: default;
	float: left;
		font-size:1.3em;
		font-family: Montserrat-SemiBold, Arial, 'sans-serif';
		color: white;
	text-align:left;
	box-sizing: border-box;
	border-style: solid;
	border-color: grey;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	}


ul.a{
	list-style-position: outside;
	list-style-image: url('checkorange.gif');
	}

li {
	margin-top: 25px;
	}


/* ************ CSS from Manual for Contact Form ************************** */

#forms2{
	width: 100%;
	height: auto;
	background-color: default;
	padding: 4px;
	margin-top: 30px;
	margin-bottom:30px;
	float: left;
	font-size: 1em;
	font-family: Montserrat, Helvetica, arial, sans-serif;
	color: grey;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}

#contactform{
	width: auto;
	height: auto;
	max-width: 80%;
	background-color: default;
	padding: 8px;
	margin-top: 5px;
	margin-left: 0%;
	float: left;
	font-size: 1.5em;
	font-family: Montserrat, Helvetica, arial, sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-radius: 4px;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}



.formtable{
	background-color: default;
	
	}


table.formtable td{
		background-color: default;
		}


#infotextarea{
	display: inline-block;
	padding: 12px 20px;
	width: 100%;
	height: 4rem;
	cursor: text;
	background-color: white;
	margin-left: 0px;
	margin-bottom: 2px;
	font-size: 20px;
	font-family: arial, sans-serif;
	color: #404040;
	border-width:0px;
	overflow: auto;
	}


.email{
	display: inline-block;
	background-color: white;
	padding: 0.3em;
	font-size: 17px;
	font-family: arial, sans-serif;
	color: #404040;
	border-width:0px;
	overflow: auto;
	width: 100%;
	}

.name{
	display: inline-block;
	background-color: white;
	padding: 0.3em;
	font-size: 17px;
	font-family: arial, sans-serif;
	color: #404040;
	border-width:0px;
	overflow: auto;
	max-width: 100%;
	}

.lastname{
	display: inline-block;
	padding: 0.3em;
	font-size: 17px;
	font-family: arial, sans-serif;
	color: #404040;
	border-width:0px;
	overflow: auto;
	max-width: 100%;
	}

::placeholder{
	opacity: 0.35;
	color: #404040;
	}



.send{
	height: auto;
	width: auto;
	padding: 4px;
	border-radius: 4px;
	background-color: #8686ac;
	font-size: 1em;
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 1px solid white;
	margin-top: 0%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box; 
	}

.send:hover{
	background-color:#18da8d;
	color: black;
	}


#send{
	height: auto;
	width: auto;
	padding: 4px;
	border-radius: 4px;
	background-color: #8686ac;
	font-size: 1em;
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 1px solid white;
	margin-top: 0%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box; 
	}

#send:hover{
	background-color:#18da8d;
	color: black;
	}

#messageform{
	width: auto;
	height: auto;
	max-width: 100%;
	background-color: #00cccc;
	/*background-color: #99ff00;*/
	padding: 4px;
	margin-top: 2px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 2px;
	float: left;
	font-size: 1em;
	font-family: arial, sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-radius: 6px;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}





/* ************************************ END MANUAL CSS ************************** */


#bigbuttons{
	max-height:100%;
	width: 70%;
	}


/* Add a blue text color to links */

a {
  color: dodgerblue;
   }

a:hover{
	cursor: pointer;	/*show pointer on word link */
	}


#bucket2b{
	width: 96%;
	height: 15%;
	padding-left:0em;
	Margin-top: 40px;
	margin-left: 2%;
	margin-right: 2%;
	/*background-color: e6e6e6;*/
	background-color: default;
	opacity: 1;
	float: left;
	text-align:center;
	color: #424245;
	vertical-align:middle;
	border-style: solid;
	border-color: blue;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}


#bucket2{
	width: 96%;
	height: auto;
	padding-left:0em;
	Margin-top: 40px;
	margin-left: 2%;
	margin-right: .5%;
	padding-top:1.5em;
	padding-bottom:1.5em;
	background-color: default;
	opacity: 1;
	float: left;
	text-align:center;
	color: #424245;
	vertical-align:middle;
	border-style: solid;
	border-color: blue;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}


#bucket3{
	width: 96%;
	height: auto%;
	padding-left:0em;
	Margin-top: 60px;
	margin-left: 2%;
	margin-right: 2%;
	background-color: e6e6e6;
	opacity: 1;
	float: left;
	text-align:center;
	color: white;
	vertical-align:middle;
	border-style: solid;
	border-color: blue;
	border-radius: 20px;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}

#latest{
	width: 16%;
	height: auto;
	margin-left: 82%;
	margin-right:2%;
	padding: 5px;
	background-color: #294FCC;
	float: left;
		font-size:1.0em;
		font-family: Montserrat Arial 'sans-serif';
		color: black;
	text-align:center;
	color: #d1d1e0;
	vertical-align:middle;
	box-sizing: border-box;
	border-style: solid; 
	border-width: 0px;
	border-radius: 10px 10px 0px 0px;
	}

#bucketphotos{
	width: 96%;
	height: auto;
	padding-left:0em;
	Margin-top: 0px;
	margin-bottom: 20px;
	margin-left: 2%;
	margin-right: .5%;
	padding-top:1.5em;
	padding-bottom:1.5em;
	/*background-color: #0C356A;*/
	background-color: #294FCC;
	opacity: 1;
	float: left;
	text-align:center;
	color: #d1d1e0;
	vertical-align:middle;
	border-style: solid;
	border-color: blue;
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}


#imagecentering{
		width:auto;
		height:auto;
		}

#searchbuttons{
	margin-left: 0%;
	margin-right: 0%;
	margin-top: 5px;
	margin-bottom: 15px;
	width: 100%;
	height: auto;
	float: left;
	padding: 12px;
	background-color: default;
		border-radius: 6px;
		border-color: grey;
		border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
		border-style: solid;
	box-sizing: border-box;
	}




#showresults{
	margin-left: 0%;
	margin-right: 0%;
	width: 100%;
	height: auto;
	padding: 0 18px;
	
	overflow: hidden;
	/*background-color: #f1f1f1;*/
	/*background-color: #3372ff;*/
	background-color: default;
	box-sizing: border-box;
	}


#footer{
	width: 100%;
	height: 6%;
	background-color: default;
	opacity: 1;
	}


#sectionheading{
	width: 56%;
	height: 100%;
	background-color: default;
	font-size:1.5em;
	font-family: 'Arial' 'sans-serif';
	line-height: 1.6;
	color: white;
	float: left;
	text-align:left;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box; 
	}

#instructions{
	width: 100%;
	height: 60%;
	margin-left: 0%;
	margin-right: 0%;
	margin-top: 0%;
	margin-bottom: 0%;
	background-color: white;
	font-size:1em;
	font-family: 'Arial' 'sans-serif';
	line-height: 1.6;
	color: black;
	float: left;
	text-align:left;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box; 
	}


#formholder{
 	background-color: default;
	width: 100%;
	height: 500px;
	float: left;
	padding: 20px;
	margin-left: 0%;
	margin-top: 20px;
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 2px 2px 2px 2px; /*top-right-bottom-left */
	box-sizing: border-box;
		
	}

#choices{
 	background-color: #668cff;
	width: 100%;
	height: auto;
	float: left;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 20px;
	padding-right: 20px;

	margin-left: 0%;
	margin-top: 20px;
		font-size: 1.1em;
		font-family: Montserrat, Helvetica, sans-serif;
		line-height: 1.2em;
		
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}


#choices2{
 	background-color: #668cff;
	width: 100%;
	height: auto;
	float: left;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 0%;
	margin-top: 20px;
		font-size: 1.5vw;
		font-family: Montserrat, Helvetica, sans-serif;
		line-height: 1.2vw;

		display: flex;
		justify-content: center;
		align-items: center;
		
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}



#controls{
 	background-color: default;
	width: 100%;
	height: auto;
		min-height:300px;
	float: left;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 4px;
	font-size: 1.5vw;
	font-family: Montserrat, Helvetica, sans-serif;
	line-height: 1.2vw;
	
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}


#left{
 	background-color: default;
	width: 100%;
	/*height: 100%;*/
	height: 250px;
	float: left;
	padding-top: 5px;
	padding-bottom: 20px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 2.2vw;
	font-family: Arial, Montserrat, Helvetica, sans-serif;
	line-height: 2.3vw;
		display: flex;
		justify-content: center;
		align-items: flex-start;	
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}

#right{
 	background-color: default;
	width: 100%;
	height: auto;
	margin-top;:30px;
	float: left;
	padding-top: 20px;
	padding-bottom: 30px;
	padding-left: 0px;
	padding-right: 0px;
		border-style: solid;	
		border-radius: 6px;
		border-color: white;
		border-width: 0px 0px 2px 00px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}


#bigbuttons{
 	background-color: default;
	/*width: 100%;*/
		width: 50%;
	height: auto;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
		display: flex;
		justify-content: center;
		align-items: center;	
	box-sizing: border-box;	
	}

#infobar{
 	background-color: default;
	width: 80%;
	height: auto;
		
	float: left;
	padding-top: 20px;
	padding-bottom: 2px;
	padding-left: 30px;
	padding-right: 20px;
	margin-top: 10px;
	font-size: 2.4vw;
	font-family: Montserrat, Helvetica, sans-serif;
	/*color: f8f8f8;*/
		/*color: yellow;*/
			color:#f8f8f8;
		display: flex;
		justify-content: center;
		align-items: center;		
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}


#infobutton{
 	background-color: default;
	width: 10%;
	height: auto;
	float: left;
	padding-top: 20px;
	padding-bottom: 2px;
	padding-left: 0px;
	padding-right: 0px;
	margin-top: 10px;
		display: flex;
		justify-content: center;
		align-items: center;		
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;	
	}




#audienceform{
	width: 98%;
	height: auto;
	background-color: default;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 12px;
	padding-right: 12px;


	margin: 2px;
	float: left;
	font-size: 1.1em;
	font-family: arial, sans-serif;
	color: #505050;
	text-align:left;
	vertical-align:middle;
	border-style: solid;
	border-radius: 6px;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}


#upperright{
	background-color: #f2f2f2; 
	width: 100%;
	height: auto;
	float: left;
	padding: 20px;
	margin-left: 0%;
	margin-top: 20px;
	font-size:0.7em;
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 2px 2px 2px 2px; /*top-right-bottom-left */
	box-sizing: border-box;
	}

iframe{
	overflow-x:hidden

	}

#leftholder{
	background-color: default; 
	width: 33.3%;
	height: 94%;
	float: left;
	float: left;
	box-sizing: border-box;
	}

#middleholder{
	background-color: default; 
	width: 33.3%;
	height: 94%;
	float: left;
	float: left;
	box-sizing: border-box;
	}


#rightholder{
	background-color: default; 
	width: 33.4%;
	height: 94%;
	float: left;
	float: left;
	box-sizing: border-box;
	}

#instructionslookup{
	width: 100%;
	height: 6%;
	margin-left: 0%;
	margin-right: 0%;
	margin-top: 0%;
	margin-bottom: 0%;
	padding: 2px;
	background-color: default;
	font-size:0.55vw;
	font-family: 'Arial' 'sans-serif';
	line-height: 1.0;
	color: #484848;
	float: left;
	text-align:left;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box; 
	}


#headingholder{
	background-color: #52527a; 
	width: 96%;
	height: 11%;
	float: left;
	padding: 5px;
	margin-left: 2%;
	margin-top: 2%;
	font-size:0.9em;
	/*font-family: 'Arial' 'sans-serif';*/
	font-family: Montserrat, Helvetica, sans-serif;
	line-height: 0.9em;
	color: #e6e6e6;
	font-weight: bold;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-radius: 0px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;
	}


#scrollable{
	background-color: white; 
	width: 96%;
	height: 85%;
	float: left;
	padding: 15px;
	margin-left: 2%;
	margin-top: 0%;
	margin-bottom: 2%;
		font-size: 0.9em;
		/*font-family: 'Arial' 'sans-serif';*/
		font-family: Montserrat, Helvetica, sans-serif;
		line-height: 1.0em;
		color: #585858;
	border-style: solid;
	border-radius: 0px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;
	overflow: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	white-space: nowrap;
	}

#categoryfield{
	background-color: white; 
	border-width:0;
	}

#scrollablebrands{
	background-color: white;
	width: 96%;
	height: 86%;
	float: left;
	padding: 15px;
	margin-left: 2%;
	margin-top: 0%;
	margin-bottom: 2%;
		font-size: 0.9em;
		/*font-family: 'Arial' 'sans-serif';*/
		font-family: Montserrat, Helvetica, sans-serif;
		line-height: 1.0em;
		color: #585858;
	border-style: solid;
	border-radius: 0px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;
	overflow: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	white-space: nowrap;
	}

#brandfield{
	background-color: white; 
	border-width: 0;
	}

#queryfield{
	background-color: #f8f8f8; 
	border-width: 0;
	color: #505050;
	font-size: 1.8vw;
	}

#scrollablemodels{
	background-color: white; 
	width: 96%;
	height: 86%;
	float: left;
	padding: 15px;
	margin-left: 2%;
	margin-top: 0%;
	margin-bottom: 2%;
		font-size: 0.9em;
		/*font-family: 'Arial' 'sans-serif';*/
		font-family: Montserrat, Helvetica, sans-serif;
		line-height: 1.0em;
		color: #black;
	border-style: solid;
	border-radius: 0px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;
	overflow: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	white-space: nowrap;
	}

#modelfield{
	background-color: white;
	border-width:0; 
	}


#resultscreen{
	background-color: #f2f2f2; 
	width: 99%;
	height: 90%;
	float: left;
	padding: 0px;
	margin-left: 0.5%;
	margin-right:0.5%;
	margin-top: 1%;
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 2px 2px 2px 2px; /*top-right-bottom-left */
	box-sizing: border-box;
	}

#resultstable{
	font-size:1.0em;
	/*font-family: 'Arial' 'sans-serif';*/
	font-family: Montserrat, Helvetica, sans-serif;
	line-height: 1.0;
	color: red;
	}

#arrowholder{
	background-color: default; 
	width: 20%;
	height: auto;
	float: left;
	padding: 3px;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-radius: 0px;
	border-color: black;
	border-width: 0px 0px 0px 0px; /*top-right-bottom-left */
	box-sizing: border-box;
	}

#howtosearch{
	background-color: #f2f2f2; 
	width: 100%;
	height: auto;
	float: left;
	padding: 30px;
	margin-left: 0%;
	margin-top: 1%;
	margin-bottom: 1%;
		font-size: 0.9rem;
		/*font-family: Montserrat, Helvetica, sans-serif;*/
		font-family: Montserrat, 'Times New Roman', serif;
		line-height: 1.2em;
		text-align:left;
		color: #696969;
	border-style: solid;
	border-radius: 6px;
	border-color: black;
	border-width: 2px 2px 2px 2px; /*top-right-bottom-left */
	box-sizing: border-box;
	}

#th{
	text-align: center;
	}

#td{
	text-align: center;
	}

/* ************************** FOOTER FORMATING & FORMS ************************************ */

.holdfooter{
	width: 100%;
	height: 70px;
		/* position: fixed; */
		bottom: 0;
		left: 0;
	background-color: #676798;
	margin-top: 10px;
	float: left;
	box-sizing: border-box;
	}

#holdbutton{
	width: 92%;
	height: auto%;
	margin-left: 4%;
	margin-right: 4%;
	background-color: default;
	padding: 5px;
	margin-top: 36px;
	margin-bottom: 0px;
	float: left;
	font-size: 1.5em;
	font-family: 'Montserrat', 'Helvetica', sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box;
	}



#footer1{
	width: 100%;
	height: 50%;
	background-color: #133863;
	padding: 5px;
	margin-top: 0px;
	float: left;
	font-size: 20px;
	font-family: 'Montserrat', 'Helvetica', sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box;
	}


#footer2{
	width: 100%;
	height: 50%;
	background-color: #133863;
	padding: 5px;
	margin-top: 0px;
	float: left;
	font-size: 20px;
	font-family: 'Montserrat', 'Helvetica', sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box;
	}

/*
#contactform{
	width: auto;
	height: auto;
	max-width: 50%;
	background-color: default;
	padding: 8px;
	margin-top: 10px;
	margin-left: 5%;
	float: left;
	font-size: 1em;
	font-family: Montserrat, Helvetica, arial, sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-color: white;
	border-radius: 4px;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}
*/

/*

.formtable{
	background-color: default;
	
	}
*/


/*
table.formtable td{
		background-color: default;
		}
*/



#messageform{
	width: auto;
	height: auto;
	max-width: 100%;
	/*background-color: #a4a4c1;*/
	background-color: #00cccc;
	padding: 4px;
	margin-top: 2px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 2px;
	float: left;
	font-size: 1em;
	font-family: arial, sans-serif;
	color: white;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border-style: solid;
	border-radius: 6px;
	border-color: white;
	border-width: 0px 0px 0px 0px; /* 0px top, 4px right, 0px bottom and 0px left */
	box-sizing: border-box;
	}




/* - - - - - - - - - - - Collapsible Page Sections Formating - - - - - - - - */

.collapsible{
	/*background-color: #777;*/
		background-color: #133863;
	color: #f5f5f5;
	cursor: pointer;
	padding: 18px;
	text-align: left;
	margin-left: 4%;
	margin-right: 4%;
	width: 92%;

	outline: none;
	font-size: 18px;
		border-style: solid;
		border-color: #b3b3cc;
		border-width: 0px 0px 1px 0px; /* top, right, bottom, left */
	box-sizing: border-box; 
	}

.active, .collapsible:hover {
	background-color: #555;
	}

/* for showing plus sign */
.collapsible:after{
	content: '\002b';
	color: white;
	font-weight: bold;
	float: right;
	margin-left: 5px;
		border-style: solid;
		border-color: #676798;
		border-width: 0px 0px 1px 0px; /* top, right, bottom, left */
	}





/* for showing minus sign */
.active:after {
	content: "\2212";
	border-width: 0px 0px 0px 0px; /* top, right, bottom, left */
	}


.content{
	margin-left: 4%;
	margin-right: 4%;
	width: 92%;
	height: auto;
	padding: 0 18px;
	display: none;
	overflow: hidden;
	/*background-color: #f1f1f1;*/
	/*background-color: #3372ff;*/
	background-color: default;
	box-sizing: border-box;
	}




#infoicon{
	height: 30px;
	width: 30px;
	margin-top: -10px;
	margin-bottom: -15px;
	margin-right:25px
	float: left;
	}

/*
#buttonform{
	background-color: default;
	padding: 2px;
	margin: 2px;
	margin-top: 10px;

	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	}
*/

.buttonform{
	background-color: default;
	padding: 4px;
	margin: 2px;
	margin-top: 0px;
	text-align:center;
	vertical-align:middle;
	}



/*  *********** TABLE FORMATTING ********************* */

table{
	border: 0px hidden ;
	}

#icon{
	height: auto;
	width: auto;
	padding-left: 0px;
	padding-right: 0px;
	background-color: default;
	border-style: hidden;
	}


#centered{
	text-align: center;
	background-color: default;
	border-spacing: 6px;
	border: none;
	}

#tdleft{
	text-align: left;
	background-color: default;
	border: none;
	padding: 2px;
	padding-left: 2px;
	}


td{
	width: auto;
	height: 1em;
	margin-left: auto;
	margin-right: auto;
	padding: 2px;
	text-align: left;
	font-size: 1.2em;
	font-family: Montserrat, Helvetica, sans-serif;
	/*line-height: 1.0em;*/
	/*color: #505050;*/
	color: white;
	/*background-color:#c0c0c0;*/
	}


tr{
	padding: 0px;
	line-height: 1em;
	}

#tabletitle{
	margin-top: 30px;
	margin-bottom:10px;
	background-color: default;
	font-size: 2.4vw;
	font-family: Arial, sans-serif;
		color: #f8f8f8;	/*off white*/
	margin-bottom: 20px;
	padding: 4px;

		}

#choicetable{
	font-size: 1.0em;
	font-family: Montserrat, Helvetica, sans-serif;
	width: 100%;
	color: white
	}

#tablesearch{
		width: 96%;
		margin-left: 2%;
		margin-right: 2%;
		}

#holdsearch{
	width: 100%;
	height: auto;
	margin-top: 50px;
	margin-bottom: 10px;
	margin-left: 0%;
	margin-right: 0%;
	padding-top: 20px;
	padding-bottom: 30px;
	border-style: solid;
	border-color: white;
	border-width: 2px 0px 0px 0px; /* top, right, bottom, left */


	}

iframeformat{
		overflow-y: auto;
		white-space: no wrap;
		ovreflow-x: hidden;
		}


/*   ********************** BUTTONS FORMATTING *************************** */

#buttonajuda{
	height:auto;
	width: auto;
	margin: 0%;
	padding-left: 0px;
	padding-right: 0%;
	padding-top: 0%;
	padding-bottom: 0%;
	background-color: #0066cc;
		font-family: "arial", sans-serif;
		/*font-weight: bold;*/
		color: white;
		font-size: 4.0vw;
		text-align:center;
		vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	border:0px solid white;
	border-radius:6px;
	box-sizing: border-box; 
	display: block;
	}
/*
#buttonajuda:hover{
	background-color: #86b300;
	}
*/

#buttonajuda:active{
	border: 0px solid red;
	background-color:black;
	color: white;
	}


#buttondelete{
	height:30px;
	width: 80px;
	background-color: #505050;
	font-size:0.9em;
	font-family: 'Arial' 'sans-serif';
	text-decoration: none;
	color: white;
	border: 0px solid #ff471a;
	border-radius: 2px;
	padding: 1px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	margin: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

#buttondelete:hover{
	background-color: #18da8d;
	color: black;
	}

#buttondelete:active{
	border: 1px solid red;
	background-color:grey;
	color: white;
	}


input[type=text], select{
	width: 100%;
	padding: 12px 20px;
	margin: 8px 0;
		font-size: 20px;
		font-family: arial, sans-serif;
		color: grey;
	background-color: white;
	display: inline-block;
	border-radius: 4px;
	box-sizing: border-box;
	}


input[type=email], select{
	width: 100%;
	padding: 12px 20px;
	margin: 8px 0;
		font-size: 20px;
		font-family: arial, sans-serif;
		color: grey;
	background-color: white;
	display: inline-block;
	border-radius: 4px;
	box-sizing: border-box;
	}


/* added 2024-05-19 */
input[type=password], select{
	width: 100%;
	padding: 12px 20px;
	margin: 8px 0;
		font-size: 20px;
		font-family: arial, sans-serif;
		color: grey;
	background-color: white;
	display: inline-block;
	border: 2px solid grey;
	border-radius: 4px;
	box-sizing: border-box;
	}



input[type="radio"]{
	width: 3em;
	height: 3em;
	margin-right: 10px;
	margin-top 20px;
	accent-color: #3366ff;
	border: 3px solid grey;
	margin-left: 10px;
	}


input[type=submit]{
	width: auto;
	display: block;
	background-color: #3366ff;
	font-size: 1.2em;
	font-family: arial, sans-serif;
	color: white;
	padding: 10px 20px;
	/* margin: 20px auto;*/
	margin: 20px auto;
	border: 2px solid white;
	border-radius: 4px;
	text-align: center;
	cursor: pointer;
	display: block;
	}


input[type=submit]:hover{
	
	background-color: #0040ff;
	
	color: white;
	margin: 20px auto;
	border: none;
	border-radius: 4px;
	border: 3px solid white;
	
	}







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

#join{
	height:88%;
	width: 70%;
	border-radius:3px;
	background-color: default;
	opacity: 1;
	font-size:1.3em;
	font-family: 'Arial' 'sans-serif';
	color: black;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 0px solid #00bfff;
	margin-top: 0%;
	}

#join:hover{
	background-color: #18da8d;
	color: black;
	}




#login{
	height: 70%;
	width: 90%;
	border-radius: 3px;
	background-color: #133863;
	font-size: 1.3em;
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 3px solid white;
	margin-top: 0%;
	box-sizing: border-box; 
	}

#login:hover{
	background-color:#18da8d;
	color: white;
	border: 3px solid white;
	}


#logout{
	height:88%;
	width: 80%;
	border-radius:3px;
	background-color: default;
	font-size:1.3em;
	font-family: 'Arial' 'sans-serif';
	color: black;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 2px solid white;
	margin-top: 0%;
	}

#logout:hover{
	background-color:#18da8d;
	color: black;
	}

#logout:active{
	border: 1px solid red;
	background-color:grey;
	color: white;
	}


#close{
	height:88%;
	width: 60%;
	border-radius:3px;
	background-color: default;
	opacity: 1;
	font-size:1.3em;
	font-family: 'Arial' 'sans-serif';
	color: black;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 0px solid #00bfff;
	margin-top: 0%;
	}

#close:hover{
	background-color: #18da8d;
	color: black;
	}


/* added 2022-12-31 */
#account{
	height: 88%;
	width: 80%;
	border-radius:3px;
	background-color: default;
	font-size:1.3em;
	font-family: 'Arial' 'sans-serif';
	color: #black;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 0px solid white;
	margin-top: 0%;
	box-sizing: border-box; 
	}



#userpage{
	height:70%;
	width: 85%;
	border-radius:3px;
	background-color: #133863;
	font-size:1.6vw;
	font-family: Arial, sans-serif;
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 3px solid #ff8533;
	border-radius: 4px;
	margin-top: 0%;
	box-sizing: border-box; 
	}

#userpage:hover{
	background-color:#18da8d;
	color: white;
	border: 3px solid white;
	}


#button_popup{
	height:15%;
	width: 50%;
	border-radius:4px;
	background-color: #777;
	font-size:1em;
	font-family: 'Arial' 'sans-serif';
	color: white;
	border: 2px solid white;	
	}



#button_popup:hover{
	background-color:#18da8d;
	color: black;
	}

#button_popup:active{
	border: 1px solid red;
	background-color:grey;
	color: white;
	}



#buttonfind{
	/*height:35px;*/
	/*width: 170px;*/
	height: auto;
	width: auto;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 30px;
	padding-right: 30px;
	margin: auto;
	background-color: #668cff;
	font-size: 1.9vw;
	font-family: Arial, sans-serif;
	text-decoration: none;
	color: white;
	border: 1.3px solid white;
	border-radius: 4px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

#buttonfind:hover{
	background-color: #cbe432;
	color: black;
	}

#buttonfind:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}


#buttonclearall{
	height:auto;
	width: auto;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 10px;
	padding-right: 10px;
	margin: 2px;
	background-color: #9494b8;
	font-size:0.7vw;
	font-family: 'Arial' 'sans-serif';
	text-decoration: none;
	color: white;
	border: 1.3px solid grey;
	border-radius: 2px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

#buttonclearall:hover{
	background-color: #18da8d;
	color: black;
	}

#buttonclearall:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#buttonmore1{
	height:auto;
	width:100px;
	padding: 10px;
	margin: 2px;
	background-color: white;
	font-size: 1vw;
	font-family: Arial sans-serif;
	text-decoration: none;
	color: black;
	border: 1.3px solid white;
	border-radius: 2px;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

#buttonmore1:hover{
	background-color: #18da8d;
	color: black;
	}

#buttonmore1:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}



#buttonmore2{
	height:auto;
	width:100px;
	padding: 10px;
	margin: 2px;
	background-color: white;
	font-size: 1vw;
	font-family: Arial sans-serif;
	text-decoration: none;
	color: black;
	border: 1.3px solid white;
	border-radius: 2px;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

#buttonmore2:hover{
	background-color: #18da8d;
	color: black;
	}

#buttonmore2:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#buttondropdown{
	height:28px;
	width: auto;
		background-color: white; 
	/*background-color: white;*/
	font-size:0.9em;
	/*font-family: 'Arial' 'sans-serif';*/
	text-decoration: none;
	color: default;
	border: 0px solid black;
	border-radius: 0px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	text-align:left;
	cursor: pointer;
	-webkit-appearance: none:
	}

#buttondropdown:hover{
	background-color: #18da8d;
	color: black;
	}

#buttondropdown:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}



#buttondropdown2{
	height:28px;
	width: auto;
	background-color: white; 
	font-size:0.9em;
	/*font-family: 'Arial' 'sans-serif';*/
	text-decoration: none;
	color: default;
	border: 0px solid black;
	border-radius: 0px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	text-align:left;
	cursor: pointer;
	-webkit-appearance: none:
	}

#buttondropdown2:hover{
	background-color: #18da8d;
	color: black;
	}

#buttondropdown2:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}



#buttondropdown3{
	height:28px;
	width: auto;
	background-color: white;
	font-size:0.9em;
	/*font-family: 'Arial' 'sans-serif';*/
	text-decoration: none;
	color: default;
	border: 0px solid black;
	border-radius: 0px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	text-align:left;
	cursor: pointer;
	-webkit-appearance: none:
	}


#buttondropdown3:hover{
	background-color: #18da8d;
	color: black;
	}

#buttondropdown3:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}


#bigbutton{
	height:auto;
	width: 90%;
	/*background-color: #0066cc;*/

		background-color: #476b6b;
		
	font-size:4vw;
	/*font-family: Montserrat, Helvetica, sans-serif;*/
		font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 4px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	/* padding: 10px 10px; */
        /*margin: 10px 10px;*/
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 2px solid white;
	}

#bigbutton:hover{
	background-color: #004d99;
	color: white;
	border: 2px solid white;
	}

#bigbutton:active{
	border: 2px solid black;
	background-color:grey;
	color: white;
	}





#bigbutton1{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:3.6vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton1:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton1:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}





#bigbutton2{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:3.6vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton2:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton2:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}



#bigbutton2b{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:3.6vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton2b:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton2b:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#bigbutton3{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:4vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 2px solid white;
	}

#bigbutton3:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton3:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#bigbutton4{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:4vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton4:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton4:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#bigbutton5{
	height:auto;
	width: 90%;
	background-color: #133863;
	font-size:4vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton5:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton5:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




#bigbutton6{
	height:auto;
	width: 90%;
	/*background-color: #01345b;*/
		background-color: #133863;
	font-size:4vw;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: white;
	border: 0px solid grey;
	border-radius: 8px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	border: 3px solid white;
	}

#bigbutton6:hover{
	background-color: #cbe432;
	color: #133863;
	border: 3px solid white;
	}

#bigbutton6:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}



#buttonchat{
	height: auto;
	width: 50%;
	
	padding: 10px;
	padding-left: 15px;
	padding-right: 15px;
	border-radius: 6px;
	background-color: #00cccc;
	font-size: 1.3em;
	font-family: 'Arial' 'sans-serif';
	color: white;
		display: flex;
		justify-content: center;
		align-items: center;
	border: 1px solid white;
	margin 2px;
	box-sizing: border-box; 
	transition: height 0.8s;
	transition: background-color: 0.4s;
	cursor: pointer;
	}

#buttonchat:hover{
	background-color:#90f9e6;
	}






// for buttons in municipio dropdwn menu, did not work
.btnm{
	height:auto;
	width: 90%;
	background-color: #006666;
	font-size: 2vw;
	font-family: Montserrat, Helvetica, sans-serif;
	color: white;
	border-radius: 0px;
	padding: 5px;
	margin: 0px;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	cursor: pointer;
	}

.btnm:hover{
	background-color: #004d4d;
	color: white;
	}

.btnm:active{
	border: 1px solid black;
	background-color:grey;
	color: white;
	}




// for small tables holding buttons in municipio dropdown menu, did not work
.bm{
	background-color: yellow;
	padding: 0px;
	margin: 0px;
	text-align:center;
	vertical-align:middle;
	}



/* *********************************** END BUTTONS ************************************* */



/* Font Size Formating */

h0{
	font-size: 3.3em;
	line-height: 1.2;
	margin-top:0.2em;
	margin-bottom: 0em;
	margin-left: 0.2em;
	margin-right: 0.2em;

	/*text-align:center;*/
	}

h1{
font-size: 2.2em;
line-height: 1.8;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

/*text-align:center;*/
}

h2{
font-size: 1.5em;
line-height: 1.2;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

/*text-align:left;*/
}


h3{
font-size:1.17em;
line-height: 1.6;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

text-align:left;
}

h4{
font-size:1.0em;
line-height: 1.2em;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

text-align:left;
}

h5{
font-size:0.83em;
line-height: 1.2;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

text-align:left;
}

h6{
font-size:0.67em;
line-height: 1.2;
margin-top:0.2em;
margin-bottom: 0em;
margin-left: 0.2em;
margin-right: 0.2em;

text-align:left;
}


p{
	font-size: 1.2em;
	line-height: 1.2em;

	margin-top:0.2em;
	margin-bottom: 0em;
	margin-left: 0.2em;
	margin-right: 0.2em;
	text-align:left;
	}



/* Styling for Login Popup */
     
      .loginPopup {
        	position: relative;
        	text-align: center;
		background-color: grey;
        	width: 100%;
		border-radius: 12px;

      		}


      .formPopup {
        	display: none;
        	position: fixed;
        	left: 50%;
        	top: 50%;
       		/* transform: translate(-50%, 5%); */

		transform: translate(-250px, -300px);
		background-color: white;
        	border: 3px solid #999999;
	
        	z-index: 9;
      		}


      .formContainer {
        	max-width: 800px;
        	padding: 10px;
        	background-color: #fff;
      		}


      .formContainer input[type=text],
      .formContainer input[type=password] {
       	 	width: 100%;
        	padding: 15px;
        	margin: 5px 0 15px 0;
        	border: none;
        	background: #eee;
      		}


      .formContainer input[type=text]:focus,
      .formContainer input[type=password]:focus {
        	background-color: #ddd;
        	outline: none;
		margin: 
      		}


	/* sign-up button styling */

      .formContainer .btn {
        	padding: 12px 20px;
       		border: none;
        	/* background-color: #8ebf42; */
		background-color: #00e600;
        	color: #fff;
        	cursor: pointer;
        	width: 100%;
        	margin-bottom: 10px;
		margin-top: 10px;
        	opacity: 0.8;

		font-size: 1.2em;
		/*font-family: Montserrat, Helvetica, sans-serif;*/
		font-family: Arial, Helvetica, sans-serif;
		text-decoration: none;
		color: white;
      		}


      .formContainer .cancel {
        	/*background-color: #cc0000;*/
		background-color: grey;
      		}


      .formContainer .btn:hover,
      .openButton:hover {
        	opacity: 1;
      		}


/* Styling for Signup Popup */
     
      .signupPopup {
        position: relative;
        text-align: center;
	background-color: pink;
        width: 100%;
      }