/********************************************

AUTHOR:   http://www.ectomachine.com 
WEBSITE:  http://www.ectomachine.com/
TEMPLATE NAME:  ECTOMACHINE
DATE:    Apr-7th-2009

 *******************************************/ 

/********************************************
   HTML ELEMENTS
********************************************/ 

* { margin: 0; padding: 0px; outline: 0px;}
html, body { margin: 0; padding: 0px; height: 100%; background-color: #191919;}
ol {list-style: none;}

.clear { clear: both}

a:active, a:focus{outline: 0;}


#share {
clear:left;
float:left;
margin:20px 20px 20px 10px;
width:300px;
}
.addthis_counter.addthis_pill_style a.atc_s {background-color:#fd2c65;}
.addthis_counter.addthis_pill_style {background:none repeat scroll 0 0 #fd2c65;}



/* ----------TAG-------------- */
.tag { background: url(images/tag.png); width: 300px; height: 189px; position: absolute; text-indent: -999em; right: 0; top: 0; display: block;}


/* ----------Centered Container Or the Layout--------------------- */
#container { 
min-height: 80%; 
height: auto !important; 
height: 80%; 
margin: 0 auto 0em; /* make sure this matches in the body footer DIV */
width: 949px;
background-color: #0f0f0f;
border: 1px solid #383838;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: #4fc2f0;
padding: 4px 5px;
border: 1px solid #46a1c6;
}


/* --------------HEADER------------- */
#header { height: 138px; margin: 0 auto; width: 950px}


/* --------------TOPNAV------------- */
#topnav { width: 500px; text-align: left; float: right; margin-top: 100px; visibility: hidden}
#topnav ul { margin: 0px; padding: 0px;}
#topnav li, #footer li { display:inline; padding: 14px 0px 14px 40px;}
#topnav li a, #footer li a { color: #fafaf7; text-transform: uppercase; font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif; text-decoration: none}
#topnav li a:hover, #footer li a:hover { border-bottom: 1px dashed #ff0365}


/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap {
background-image: url('images/blog_logo.png');
background-repeat: no-repeat;
height: 138px;
width: 146px;
float: left
}

.logolink a { float: left;  }

.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------MAIN CONTENT-----------------------------------*/
#main { min-height: 100%; height: auto !important; height: 100%; padding: 34px 12px 34px 6px;}
#main .content, .about { padding: 0px; margin-left: 0px; margin-right: 338px;  }
#main .content p a { color: #ff0365; text-decoration: none   }
#main .content p a.sourcelink {border-bottom: 1px dashed; color: #ff0365 }
#main a img { border: none}
#main .line { background: url(images/line.gif) repeat-x; height: 6px; margin: 12px 0px 14px 0px  }
#main .linetwo { border: none; border-bottom: 1px dashed #525252; height: 0px; margin: 25px 0px 25px 8px; }
#main .linethree { border: none; border-bottom: 1px solid #383838; height: 0px; margin: 0px 0px 20px 8px; }


/* --------------BLOG SPECS-----------------------------------*/
#main p { font: 11px Lucida Sans, Helvetica, Arial, Sans-Serif; color: #bcbcbc; line-height: 20px;  padding-left: 8px; padding-bottom: 20px }
#main h1 a, #main h1 { font: bold 26px Arial, Helvetica, Sans-Serif; text-transform: uppercase; color: #fafaf7; text-decoration: none; margin-left: 5px; letter-spacing: -1px }
#main h1 a:hover { border-bottom: 1px dashed white}
#main strong {color: white; font-size: 13px}

#main h2 { font: bold 12px Arial, Helvetica, Sans-Serif; text-transform: uppercase; color: #ff0365; text-decoration: none; margin-left: 5px; margin-bottom: 8px; }

.postimg, #main a img.postimg { border: 8px solid #383838; padding: 0px; margin-bottom: 14px;}

/* -------------CODE SNIPPET-----------------------------------*/
#codesnippet { background-color: #191919; border: 1px dashed #383838; padding: 10px 10px 0px 10px; width: 550px; margin-left: 5px; margin-bottom: 20px; }
#codesnippet p { font-style: italic }


/* -------------PREVIOUS / NEXT LINKS-----------------------------------*/
span#previous_post_link a {width: 200px; height: 50px; display: block; margin: 0px 338px 48px 0px; float: right; background: url("images/newer.png") no-repeat 0px 0px;}
span#next_post_link a {width: 200px; height: 50px; display: block; margin: 0px 0px 48px 8px; float: left; background: url("images/older.png") no-repeat 0px 0px;}



/* --------------ABOUT US-----------------------------------*/

#main ul.about { margin: 10px 0px 24px 26px; }

#main ul.about li  {
list-style-type: none;
color: white;
font: 11px Lucida Sans, sans-serif;  line-height: 2em;
background: url(images/icon_x3.gif) no-repeat left top;
padding-left: 28px;
}

