body{
	font: 1.1em normal Helvitica;
	margin:0px;
	padding:0px;
}

#data{
	margin:auto;
	display:block;
}

.content{
	max-width:90%;
	margin:auto;
	display:block;
	min-height:700px;
}

p{
	text-align:justify;
	line-height: 1.20em;
}

p.center{
text-align:center;
}

p.contact{
padding:0px;
margin-top:25px;
text-align:center;
font-size:120%;
font-weight:bold;
}

table, tr, th, td
{
	border-collapse: collapse;
}

a.top_menu{
	margin:0;
	text-decoration: none;
}

textarea {
	//border-color:#1a53ff;
	border-width:2px;
    border-radius: 10px;
    width: 95%;
	resize:none;
    min-height: 45px;
    box-sizing: border-box;
}

textarea::placeholder {
    color: var(--medium-dark);
    font-size: 92%;
    opacity: 0.8;
}

textarea:focus { 
    outline: none !important;
    border-color: #719ECE;
    box-shadow: 0 0 10px #719ECE;
 }

.speech-bubble-ai {
	margin:auto;
	display:block;
    min-height: 340px;
    border-radius: 10px;
    position: relative;
    border: 2px solid black;
    background-color: white;
	vertical-align:top;
    align-items: center;
}

.speech-bubble-ai>p {
    padding: 0 1.3em;
    color: black;
    font-size: 85%;
}

/*Button setup */
button {
    border: none;
	float:right;
    background: red;
    cursor: pointer;
	min-height:45px;
}

button:hover {
    background-color: black;
}

.send-btn {
    border-radius: 10px;
}

.send-btn>img {
    width: 40px;
	vertical-align: middle;
}

.setup-input-container {
	padding: .5em;
    min-height: 50px;
	margin:auto;
	display: block;
}

h1{
margin:0px;
padding-top:10px;
text-align:center;
color:#006600;
}

h2
{
	text-shadow: 1px 1px 1px #000000;
	filter: dropshadow(color=#000000, offx=1, offy=1);
	padding:0px;
	margin:0px;
}

h2.center {
	text-align:center;
}

.input{
	font-weight: bold;
	font-size:105%;
}

.report{
	font-weight: bold;
	font-size:105%;
}

.inbox{
	border:2px soild black;
	width:250px;
	height:22px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0px 0px 2px #000000;
	-webkit-box-shadow: 0px 0px 2px #000000;
	box-shadow: 0px 0px 2px #000000;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000')";
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	opacity: 0.61;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 21);
	filter: alpha(opacity = 61);
	color:black;
	font-weight:bold;
}

#footer{
	text-align:center;
	margin:5px auto 0px auto;
	background-color: black;
	color:white;
	display: block;
	padding:5px;
	font-size:.9em;
}

.required{
color:red;
font-weight:bold;
}

.upload{
font: 2em Helvitica;
font-weight: bold;
color: #0000BB;
text-align: center;
}

.messagebox{
 position:absolute;
 width:100px;
 margin-left:30px;
 border:1px solid #c93;
 background:#ffc;
 padding:3px;
}

.messageboxok{
 position:absolute;
 width:auto;
 margin-left:30px;
 border:1px solid #349534;
 background:#C9FFCA;
 padding:3px;
 font-weight:bold;
 color:#008000;
}

.messageboxerror{
 position:absolute;
 width:auto;
 margin-left:30px;
 border:1px solid #CC0000;
 background:#F7CBCA;
 padding:3px;
 font-weight:bold;
 color:#CC0000;
}

.img_link
{
border:none;
}

.critical_info
{
font-weight:bold;
font-size:130%;
text-align:center;
line-height:130%;
margin:3% 5%px 3% 5%;
padding:3% 5% 3% 5%;
background:#FFFFCC;
border:1px solid yellow;
}

.form_msg
{
border:1px dashed red;
padding:5px;
text-align:center;
font-weight:bold;
background:#CCCC00;
}

.topnav{
	background-color: #034efc;
	max-height: none;
	overflow: hidden;
    position: relative;
}

.topnav a{
	float: left;
    display: block;
    color: white;
	text-align: center;
	padding:5px 20px;
	background-color: #034efc;
	text-decoration: none;
}

.topnav a.active {
  background-color: #04AA6D;
  color: white;
}

.topnav a:hover{
	color:black;
	background-color: #ddd;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative; background-color: black;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
    border-bottom:1px solid grey;
	}
}