/*  
Theme Name: Madfrog Designs
Theme URI: http://www.madfrogdesigns.com/
Description: Madblog is a 2 columns Wordpress theme full of AJAX goodies for my website, Madfrog Designs.
Version: 1.0
Author: Julien Coutellier
Author URI: http://www.madfrogdesigns.com/
*/

*{
margin:0;
padding:0;
}

body{
background:#000000 url("images/bg.jpg") no-repeat top center fixed;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:0.9em;
color:#CCCCCC;
line-height:18px;
}


/* GENERAL RULES START HERE */
h1 {
font-size:1.6em;
font-weight:normal;
color:#566d14;
padding-bottom:16px;
line-height:24px;
}

h2 {
font-size:1.3em;
font-weight:normal;
padding:20px 0 10px 0;
}

p {
padding-bottom:10px;
}

a:link, a:visited, a:active {
outline:none;
color:#E18500;
text-decoration:none;
}

a:hover {
color:#E18500;
text-decoration:underline;
}

img {
outline:none;
border:0;
}

input, textarea {
-x-system-font:none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
font-size:1em;
color:#999999;
}
/* GENERAL RULES END HERE */


/* HEADER STARTS HERE */
#header {
position:fixed;
z-index:100;
top:0;
left:0;
background: url("images/header.png") no-repeat top center;
height:24px;
width:100%;
}

#header h1, #header p {
visibility:hidden;
}

#ribbon {
position:fixed;
z-index:199;
}
/* HEADER ENDS HERE */


/* CONTENT STARTS HERE */
#wrapper {
margin:0 auto;
width:1000px;
}

#wrapper_contact {
margin:0 auto;
width:345px;
}

* html div#main{
height:100%;
overflow:auto;
}

#main {
padding-top:25px;
padding-bottom:260px;
}

#left_column {
float:left;
width:720px;
}

#content {
width:620px;
margin-left:100px;
}

#post {
margin-top:20px;
}

#post h1 a, #post h1 a:visited, #post h1 a:active {
color:#566d14;
}

#post h1 a:hover {
color:#E18500;
}

#entry_bg {
background: url("images/entry_bg.png") no-repeat top;
width:620px;
}

#entry, #carousel {
padding:25px;
}

#entry ul {
margin:0 0 15px 5px;
}

#entry p em {
color:#999999;
}

#entry ul li {
list-style:none;
background:url("images/list_bg.png") no-repeat scroll 0 6px;
padding:5px 0 0 30px;
}

#date {
background: url("images/date_bg.png") no-repeat left top;
margin-bottom:10px;
font-style:italic;
}

#postdata {
margin:10px 0;
font-style:italic;
}

#readmore {
font-weight:bold;
}

#commentsbubble{
position:absolute;
z-index:50;
background: url("images/commentsbubble.png") no-repeat top;
width:40px;
height:58px;
margin:25px 0 0 -40px;
text-align:center;
font-weight:bold;
font-size:1em;
padding-top:37px;
}

#commentsbubble a, #commentsbubble a:visited, #commentsbubble a:active {
color:#666666;
}

#photo_gallery {
width:600px;
margin:15px 0;
}

#photo_gallery img {
float:left;
margin:0 0 10px 10px;
}

#flash {
outline:none;
margin:15px;
}

.posted {
border-bottom:1px dotted #000000;
}

.boxcomments {
padding:25px;
}

.boxcomments ol {
margin:10px 0 0 35px;
}

.boxcomments ol li {
margin-bottom:20px;
}

.author {
font-style:italic;
}

#commentform {
margin-left:35px;
}

#commentform label {
width:80px;
float:left;
font-weight:bold;
padding-top:8px;
}

#commentform p {
clear:both;
margin-bottom:5px;
}

#commentform small {
display:block;
font-size:90%;
padding:8px 0 9px;
font-style:italic;
font-weight:bold;
}

#commentform small.optional {
background:transparent url("images/extra_optional_bg.png") no-repeat 410px 5px;
}

#commentform small.required {
background:transparent url("images/extra_required_bg.png") no-repeat 410px 5px;
}

