@charset "utf-8";
/* CSS Document */


/* GENERAL */


* { /* remove all initial margins and paddings */
	margin: 0;
	padding: 0;
}

body { /* background color in case browser gets scaled wider than ~1300px */
	background-color: #FFFFFF;
}


/* IMAGES */


#landingPageBackground { /* Background image for the landing page */
	width: 1344px; 
	height: 2200px;
	margin: 0px auto; /* centered */
	background-image:url('../assets/img/LandingPageBackground.png');
}

#committeePageBackground { /* Background image for committee page */
	width: 1344px;
	height: 5800px;
	margin: 0px auto; /* centered */
	background-image:url('../assets/img/CommitteePageBackground.png');
}

#logo { /* logo on top of the page */
	width: 360px;
	height: 308px;
	margin: 0px auto; /* centered */
	background-image: url('../assets/img/Logo.png');
}

#tumblr { /* tumblr image */
	width: 284px;
	height: 17px;
	margin-bottom: 16px;
	background-image: url('../assets/img/tumblr.png');
}

#twitter { /* twitter image */
	width: 284px;
	height: 32px;
	margin-bottom: 16px;
	background-image: url('../assets/img/twitter.png');
}

#sponsors{ /* sponsors image */
	width: 526px;
	height: 72px;
	margin: 80px auto 0px auto;
	background-image:url('../assets/img/ACMandSigCHI.png') ;
}


/* DIVs */


#content { /* actual content div */
	width: 648px;
	margin: 0px auto; /* centered */
	padding-top: 74px;
} 

#left { /* left panel for tiles */
	width: 316px;
	float: left;
	margin-right: 16px;
}
	
#right {
	width: 316px;
	float: right;
}

#tile {
	padding: 16px;
}


/* CLASSES */

.bottomMargin {
	margin-bottom: 16px;
}

.clear {
	clear: both;
}

.padding {
	padding: 16px;
}

.purple1 {
	background-color: #BB00CC;
}

.purple2 {
	background-color: #AA00BB;
}

.purple3 {
	background-color: #9900AA;
}

.purple4 {
	background-color: #880099;
}

.purple5 {
	background-color: #770088;
}

.purple6 {
	background-color: #660077;
}


/* TEXT */


h1 {
	font-family: bikobold;
	font-size: 36px;
	line-height: 32px;
	text-align: center;
	color: #333;
	margin: 74px 0px;
}

h2 {
	font-family: bikoregular;
	font-size: 24px;
	line-height: 32px;
	text-align: center;
	color: #333;
}

p { /* every <p> element */
	text-align: center;
	color: #333;
}

#tile p { /* every <p> in a div with #tiles ID */
	color: #fff;
}

#headline {
	font-family: bariol_regular;
	font-size: 36px;
	line-height: 32px;
	margin-bottom: 14px;
}

#bold {
	font-family: bariol_bold;
	font-size: 16px;
	line-height: 18px;
}

#regular {
	font-family: bariol_regular;
	font-size: 16px;
	line-height: 18px;
}

#comBold {
	font-family: bariol_bold;
	font-size: 18px;
	line-height: 27px;
}

#comRegular {
	font-family: bariol_regular;
	font-size: 18px;
	line-height: 27px;
}


/* LINKS */

a {
	color: #fff;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

a:visited {
	text-decoration: underline;
	color: #fff;
}


/* FONTS */


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on December 5, 2014 */

@font-face {
    font-family: 'bikoregular';
    src: url('../assets/fonts/biko_regular-webfont.eot');
    src: url('../assets/fonts/biko_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/biko_regular-webfont.woff2') format('woff2'),
         url('../assets/fonts/biko_regular-webfont.woff') format('woff'),
         url('../assets/fonts/biko_regular-webfont.ttf') format('truetype'),
         url('../assets/fonts/biko_regular-webfont.svg#bikoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bikobold';
    src: url('../assets/fonts/biko_bold-webfont.eot');
    src: url('../assets/fonts/biko_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/biko_bold-webfont.woff2') format('woff2'),
         url('../assets/fonts/biko_bold-webfont.woff') format('woff'),
         url('../assets/fonts/biko_bold-webfont.ttf') format('truetype'),
         url('../assets/fonts/biko_bold-webfont.svg#bikobold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bariol_regular';
    src: url('../assets/fonts/bariol_regular-webfont.eot');
    src: url('../assets/fonts/bariol_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/bariol_regular-webfont.woff2') format('woff2'),
         url('../assets/fonts/bariol_regular-webfont.woff') format('woff'),
         url('../assets/fonts/bariol_regular-webfont.ttf') format('truetype'),
         url('../assets/fonts/bariol_regular-webfont.svg#bariol_regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bariol_bold';
    src: url('../assets/fonts/bariol_bold-webfont.eot');
    src: url('../assets/fonts/bariol_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/bariol_bold-webfont.woff2') format('woff2'),
         url('../assets/fonts/bariol_bold-webfont.woff') format('woff'),
         url('../assets/fonts/bariol_bold-webfont.ttf') format('truetype'),
         url('../assets/fonts/bariol_bold-webfont.svg#bariol_boldbold') format('svg');
    font-weight: normal;
    font-style: normal;
}