﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/* ERROR PAGE STYLES ======================================================*/

.error-page {
  display: block;
  margin: 0 auto;
  max-width: 800px;
  min-width: 400px;
  width: 100%;
  padding-top: 40px;
}

.error-page h4 {
	font-weight: normal !important;
}

.error-container {
	display: -webkit-box;
	display: -webkit-flex;
  	display: -moz-box;
  	display: -ms-flexbox;
  	display: flex;

  	-ms-flex-align: center;
  	-webkit-align-items: center;
  	-webkit-box-align: center;
  	align-items: center;
 
    border: 1px solid #E4EAF1;
    padding: 2em 1em;
}

.error-logo {
	-webkit-box-flex: 1;
  	-moz-box-flex:  1;
  	-webkit-flex: 1;
  	-ms-flex:  1;
  	flex:  1;
    text-align: center;
}
.error-logo div {
	font-size: 3em;
    color: #1A3048;
}

.error-message { 
	-webkit-box-flex: 1;
  	-moz-box-flex:  1;
  	-webkit-flex: 1;
  	-ms-flex:  1;
  	flex:  1;
  	padding: 10px 20px;
 	border-left: 3px solid #1A3048;
}
 .error-message h3, h4 {
	color: #1A3048 !important;
	margin-bottom: 10px;
	margin-left: 30px;
}

.error-message h3 {
	margin-top: 10px;
}

.error-message h4.date {
	margin-top: 20px;
	font-weight: bold;
}

.error-options {
    text-align: center;
    margin-top: 60px;
}

.error-options h4 {
	margin:0;
}


.error-lists ul {
	margin: 0 0 0 80px;
	padding: 0;
	list-style: none;
	list-style-type: none;
	text-align: left;
}
.error-lists ul li {
	margin-bottom: 1em;
  	display: block;
}
.error-lists ul li a {
    color: $blue;
    outline: none;
}
.error-lists ul li i {
    font-size: 0.8em;
    margin-right: 5px;
}

@media only screen and (max-width: 768px  ) {
 	.error-page {
	    max-width: 100%;
	    min-width: 100%;
	    width: 100%;
	}
    .error-container {
    	-webkit-flex-direction: column;
  		-moz-flex-direction: column;
  		flex-direction: column;
      	border: 0;
      	padding: 0;
	}
    .error-logo {
        text-align: left;
    }
    .error-message {
    	border: 0;
  	}
    .error-lists ul {
    	margin: 0 0 0 10px;
    }

    .error-options {
    	margin-top: 20px;
    	padding: 0 20px;
    }

    .error-options h4 {
    	margin-left: 30px;
    	margin-bottom: 20px;
    	text-align: left;
    }
    .error-lists {
    	padding-left: 30px;
    }
    .error-lists ul {
    	margin-left: 0;
    }
}


/* ERROR PAGE FONT ======================================================*/

@font-face {
	font-family: 'method-font';
	src:url('../fonts/method/method-font.eot?-vwo24p');
	src:url('../fonts/method/method-font.woff?-vwo24p') format('woff'),
  		url('../fonts/method/method-font.svg?-vwo24p#method-font') format('svg'),
		url('../fonts/method/method-font.eot?#iefix-vwo24p') format('embedded-opentype'),
  		url('../fonts/method/method-font.ttf?-vwo24p') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'method-icon';
	src:url('../fonts/method/method-icon.eot?-tcsqpr');
	src:url('../fonts/method/method-icon.woff?-tcsqpr') format('woff'),
		url('../fonts/method/method-icon.svg?-tcsqpr#method-icon') format('svg'),
		url('../fonts/method/method-icon.eot?#iefix-tcsqpr') format('embedded-opentype'),
		url('../fonts/method/method-icon.ttf?-tcsqpr') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'method-icon-solid';
	src:url('../fonts/method/method-icon-solid.eot?1w6jil');
	src:url('../fonts/method/method-icon-solid.woff?1w6jil') format('woff'),
		url('../fonts/method/method-icon-solid.svg?1w6jil#method-icon-solid') format('svg'),
		url('../fonts/method/method-icon-solid.eot?#iefix1w6jil') format('embedded-opentype'),
		url('../fonts/method/method-icon-solid.ttf?1w6jil') format('truetype');
	font-weight: normal;
	font-style: normal;
}

.mi-icon-logo::before {
	font-family: 'method-font','method-icon','method-icon-solid','Source Sans Pro';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	text-rendering: auto;
	content: "\e505";
}

.mi-icon-arrow-circle-right::before { 
	font-family: 'method-font','method-icon','method-icon-solid','Source Sans Pro';
	speak: none;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	text-rendering: auto;
	content: "\e70f";
}


