@charset "utf-8";
@font-face {
    font-family: 'AsapRegular';
    src: url('Asap-Regular-webfont.eot');
    src: url('Asap-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('Asap-Regular-webfont.woff') format('woff'),
         url('Asap-Regular-webfont.ttf') format('truetype'),
         url('Asap-Regular-webfont.svg#AsapRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'AsapBold';
    src: url('Asap-Bold-webfont.eot');
    src: url('Asap-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Asap-Bold-webfont.woff') format('woff'),
         url('Asap-Bold-webfont.ttf') format('truetype'),
         url('Asap-Bold-webfont.svg#AsapBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
	font-family: "AsapRegular", "Arial", "Verdana";
	font-size: 1em;
}
a:link {
	color: #FFFFFF;
	text-decoration: none;
}
a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
a:hover {
	color: #C8E7F7;
	text-decoration: none;
}
a:active {
	color: #C8E7F7;
	text-decoration: none;
}
h1 {
	font-size: 4em;
	text-shadow: 1px 3px 2px #1B1B1B;
	margin-top: -5px;
}
#wrapper {
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	min-height: 100%;
}
.clearer {
	clear: both;
}
#header {
	background-color: #3f72db;
	height: 100px;
	width: 94%;
	padding-top: 10px;
	padding-right: 3%;
	padding-bottom: 10px;
	padding-left: 3%;
	box-shadow: 0px 5px 4px #183C83;
	background-image: url(images/header_bg.gif);
	background-position: center center;
	text-align: right;
}
#headerlogo {
	width: 345px;
	height: 150px;
	position: absolute;
	top: 0px;
	left: 0px;
	background-image: url(images/header_logo.png);
	background-repeat: no-repeat;
	background-position: right top;
}
.hidden {
	display: none;
	visibility: hidden;
}
img {
	border:none;
}
#content {
	height: auto;
	width: 94%;
	padding-top: 25px;
	padding-right: 3%;
	padding-bottom: 100px;
	padding-left: 3%;
	margin-bottom: 100px;
	margin-top: 25px;
	/* [disabled]background-image: url(images/checkbg.jpg); */
	background-repeat: repeat-x;
	background-position: bottom;
}
.int_wrapper {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	height: auto;
	margin-bottom: 25px;
	padding-bottom: 25px;
}
.column_full {
	width: auto;
	height: auto;
	background-color: #C8DBF7;
	border-radius: 10px;
	box-shadow: 0px 5px 4px #1D5AB8;
	padding: 10px;
	left: 0px;
	margin-bottom: 25px;
}
.column_full_social {
	width: auto;
	height: auto;
	background-color: #BAE0FC;
	border-radius: 10px;
	box-shadow: 0px 5px 4px #097ACE;
	padding: 10px;
	left: 0px;
	margin-top: 25px;
}
.anniversary h1 , h2{
	color: #0033CC;
}
#header h1 {
	color: #FFFFFF;
}

.button {
	height: 50px;
	width: 270px;
	border-radius: 5px;
	margin-bottom: 10px;
	/* [disabled]margin-right: 10px; */
	background-color: #7FC4EB;
	text-align: center;
	border-radius: 10px;
	box-shadow: 0px 4px 4px #054F85;
	padding-top: 0.1em;
	padding-bottom: 2px;
	font-size: 1em;
	line-height: 1em;
	color: #FFF;
	float: left;
	font-weight: bold;
}
.annibox {
	height: 65px;
	width: 260px;
	border-radius: 5px;
	margin-bottom: 10px;
	margin-right: 10px;
	background-color: #0033CC;
	text-align: center;
	border-radius: 10px;
	box-shadow: 0px 4px 4px #054F85;
	padding-top: 135px;
	padding-bottom: 2px;
	font-size: 1em;
	line-height: 1em;
	color: #FFF;
	float: left;
	font-weight: normal;
	padding-left: 10px;
	padding-right: 10px;
	position: relative;
}
.updated {
	font-weight: bold;
	color: #FFFFFF;
	background-color: #EA3B3B;
	height: 45px;
	width: 80px;
	position: absolute;
	top: -5px;
	right: -5px;
	border-radius: 25px;
	padding-top: 15px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	box-shadow: 0px 4px 4px #313131;
}

