/*
Theme Name: Eighth Project
Theme URI: http://wordpress.org/
Description: A Project For The Telerik Academy Web Design Course
Author: No Name
Author URI: http://wordpress.org/
Version: 1.0
General comments (optional).
*/

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, ul, li, form, label, 
article, aside, figure, figcaption, footer, header, hgroup, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	word-wrap: break-word;
	text-overflow: ellipsis
}

h1, h2, h3, h4, h5, h6, p {
	overflow:hidden
}

ul {
	list-style: none
}

a {
	display:block;
	text-decoration:none;
	color:#fff
}

strong {
	font-weight: bold /*fix issues with some browsers */
}

body {
	font-family: "Arial", Helvetica, sans-serif;
	line-height: 1;
	color:#fff;
	background: url("images/background.png") repeat
}

::-moz-selection {background:#c18bbb; color:#FFF}
::-webkit-selection {background:#c18bbb; color:#FFF}
::selection {background:#c18bbb; color:#FFF}

/* sprites */
.y-divider {
	background:url("images/vertical-separators.png") top left
}

.icons-n-bg {
	background:transparent url("images/icons.png") top left
}
/* end of sprites */

/* clearing */
* html .clear{
	height: 1%;
	overflow: visible
}

*+html .clear{
	min-height: 1%;
	_zoom:1
}

.clear:after{
	content: "";
	clear: both;
	display: block;
	*zoom:1
}
/* end of clearing */

.wrapper {
	width:960px;
	margin:0 auto;
	position:relative
}

header {
	min-height:76px;
	line-height:76px;
	position:relative;
	z-index:1;
	background:#2f3336;
	border-top:1px solid #151719;
	border-bottom:1px solid #788991
}

.header-border {
	height:1px;
	background:#5e6368
}

header img{
	max-width:180px;
	max-height:75px;
	vertical-align:middle
}

header h1, #copy p{
	margin-left:209px;
	float:left;
	font:18px Georgia, sans-serif;
	line-height:21px;
	white-space:nowrap;
	color:#7c848a
}

header h1 {
	max-width:280px;
	max-height:25px;
	margin-top:27px
}

header h1 span, #copy span {
	color:#fff
}

.top-light {
	width:269px;
	height:77px;
	position:absolute;
	left:-30px;
	background-position:0px -50px
}

.logo {
	height:75px;
	position:absolute;
	left:0;
	top:-2px;
	overflow:hidden
}

.left-divider, .right-divider {
	width:2px;
	height:75px;
	position:absolute;
	top:0;
	background-position:0 -33px
}

.left-divider {
	left:187px
}

.right-divider {
	right:50px
}

/* header navigation */
#main-nav {	
	width:400px;
	margin:0 0 -25px 500px;
	padding-top:25px
}

#main-nav > li {
	margin:0 3px 3px 0;
	float:left;
	position:relative;
	border-radius:14px;
}

#main-nav > li > a {
	padding:0 14px;
	position:relative;
	z-index:1;
	font-size:13px;
	line-height:28px;
	border-radius:14px;
	color:#d3e1e8;
}

#main-nav > li:hover {
	-webkit-box-shadow: inset 2px 2px 3px 0px #1c2022;
	box-shadow: inset 2px 2px 3px 0px #1c2022;
	background: rgb(46,52,55);
	background: #2e3437;
	background: -moz-linear-gradient(top,  #2e3437 0%, #1b1e21 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2e3437), color-stop(100%,#1b1e21));
	background: -webkit-linear-gradient(top,  #2e3437 0%,#1b1e21 100%);
	background: -o-linear-gradient(top,  #2e3437 0%,#1b1e21 100%);
	background: -ms-linear-gradient(top,  #2e3437 0%,#1b1e21 100%);
	background: linear-gradient(to bottom,  #2e3437 0%,#1b1e21 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2e3437', endColorstr='#1b1e21',GradientType=0 );
	*filter:-;
	*background:#222528
}

#main-nav > li:hover:after {
	content:"";
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	border-radius:14px;
	-webkit-box-shadow: 1px 1px 1px 0px #414547;
	box-shadow: 1px 1px 1px 0px #414547;
}

#main-nav li:hover > ul {
	display:block
}

#main-nav ul {
	display:none;
	width:206px;
	padding:2px 1px 0 1px;
	position:absolute;
	z-index:2;
}

#main-nav ul li {
	position:relative;
	line-height:33px;
	border-bottom:1px solid #181b1f;
	border-top:1px solid #33373c;
	background:#222528
}

