/*-------------------------
    Simple reset
--------------------------*/


*{
    margin:0;
    padding:0;
}


/*-------------------------
    General Styles
--------------------------*/


html{
    background:#333;
}


body{
	font-family: 'Quicksand', sans-serif;
	font-size:100px;
}

a {
	color:inherit;
	text-decoration:none;
}
a:hover {
	color:#aaa;
}

section, footer, header{
    display: block;
}


/*----------------------------
    The Header
-----------------------------*/


header{
    background-color:#444;
    background-color:#fff;
    background-image: linear-gradient(top, #FFFFFF 0%, #EDEDED 100%);
    background-image: -o-linear-gradient(top, #FFFFFF 0%, #EDEDED 100%);
    background-image: -moz-linear-gradient(top, #FFFFFF 0%, #EDEDED 100%);
    background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #EDEDED 100%);
    background-image: -ms-linear-gradient(top, #FFFFFF 0%, #EDEDED 100%);
    
    padding:20px;
    box-shadow:0 2px 4px rgba(0,0,0,0.3);
}

h1 {
	font-size: 75%;
	font-weight: 300;
	height: 100px;
	margin: 10px 0 0 3%;
	position: absolute;
	text-shadow: 0 0 2px #888;
	top: 0;
	color: #777;
}
h1 span {
	color:#ccc;
}
h2 {
	font-size:20%;
	position:absolute;
	bottom:0;
	color: #777;
	font-weight: 400;
}


/*----------------------------
    Thumbnails
-----------------------------*/

.thumbs{
    width:480px;
    margin:60px auto 0;
    text-align:center;
}

.thumbs {
    margin: 120px auto 0;
    text-align: center;
    width: 885px;
}

.thumbs a{
    width:150px;
    height:150px;
    display:inline-block;
    border:7px solid #303030;
    border:0px solid #363636;
    box-shadow:0 1px 3px rgba(0,0,0,0.5);
    box-shadow:0 1px 3px rgba(0,0,2,2.5);
    border-radius:4px;
    border-radius:2px;
    margin: 6px 6px 40px;
    margin: 12px 12px 60px;
    position:relative;
    text-decoration:none;
    
    background-position:center center;
    background-repeat: no-repeat;
    
    background-size:cover;
    -moz-background-size:cover;
    -webkit-background-size:cover;
}
#credit{
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    font-size: 11px;
    margin: 0 auto 70px;
    opacity: 0.5;
    padding: 12px 16px;
    text-align: center;
    width: 400px;
}

/*----------------------------
    Updates
-----------------------------*/

.thumbs a {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 0 solid #363636;
    border-radius: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 2, 1);
    display: inline-block;
    height: 190px;
    margin: 12px 12px 60px;
    position: relative;
    text-decoration: none;
    width: 250px;
}

sub {
    font-size: 75%;
    font-style: italic;
    vertical-align: 7%;
}

.thumbs {
    width: 95%;
}

.thumbs a {
    margin: 2%;
}



#tabbar {
	float:right;
	width:100%;
	bottom:0;
}
.tab {
	float:right;
	position:relative;
	margin:0 5% 0 0;
	padding:10px 20px 15px 20px;
	color:white;
	background-color:#888;
}

/*----------------------------
    Media Queries
-----------------------------*/


@media screen and (max-width: 960px) {
	
	.thumbs, #credit {
		width: auto;
	}
    
    #bsaHolder{
        display:none;
    }

	.thumbs a {
		margin: 2%;
	}
}

@media (min-height: 1300px) {
	body {
		font-size:150px;
	}
	img {
		width:80%;
		height:auto;
		}
	.left {
		left: 5%;
		bottom: 40%;
		}
	.right {
		right: 5%;
		top: 40%;
		}
}