.archivesbg {
	background-image: url(images/archive_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.wallpaperbg {
	background-image: url(images/wallpaper_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.speedlinesbg {
	background-image: url(images/speedlines_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.sosbg {
	background-image: url(images/sos_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}


.fansbg {
	background-image: url(images/fans_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}


.alumnibg {
	background-image: url(images/alumni_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}



.twitter {
	background-color: #2daae1;
	background-image: url(images/twitter_bg.png);
	background-repeat: no-repeat;
	background-position: left center;
}
.backissues {
	background-color: #7FC4EB;
	background-image: url(images/backissues_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
.speedlines {
	background-color: #FF9900;
	background-image: url(images/speedlines_bg.png);
	background-repeat: no-repeat;
	background-position: left center;
}
.mainpage {
	background-color: #0033CC;
	background-image: url(images/mainpage_bg.png);
	background-repeat: no-repeat;
	background-position: left center;
}

#footer {
	height: 100px;
	width: 94%;
	text-align: center;
	padding-top: 10px;
	padding-right: 3%;
	padding-bottom: 10px;
	padding-left: 3%;
	position: absolute;
	bottom: 0px;
	margin-top: 100px;
	min-height: 75px;
	box-shadow: 0px -2px 3px #969DAB;
}
.pc {
	height: 25px;
	vertical-align: middle;
}
.copyright {
	background-color: #363b45;
	background-image: url(images/copyright_bg.png);
	background-repeat: no-repeat;
	background-position: left top;
	color: #FFFFFF;
	font-size: 0.7em;
	text-align: center;
}
.title {
	font-weight: bold;
	font-size: 1.2em;
}

.desktop {
	visibility:visible;
	display:block;
}
.mobile {
	visibility:hidden;
	display:none;
}

/* BACKGROUND COLOURS LIGHT */
.sonicbg {
	background-color: #93bdfd;
}
.silverbg {
	background-color: #CCCCCC;
}
.darkbg {
	background-color: #761214;
}
.blazebg {
	background-color: #B8A5EF;
}
.teknobg {
	background-color: #c3ecc3;
}
.tailsbg {
	background-color: #f4d19d;
}
.knucklesbg {
	background-color: #e8a6a6;
}
.amybg {
	background-color: #f0cae4;
}
.houseofthedeadbg {
	background-color: #ae8282;
}
.decapbg {
	background-color: #996699;
}
.sonicsworldbg {
	background-color: #b3d2e6;
}

/* BACKGROUND COLOURS DARK */
.sonicbg2 {
	background-color: #2C6ADD;
}
.silverbg2 {
	background-color: #959595;
}
.darkbg2 {
	background-color: #761214;
}
.blazebg2 {
	background-color: #BE84E6;
}
.teknobg2 {
	background-color: #00CC66;
}
.tailsbg2 {
	background-color: #FF9933;
}
.knucklesbg2 {
	background-color: #FF3333;
}
.amybg2 {
	background-color: #E77AD3;
}
.houseofthedeadbg2 {
	background-color: #ae8282;
}
.decapbg2 {
	background-color: #996699;
}
.sonicsworldbg2 {
	background-color: #00CCFF;
}

/* TEXT COLOURS */
.sonic {
	color: #2C6ADD;
}
.silver {
	color: #959595;
}
.dark {
	color: #761214;
}
.blaze {
	color: #BE84E6;
}
.tekno {
	color: #00CC66;
}
.tails {
	color: #FF9933;
}
.knuckles {
	color: #FF3333;
}
.amy {
	color: #E77AD3;
}
.houseofthedead {
	color: #ae8282;
}
.decap {
	color: #996699;
}
.sonicsworld {
	color: #00CCFF;
}

/* WALLPAPERS */
.wallpapers {
	/* [disabled]background-color: #EAD7F7; */
}
.wallpapers img {
	float:left;
}
#wallpapertoc {
	padding: 10px;
	width: auto;
	border-radius: 10px;
	box-shadow: 0px 5px 4px #666666;
	font-size: 1.5em;
	font-weight: bold;
	text-align: left;
	height: 285px;
	line-height: 2em;
	float: left;
	margin-left: 10px;
}

@media screen and (max-width: 900px) {
.wallpapers img {
	width:100%;
	max-width:550px;
}
#wallpapertoc {
	margin-top:10px;
	padding: 10px;
	width: 260px;
	border-radius: 10px;
	box-shadow: 0px 5px 4px #666666;
	font-size: 1em;
	line-height: 2em;
	text-align: left;
	height: auto;
	margin-left: 0px;
}
}


/* MOBILE */
@media screen and (max-width: 600px) {
@-ms-viewport { width: 320px; }

#headerlogo {
	width: 290px;
	height: 150px;
}
h1 {
	font-size:3em;
}
.button {
	height: auto;
	width: 300px;
}
.datazone_entry img {
	max-width:100%;
}
.mobile {
	visibility:visible;
	display:block;
}
.desktop {
	visibility:hidden;
	display:none;
}
}
