/* @override http://wintermute.apollo.local/media/landing.css */

/* CSS Document */


body, input {
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
	background-color: #eee;
	font-size: 1em;
}

#winter {
	width: 800px;
	margin: 1em auto 0;
}

#wordmark {
    text-align: center;
}
h1 {
    font-size: 2.2em;
    margin: 2em 0 0;
    border-bottom: 3px solid #222;
}
#wordmark ul {
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    width: 800px;
}
#wordmark ul li {
    float: left;
    width: 400px;
}
#wordmark ul li#bits a {
    text-align: right;
    padding-right: 20px;
}
#wordmark ul li#photos a {
    text-align: left;
    padding-left: 20px;
}
#wordmark ul a:hover {
    border-bottom: 1px solid #222;
}

.bar {
	font-size: 0.8em;
	margin: 0.5em 0;
}
.bar a {
	color: #222;
	text-decoration: none;
}
.bar a:hover {
	background-color: #feb0f3;
}
.expected a {
	background-color: #eee;
	color: #222;
	display: block;
	text-decoration: none;
}
.expected a:hover {
    background-color: #feb0f3;
}
.right {
    text-align: right;
    padding-right: 0.5em;
}

#footer {
    clear: both;
    background-color: #222;
    color: #eee;
    padding: 0.5em 80px 3.2em;
    font-size: 0.8em;
    margin-bottom: -1em;
}


/* elements */


blockquote {
    margin: 1em 0;
    border-left: 1px solid #333;
    padding-left: 80px;
    color: #333;
}
pre {
    margin-left: 160px;
    padding: 1em;
    line-height: 1.4em;
    overflow: auto;
    background-color: #E0E0EC;
}
img {border:0; }
input {font-size: 0.9em; }
fieldset {padding: 6px 6px 6px 6px; border: 0px;}
legend {font-size: 0.8em; font-weight: bold; color: #31301A}
abbr {border: 0;}

p, li {
	line-height: 1.6;
}
a {
	color: #bb21b9;
}
a:hover {
	background-color: #feb0f3;
}

ul, ol {
    margin-left: 80px;
    padding: 0;
    list-style-position: outside;
    font-size: 0.9em;
}
li {
    line-height: 1.78;
}

/* content */

#main {
	width: 480px;
	margin: 3em auto 0;
	clear: both;
}


#main .date, #main .etc {
	font-style: italic;
}
#main .etc {
    font-size: 0.8em;
}
#main h2 {
	margin: 0 auto;
	font-size: 1em;
	line-height: 1.3;
    background-color: #eee;
}
#main #stream h2 {
	text-align: right;
	font-style: italic;
}
#main h2 a {
	background-color: #222;
	color: #eee;
	display: block;
	padding: 0 1em;
	text-decoration: none;
}
#main h2 a:hover, #main .photo-snippet:hover h2 a, #main .stream-photo:hover h2 a {
	color: #ff47fc;
}
#main p {
	margin: 1em 0;
	font-size: 0.9em;
}
#main .date {
	text-align: right;
	font-size: 0.8em;
	margin: 0 0.2em;
}

.bits_nav {
    font-size: 0.9em;
    border-top: 2px solid #222;
}

#main .stream-bit h2 {
	font-size: 1.6em;
}
#main .stream-bit h2 a {
	padding: 0.4em 0.15em;
}
#main .stream-bit {
	border: 4px solid #ff47fc;
	border-width: 4px 0;
}
#main .photo-snippet h2, #main .stream-photo h2 {
	position: relative;
	margin: 3em auto -3em auto;
}
.stream-photo p.date {
    display:none;
}
#stream .icon img {
	float: right;
	margin-left: 4px;
	width: 20px;
	height: 20px;
	border-radius: 2px;
}
.stream-twitter {
    font-size: 0.9em;
    padding: 3px;
    margin: 4px 0;
    background-color: white;
    opacity: 0.7;
    border: 3px solid #1cadea;
    border-radius: 4px;
}
.stream-twitter:hover {
    opacity: 1;
}
.stream-twitter:hover .icon img, .stream-instagram:hover .icon img {
    opacity: 0.6;
}
.stream-twitter .icon a:hover img, .stream-instagram .icon a:hover img {
    opacity: 1;
}
.stream-instagram {
	font-size: 0.9em;
	padding: 6px;
	margin: 4px 0;
	background-color: black;
	color: #eee;
	border-radius: 4px;
}
.stream-instagram img {
	width: 480px;
	height: 480px;
	margin: 12px 0 0 -6px;
}
.stream-instagram .icon img {
	margin: 0 0 0 4px;
}

#main .caption {
    border-bottom: 2px solid #222;
}

ul.tag_list, ul.cloud {
    list-style-type: none;
    width: 160px;
    margin: 1em 0 0 -160px;
    padding: 0;
    float: left;
    font-size: 0.8em;
}
ul.tag_list li, ul.cloud li {
    float: left;
    margin: 0 0.5em 0 0;
}
ul.cloud {
    margin: 0;
    width: auto;
    vertical-align: bottom;
}
ul.photos {
    margin-bottom: 1em;
}
ul.photos li {
    margin: 0;
    width: 120px;
    height: 120px;
}
ul.photos a:hover img {
    width: 112px;
    height: 112px;
    border: 4px solid #feb0f3;
    opacity: 0.9;
}
ul.pagination {
    float: right;
    width: 160px;
    margin: 0 0 0 -160px;
    padding: 0;
    list-style-type: none;
    position: relative;
    left: 160px;
    
}
ul.pagination li {
    float: left;
    padding: 0 0.3em;
}

.clear {
    clear: both;
}