/*
Theme Name: The Answer
Theme URI: http://helterskelter.in/
Description: Custom-built theme for Helter Skelter Magazine.
Version: 1.0
Author: Arun Kale
Author URI: http://helterskelter.in/
*/

@import "reset.css";
@import url(http://fonts.googleapis.com/css?family=Lato:900,400,400italic);
@import url(http://fonts.googleapis.com/css?family=Muli:400,400italic);

/* =GENERIC
   ----------------------------------------------------*/
body { height: 100%; text-align: center; font: 400 11px "adelle-1","adelle-2", Georgia, serif; color: #666; margin: 0; }
a { outline: none; color: #000; text-decoration: none; }
a:hover { color: #f96148; }
a img { outline: none; text-decoration: none; border: 0; }

/* =CONTAINER
   ----------------------------------------------------*/
#container { height: 100%; min-height: 100%; text-align: left; width: 1000px; margin: 0 auto; }
#mother { width: 1000px; float: left; margin: 0; }

/* =SIDEBAR
   ----------------------------------------------------*/

#sidebar { width: 215px; float: left; margin: 0 0 50px 0; }
#logo { width: 215px; height: 277px; float: left; position: relative; margin: 0 0 16px 0; background: url(images/hs-logo.jpg) top left; }
#logo a { width: 215px; height: 112px; display: block; position: absolute; top: 61px; left: 0px; }
#nav { width: 194px; margin: 0 0 0 21px; height: 12px; background: url(images/nav-back.jpg) top left no-repeat; float: left; }
#nav a { display: block; height: 12px; background: none; float: left; }
#nav a.home { width: 37px; margin: 0 15px 0 0; }
#nav a.home:hover { width: 37px; background: url(images/nav-home-1.jpg) top left no-repeat; }
#nav a.issues { width: 40px; margin: 0 14px 0 0; }
#nav a.issues:hover { width: 40px; background: url(images/nav-issues-1.jpg) top left no-repeat; }
#nav a.about { width: 42px; }
#nav a.about:hover { width: 42px; background: url(images/nav-about-1.jpg) top left no-repeat; }
#search { width: 215px; margin: 16px 0 0 16px; float: left; }
input.box1 { width: 157px; height: 16px; border: 1px solid #dfdfdf; text-align: center; padding: 4px 0; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #069eb7; }
input.box1:focus { outline: none; }

#noise-side { width: 160px; float: left; padding: 12px 16px; margin: 32px 0 0 0; background: url(images/stripe2.png) top left repeat; }
.noisetitle { width: 160px; height: 20px; float: left; margin: 0; }
.noiseimg { width: 158px; height: 58px; border: 1px solid #d1d1d1; float: left; margin: 7px 0 0 0; }
.noisetxt { width: 160px; background: #fff; margin: 7px 0 0 0; line-height: 19px; float: left; font: 400 11px "Lato","adelle-1","adelle-2", Georgia, serif; color: #111; line-height: 18px; }
.noisetxt a { color: #069eb7; font-weight: bold; }
.noisetxt a:hover { color: #000; }
.noisetxt a:active { position: relative; top: 1px; }

/* older -> .noisetxt { width: 160px; background: #fff; margin: 7px 0 0 0; line-height: 19px; float: left; font: 400 11px "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #111; line-height: 18px; }
.noisetxt a { color: #069eb7; font-weight: bold; }
.noisetxt a:hover { color: #000; }
.noisetxt a:active { position: relative; top: 1px; } */
.noisemore1 { width: 87px; float: left; height: 16px; padding: 7px 0 0 73px; }

#side-pop { width: 192px; float: left; margin: 24px 0 14px 0; background: url(images/head-pop.jpg) no-repeat top left; }
ol.sidepop { margin: 36px 0 0 32px; list-style-type:decimal; }
ol.sidepop li { padding: 0 0 11px 0; font: 700 18px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #d3d3d3; line-height: 7px; }
ol.sidepop li a { color: #069eb7; font-weight: bold; }
ol.sidepop li a:hover { color: #000; }
ol.sidepop li a:active { position: relative; top: 1px; }
ol.sidepop li .sidepoplink { width: 160px; font: 700 13px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; margin: 0 0 2px 0; }
ol.sidepop li .sidepoptxt { width: 160px; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #666; line-height: 16px; }

#side-book { width: 192px; float: left; margin: 0 0 27px 0; padding: 37px 0 0 0; background: url(images/head-community.jpg) no-repeat top left; }

.contest-side { width: 190px; height: 225px; border: 1px solid #bbb; float: left; margin: 32px 0 0 0; }
.contest-side2 { width: 192px; height: 147px; float: left; margin: 32px 0 0 0; }

.adtall { width: 160px; float: left; padding: 16px 16px; margin: 0; background: url(images/stripe2.png) top left repeat; }


/* =MAIN COLUMN
   ----------------------------------------------------*/
#main { width: 767px; float: left; margin: 0 0 0 18px; }
#main2 { width: 767px; float: left; margin: 0 0 50px 18px; }
#blankhead { width: 767px; height: 169px; position: relative; float: left; background: url(images/firsthead.jpg) top left no-repeat;  }
#blankhead_in { width: 767px; height: 159px; position: relative; float: left; background: url(images/firsthead.jpg) top left no-repeat; }
#magindex { width: 767px; float: left; }
#cover { width: 360px; height: 500px; padding: 12px; background: #000; float: left; }
#index { width: 353px; height: 524px; margin: 0 0 0 30px; float: left; position: relative; }
#index .issuemore { width: 353px; height: 15px; position: absolute; bottom: 0px; right: 0px; }
h2.index { margin: 0 0 23px 0; padding: 0; width: 353px; height: 13px; background: url(images/head-contents.jpg) top left no-repeat; }
h3 { font: 400 16px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #000; margin: 0 0 5px 0; padding: 0; }
#index h3 a:active { position: relative; top: 1px; }
.story { width: 353px; float: left; margin: 0 0 20px 0; }
.excerpt_home { width: 353px; float: left; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #555; line-height: 18px; }
.byline_home { font: 400 10px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; line-height: 18px; text-transform: uppercase; letter-spacing: 0.1em; }

.contentblock { width: 767px; float: left; margin: 0 0 20px 0; }
.contentblock2 { width: 537px; float: left; margin: 0 0 20px 0; }
.contenttitle { width: 767px; height: 20px; float: left; margin: 0 0 20px 0; }
.article_title { width: 767px; margin: 0; font: 900 36px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #555; line-height: 43px; }
.article_title2 { width: 767px; margin: 0; font: 700 23px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #727272; }
.article_title3 { width: 537px; margin: 2px 230px 20px 0; font: 900 23px "Lato","crete-rounded-web-1","crete-rounded-web-2", Georgia, serif; color: #069eb7; }
.article_title4 { width: 537px; margin: 0 230px 5px 0; font: 700 23px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #727272; }
.article_title4 a:active, .article_title2 a:active { position: relative; top: 1px; }
.contentblock p, .contentblock2 p { margin: 19px 230px 0 0; font: 400 14px "Lato", "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #1f1f1f; line-height: 27px; }
.contentblock p a, .contentblock2 p a { border-bottom: 1px solid #dfdfdf; color: #f96148; }
.contentblock p a:hover, .contentblock2 p a:hover { color: #000; }
.contentblock p a:active, .contentblock2 p a:active { position: relative; top: 1px; }
.bigtext, .bigtext2 { font: 400 18px "Muli","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; line-height: 32px; }
.bigtext2 { margin: 19px 0 0 0; color: #1f1f1f; }
.bigtext2 a { border-bottom: 1px solid #dfdfdf; color: #f96148; }
.bigtext2 a:hover { color: #000; }
.bigtext2 a:active { position: relative; top: 1px; }
.smallcap { font: 400 12px Georgia, serif; text-transform: uppercase; }
.imgright { width: 200px; float: right; margin: 25px 0 20px 30px; line-height: 19px; clear: both; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgright2 { width: 450px; float: right; margin: 25px 0 20px 30px; line-height: 21px; clear: both; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgright4 { width: 450px; float: right; margin: 25px 0 20px 30px; line-height: 19px; clear: both; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgright3 { width: 200px; float: right; margin: 0 0 20px 30px; line-height: 19px; clear: both; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgfull { width: 767px; margin: 25px 0 20px 0; line-height: 19px; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgfull2 { width: 767px; margin: 25px 0 30px 0; }
.imgmed { width: 535px; float: left; margin: 0 0 10px 0; }
.imgmed2 { width: 535px; float: left; margin: 30px 0 30px 0; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgmed3 { width: 535px; float: left; margin: 30px 0; font: 400 12px "Lato","adelle-1","adelle-2", Georgia, serif; color: #666; }
.imgright img, .imgfull img, .imgright2 img, .imgmed img, .imgmed2 img { margin: 0 0 10px 0; border: 1px solid #aaa; }
.contentblock p.para:first-line { font-variant:small-caps; font-size:15px; display:inline !important; }
.byline_article { width: 200px; float: right; margin: 22px 0 0 0; text-transform: uppercase; letter-spacing: 0.1em; line-height: 20px !important; font: 400 11px "Lato", "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; }
.byline_article2 { width: 200px; float: right; margin: 57px 0 0 0; text-transform: uppercase; letter-spacing: 0.1em; line-height: 30px; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; }
.byline_article2 a { color: #f96148; }
.byline_article2 a:hover { color: #000; }
.byline_article2 a:active { position: relative; top: 1px; }
.name { display: block; margin: 5px 0 0 0; padding: 0; color: #069eb7; }
.article_discuss { width: 200px; height: 65px; margin: 0; float: left; }
.article_discuss2 { width: 537px; height: 16px; margin: 5px 0 0 0; background: url(images/article-discuss.jpg) top left no-repeat; }
a.artweet { width: 17px; height: 16px; display: block; float: left; margin: 0 9px 0 0; }
a.artweet:hover { background: url(images/article-tweet.jpg) top left no-repeat; }
a.artalk { width: 16px; height: 16px; display: block; float: left; margin: 0; }
a.artalk:hover { background: url(images/article-comment.jpg) top left no-repeat; }
#sharethis { /*padding: 15px 0 8px 0; border-top: 1px dashed #aaa; border-bottom: 1px dashed #aaa;*/ }
.shareblock { width: 55px; float: left; margin: 0 12px 0 0; }
.pullquote { width: 537px; margin: 20px 230px 0 0; background: url(images/stripe2.jpg) top left repeat; font: 400 27px "Lato","crete-rounded-web-1","crete-rounded-web-2", Georgia, sans-serif; line-height: 37px; color: #069eb7; }
.taxonomy { width: 765px; margin: 20px 2px 0 0; font: 400 11px "Lato", "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; text-transform: uppercase; letter-spacing: 0.1em; line-height: 20px; }
.taxonomy a { color: #f96148; }
.taxonomy a:hover { color: #000; }
.taxonomy a:active { position: relative; top: 1px; }
.taxonomy2 { width: 537px; margin: 20px 2px 0 0; font: 400 11px "Lato", "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; text-transform: uppercase; letter-spacing: 0.1em; line-height: 20px; }
.taxonomy2 a { color: #f96148; }
.taxonomy2 a:hover { color: #000; }
.taxonomy2 a:active { position: relative; top: 1px; }

.bio { width: 537px; margin: 30px 230px 0 0; font: 400 14px "Lato", "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; line-height: 27px; color:#666; font-style: italic; }
h3.subs { width: 537px; margin: 27px 230px 0 0; font: 400 27px "Lato","crete-rounded-web-1","crete-rounded-web-2", Georgia, serif; /*height: 27px; display: block;*/ color: #727272; }
.archive_exc { width: 537px; margin: 7px 0 25px 0; font: 400 14px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #1f1f1f; line-height: 24px; }
.archive_issue { width: 537px; font: 400 14px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #1f1f1f; line-height: 24px; }
.archive_issue2 { width: 537px; font: 400 14px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #1f1f1f; line-height: 24px; }
.byline_arch { font: 400 12px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #666; line-height: 24px; text-transform: uppercase; letter-spacing: 0.1em; }
#issuebox { width: 537px; float: left; }
.story_issue { width: 537px; float: left; margin: 0 0 20px 0; padding: 0 0 20px 0; border-bottom: 1px dashed #aaa; }
.navigation { width: 537px; float: left; margin: 30px 230px 0 0; font: 400 11px "Lato",Georgia, serif; text-transform: uppercase; letter-spacing: 0.1em; }

#comments { width: 537px; float: left; margin: 40px 230px 0 0; font-family: "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; font-size: 14px; line-height: 27px; color: #1f1f1f; }
h3.talk { display: block; width: 537px; height: 40px; background: url(images/wasitgood.jpg) top left no-repeat; }
h3.eic { display: block; width: 200px; height: 16px; margin: 0 0 20px 0; background: url(images/eic.jpg) top left no-repeat; }
h3.assoc { display: block; width: 200px; height: 16px; margin: 0 0 20px 0; background: url(images/assoc.jpg) top left no-repeat; }
h3.contrib { display: block; width: 200px; height: 16px; margin: 0 0 20px 0; background: url(images/contrib.jpg) top left no-repeat; }

.gallery { width: 767px; margin: 25px 0 10px 0 !important; }
.gallery-item { width: 133px !important; height: 133px; margin: 0 20px 14px 0 !important; border: 0; }
.gallery-icon { width: 133px; height: 133px; }
.gallery-icon a img { border: 3px solid #000 !important; }
.gallery-icon a:hover img { border: 3px solid #f96148 !important; }

.lglassc { width: 750px; background: #000 url(images/head-looking.jpg) no-repeat top left; padding: 20px 8px 8px 9px; margin: 30px 0; position: relative; }
.lglasstitle { width: 500px; height: 12px; position: absolute; top: 12px; left: 250px; color: #ccc; font-size: 11px; text-align: right; }
.lglassc img.vert { margin: 0 0 0 125px; }

#ymal { width: 624px; float: left; padding: 0 0 0 143px; background: url(images/ymal.jpg) no-repeat top left; border-top: 1px dashed #666; border-bottom: 1px dashed #666; margin: 30px 0 0 0; }
.ymalblock { width: 178px; float: left; margin: 0; padding: 12px 0 16px 30px; background: #fff; }
.ymaltitle { width: 178px; float: left; font: 900 15px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; margin: 0; }
.ymaltitle a { color: #069eb7; font-weight: bold; }
.ymaltitle a:hover { color: #000; }
.ymaltitle a:active { position: relative; top: 1px; }
.ymalmeta { width: 178px; float: left; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; margin: 5px 0 0 0; }
.ymalexc { width: 178px; float: left; margin: 5px 0 0 0; }
.ymalexc p {  font: 400 13px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; line-height: 21px; margin: 0; }

/* =NEW WRITING + CONTEST + AD
   ----------------------------------------------------*/
#nwhome { width: 1000px; float: left; padding: 0; margin: 40px 0 0 0; }
#nwhome-announce { width: 430px; height: 270px; float: left; }
#nwhome-contest { width: 200px; height: 270px; float: left; margin: 0; }
#nwhome-adv { width: 300px; height: 250px; padding: 10px; float: left; background: url(images/stripe2.png) top left repeat; margin: 0 25px;  }

/* =NOISE AREA
   ----------------------------------------------------*/
#noisearea { width: 1000px; float: left; padding: 0 0 30px 0; margin: 30px 0 0 0; }
#thetap { width: 300px; float: left; }
h2.thetap { width: 300px; height: 11px; margin: 0 0 18px 0; background: url(images/head-the-tap.jpg) top left no-repeat; }
h2.thetap2 { width: 255px; height: 11px; margin: 0 0 18px 0; background: url(images/head-tap2.jpg) top left no-repeat; }
h2.testimonial { width: 255px; height: 11px; margin: 0 0 18px 0; background: url(images/head-testimon.jpg) top left no-repeat; }
h2.ack { width: 255px; height: 11px; margin: 0 0 18px 0; background: url(images/head-ack.jpg) top left no-repeat; }
#thetap img.comic, .comicfooter img.comic, .comicfooter2 img.comic { border: 1px solid #bbb; margin: 0 0 16px 0; float: left; }
.stripmore { width: 255px; height: 21px; float: left; }
.stripmore a:active img { position: relative; top: 1px; }
.noisemore { width: 318px; height: 21px; float: left; }
.noisemore a:active img { position: relative; top: 1px; }
#newnoise { width: 318px; float: left; margin: 0 30px; position: relative; }
#noise { width: 318px; height: 212px; float: left; margin: 0 0 31px 0; }
.noiselet { width: 318px; float: left; margin: 18px 0 0 0; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; color: #666; line-height: 20px; }
.noiselet a { text-transform: uppercase; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; letter-spacing: 0.1em; color: #000; }
.noiselet a:hover { color: #f96148; }
.noiselet a:active { position: relative; top: 1px; }
h2.newnoise { width: 318px; height: 11px; margin: 0; padding: 0; background: url(images/head-noise.jpg) -1px 0px no-repeat; }
#squaread { width: 300px; height: 250px; float: left; padding: 10px; background: url(images/stripe.png) top left; }

#lglasshome { width: 418px; height: 250px; padding: 10px; background: #000; float: left; margin: 0 30px; position: relative; }
.lglasshead { width: 145px; height: 27px; position: absolute; top: 10px; left: 10px; }
.lglassview { width: 161px; height: 17px; position: absolute; top: 243px; left: 267px; }
#lglasshome img { float: left; }

#contestblock { width: 200px; height: 270px; float: left; }
.cont1 { width: 200px; height: 80px; margin: 0 0 15px 0; float: left; }
.cont2 { width: 200px; height: 80px; margin: 0; float: left; }

.comicfooter { width: 255px; float: left; margin: 0 30px; }
.comicfooter2 { width: 255px; float: left; margin: 0; }
.contestfooter { width: 200px; height: 270px; float: left; margin: 0 26px 0 0; }
.contestfooter { border: 1px solid #bbb; float: left; }


/* =FOOTER
   ----------------------------------------------------*/
#footer1 { width: 1000px; float: left; padding: 10px 0; border-top: 1px dashed #aaa; }
.writething { margin: 10px 0 0 0; }
#footer2 { width: 976px; float: left; padding: 10px 12px; font: 400 11px "Lato","ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, serif; background: #000; text-transform: uppercase; letter-spacing: 0.1em; color: #aaa; line-height: 19px; }
.social { width: 78px; float: right; line-height: 1em; margin: 1px 0 0 0; }
.social a { margin: 0 9px 0 0; }
.footlinks { width: 270px; float: right; margin: 0 12px 0 0; }
.footlinks a { color: #f6d47a; margin: 0 0 0 10px; }
.footlinks a:active { position: relative; top: 1px; }
.footlinks a:hover { color: #f6d47a; }
.none { display: none; }


/* =MISCELLANEOUS
   ----------------------------------------------------*/
h2 span, .none, h3 span { display: none; }
.floatLeft { float: left; }
.alignLeft { text-align: left; }
.floatRight { float: right; }
.alignRight { text-align: right; }
.lowborder { border-bottom: 1px solid #ddd; padding: 0 0 30px 0; }
.smallcaps { font: 400 11px Georgia, serif; text-transform: uppercase; letter-spacing: 0.1em; }
.normal { font-style: normal; }
.clear { clear: both; }
.orangescaps { color: #069eb7; text-transform: uppercase; font-size: 11px; letter-spacing: 0.1em; }
img#wpstats { display:none; }