/*
 * SimpleGrid v1.1
 * css3 Mobile first Approach
 *
 * Copyright 2015
 * Licensed under MIT
 *
 * Super simple (and flexible) grid that does what it is designed to do. 
 * Uses box sizing. 
 *
 * Supports IE8+ and all modern web browsers.
 * ie8+, chrome, firefox, safari, opera
 *
 * .container - set width of page
 * .row - creates row 
 * .row.static - extends row, maintains grid columns on small screens
 * .span- - set the number of columns to span
 * .shift- - set the number of columns to offset
 *
 * container, row - grid naming convention from twitter bootstrap
 * Thanks to OOCSS, Twitter Bootstrap, and many others for leading the way in grid layouts
 *
 * 10px Gutter.
 *
 * To change the gutter update:
 * .container padding, .row margin, .span- padding
 *
 * Coupled together by Jonathan Whiting
 * http://machiine.com
 */

	
		/* CH01 - Reset */
/* ---------------------------------- */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}

/* latin-ext */
@font-face {
  font-family: 'Playball';
  font-style: normal;
  font-weight: 400;
  src: local('Playball'), local('Playball-Regular'), url(https://fonts.gstatic.com/s/playball/v7/qxC1Yj_4IUZ_PO35Va79QxkAz4rYn47Zy2rvigWQf6w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playball';
  font-style: normal;
  font-weight: 400;
  src: local('Playball'), local('Playball-Regular'), url(https://fonts.gstatic.com/s/playball/v7/sSjR6AJRrIl2FxjhncYng3YhjbSpvc47ee6xR_80Hnw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}
/* latin-ext */
@font-face {
  font-family: 'Sail';
  font-style: normal;
  font-weight: 400;
  src: local('Sail'), local('Sail-Regular'), url(https://fonts.gstatic.com/s/sail/v8/ALquSoDN9FvcW_R1m_RfpxTbgVql8nDJpwnrE27mub0.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Sail';
  font-style: normal;
  font-weight: 400;
  src: local('Sail'), local('Sail-Regular'), url(https://fonts.gstatic.com/s/sail/v8/X1ttcNdAKtWSMHzOnNmpGfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* latin */
@font-face {
  font-family: 'Redressed';
  font-style: normal;
  font-weight: 400;
  src: local('Redressed Regular'), local('Redressed-Regular'), url(https://fonts.gstatic.com/s/redressed/v8/2HBwg79Pvh9RNLO_3g_yUpBw1xU1rKptJj_0jans920.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* vietnamese */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: local('Quicksand Regular'), local('Quicksand-Regular'), url(https://fonts.gstatic.com/s/quicksand/v7/NUrn2XQrRfyGZp5MknntaYX0hVgzZQUfRDuZrPvH3D8.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: local('Quicksand Regular'), local('Quicksand-Regular'), url(https://fonts.gstatic.com/s/quicksand/v7/s2PXW4WrV3VLrOUpHiqsfYX0hVgzZQUfRDuZrPvH3D8.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: local('Quicksand Regular'), local('Quicksand-Regular'), url(https://fonts.gstatic.com/s/quicksand/v7/sKd0EMYPAh5PYCRKSryvW5Bw1xU1rKptJj_0jans920.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

body {
	font-family: 'Quicksand', Arial, Helvetica, sans-serif;
	text-align: center;
	letter-spacing: 1px;
}

h1, h2, h3, h4, h5, h6, p {
	margin: 1em 0 1em 0;
}

strong {
	font-weight: bold;
}

.logo {
	Xbackground: #000;
	xcolor: #fff;
	padding: 5px;
	font-size: 20px;
	font-family: 'Playball';
	letter-spacing: 0px;
}
.aeir-font {
	font-family: 'Playball';
	letter-spacing: 0px;
}

.bar {
	
}

.intro {
	padding: 60px 0;
}

.highlight {
	color: #00CCFF;
}

.highlight-block {
	background-color: #444;
	color: #00CCFF;
	font-size: 40px;
	font-weight: bold;
}

/* simple */
.flip-container {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-ms-perspective: 1000;
	perspective: 1000;

	-ms-transform: perspective(1000px);
	-moz-transform: perspective(1000px);
			-moz-transform-style: preserve-3d; 
			-ms-transform-style: preserve-3d;
	
	margin: 0 auto;
}

/* START: Accommodating for IE */
.flip-container:hover .back, .flip-container.hover .back {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
}

.flip-container:hover .front, .flip-container.hover .front {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

/* END: Accommodating for IE */

.flip-container, .front, .back {
	height: 200px;
	width: 350px;
	overflow: hidden;
}

.flipper {
	-webkit-transition: 0.6s;
	-webkit-transform-style: preserve-3d;
	-ms-transition: 0.6s;

	-moz-transition: 0.6s;
	-moz-transform: perspective(1000px);
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;

	transition: 0.6s;
	transform-style: preserve-3d;

	position: relative;
}

.front, .back {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;

    -webkit-transition: 0.6s;
    -webkit-transform-style: preserve-3d;
    -webkit-transform: rotateY(0deg);

    -moz-transition: 0.6s;
    -moz-transform-style: preserve-3d;
    -moz-transform: rotateY(0deg);

    -o-transition: 0.6s;
    -o-transform-style: preserve-3d;
    -o-transform: rotateY(0deg);

    -ms-transition: 0.6s;
    -ms-transform-style: preserve-3d;
    -ms-transform: rotateY(0deg);

    transition: 0.6s;
    transform-style: preserve-3d;
    transform: rotateY(0deg);

	position: absolute;
	top: 0;
	left: 0;
}

.front {
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	background: lightgreen;
	z-index: 2;
}

.front, .framed {
	background: url('images/framed-aeir.png') 0 0 no-repeat;
	background-position: center top;
	background-size: 100% auto;
}

.back {
	background: url('images/framed-back-victorious.png') 0 0 no-repeat;
	background-position: center top;
	background-size: 100% auto;
	-webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}

/* 768px ~= 48em */
@media screen and (min-width: 48em) {


}
/* 1024px ~= 64em */
@media screen and (min-width: 64em) {
	
	
}
/* 1280px ~= 80em */
@media screen and (min-width: 80em) {


}