#commentform input {
padding:2px 4px;
width:315px;
height:20px;
margin:5px 5px 0 0;
float:left;
}

#commentbox {
margin-top:15px;
}

#commentform textarea {
padding:2px 4px;
height:150px;
width:500px;
margin-top:5px;
}

#commentform #submit {
width:500px;
height:60px;
margin:0;
padding:0;
outline:none;
}

.mycomment a {
color:#566D14;
}

#edit {
padding-left:25px;
}

#skills {
margin:20px 0 0 20px;
width:550px;
font-size:1.3em;
}

#skills_left, #skills_right {
float:left;
width:230px;
margin-right:40px;
border-bottom:1px dotted #CCCCCC;
}

#skills_single {
width:230px;
margin:20px 0 20px 40px;
border-bottom:1px dotted #CCCCCC;
}

#skills_detail {
border-top:1px dotted #CCCCCC;
height:24px;
padding:7px 0;
}

#skills_detail img {
clear:both;
display:inline;
float:left;
padding:0 10px;
}

#skills_detail a, #skills_detail a:visited, #skills_detail a:active {
color:#FFFFFF;
text-decoration:none;
}

#skills_detail a:hover {
text-decoration:underline;
}
/* CONTENT ENDS HERE */


/* SIDEBAR STARTS HERE */
#right_column {
float:right;
width:280px;
}	

#sidebar_top {
background: url("images/rightcolumn_top.png") no-repeat;
width:280px;
height:11px;
margin-top:20px;
}

#sidebar_repeat {
background: url("images/rightcolumn_repeat.png") repeat-y;
width:280px;
height:100%;
padding-bottom:5px;
}

#sidebar_content {
padding:0 10px 10px 35px;
}

#sidebar_content a:link, #sidebar_content a:visited, #sidebar_content a:active {
outline:none;
color:#CCCCCC;
text-decoration:none;
}

#sidebar_content a:hover {
color:#E18500;
}

#sidebar_content p {
padding:8px;
}

#sidebar_content p a:link, #sidebar_content p a:visited, #sidebar_content p a:active {
color:#E18500;
font-style:italic;
text-decoration:none;
}

#sidebar_content p a:hover {
text-decoration:underline;
}

#sidebar_content ul {
margin:0 0 10px 5px;
}

#sidebar_content ul.rss {
margin:0 0 0 5px;
}

#sidebar_content ul li {
list-style:none;
padding-top:5px;
}

#sidebar_content ul li a {
display:block;
background:url("images/list_bg.png") no-repeat;
padding-left:30px;
}

#sidebar_content ul.rss li a {
display:block;
background:url("images/list_rss_bg.png") no-repeat;
padding-left:30px;
}

#sidebar_content ul li a:hover {
background:url("images/list_bg_hover.png") no-repeat;
}

#search {
padding-left:35px;
}

#search .search_input {
padding:2px 4px;
margin-top:10px;
width:215px;
height:20px;
}

#sidebar_bottom {
background:url("images/rightcolumn_bottom.png") no-repeat;
width:280px;
height:11px;
}

#social_icons {
padding:8px;
}

#social_icons img {
margin-right:15px;
}

#social_icons_top {
margin-bottom:5px;
}

#showmore {
margin-left:10px;
}
/* SIDEBAR ENDS HERE */


/* FOOTER STARTS HERE */
#footer {
position:fixed;
z-index:120;
bottom:0;
left:0;
width:100%;
}

	/* LOGO STARTS HERE */
	#logo {
	background: url("images/logo.png") no-repeat top center;
	margin:0 auto;
	height:154px;
	}
	
	#homebtn {
	position:relative;
	margin:0 auto;
	top:30px;
	left:-90px;
	width:690px;
	height:100px;
	}
	
	#homebtn a, #homebtn a:hover, #homebtn a:visited, #homebtn a:active {
	display:block;
	width:690px;
	height:100px;
	outline:none;
	}
	
	#top {
	position:relative;
	margin:0 auto;
	top:-55px;
	left:340px;
	width:90px;
	height:60px;
	}
	
	#top a, #top a:hover, #top a:visited, #top a:active {
	display:block;
	width:90px;
	height:60px;
	outline:none;
	}
	
	#toggle {
	position:relative;
	margin:0 auto;
	top:-100px;
	left:440px;
	width:90px;
	height:60px;
	}
	
	#toggle a, #toggle a:hover, #toggle a:visited, #toggle a:active {
	display:block;
	width:90px;
	height:60px;
	outline:none;
	}
	/* LOGO ENDS HERE */

