/*
This font-face declaration will need to be modified to support platforms other
than Safari, Android and iOS
*/

/*
@font-face {
    font-family: 'Futura';
    src: url('../fonts/Futura.eot');
    src: url('../fonts/Futura.eot') format('embedded-opentype'),
         url('../fonts/Futura.woff') format('woff'),
         url('../fonts/Futura.ttf') format('truetype'),
         url('../fonts/Futura.svg#LatoRegular') format('svg');
}
*/

@font-face {
    font-family: 'LatoRegular';
    src: url('../fonts/lato.eot');
    src: url('../fonts/lato.eot') format('embedded-opentype'),
         url('../fonts/lato.woff') format('woff'),
         url('../fonts/lato.ttf') format('truetype'),
         url('../fonts/lato.svg#LatoRegular') format('svg');
}

html, body {
	-webkit-transition: background 5s ;
	-moz-transition: background 5s ;
	-ms-transition: background 5s ;
	-o-transition: background 5s ;
	transition: background 5s ;
	font-family: 'Futura', 'LatoRegular', 'Arial', sans-serif;
	text-align: center;
	height: 100%;
}

html {
	overflow-y: scroll;
}

footer {
	color: #a7abaa;
	line-height: 2em;
	height: 2em;
	margin-top: -2em;
}

.gradient footer {
	color: white;
}

.container {
	width: 500px;
	margin: auto;
	text-align: center;
	min-height: 95%;
	margin-bottom: 2em;
}

.button, .button:visited, .button:hover, .button:focus {
	display: inline-block;
	padding: .5em;
	margin-bottom: .5em;
	width: 150px;
	vertical-align: middle;
	border: 2px solid #a7abaa;
	color: #a7abaa;
	text-decoration: none;
	font-size: 14pt;
	/* font-weight: bold; */
	outline: 0;
}

.button:focus, .button:active {
	background: #a7abaa;
	color: white;
}

.primary, .primary:visited, .primary:hover, .primary:focus {
	height: 52px;
	line-height: 100%;
	font-size: 1.8em;
	color: white;
	border: none;
	
}

.primary:active, .primary:focus, .gradient {
	background: #f94812; /* Old browsers */
	background: -moz-linear-gradient(top,  #f94812 0%, #c92605 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f94812), color-stop(100%,#c92605)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f94812 0%,#c92605 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f94812 0%,#c92605 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f94812 0%,#c92605 100%); /* IE10+ */
	background: linear-gradient(bottom,  #f94812 0%,#c92605 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f94812', endColorstr='#c92605',GradientType=0 ); /* IE6-9 */
	background-repeat: no-repeat;
	color: white;
}

.gradient .primary {
	background: none;
}

.content {
	margin: 50px auto;
}

.content img {
	max-width: 100%;
}

.left {
	text-align: left;
}

/* for phones/tablets  */
@media screen and (max-width: 499px) {
	.container {
		width: 95%;
	}
}