/* * * Theme Name: Suntory Garden Club [Beta] * Description: Custom WordPress consumer theme for Suntory Flowers, based on Divi. * Version: 0.2 * Template: Divi * Text Domain: sgc_test * Author: MJAD * Author URI: http://masarjohnston.com/ * Revised: 20241019, MJAD - created, based on sf * */ /* Remove sidebar lines */ #main-content .container:before { width:0; } .et_pb_widget_area_right { border-left:0 !important; } .et_pb_widget_area_left { border-right:0 !important; } /* ************************************************** * * ALIGNMENTS */ .alignleft { display:inline; float:left; margin-right:1.5em; } .alignright { display:inline; float:right; margin-left:1.5em; } .aligncenter, .center { display:block; float:none; clear:both; margin-left:auto; margin-right:auto; } .img-left { margin:0 33px 0 0 !important; float:left; } .img-right { margin:0 0 0 33px !important; float:right; } /* ************************************************** * * COLOR PALETTE */ .wht, .white { color:#ffffff; } .blu, .blue { color:#4fc6db; } .gry, .grey { color:#999999; } .blk, .black { color:#4fc6db; } .text-white { color:#ffffff !important; } .text-dark { color:#443f3f !important; } /* ************************************************** * * MAIN ELEMENTS */ *, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } a, a:link { color:#333; text-decoration:none; outline:0; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; } a:active, a:hover, a:focus { color:#333; text-decoration:none; outline:0; } body { color:#333; font-weight:200; font-size:2.5vw; line-height:1.6; font-family:'EB Garamond', 'Times New Roman', Times, serif; background:#fff; } embed, iframe, object { max-width:100%; } img { max-width:100%; height:auto; } .footer-widgets .widget ul, .widget-area .widget ul { list-style:none; padding:0; } .widget .children { padding-left:15px; } b, strong { font-weight: 800; } h1 { font-size:6.0vw; } h2 { font-size:5.7vw; } h3 { font-size:5.0vw; } h4 { font-size:4.0px; } h5 { font-size:3.0px; } h6 { font-size:2.5vw; } h1, h2, h3, h4, h5, h6 { display:block; color:#333; font-weight:200; line-height:1.1; font-family:'EB Garamond', 'Times New Roman', Times, serif; text-align:center; margin:24px auto; } p { margin-bottom:20px; } table { width:100%; } th,td { font-size:14px; line-height:1.2; font-family:Arial, Helvetica, sans-serif; border:none; } #content { display:block; overflow:hidden; width:100%; height:auto; margin:0; padding:0; top:0; } .container { display:block; position:relative; clear:both; text-align:center; width:1024px; margin:0 auto; padding:20px; } @media only screen and (max-width: 991px) { html, body, .container { width:100%; } } @media screen and (max-width: 768px) { html, body, .container, .et_pb_section { width:100% !important; max-width:100% !important; } } @media only screen and (max-width: 480px) { html, body, .container, #main-content, section { width:100% !important; max-width:100% !important; } } section { margin-bottom:40px; } .section-prehead { display:block; color:#999; font-size:12px !important; font-style:normal !important; font-weight:800; font-family:Arial, Helvetica, sans-serif; letter-spacing:0.5em; width:100%; margin-bottom:-30px; text-align:center; z-index:1000; } .section-head { display:block; width:100%; text-align:center; } .section-head span { } .section-head sup { font-size:56%; padding-left:0; position:relative; vertical-align:baseline; } .col-25 { display:block; float:left; width:25%; height:100%; margin:0; } .col-33 { display:block; float:left; width:33%; height:100%; margin:0; } .col-40 { display:block; float:left; width:40%; height:100%; margin:0; } .col-50 { display:block; float:left; width:50%; height:100%; margin:0; } .col-60 { display:block; float:left; width:60%; height:100%; margin:0; } .col-66 { display:block; float:left; width:66%; height:100%; margin:0; } .col-75 { display:block; float:left; width:75%; height:100%; margin:0; } /* ************************************************** * * FORMS */ button, input[type="button"], input[type="reset"], input[type="submit"] { position:relative; display:inline-block; color:#fff; font-weight:800; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:24px; padding:12px 34px; text-transform:uppercase; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { background-color: transparent; } select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { color:#767676; background-color:#fafafa; border:1px solid #dbdbdb; height:50px; padding:4px 20px; border-radius:0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } textarea { width: 100%; height: 120px; padding: 15px 20px; } input[type="checkbox"] { display: inline; } input:-moz-placeholder, textarea:-moz-placeholder, input::-moz-placeholder, textarea::-moz-placeholder { color: #a3a2a2; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color:#c3c3c3; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#cacaca; } .orches-animation { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } .orches-animation.animated { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } @-webkit-keyframes pop-scale { 0% { -webkit-transform: scale(0.7) } 100% { -webkit-transform: scale(1) } } @-moz-keyframes pop-scale { 0% { -moz-transform: scale(0.7) } 100% { -moz-transform: scale(1) } } @keyframes pop-scale { 0% { transform: scale(0.7) } 100% { transform: scale(1) } } @-webkit-keyframes pop-scale2 { 0% { -webkit-transform: scale(0.5) } 100% { -webkit-transform: scale(1) } } @-moz-keyframes pop-scale2 { 0% { -moz-transform: scale(0.5) } 100% { -moz-transform: scale(1) } } @keyframes pop-scale2 { 0% { transform: scale(0.5) } 100% { transform: scale(1) } } /* bootstrap resetting elements */ .btn { background-image:none; } textarea, input[type="text"], input[type="submit"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input, .dropdown-menu, .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus { -webkit-appearance: none; text-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow: none; } /* ************************************************** * * Header */ .logo_container, #main-header .logo_container, #main-header.et-fixed-header .logo_container { display:block; left:0; top:0; height:100px; width:609px; margin:0; padding:0; } #top-menu li.current-menu-ancestor>a, #top-menu li.current-menu-item>a, .mobile_menu_bar:after, .mobile_menu_bar:before { color: #ffffff !important; } @media (max-width: 479px) { #et-top-navigation { margin-right: 0; } #logo { float:left; max-width:70%; } } /* ************************************************** * * FOOTER */ .et-l.et-l--footer, .sgc-footer { bottom: 0; clear:left; display:block; left: 0; padding: 0 !important; width: 100%; z-index: 999; } .et_pb_text_1_tb_footer p, .sgc-footer p, .et_pb_text_1_tb_footer a, .sgc-footer a { color:#ffffff; text-decoration:none; text-shadow:none; } .et_pb_text_1_tb_footer a:hover, .sgc-footer a:hover { color:#000000; text-decoration:none; text-shadow:none; } /* ************************************************** * * HOME */ /* ************************************************** * * ALL VARIETIES PAGE */ .varieties { display:block; position:relative; clear:both; margin:0px auto; text-align:center; width:100%; } .container-varieties { display:block; position:relative; clear:both; text-align:center; width:80%; margin:0 auto; padding:0 !important; } .varieties h4 { text-align:center; } .varieties .varieties-wrapper { display:flex; align-items:center; flex-wrap:wrap; position:relative; clear:both; width:100%; min-height:300px; margin:20px 0; padding:0; overflow:hidden; } .varieties .plant-block { width:244px; height:300px; margin:10px; text-align:center; background-color:transparent; -moz-opacity:1; -webkit-opacity:1; opacity:1; } .varieties .plant-block a { color:#000; font-size:13px; font-family:Arial, Helvetica, sans-serif; } .varieties .plant-thumb { width:240px; height:240px; margin:0px; padding:0px; overflow:hidden; background-color:#fff; -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -moz-transition:all 0.2s; -webkit-transition:all 0.2s; transition:all 0.2s; } .varieties .plant-thumb div { border:2px solid #fff; width:240px; height:240px; margin:0px; padding:0px; overflow:hidden; background-color:#fff; background-position:center center; background-repeat:no-repeat; background-size:cover; } .varieties .plant-caption { bottom:0px; left:0px; display:block; font-size:11px; line-height:1; padding:10px; text-align:center; } .varieties .plant-block:hover { cursor:pointer; } .varieties .plant-block:hover .plant-thumb { -moz-opacity:0.7; opacity:0.7; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; } .varieties .plant-block:hover a { color: #4fc6db; } .varieties .plant-series, .varieties .plant-variety { font-weight:bold; font-style:normal; } .varieties .plant-genus { font-weight:normal; font-style:italic; } @media only screen and (max-width: 1024px) { .container-varieties { width:100% !important; margin:0 !important; } } @media only screen and (max-width: 840px) { .varieties { margin:0px !important; } .varieties .browse-series, .varieties .browse-genus, .varieties .searchform { float:none !important; margin:5px auto !important; } .varieties .container-varieties { width:100% !important; margin:0 !important; } .senetti .section-top-img { float:none; width:100%; margin-top:20px; } .senetti .section-text { float:none; width:100%; } .varieties .plant-block { display:block !important; float:none !important; margin:10px auto !important; } } /* ************************************************** * * SINGLE VARIETY PAGE */ .single-variety { display:block; position:relative; clear:both; height:100vh; margin:0px; text-align:center; width:100%; } .container.container-single-variety { display:block; height:100%; margin:5% auto 0; padding:0; position:relative; text-align:center; width:100% !important; } div#left-area.plant-photo-wrapper { display:inline-block; float:left; width:48% !important; margin:0 2% 0 0 !important; padding:0; } .plant-photo-large { height:auto; margin-bottom:20px; width:100%; } .plant-featured-image { border:2px solid #fff; -moz-opacity:1; opacity:1; -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -moz-transition:all 0.3s; -webkit-transition:all 0.3s; transition:all 0.3s; } .plant-featured-image:hover { -moz-opacity:0.7; opacity:0.7; } div#right-area.plant-desc-wrapper { display:inline-block; float:left; width:48% !important; margin:0; padding:0 0 0 2%; text-align:left; } .plant-desc-header { display:block; clear:both; margin:0 0 20px 0; } .single-variety .plant-name { color:#474747; font-size:18px; line-height:1; font-style:normal !important; font-weight:500; text-align:left; margin:0; } .single-variety .plant-genus { color:#474747; font-size:16px; line-height:1; font-style:normal !important; font-weight:500; text-align:left; margin:10px 0; } .single-variety .plant-long-desc { color:#474747; font-size:15px; line-height:1.4; font-weight:normal; } .single-variety .plant-long-desc h1, .single-variety .plant-long-desc h2, .single-variety .plant-long-desc h3, .single-variety .plant-long-desc h4, .single-variety .plant-long-desc h5 { color:#474747; font-weight:500; letter-spacing:1px; text-align:left !important; } .plant-gallery { display:flex; align-items:top; flex-wrap:wrap; position:relative; clear:both; margin:0; padding:0; width:100%; } .single-variety .plant-block { background-color:transparent; display:flex; height:auto; margin:0 12px 0 0; padding:0; text-align:center; width:220px; -moz-opacity:1; -webkit-opacity:1; opacity:1; -moz-transition:all 0.2s; -webkit-transition:all 0.2s; transition:all 0.2s; } .single-variety .plant-block:hover { -moz-opacity:0.7; opacity:0.7; } .single-variety .plant-thumb { border:2px solid #fff; width:220px; height:auto; margin:0px; padding:0px; -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); } .single-variety .plant-thumb img { width:100% !important; height:auto !important; } .plant-specs { width:100%; border:none; } .plant-specs tr { background:rgba(255,255,255, 1); cursor:pointer; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; transition:all 0.3s; } .plant-specs tr:hover { background:rgba(0,0,0, 0.05); } .plant-specs th, .plant-specs td p { font-size:14px; line-height:1.6; font-family: 'Alegreya Sans', Helvetica, Arial, Lucida, sans-serif; font-style:normal; font-weight:500; text-align:left; padding:6px; vertical-align:middle !important; } .plant-specs .icon { height:60px; width:60px; vertical-align:middle !important; } .plant-specs .plant-spec { color:#168199; font-family: 'Alegreya Sans', Helvetica, Arial, Lucida, sans-serif; font-size:17px; font-weight:700; } .single-variety .btn-block { width:100%; clear:both; margin:40px auto !important; } .single-variety .btn-info { color: #fff; cursor:pointer; background-color: #28bcd3; border:2px solid #fff !important; border-radius:24px !important; box-shadow:0px 2px 18px 0opx rgba(0,0,0, 0.2); font-size:14px; font-family: 'Montserrat', Helvetica, Arial, Lucida, sans-serif !important; font-weight: 700 !important; line-height:1; letter-spacing:2px; margin:0 auto !important; padding:12px 24px; position:relative; text-transform:uppercase; transition:all 300ms ease 0ms; vertical-align:middle; width:auto; max-width:180px !important; } .single-variety .btn-info:hover { color:#fff; background:#168199; } @media only screen and (max-width: 840px) { .single-variety { width:100%; margin:140px auto 0px; } .single-variety .plant-photo-wrapper { display:block; float:none; width:100%; margin:0 auto 20px; } .single-variety .plant-photo-thumbs { margin-bottom:40px !important; } .single-variety .plant-desc-wrapper { display:block; float:none; width:100%; margin:20px auto; } .single-variety .plant-desc-header { margin-bottom:20px; } } @media only screen and (max-width: 420px) { .single-variety { width:100%; margin:36px auto 0px; } .single-variety .plant-photo-wrapper { clear:both; display:block; float:none; width:100%; margin:20px 0px; } .single-variety .plant-featured-image { width:100%; margin-bottom:0px; } .single-variety .plant-desc-wrapper { clear:both; display:block; float:none; width:100%; margin:20px 0px; } .single-variety .plant-desc-header, .single-variety .plant-desc, .single-variety .plant-specs { width:100% !important; } } /* ************************************************** * * SINGLE SERIES PAGE */ .single-series { display:block; position:relative; clear:both; height:100vh; margin:0px; text-align:center; width:100%; } .single-series .container-series { display:block; position:relative; clear:both; text-align:center; max-width:1160px; margin:0 auto; padding:20px; } .single-series h4 { text-align:center; } .single-series h3 { font-size:18px;text-align:left; } .single-series p { font-weight:500 !important; } .single-series .plant-block { position:relative; display:inline-block; float:left; width:260px; height:300px; margin:10px; padding:10px; text-align:center; background-color:transparent; -moz-opacity:1; -webkit-opacity:1; opacity:1; } .single-series .plant-thumb { width:240px; height:240px; margin:0px; padding:10px; overflow:hidden; background-color:#fff; border:1px solid #eee; -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); -moz-transition:all 0.2s; -webkit-transition:all 0.2s; transition:all 0.2s; } .single-series .plant-thumb div { width:220px; height:220px; overflow:hidden; background-color:#fff; background-position:center center; background-repeat:no-repeat; background-size:cover; } .single-series .plant-caption { bottom:0px; left:0px; display:block; font-size:11px; line-height:1; padding:10px; text-align:center; } .single-series .plant-block a { color:#000; font-size:13px; font-family:Arial, Helvetica, sans-serif; } .single-series .plant-block:hover { cursor:pointer; } .single-series .plant-block:hover .plant-thumb { -moz-opacity:0.7; opacity:0.7; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; } .single-series .plant-block:hover a { color: #4fc6db; } .single-series .plant-series, .single-series .plant-variety { font-weight:bold; font-style:normal; } .single-series .plant-genus { font-weight:normal; font-style:italic; } @media only screen and (max-width: 1024px) { .single-series .container-series { width:880px; } } @media only screen and (max-width: 840px) { .single-series { margin:140px auto 0px !important; } .single-series .browse-series, .single-series .browse-genus, .single-series .searchform { float:none !important; margin:5px auto !important; } .single-series .container-varieties { width:100% !important; margin:0 !important; } .single-series .plant-block { display:block !important; float:none !important; margin:10px auto !important; } } /* ************************************************** * * SEARCH */ .container-search { position:relative; display:inline-block; float:none !important; overflow:hidden; clear:both; text-align:center; margin:20px auto !important; padding:0; z-index:900 !important; } .browse-series { position:relative; display:block; overflow:hidden; float:left; width:280px; height:48px; background-color:#999; margin:0 5px 0 0; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } .browse-series .wrap { position:relative; display:block; overflow:hidden; float:left; width:260px; padding:10px; background-position: right center; background-size:24px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yMDcsMzgxLjVMMTIuNywxODcuMWMtOS40LTkuNC05LjQtMjQuNiwwLTMzLjlsMjIuNy0yMi43YzkuNC05LjQsMjQuNS05LjQsMzMuOSwwbDE1NC43LDE1NGwxNTQuNy0xNTQKCWM5LjQtOS4zLDI0LjUtOS4zLDMzLjksMGwyMi43LDIyLjdjOS40LDkuNCw5LjQsMjQuNiwwLDMzLjlMMjQxLDM4MS41QzIzMS42LDM5MC44LDIxNi40LDM5MC44LDIwNywzODEuNUwyMDcsMzgxLjV6Ii8+Cjwvc3ZnPgo="); } .browse-series .select-series { width:280px; font-size:18px; line-height:1; height:28px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; color:#fff !important; background-color:transparent; border:0 !important; outline:none; margin:0 !important; padding:0 0 0 5px !important; -webkit-appearance:none; -moz-appearance:none; appearance:none;-webkit-user-select:none;-moz-user-select:none; } .browse-series .choose-series { width:280px; font-size:18px; line-height:1; height:28px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; color:#fff !important; background-color:transparent; border:0 !important; outline:none; margin:0 !important; padding:0 0 0 5px !important; -webkit-appearance:none; -moz-appearance:none; appearance:none;-webkit-user-select:none;-moz-user-select:none; } .browse-series .choose-series > option { color:#fff !important; background-color:#999 !important; font-size:14px !important; } .browse-genus { position:relative; display:block; overflow:hidden; float:left; width:280px; height:48px; background-color:#999; margin:0 5px 0 5px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } .browse-genus .wrap { position:relative; display:block; overflow:hidden; float:left; width:260px; padding:10px; background-position: right center; background-size:24px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yMDcsMzgxLjVMMTIuNywxODcuMWMtOS40LTkuNC05LjQtMjQuNiwwLTMzLjlsMjIuNy0yMi43YzkuNC05LjQsMjQuNS05LjQsMzMuOSwwbDE1NC43LDE1NGwxNTQuNy0xNTQKCWM5LjQtOS4zLDI0LjUtOS4zLDMzLjksMGwyMi43LDIyLjdjOS40LDkuNCw5LjQsMjQuNiwwLDMzLjlMMjQxLDM4MS41QzIzMS42LDM5MC44LDIxNi40LDM5MC44LDIwNywzODEuNUwyMDcsMzgxLjV6Ii8+Cjwvc3ZnPgo="); } .browse-genus .select-genus { width:280px; font-size:18px; line-height:1; height:28px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; color:#fff !important; background-color:transparent; border:0 !important; outline:none; margin:0 !important; padding:0 0 0 5px !important; -webkit-appearance:none; -moz-appearance:none; appearance:none;-webkit-user-select:none;-moz-user-select:none; } .browse-genus .choose-genus { width:280px; font-size:18px; line-height:1; height:28px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; color:#fff !important; background-color:transparent; border:0 !important; outline:none; margin:0 !important; padding:0 0 0 5px !important; -webkit-appearance:none; -moz-appearance:none; appearance:none;-webkit-user-select:none;-moz-user-select:none; } .browse-genus .choose-genus > option { color:#fff !important; background-color:#999 !important; font-size:14px !important; } .searchform { position:relative; display:block; overflow:hidden; float:left; width:280px; height:48px; background-color:#999; margin:0 0 0 5px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } .searchform .wrap { position:relative; display:block; overflow:hidden; float:left; padding:10px; } .search-field { width:240px; font-size:18px; line-height:1; height:28px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; color:#fff !important; background-color:#999 !important; border:0 !important; outline:none; margin:0 !important; padding:0 0 0 5px !important; } input::placeholder, input::-webkit-input-placeholder, input:-moz-placeholder, input::-moz-placeholder, input:-ms-input-placeholder, input::-ms-input-placeholder { color:#fff !important; -moz-opacity:1; -webkit-opacity:1; opacity:1; } .search-submit { position:absolute; top:10px; right:10px; width:28px; height:28px; } @media only screen and (max-width: 840px) { .browse-series, .browse-genus, .searchform { float:none; margin:5px auto; } } /* ************************************************** * * PAGINATION */ .pagination-wrapper { display:block; position:relative; clear:both; overflow:hidden; width:100%; height:48px; text-align:right; } .pagination { position:relative; clear:both; font-size:11px; line-height:13px; float:right; padding-right:20px; } .pagination span { font-family:Arial, Helvetica, sans-serif; display:block; float:left; margin:2px 2px 2px 0; padding:6px 9px 5px 9px; text-decoration:none; width:auto; color:#000; background:#fff; } .pagination a { font-family:Arial, Helvetica, sans-serif; display:block; float:left; margin:2px 2px 2px 0; padding:6px 9px 5px 9px; text-decoration:none; width:auto; color:#000; background:#eee; -webkit-transition:background .15s ease-in-out; -moz-transition:background .15s ease-in-out; -ms-transition:background .15s ease-in-out; -o-transition:background .15s ease-in-out; transition:background .15s ease-in-out; } .pagination a:hover { color:#fff; background:#000; } .pagination .current { padding:6px 9px 5px 9px; background:#4fc6db; color:#000; }