/*
Theme Name: Artboiled
Description: Custom theme for Artboiled.com
Author: Arya Ponto
Template: twentyeleven
*/

body {
	background: #EBE8D5 url(images/bg.jpg) no-repeat top center;
	color: #000;
	font: 16px Helvetica;
	line-height: 1.7em;
}

a, .entry-content p a.more-link { color: #006e8e; font-weight: bold; border: none; }
a:hover, .entry-content p a.more-link:hover { text-decoration: none !important; color: #4394a6; border: none; }

.entry-content p a { color: #000; font-weight: normal; border-bottom: #4394a6 3px solid; }
.entry-content p a:hover { color: #4394a6; border-bottom: #4394a6 3px solid; }

p, li { text-align: justify; margin-bottom: 1.3em; }

hr { 
	border: none; 
  	border-bottom: #cbd2d6 2px dashed;
	background-color: #fff;
	height: 2px;
	margin-bottom: 1.3em;
}

#page {
	width: 1000px;
	border: 2px solid #20050E;
	background: #fff url(images/coffee.jpg) no-repeat top right;
	margin: 2em auto 0 auto;
	padding-bottom: 30px;
	overflow: hidden;
	position: relative
}


/* NETWORK */

#twitter, #tumblr, #matchcut, #matchcuthover, .networkhover {
  	display: inline-block;
  	height: 72px; width: 72px;
  	margin: 5px 0 15px 19px;
  	border-radius: 50%;
}

#twitter { 
  	background: url(https://pbs.twimg.com/profile_images/459009244868517888/7qU4Cdx6_400x400.jpeg);
  	background-size: cover;
}
#tumblr { 
  	background: url(http://static.tumblr.com/0c251363001280ae84541825c7d6c081/ykiwjrx/FZBn72co8/tumblr_static_7kc6b8c98mos4okow0g40wsko_2048_v2.jpg);
  	background-size: cover;
  	background-position: -210px 0;
}
#matchcut {
  	background: url(http://matchcut.artboiled.com/images/banners/mc-circle.png) no-repeat;
  	background-size: cover;
}

#matchcuthover {
  	background: url(http://matchcut.artboiled.com/images/banners/mc-logo.png) no-repeat;
	background-size: contain;
	border-radius: 0;
	width: 105px;
	padding: 0;
  	margin: -104px 0 0 213px !important;
}  

.networkhover {
	opacity: 0;
	width: 72px;
	height: 72px;
	margin: 5px 0 0 -72px !important;
	text-align: center;
	color: #fff;
	vertical-align: top;
	line-height: 100%;
	font-size: 21px;
	padding: 16px 0 16px 0;
	letter-spacing: 0.20em;
	text-shadow: 0 0 5px #000;
}

.networkhover:hover { opacity: 1 }

.fb-like-box { margin-left: 55px; }

/* HEADER */

#menu-select {
	position: absolute;
	top: 90px;
	right: 30px;
}

#menu-select select {
	-webkit-appearance: none; 
	background: transparent;
	border: none;
	color: #006E8E;
	text-transform: uppercase;
	font-size: 30px;
	font-weight: bold;
	letter-spacing: 3px
}

#branding {
	border: 0;
	padding: 0;
}

#branding img {
	width: auto; height: auto;
	margin: 0 2px;
	float: left;
}

#branding #logo {
	margin: 0;
	padding: 30px;
	width: 450px;
}

#branding #followme {
	display: none;
}

#branding #searchform {
	position: absolute;
	top: 30px;
	right: 30px;
	text-align: right;
}

input#s { background-color: white; }

#site-title {
	margin: 0;
	padding: 0;
	width: 450px;
	height: 105px;
	background: url(images/artboiled.png) no-repeat;
}

#site-title a { color: #577D94; text-transform: uppercase; font-size: 70px; }

#site-description { margin: 0 }

  
/* MAIN */

#primary, .error404 #primary {
	margin: 0;
	float: left;
	width: 640px;
}  

.singular .hentry, .singular.page hentry { 
	padding: 0 !important;
	border-bottom: none
}

.hentry, .no-results {
	border-bottom: none;
	margin: 0 0 35px;
	padding: 0
}

