/* * http://littlequiz.com/styles/main.css * * @copyright Littlequiz, 2009 * @author @davkell (www.ambientage.com) */ /** * ------------------------------- * Resets * ------------------------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus {outline: 0;} /** * --------------------------------- * Generic Elements * --------------------------------- */ body{background: #fff url('/images/bg_page.png') repeat-x; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; padding: 0px; margin-top: 0px; color:#35383d;} h1, h2, h3, h4 { font-family: Arial, Helvetica, sans-serif; } h1{} h2 { color:#133883; font: normal 34px/34px "Helvetica"; letter-spacing: -1px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: solid 1px #bdbdbd; } h3 { color:#133883; font: normal 28px/28px "Arial"; letter-spacing: -1px; } h4 { color:#133883; font: normal 20px/20px "Arial"; letter-spacing: -1px; margin-bottom: 1em;} p{} ul{list-style-type: none;} ul li{} ol{} ol li{} em{font-style: italic;} strong{} blockquote{} sup{} a:link { text-decoration: none; color : #35383d; border: 0px; text-decoration: underline; -moz-outline-style: none;} a:active { text-decoration: underline; color : #0099cc; border: 0px; -moz-outline-style: none;} a:visited { text-decoration: none; color : #35383d; border: 0px; text-decoration: underline; -moz-outline-style: none;} a:hover { text-decoration: underline; color : #025d87; border: 0px; -moz-outline-style: none;} a:focus { outline: none;-moz-outline-style: none;} /** * ------------------------------- * Generic Classes * ------------------------------- */ tr.alt td{background: #efefef;} tr.over td{background: #bcd4ec;} /** Form errors */ ul.errors{clear: both; display: block; margin: 10px 0;} ul.errors li{list-style-type: none; font-size: .8em; line-height: 1.2em; background: #fdd0d3;; border: 1px solid red; padding: 5px 10px;} p.error{width: 75%; margin: 1em auto; background: #fdd0d3; border: 1px solid red; padding: 10px 15px; text-align: center; } p.success{width: 75%; margin: 1em auto; background: #c6e4c5; border: 1px solid green; padding: 10px 15px; text-align: center; } p.info{width: 100%; } .form-error{font-size: .8em; background-color: #fdd0d3; border: 1px solid red; padding: 3px 5px; float: left; margin-top: 10px; clear: both;} .form-success{font-size: .8em; background: #c6e4c5; border: 1px solid green; padding: 3px 5px; float: left; margin-top: 10px; clear: both;} div.form-error,div.form-success {margin-top: 10px; } /* Alternate text for image based text */ .alt-text{margin-left: -3000px; width: 1px; height: 1px;} .access{display: none;} a.highlight-link, a.highlight-link:hover{color: #cd3e3f; text-decoration: underline; font-weight: 700;} img.aligncenter{text-align: center; margin: 0 auto;} /** * Buttons */ .button-grey{ background: url('/images/button_empty_grey.gif') no-repeat left; color:#fff; width: auto; border: none; /* border: 1px solid #E9EAEC; */font-size: 11px; text-align: center; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 8px 55px 8px 25px; cursor: pointer;} .button-white{background: url('/images/button_empty_white.gif') no-repeat left center; color:#fff; width: auto; border: 1px solid #fff; font-size: 11px; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 8px 35px 8px 15px; cursor: pointer;} .button-orange{background: url('/images/button_empty_orange.gif') no-repeat left center; color:#fff; text-align: center; width: 115px; border: 1px solid #F59436; font-size: 11px; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 9px 5px 9px 5px; cursor: pointer; } .button-sd{background: url('/images/button-sd.gif') no-repeat left center; color:#fff; text-align: center; width: 115px; border: 1px solid #FFFFFF; font-size: 11px; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 9px 5px 9px 5px; cursor: pointer; } /** * ------------------------------- * Layouts * ------------------------------- */ #container{width: 900px; margin: 0 auto 5em auto; min-height: 600px; clear: both;} #header{width: 900px; height: 119px; clear: both; margin: 0 auto; color: #fff;} #head-logo{float: left; width: 300px; height: 170px; } #logo-alt{margin-left: -1000px; width: 1px; height: 1px;} #head-nav{float: right; width: 550px; height: 40px; margin: 15px 0 0 0px; text-align: right; } #head-nav ul li{display: inline; margin-left: 8px; padding-left: 8px; border-left: 1px solid #659ed2; background-color: #5273b5} #head-nav ul li.first{border-left: none;} #head-nav ul li a{color: #fff; text-decoration: none;} /* -- non-WP pages -- */ #page-wrapper{width: 900px; margin: 0em 0 4em 0; float: left;} .content{float: left; width: 525px; margin: 0em 0 0 0;} .single-col-content{width: 900px;} .content h3{margin-bottom: 1em;} #page-wrapper #sidebar{margin: -142px 0 0 0;} #page-title{width: 535px; float: left; margin-top: 4em;} #page-title.single-col-content{width: 900px;} #thanks-image-holder{margin: 1em 0;} /** * WP Littlequiz blog theme specific * */ #content{width: 525px; float: left; margin: 0em 0 0 0;} .post{float: left; clear: both; width: 100%;} h2.page-title{color:#133883; font: normal 34px/34px "Helvetica"; letter-spacing: -1px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: solid 1px #bdbdbd; } .post-head { padding-bottom: 0px;} .post-head h1, .post-head h1 a, .post-head h1 a:visited { color:#133883; text-decoration: none; font: normal 34px/34px "Helvetica"; letter-spacing: -1px; } .post-head h1 a:hover { color:#0099cc; text-decoration: none; } .post-head h2 { color:#133883; font: normal 34px/34px "Helvetica"; letter-spacing: -1px; } .post-head h2 a, .post-head h2 a:visited { color:#133883; text-decoration: none;} .post-head h2 a:hover { color:#0099cc; text-decoration: none; } .post-head h3 { color:#133883; font: normal 28px/28px "Arial"; letter-spacing: -1px; } .post-head h3 a, .post-head h3 a:visited { color:#133883; text-decoration: none;} .post-head h3 a:hover { color:#0099cc; text-decoration: none;} .entry-meta{margin: 10px 0 10px 0; color: #999;} .post-time { width: 50px; padding-bottom: 10px; } .comments-link a, .comments-link a:hover{color: #cd3e3f;} .post-cat { font: normal 11px/14px 'Arial'; text-transform: uppercase; color:#999;} .post-cat a, .p-cat a:visited, .p-cat a:hover { text-decoration: underline; color:#999; padding-right: 5px;} .entry-meta-below{margin-bottom: 50px; color: #999;} .tag-icon{} .entry-meta-below a, .entry-meta-below a:visited{color: #cd3e3f;} .entry-content { /* border-top: solid 1px #dbdbdb; border-bottom: solid 1px #dbdbdb; */ padding: 10px 0; margin: 0 0 10px 0;} .content p, .entry-content p { font: normal 12px/19px "Verdana"; padding: 5px 0px; margin: 5px 0px;} .content ol, .entry-content ol { list-style: decimal inside; } .content ol, .entry-content ol { padding: 10px 0px 10px 25px; margin: 0px; } .content ol li, .entry-content ol li { padding: 2px 0px 2px 0px; } .content ul, .entry-content ul { padding: 10px 0px 10px 40px; margin: 0px; } .content ul li, .entry-content ul li { padding: 2px 0px 6px 5px; list-style-type: disc; color:#404040; } .content blockquote, .entry-content blockquote { font: italic 14px/19px Georgia, "Times New Roman", Times, serif; padding: 10px 20px; margin: 10px 0px; background: #A9C8E5; } .content blockquote p, .entry-content blockquote p { font: italic 14px/19px Georgia, "Times New Roman", Times, serif; } .content blockquote li, .entry-content blockquote li { padding: 2px 0px 2px 13px; list-style-type: none; font-size: 12px; line-height: 17px;} .entry-content img{border: 2px solid #dbdbdb;} .entry-content .alignleft{float: left; margin: 0px 15px 15px 0;} .entry-content .alignright{float: right; margin: 0px 0px 15px 15px;} /** * next / previous page / post nav */ #nav-below{width: 480px; float: left; margin: 2em 0; padding: 10px 20px; border: 1px solid #bdbdbd; background-color: #efefef; clear: both;} #nav-below a, #nav-below a:hover{color: #5273B5;} .nav-previous{float: left; width: 40%; text-align: left;} .nav-next{float: right; width: 40%; text-align: right;} /** * Blog Sidebar --*/ #sidebar{width: 300px; float: right; margin: -80px 0 0 0;} #blog-logo{width: 302px; height: 218px; background: url('../images/logo_blog.png') no-repeat;} h3#blog-logo-text{width: 80%; float: right; margin: 120px 0 0 0; font-size: 1.25em; line-height: 1.2em; font-family: verdana, sans-serif;} #blog-logo-text a, #blog-logo-text a:hover{color: #333; text-decoration: none;} #top-side-panel{background: url('/images/bg_categ_panel.png') repeat-x; height: 218px; padding-top: 10px; margin-bottom: 5px; } #lq-social{ margin: 0; padding: 0 25px 10px 25px; border-bottom: 1px solid #DBDBDB; width: 80%} #lq-social ul{text-align: center;} #lq-social ul li{display: inline; list-style-type: none; margin-left: 10px;} /* Categories & Archives ( Based on Compisito theme ) */ #sidebar .categs {overflow: hidden; padding: 15px; margin-bottom: 3px;} #sidebar .categs div { float: left; width: 130px;} #sidebar .categs div h3 { font: bold 15px/15px 'Arial'; letter-spacing: -1px; color:#cd3e3f; padding-bottom: 5px;} #sidebar .categs div li { padding: 1px 0px; list-style-type: none; font-size: 11px; color:#5e8a89; } #sidebar .categs div a, #sidebar .categs div a:visited { color:#133883; text-decoration: underline;} #sidebar .categs div a:hover { color:#003333; text-decoration: underline;} /* Take quiz */ #quiz-now{width: 300px; height: 175px; background-color: #a9c8e5; margin-bottom: 5px; padding: 10px 0;} #quiz-now li{list-style-type: none; display: block;} #quiz-now #quiz-now-content{padding: 0 5px; line-height: 1.4em;} #quiz-now a, #quiz-now .textwidget a:hover{color: #cd3e3f; text-decoration: underline;} #quiz-now #quiz-now-content img{float: left; margin: 5px 10px; width: 75px; height: 75px;} #quiz-now p{margin-top: 10px; padding: 10;} /* Newsletter sub */ #blog-mail-subscribe{width: 280px; height: 165px; padding: 15px 10px; background: #f59436 url('/images/icon_little_pig.png') no-repeat center left; margin-bottom: 5px;} #blog-mail-subscribe h3{margin-bottom: 0px; line-height: 15px;} #blog-mail-subscribe p{float: right; width: 66%; clear: both; margin: 10px 0 15px 0;} #blog-mail-subscribe a, #blog-mail-subscribe a:hover{color: #fff; text-decoration: underline;} #blog-mail-subscribe #sub-holder{float: left; clear: both; width: 100%; margin-top: 5px;} /* Recent */ .recent { background: #c2e56f; padding: 15px; min-height: 300px; margin: 10px 0 5px 0; } #sidebar .recent .tabs { overflow: hidden; margin-bottom: 10px;} #sidebar .recent .tabs { height: 1%; } #sidebar .recent .tabs li { float: left; background: none; } #sidebar .recent .tabs li a { float: left; font: bold 14px/14px "Arial"; color: #5273B5; padding: 3px 6px 9px 6px; background: #fff url(/images/tabs-inactive.png) no-repeat bottom center; margin-right: 3px; letter-spacing: -1px; text-decoration: none;} #sidebar .recent .tabs li a.active, #sidebar .recent .tabs li a:hover { background: #5273B5 url(/images/tabs-active.png) no-repeat bottom center; color: #fff; text-decoration: none; } #sidebar .recent a, #sidebar .recent a:visited { color:#247682; text-decoration: underline;} #sidebar .recent a:hover { color:#003333; text-decoration: underline;} #tab-comments { display: none; margin-bottom: 5px; } #tab-comments li { background: url(/images/tabs-arrow.png) no-repeat left 10px; padding: 4px 0px 4px 6px; font-size: 11px; color:#5e8a89;} #tab-comments li a { display: block;} #tab-posts { margin-bottom: 5px; font-size: 11px; } #tab-posts li { background: url(/images/tabs-arrow.png) no-repeat left 8px; line-height: 14px; padding: 1px 0px 1px 6px;} #tab-tags { display: none; margin-bottom: 5px; font-family: "Verdana"; line-height: 22px;} /* Tshirt Promo 8*/ #tshirt-promo{height: 100px; width: 300px; float: left; padding: 15px 0; margin-bottom: 10px; background: #fee302 url('/images/icon_tshirt.png') no-repeat bottom left} #tshirt-promo h3{float: right; width: 180px;} #tshirt-promo p{float: right; width: 66%;} /* Test 1*/ #Test-one {height: 100px; width: 300px; float: left; padding: 15px 0; margin-bottom: 10px; background: #green url('/images/test_one.png') no-repeat bottom left} #Test-one h3{float: right; width: 180px;} #Test-one p{float: right; width: 66%;} /** * -- Comments Form -- */ .comments-form { background: #d8e5f2 /*#e1f4fc*/; padding: 20px; margin: 10px 0px; float: left; clear: both; width: 480px} .comments-form h3 { color:#133883; font: normal 28px/28px "Arial"; letter-spacing: -1px; padding-bottom: 5px; margin-bottom: 5px; border-bottom: solid 1px #c5e1ed; } .comments-form p { padding: 7px 0px; color:#808080;} .comments-form .required { font-weight: normal; color:#ff0000;} .comments-form input { padding: 5px; width: 210px; margin-right: 7px; } .comments-form input.formid { border: 1px solid #a8d3e4; background: #fff ; padding: 5px 5px 5px 40px;} .comments-form input.formemail { border: 1px solid #a8d3e4; background: #fff; padding: 5px 5px 5px 40px;} .comments-form input.formuri { border: 1px solid #a8d3e4; background: #fff ; padding: 5px 5px 5px 40px;} .comments-form textarea { border: 1px solid #a8d3e4; background: #fff; padding: 4px; width: 97%;} .comments-form .button { background: url('/images/button_empty.gif') no-repeat left; color:#fff; width: auto; border: 1px solid #d8e5f2; font-size: 11px; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 8px 25px 8px 25px; cursor: pointer;} /** * -- Comments -- */ .comments-list { padding-top: 20px;} .comments-list h2 { color:#272d36; font: normal 28px/28px "Arial"; letter-spacing: -1px; padding-bottom: 20px;} .comments-list div.entry { margin-bottom: 15px; padding: 25px; border: 1px solid #dcedf0; background: #fff /* url(images/comments-list-entry-bkg.png) no-repeat right bottom */;} .comments-list div.alt { background: #D2E3F2 url(images/comments-list-alt-bkg.png) no-repeat left top; padding-top: 40px; border: none; margin-bottom: 25px;} .comments-list p.name { font: bold 12px/12px "Verdana"; letter-spacing: -1px; color:#133883;} .comments-list p.avt { padding: 0px; margin: 0px; float: right;} .comments-list p.avt img { border: solid 1px #ccc;} * html .comments-list p.avt { left: -60px; } .comments-list p.date { font-size: 11px; margin-bottom: 5px;} .comments-list p.date a, .comments-list p.date a:visited, .comments-list p.date a:hover { color:#808080; text-decoration: none;} .comments-list .con { font: normal 12px/17px "Verdana"; margin-right: 90px; color:#333;} .comments-list .con p { font: normal 12px/17px "Verdana"; padding: 5px 0px; margin: 0px; color:#333;} .comments-list .con blockquote { font: italic 14px/19px Georgia, "Times New Roman", Times, serif; color:#666; margin: 10px 20px; } .comments-list .con blockquote p { font: italic 14px/19px Georgia, "Times New Roman", Times, serif; color:#666; } /** -- Footer -- **/ #footer-wrapper{background-color: #5273B5; width: 100%; float: left; clear: both; height: 241px; margin-top: 3em;} /* -- Because of page layout differences - homepage needs its own wrapper -- */ #home-footer-wrapper{background-color: #5273B5; width: 100%; float: left; clear: both; height: 241px; margin-top: 0;} #footer{ width: 900px; clear: both; height: 241px; background: #5273B5 url('../images/footer_monkey.gif') no-repeat bottom left; margin: 0 auto;} .footer-block{width: 200px; float: left; margin: 5em 0 0 2em} #footer-legal{margin-left: 250px;} .footer-block ul{margin: 2em 0 0 0;} .footer-block ul li{margin: 0 0 1em 0 ; color: #fefefe} .footer-block ul li a, .footer-block ul li a:visited{color: #fff; text-decoration: none;} .footer-block ul li a:hover{text-decoration: underline;} #footer #fine-print {text-align: center; font-size: .8em; color: #ddd; padding-top: 1em;} /** * -------------------- * Homepage specific * -------------------- */ body#home{background: #fff url('/images/bg_home.png') repeat-x top;} #home-head-logo{float: left; width: 300px; height: 100px; } #logo-alt{margin-left: -1000px; width: 1px; height: 1px;} #home-top-panel{background: url('/images/home_monkey_main.png') no-repeat; width: 900px; height: 230px; margin-top: 7px; clear: both; float: right;} #home-top-panel div{width: 50%; float: right; margin-top: 5px;} #home-top-panel div h2{margin-top: 20px; margin-bottom: 0px; border: none; font-size: 1em; line-height: 1em;} #home-top-panel div#pimpbox{width: 100%; float: left; clear: both; height: 60px; text-align: center;} #quiz-holder{background-color: #fff; min-height: 400px; float: left; clear: both;width: 900px;} #home-prize-panel{float: left; width: 45%; margin: 40px 0 0 0; min-height: 40px;} #home-quiz-panel{float: right; width: 45%; margin: 40px 0 0 0; min-height: 40px;} /** -- Scrollable Homepage -- */ /** * @link http://flowplayer.org/tools/scrollable.html */ /* required settings (Done via JS now for degradation */ /* div#quiz-content { position:relative; overflow:hidden; width: 900px; min-height:320px; } div#quiz-content form#quiz-answers{ width:20000em; position:absolute; } div#quiz-content form#quiz-answers div.quiz-content-panel { float:left; width: 900px;} */ #scroll-nav{width: 45%; float: right; margin: 0px 0 0px 0px ;padding: 0 0 0px 0; height: 100px;} #scroll-nav a {float:right;} #scroll-nav a img{clear: both; float: right; cursor: pointer;} #scroll-nav a.previous, .quiz-question-panel a.previous{float: right; cursor: pointer; display: block; width: 50px; color: #999; text-decoration: underline; margin: 8px 15px 0 0px;} .quiz-question-panel a.previous{margin-top: 53px;} /* to fit with #quiz-submit */ a.hint-button{display: block; clear: right; margin-top: 15px; height: 32px;} .quiz-image-panel{float: left; width: 45%; min-height: 300px;} .quiz-question-panel{float: right; width: 45%; min-height: 180px;} .quiz-question-panel table{width: 100%; border-collapse: collapse;} .quiz-question-panel table tr th{text-align: left; padding-bottom: 1em; font-weight: bold} .quiz-question-panel table tr td{padding: 4px 3px; width: 90% } .quiz-question-panel table tr.no-hover td{padding: 2px 0; cursor: auto;} .quiz-question-panel table tr td.ans-input-cell{width: 5%;} p.space{height: 60px; margin-bottom: 10px; width: 90%; background-color: red;} #quiz-submit{ float: right; background: url('/images/button_empty_white.gif') no-repeat left center; color:#fff; width: auto; border: 1px solid #fff; font-size: 11px; font-weight: bold; font-family: arial, helvetica, sans-serif; padding: 8px 21px 8px 15px; cursor: pointer; margin-top: 45px;} td p.form-error{margin-top: 50px;} #home-content-bar-wrapper{width: 100%; float: left; clear: both; min-height: 200px; padding: 2em 0; background-color: #e9eaec;} div#home-content-bar{width: 900px; margin: 0 auto; background-color: #e9eaec; min-height: 200px; } .home-content-bar-sect{width: 45%;} #home-hint{float: left;} #home-subscribe{float: right;} .home-content-bar-sect p{margin-top: 20px; line-height: 1.6em} /** * ----------------------- * Login & Registration * ----------------------- */ #login-holder{width: 300px; min-height: 200px; float: left; margin: 2em 0 0 0; background-color: #fefefe; border: 1pt solid #eee; padding: 1em;} div.login-form{margin-top: 2em;} div.login-form div{float: left; clear: both; width: 80%; margin-bottom: 1em ;} #login-holder label{float: left; font-size: 1em; } #login-holder input{float: right;} #login-holder fieldset{float: left; clear: both; width: 100%} #login-holder fieldset #submit{float: right;} div.remember{font-size: .9em;} #login-holder div.remember input{float: right;} #login-holder div.remember label{text-align: right; margin-right: 1em; width: 85%;} #login-holder .login-group{margin-bottom: 0;} #login-holder #submit{margin-bottom: 0; padding-bottom: 0; } #login-holder #submit #login{margin-right: -10px; width: 140px;} #password-reminder{float: left; width: 90%; margin-top: 15px; } #registration-holder{width: 350px; min-height: 200px; float: right; margin: 2em 0 0 0; background-color: #fefefe; border: 1pt solid #eee; padding: 1em;} div.reg_form{margin-top: 2em;} div.reg_form div{float: left; clear: both; width: 90%; margin-bottom: 1em;} div.reg_form .hint{margin: 0 0 0 0; font-size: .9em; line-height: 1.2em;} #registration-holder input{ float: right;} #registration-holder label{ float: left; font-size: 1em; } #registration-holder fieldset{float: left; clear: both; width: 100%;} #registration-holder #register{margin-right: -10px; width: 140px;} #login-holder h3, #registration-holder h3, #suggest-form h3, .instruction-panel h3{text-align: center;} /** * ------------------------ * Account * ------------------------ */ #win-history{float: left; width: 90%; min-height: 300px;} #winner-table{width: 80%;} #winner-table tr th{color: #133883; font-weight: bold;} #winner-table tr td{padding: 3px 5px; width: 100px; text-align: center;} #winner-table tr td img{} #logout-box{float: right; width: 275px; background-color: #fefefe; border: 1pt solid #eee; padding: 1em; margin: 2em 0 1em 0; clear: right;} #profile-password{float: right; width: 275px; background-color: #fefefe; border: 1pt solid #eee; padding: 1em;} div.pw-change-group div{clear: both; width: 100%;} div.pw-change-group div label{font-size: .9em; float: left;} div.pw-change-group div input{float: right; margin-bottom: 10px;} /** * social */ #social-sub-form, #social-connect{float: left; clear: both; width: 100%; margin-bottom: 4em;} .subscribe-g{width: 450px; float: left; clear: both;} .subscribe-g div{width: 200px; float: left;} #submit-holder{margin-top: -4px;} div.social ul li{margin-bottom: 20px;} div.social ul li img{margin-bottom: -10px; } #social-connect ul li a img, .social ul li a img{border: none;}