@charset "UTF-8";
/* CSS Document */

* {
  box-sizing: border-box;
}

/* Container for flexboxes */
.row {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
	max-width: 1000px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
	min-width: 600px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
	background: #FFF;
	margin:0 auto;
}

/* Create three equal columns */
.column {
  flex: 33.3%;
  padding: 20px;
}


/* when you have 4 columns you can turn it to two on screens that are 992px wide or less, go from four columns to two columns---- 
@media screen and (max-width: 992px) {
  .column {
    flex: 50%;----
  }
  */

/* On screens that are 600px wide or less, make the columns stack on top of each other instead of next to each other */

@media screen and (max-width: 600px) {
  .row {
    flex-direction: column;
  }
}

BODY		{
	color: black;
	font-family: Verdana, Arial, Helvetica, san-serif;
	font-size: 15px;
	line-height: 17px;
	top: 0px;
	background-color: #fff;
		}

H1		{
	font-family: Verdana, Arial, Helvetica, san-serif;
	font-size: 22px;
	font-weight: bold;
	color: #FFF;
	letter-spacing: 1px;
		}
H2		{
	font-family: Verdana, Arial, Helvetica, san-serif;
	font-size: 18px;
	font-weight: bold;
		}
H3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-indent: 12px;
	vertical-align: middle;
	width: 100%;
}
H4 {
	font-size: 15px;
	font-weight: bold;
}

H5		{
	font-family: Verdana, Arial, Helvetica, san-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
		}
H6		{
		font: 11 px, bold, Verdana, Arial, Helvetica, san-serif;
		}
		
.dialogo {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	font-weight: bold;
	font-style: italic;
	color: #900;
}
		
.container {
	width: 100%;
	max-width: 1000px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
	min-width: 600px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
	background: #fff;
	margin:0 auto;
}
.masthead {
	padding: 0px;
	background-color: #000;
	max-width: 1000px;
	min-width: 600px;
	font-family: Verdana, Arial, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
	width: 100%;
}
.header {
	max-width: 1000px;
	min-width: 600px;
	background-color: #FFF;
	width: 100%;
}

.topnavbar {
	padding: 12px;
	background-color: #fbad17;
	max-width: 1000px;
	min-width: 600px; 
	font-family: Verdana, Arial, Arial, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #000;
	width: 100%;
}

A:hover {
	text-decoration: underline;
	color: #FF9900;
	/* gold
	background-color: #F90;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
}
A:link	{
	color: #900;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	text-decoration: underline;
}
A:visited	{
	color: #647d7e;
	/* db569d pink CC3300 brick red*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	text-decoration: underline;
}
img {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
}