#collapse_shell {
background-color:#000000;
}

#collapse {
margin:0 auto;
width:1000px;
}

	/* NAV STARTS HERE */
	#nav {
	background: url("images/nav/nav_bg.gif") no-repeat top center;
	height:63px;
	}
	
	#nav ul {
	position: relative;
	z-index:20px;
	height:63px;
	margin-left:55px;
	}
	
	#nav ul li {
	float: left;
	list-style: none;
	}
	
	#nav ul li#nav_home {
	margin-right:20px;
	}
	
	#nav ul li#nav_about {
	margin-right:19px;
	}
	
	#nav ul li#nav_portfolio {
	margin-right:19px;
	}
	
	#nav ul li#nav_blog {
	margin-right:21px;
	}
	
	#nav ul li#nav_goodies {
	margin-right:20px;
	}
	
	#nav ul li#nav_contact {
	margin-right:3px;
	}
	
	#nav ul li.back {
	background: url("images/nav/floatie.gif") no-repeat right -63px;
	width: 9px;
	height: 63px;
	z-index: 8;
	position: absolute;
	}
	
	#nav ul li.back .left {
	background: url("images/nav/floatie.gif") no-repeat top left;
	height: 63px;
	margin-right: 9px; /* 7px is the width of the rounded shape */
	}
	
	#nav ul li a, #nav ul li a:hover, #nav ul li a:visited, #nav ul li a:active {
	z-index: 10;
	display: block;
	float: left;
	height: 44px;
	position: relative;
	overflow: hidden;
	padding:5px 10px;
	margin-top:4px;
	outline:none;
	}
	/* NAV ENDS HERE */
	
#copyright {
clear:both;
background: url("images/copyright.gif") no-repeat top center;
height:41px;
}

#copyright_content {
text-align:right;
color:#333333;
font-size:0.8em;
padding:18px 10px 0;
}

#copyright_content a, #copyright_content a:visited, #copyright_content a:active {
color:#333333;
text-decoration:underline;
}

#copyright_content a:hover {
color:#666666;
}

	/* UNDERGROUND STARTS HERE */
	#underground {
	background: url("images/underground.jpg") no-repeat top center;
	margin:0 auto;
	height:391px;
	}
	
	#underground_content {
	width:1000px;
	margin:0 auto;
	}
	
	#close {
	position:relative;
	margin:0 auto;
	top:10px;
	left:420px;
	width:90px;
	height:40px;
	}
	
	#close a, #close a:hover, #close a:visited, #close a:active {
	display:block;
	width:90px;
	height:40px;
	outline:none;
	}
	
	#shelves {
	background:transparent url("images/shelf_footer.png") no-repeat 0 95px;
	width:940px;
	height:370px;
	margin-left:60px;
	}

	#top_shelf {
	clear:both;
	padding-top:38px;
	margin-left:42px;
	width:940px;
	}
	
	#top_shelf ul.books {
	float:left;
	}
	
	#top_shelf ul.books li {
	float:left;
	margin-right:38px;
	position:relative;
	list-style:none;
	background:transparent url("images/book.png") no-repeat scroll left bottom;
	width:74px;
	height:106px;
	}
	
	#top_shelf ul.books li img {
	margin:5px 0 0 1px;
	border:0;
	outline:none;
	}
	
	#top_shelf ul.movies {
	float:left;
	padding-top:15px;
	}
	
	#top_shelf ul.movies li {
	float:left;
	margin-right:48px;
	position:relative;
	list-style:none;
	}
	
	#top_shelf ul.movies li a {
	background:transparent url("images/dvd.png") no-repeat scroll 0 0;
	border:0 none;
	display:block;
	height:90px;
	overflow:hidden;
	position:relative;
	text-indent:-1000em;
	width:64px;
	z-index:3;
	}
	
	#top_shelf ul.movies li img {
	height:88px;
	left:2px;
	position:absolute;
	top:1px;
	width:61px;
	z-index:2;
	}
	
	#bottom_shelf {
	clear:both;
	padding-top:64px;
	margin-left:40px;
	width:940px;
	}

	#bottom_shelf ul li {
	float:left;
	margin-right:38px;
	position:relative;
	list-style:none;
	}
	
	#bottom_shelf ul li a {
	background:transparent url("images/cd.png") no-repeat scroll 0 0;
	border:0 none;
	display:block;
	height:76px;
	overflow:hidden;
	position:relative;
	text-indent:-1000em;
	width:74px;
	z-index:3;
	}
	
	#bottom_shelf ul li img {
	height:72px;
	left:2px;
	position:absolute;
	top:1px;
	width:72px;
	z-index:2;
	}
	
	#bottom_shelf ul li .vinyl {
	background:transparent url("images/cd.png") no-repeat scroll left bottom;
	display:block;
	height:76px;
	left:60px;
	position:absolute;
	width:22px;
	z-index:1;
	}
	/* UNDERGROUND ENDS HERE */
