/* Theme Name: POD Theme URI: www.pioneersofdigital.com Description: Theme for www.pioneersofdigital.com Version: 1.5 Author: Kean Richmond Author URI: http://www.bronco.co.uk */ /*---------------------------------------------------- RESET.CSS CREATED: Wed 19.12.07 @ 11:09 a.m. AUTHOR: Kean Richmond ----------------------------------------------------*/ html, * {margin:0; padding:0;} h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;} fieldset, iframe, img {border:0;} table {border-collapse:collapse; border-spacing:0;} th {font-style:normal; font-weight:normal; text-align:left;} ol,ul {list-style:none;} cite {font-style:normal;} a {outline:none;} header, section, footer, aside, nav, article, figure {display: block;} /*---------------------------------------------------- SCREEN.CSS ----------------------------------------------------*/ @font-face {font-family:"Waukegan"; src:url("fonts/Waukegan_LDO_Extended_Bold.eot") format("eot"), url("fonts/Waukegan_LDO_Extended_Bold.woff") format("woff"), url("fonts/Waukegan_LDO_Extended_Bold.ttf") format("truetype"), url("fonts/Waukegan_LDO_Extended_Bold.svg") format("svg"); font-weight:normal; font-style:normal;} /*--- 1-0. Common Elements ---------------------------------------------------------------------------*/ html {font-size:62.5%;} body {background:#FFFFFF; color:#666666; font-family:Arial, Helvetica, sans-serif;} a {color:#00AEEF;} a:hover {color:#333; text-decoration:none;} /*--- 1-2. Main Layout ---------------------------------------------------------------------------*/ /*--- 1-3. Table ---------------------------------------------------------------------------*/ /*--- 1-4. Form Elements ---------------------------------------------------------------------------*/ form p {height:100%; overflow:hidden;} label {color:#333; display:block; font-size:14px; font-size:1.4rem; font-weight:bold; margin-bottom:5px;} input[type='text'], textarea {background:#D6D6D6; border:0; border-radius:5px; color:#616161; float:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; margin-bottom:9px; padding:10px 10px 11px 10px;} input[type='text'] {max-width:65%; width:320px;} textarea {max-width:65%; width:420px;} input[type='submit'] {background:#00AEEF; border:0; border-radius:5px; color:#FFF; cursor:pointer; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; height:33px; width:100px;} input[type='submit']:hover {background:#000;} .hidden, .optional, .required {background:url(img/_hintsvalidation.png) 0 -48px no-repeat; display:block; float:left; height:6px; margin:15px 5px 0 10px; text-indent:-9999px; width:42px;} .hidden {background-position:0 -36px; width:33px;} .optional {background-position:0 -42px;} /*--- 1-5. Response Elements ---------------------------------------------------------------------------*/ .wpcf7-response-output {color:#FFF; cursor:pointer; border-radius:5px; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-size:1.1rem; font-weight:bold; position:relative; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;} .wpcf7-validation-errors {background:url(img/_error.png) 10px 8px no-repeat #D95D5D; margin:10px 0; padding:9px 20px 9px 37px;} .wpcf7-mail-sent-ok {background:url(img/_success.png) 10px 10px no-repeat #99C563; margin:10px 0; padding:9px 20px 9px 37px;} .wpcf7-not-valid-tip, .wpcf7-not-valid-tip-no-ajax {display:none;} /*--- 1-6. Skip Link ---------------------------------------------------------------------------*/ /*--- 1-7. Tooltip ---------------------------------------------------------------------------*/ /*--- 1-8. Clearfix ---------------------------------------------------------------------------*/ * html .clearfix {height:1%; overflow:visible;}/* float clearing for IE6 */ *+html .clearfix {min-height:1%;}/* float clearing for IE7 */ .clearfix:after {clear:both; content:"."; display:block; height:0; font-size:0; visibility:hidden;} /*--- 2. SITEWIDE ELEMENTS ----------------------------------------------------------------------------------------------------------------------------------------*/ /*--- 2-1. Layout ---------------------------------------------------------------------------*/ .gc {max-width:960px; margin:0 5%;} /*--- 2-2. Header ---------------------------------------------------------------------------*/ header {height:100%; overflow:hidden;} .logo {display:block; margin:20px auto; width:154px;} .top-bar {background:#000; padding:10px 0;} header select {margin-top:5px; width:100%;} .social {clear:both;} .social li {float:left; margin:13px 10px 5px 0;} .social a {background:url(img/_sprite.png) center 0 no-repeat; display:block; height:25px; text-indent:-9999px; width:25px;} .social a:hover {opacity:0.7;} .social a.social-twitter {background-position:center -30px;} .social a.social-facebook {background-position:center -60px;} .social a.social-youtube {background-position:center -90px;} .social a.social-googleplus {background-position:center -159px;} .fb-like {margin-top:2px;} /*--- 2-3. Footer ---------------------------------------------------------------------------*/ footer {border-top:10px solid #E5E5E5; border-top:10px solid rgba(0,0,0,0.1); clear:both; color:#999; font-family:"Times New Roman", Times, serif; font-size:12px; font-size:1.2rem; margin-top:40px; padding:7px 0 40px 0; text-transform:uppercase;} footer a {color:#999; text-decoration:none;} footer a:hover {color:#000;} /*--- 2-4. Content ---------------------------------------------------------------------------*/ .content p {font-size:14px; font-size:1.4rem; line-height:1.6em; padding:6px 0;} .content li {font-size:14px; font-size:1.4rem; line-height:1.6em; padding:6px 0;} .content img {height:auto; max-width:100%;} .content object, .content embed {max-width:100%;} /*--- 2-5. Article & Page ---------------------------------------------------------------------------*/ article, .page {padding:27px 0 34px 0;} article h1, article h2, .page h1 {color:#00AEEF; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:40px; font-size:4rem; line-height:0.98em; margin-bottom:23px;} article h2 a {text-decoration:none;} article time {font-size:12px; font-size:1.2rem;} .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 {color:#333; clear:left; font-family:Arial, Helvetica, sans-serif; margin:20px 0 5px 0;} .entry h1 {font-size:36px; font-size:3.6rem;} .entry h2 {font-size:28px; font-size:2.8rem;} .entry h3 {font-size:24px; font-size:2.4rem;} .entry h4 {font-size:20px; font-size:2rem;} .entry h5 {font-size:16px; font-size:1.6rem;} .entry h6 {font-size:14px; font-size:1.4rem;} .entry ul, .entry ol {margin:20px 20px;} .entry ul {list-style:square;} .entry ol {list-style:decimal;} .entry .alignleft {float:left; margin:0 10px 10px 0;} .entry .alignright {float:right; margin:0 0 10px 10px;} blockquote {border-left:5px solid #CCCCCC; padding:0 0 0 10px; margin:10px 0;} cite {font-style:italic;} .post-social {margin-bottom:23px;} .twitter-share-button {margin-bottom:-6px;} .more-link {background:#00AEEF; border-radius:5px; color:#FFF; font-size:14px; font-weight:bold; padding:8px 12px; text-decoration:none;} .more-link:hover {background:#000; color:#FFF;} /*--- 2-6. Sidebar ---------------------------------------------------------------------------*/ .sidebar {font-size:12px; font-size:1.2rem;} .sidebar li {border-bottom:1px solid #E5E5E5; padding:23px 0 20px 0;} .sidebar li ul {} .sidebar li li {border:0; padding:4px 0;} .sidebar h6 {color:#000; font-size:14px; font-size:1.4rem; margin-bottom:8px;} .sidebar a {color:#999; text-decoration:none;} .sidebar a:hover {color:#00AEEF;} .sidebar label {display:none;} .sidebar input[type='text'] {max-width:none; width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;} /*--- 3. PAGE LEVEL ELEMENTS --------------------------------------------------------------------------------------------------------------------------------------*/ /*--- 3-1. Index ---------------------------------------------------------------------------*/ .book-info .gc {border-bottom:1px solid #E5E5E5; border-color:rgba(0,0,0,0.1); padding-bottom:20px;} .book-img {text-align:center;} .book-img img {margin:10px 0; max-width:90%;} .book-text h1 {color:#00AEEF; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:60px; font-size:6rem;} .book-text h2 {color:#000; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:18px; font-size:1.8rem; margin-top:3px;} .book-text h3 {border-bottom:1px solid #E5E5E5; border-color:rgba(0,0,0,0.1); color:#CCC; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:36px; font-size:3.6rem; margin-top:20px; padding-bottom:11px;} .book-text label {font-size:18px; font-size:1.8rem; margin-top:17px;} #index input[type='text'] {float:none;} .index-content h4, .meetthepioneers h4 {color:#000; font-size:16px; font-size:1.6rem; margin:46px 0 7px 0;} .index-content p {font-size:12px; font-size:1.2rem; line-height:normal;} #index-authors li {font-size:12px; font-size:1.2rem; line-height:normal; overflow:auto;} #index-authors img {float:left; margin:0 10px 10px 0;} #index-feeds {margin-bottom:20px;} #index-feeds article {padding:0;} #index-feeds h5 {padding-top:6px;} #index-feeds h5 a {font-size:14px; font-size:1.4rem; text-decoration:none;} time {color:#999; display:block; margin-top:-2px; text-transform:uppercase;} #index-feeds article p, #index-feeds li {font-size:12px; font-size:1.2rem; line-height:normal; padding-top:2px;} .footer-subscribe {border-top:1px solid #E5E5E5; border-color:rgba(0,0,0,0.1); clear:both; padding-top:25px;} .buythebook {background:#00AEEF; border-radius:5px; color:#FFF; display:block; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:32px; font-size:3.2rem; margin:20px 0; padding:22px 0; position:relative; text-align:center; text-decoration:none; width:100%; z-index:5;} .buythebook:hover {background:#000; color:#FFF;} .meetthepioneers {border-top:1px solid #E5E5E5; border-color:rgba(0,0,0,0.1); clear:both;} .meetthepioneers h4 {margin-top:25px;} .meetthepioneers ul {height:100%; margin:0 -10px 20px -10px; overflow:hidden;} .meetthepioneers li {float:left; height:100px; margin:10px; overflow:hidden; width:100px;} .ngg-galleryoverview {height:100%; margin:10px 0 20px 0; overflow:hidden;} .ngg-gallery-thumbnail-box {float:left; margin:5px 0 0 5px; position:relative; z-index:5;} .ngg-gallery-thumbnail-box img {float:left;} .subscribe-new {border-bottom:1px solid #E5E5E5; height:100%; margin-top:30px; overflow:hidden; padding-bottom:30px; position:relative; z-index:2;} /*--- 3-2. Comments ---------------------------------------------------------------------------*/ #comments h3, #commentform h3 {color:#CCC; font-size:36px; font-size:3.6rem; font-family:"Waukegan", Arial, Helvetica, sans-serif; padding:0 0 20px 0;} #comments li {height:100%; overflow:hidden; padding:0 0 50px 60px; position:relative;} .avatar {border:5px solid #000; float:left; margin:0 0 0 -60px;} #comments cite {font-size:14px; font-size:1.4rem; font-style:normal; font-weight:bold; padding:1px 0 2px 0;} #comments cite a {color:#333333; text-decoration:none;} #comments cite a:hover {color:#00AEEF;} #comments li p {line-height:1.2em; font-size:12px; font-size:1.2rem; padding:7px 0;} .comment-meta-author {line-height:2.2em; font-size:11px; font-size:1.1rem; margin-top:4px;} .comment-reply-link {background:#D6D6D6; border-radius:3px; color:#5D5D5D; float:left; font-size:12px; font-size:1.2rem; margin-right:5px; padding:0 19px; text-decoration:none;} .comment-reply-link:hover {background:#00AEEF; color:#FFF;} .bypostauthor-email .avatar, .bypostauthor .avatar {border-color:#00AEEF;} .bypostauthor-email cite, .bypostauthor cite {color:#00AEEF;} #commentform {margin-bottom:40px;} #commentform p {margin-top:10px;} #commentform textarea {height:200px;} #commentform input[type='submit'] {width:140px;} .cancel-comment-reply a {color:#999; font-size:11px; font-size:1.1rem; margin-left:5px; text-decoration:none;} .cancel-comment-reply a:hover {color:#00AEEF;} /*--- 3-3. Archive ---------------------------------------------------------------------------*/ #archive h1 {color:#CCC; font-family:"Waukegan", Arial, Helvetica, sans-serif; font-size:48px; font-size:4.8rem; margin-top:30px;} #archive article h2 {font-size:24px; font-size:2.4rem; margin-bottom:0;} /*--- 3-4. Paging ---------------------------------------------------------------------------*/ #paging {height:100%; margin-bottom:40px; overflow:hidden;} #paging a {background:#00AEEF; border-radius:5px; color:#FFF; display:block; font-size:14px; font-weight:bold; padding:8px 12px; text-decoration:none;} #paging a:hover {background:#000; color:#FFF;} #older {float:left;} #newer {float:right;} /*--- 4. MEDIA QUERIES ------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*--- 4-1. 720px Tablet ---------------------------------------------------------------------------*/ @media screen and (min-width:740px) { .logo {float:left;} nav li {float:left; margin-right:20px; margin-top:14px; position:relative;} nav a {color:#BABABA; display:block; font-size:14px; font-size:1.4rem; padding:3px 0; text-decoration:none;} nav a:hover, .current_page_item a {color:#00AEEF;} nav .parent a:after {background:url(img/_sprite.png) center -130px no-repeat; content:" "; float:right; height:4px; margin:6px 0 0 7px; width:7px;} nav .parent li a:after {display:none;} nav li ul {background:#000; display:none; left:-10px; top:35px; padding:5px 10px; position:absolute; width:150px; z-index:11;} nav li li {border-bottom:1px solid rgba(255,255,255,0.2); float:none; margin:0;} nav li li:last-child {border-bottom:0;} .book-text h1 {margin-top:60px;} .book-img {float:right;} .book-text {float:left; width:65%;} #index-authors {float:left; width:48%;} #index-feeds {float:right; width:48%;} .two-col-outer {float:left; margin-right:-220px; width:100%;} .two-col-inner {margin-right:220px; padding-right:10%;} .sidebar {float:right; width:220px;} .entry ul, .entry ol {margin-left:-10px;} .entry li {padding-left:10px;} #index .footer-subscribe input, .subscribe-new input {float:left!important; margin-right:5px;} .footer-subscribe input[type='submit'], .subscribe-new input[type='submit'] {height:36px;} footer {margin-top:20px;} } /*--- 4-2. 960px Desktop ---------------------------------------------------------------------------*/ @media screen and (min-width:960px) { .logo {margin-top:40px;} footer {text-align:right;} nav li {margin-right:40px;} .top-bar {height:50px; padding:0;} .social {clear:none; float:right; margin-right:-20px;} .social li {margin-left:10px; margin-right:0;} .book-info .gc {padding-bottom:80px; position:relative;} .book-img {background:url(img/_book_main.png) right 0 no-repeat; background-size:100% auto; height:553px; max-width:75%; position:absolute; right:5%; top:-100px; width:554px;} .book-img img {display:none;} .book-text {float:left; width:auto;} .book-text h1 {margin-top:80px;} .book-text h2 {text-align:right;} .book-text h3 {margin-top:37px;} .index-content {float:left!important; margin-bottom:20px; margin-left:2%; width:32%!important;} #index-welcome {margin-left:0;} h4.latest-tweet {margin-top:13px;} .ngg-galleryoverview {margin-bottom:0; width:65%;} } /*--- 4-3. 1000px Desktop ---------------------------------------------------------------------------*/ @media screen and (min-width:1000px) { .gc {margin:0 auto;} }