/*
-----------------------------------
WORLDOFPABLO.COM homepage CSS
Designed by Paul Heron
Still a work-in-progress :-)
-----------------------------------
*/

@font-face {
	font-family: caricature;
	src: url(uploads/webfonts/caricature.eot); /* EOT file for IE */
}

@font-face {
	font-family: caricature;
	src: url(uploads/webfonts/caricature.ttf) format("truetype"); /* TTF file for CSS3 browsers */
}

a {
color: #6a6a6a;
}

a:hover {
text-decoration: none;
}

.header{
   position: relative;
   width: 800px;
   height: 65px;
   margin-top: 0pt;
   margin-right: auto;
   margin-left: auto;
   margin-bottom: 0pt;
   max-width: 800px;
   min-width: 800px;
   background-image: url(uploads/images/homepage/header.gif);
   background-repeat: no-repeat;
   background-color: #6699cc
}

.headerbasic{
   position: relative;
   width: 800px;
   height: 65px;
   margin-top: 0pt;
   margin-right: auto;
   margin-left: auto;
   margin-bottom: 0pt;
   max-width: 800px;
   min-width: 800px;
   background-image: url(uploads/images/homepage/headerbasic.gif);
   background-repeat: no-repeat;
   background-color: #6699cc
}

/*Navigation adapted from: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.main_nav{
width: 100%;
}

.main_nav ul{
padding: 15px 30px 4px 30px; /*15px should equal top padding of "ul li a" below, 4px should equal bottom padding + bottom border of "ul li a" below*/
margin: 0;
text-align: left; /*set value to "left", "center", or "right"*/
}

.main_nav ul li{
display: inline;
padding: 15px 3px 4px 3px; /*top padding is 15px, bottom padding is 4px*/
margin-right: 6px; /*additional spacing between each menu link*/
text-decoration: none;
font-family: caricature, arial;
font-weight: normal;
font-size: 120%;
text-transform: uppercase;
letter-spacing: -0.25px; /*try 12px margin when -1px spacing*/
border-bottom: 0px solid gray; /*no underline at present*/
color:#FFFFFF;
}

.main_nav ul li a{
text-decoration: none;
color: #000000;
}

.main_nav ul li a:hover, .underlinemenu ul li a.selected{
color: #ffffff;
border-bottom-color: black;
}

.main_nav ul li a:active{
outline:none;
}

body {
   border-width: 0px;
   padding: 0px;
   margin: 0px;
   font-family: verdana,sans-serif;
   font-size: 100%;
   background-image: url(uploads/images/homepage/paper-bg.jpg);
   background-repeat: repeat;
   background-color: #EADCC1; /* matches paper texture */
}

.bottomrightbg {
   background-image: url(uploads/images/homepage/dan-looks-left.gif);
   position: relative;
   top: 0px; left: 0px;
   height:239px;
   background-repeat: no-repeat;
   background-position: bottom right;
   z-index: 11;
}

.wrapper{
   position: relative;
   width: 800px;
   margin-top: 0pt;
   margin-right: auto;
   margin-left: auto;
   margin-bottom: 0pt;
   max-width: 800px;
   min-width: 800px;
   text-align: left;
}
.topleft{
   position: relative;
   float: left;
   left: 0px;
   width: 400px;
   height: 516px;
   background-image: url(uploads/images/homepage/topleft-380.gif);
   background-position: 15px 0px;
   background-repeat: no-repeat;
   background-color: #ffffff
}
.date {
   margin-top: 480px;
   text-align: center;
   font-family: georgia, serif;
   font-size: 10pt;
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: -0.5px;
}
.topright{
   position: relative;
   float: right;
   right: 0px;
   width: 400px;
   height: 516px;
   background-image: url(uploads/images/homepage/topright-380.jpg);
   background-position: 5px 0px;
   background-repeat: no-repeat;
   background-color: #ffffff
}
.middle{
   position: relative;
   float: left;
   width: 800px;
   height: 525px;
   background-image: url(uploads/images/homepage/middlepanels.jpg);
   background-position: 15px 0px;
   background-repeat: no-repeat;
   background-color: #ffffff
}

.mekon {
   position: relative;
   float: left;
   top: 20px;
   left: 200px;
   width: 400px;
   height: 550px;
   background-image: url(uploads/images/homepage/mekon-speaks.jpg);
   background-position: 0px 0px;
   background-repeat: no-repeat;
}
.mekonspeaks {
   position: absolute;
   top: 420px;
   left: 175px;
   width: 175px;
   height: 63px;
   padding: 5px;
   font-family: "comic sans ms",verdana,sans-serif;
   font-size: 60%;
   text-transform: uppercase;
   text-align: center;
/*   letter-spacing: -0.3px; */
/*   background-color: pink; */
}

