@font-face {
    font-family: 'Roboto',Arial, sans-serif;
    src: url('fonts/Roboto-Bold.woff2') format('woff2'),
        url('fonts/Roboto-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto',Arial, sans-serif;
    src: url('fonts/Roboto-Regular.woff2') format('woff2'),
        url('fonts/Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto',Arial, sans-serif;
    src: url('fonts/Roboto-Italic.woff2') format('woff2'),
        url('fonts/Roboto-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto',Arial, sans-serif;
    src: url('fonts/Roboto-Thin.ttf') format('ttf');
    font-weight: thin;
    font-style: normal;
}


body{
	font-size:.87em;
	 margin: 0;
	font-family: 'Roboto', Arial, sans-serif;
	background-color: rgb(212,218,230);
	font-size: 100%;
}
.container{


	width:1200px;
	/*
	display: flex;
  	flex-direction:vertical; 
  	flex-wrap: wrap;*/

	text-align:center;
	height:100%;
	margin: 0 auto;
}

.top_container{
	margin: 0 auto;
	float:left;
	position:relative;
	height:500px;
	width:1200px;
	text-align:center;
	color:white;
	background-color:#232323;
	font-weight: thin;
}
.bottom_container{
	color:white;
	margin: 0 auto;
	float:left;
	position:relative;
	width:1200px;
	text-align:center;
	background-color:#434343;
	padding-bottom:50px;
}
.top_left{
	width:519px;
	float:left;
}
.top_right{
	padding-top:15px;
	font-weight:lighter;
	width:681px;
	float:right;
}

.logo{
	width:280px;/*600X220*/
}
.webpage_image{
	width:681px;/*1310 / 905*/
	height:470px;/*412*/
}
.med_title{
	font-size:1.3em;
	font-weight: thin;
}
.large_title{
	font-size:2.4em;
}
.button{
	font-weight: bold;
	border: none;
	background-color:rgb(89,170,240);
	color:black;
	padding: 7px 14px;
	border-radius: 3px;
	font-size:14px;
	/*font-weight: bold;*/
	background-size: 18px;
	background-repeat: no-repeat;
	background-position:4px center;
}
.button:hover{
	background-color:rgb(32,117,213);
	cursor: pointer;
}
.input_field{
	height:26px;
	font-size:14px;
}
.blurb_box{
	padding-top:40px;
	width:400px;
	text-align:left;
	padding-bottom:100px;
}
.blurb_image{
	width:45px;/*1310 / 905*/
	height:45px;
}
.blurb_image_box{
	padding-top:7px;
	float:left;
	width:60px;
	padding-left:30px;
	height:100%;
}
.blurb_content_box{
	padding-left:10px;
	float:left;
	width:300px;
	font-weight: thin;
	font-size:.9em;
}
.blurb_title{
	font-size:1.2em;
}
.bottom_left{
	width:400px;
	float:left;
}
.bottom_center{
	width:400px;
	float:left;
}
.bottom_right{
	width:400px;
	right:-10px;
	position:absolute;
	top:-100px;
}
.bottom_logo{
	width:60px;
	position:absolute;
	right:45px;
	bottom:20px;
	
}
.hud_image{
	width:380px;/*1310 / 905*/
}
.cat_icon_image{
	width:80px;/*1310 / 905*/
}
.footer{
	width:1200px;/*1310 / 905*/
	background-color:#333333;
	height:100px;
	color:white;
}