#main-nav ul li:first-child,#main-nav li:first-child > a:hover{
	border-radius:8px 8px 0 0
}

#main-nav ul:before {
	content:"";
	display:block;
	width:208px;
	height:20px;
	position:absolute;
	right:0;
	top:2px;
	z-index:-1;
	background:url("images/icons.png") no-repeat 0 -127px
}

#main-nav ul li a {
	padding-left:35px;
	font-size:13px;
	text-align:left;
	line-height:33px;
	color:#798187;
	*height:100%;
	*width:158px;
	*padding-left:25px
}

#main-nav li a:first-letter, #main-nav ul li a:first-letter, #slider-nav h1:first-letter, article h1, #rss-top-nav a{
	text-transform:capitalize
}

#main-nav ul li a:hover {
	color:#FFF;
	background:#2b2e31
}

#main-nav ul span {
	display:block;
	width:3px;
	height:5px;
	margin:16px 0 0 20px;
	float:left;
	position:relative;
	z-index:1;
	background-position:-99px -31px
}

#main-nav ul li ul {
	top:-3px;
	left:206px;
	*top:-4px;
	*padding-left:3px
}
/* end of header navigation */

/* search form */
#search-form {
	width:26px;
	height:26px;
	position:absolute;
	top:24px;
	right:0;
	background-position:-219px 0
}

#search-form:hover {
	background-position:-245px 0
}

#search-form label {
	display:block;
	width:100%;
	height:100%
}

header form {
	display:none;
	width:150px;
	height:30px;
	position:absolute;
	right:0;
	top:62px;
	z-index:1;
}

input::-webkit-input-placeholder, input:-moz-placeholder, input:-ms-input-placeholder {
	color:#fff
}

input[placeholder="search"] {
	padding:5px 4px;
	float:left;
	border-radius:5px;
	border-left:none;
	border-top:none;
	border-right:1px solid rgba(52,52,52,1);
	border-bottom:1px solid rgba(52,52,52,1);
	color:#fff;
	font-style:italic;
	-webkit-box-shadow: inset 2px 2px 5px 0px #000;
	box-shadow: inset 2px 2px 5px 0px #000; 
	background: #5a73e3;
	background: -moz-linear-gradient(top,  #5a73e3 0%, #654ec9 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5a73e3), color-stop(100%,#654ec9));
	background: -webkit-linear-gradient(top,  #5a73e3 0%,#654ec9 100%);
	background: -o-linear-gradient(top,  #5a73e3 0%,#654ec9 100%);
	background: -ms-linear-gradient(top,  #5a73e3 0%,#654ec9 100%);
	background: linear-gradient(to bottom,  #5a73e3 0%,#654ec9 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5a73e3', endColorstr='#654ec9',GradientType=0 )
}
/* end of search form */

#main-content .wrapper {
	padding:27px 0 0 0
}

/* slider */
#slider {
	padding:9px 0 8px 9px;
	border-radius:6px;
	border:1px solid rgba(255, 255, 255, .3);
	background:rgba(255, 255, 255, .1);
	*background:#67709a;
}

#image-preview {
	width:570px;
	height:347px;
	float:left;
	position:relative;
	border-radius:7px;
	-webkit-box-shadow: inset 8px 8px 25px -8px #000;
	box-shadow: inset 8px 8px 25px -8px #000;
	background:#2b2929
}

#image-preview img {
	width:100%;
	height:100%;
	border-radius:7px
}

#image-preview:before {
	content:"";
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:7px;
	-webkit-box-shadow: inset 8px 8px 25px -8px #000;
	box-shadow: inset 8px 8px 25px -8px #000
}

#image-preview:after {
	content:"";
	display:block;
	position:absolute;
	width:100%;
	height:347px;
	left:1px;
	top:1px;
	z-index:-1;
	border-radius:7px;
	background:rgba(255, 255, 255, .4)
}

#slider-nav {
	margin-left:571px
}

#slider-nav li {
	height:104px;
	padding:10px 0 0 20px;
	opacity:.5;
	filter: alpha(opacity = 50);
	overflow:hidden;
	cursor:pointer;
	border-top:1px solid #8c9193;
	border-bottom:1px solid #565d63;
}

#slider-nav li:first-child {
	border-top:none
}

#slider-nav li:last-child {
	border-bottom:none
}

#slider-nav figure {
	margin-right:21px;
	float:left;
	border-radius:0 1px;
	border-left:1px solid rgba(0, 0, 0, .2);
	border-top:1px solid rgba(0, 0, 0, .2);
	border-right:1px solid rgba(255, 255, 255, .1);
	border-bottom:1px solid rgba(255, 255, 255, .1)
}