.bottom{
   position: relative;
   float: left;
   width: 800px;
   height: 20px;
}

.footer{
   position: relative;
   float: left;
   width: 800px;
/*   height: 140px; */
   margin-top: 20px;
}

.footer a{
   text-decoration: none;
   color: #dcdcdc;
}

.footer a:hover{
   text-decoration: underline;
   color: #dcdcdc;
}

.footerBackground{
   position:relative;
   width:100%;
   height:220px;
   z-index:10;
   background-color:#000000;
   opacity:0.35;
   filter:alpha(opacity=35);
}

.footerLinksBackground{
   position:relative; bottom:28px; left:10px;
   width:500px;
   height:20px;
   margin: 0;
   background-color:#000000;
   opacity:0.20;
   filter:alpha(opacity=20);
   z-index:11;
}


.footer h1{
   position:absolute; top:10px; left:0px;
   margin: 0px 10px 0px 10px;
   padding: 0;
   z-index:11;
   font-family: arial, sans-serif;
   letter-spacing: 0px;
   font-size: 100%;
   color:#ffffff;
}

.footerExtract{
   position:absolute; top:40px; left:0px;
   margin: 0px 0px 0px 10px;
   height:140px;
   width:500px;
   z-index:11;
   font-family: arial, sans-serif;
   font-size: 70%;
   color:#ffffff;
   text-align:justify;
}

.footerAbout{
   position:absolute; top:10px; left:510px;
   margin: 0px 0px 0px 10px;
   height:200px;
   width:260px;
   z-index:11;
   font-family: arial, sans-serif;
   font-size: 70%;
   color:#ffffff;
   text-align:justify;
   padding-left: 10px;
   border-left: 1px dotted;
}

.footerLinks{
   position:relative;
   bottom:50px!important;
   bottom:45px;
   left:10px;
   width:500px;
   height:0px;
   margin: 0;
   z-index:9999;
}

.footerLinks ul{
   padding: 0px 0px 0px 0px;
   margin: 0;
   height:0px;
   text-align: center;
}

.footerLinks ul li{
display: inline;
padding: 0px 3px 0px 3px;
margin-right: 0px; /*additional spacing between each menu link*/
text-decoration: none;
font-family: arial;
font-size: 60%;
text-transform: uppercase;
letter-spacing: -0.25px;
border-bottom: 0px solid #dcdcdc;
color:#FFFFFF;
}

.footerLinks ul li a{
text-decoration: none;
color: #DCDCDC;
}

.footerLinks ul li a:hover, .underlinemenu ul li a.selected{
color: #ffffff;
text-decoration: none;
border-bottom-color: black;
}

.footerLinks ul li a:active{
outline:none;
}

.box1 {
   position: absolute;
   top: 415px;
   left: 28px;
   width: 110px;
   height: 63px;
   padding: 5px;
   font-family: "comic sans ms",verdana,sans-serif;
   font-size: 60%;
   text-transform: uppercase;
/*   letter-spacing: -0.3px; */
/*   background-color: pink; */
}
.box2 {
   position: absolute;
   top: 7px;
   left: 15px;
   width: 170px;
   height: 30px;
   padding: 5px;
   font-family: "comic sans ms",verdana,sans-serif;
   font-size: 60%;
   text-transform: uppercase;
/*   letter-spacing: -0.3px; */
}
.box3 {
   position: absolute;
   top: 43px;
   left: 124px;
   width: 115px;
   height: 35px;
   padding: 5px;
   font-family: "comic sans ms",verdana,sans-serif;
   font-size: 60%;
   text-transform: uppercase;
/*   letter-spacing: -0.3px; */

}
.box4 {
   position: absolute;
   top: 303px;
   left: 300px;
   width: 70px;
   height: 45px;
   padding: 5px;
   font-family: "comic sans ms",verdana,sans-serif;
   font-size: 60%;
   text-align: center;
   text-transform: uppercase;
/*   letter-spacing: -0.3px; */
}

.twitter_div {
   position: absolute;
   top: 8px;
   left: 370px;
   width: 170px;
   height: 68px;
   padding: 5px;
   font-size: 55%;
   letter-spacing: 0px;
   list-style: none;
}