/*
Theme Name: K5-Design.com
Theme URI: http://www.k5-design.com
Description: Wordpress theme for K5-Design.com, portfolio site for freelance Web designer and developer Kris Stokes
Version: 1.0
Author: Kris Stokes
Author URI: http://www.k5-design.com
Tags: affordable Web design, custom Web design, Chicago, Kris Stokes, Web designer Chicago
*/

/* General Formatting */
* { margin: 0; padding: 0; /*border: solid #F00 thin;*/ }

#clear-fix { clear:both; }
.clear-fix { clear:both; }
.strikethrough { text-decoration: line-through; color:#999999; }
.right { float:right; }
.left { float:left; }
#main a.no-underline, #main img.no-underline { text-decoration:none; border:none; margin:0; padding:0; }
#main a.breadcrumb, #main a.breadcrumb:visited { letter-spacing: -1.5px; margin-bottom: 5px; color:#ccc; border-bottom: 2px dotted #ccc; }

a { text-decoration:none; }

#main a { padding-bottom:2px; border-bottom:dotted #222222 3px; color:#222222; }
#main a:hover, #main a:visited:hover { color:#ff0d00; border-bottom:dotted #ff0d00 3px; }
#main a:hover span { cursor: pointer }
#main a:active { position: relative; top: 1px; }
#main a:visited { color:#666; }

body { background: #F3F3F3 url(Images/top-line-oct2010.jpg) repeat-x scroll center top;
color:#222222;
font-family: Arial, Helvetica, sans-serif;
font-size: 50%;  }

#wrapper { width:1050px; margin: 0 auto 60px; }

h3 { color:#015c65; font-weight: normal; font-size: 4em; letter-spacing: -3px; margin-bottom: 20px; }
h4 { font-weight: normal; font-size: 4em; letter-spacing: -3px; margin-bottom: 20px; }
h5 { font-weight: normal; text-transform: uppercase; font-size: 2em; letter-spacing: -1.5px; margin-bottom: 7.5px; color:#ccc; }

/* Header */
#header { margin-bottom: 40px; background:url(Images/K5-logo.png) no-repeat scroll 700px 0px; height:220px; }
#header h1 { margin-top: 72px; font-weight: normal; font-size: 7.5em; letter-spacing: -5px; }
#header h1 a { text-decoration:none; border:none; color:#222222; }
#header h1 a:hover { color:#222222; padding-bottom:2px; border-bottom:dotted #222222 5px; }
#header h1 a:visited { color:#222222 }

/* Navigation Menu */
#menu { font-size: 2em; text-transform:uppercase; text-shadow:.5px .5px 1px #666666; margin-left: 80px; height: 70px; }
#menu ul { list-style:none; display:block; }
#menu li { display:inline; float:left; text-align:center; }
#menu a { border:none; display:block; padding:45px 20px 10px 20px; color:#222222; }
#menu li a:hover, #menu li a:visited:hover { color:#f3f3f3; background:#ff0d00; opacity:.75; text-shadow:none; }
#menu .current_page_item a { color:#f3f3f3; background:#fe4c43; opacity:.75; text-shadow:none; } 

/* Main */
#main { overflow: auto; min-height: 500px; height:auto !important; height: 500px; }
#main p, #main ul.body { color:#555; font-size: 2em; letter-spacing: 0px; line-height: 1.5em; margin: 0 250px 20px 80px;  }
#main p.space { margin-bottom: 40px; }
#main img { padding: 0 0 10px 10px; margin-top:-15px; border:none; }
img.right { float: right; margin-right: 100px; }
#main li { list-style-position:outside; padding-bottom: 10px; }
#post-54, #post-56, #post-58 { margin-bottom: 20px; }

/* Anything Slider */
/*
	By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/
	*/
#slideshow { margin-bottom: 40px; }
#slideshow a, #slideshow a:hover { border:none; }
#slideshow img { border:none; margin:0; padding:0; float:left; }

.anythingSlider { width: 940px; height: 280px; position: relative; margin: 0 0 20px 40px; }
.anythingSlider .wrapper { width: 860px; overflow: auto; height: 280px; margin: 0 40px; position: absolute; top: 0; left: 0; }
.anythingSlider .wrapper ul { width: 99999px; list-style: none; position: absolute; top: 0; left: 0; margin: 0; }
.anythingSlider ul li { display: block; float: left; padding: 0; height: 280px; width: 860px; margin-top: -1px; }
.anythingSlider .arrow { display: block; height: 80px; width: 67px; background: url(Images/arrows4.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 100px; cursor: pointer; }
.anythingSlider .forward { background-position: 0 0; right: -27px; }
.anythingSlider .back { background-position: -81px 0; left: -27px; }
.anythingSlider .forward:hover { background-position: 0 -83px; }
.anythingSlider .back:hover { background-position: -81px -83px; }
.anythingSlider h5 { margin-top: 205px; }
.anythingSlider p, .anythingSlider ul li ul { font-size: 2em; line-height:1.25em; color:#555; letter-spacing: 0px; margin-bottom:10px;}
#slideshow .anythingSlider ul li ul li { list-style-position:inside; list-style: circle; margin-bottom: 5px; }

#thumbNav { position: relative; top: 20px; left: 650px; width:175px; height:25px; }
#thumbNav a { text-indent:-9999px; display: inline-block; padding: 2px 8px; height: 15px; margin: 0 5px 0 0; background: transparent url(Images/circ2.png) no-repeat;  outline: none; }
#thumbNav a:hover { background: transparent url(Images/circ3.png) no-repeat; }
#thumbNav a.cur { background: transparent url(Images/circ3.png) no-repeat; }

#start-stop { background: transparent url(Images/play4.png) no-repeat; color: white; padding: 2px 5px; width: 20px; height:20px; position: absolute; right: 50px; top: 20px; outline: none; }
#start-stop.playing { background-image: url(Images/pause2.png); }
#start-stop:hover { . . . }


/* Prevents */
.anythingSlider .wrapper ul ul { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
.anythingSlider .wrapper ul ul li { float: none; height: auto; width: auto; background: none; }

/* Portfolio Gallery */
#gallery img { margin: 0px 0 10px -8px; padding:0; border:dotted #f3f3f3 2px; }
#gallery h5 { margin-bottom: 15px; text-transform:none; font-size: 2.5em; }
#gallery p { font-size: 1.5em; margin: 0 0 50px 0; line-height:1.25em; }
#gallery ul { margin: 40px 40px 20px 80px; }
#gallery li { list-style: none; display: block; float: left; padding: 0 10px 10px 0; }
#gallery a.portfolio, #gallery a.portfolio:hover { border: none; }
#gallery img:hover { color:#ff0d00; border:dotted #ff0d00 2px; }

#tooltip { width: 250px; font-size: 1.5em; line-height:1.25em; }
#tooltip h3 { font-size: 2em; line-height:1.5em; }

/* For Single-Post Page */
#testimonial { color:#999; font-style:italic; font-size: 2em; letter-spacing: 0px; line-height: 1.5em; margin: 0 250px 20px 0px; padding: 10px 0 0 80px; background: #F3F3F3 url(Images/quotes2.jpg) no-repeat scroll 0px 0px; }

/* Contact Form */
form { margin: 0 0 40px 80px; color:#555; font-weight: bold; letter-spacing: 0px; line-height: 1.5em; padding-top:20px; }
input, select, textarea { margin: 0 0 25px 15px; font-size: 2em; }
label { display:block; width: 250px; margin-top: 4px; float: left; font-size: 2em; }
#main input.button { border:none; border-bottom: 1px solid rgba(0,0,0,0.25); margin-left: 0; }
#form .small, #form .required { width: 250px; }
#form form label.error { font-weight:normal; float:none; color:#ff0d00; font-size: 1.5em; font-style:italic; margin-bottom:20px; margin-top: -17.5px; }
#form p.red { color:#ff0d00; }

/* Home Boxes and All Buttons */
#home-box1 { margin-left: 80px; }
#home-box1 p, #home-box2 p, #home-box3 p { margin:0; }
#home-box1, #home-box2, #home-box3 { float: left; width: 265px; padding: 0 40px 20px 0; overflow: auto; }
#main .button, #main .button:visited {
	background: #fe4c43 url(Images/overlay.png) repeat-x;
	display: inline-block;
	padding: 5px 10px 6px;
	color: #f3f3f3;
	text-decoration: none;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
}
#main .button:hover, #main .button:visited:hover { background:#ff0d00 url(Images/overlay.png) repeat-x; color: #f3f3f3; border-bottom: 1px solid rgba(0,0,0,0.25); }

/* Footer */
#footer { clear:both; background:#015c65 url(Images/footer-bg-oct2010.jpg) repeat-x; color:#F3F3F3; overflow: auto; }
#footer-main { margin: 60px auto 10px; width: 1050px; text-align:center; }
#footer p { color:#F3F3F3; font-size: 1.75em; line-height:1.25em; }
#footer a { border-bottom:dotted #F3F3F3 2px; color:#F3F3F3; }
#footer a:visited { color:#F3F3F3; }
#footer a:hover, #footer a:visited:hover { color: #CCC; border-bottom:dotted #ccc 2px; }
#footer-box-left, #footer-box-right { float:left; width: 460px; padding-right: 40px; }
#footer img { margin-left:80px; padding: 0 10px 10px 0; float:left; }
#footer-box-left p, #footer-box-right p { margin: 0 0 20px 80px; text-align:left; }
#footer h3 { text-align:left; letter-spacing: -1.5px; font-size: 3.5em; color:#fff; text-shadow:0 1px 0 #000; }
#footer p.bottom { margin: 0 0 20px 0px; }