figure img, .post-overview img {
	display:block;
	width:80px;
	height:80px;
	padding:5px;
	background:#585f63
}

figcaption, #mobile-nav {
	display:none
}

#slider-nav h1 {
	margin:-2px 27px 5px 112px;
	max-height:52px;
	padding-bottom:8px;
	position:relative;
	font-size:20px;
	line-height:28px;
	font-weight:normal
}

#slider-nav h1:after {
	content:"";
	display:block;
	width:235px;
	height:2px;
	position:absolute;
	bottom:0;
	left:-11px;
	background:url("images/horizontal-separators.png") no-repeat 0 -2px
}

#slider-nav p {
	width:60%;
	margin:0 23px 0 112px;
	max-height: 60px;
	font-size:12px;
	line-height:20px;
	color:#bcc7ce
}

#slider-nav .current {
	background: -moz-linear-gradient(left,  rgba(255,247,247,0) 0%, rgba(68,68,68,0.32) 83%, rgba(68,68,68,0.38) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,247,247,0)), color-stop(83%,rgba(68,68,68,0.32)), color-stop(100%,rgba(68,68,68,0.38)));
	background: -webkit-linear-gradient(left,  rgba(255,247,247,0) 0%,rgba(68,68,68,0.32) 83%,rgba(68,68,68,0.38) 100%);
	background: -o-linear-gradient(left,  rgba(255,247,247,0) 0%,rgba(68,68,68,0.32) 83%,rgba(68,68,68,0.38) 100%);
	background: -ms-linear-gradient(left,  rgba(255,247,247,0) 0%,rgba(68,68,68,0.32) 83%,rgba(68,68,68,0.38) 100%);
	background: linear-gradient(to right,  rgba(255,247,247,0) 0%,rgba(68,68,68,0.32) 83%,rgba(68,68,68,0.38) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fff7f7', endColorstr='#61444444',GradientType=1 ) !important;
	filter: alpha(opacity = 100);
	opacity:1;
	*background:#565b74;
}

#slider-nav .current .pointer {
	width:23px;
	height:45px;
	margin-top:23px;
	float:right;
	background-position:-196px 0
}
/* end of slider */

/* articles */
#posts {
	margin-top:38px
}

#posts > span {
	margin-right:15px;
	padding-left:7px;
	float:left;
	font:72px/72px Georgia, "Times New Roman", Times, serif;
	text-shadow: -1px -1px 2px rgba(0,0,0, .5);
	filter: dropshadow(color=#000000, offx=-1, offy=-1); 
}

hgroup {
	font-size:30px;
	line-height:36px;
	margin-bottom:60px;
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#2d3134
}

hgroup h1, hgroup h2 {
	max-height:76px;
	margin-bottom:6px;
	font-size:30px;
	line-height:36px
}

hgroup h1 {
	color:#FFF
}

#articles-wrap {
	width:600px;
	float:left
}

article {
	width:245px;
	height:324px;
	margin-right:36px;
	padding:5px;
	float:left;
	position:relative
}

.review {
	display:block;
	width:28px;
	height:29px;
	float:left;
	margin-right:8px;
	background-position:-68px 0
}

article h1, #blog-posts h1 {
	max-height:27px;
	margin-bottom:22px;
	font-size:24px;
	font-weight:bold;
	white-space:nowrap
}

article h1:after {
	content:"";
	display:block;
	width:252px;
	height:2px;
	position:relative;
	top:10px;
	background:url("images/horizontal-separators.png") no-repeat 0 -4px
}

article p {
	max-height:216px;
	font-size:12px;
	line-height:24px
}

.index-page p {max-height:none}

article p a {display:inline}

.alignleft {float:left}

.alignright {float:right}

article img {
	display:block;
	margin: 0 10px 10px 0;
	border:2px outset #e53b00;
	border-radius:10px;
}

.gallery li {
	float:left;
	margin:0 0 25px 25px;
}

.gallery li:nth-child(5n+1) {
	margin:0
}

.gallery li img {
	width:170px;
	height:170px;
	border-radius:50px 10px;
	box-shadow:3px 3px 8px #000;
}

.gallery li:hover img {
	box-shadow:0 0 20px #000;
}

#article-review {
	width:100%;
	height:auto
}

.read, #blog-posts {
	-webkit-box-shadow: inset 4px 4px 12px -8px #000;
	box-shadow: inset 4px 4px 12px -8px #000;
	background:rgba(0, 0, 0, .1);
	border:1px solid rgba(0, 0, 0, .3);
	border-right:1px solid rgba(255, 255, 255, .2);
	border-bottom:1px solid rgba(255, 255, 255, .2);
	*background:#454e73
}