/* --------------BLOG POST INFO-----------------------------------*/
.post { margin-bottom: 42px; color: #ff0365; }
.post .date{ float: left; width: 200px; font: 11px Lucida Sans, Helvetica, Arial, Sans-Serif; text-transform: uppercase; padding-left: 8px; }
.post .name { background: url(images/icon_paper.gif) no-repeat; padding-left: 20px; float: right; font: 11px Lucida Sans, Helvetica, Arial, Sans-Serif; height: 16px; }
.post .name b { font-weight: normal; color: #fafaf7;}


/* --------------COMMENTS------------------------------------------*/
.comments { height: 40px; padding-left: 8px; margin-top: 5px }

.comments a, #comments .post .right a, #contact .post .right a { 
color: #fafaf7; 
float: left; 
padding: 12px; 
background-color: #ff0365; 
font: 14px Lucida Sans, Helvetica, Arial, Sans-Serif; 
text-transform: uppercase; 
text-decoration: none;
}

.comments a:hover, #comments .post .right a:hover, #contact .post .right a:hover { background-color: #383838;}

.comments .name { 
float: right; 
font: 14px Lucida Sans, Helvetica, Arial, Sans-Serif; 
padding: 12px 16px 12px 16px; color: #fafaf7;  
background: #191919 url(images/icon_comment.gif) no-repeat center left; 
padding-left: 38px; 
text-align: center; 
}

.oldarticles {float: left; margin-bottom: 25px; margin-left: 6px}
.newarticles {float: right; margin-right: 16px; margin-bottom: 25px;}


/* --------------POST A COMMENT-------------------------- */
#comments, #contact { margin-left: 8px; padding: 0px; }
#comments .head { margin-bottom: 22px; margin-top: 2px;}
#comments .post { background-color: #191919; border: 1px solid #383838; padding: 8px;  margin-bottom: 22px; height: 230px }

#comments .post .left, #contact .post .left { width: 47%; padding: 10px 10px 0px 0px; float: left;}
#comments .post .right, #contact .post .right { width: 47%; padding: 10px; float: right;}

#comments .post .hold, #contact .post .hold { margin: 0px; padding: 0px; height: 30px; margin-bottom: 22px;}

#comments .post .hold .text, #contact .post .hold .text {
width: 60px; float: left; font-size: 10px; padding: 12px 0px 0px 5px; font: 11px Lucida Sans, Helvetica, Arial, Sans-Serif; color: #fafaf7; text-transform: uppercase }

#comments .post .hold .text b, #contact .post .hold .text b { color: #ff0365}
#comments .post .hold .box, #contact .post .hold .box { float: right; }


#comments .input, #contact .input { 
background: url(images/searchbg.gif) repeat-x; 
height: 19px;
width: 18em;
float: left;
border: 1px solid #fff;
padding: 7px 5px 7px 10px;
font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif;
float: right;
margin-bottom: 0px;
color: #191919;
}


input[type="submit"].contact { 
color: #fafaf7; 
float: right;
border: none;
padding: 12px; 
background-color: #ff0365; 
font: 14px Lucida Sans, Helvetica, Arial, Sans-Serif; 
text-transform: uppercase; 
text-decoration: none;
cursor: pointer;
}


textarea { 
background: #a3a3a3 url(images/textareabg.gif) repeat-x; 
height: 126px;
width: 18em;
border: 1px solid #fff;
padding: 7px 5px 7px 10px;
font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif;
float: right;
margin-bottom: 20px;
color: #191919;
overflow: auto;
}



/* --------------COMMENTS LIST-------------------------- */

