/*
 * Specifically for styling index.html
 *
 */

@import url(//fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700|Roboto+Slab:400,700);


body {
    font-family: 'Open Sans', sans-serif;
}

p {
    color: #777;
    font-family: 'Open Sans', sans-serif;
	text-align: left;
}

.ui-widget {
    color: #777;
    font-family: 'Open Sans', sans-serif;
}

form {
	max-width: 30rem;
	margin: auto;
	text-align: left;
}

form > div {
	margin-bottom: 0.75rem;
	line-height: 1rem;
}

input[type=checkbox] {
	width: 0.8rem;
	height: 0.8rem;
	vertical-align: middle;
	cursor: pointer;
}

input[type=checkbox] + label {
	font-style: italic;
	color: #999;
	cursor: pointer;
	font-size: 0.8rem;
}

input[type=checkbox]:checked + label {
	font-style: normal;
	color: #777;
}

input#submit {
	margin-top: 0.5rem;
}

input.fcc {
	display: block;
	width: 100%;
}

label.fcc-label {
	font-size: 1.5rem;
	margin-bottom: 0.25rem;
	display: block;
	color: #aaa;
}

header {
	background-color: whitesmoke;
    padding: 1rem 0;
}

header#bar {
    padding: 0;
    box-shadow: none;
}

.intro h1, section h1, section h2, section h3{
	font-family: "Roboto Slab", Arvo, "Open Sans", sans-serif;
	font-weight: 400;
	font-size: 2rem;
}

section h2 {
    font-size: 1.5rem;
	margin-bottom: 1rem;
	border-bottom: solid 1px #ddd;
	display: inline-block;
}

#repo {
	margin-bottom: 1rem;
}

#repository_wrapper {
	font-size: 0.8rem;
	max-width: 1366px;
	margin: auto;
}

section h3 {
	font-size: 1.25rem;
}

header a {
    text-decoration: none;
}

#about-header {
    font-family: Oswald;
    font-size: 4.6rem;
    /* margin-top: -1rem; */
    color: #555;
    text-transform: uppercase;
}

#logo-header {
    margin: 0 auto;
    width: 200px;
	height: 4rem;
}

@media (min-width: 40rem){
    #about-header {
        display: inline;
        /* font-size: 7.5rem; */
    }

    #logo-header {
        display: inline;
        /* height: 6.6rem; */
        width: auto;
    }
}
@media (min-width: 64rem){
    #about-header {
        /* font-size: 9rem; */
    }
    #logo-header {
        /* height: 8rem; */
    }
}

#pixls-blender {
		background-image: url('https://lh5.googleusercontent.com/-VScF_Hq-YE8/VAOA5mdIchI/AAAAAAAARYs/uj6xLzvyRiY/s1920/pixls-background.jpg');
        background-position: center;
        background-size: cover;
        height: 500px;
}

section.footer {
	background-color: whitesmoke;
	-moz-box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.5);
	box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.5);

}

ul {
	max-width: 30rem;
	margin: auto;
	color: #777;
}

ul > li {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

tbody td {
	text-align: left;
}

td.column-checksum {
	font-size: 0.75rem;
	font-family: monospace;
	word-break: break-all;
}

.checksumdata {
	font-size: 0.7rem;
	font-family: monospace;
}

.form-upload {
	border: solid 1px #ddd;
	padding: 0.5rem;
	box-shadow: 0 5px 8px -3px #ddd;
}

a.cc {
	color: #999;
}

.small {
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
}

.small > li {
	margin: 0.2rem;
}

.orview {
	font-size: 1rem;
}