.read {
	max-width:86%;
	max-height:12px;
	padding:4px 11px 11px;
	font-family: "Arial", Helvetica, sans-serif;
	position:absolute;
	right:5px;
	bottom:5px;
	border-radius:5px;
	font-size:11px;
	line-height:18px;
	font-weight:bold;
	white-space:nowrap;
	overflow:hidden
}

.read:hover {
	background:rgba(0, 0, 0, .3);
	*background:#343955
}

/* social networks */
#social {
	max-height:50px;
	margin-bottom:5px;
	overflow:hidden
}

#social a {
	height:25px;
	margin-right:8px;
	float:left
}

.twitter {
	width:19px;
	background-position:-25px 0
}

.rss {
	width:24px;
	background-position:-44px 0
}

.facebook {
	width:25px
}

.twitter:hover {
	background-position:-25px -25px
}

.rss:hover, .rss-icon {
	background-position:-44px -25px
}

.facebook:hover {
	background-position:0 -25px
}
/* end of social networks */
/* end of articles */

/* Sidebar */
aside {
	float:right
}

aside h5 {
	font-size:26px;
	line-height:44px;
}

#rss-top-nav {
	max-width:330px;
	max-height:30px;
	margin-left:3px;
	overflow:hidden;
	*display:inline
}

#rss-top-nav li {
	float:left;
	height:30px;
	position:relative;
	font-size:12px;
	line-height:30px;
	font-weight:bold
}

#rss-top-nav li a {
	padding:0 14px 0 32px;
	*display:inline-block;
	*zoom:1;
	*padding: 0 14px 0 7px
}

.recent, .heart {
	margin:9px 0 0 11px;
	float:left
}

.recent {
	width:14px;
	height:15px;
	background-position:-68px -29px
}

.heart {
	width:17px;
	height:14px;
	background-position:-82px -30px
}

#rss-top-nav li:hover, #rss-top-nav li:active {
	background: -moz-linear-gradient(top,  rgba(86,86,86,0) 0%, rgba(86,86,86,0.73) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(86,86,86,0)), color-stop(100%,rgba(86,86,86,0.73)));
	background: -webkit-linear-gradient(top,  rgba(86,86,86,0) 0%,rgba(86,86,86,0.73) 100%);
	background: -o-linear-gradient(top,  rgba(86,86,86,0) 0%,rgba(86,86,86,0.73) 100%);
	background: -ms-linear-gradient(top,  rgba(86,86,86,0) 0%,rgba(86,86,86,0.73) 100%);
	background: linear-gradient(to bottom,  rgba(86,86,86,0) 0%,rgba(86,86,86,0.73) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00565656', endColorstr='#ba565656',GradientType=0 );
	*border-right:1px solid #3a4045;
	*border-left:1px solid #3a4045
}

#rss-top-nav li:hover:before, #rss-top-nav li:hover:after {
	content:"";
	display:block;
	width:2px;
	height:33px;
	position:absolute;
	background:url("images/vertical-separators.png") no-repeat top left
}

#rss-top-nav li:hover:before {left:0; top:0}
#rss-top-nav li:hover:after {right:0; top:0}

#blog-posts {
	width:330px;
	min-height:304px;
	border-radius:7px
}

#blog-posts h1 {
	max-height:30px;
	margin-bottom:8px;
	padding:10px 10px 0 21px;
	line-height:32px
}

.rss-icon {
	width:24px;
	height:25px;
	float:right
}

.post-overview li {
	padding:8px 0 5px 0;
	position:relative
}

.post-overview li:before, .post-overview li:after {
	content:"";
	display:block;
	height:2px;
	position:relative;
	background:url("images/horizontal-separators.png") no-repeat top left
}

.post-overview li:before {
	top:-9px
}

.post-overview li:after {
	top:6px
}

.post-overview img {
	display:block;
	width:43px;
	height:43px;
	margin:-27px 14px 0 26px;
	padding:5px;
	float:left;
	clear:left;
	position:relative;
	z-index:1;
	background:#585f63
}

.date {
	width:50px;
	height:31px;
	max-height:19px;
	max-width:46px;
	margin-left:18px;
	padding:6px 4px 6px 0;
	float:left;
	position:relative;
	z-index:2;
	text-align:center;
	background-position:-96px 0
}

.date span, .post-overview h2:first-letter {
	text-transform:uppercase
}

