/*   
Theme Name:Everybody Can Design v4
Theme URI:http://www.everybodycandesign.com/
Description:WordPress theme with two columns, four widget areas and loads of jQuery functions (dropdown navigation, font resizing and more). The theme options include a movable sidebar, custom colours, excerpts on index pages, category or page navigation, different font and colour schemes. 
Author:Everybody
Author URI:http://www.everybodycandesign.com/
Version:4.0
Tags:two-columns, fixed-width, theme-options, custom-colors, blue, green, dark
*/

/*       ###############################
         BASIC TAGS
         ############################### */

* {margin:0px; padding:0px; }
body {font:normal 10px Helvetica; color:#666; background:url(img/ecd_bg_board_256.jpg) repeat; margin:0;}

h1 { font-size: 1.5em; padding-bottom:4px; padding-top: 5px; border-bottom:1px dotted #ccc; border-top:1px dotted #ccc; margin-bottom:16px;}
h1#notopline { font-size: 1.5em; padding-bottom:4px; margin-top: -8px; padding-top: 0px; border-top: none; border-bottom:1px dotted #ccc; margin-bottom:16px;}
h2 { font-size: 1.6em; padding-bottom:4px; padding-top: 4px; border-bottom:1px dotted #ccc; border-top:1px dotted #ccc; margin-bottom:16px;}
h2#magenta { color: #b8007d; }

h3 { font-size: 1.6em; padding-bottom:4px; padding-top: 4px; margin-bottom:16px; }
h4 { font-size: 1.1em; margin-bottom:16px; color: #b8007d;}
h5 { font-size: 1.0em; color:#666}
h6 { font-size: 1.1em; color: #b8007d;}

p {margin:0px;padding-bottom:8px; padding-top:8px; font-size: 1.1em; text-align: left;}
a {outline:none; text-decoration:none; color:#b8007d;}
a:hover {color:#b8007d;}
a img {border:none;}
ul { list-style-type: none; }
li { font-size: 1.1em; list-style-type: none; padding-bottom:4px;}
#blacklili li { font-size: 1.1em; list-style-type: none; padding-bottom:4px; color:#666; }
#blacklili a { font-size: 1.1em; list-style-type: none; padding-bottom:4px; color:#666; }
#blacklili a:hover { font-size: 1.1em; list-style-type: none; padding-bottom:4px; color:#666; }

/*       ###############################
         BASIC LAYOUT
         ############################### */
div#super {margin:0 auto;}
div#outline {width:1024px;}

div#top-bar {width:1024px; margin: 0px; padding:0px;}


div#content {clear:both; background:none; width:1024px; padding-left:28px; padding-right: 28px;margin:0px;}

div#wide {float:left;margin:0px; padding:0px; width:726px;}
div#small {float:right;margin:0px; padding:0px; width:242px;}

div#frontpage-spotlight-01 {margin:0px; padding:0px; width:726px; min-height:464px;background-image: url(img/front-page/frontpage-spotlight-01.png); background-repeat: no-repeat;}
div#frontpage-spotlight-02 {margin:0px; padding:0px; width:242px; min-height:464px;background-image: url(img/front-page/frontpage-spotlight-02.png); background-repeat: no-repeat;}

div#frontpage-widget-square-01 {margin:0px; padding:0px; width:242px;height:242px; vertical-align: middle; text-align:center;}
div#frontpage-widget-square-02 {margin:0px; padding:0px; width:242px;height:242px; vertical-align: middle; text-align:center;}
div#frontpage-widget-square-03 {margin:0px; padding:0px; width:242px;height:242px; vertical-align: middle; text-align:center;}
div#frontpage-widget-square-04 {margin:0px; padding:0px; width:242px;height:242px; vertical-align: middle; text-align:center;}
div#frontpage-spotlight-03 {margin:0px; padding:0px; width:242px; background-image: url(img/front-page/frontpage-spotlight-03.png); background-repeat: no-repeat;}
div#frontpage-spotlight-04 {margin:0px; padding:0px; width:726px; background-image: url(img/front-page/frontpage-spotlight-04.png); background-repeat: no-repeat;}




div#page-post {margin:0px; padding:0px; width:726px; min-height:464px;}
div#page-side {margin:0px; padding:0px; width:242px; min-height:464px;}
div#tear_01 {margin:0px; padding:0px; width:726px; height:50px; background-image: url(img/front-page/tear_01.png); background-repeat: no-repeat;}
div#tear_02 {margin:0px; padding:0px; width:726px; min-height:210px; background-image: url(img/front-page/tear_02.png); background-repeat: repeat-y;}
div#tear_03 {margin:0px; padding:0px; width:726px; height:64px; background-image: url(img/front-page/tear_03.png); background-repeat: no-repeat;}

div#tear_01_small {margin:0px; padding:0px; width:242px; height:50px; background-image: url(img/front-page/tear_small_01.png); background-repeat: no-repeat;}
div#tear_02_small {margin:0px; padding:0px; width:242px; min-height:210px; background-image: url(img/front-page/tear_small_02.png); background-repeat: repeat-y;}
div#tear_03_small {margin:0px; padding:0px; width:242px; height:64px; background-image: url(img/front-page/tear_small_03.png); background-repeat: no-repeat;}

div#tear_small_pin_01 {margin:0px; padding:0px; width:242px; height:64px; background-image: url(img/front-page/tear_small_pin_01.png); background-repeat: no-repeat;}
div#tear_small_pin_02 {margin:0px; padding:0px; width:242px; min-height:373px; background-image: url(img/front-page/tear_small_pin_02.png); background-repeat: repeat-y;}
div#tear_small_pin_03 {margin:0px; padding:0px; width:242px; height:26px; background-image: url(img/front-page/tear_small_pin_03.png); background-repeat: no-repeat;}

div#flickr_sidebar_01 {margin:0px; padding:0px; width:210px; height:64px; background-image: url(img/flickrfeed/flickr_sidebar_01.png); background-repeat: no-repeat;}
div#flickr_sidebar_02 {margin:0px; padding:0px; width:210px; min-height:128px; background-image: url(img/flickrfeed/flickr_sidebar_02.png); background-repeat: repeat-y;}
div#flickr_sidebar_03 {margin:0px; padding:0px; width:210px; height:40px; background-image: url(img/flickrfeed/flickr_sidebar_03.png); background-repeat: no-repeat;}







div#navigation {padding-top:24px;padding-bottom:24px;}

div#footer_legal {margin:0px;width:726px; padding-left: 0px; padding-right: 0px; padding-top:64px; padding-bottom:24px; text-align:center;}
div#footer_legal a { color:#666; }

p#toggle-all {float:right; width:100px; margin:0; padding:0;}

div.headline {margin:40px 0 0 20px;}
div.excerpt {padding:0 0 5px 0; border-bottom:dotted 1px #ccc; margin:0 0 0 20px;}


div.preview {float:right; background:url(img/preview.png) no-repeat; margin:15px 0 0 0;}
div.preview a {display:block; width:20px; height:20px; color:#b8007d !important; font:normal 14px Verdana, serif;}

div.bookmarks {text-align:right; float:right;}




#twitterfeed { width: 206px;}
#twitterfeed .twit {display: block; margin-bottom: 12px;padding:0px; font-size: 1.2em;}
#twitterfeed .caption {font-size: 0.8em; color: #b8007d; border-top:1px dotted #ccc;}
#twitterfeed a {outline:none; text-decoration:none; color:#bbbbbb;}
#twitterfeed a:hover {color:#bbbbbb;}
#twitterfeed a.embeddedurl {outline:none; text-decoration:none; color:#bbbbbb;}
#twitterfeed a.embeddedurl:hover {outline:none; text-decoration:none; color:#bbbbbb;}
.twittercomment-color1 { background-color: #ffffff; }
.twittercomment-color2 { background-color: #ffffff; }




/*       ###############################
         WIDGETS
         ############################### */

.widget {padding:0px;margin:0px;}
div.widget h4 {border-bottom:1px dotted #ccc; }

div.widget h4 {font-size:130%; margin:0; padding:0 0 3px 0;}
div.widget a {display:block; padding:5px 0px; color:#b8007d;}
div.widget a:hover {color:#b8007d; text-decoration:underline;}
div.widget li {padding:0 0 0 5px; margin:0; border-bottom:1px dotted #ccc;}
div.widget li li {padding:0 0 0 20px; margin:0; background:none; border-top:none; border-bottom:none;}

div#tag_cloud a {display:inline;}
div#tag_cloud {min-height:130px;}
div#archives {min-height:130px;}

.textwidget, .textwidget a {font: italic 120% Georgia, serif !important;}
.textwidget p {margin: 0; padding: 0;}

/*calendar*/
table#wp-calendar {margin:0 0 10px 0; border-collapse:collapse; text-align:center; font-size:14px;}
table#wp-calendar a {font:normal 14px Verdana;}
table#wp-calendar caption {padding:0 0 5px 0;}
table#wp-calendar th {font:bold 14px Verdana;}
table#wp-calendar th, td {width:30px; height:30px;}




/*       ###############################
         TEXT
         ############################### */

div#blog-line h1 a {color:#b8007d;}
div#blog-line h1 {padding:20px 0; margin:0; color:#b8007d;}

div#post-meta {text-align:right; border-bottom:1px dotted #ccc; padding-bottom:16px;}
h2#post-heading {color:#b8007d;}
h3#archive-title {color:#b8007d; font-size: 1.4em;}

div#previous-post { float:left;}
div#next-post { float:right;}


p#toggle-all a {display:block; width:80px; height:20px; padding:0 0 0 30px !important;}
a.show-all {background:url(img/toggle.png) no-repeat;}
a.hide-all {background:url(img/toggle.png) 0px -20px no-repeat;}

div#social-container {float:right;margin-top:0px;margin-right:32px; padding:0px;}
.social-icon {margin:0px;padding:1px;}

.category-link {background:url(img/page.png) no-repeat;}
.comment-link {background:url(img/comments.png) no-repeat;}
.tag-link {background:url(img/tag-blue.png) no-repeat;}
.user-name {background:url(img/user-green.png) no-repeat;}
.user-mail {background:url(img/email.png) no-repeat;}
.user-url {background:url(img/world-edit.png) no-repeat;}
.user-comment {background:url(img/comment-add.png) no-repeat;}
.info-icon {padding:3px 0 3px 20px; margin:0; background-position:0px 4px;}
 
.clear {clear:both;}

code {font:normal 120% Courier, serif;}

/*      ##################################
           COMMENTS
        ################################## */

.comment-color1 { background-color: #E0E0E0; }
.comment-color2 { background-color: #EEEEEE; }

div.comment {border-bottom:1px dotted #ccc;}
p.comment-details {}
.avatar {float:left;border:5px solid #eee;-moz-border-radius:5px;-webkit-border-radius: 5px;}
div.comment-text {}
div.author-comment {background: #f9fbc1;-moz-border-radius:5px;-webkit-border-radius:5px; padding: 10px !important; border:1px solid #f1f1f1;}

h2#comment-header {padding-bottom:4px; padding-top: 4px; border-bottom:1px dotted #ccc; }
h2#respond {margin:40px 0 10px 0 !important;}
h3#no-comments {font:italic bold 110% Georgia, serif !important; color:#666 !important;}

/*        ##################################
           FORMS
        ################################## */

label {display:block; margin:0 0 5px 0;}
.text {width:350px; margin:0 0 10px 0; padding:5px; background:url(img/bg-form-text.gif) repeat-x left top #fff; border:1px solid #ccc;}
textarea {width:450px; height:150px; margin:0; padding:5px; background:url(img/bg-form-text.gif) repeat-x left top #fff; border:1px solid #ccc; -moz-border-radius:5px;}
.submit {width:auto; padding:5px 20px; margin:5px 0; color:#fff; background:#333; border:1px solid #333; -moz-border-radius:5px;-webkit-border-radius: 5px;}
input {-moz-border-radius:5px;-webkit-border-radius: 5px; margin:0 5px 0 0;}

/*        ##################################
           SEARCHFORM
        ################################## */

input#search {width:150px; padding:5px; background:url(img/bg-form-text.gif) repeat-x left top; border:1px solid #ccc;}
#search-submit {padding:5px; color:#fff; background:#333; border:none;}
div#left div#searchform {padding: 0 0 0 20px;}
p.not-found {padding: 0 0 0 20px; margin:0;}

/*        ##################################
           WORDPRESS CSS
        ################################## */

img.alignright {float:right; margin:0 0 20px 20px;}
img.alignleft {float:left; margin:0 20px 20px 0;}
img.aligncenter {display:block; margin-left:auto; margin-right:auto;}
a img.alignright {float:right; margin:0 0 20px 20px;}
a img.alignleft {float:left; margin:0 20px 20px 0;}
a img.aligncenter {display:block; margin-left:auto; margin-right:auto;}

.aligncenter, div.aligncenter {display:block; margin-left:auto; margin-right:auto;}
.alignleft {float:left;}
.alignright {float:right;}

.wp-caption {border:1px solid #ddd; text-align:center; background-color:#f3f3f3; padding-top:4px; margin:10px;}
.wp-caption img {margin:0;padding:0;border:0 none;}
.wp-caption p.wp-caption-text {font-size:110%; line-height:17px; padding:0 4px 5px; margin:0;}


/*       ###############################
         CLEARFIX
         ############################### */

.clearfix:after {content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0;}
.clearfix {display:inline-block;}
html[xmlns] .clearfix {display:block;}
* html .clearfix {height:1%;}
.clear {clear:both;}
