@charset "utf-8";
body {
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	background-image: url(Background%20Patterns/Dark/escheresque_ste.png);
}
.section {
	float: left;
	clear: both;
	margin-top: 1%;
	margin-right: 4%;
	margin-left: 4%;
	margin-bottom: 1%;
	width: 90%;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.50);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.50);
	border-radius: 20px;
	background-image: url(Background%20Patterns/green_cup.png);
	border: 9px double #FFFFFF;
}
.subSection {
	float: none;
	clear: both;
	margin: 0px 2%;
	background-color: #7D7D7D;
	border-bottom: 1px solid rgba(0,0,0,1.00);
}
.subSection:first-of-type {
	border: none;
}




.link {
	margin: 1%;
	width: 31%;
	float: left;
	/* [disabled]background-color: #FFFA85; */
	text-align: right;
	font-size: 1.25em;
}
.link a {
	text-decoration: none;
	color: #222;
}

.explanation {
	margin: 1%;
	width: 61%;
	float: right;
	border-radius: 5px;
	background-color: rgba(248,248,248,0.80);
}
#header {
	text-align: center;
	color: #F1F1F1;
}
#header h1 {
	margin: .5em 0px 0px 0px;
	font-family: kaushan-script;
	font-style: normal;
	font-weight: 400;
	font-size: 4em;

}
#header h2 {
	margin: .25em 0px;
	font-size: 2em;
	font-weight: bold;
	text-decoration: underline;

}
#header p {
	margin: .25em 15em;
}


.section h2 {
	margin-left: 1em;
}
.sectionExp {
	margin-top: 0px;
	margin-right: 2em;
	margin-left: 2em;
	margin-bottom: 0.5em;
}
.button {
	display: inline-block;
	margin: 0 auto;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 0px 3px rgba(128,128,128,1),
        0px 4px rgba(118,118,118,1),
        0px 5px rgba(108,108,108,1),
        0px 6px rgba(98,98,98,1),
        0px 7px rgba(88,88,88,1),
        0px 8px rgba(78,78,78,1),
        0px 14px 6px -1px rgba(128,128,128,1);
	box-shadow: 0px 3px rgba(128,128,128,1), /* gradient effects */
        0px 4px rgba(118,118,118,1),
        0px 5px rgba(108,108,108,1),
        0px 6px rgba(98,98,98,1),
        0px 7px rgba(88,88,88,1),
        0px 8px rgba(78,78,78,1),
        0px 14px 6px -1px rgba(128,128,128,1); /* shadow */
	-webkit-transition: -webkit-box-shadow .1s ease-in-out;
} 