.date span {
	display:block;
	height:9px;
	font-size:9px;
	line-height:9px;
	text-overflow:ellipse;
	white-space:nowrap;
	overflow:hidden
}

.post-overview h2 {
	width:70%;
	max-height:43px;
	margin-left:93px;
	margin-top:8px;
	font:18px Georgia, sans-serif;
	line-height:21px
}

.post-overview p {
	max-width:200px;
	max-height:12px;
	margin-top:9px;
	float:left;
	font-size:11px;
	line-height:11px;
	color:#d6dfe6;
	white-space:nowrap;
	*margin-left:25px
}

.message {
	display:block;
	width:24px;
	height:17px;
	margin:9px 0 0 8px;
	padding-top:1px;
	float:left;
	color:#000;
	background-position:-219px -26px
}

.message span {
	display:block;
	max-height:10px;
	font-size:11px;
	line-height:11px;
	text-align:center;
	overflow:hidden
}

.post-overview li:hover {
	background:rgba(68,68,68,.3);
	*background:#434963
}

.post-overview li:hover .message {
	background-position:-243px -26px
}
/* end of Sidebar */

/* Footer */
footer {
	margin-top:54px;
	padding-top:26px;
	position:relative;
	font-family:Georgia, sans-serif;
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .7);
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .7); 
	background: #202326;
	background: -moz-linear-gradient(top,  #202326 0%, #2d3134 21%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#202326), color-stop(21%,#2d3134));
	background: -webkit-linear-gradient(top,  #202326 0%,#2d3134 21%);
	background: -o-linear-gradient(top,  #202326 0%,#2d3134 21%);
	background: -ms-linear-gradient(top,  #202326 0%,#2d3134 21%);
	background: linear-gradient(to bottom,  #202326 0%,#2d3134 21%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#202326', endColorstr='#2d3134',GradientType=0 )
}

.footer-border {
	width:100%;
	height:1px;
	position:absolute;
	left:0;
	top:1px;
	background:#616669
}

footer .wrapper {
	padding-bottom:75px;
	overflow:hidden;
}

footer h1 {
	white-space:nowrap;
	font-size:40px;
	line-height:48px
}

footer img {
	display:block;
	max-width:125px;
	max-height:125px;
	min-width:125px;
	min-height:125px;
	width:125px;
	height:125px;
	padding:5px;
	border:1px solid #40464b;
	background:rgba(88, 95, 99, .2)
}

footer li {
	float:left;
	padding:0 13.5px;
	margin-top:26px;
	*display:block;
	*margin-top:26px;
	*padding:0;
	*margin-left:2.8%;
	*float:left;
}

footer li:nth-child(6n) {
	float:right;
	padding:0
}

footer li:nth-child(6n-1) {
	padding-right:0;
	padding-left:15px
}

footer li:nth-child(6n+1) {
	padding-left:0
}

footer li:first-child {
	*margin-left:0
}

#copy {
	height:48px;
	border-top:1px solid #383c40;
	background:#24282c
}

#copy p{
	max-width:100%;
	max-height:31px;
	margin:0 16px;
	font-size:11px;
	line-height:48px;
	white-space:nowrap
}

#copy .wrapper {padding:0}
#copy a {display:inline}

footer .read {
	right:0;
	bottom:17px;
	*background:#282c2f
}

footer .read:hover {*background:#1f2224}
/* End of Footer */

/* Animations */
@-webkit-keyframes bounce{
	0%{-webkit-transform:translate(0,5px)}
	20%{-webkit-transform:translate(0,-4px)}
	40%{-webkit-transform:translate(0,3px)}
	60%{-webkit-transform:translate(0,-2px)}
	80%{-webkit-transform:translate(0,1px)}
	100%{-webkit-transform:translate(0,0)}
}

@-moz-keyframes bounce{
	0%{-moz-transform:translate(0,5px)}
	20%{-moz-transform:translate(0,-4px)}
	40%{-moz-transform:translate(0,3px)}
	60%{-moz-transform:translate(0,-2px)}
	80%{-moz-transform:translate(0,1px)}
	100%{-moz-transform:translate(0,0)}
}

@keyframes bounce{
	0%{transform:translate(0,5px)}
	20%{transform:translate(0,-4px)}
	40%{transform:translate(0,3px)}
	60%{transform:translate(0,-2px)}
	80%{transform:translate(0,1px)}
	100%{transform:translate(0,0)}
}

#main-nav a:hover, article h1:hover, .read:hover, #rss-top-nav a:hover{
	-webkit-animation-name:bounce;
	-webkit-animation-duration:0.35s;
	-webkit-animation-timing-function:linear;
	-webkit-animation-fill-mode:forwards;
	
	-moz-animation-name:bounce;
	-moz-animation-duration:0.35s;
	-moz-animation-timing-function:linear;
	-moz-animation-fill-mode:forwards;
	
	animation-name:bounce;
	animation-duration:0.35s;
	animation-timing-function:linear;
	animation-fill-mode:forwards;
}

@-webkit-keyframes enlarge{
	100%{ 
			color:#dac93c;
			font-size:40px;
			line-height:47px;
			max-height:94px;
			text-shadow: -2px -2px 5px #000;
		}
}

@-moz-keyframes enlarge{
	100%{ 
			color:#dac93c;
			font-size:40px;
			line-height:47px;
			max-height:94px;
			text-shadow: -2px -2px 5px #000;
		}
}

@keyframes enlarge{
	100%{ 
			color:#dac93c;
			font-size:40px;
			line-height:47px;
			max-height:94px;
			text-shadow: -2px -2px 5px #000;
		}
}

#posts hgroup h1:hover{
	-webkit-animation-name:enlarge;
	-webkit-animation-duration:0.2s;
	-webkit-animation-timing-function:linear;
	-webkit-animation-fill-mode:forwards;

	-moz-animation-name:enlarge;
	-moz-animation-duration:0.2s;
	-moz-animation-timing-function:linear;
	-moz-animation-fill-mode:forwards;
	
	animation-name:enlarge;
	animation-duration:0.2s;
	animation-timing-function:linear;
	animation-fill-mode:forwards;
}

@-webkit-keyframes shake{
	0%{-webkit-transform:translate(5px,0)}
	20%{-webkit-transform:translate(-4px,0)}
	40%{-webkit-transform:translate(3px,0)}
	60%{-webkit-transform:translate(-2px,0)}
	80%{-webkit-transform:translate(1px,0)}
	100%{-webkit-transform:translate(0,0)} 
}

@-moz-keyframes shake{
	0%{-moz-transform:translate(5px,0)}
	20%{-moz-transform:translate(-4px,0)}
	40%{-moz-transform:translate(3px,0)}
	60%{-moz-transform:translate(-2px,0)}
	80%{-moz-transform:translate(1px,0)}
	100%{-moz-transform:translate(0,0)} 
}

@keyframes shake{
	0%{transform:translate(5px,0)}
	20%{transform:translate(-4px,0)}
	40%{transform:translate(3px,0)}
	60%{transform:translate(-2px,0)}
	80%{transform:translate(1px,0)}
	100%{transform:translate(0,0)} 
}

.current figure, footer li:hover {
	-webkit-animation-name:shake;
	-webkit-animation-duration:0.6s;
	-webkit-animation-timing-function:linear;
	-webkit-animation-fill-mode:forwards;

	-moz-animation-name:shake;
	-moz-animation-duration:0.6s;
	-moz-animation-timing-function:linear;
	-moz-animation-fill-mode:forwards;
	
	animation-name:shake;
	animation-duration:0.6s;
	animation-timing-function:linear;
	animation-fill-mode:forwards;
}

@-webkit-keyframes right-move{
	100%{-webkit-transform:translate(20px,0)} 
}

@-moz-keyframes right-move{
	100%{-moz-transform:translate(20px,0)} 
}

@keyframes right-move{
	100%{transform:translate(20px,0)} 
}

.post-overview li:hover div,.post-overview li:hover h2,.post-overview li:hover p,.post-overview li:hover img {
	-webkit-animation-name:right-move;
	-webkit-animation-duration:0.5s;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-fill-mode:forwards;

	-moz-animation-name:right-move;
	-moz-animation-duration:0.5s;
	-moz-animation-timing-function:ease-in-out;
	-moz-animation-fill-mode:forwards;
	
	animation-name:right-move;
	animation-duration:0.5s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;
}
/* End of Animations */

/* Media Queries */
@media only screen and ( max-width: 960px ) {
	.wrapper {width: 750px}
	header h1 {
		width:62.5%;
		max-width:none;
		margin-bottom:-50px;
		text-align:center
	}
	#main-nav {
		width:auto;
		margin:0;
		padding:80px 0 3px 0;
		clear:both
	}
	header form {top:52px}
	#image-preview{
		width:480px;
		height: 290px
	}
	#image-preview:after {height:290px}
	#slider-nav {margin-left:480px}
	#slider-nav li {
		height:80px;
		padding:15px 0 0 10px
	}
	#slider-nav figure {margin:2px 0 0 0}
	figure img, .post-overview img {
		width:50px;
		height:50px
	}
	#slider-nav h1 {
		max-height:16px;
		margin-left:68px;
		font-size:18px;
		line-height:21px;
		white-space:nowrap
	}
	#slider-nav p {
		max-height:42px;
		margin-left:68px
	}
	#slider-nav .current .pointer {margin-top:10px}
	#articles-wrap {width:500px}
	article {width:200px}
	article p {max-height:188px}
	.gallery li, .gallery li:nth-child(5n+1) {
		float:left;
		margin:0 0 50px 50px;
	}
	.gallery li:nth-child(4n+1) {
		margin:0
	}
	.gallery li img {
		width:150px;
		height:150px
	}
	#rss-top-nav {max-width:240px}
	#blog-posts {width:240px}
	.recent, .heart {margin:9px 0 0 3px}
	#rss-top-nav li a {padding:0 7px 0 20px}
	.date {margin-left:3px}
	.post-overview img {
		width:40px;
		height:40px;
		margin-left:11px
	}
	.post-overview h2 {
		width:67%;
		margin:0 0 0 75px
	}

	.post-overview p {
		max-width:110px;
		margin:0
	}
	.message {margin-top:0}
	footer li {padding:0 13px}
	footer img {
		max-width:91px;
		max-height:91px;
		min-width:91px;
		min-height:91px
	}
	footer a{font-size:10px}
}