/* FOOTER ENDS HERE */


/* TWITTER */
#twitter_top {
background:transparent url("images/twitter_top.png") no-repeat;
width:280px;
height:98px;
}

#rssbtn {
position:relative;
top:-20px;
left:-75px;
}

#twitterbtn {
position:relative;
margin:0 auto;
top:-100px;
left:10px;
width:250px;
height:80px;
}

#twitterbtn a, #twitterbtn a:hover, #twitterbtn a:visited, #twitterbtn a:active {
display:block;
width:280px;
height:98px;
outline:none;
}

#twitter_div {
background:transparent url("images/rightcolumn_repeat.png") repeat-y scroll 0 0;
height:100%;
width:280px;
}

#twitter_div #tweet {
padding:2px 10px 0 35px;
font-style:italic;
}

#tweet li {
list-style:none;
}

#tweet .twittertime {
text-align:right;
display:block;
margin:10px 10px 0 0;
font-size:85%
}

#tweet .twittertime a {
text-align:right;
display:block;
margin:10px 10px 0 0;
}


/* HIGHSLIDE */
.highslide {
cursor: url("http://www.madfrogdesigns.com/scripts/highslide/graphics/zoomin.cur"), pointer;
outline: none;
text-decoration: none;
}

.highslide-active-anchor img {
visibility: hidden;
}

.highslide img {
border: 1px solid #666666;
}

.highslide:hover img {
border: 1px solid #999999;
}

.highslide-wrapper, .rounded-white {
background: white;
}

.highslide-image {
border: 1px solid white;
}

.highslide-loading {
display: block;
font-size: 8pt;
color:#FFFFFF;
text-decoration: none;
font-weight: bold;
text-transform:uppercase;
}

a.highslide-full-expand {
background: url("http://www.madfrogdesigns.com/wp-content/themes/madfrog/scripts/highslide/graphics/fullexpand.gif") no-repeat;
display: block;
margin: 0 10px 10px 0;
width: 34px;
height: 34px;
}


/* WSLIDE - PORTFOLIO */
#portfolio_bg {
background: url("images/portfolio_frame.png") no-repeat;
width:570px;
height:325px;
padding:28px 0 0 22px;
}

#portfolio-menu {
float:right;
margin:20px 30px 0 0;
}

#portfolio-menu a {
display:block;
float:left;
padding-top:2px;
margin: 2px;
text-decoration: none;
font-weight: bold;
color: #CCCCCC;
background:url("images/pagination_bg.png") no-repeat;
width:25px;
height:25px;
text-align:center;
}

#portfolio-menu a.wactive {
color:#E18500;
}

#portfolio-menu a:hover {
color:#E18500;
text-decoration:underline;
}


/* TOOLTIP */
#tooltip {
position:absolute;
background:url("images/clickfordetails.png") no-repeat;
width:225px;
height:61px;
display:none;
}