.entry-header, .entry-content, footer.entry-meta {
	padding: 0;
	margin: 0;
	width: 570px;
}

.singular .entry-header, .singular .entry-content, .singular footer.entry-meta {
	padding: 0;
	margin: 0;
	width: 600px;
}

.page .hentry { padding: 0; }

#content { margin: -20px 10px 0 30px; width: 600px; }
#content .error404 { margin-top: 43px; }
.singular #content, .error404 #primary #content { margin: 0 10px 0 30px; }
.singular .entry-content { min-height: 2500px; }

.page-title {
	color: #7A7A7A;
	font-size: 16px;
	line-height: 1.7em;
	margin: 40px 0 20px 0;
	letter-spacing: 0.2em;
	font-weight: bold;
}

.page-title span {
	color: #006e8e;
	font-size: 35px;
}

.filed-in {
	clear: both;
	font-size: 16px;
	text-transform: uppercase;
	margin: 0 0 10px 30px;
	letter-spacing: 0.2em;
	color: #7A7A7A;
}

#featuredimage { width: 630px; margin-left: -30px; }
#featuredimage img { width: 630px; }

.singular #featuredimage { width: 1000px; max-width: 1000px; margin: 0 0 1.3em 0; }
.singular #featuredimage img { width: 1000px; }

#featuredimage embed, #featuredimage iframe, #featuredimage object { width: 100%; }

#featuredimage span {
	position: absolute;
	bottom: 15px;
	left: 30px;
	padding: 5px;
	background: rgba(0,0,0,0.6);
	line-height: 1em;
	color: white;
	font-family: helvetica;
	font-size: 12px;
}

.format-quote #featuredimage, .format-link #featuredimage {
	width: 200px;
	margin: 0;
	height: 100px;
	display: inline-block;
	background: #006E8E url(http://www.artboiled.com/wp-content/themes/artboiled/images/bg-fog.jpg);
	color: white;
	font-size: 50px;
	overflow: hidden;
	line-height: normal;
  	text-align: center;
  	letter-spacing: 3px;
}

.format-image #featuredimage {
	width: 200px;
	margin-left: 0;
	height: 100px;
	overflow: hidden;
	display: inline-block;
	padding-top: 0;
	position: relative;
}
	  
.format-image #featuredimage img {
	width: 250px;
  	max-width: 250px !important;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
  	opacity: 1;
}

.format-image #featuredimage embed, 
.format-image #featuredimage iframe, 
.format-image #featuredimage object { 
  	width: 250px; 
	max-width: 250px !important;
	margin-left: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
}

.indexed.format-image .entry-header, .indexed.format-link .entry-header, .indexed.format-quote .entry-header, {
	display: inline-block;
	width: 350px;
	vertical-align: top;
	margin-left: 16px;
}

.indexed.format-image .entry-title, .indexed.format-link .entry-title, .indexed.format-quote .entry-title { 
  	padding-right: 25px; 
  	padding-top: 5px;
	display: block;
}

.entry-title, .entry-title a:hover {
	color: #20050E;
	font-size: 28px;
	line-height: 30px;
}

.singular .entry-title {
	color: #20050E;
	font-size: 40px;
	line-height: 44px;
}

.singular.page .entry-title {
	color: #20050E;
	font-size: 38px;
	padding: 0 0 25px 0
}

.entry-content h3, .comment-content h3 {
	font-size: 18px;
	color: #7A7A7A;
	text-transform: none;
	line-height: 1.3em;
	margin-bottom: 1em;
}

.singular .entry-content h3, .singular .comment-content h3 {
	font-size: 22px;
}

.byline {
	font-style: italic;
	letter-spacing: 0.4em;
	font-family: georgia;
	line-height: 2em;
	font-size: 15px;
	margin-bottom: 1.3em
}

.entry-content img, .comment-content img, .widget img,
img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img {
	max-width: 600px;
	padding: 8px 0 0 0;
	border: none
}

p img, .wp-caption {
	margin-top: 0;
}

.wp-caption {
	background: transparent;
	margin-bottom: 1.3em;
	padding: 0;
	position: relative
}