@media only screen and ( max-width: 767px ) {
	.wrapper {width:460px}
	header img{max-width:110px}
	.left-divider {left:127px}
	header h1{
		max-width:56%;
		margin-left:139px;
		font-size:16px;
		line-height:20px
	}
	#main-nav > li > a {
		padding:0 8px;
		font-size:12px;
		line-height:25px;
	}
	#main-nav ul {width:160px}
	#main-nav ul:before {display:none}
	#main-nav ul li a {
		padding-left:25px;
		font-size:11px
	}
	#main-nav ul li ul {left:159px}
	#main-nav ul span {margin:14px 0 0 10px}
	#slider {padding:10px 0}
	#image-preview {
		width:440px;
		height:250px;
		margin:0 auto;
		float:none
	}
	#image-preview:after{height:250px}
	#slider-nav {
		display:block;
		margin:10px 0 0 0
	}
	#slider-nav li {
		height:64px;
		padding:5px 0 5px 10px
	}
	#slider-nav p {
		width:auto;
		height:40px;
		margin-left:68px
	}
	#slider-nav .current .pointer {margin-top:9px}
	#posts > span {font-size:56px}
	hgroup {
		margin-bottom:20px;
		font-size:18px;
		line-height:20px
	}
	hgroup h1 {font-size:24px}
	hgroup h2 {
		font-size:18px;
		line-height:22px
	}
	#articles-wrap {width:100%;}
	article {margin:0 0 0 35px}
	article:nth-child(odd){margin:0}
	.gallery li, .gallery li:nth-child(5n+1), .gallery li:nth-child(4n+1) {
		float:left;
		margin:0 0 20px 50px;
	}
	.gallery li:nth-child(3n+1) {
		margin:0
	}
	.gallery li img {
		width:120px;
		height:120px
	}
	aside {
		float:none;
		clear:both
	}
	#rss-top-nav, #blog-posts {
		width:95%;
		max-width:none;
		margin:0 auto
	}
	#blog-posts h1 {
		margin:0;
		padding:10px 10px 10px 34px;
		text-align:center
	}
	.post-overview li {padding:8px 0 5px 50px}
	footer li {padding:0 4px}
	footer img {
		max-width:58px;
		max-height:58px;
		min-width:58px;
		min-height:58px
	}
	footer li:nth-child(6n-1){
		padding:0 4px
	}
	#copy p{
		width:100%;
		margin:0;
		text-align:center
	}
}