.list { border-top: 1px dashed #818181; padding: 20px 20px 0px 14px;  }
.listlast { border-top: 1px dashed #818181; border-bottom: 1px dashed #818181; padding: 20px 20px 20px 14px; }

.list h3, .listlast h3 { 
text-transform: uppercase; 
color: #bcbcbc; 
background: url(images/icon_bubble.gif) no-repeat top left; 
padding-left: 24px; 
font: bold 13px Lucida Sans, Helvetica, Arial, Sans-Serif;
}

.list h3 a {color: #ff0365; text-decoration: underline;}

.list h5, .listlast h5 { font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif; color: #606060; padding: 6px 0px 16px 0px }
.list p, .listlast p { color: #bcbcbc; padding: 0px; margin: 0px; }


/* --------------CONTACT-------------------------- */
#contact .post { background-color: #191919; border: 1px solid #383838; padding: 8px; margin-top: 20px;  margin-bottom: 22px; height: 100%; height: auto; min-height: 221px; }

h6 { 
padding-left: 19px; 
font: bold 13px Lucida Sans, sans-serif; 
font-style: normal; 
text-transform:uppercase; 
color:white; 
background: url(images/icon_plus.gif) no-repeat top left;
margin-left:10px;
margin-bottom: 8px;
}



/* --------------NAV RIGHT------------------------ */
#main .navright { float:right; width: 321px; margin: 0px; }
#main .navright .holder { background-color: #383838; padding: 12px; margin-bottom: 20px; }
#main .navright .line, .linetwos {background: url(images/rightline.gif) repeat-x; height: 2px; }
.linetwos { margin: 18px 0px 18px 0px }

/* --------------HEADS--------------------------*/
.searchhead { background: url(images/head_search.gif) no-repeat; height: 31px; margin-bottom: 8px }
.flickrhead { background: url(images/head_flickr.gif) no-repeat; height: 31px; margin-bottom: 8px }
.archiveshead { background: url(images/head_archives.gif) no-repeat; height: 31px; margin-bottom: 8px }


/* --------------ADS-------------------------- */

.ads { margin: 0px; padding: 0px;}
.ads img { margin-right:2px; } 

/* --------------SEARCH-------------------------- */
input[type="text"] { 
background: url(images/searchbg.gif) repeat-x; 
height: 40px;
width: 21em;
float: left;
border: 1px solid #2a2a2a;
padding: 2px 5px 0px 10px;
font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif;
}

.button { float: right; background: url(images/button_go.gif) repeat-x; height: 45px; width: 64px; border: 1px solid #3e3e3e; cursor: pointer;  }


/* --------------FLICKR-------------------------- */
.flickr { padding: 0px; margin: 0px;}
#imgholder { width: 98%}
#imgholder img { background-color: #0f0f0f; margin: 0px 5px 10px 5px; padding: 5px; border: 1px solid #5f5f5f}
.flickline {background: none}
.viewmore { border: 1px solid #3e3e3e; margin-top: 4px}


/* --------------ARCHIVES--------------------------*/
.archives { margin: 14px 10px 10px 4px; padding: 0px; line-height: 14px;}
.archives li { list-style-type: none; background: url(images/icon_arrow.gif) no-repeat left center; margin-bottom: 6px; padding-left: 16px; }
.archives li a { color: #fafaf7;  font: 10px Lucida Sans, Helvetica, Arial, Sans-Serif; text-decoration: none; }
.archives li a:hover { border-bottom: 1px dotted #fafaf7 }

/* --------------FOLLOW US--------------------------*/
#follow { margin-bottom: 30px;}
#follow .head {background: url(images/followbg.gif) repeat-x; height: 31px; padding: 8px 8px 4px 8px; }
#follow .hold { border: 1px solid #383838; padding: 8px; background-color: #0f0f0f}


/* ----------SOCIAL------------*/
#icons {margin: 4px 0px 0px 8px; padding: 0; width: 284px;}
ul#social { height:44px;list-style:none outside none; }
ul#social li { display:inline;}
ul#social li a { float:left; height:44px; text-indent:-9999px;}
 
ul#social li#twitter a {background:url("images/footer_social.png") no-repeat 0 0 transparent; width: 46px;}
ul#social li#twitter a:hover {background:url("images/footer_social.png") no-repeat 0 -44px transparent; width: 46px;}

ul#social li#facebook a {background:url("images/footer_social.png") no-repeat -46px 0px transparent; width: 48px;}
ul#social li#facebook a:hover {background:url("images/footer_social.png") no-repeat -46px -44px transparent; width: 48px;}

ul#social li#dribbble a {background:url("images/footer_social.png") no-repeat -94px 0px transparent; width: 49px;}
ul#social li#dribbble a:hover {background:url("images/footer_social.png") no-repeat -94px -44px transparent; width: 49px;}

ul#social li#forrst a {background:url("images/footer_social.png") no-repeat -143px 0px transparent; width: 48px;}
ul#social li#forrst a:hover {background:url("images/footer_social.png") no-repeat -143px -44px transparent; width: 48px;}

ul#social li#flickr a {background:url("images/footer_social.png") no-repeat -191px 0px transparent; width: 48px;}
ul#social li#flickr a:hover {background:url("images/footer_social.png") no-repeat -191px -44px transparent; width: 48px;}

ul#social li#rss a {background:url("images/footer_social.png") no-repeat -239px 0px transparent; width: 45px;}
ul#social li#rss a:hover {background:url("images/footer_social.png") no-repeat -239px -44px transparent; width: 45px;}
/* ----------/SOCIAL------------*/






/* --------------FOOTER------------- */
.clear { clear: both;}

#footer, .push { 
clear: both;
width: 950px;
height: 0em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer { height: 200px; height: auto;}
#footer .content { width: 950px; margin: 0 auto; position: relative; margin-top: 25px; padding-bottom: 80px}


/* --------------WORDPRESS------------- */
#wordpress { width: 400px; height: 50px; text-align: left; float: left;}
#wordpress img { position: absolute; border: none}
#wordpress b { color: #fafaf7; font-weight: normal}
#wordpress p { padding: 10px 0px 0px 60px; font: 11px Lucida Sans, Helvetica, Arial, Sans-Serif; color: #818181; text-transform: uppercase; line-height: 1.3em  }


/* --------------FOOTER LINKS------------- */
#footer .links { width: 400px; float: right; text-align: right; }
#footer ul { margin: 0px; padding: 0px;}