/* Oh hi there. Thanks for visiting PatCat's CSS. Please don't steal my design. It's just not cool. Lots of hours, struggles, love, happiness... etc went into this. COLOUR LEGEND Greenness - #bbd145 */ /* RESETS -- Resets based on YUI and Eric Meyer and a few other places -------------------------------------------------------------- */ html {color:#fff; background:#000;}html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {background: transparent; border: 0; margin: 0; padding: 0; vertical-align: baseline;}ol, ul {list-style: none;}table {border-collapse: collapse; border-spacing: 0;}fieldset, img {border:0;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}/* Font resets */address,caption,cite,code,dfn,em,strong,th,var{font-style:normal; font-weight:normal;} h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;} input,textarea,select{font-family:inherit; font-size:inherit; font-weight:inherit;} body {font:14px arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;} table {font-size:inherit;font:100%;} pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}/* Nudge down to get to 13px equivalent for these form elements */ select, input, button, textarea {font:99% arial,helvetica,clean,sans-serif;}blockquote {quotes: none;}blockquote:before, blockquote:after {content: ''; content: none;}del {text-decoration: line-through;} /* 1140 styles */ .row {width: 100%;max-width: 1140px;min-width: 755px;margin: 0 auto;}.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {margin-right: 3.8%;float: left;min-height: 1px;}.row .onecol {width: 4.85%;}.row .twocol {width: 13.45%;}.row .threecol {width: 22.05%;}.row .fourcol {width: 30.75%;}.row .fivecol {width: 39.45%;}.row .sixcol {width: 48%;}.row .sevencol {width: 56.75%;}.row .eightcol {width: 65.4%;}.row .ninecol {width: 74.05%;}.row .tencol {width: 82.7%;}.row .elevencol {width: 91.35%;}.row .twelvecol {width: 100%;float: left;}.last {margin-right: 0px;}img, object, embed {max-width: 100%;}img {height: auto;}/* Mobile */@media handheld, only screen and (max-width: 767px) {body {font-size: 16px;-webkit-text-size-adjust: none;}.row, body, .container {width: 100%;min-width: 0;margin-left: 0px;margin-right: 0px;padding-left: 0px;padding-right: 0px;}.row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {width: auto;float: none;margin-left: 0px;margin-right: 0px;padding-left: 20px;padding-right: 20px;}} .row .row {min-width: auto;} /* LINKS -------------------------------------------------------------- */ a {text-decoration: none; color: #bbd145;} a:hover {text-decoration: underline;} /* BASE SIZES -- General 1024x768 resolution design for IE and various desktop users -------------------------------------------------------------- */ html, body {height: 100%;} .header {width: 100%;} .main {} .footer {clear: both;} /* BASE STYLES -------------------------------------------------------------- */ body {background: url(images/bg-python.jpg) top center no-repeat #000; color: #fff; font-family: Tahoma, Verdana, Arial, sans-serif;} .sitehug {background: url(images/bg-mesh.png) 0 0 repeat transparent;} h1, .h1, .h1 a {color: #fff; font-family: 'Open Sans', Tahoma, Verdana, Arial, sans-serif; font-size: 35px; line-height: 35px; padding: 30px 0 40px 0;} h2, .h2 {color: #999; font-family: 'Open Sans', Tahoma, Arial, sans-serif; font-size: 22px; padding: 0 0 5px 0;} h3, .h3, h3 a, .h3 a {color: #999; font-family: 'Open Sans', Tahoma, Arial, sans-serif; font-size: 18px; font-weight: normal; padding: 0 0 10px 0;} .page-content h1 {color: #999;} p, ul {padding: 0;} p {padding: 0 0 15px;} ul li {list-style: disc; padding: 0 0 5px 0;} strong {font-weight: bold;} hr {background-color: #b7b7b7; border: 1px solid #b7b7b7; color: #860000; margin: 0 0 10px;} blockquote {border-left: 2px solid #fff; margin: 0 0 15px 10px; padding: 0 0 0 10px;} .no-padding {padding: 0;} /* CONTAINER */ .container {margin: 0 auto; max-width: 2000px; min-height: 400px;} /* HEADER */ .header {margin: 10px 0 0 0; position: relative; z-index: 10;} /* hgroup */ .header .site-title {color: #002060; font-size: 30px; padding: 0; width: 107%;} .header .site-title a {} .header .share-widgets {padding: 25px 10px 4px; /* 8px header */} .share-widgets .fb-like-box {padding: 30px 15px;} .share-widgets .fb-like-box, .share-widgets .fb-like-box > span, .share-widgets .fb-like-box iframe {width: 100% !important;} .header .share-icons {clear: right; float: right; padding: 0 10px 10px;} .header .share-icons a {outline: none;} /* NAV */ .nav {background: rgba(187, 247, 0, 0.11); margin: 15px 10px 0 40px;} .nav ul li {list-style: none; margin: 0; padding: 0;} .nav ul li a {color: #fff; display: block; padding: 5px 15px; -webkit-transition: color 0.5s; -moz-transition: color 0.5s; -o-transition: color 0.5s; -ms-transition: color 0.5s; transition: color 0.5s;} .nav ul li a:hover {text-decoration: none; text-shadow: 0 0 8px #fff;} .nav ul li ul li {font-size: 12px; padding: 0 0 0 10px;} .nav ul li .sub-menu {display: none;} .nav .current_page_item .sub-menu, .nav .current-page-parent .sub-menu {display: block;} .nav .current_page_item > a {background-color: #bbd145; color: #000;} .nav .current-menu-parent > a {font-weight: bold;} .nav .current-page-parent a:hover {color: #fff;} .nav .current_page_item a:hover {color: #000;} /* SHARE WIDGETS */ .share-widgets ul li {list-style: none;} /* MAIN */ .main {padding: 0 10px 40px 0;} /* clear */ .main #side-a {float: left; width: 255px;} .main #content {float: left; min-height: 300px; padding: 10px 0 10px 10px; width: 675px;} .main #content ul {padding: 0 0 15px 40px;} .main #content .article {border-bottom: 1px solid #b7b7b7; margin-bottom: 20px; padding-bottom: 20px;} .main-content .page-sidebar {float: left; width: 15%;} .main-content .page-sidebar .sidebar-content {padding: 10px;} .main-content .page-content {float: left; width: 85%;} .main-content .the-content {padding: 10px 10px 0 0;} .main .column-1 {float: left; width: 65%;} .main .column-1 .column-content {padding: 15px 10px 10px 0;} .main-content .the-content ul li {margin: 0 0 5px 20px; padding: 0 0 0 5px;} .main .column-2 {float: left; width: 20%;} .main .column-2 .column-content {padding: 15px 10px 10px;} .main img {width: auto;} /* For IE. */ .content ul li {margin: 0 0 0 30px; padding: 0 0 5px 5px;} /* FOOTER */ .footer {background-color: rgba(0, 0, 0, 0.11); font-size: 11px; padding: 20px 0; text-align: center; width: 100%;} /* PAGES -------------------------------------------------------------- */ /* Gallery page */ .gallery {position: relative;} .gallery li {list-style: none;} .gallery ul li {float: left; margin: 0; padding: 1%; width: 14%;} /* Reptile products */ .themey-reptile-products .pre-title {color: rgb(137, 59, 196); font-family: "Mr Dafoe", "Brush Script MT", cursive; font-size: 42px; font-weight: normal; padding: 30px 0 20px 0; line-height: 53px; text-align: center; text-shadow: 0 0 10px rgba(0,0,0,.5);} .themey-reptile-products h1 {font-size: 30px; padding: 0 0 20px 0;} /* Post gallery video */ .youtube-video {Height: 0; margin-bottom: 15px; overflow: hidden; padding-bottom: 56.25%; /* 16/9 ratio */ padding-top: 30px; /* IE6 workaround*/ position: relative;} .youtube-video iframe, .youtube-video object, .youtube-video embed {height: 100%; left: 0; position: absolute; top: 0; width: 100%;} /* REUSABLES -------------------------------------------------------------- */ /* Blog images */ .wp-caption-text, p.wp-caption-text {padding: 5px; font-size: 8pt; margin: 0 !important;} .wp-caption {padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; margin: 10px; background-color: #eee;} .wp-caption img {padding: 5px;} /* Alignments in WordPress */ img.centered , .aligncenter {display: block; margin-left: auto; margin-right: auto;} img.alignright {padding: 5px 5px 5px 15px; display: inline;} img.alignleft {padding: 5px 15px 5px 5px; display: inline;} .alignright {float: right;} .alignleft {float: left;} /* Sprites */ /* Buttons */ .btn-cta, .sitehug .gform_wrapper .gform_footer input.button, .form-quote .button {background-color: #bbd145; border: 0; color: #000; cursor: pointer; font-size: 22px; padding: 12px;} .btn-cta:hover, .sitehug .gform_wrapper .gform_footer input.button:hover, .form-quote .button:hover {text-decoration: none; text-shadow: 0 0 8px #fff;} .form-quote .button {font-size: 18px;} /* Heroes */ .hero {padding: 25px 0 25px; position: relative;} .hero h2 {color: #bbd145; font-size: 28px;} .hero p {padding: 0 0 15px 20px;} .hero-a {background-color: rgba(187, 247, 0, 0.11); margin: 0 0 0 80px;} .hero-b {background-color: rgba(0, 0, 0, 0.11); margin: 0 80px 0 0;} .hero-main-slogan {font-family: 'Open Sans'; font-size: 34px; text-align: center; text-shadow: 0 0 10px rgb(120, 187, 0);} .hero .image-main {position: absolute; top: 3px; z-index: 10;} .hero .image-main img {height: 135px; width: 224px;} .hero-a .image-main {left: -95px;} .hero-b .image-main {right: -95px;} .hero .btn-cta {display: inline-block; margin-top: 30px;} .hero-content-center, .gform_wrapper .gform_footer {padding: 30px 0 30px 150px;} /* Create a centered version for order now */ /* Forms */ .form-quote .wpcf7-text, .form-quote .wpcf7-textarea {max-width: 96%;} .form-quote span.wpcf7-list-item {display: block;} .form-quote .row-form {list-style: none; padding: 0 0 10px;} .form-quote .row-form .col {float: left; width: 60%;} .form-quote .row-form .col-label {width: 40%;} .form-quote .row-form-heading {list-style: none;} .form-quote .row-form .gfield_radio {float: left; list-style: none; width: 60%;} .form-quote .row-form .gfield_radio li {list-style: none; margin: 0; padding: 0;} .form-quote .row-form .gfield_radio li input {width: auto;} .form-quote .validation_message {background: #DC3847; color: #000; margin: 5px 0 0 0; padding: 5px;} .form-quote .gf_progressbar_wrapper {padding: 0 0 10px;} .form-quote .gf_progressbar_percentage {background-color: #bbd145; color: #000;} .form-quote .gform_page_footer {padding: 10px 0;} .form-quote .gform_previous_button {float: left; width: 30%;} .form-quote .gform_next_button {float: right; width: 30%;} .form-quote--paging {max-width: 480px;} .form-quote--paging .gform_button {clear: both; margin: 10px 0 0 0; width: 100%;} .gform_validation_container {display: none!important; position: absolute!important; left: -9000px;} .wpcf7 .form-row, .gform_body .gfield {margin: 0; padding: 0 0 10px;} .wpcf7 .label, .gform_body .gfield_label {float: left; font-weight: normal; width: 150px;} .wpcf7 .element {float: left; width: 525px;} .wpcf7 .element input, .wpcf7 .element textarea, .gform_body input, .gform_body textarea {color: #666; width: 319px;} .wpcf7 .required, .gform_body .gfield_required {color: #860000;} .form-quote .wpcf7-not-valid-tip {background-color: transparent; border: 0 none; color: #f00; left: auto; padding: 10px; right: 0; top: -10px; width: 165px;} .wpcf7 .wpcf7-response-output {background-color: #860000; border: 0 none; color: #fff; margin: 0; padding: 10px;} /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;} .cboxIframe{width:100%; height:100%; display:block; border:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#000;} #colorbox{} #cboxTopLeft{width:14px; height:14px; background:url(images/controls.png) no-repeat 0 0;} #cboxTopCenter{height:14px; background:url(images/border.png) repeat-x top left;} #cboxTopRight{width:14px; height:14px; background:url(images/controls.png) no-repeat -36px 0;} #cboxBottomLeft{width:14px; height:43px; background:url(images/controls.png) no-repeat 0 -32px;} #cboxBottomCenter{height:43px; background:url(images/border.png) repeat-x bottom left;} #cboxBottomRight{width:14px; height:43px; background:url(images/controls.png) no-repeat -36px -32px;} #cboxMiddleLeft{width:14px; background:url(images/controls.png) repeat-y -175px 0;} #cboxMiddleRight{width:14px; background:url(images/controls.png) repeat-y -211px 0;} #cboxContent{background:#fff; overflow:visible;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;} #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;} #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;} #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(images/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;} #cboxPrevious{left:0px; background-position: -51px -25px;} #cboxPrevious:hover{background-position:-51px 0px;} #cboxNext{left:27px; background-position:-75px -25px;} #cboxNext:hover{background-position:-75px 0px;} #cboxClose{right:0; background-position:-100px -25px;} #cboxClose:hover{background-position:-100px 0px;} .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;} .cboxSlideshow_on #cboxSlideshow:hover{background-position:-150px 0px;} .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;} .cboxSlideshow_off #cboxSlideshow:hover{background-position:-125px 0px;} /* FlexSlider necessary styles */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider {margin: 0; padding: 0;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {width: 100%; display: block;} .flex-pauseplay span {text-transform: capitalize;} /* MEDIA QUERIES -- Resets based on YUI and Eric Meyer and a few other places-------------------------------------------------------------- */ @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { .sitehug {background-image: url(images/bg-mesh@2x.png);} } @media handheld, only screen and (max-width: 900px) { } @media handheld, only screen and (max-width: 767px) { } @media handheld, only screen and (max-width: 767px) { .hero {margin: 0;} .hero .image-main {position: static; text-align: center;} .nav {margin: 15px 20px;} .header .hgroup {float: none; text-align: center;} .header .site-title {width: 100%;} .header .site-title a {margin: 0 auto; width: 90%;} .share-widgets .fb-like-box {display: none;} .gform_wrapper .gform_footer {padding-left: 0; text-align: center;} } /* CUSTOM FONTS-------------------------------------------------------------- */ /* SCREEN READERS-------------------------------------------------------------- */ .screen-reader-text {position: absolute; left: -9000px;} /* CLEARING-------------------------------------------------------------- */ #container:after, .header:after, .main:after, .content:after, .meta:after, #menu:after, .nav-sub ul:after, .footer:after, .footer .menu:after, .main-content:after, .column-content:after, .post-gallery:after, .header .menu-header ul:after, .flex-control-nav:after, .row:after, .gform_page_footer:after, .row-form:after, .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0;} /* PRINT -- Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/-------------------------------------------------------------- */ @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ a, a:visited { color: #444 !important; text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ tr, img { page-break-inside: avoid; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3{ page-break-after: avoid; } #sidebar, #access, .frame{display: none;} .blog #main .ninecol {width: 100%;}}