@media only screen and ( max-width: 479px ) {
	.wrapper {width:300px}
	header {
		min-height:50px;
		padding-bottom:5px;
		line-height:50px
	}
	header img {
		max-width:80px;
		max-height:50px
	}
	.logo {height:50px}
	.top-light {left:20px}
	header h1 {
		width:90%;
		max-width:none;
		padding:0 5%;
		margin:47px 0 5px 0;
		position:relative;
		text-align:center;
		font-size:20px;
		line-height:24px
	}
	header form {
		right:29px;
		top:10px;
		z-index:1
	}
	#search-form {top:10px}
	#mobile-nav {
		display:block;
		line-height:35px;
		border-radius:5px;
		border:2px ridge #0aa1c1;
		cursor:pointer;
		background: #cb60b3;
		background: -moz-linear-gradient(-45deg,  #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%);
		background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#cb60b3), color-stop(50%,#c146a1), color-stop(51%,#a80077), color-stop(100%,#db36a4));
		background: -webkit-linear-gradient(-45deg,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
		background: -o-linear-gradient(-45deg,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
		background: -ms-linear-gradient(-45deg,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
		background: linear-gradient(135deg,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb60b3', endColorstr='#db36a4',GradientType=1 )
	}
	.ie9-border-fix {
		width:150px;
		margin:0 auto;
		clear:both;
		border-radius:5px;
		overflow:hidden
	}
	#mobile-nav span {
		display:block;
		font-weight:bold;
		text-transform:uppercase;
		color:#ddd
	}
	#mobile-nav span:before {
		content:"";
		display:inline-block;
		width:19px;
		height:19px;
		margin:0 2px 0 15px;
		vertical-align:middle;
		background:url("images/icons.png") no-repeat -106px -31px
	}
	@-webkit-keyframes rotate{100%{-webkit-transform: rotate(90deg)}}
	@-moz-keyframes rotate{100%{-moz-transform: rotate(90deg)}}
	@keyframes rotate{100%{transform: rotate(90deg)}}
	.arrow-rotate span:before {
		-webkit-animation-name:rotate;
		-webkit-animation-duration:0.5s;
		-webkit-animation-timing-function:linear;
		-webkit-animation-fill-mode:forwards;
		
		-moz-animation-name:rotate;
		-moz-animation-duration:0.5s;
		-moz-animation-timing-function:linear;
		-moz-animation-fill-mode:forwards;
		
		animation-name:rotate;
		animation-duration:0.5s;
		animation-timing-function:linear;
		animation-fill-mode:forwards;
	}
	#main-nav {
		display:none;
		margin:0 auto;
		padding:0
	}
	#main-nav li {
		float:none;
		border-radius:0
	}
	#main-nav li {
		margin:0 auto;
		width:230px;
		text-align:center;
		background: #90979d;
		background: -moz-linear-gradient(top,  #90979d 0%, #606467 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#90979d), color-stop(100%,#606467));
		background: -webkit-linear-gradient(top,  #90979d 0%,#606467 100%);
		background: -o-linear-gradient(top,  #90979d 0%,#606467 100%);
		background: -ms-linear-gradient(top,  #90979d 0%,#606467 100%);
		background: linear-gradient(to bottom,  #90979d 0%,#606467 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#90979d', endColorstr='#606467',GradientType=0 )
	}
	#main-nav li a {
		padding:3px 10px;
		border-radius:0;
		font-size:11px;
		border-bottom:1px solid #535353
	}
	#main-nav li a:hover {
		background:#1e8b42;
		border-radius:0 !important
	}
	#main-nav ul li, #image-preview, #posts > span, .post-overview img,
	.date, .left-divider, .right-divider, footer > .wrapper{display:none}
	hgroup h1, hgroup h2 {
		font-size:20px;
		line-height:26px
	}
	hgroup h2 {
		margin-bottom:18px;
		font-size:16px
		}
	@-webkit-keyframes enlarge{
		100%{
				color:#d52f9e;
				font-size:26px;
				line-height:47px;
				max-height:94px;
				text-shadow: -2px -2px 5px #000;
			}
		}
	@-moz-keyframes enlarge{
		100%{
				color:#d52f9e;
				font-size:26px;
				line-height:47px;
				max-height:94px;
				text-shadow: -2px -2px 5px #000;
			}
		}
	@keyframes enlarge{
		100%{
				color:#d52f9e;
				font-size:26px;
				line-height:47px;
				max-height:94px;
				text-shadow: -2px -2px 5px #000;
			}
		}
	article {
		width:288px;
		margin:0
	}
	.gallery li, .gallery li:nth-child(5n+1), .gallery li:nth-child(4n+1), .gallery li:nth-child(3n+1) {
		float:left;
		margin:0 0 20px 60px
	}
	.gallery li:nth-child(2n+1) {
		margin:0
	}
	.gallery li img {
		width:120px;
		height:120px
	}
	#blog-posts {min-height:100%}
	.post-overview li {padding:8px 0 5px 0}
	.post-overview h2, .post-overview p {
		width:auto;
		margin-left:10px
	}
	footer {padding:0}
}
/* End of Media Queries */

.obelisk-wrapper img {
	margin: 0;
	border: 0;
	border-radius: 0;
}

.obelisk-playlist .obelisk-progress-container {
	margin-top: 8px;
}