@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url('/lib/font/open_sans_bold_400.woff') format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('/lib/font/open_sans_bold_700.woff') format('woff');
}

html {
  font-size: 16px;
}
body {
	margin: 0;
	padding: 0;
	color: #555;
	font-family: 'Open Sans', sans-serif;
}


.firenullfire {
	background: #fff;
	min-height: 300px;
}
.firenullfire * {
	margin: 1rem;
}
.firenullfire h1 {
	font-size: 3rem;
}


pre {
	font-size: 1rem;
	background-color: #eee;
}


input {
	font-size: 1.1rem;
	color: #555;
	background-color: #fff;
	border: solid 1px #000;
	-webkit-appearance: none;
	border-radius: 0;
}
input:focus, textarea:focus {
	box-shadow: 0 0 0.5rem #bbb;
}
select {
	border-radius: 0;
}

.noselect,
label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


.alignleft {
	display: inline;
	float: left;
}
.alignright {
	display: inline;
	float: right;
}

.critical {
	color: #ff5852;
}

/* background colors */
.bg01 { background-color: #fff;		} /* white			*/
.bg02 { background-color: #E7EBEE;	} /* light-blue		*/
.bg02 { background-color: #d8d7d7;	} /* grey			*/
.bg04 { background-color: #ff5852;	} /* red			*/
.bg05 {	background-color: #1ba866;	} /* green			*/
.bg06 {	background-color: #0070b2;	} /* blue			*/
.bg07 { background-color: #4a4a49;	} /* dark			*/

/* font colors */
.fc01 {	color: #fff;	} /* white	*/
.fc02 {	color: #4a4a49;	} /* black	*/
.fc04 {	color: #ff5852;	} /* red	*/
.fc05 {	color: #1ba866;	} /* green	*/
.fc06 {	color: #0070b2;	} /* blue	*/






/*
	Resonsive Grid
*/
.small-1 {
        position: relative;
        width: 8.33333%;
}
.small-2 {
        position: relative;
        width: 16.66667%;
}
.small-3 {
        position: relative;
        width: 25%;
}
.small-4 {
        position: relative;
        width: 33.33333%;
}
.small-5 {
        position: relative;
        width: 41.66667%;
}
.small-6 {
        position: relative;
        width: 50%;
}
.small-7 {
        position: relative;
        width: 58.33333%;
}
.small-8 {
        position: relative;
        width: 66.66667%;
}
.small-9 {
        position: relative;
        width: 75%;
}
.small-10 {
        position: relative;
        width: 83.33333%;
}
.small-11 {
        position: relative;
        width: 91.66667%;
}
.small-12 {
        position: relative;
        width: 100%;
}

/* Medium */
@media only screen and (min-width: 40.063em) {
        .medium-1 {
                position: relative;
                width: 8.33333%;
        }
        .medium-2 {
                position: relative;
                width: 16.66667%;
        }
        .medium-3 {
                position: relative;
                width: 25%;
        }
        .medium-4 {
                position: relative;
                width: 33.33333%;
        }
        .medium-5 {
                position: relative;
                width: 41.66667%;
        }
        .medium-6 {
                position: relative;
                width: 50%;
        }
        .medium-7 {
                position: relative;
                width: 58.33333%;
        }
        .medium-8 {
                position: relative;
                width: 66.66667%;
        }
        .medium-9 {
                position: relative;
                width: 75%;
        }
        .medium-10 {
                position: relative;
                width: 83.33333%;
        }
        .medium-11 {
                position: relative;
                width: 91.66667%;
        }
        .medium-12 {
                position: relative;
                width: 100%;
        }
}

/* Large */
@media only screen and (min-width: 64.063em) {
	.large-1 {
                position: relative;
                width: 8.33333%;
        }
        .large-2 {
                position: relative;
                width: 16.66667%;
        }
        .large-3 {
                position: relative;
                width: 25%;
        }
        .large-4 {
                position: relative;
                width: 33.33333%;
        }
        .large-5 {
                position: relative;
                width: 41.66667%;
        }
        .large-6 {
                position: relative;
                width: 50%;
        }
        .large-7 {
                position: relative;
                width: 58.33333%;
        }
        .large-8 {
                position: relative;
                width: 66.66667%;
        }
        .large-9 {
                position: relative;
                width: 75%;
        }
        .large-10 {
                position: relative;
                width: 83.33333%;
        }
        .large-11 {
                position: relative;
                width: 91.66667%;
        }
        .large-12 {
                position: relative;
                width: 100%;
        }
} 