#featuredimage.wp-caption img 	{ margin: 0; max-width: none  !important }
.entry-content .wp-caption img 	{ margin: 0; max-width: 600px !important }

.wp-caption .wp-caption-text {
	margin-bottom: 0;
	padding: 5px;
	position: absolute;
	bottom: 10px;
	left: 10px;
	background: #000000;
	background: rgba(0, 0, 0, 0.6);
	line-height: 1em;
	color: white;
	font-family: helvetica
}

.wp-caption .wp-caption-text::before { display: none; }

.miniheading {
  	letter-spacing: 0.2em;
	background: #000;
	color: #fff;
	padding: 0.2em 0.5em;
 }

.countdown {
	width: 600px;
	height: 150px;
	margin-bottom: 1.3em;
}

.countdown span {
	font-size: 150px;
	margin-top: 65px;
	position: absolute;
	margin-left: 20px;
	color: #ff0;
	opacity: 0.6;
	font-weight: bold;
	letter-spacing: -10px;
}
  
blockquote {
	font-family: inherit;
	margin: 15px 50px;
	padding: 1em 10px 0.5em 10px;
}

.entry-content iframe, .entry-content .fve-video-wrapper { margin: 0 0 1.3em 0 !important; }

.entry-meta, .singular .entry-meta {
	color: #7A7A7A;
	font-size: 13px;
	border: none;
	margin-bottom: 1.3em; 
}

#content nav a {
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#nav-below {
  	border: none !important;
}

#disqus_thread { 
  	width: 940px;
}

.edit-link { display: none }
#nav-single, #nav-above { display: none }
#system-readmore { display: none }

/* PULLQUOTE */

div.pullquote {
	font-size: 1.6em;
	font-style: italic;
  	margin: 70px 0;
  	padding: 0 50px;
  	width: 200px;
}

div.pullquote p {
	color: #4394a6;
	width: 170px;
}

.pqRight { float: right }
.pqLeft { float: left }

.pqRight p {
  	text-align: left;
	padding: 0 0 40px 30px !important;
	border-left: 2px dashed #cbd2d6;
}

.pqLeft p {
	text-align: right;
	padding: 0 30px 40px 0 !important;
	border-right: 2px dashed #cbd2d6;
}

div.pullquote p:first-letter {
	text-transform: uppercase;
}

div.pullquote p em, div.pullquote p i {
	font-weight: bold;
}

/* SIDEBAR */

ins { background: #edeff4 }

.postdate, .singular .postdate {
	color: white;
	background: #006E8E url(images/bg-fog.jpg) no-repeat center;
	font-size: 18px;
	padding: 5px 10px;
	margin: 20px 0 15px 0;
	display: inline-block;
	font-style: italic
}

.singular .postdate { 
	margin: 20px 0 10px 30px;
}

#secondary {
	float: left;
	margin: 51px 30px 0 30px;
	width: 300px;
	line-height: 0
}

.singular #secondary { margin-top: 30px; }
.singular.page #secondary { margin-top: 49px; }

.widget { margin: 0 0 40px 0; }

.widget-title {
	color: #7A7A7A;
	font-size: 15px;
	font-weight: normal;
	font-style: italic;
	letter-spacing: 0.5em;
	line-height: 15px;
	text-transform: uppercase;
	padding: 0 0 6px 0;
	margin: 0 0 10px 0;
	border-bottom: #7A7A7A 1px dotted;
}

.widget ul {
	margin: 5px 0 0 0;
	text-transform: uppercase;
	line-height: 1em;
}

.widget ul li { 
	font-size: 11px;
	display: inline;
	margin-right: 10px;
	letter-spacing: 2px;
}

.widget a { font-weight: normal; }

div.shareaholic-canvas {
	position: absolute;
	left: 665px;
	bottom: -15px;
	width: 300px;
}

/* FOOTER */

#footer {
	background: #EBE8D5 url(images/bg2.jpg) no-repeat top center;
	color: #fff;
	width: 1000px;
	margin: 0 auto -30px auto;
	height: 200px;
	padding-top: 50px
}

#supplementary {
	border-top: none;
	padding: 0;
	overflow: visible;
}