.button span {
	background-color: #E8E8E8;
	background-image: 
        /* gloss gradient */
        -webkit-gradient(
            linear, 
            left bottom, 
            left top, 
            color-stop(50%,rgba(255,255,255,0)), 
            color-stop(50%,rgba(255,255,255,0.3)), 
            color-stop(100%,rgba(255,255,255,0.2))),
        
        /* dark outside gradient */
        -webkit-gradient(
            linear, 
            left top, 
            right top, 
            color-stop(0%,rgba(210,210,210,0.3)), 
            color-stop(20%,rgba(210,210,210,0)), 
            color-stop(80%,rgba(210,210,210,0)), 
            color-stop(100%,rgba(210,210,210,0.3))),
        
        /* light inner gradient */
        -webkit-gradient(
            linear, 
            left top, 
            right top, 
            color-stop(0%,rgba(255,255,255,0)), 
            color-stop(20%,rgba(255,255,255,0.5)), 
            color-stop(80%,rgba(255,255,255,0.5)), 
            color-stop(100%,rgba(255,255,255,0))),        
        
        /* diagonal line pattern */
        -webkit-gradient(
            linear, 
            0% 100%, 
            100% 0%, 
            color-stop(0%,rgba(255,255,255,0)), 
            color-stop(40%,rgba(255,255,255,0)), 
            color-stop(40%,#D2D2D1), 
            color-stop(60%,#D2D2D1), 
            color-stop(60%,rgba(255,255,255,0)), 
            color-stop(100%,rgba(255,255,255,0)));
	-webkit-box-shadow: 0px -1px #fff,
            0px 1px 1px #FFFFFF;
	box-shadow: 0px -1px #fff, /* top highlight */
            0px 1px 1px #FFFFFF; /* bottom edge */
			
	-webkit-background-size: 100%, 100%, 100%, 4px 4px;
	
	-webkit-border-radius: 10px;
	border-radius: 10px
	
    -webkit-transition: -webkit-transform .1s ease-in-out;
	
	display: inline-block;
	padding: 10px 40px 10px 40px;
	color: #3A474D;
	font-family: 'TradeGothicLTStd-BdCn20','PT Sans Narrow';
	font-weight: 600;
	text-shadow: 0px 1px #fff, 0px -1px #262F33;
}

.button span:hover {
	color: #AEBF3B;
	text-shadow: 0px -1px #97A63A;
	cursor: pointer;
}

.button:active {
	-webkit-box-shadow: 
		0px 3px rgba(128,128,128,1),
		0px 4px rgba(118,118,118,1),
		0px 5px rgba(108,108,108,1),
		0px 6px rgba(98,98,98,1),
		0px 7px rgba(88,88,88,1),
		0px 8px rgba(78,78,78,1),
		0px 10px 2px 0px rgba(128,128,128,.6);
	box-shadow: 
		0px 3px rgba(128,128,128,1),
		0px 4px rgba(118,118,118,1),
		0px 5px rgba(108,108,108,1),
		0px 6px rgba(98,98,98,1),
		0px 7px rgba(88,88,88,1),
		0px 8px rgba(78,78,78,1),
		0px 10px 2px 0px rgba(128,128,128,.6); /* shadow */
}

.button:active span{
	-webkit-transform: translate(0, 5px); 
	transform: translate(0, 5px); /* depth of button press */
}

/*.button span:after {
	content: ">";
	display: block;
	width: 10px;
	height: 10px;

	position: absolute;
	right: 14px;
	top: 12px;    
	
	font-family: 'Cabin';
	font-weight: 700;
	color: #AEBF3B;
	text-shadow: 0px 1px #fff, 0px -1px #97A63A;
	font-size: 26px;
}*/

/*#new {
	border-radius: 20px;
	background-image: url(Background%20Patterns/green_cup.png);
	border: 9px double #FFFFFF;
}

#school {
	background-image: -webkit-linear-gradient(270deg,rgba(186,255,193,0.70) 1.04%,rgba(228,255,231,0.70) 48.70%,rgba(77,255,108,0.70) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(186,255,193,0.70) 1.04%,rgba(228,255,231,0.70) 48.70%,rgba(77,255,108,0.70) 100%);
	background-image: -o-linear-gradient(270deg,rgba(186,255,193,0.70) 1.04%,rgba(228,255,231,0.70) 48.70%,rgba(77,255,108,0.70) 100%);
	background-image: linear-gradient(180deg,rgba(186,255,193,0.70) 1.04%,rgba(228,255,231,0.70) 48.70%,rgba(77,255,108,0.70) 100%);
}

#old {
	background-image: -webkit-linear-gradient(270deg,rgba(255,186,186,0.70) 1.04%,rgba(255,228,228,0.70) 48.70%,rgba(255,77,77,0.70) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(255,186,186,0.70) 1.04%,rgba(255,228,228,0.70) 48.70%,rgba(255,77,77,0.70) 100%);
	background-image: -o-linear-gradient(270deg,rgba(255,186,186,0.70) 1.04%,rgba(255,228,228,0.70) 48.70%,rgba(255,77,77,0.70) 100%);
	background-image: linear-gradient(180deg,rgba(255,186,186,0.70) 1.04%,rgba(255,228,228,0.70) 48.70%,rgba(255,77,77,0.70) 100%);
}*/

#gd {
	text-align: center;
}
.expWrapper {
	margin: 1em;
}
#pictureViewer {
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}
#viewerNote {
	color: #FFFFFF;
	text-align: center;
	margin: 1em 0px;
}
