/* CSS Document */

/* body and font variation setup  */

body  { font: normal 14px 'UbuntuRegular', Arial, Helvetica, sans-serif; background: url(../images/topbg.jpg) repeat-x center top; color: #666; line-height: 18px;}

strong, b, h1, h2, h3, h4, h5, h6, address, .new-hdrs, .gal-hdr {  font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; }

em, i { font-family: 'UbuntuItalic', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; }

strong em, strong i, b em, b i, em strong, i strong, em b, i b { font-family: 'UbuntuBoldItalic', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; }

a { color: #0033CC; }
.or { color: #f93;  }
.bl { color: #0033CC;  }
.blk { color: #000; }
.ief { min-height: 1px; }
.rd { color: #F00; }
.clearfx { clear: both; min-height: 1px; }

fieldset { border:none; position: relative; overflow: hidden; }

#wrapper { width: 990px; margin: 0 auto; display: block; overflow: visible; }



/* header search bar setup  */

#searchbar { clear:both; display: block; position: relative; width: 990px; height: 163px; }

h1 { background: url(../images/kf-logo.jpg) no-repeat left top; height: 150px; width: 410px; text-indent: -5000px; float: left; display: inline; position: relative; }
h3, h2 { text-align: center; clear:both; }

#bigsearch { float: right; display: inline; position: relative; width: 510px; margin-top: 25px; }
#bigsearch form { width: 509px; height: 56px; display: block; background: url(../images/searchbg.gif) no-repeat left top; margin: 10px 0; }

.topsearch { font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; border-width: 0px; border-style: none; background: url(../images/sprite.gif) repeat; font-size: 26px; line-height: 56px; color: #999; height: 56px; width: 300px; padding-left: 80px; float:left; display: inline; position: relative; }
.topgobut { width: 125px; height: 56px; float:right; display: inline; position: relative; }



/* alpha bar setup */

#alphabar { clear:both; display: block; position: relative;  width: 990px; height: 31px; margin-top: 6px; }
#alphabar li { float: left; display:inline; width: 29px; height: 25px; text-align: center; margin-right: 4px; font: normal 22px 'UbuntuBold', Arial, Helvetica, sans-serif; }
#alphabar li a { display: block; width: 29px; height: 25px; color: #fff; text-decoration: none; padding-top: 3px;}
#alphabar li a:hover { background: url(../images/alpha-over.gif) no-repeat left top; color: #F93; }

#alphabar li.browse { font: normal 10px 'UbuntuRegular', Arial, Helvetica, sans-serif; color: #ccc; width: 126px; padding-top: 4px; line-height: 11px; }
#alphabar li.browse a { display: inline; background: none; margin:0; padding: 0; color: #F90; }



/* main nav bar setup */

ul#navbar li#home ul li a, ul#navbar li#home ul li a:hover, ul#navbar li#new ul li a, ul#navbar li#new ul li a:hover { background: url(../images/transfil.png) repeat; text-indent: 0px; text-align: center; color: #fff; font-size: 18px; display: block; height: 26px; width: 153px; padding: 12px 0 0 0; margin: 0 0 0 5px; font-family: 'UbuntuRegular', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; letter-spacing: -1px; border-bottom: 1px solid #000; border-top: 1px solid #333; }

ul#navbar li#login ul li, ul#navbar li#login ul li:hover { background: url(../images/transfil.png) repeat; text-indent: 0px; text-align: center; color: #fff; font-size: 12px; display: block; height: 66px; width: 153px; padding: 12px 0 0 0; margin: 0 0 0 5px; font-family: 'UbuntuRegular', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; letter-spacing: 0; border-bottom: 1px solid #000; border-top: 1px solid #333; }

ul#navbar li#home ul li a:hover, ul#navbar li#new ul li a:hover { color: #F90; background: url(../images/transfil-over.png) repeat;  } 


#navbar { clear:both; display: block; position: relative; width: 990px; height: 55px; padding-top:3px; margin: 3px 0 0 0;}
ul#navbar li { float: left; display: inline; position: relative; }
ul#navbar li a { overflow:hidden; display: block; height: 49px; text-indent: -5000px; text-decoration: none; background: url(../images/kf-menu.gif) no-repeat; }

ul#navbar li#home a { background-position:0 0; width:165px; }  
ul#navbar li#home a:hover { background-position:0 -49px; width:165px; }  

ul#navbar li#new a { background-position:-165px 0; width:165px; }  
ul#navbar li#new a:hover { background-position: -165px -49px; width:165px; }  

ul#navbar li#gals a { background-position:-330px 0; width:165px; }  
ul#navbar li#gals a:hover { background-position: -330px -49px; width:165px; }  

ul#navbar li#models a { background-position:-495px 0; width:165px; }  
ul#navbar li#models a:hover { background-position: -495px -49px; width:165px; }  

ul#navbar li#reviews a { background-position:-660px 0; width:165px; }  
ul#navbar li#reviews a:hover { background-position: -660px -49px; width:165px; }  

ul#navbar li#login a { background-position:-825px 0; width:165px; }  
ul#navbar li#login a:hover { background-position: -825px -49px; width:165px; }  

#nologin { height: 125px; }
p.nolog { text-align: center; line-height: 20px; font-size: 18px; } 
p.nolog2 { text-align: center; line-height: 18px; } 



/* left col reviews search and menu */

#leftcol { display: inline; float: left; position: relative; width: 220px; overflow:visible; }
.leftbg, .topsites { background: url(../images/leftcolbg.png) repeat-y left; min-height: 1px; }

.findsite { text-align: center; font-size: 16px; background: url(../images/topcap.png) no-repeat left top; margin: 12px 0 0 0; padding: 10px 0 4px 0; position: relative; min-height: 1px; }
#revsearch { width: 200px; height: 43px; display: block; background: url(../images/revsearchbg.png) no-repeat left top; margin: 0 10px 0 10px; }

.revsearch { font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; border-width: 0px; border-style: none; background: url(../images/sprite.gif) repeat; font-size: 18px; line-height: 43px; color: #999; height: 43px; width: 145px; padding-left: 10px; float:left; display: inline; position: relative; }
.revgobut { width: 44px; height: 43px; float:right; display: inline; position: relative; }

#revmenu { clear:both; display: block; position: relative; width: 197px; margin: 0 0 0 11px; padding: 0 0 0 0; }
ul#revmenu li a { overflow:hidden; display: block; width: 197px; height: 35px; text-indent: -5000px; text-decoration: none; background: url(../images/revmenu.gif) no-repeat; margin-bottom: 4px; }

ul#revmenu li#revmhome a { background-position:0 0; width:197px; }  
ul#revmenu li#revmhome a:hover { background-position: -197px 0; width:197px; }  

ul#revmenu li#revmnew a { background-position:0 -35px; width:197px; }  
ul#revmenu li#revmnew a:hover { background-position: -197px -35px; width:197px; }  

ul#revmenu li#revmsites a { background-position:0 -70px; width:197px; margin-bottom: 0; }  
ul#revmenu li#revmsites a:hover { background-position: -197px -70px; width:197px; }  

.cats { text-align: center; padding-top: 12px; font-size: 16px; background: url(../images/topcap.png) no-repeat left top; margin-top: 12px; min-height: 1px; }

#sortby { height: 24px; background: url(../images/leftcolbg.png) repeat-y left; padding-left: 30px; }
#sortby li { float: left; display: inline; position: relative; margin: 0 16px 0 0; padding: 4px 0 0 0; font: normal 11px 'UbuntuRegular', Arial, Helvetica, sans-serif; }
#sortby li a { text-decoration: none; color: #F90; }
#sortby li a:hover { color: #666; }

#catsmenu, #topsitesmenu { margin: 0; border-top: 1px solid #d8d8d8; background: url(../images/leftcolbg.png) repeat-y left; }
#catsmenu li, #topsitesmenu li { font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; min-height: 36px; border-bottom: 1px solid #d8d8d8; border-top: 1px solid #f2f2f2; display: block; }
#catsmenu li a, #topsitesmenu li a { display: block; text-decoration: none;  background: url(../images/arrow1.png) no-repeat 196px 13px; width: 175px; min-height: 25px;  padding: 11px 27px 0 18px; }
#catsmenu li a:hover, #topsitesmenu li a:hover { background: #f1f1f1 url(../images/arrow2.png) no-repeat 196px 13px; color: #000; }
#catsmenu li span, #topsitesmenu li span { font: normal 11px 'UbuntuRegular', Arial, Helvetica, sans-serif; color: #333; }
.botcap { width: 220px; height: 12px; background: url(../images/botcap.png) no-repeat left bottom; margin: 0 0 10px 0; }

#sortby2 { height: 24px; background: url(../images/leftcolbg.png) repeat-y left; padding-left: 26px; }
#sortby2 li { float: left; display: inline; position: relative; margin: 0 8px 0 0; padding: 4px 0 0 0; font: normal 11px 'UbuntuRegular', Arial, Helvetica, sans-serif; }
#sortby2 li a { text-decoration: none; color: #F90; }
#sortby2 li a:hover { color: #666; }

.viewall { min-height: 1px; background: url(../images/leftcolbg.png) repeat-y left; text-align: center; font-size: 12px; padding: 6px 0 0 0;}
.viewall a { color: #F93; text-decoration: none; }
.viewall a:hover { color: #666; }
.atopsite { margin: 0 auto; padding: 6px 0; }
.topsites p { text-align: center; padding: 5px; font-size: 18px; }



/* right col setup top and bottom caps + background */

#rightcol { display:inline; float: right; position: relative; width: 758px; overflow:visible; margin: 12px 0 12px 12px; }
.rightwrap { background: url(../images/mainbg.png) repeat left top; padding: 0; margin: 0;}
.mtcap { background: url(../images/maintcap.png) no-repeat left top; display: block; position: relative; height: 12px; clear: both; }
.mbcap { background: url(../images/mainbcap.png) no-repeat left bottom; display: block; position: relative; height: 12px; clear: both; }
.divider1 { display: block; height: 24px; background: url(../images/border1.png) repeat-x 0px 12px; clear: both; }
.divider2 { display: block; height: 24px; background: url(../images/border2.png) repeat-x 0px 0px; clear: both; }
.divider3 { display: block; height: 24px; background: url(../images/border3.png) repeat-x 0px 0px; clear: both; }
.divider4 { display: block; height: 12px; background: url(../images/border1.png) repeat-x 0px 6px; clear: both; }



/* re-useable content boxes  */

.cblock { display: block; position: relative; padding: 0 12px; background: url(../images/mainbg.png) repeat left top;  min-height: 1px; }

.cblock-lt { display: block; position: relative; padding: 0 12px; background: #f7f7f7;  min-height: 1px; }

.cblock-2 { display: block; position: relative; min-height: 1px; margin: 0 12px 0 12px; }
.cblock-3 { display: block; position: relative; min-height: 1px; margin: 12px 12px 0 12px; }


/* quick review block */

.cblock h1, .cblock-lt h1 { display: block; background: none; height:auto; width:auto; text-indent: 0; font-size: 38px; margin:4px 0 0 0; line-height: 36px; letter-spacing: -1px; }
.cblock h1 a { text-decoration: none; }
.cblock h1 a:hover { text-decoration: underline; }

#reviewsurf { display: block; clear: both; margin: 0 0 12px 0; padding: 2px 0 2px 0; font-size: 12px; border-bottom: 1px solid #ccc; height: 20px; }
#reviewsurf li { display: inline; float: left; }
#reviewsurf li.date { width: 530px; text-align: left; }
#reviewsurf .bar { padding: 0 16px; }

#reviewsurf li.prev a { display: block; color: #F90; background: url(../images/arrow3.png) no-repeat 6px 4px; padding: 0 0 0 20px; }
#reviewsurf li.prev a:hover { color: #999; background: url(../images/arrow4.png) no-repeat 4px 4px; padding: 0 0 0 20px; }

#reviewsurf li.next a { display: block; color: #F90; background: url(../images/arrow1.png) no-repeat 54px 4px; padding: 0 15px 0 0; }
#reviewsurf li.next a:hover { color: #999; background: url(../images/arrow2.png) no-repeat 56px 4px; padding: 0 15px 0 0; }

/* quick review left side screenshot and links */

.sshotwrap { float: left; display:inline; position: relative; width: 196px; }
.sshot {  width: 180px; clear: both; }

.siteurl {  clear: both; text-align: center; margin: 6px 0 4px 0; }
.siteurl a { text-decoration: none; }
.siteurl a:hover { text-decoration: underline; }

.visitsite a { display: block; width: 189px; height: 35px; margin: 0 auto; background: url(../images/visitbut.png) no-repeat left top;  text-decoration: none; }
.visitsite a span { visibility: hidden; }
.visitsite a:hover { }

/* quick review right side review text and scoreboard */

.qr-wrap { display: inline; position: relative; float: right; width: 520px; }
#qr-text { display: inline; position: relative; float: left; width: 396px; }
#qr-score { display: inline; position: relative; float: right; width: 110px; }
#qr-text p { text-align: justify; line-height: 24px; color: #666; }

.bigscore { text-align: center; }
.bs1 { font-size: 12px; color: #999; line-height: 14px; margin: 0 0 4px 0; }
.bs2 { font-size: 42px; color: #F90; line-height: 42px; border-bottom: 1px solid #ccc; margin: 0 0 8px 0; }
.bs3 { font-size: 24px; color: #999; line-height: 24px; }
.bs4 { font-size: 16px; color: #999; line-height: 18px; text-align:center; }
#fu { position: relative; float: right; margin: 0 auto; padding: 0 16px 0 0; z-index: 9999; }
#bdown, #bdown2 { text-align: center; margin: 10px auto 0 auto; }
#bdown2 a { display: block; width: 90px; margin: 0 auto; float: right; padding: 0 10px 0 0;}

/* important information section */

#info-sec { display: block; position: relative; padding: 0 12px; background: #f7f7f7;  min-height: 1px; height: 130px;}
#info-sec h4 { display: block; height: 33px; font-size: 17px; line-height: 33px; color: #333; background: url(../images/important.png) no-repeat left center; padding: 0 0 0 40px; }
#info-sec h4 a { text-decoration: none; }
#pros { display: inline; float: left; position: relative; margin: 5px 0 0 25px; padding: 0 0 0 26px; background: url(../images/pros.png) no-repeat left 3px; width: 310px;}
#pros li { font-size: 12px; background: url(../images/check.png) no-repeat left 2px; padding: 0 0 0 20px; }

#cons { display: inline; float: right; position: relative; margin: 5px 25px 0 0; padding: 0 0 0 26px; background: url(../images/cons.png) no-repeat left 4px; width: 310px;}
#cons li {  font-size: 12px; background: url(../images/ex.png) no-repeat left 2px; padding: 0 0 0 20px; }



/* website specification section */

#spec-sec h5 { display: block; height: 33px; font-size: 28px; line-height: 33px; color: #333; background: url(../images/info.png) no-repeat left center; padding: 0 0 0 40px; letter-spacing: -1px;}
#spec-sec h5 a { text-decoration: none; }


/* slidedeck setup:  ONLY the size of the deck container and the formatting of the CONTENT that appears within the slides is set here. All 'skin' and 'spine' and 'behaviour' design properties are in /css/slidedeck.skin.css */

#slidedeck_frame { width: 700px; height: 285px; margin-top: 8px;}
.slide1, .slide2, .slide3, .slide4, .slide5 { display: block; height: 225px; border: 1px solid #ccc; background: #fff; padding: 20px 20px 0 20px; }
.spec-name { font-size: 24px; line-height: 28px; }
.spec-name a { text-decoration: none;  }
.spec-date { border-bottom: 1px dotted #ccc; margin: 0 0 10px 0; padding: 0 0 6px 0;}
.spec-niche1 { font-size: 18px; line-height: 24px; }
.spec-niche2 { font-size: 18px; line-height: 24px; margin: 0 0 6px 0; }
.spec-score { font-size: 32px; line-height: 60px; letter-spacing: -1px; border-top: 1px dotted #ccc; }
.spec-title { font-size: 22px; color: #f90;}

.slide2 p { margin: 0 0 6px 0; }
.spec-phzip { margin: 8px 0 0 0; padding: 8px 0 0 0; font-size: 18px; border-top: 1px dotted #ccc; }

.slide3 { overflow: auto; }
.slide3 p { margin: 0 0 2px 0; }
.slide3 ul li { margin-bottom: 4px; }

.spec-formats { font-size: 16px; padding: 6px 0; }
.spec-format-3gp { padding: 0 0 0 22px; background: url(../images/3gp.png) no-repeat left 2px; }
.spec-format-avi { padding: 0 0 0 22px; background: url(../images/avi.png) no-repeat left 2px; }
.spec-format-divx { padding: 0 0 0 22px; background: url(../images/divx.png) no-repeat left 2px; }
.spec-format-fl { padding: 0 0 0 22px; background: url(../images/flicon.png) no-repeat left 2px; }
.spec-format-iph { padding: 0 0 0 22px; background: url(../images/mobileicon.png) no-repeat left 1px; }
.spec-format-mp3 { padding: 0 0 0 22px; background: url(../images/mp3.png) no-repeat left 2px; }
.spec-format-mpeg { padding: 0 0 0 22px; background: url(../images/mpeg.png) no-repeat left 2px; }
.spec-format-mp4 { padding: 0 0 0 22px; background: url(../images/mp4.png) no-repeat left 2px; }
.spec-format-qt { padding: 0 0 0 22px; background: url(../images/qticon.png) no-repeat left 2px; }
.spec-format-real { padding: 0 0 0 22px; background: url(../images/real.png) no-repeat left 2px; }
.spec-format-wm { padding: 0 0 0 22px; background: url(../images/wmicon.png) no-repeat left 2px; }
.spec-format-xvid { padding: 0 0 0 22px; background: url(../images/xvid.png) no-repeat left 2px; }

.slide4 ul li { margin-bottom: 8px; font-size: 16px; }

.slide5 p { margin: 0 0 10px 0; }


/* review scoring sections  */

.scoreblocks { display: block; position: relative; min-height: 1px; overflow: auto; margin: 0 0 12px 0;}

.scoreleft { float: left; display: inline; position: relative; overflow: visible; width: 340px; min-height: 1px; border-right: 1px dotted #ccc; padding: 0 12px 0 0;}
.scoreright { float: right; display: inline; position: relative; overflow: visible; width: 340px; min-height: 1px; }



#score-sec h5 { display: block; height: 33px; font-size: 28px; line-height: 33px; color: #333; background: url(../images/review.png) no-repeat left center; padding: 0 0 0 40px; letter-spacing: -1px; margin-bottom: 2px; }
#score-sec h5 a { text-decoration: none; }
.score-note { font-size: 11px; line-height: 11px; padding: 0 0 0 40px; margin: 0 0 6px 0; }
#score-vid, #score-photo, #score-ent, #score-bang, #summary { margin: 0 0 12px 0; }

#score-sec h6, #conclusion h6 { font-size: 22px; line-height: 22px; color: #F93; letter-spacing: -1px; border-bottom: 1px dotted #ccc; margin: 0 0 6px 0; padding: 0 0 4px 0; }
#score-sec h6 a { text-decoration: none; }

#score-sec td { border-bottom: 1px dotted #ccc; height: 30px; line-height: 30px; }

.score-pros { margin: 0; padding: 0; width: 310px;}
.score-pros li { font-size: 12px; background: url(../images/check.png) no-repeat left 2px; padding: 0 0 0 20px; }
.pro-top { color: #66cc33; margin: 8px 0 0 0; font-size: 16px; }

.score-cons { margin: 0; padding: 0; width: 310px;}
.score-cons li {  font-size: 12px; background: url(../images/ex.png) no-repeat left 2px; padding: 0 0 0 20px; }
.con-top { color: #F00; margin: 8px 0 0 0; font-size: 16px; }
.bang-memopt { margin: 8px 0 0 0; }
.bang-memopt li { padding: 0 0 3px 0; font-size: 12px;}
.opts { border-bottom: 1px dotted #ccc; margin: 0 0 6px 0; }
.opt { font-size: 14px; color: #F93; }

#summary {  clear: both; overflow: visible; min-height: 1px; height: 230px; }
.weight { font: normal 11px 'UbuntuRegular', Arial, Helvetica, sans-serif; color: #999; letter-spacing: 0px; }

#final-score { float: left; position: relative; width: 390px; display: inline; }
#final-right { float: right; position: relative; width: 310px; display: inline; }
#score-shot { float: left; position: relative; display: inline; }
#score-last { float: right; position: relative; display: inline; margin: 0 0 8px 0;}
#final-score td span { font-size: 11px; color: #999; }
.setw { width: 310px; }

#conclusion { display: block; position: relative; padding: 0 12px; min-height: 1px; clear:both; background: #f7f7f7;}
#conclusion p { margin-top: 8px; }
.revby a { text-decoration: none; }

#bonus-sec h5 { display: block; height: 33px; font-size: 28px; line-height: 33px; color: #333; background: url(../images/bonusicon.png) no-repeat left center; padding: 0 0 0 40px; letter-spacing: -1px; margin-bottom: 0; }
#bonus-sec h5 a { text-decoration: none; }

#bonus-sec ul li { float: left; display: inline; margin: 10px 10px 0 0; width: 208px; }
.bonsite li { margin: 0; padding: 0; line-height: 12px; font-size: 12px; }
.bonsite li a { text-decoration: none; }
.bontitle span { font-size: 16px; font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal; line-height: 16px; }

.all-sites { clear: both; font-size: 12px; line-height: 12px; padding: 12px 0 2px 8px; }


/*  page footer  */

#footerwrap { clear: both; display: block; height: 157px; background: #353535 url(../images/footerbg.png) repeat-x center top; }
#finside { width: 990px; margin: 0 auto; padding: 50px 0 0 0; }
#finside h1 { float: right; display: inline; position: relative; width: 200px; height: 60px; text-indent: -5000px; background: url(../images/footerlogo.png) no-repeat left top; margin: 10px 0 0 0;}
#fleft { float: left; display: inline; position: relative; }
#fleft p { clear: both; color: #666; font-size: 10px; text-align: left; line-height: 14px; width: 660px; padding: 4px 0 0 0;}
#fleft p a { color: #666; text-decoration: none; }

#fmenu1 li { float: left; display: inline; margin: 0 16px 0 0; font-size: 18px; letter-spacing: -1px; font-family: 'UbuntuBold', Arial, Helvetica, sans-serif; font-weight: normal; font-variant: normal;}
#fmenu1 li a { color: #fff; text-decoration: none; }
#fmenu1 li a:hover { color: #999; }
.bar { color: #F93; font-size: 18px; }

#fmenu2 { clear: both; padding: 6px 0 0 0; }
#fmenu2 li { float: left; display: inline; margin: 0 12px 0 0; font-size: 12px;}
#fmenu2 li a { color: #F93; text-decoration: none; }
#fmenu2 li a:hover { color: #999; }