#site-copyright {
	font-size: 11px;
	color: #cbd2d6;
	letter-spacing: 1px;
	padding: 0;
	margin: 0;
	position: absolute;
	bottom: 14px;
	left: 29px;
	width: 250px;
	height: 24px;
}

#footer .alanmoore { color: #20050E; position: relative; display: block; font-weight: bold }
#footer #line1 { font-size: 40px; left: 100px; width: 600px }
#footer #line2 { font-size: 20px; top: 11px; left: 260px; width: 600px }
#footer #line3 { font-size: 26px; top: 15px; left: 400px; width: 550px }
#footer #line4 { font-size: 26px; top: 35px; left: 700px; width: 200px }


/* MOBILE */

#mobile { padding: 0; width: 320px; background: none; }

#mobile #primary { width: 316px; }
#mobile.singular #primary { margin-top: 20px; }
#mobile #page { width: 316px; margin: 0 auto; overflow: hidden; padding-bottom: 10px; }

#mobile #page #branding #searchform { display: none; }
#mobile #page #searchform { margin: 8px 8px 10px 8px; }
#mobile #page #content #searchform { margin: 0; }
#mobile #page #searchform input#s { width: 260px; }

#mobile #branding #logo { padding: 8px; width: 300px; }
#mobile #branding #logo #site-title { width: 300px; height: 83px; background: url(images/artboiledmobile.png) no-repeat; }
#mobile #branding #site-description { font-size: 11px; }
#mobile #branding #followme { position: relative; top: 0; left: 8px; height: 35px; margin: 0; }
#mobile #menu-select { right: 0px; }

#mobile #content nav a { font-size: 13px }
#mobile .entry-title { padding-right: 0 }

#mobile.singular .postdate { left: 8px; }
#mobile.singular .filed-in { margin: 15px 0 0 10px; }
#mobile.singular #featuredimage { margin-top: 10px; }

#mobile #content, #mobile.singular #content, #mobile.error404 #primary #content {
	margin: 0 8px 0 8px; width: 300px;
}
#mobile .entry-header, #mobile .entry-content, #mobile footer.entry-meta, #mobile.singular .entry-header, #mobile.singular .entry-content, #mobile.singular footer.entry-meta {
	width: 300px;
}
#mobile .countdown {
	width: 300px;
	height: 75px;
	margin-bottom: 1.3em;
  	background-size: 300px 75px !important;
}
#mobile .countdown span {
	font-size: 75px;
	margin-top: 28px;
	position: absolute;
	margin-left: 5px;
	color: #ff0;
	opacity: 0.6;
	font-weight: bold;
	letter-spacing: -10px;
}
#mobile blockquote { margin: 15px 20px }
#mobile .pullquote { margin: 0 0 20px 0; width: 300px; }
#mobile #amzn_widget { display: none; margin-bottom: -20px; }
#mobile #disqus_thread { width: 300px }

#mobile .entry-content img, #mobile .entry-content .wp-caption img { max-width: 300px!important; height: auto; }

#mobile #featuredimage { width: 320px; margin: 0 }
#mobile #featuredimage img, 
#mobile #featuredimage embed, #mobile #featuredimage iframe, #mobile #featuredimage object { 
    width: 400px;
	margin-left: -50px;
}

#mobile .alignright, #mobile .alignleft { float: none; width: 300px; margin: 10px auto; }

#mobile #secondary { margin: 0px 8px 0 8px; width: 300px; }
#mobile .widget { margin: 0 0 25px 0 }

#mobile #secondary #text-3, #mobile #secondary #text-8 { display: none }

#mobile #site-copyright { 
	position: static; 
	margin: 0 10px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
}

#mobile #footer { width: 320px; margin: 0 auto -30px 0; overflow: hidden; padding-top: 20px; height: 300px }

#mobile #footer #line1 { left: 20px; font-size: 30px; width: 260px }
#mobile #footer #line2 { left: 40px; font-size: 20px; width: 270px }
#mobile #footer #line3 { left: 70px; font-size: 24px; width: 230px }
#mobile #footer #line4 { left: 160px; font-size: 24px; width: 150px }