/* * Theme Name: WhetmanPinks * Theme URI: http://www.masarjohnston.com/ * Description: Custom WordPress theme developed for PlantHaven. * Author: MJAD * Author URI: http://www.masarjohnston.com * Template: Divi * Version: 2.0 */ /* * rev 20230713, MJAD - created, based on planthaven_v3 * rev 20260319, MJAD - updated child theme */ /* Pages fade in with footer jQuery */ body { display:none; } /* Removes vertical DIVI Sidebar rule */ #main-content .container:before { background: none; } /* EMBEDDED WEBFONTS */ @font-face { font-family:'Gotham Bold'; src: url('fonts/gotham-bold.eot'); src: url('fonts/gotham-bold.eot?#iefix') format('embedded-opentype'), url('fonts/gotham-bold.ttf') format('truetype'), url('fonts/gotham-bold.svg#gothambold') format('svg'); font-weight:bold; font-style:normal; } @font-face { font-family:'Gotham'; src: url('fonts/gotham-book-italic.eot'); src: url('fonts/gotham-book-italic.eot?#iefix') format('embedded-opentype'), url('fonts/gotham-book-italic.ttf') format('truetype'), url('fonts/gotham-book-italic.svg#gothambookitalic') format('svg'); font-weight:normal; font-style:italic; } @font-face { font-family:'Gotham'; src: url('fonts/gotham-book.eot'); src: url('fonts/gotham-book.eot?#iefix') format('embedded-opentype'), url('fonts/gotham-book.ttf') format('truetype'), url('fonts/gotham-book.svg#gothambook') format('svg'); font-weight:normal; font-style:normal; } @font-face { font-family:'ETmodules'; src:url('fonts/ETmodules_v2.eot'); src:url('fonts/ETmodules_v2.eot?#iefix') format('embedded-opentype'), url('fonts/ETmodules_v2.ttf') format('truetype'), url('fonts/ETmodules_v2.svg#ETmodules') format('svg'); font-weight:normal; font-style:normal; } /* COLOR PALETTE */ a { text-decoration:none; highlight:none; outline:none; color:#9abc6f; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; cursor:pointer; } a:hover { color:#000000; } .wht { color:#ffffff; } .wht_bg { background-color:#ffffff; } .tan { color:#ebe8de; } .tan_bg { background-color:#ebe8de; } .grn { color:#9abc6f; } .grn_bg { background-color:#9abc6f; } .drkgrn { color:#365b22; } .drkgrn_bg { background-color:#365b22; } .brn { color:#766e55; } .brn_bg { background-color:#766e55; } .org { color:#db7c00; } .org_bg { background-color:#db7c00; } .pink { color:#ffc0cb; } .pink_bg { background-color:#ffc0cb; } .deeppink { color:#ff1493; } .deeppink_bg { background-color:#ff1493; } .red { color:#97335f; } .red_bg { background-color:#97335f; } .gry { color:#666666; } .gry_bg { background-color:#666666; } .blk { color:#000000; } .blk_bg { background-color:#000000; } h1, h2, h3, h4 { font-weight:bold; font-family:'Gotham', Helvetica, Arial, sans-serif; } /* ALIGNMENT */ .ctr, .center, .aligncenter { float:none; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } .alignleft { display:inline; float:left; margin-right:1.5em; } .alignright { display:inline; float:right; margin-left:1.5em; } .img-left { margin:0 33px 0 0 !important; float:left; } .img-right { margin:0 0 0 33px !important; float:right; } h1 sup { font-size:0.6em; margin-right:1px; top:0; vertical-align:super; } /* Forms */ input { -webkit-appearance: none; } input[type=checkbox] { -webkit-appearance: checkbox; } input[type=radio] { -webkit-appearance: radio; } input[type=text], input.text, input.title, textarea, select { margin: 0; } textarea { padding: 4px; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 30px white inset !important; } /* BUTTONS */ .btn { color:#333333; background-color:#ffffff; margin:20px 0; padding:12px 24px; display:inline-block; text-align:center; border:none; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing: border-box; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; transition:all 0.3s; cursor:pointer; } #gform_submit_button_1, #gform_submit_button_2, #gform_submit_button_3, .btn-primary, .et_pb_button { color:#fff !important; background-color:rgb(55,47,39) !important; margin:20px 0 !important; padding:12px 24px !important; border:0px !important; font-size:14px !important; font-weight:bold !important; font-family:'Gotham Bold', Arial, sans-serif !important; text-transform:uppercase !important; letter-spacing:1px !important; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing: border-box; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; transition:all 0.3s; cursor:pointer; } .btn-pink { color:rgb(196,99,63) !important; background-color: rgb(55,47,39) !important; border:2px solid rgb(214,172,194) !important; } .btn-blue { color:rgb(55,47,39) !important; background-color: rgb(234,233,230) !important; border:2px solid rgb(55,47,39) !important; } .gradient-text { /* Fallback: Set a background color. */ background-color:rgb(234,233,230); /* Create the gradient. */ background-image: linear-gradient(45deg, rgb(196,99,63), rgb(211,189,115), rgb(211,189,115)234,233,230); /* Set the background size and repeat properties. */ background-size: 100%; background-repeat: repeat; /* Use the text as a mask for the background. */ /* This will show the gradient as a text color rather than element bg. */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; -moz-background-clip: text; -moz-text-fill-color: transparent; } .btn-pink:hover, .btn-blue:hover { color:rgb(234,233,230) !important; background-color:#000000 !important; border:2px solid rgb(234,233,230) !important; } .btn-download { padding-bottom:12px; } .btn-download .chevron-down { clear:both; display:block; width:100%; min-height:60px; overflow:hidden; background-color:reg; background-position:center; background-size:cover; background-repeat:no-repeat; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; transition:all 0.3s; background-image:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTIwNywzODEuNUwxMi43LDE4Ny4xYy05LjQtOS40LTkuNC0yNC42LDAtMzMuOWwyMi43LTIyLjdjOS40LTkuNCwyNC41LTkuNCwzMy45LDBsMTU0LjcsMTU0bDE1NC43LTE1NCBjOS40LTkuMywyNC41LTkuMywzMy45LDBsMjIuNywyMi43YzkuNCw5LjQsOS40LDI0LjYsMCwzMy45TDI0MSwzODEuNUMyMzEuNiwzOTAuOCwyMTYuNCwzOTAuOCwyMDcsMzgxLjVMMjA3LDM4MS41eiIvPjwvc3ZnPg=='); } #gform_submit_button_1:hover, #gform_submit_button_2:hover, #gform_submit_button_3:hover, .btn:hover, .et_pb_button:hover { margin:20px 0; padding:12px 24px; color:#000000; background-color:#666666; } .btn:hover .chevron-down { background-position:center -4px; } .nav .menu-item a:hover { color:rgba(0,0,0,1) !important; -moz-opacity:1; -webkit-opacity:1; opacity:1; } .btn .btn-primary { margin:5%; } .current-menu-item, .current_page_item, .current-page-ancestor { color:#9abc6f !important; } /* Medium screens */ @media only screen and (min-width:479px) and (max-width:1441px) { #logo { width:140px !important; } #et-top-navigation { padding-left:150px !important; } #top-menu li { font-size:12px !important; } #top-menu li a { font-size:12px !important; padding-right:0px !important;} .subnav { width:85%; margin:2em auto; padding:0; } .subnav .col h3 { font-size:80%; line-height:1.1; margin:0.75em auto; padding:1.25em; } .subnav .nav { height:150px; } } /* Small screens */ @media only screen and (max-width:479px) { .subnav { display:block; width:100%; margin:1em 0; } .subnav .row { display:block; width:100%; margin:0; padding:0; } .subnav .col { display:block; width:100%; margin:0; padding:0; } .subnav .col h3 { font-size:80%; line-height:1.0; margin:0.5em auto; padding:1em; } .subnav .col h3 span { display:inline; clear:none; } .subnav .nav { display:block; width:100%; height:auto; } } /* Hot-selections */ @media only screen and (max-width:980px){ .et_pb_column .et_pb_column_1_2 .et_pb_column_15 {margin-bottom:0px!important;} } /* FOOTER */ footer { display:block; clear:both; width:100%; margin:0; top:0; overflow:hidden; background-color:#999999 !important; color:#fff; font-size:1em; font-family:Arial, Helvetica, sans-serif; font-weight:600; text-align:center; } footer .row { display:block; clear:both; width:100%; padding:20px 0; overflow:hidden; } footer a { color:rgba(0, 0, 0, 0.7); text-decoration:none; } footer a:hover { color:#9abc6f; } footer ul { display:block; margin:0 auto; text-align:center; } footer li { display:inline-block; float:none; margin:0 auto; padding:0; text-align:center; } footer li p { color:#fff; font-size:.9em; font-family:Arial, Helvetica, sans-serif; font-weight:600; line-height:1.2em; margin:0px auto; text-align:center; } footer li p a { color:#fff; cursor:pointer; font-size:.9em; font-family:Arial, Helvetica, sans-serif; font-weight:600; line-height:1.2em; text-decoration:none; } footer li p a:hover { color:#9abc6f; } div#footer-container.container {width: 95%;} @media only screen and ( max-width: 479px ) { footer li { display:block; float:none; width:90%; margin:left:5%; margin-right:5%; font-size:0.9em; text-align:center; } } @media only screen and ( max-width: 600px ){ #footer-nav {width: 50%;} div#footer-container.container {width: 95%;} #follow-us {width: 50%; margin-left:10%;} } @media only screen and ( max-width: 460px ){ #footer-nav {width: 100%;} div#footer-container.container {width: 100%;} #follow-us {width: 100%; margin-left:0;} } /* ************************************************** * * SINGLE COLLECTION PAGE */ .single-collection #page-container { padding-top:0; } .collection { padding-top:0; display:block; position:relative; clear:both; } .collection .container { width:70%; padding-top:0 !important; } .collection header { width:100%; height:650px; background-position:center center; background-repeat:no-repeat; background-size:cover; overflow:hidden; } .collection article { width:100%; margin:0; padding:0; } .collection article p { font-family:'Gotham Light', Arial, Helvetica, sans-serif; width:100%; margin:0; padding:0; } .collection section { display:flex; flex-wrap:wrap; justify-content:center; width:auto; clear:both; margin:0 auto; text-align:center; } .collection .row { display:block; width:100%; } .collection .col { display:-ms-flex; display:-webkit-flex; display:flex; flex-direction:column; flex-basis:100%; flex:1; } .collection-logo { display:block; width:144px; float:none; clear:both; margin:20px auto; padding:0; } .collection-logo img { width:100%; height:auto; } .collection-logo h2 { display:block; width:100%; color:#666; font-size:28px; font-weight:bold; line-height:1em; font-family:'Gotham', Arial, Helvetica, sans-serif; margin:0 auto; padding:0; align:center; text-align:center; } .collection .divider { display:block; background-color:green; width:10%; height:8px; float:none; clear:both; margin:0 auto 20px; padding:0; } .collection .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; cursor:pointer; } .collection .plant-thumb { width:260px; height:260px; margin:0px; padding:10px; overflow:hidden; background-color:#fff; border:1px solid #ccc; -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; } .collection .plant-thumb div { width:240px; height:240px; margin:0px; padding:10px; overflow:hidden; background-color:#fff; background-position:center center; background-repeat:no-repeat; background-size:cover; } .collection .plant-caption { bottom:0px; left:0px; display:block; font-size:11px; line-height:1; padding:10px; text-align:center; } .collection .plant-block a { color:#000; font-size:13px; font-family:Arial, Helvetica, sans-serif; } .collection .plant-block:hover .plant-thumb { -moz-opacity:0.7; opacity:0.7; } .collection .plant-block:hover a { color: #9abc6f; } .collection .plant-series, .collection .plant-variety { font-weight:bold; font-style:normal; } .collection .plant-genus { font-weight:normal; font-style:italic; } /* SOCIAL MEDIA ICONS */ .widget-social-icons { clear:both; float:none; margin:0; padding:0; } .widget-social-icons li { display:inline-block; width:40px !important; height:40px !important; margin:0 15px 15px 0; padding:0; } .widget-social-icons li a { display:inline-block; position:relative; -moz-opacity:1; -webkit-opacity:1; opacity:1; -moz-transition:opacity 0.4s ease-in-out; -webkit-transition:opacity 0.4s ease-in-out; transition:opacity 0.4s ease-in-out; text-decoration:none; cursor:pointer; } .widget-social-icons li a:hover { -moz-opacity:0.7; -webkit-opacity:0.7; opacity:0.7; } .widget-social-icons li a img { width:40px !important; height:40px !important; } /* FIXES */ article { padding:0!important; } /* SEARCH RESULTS */ .search-results article { display:block; padding:20px !important; overflow:hidden; } .search #page-container { width:100%; } .search-results .results { clear:both; width:80%; border:1px solid #ccc; margin:15px auto; padding:20px; } .search-results .no-results { clear:both; width:50%; border:1px solid #ccc; margin:15px auto; padding:20px; } /* FLUID VIDEO WRAPPER (16:9) */ .video-wrapper { display:block !important; clear:both; position:relative; padding-bottom:56.25%; padding-top:25px; height:auto; } .video-wrapper iframe { position:absolute; top:0; left:0; width:100%; height:100%; } .video-wrapper iframe video { width:100% !important; height:auto !important; } /* ************************************************** * * VARIETY SEARCH */ /* Subnav */ #section-plant-browser { position:fixed; top:62px; width:100%; height:70px; z-index:9999; } .section-variety-hdr { margin-top:70px !important; } .search { display:flex; justify-content:space-between; margin:1em auto; padding:0; } .browse { width:100%; height:36px; margin-bottom:0 !important; padding:0; color:#fff; background-color:rgba(102, 102, 102, 1) !important; -moz-border-radius:3px 3px 0px 0px; -webkit-border-radius:3px 3px 0px 0px; border-radius:3px 3px 0px 0px; -moz-transition:background-color 0.3s ease-in-out; -webkit-transition:background-color 0.3s ease-in-out; transition:background-color 0.3s ease-in-out; cursor:pointer; } .browse-open { -moz-border-radius:3px 3px 0px 0px !important; -webkit-border-radius:3px 3px 0px 0px !important; } .browse:hover { color:#fff !important; background-color:#333 !important; } .browse-bg { background-position:96% center; background-size:16px 16px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yMDcsMzgxLjVMMTIuNywxODcuMWMtOS40LTkuNC05LjQtMjQuNiwwLTMzLjlsMjIuNy0yMi43YzkuNC05LjQsMjQuNS05LjQsMzMuOSwwbDE1NC43LDE1NGwxNTQuNy0xNTQKCWM5LjQtOS4zLDI0LjUtOS4zLDMzLjksMGwyMi43LDIyLjdjOS40LDkuNCw5LjQsMjQuNiwwLDMzLjlMMjQxLDM4MS41QzIzMS42LDM5MC44LDIxNi40LDM5MC44LDIwNywzODEuNUwyMDcsMzgxLjV6Ii8+Cjwvc3ZnPgo="); } .browse h4 { font-size:11px !important; line-height:36px !important; font-weight:800 !important; font-family:'Gotham Bold', Helvetica, Arial, sans-serif !important; letter-spacing:0.02em !important; text-transform:uppercase !important; padding-left:4% !important; } .browse-links { width:100%; height:auto; max-height:80vh; overflow-y:auto !important; -ms-overflow-style: -ms-autohiding-scrollbar; margin:0 !important; padding:0; color:#fff; background-color:rgba(102, 102, 102, 0.9); display:none; -moz-border-radius:0 0 3px 3px; -webkit-border-radius:0 0 3px 3px; border-radius:0 0 3px 3px; } .browse-links ul { margin:0; padding:0; max-height:80%; overflow-y:auto !important; -ms-overflow-style: -ms-autohiding-scrollbar; } .browse-links ul li { margin:0; padding:0; color:#fff; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; cursor:pointer; } .browse-links ul li a { display:block; color:#fff; font-size:12.5px; line-height:26px; height:26px; padding-left:4%; } .browse-links ul li:last-child { } .browse-links ul li:hover { color:#fff; background:#333; } .browse-type .select-type, .browse-series .select-series, .browse-genus .select-genus { font-size:14px; font-weight:400; line-height:24px; height:24px !important; font-family:'Gotham', Helvetica, Arial, sans-serif; letter-spacing:0.02em; text-transform:uppercase; 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 option, .browse-genus select { color:#fff !important; background-color:#999 !important; } .search-col { width:100%; height:36px; margin-bottom:0 !important; padding:0; color:#fff; background-color:rgba(102, 102, 102, 1) !important; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; -moz-transition:background-color 0.3s ease-in-out; -webkit-transition:background-color 0.3s ease-in-out; transition:background-color 0.3s ease-in-out; } .search-col:hover { color:#fff !important; background-color:#333 !important; } .search-form { background:transparent; } .search-form .wrap { background:transparent; } .searchform .search-field { color:#fff; font-size:11px; line-height:36px !important; font-weight:800 !important; font-family:'Gotham Bold', Helvetica, Arial, sans-serif !important; letter-spacing:0.02em !important; color:#fff !important; background:transparent; border:0 !important; margin:0 0 0 10px !important; padding:0; border-style:solid; box-shadow:none; -webkit-appearance:none; -moz-appearance:none; appearance:none;-webkit-user-select:none;-moz-user-select:none; -moz-opacity:1; -webkit-opacity:1; opacity:1; } .search-bg { background-position:96% center; background-size:16px 16px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwLjIgMzAuMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAuMiAzMC4yOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8Zz4NCgk8cGF0aCBzdHlsZT0iZmlsbDojRkZGRkZGIiBkPSJNMjAuMiwzLjVjLTQuNi00LjYtMTIuMS00LjYtMTYuNywwcy00LjYsMTIuMSwwLDE2LjdjNC4xLDQuMSwxMC41LDQuNSwxNS4xLDEuM2MwLjEsMC41LDAuMywwLjksMC43LDEuM2w2LjcsNi43YzEsMSwyLjYsMSwzLjUsMGMxLTEsMS0yLjYsMC0zLjVsLTYuNy02LjdjLTAuNC0wLjQtMC44LTAuNi0xLjMtMC43QzI0LjcsMTQsMjQuMyw3LjYsMjAuMiwzLjV6IE0xOC4xLDE4LjFjLTMuNCwzLjQtOSwzLjQtMTIuNSwwYy0zLjQtMy40LTMuNC05LDAtMTIuNWMzLjQtMy40LDktMy40LDEyLjUsMEMyMS41LDksMjEuNSwxNC42LDE4LjEsMTguMXoiLz4NCjwvZz4NCjwvc3ZnPg=="); } @media only screen and (max-width:1024px) { #main-header .container { padding-left:15px !important; padding-right:15px !important; } .browse-links ul li a { font-size:12.5px; line-height:25px; height:25px; } .search .toggle { display:none !important; } } @media only screen and (min-width: 480px) and (max-width: 840px) { .browse-links ul li a { font-size:12.5px; line-height:25px; height:25px; } .search .et_pb_column et_pb_column_1_4 et_pb_column_2 { float:none; margin-left:0px !important; } .search .search-form { float:none; margin:5px !important; } } @media only screen and (max-width: 840px) { .browse-links ul li a { font-size:12px; line-height:24px; height:24px; } .search .browse-type, .search .browse-series, .search .browse-genus, .search .search-form { float:none; margin:5px; } } /* ************************************************** * * PAGINATION */ .pagination-wrapper { position:relative; clear:both; overflow:hidden; width:84% !important; height:48px !important; margin:0 auto !important; padding:10 0 !important; 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:#666; 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:#666; 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:#333 !important; } .pagination .current { padding:6px 9px 5px 9px; color:#666; background:#9abc6f; } .pagination .current:hover { color:#fff; background:#333 !important; } /* ************************************************** * * ALL VARIETIES PAGE */ .varieties { display:block; position:relative; clear:both; text-align:center; } .varieties section { padding:20px; } .section-varieties { display:flex; flex-wrap:wrap; justify-content:center; width:auto; clear:both; margin:0 auto !important; padding:0; text-align:center; } .varieties h4 { text-align:center; } .varieties .plant-block { display:inline-block; float:left; width:280px; height:300px; margin:10px; padding:10px; text-align:center; background-color:transparent; -moz-opacity:1; -webkit-opacity:1; opacity:1; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; cursor:pointer; } .varieties .plant-thumb { display:block; position:relative; width:261px; height:261px; margin:0px; padding:0px; overflow:hidden; background-color:#fff; border:1px solid #ccc; box-sizing:border-box; -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; } .varieties .plant-thumb-wrapper { position:absolute; top:8px; left:8px; width:240px; height:240px; margin:0; padding:0; 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 a { color:#666; font-size:13px; font-family:Arial, Helvetica, sans-serif; } .varieties .plant-block:hover .plant-thumb { -moz-opacity:0.7; opacity:0.7; } .varieties .plant-block:hover a { color: #9abc6f; } .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:880px; } } @media only screen and (max-width: 840px) { .varieties { margin:140px auto 0px !important; } .varieties .browse-type, .varieties .browse-series, .varieties .browse-genus, .varieties .searchform { float:none !important; margin:5px auto !important; } .varieties .container-varieties { width:100% !important; margin:0 !important; } .varieties .plant-block { display:block !important; float:none !important; margin:10px auto !important; } } @media only screen and ( max-width: 479px ) { .varieties .toggle { display:none !important; } } /* ************************************************** * * SINGLE VARIETY PAGE */ .variety { display:block; position:relative; clear:both; } .variety header { width:100%; height:250px; background-position:center center; background-repeat:no-repeat; background-size:cover; overflow:hidden; } .variety section { width:100%; margin:0; padding:0; } .variety .container { position:relative; width:75%; max-width:98%; margin:40px auto; padding:0 !important; } .variety .row { width:100%; clear:both; } .variety .col { display:block; float:left; } /* left column, images */ .variety .col-thumbs { width:8%; padding:0 1% 0 0; } .variety .plant-photo-thumbs img { width:100%; height:auto; -moz-transition:all 0.6s; -webkit-transition:all 0.6s; transition:all 0.6s; cursor:pointer; } .variety .plant-photo-thumbs img:hover { -moz-opacity:0.7; -webkit-opacity:0.7; opacity:0.7; } .variety .col-images { width:49%; padding:0 1% 0 0; } .variety .plant-photo-large { position:relative; } .variety .plant-photo-large img { width:100% !important; height:auto; padding:0; margin:0; } .variety .plant-photo-large .plant_att_lnk { } .attachment .col-images img { width:100%; height:auto !important; padding-bottom:20px; } .variety .row-plant-videos { display:block; position:relative; width:100%; margin-bottom:20px; } .variety .row-plant-videos p { clear:both; font-weight:bold; font-size:13px; line-height:1; font-family:Arial, Helvetica, sans-serif; text-align:left; margin:0; padding:0; } .variety .video-wrapper { display:block; position:relative; clear:both; width:100%; max-width:640px; height:auto !important; margin:10px 0 20px; padding:0; -moz-transition:all 0.4s; -webkit-transition:all 0.4s; transition:all 0.4s; cursor:pointer; } .variety .video-wrapper iframe { -moz-opacity:1; -webkit-opacity:1; opacity:1; -moz-transition:all 0.6s; -webkit-transition:all 0.6s; transition:all 0.6s; cursor:pointer; } .variety .video-wrapper video { width:100% !important; height:auto !important; } .et_pb_video_box { width:100% !important; height:auto !important;} .et_pb_video_box iframe { -moz-opacity:0; -webkit-opacity:0; opacity:0; -moz-transition:all 0.6s; -webkit-transition:all 0.6s; transition:all 0.6s; cursor:pointer; } .et_pb_video_overlay { position:absolute; z-index:10; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center; -webkit-background-size:cover; -moz-background-size:cover; background-size:cover; cursor:pointer; } .et_pb_video_play:before { font-size:72px; font-family:'ETmodules'; content:"\49"; } .et_pb_video_play { display:block; position:absolute; z-index:100; top:50%; left:50%; margin-left:-36px; color:#fff;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .et_pb_video_play:hover { color:#000; } .et_pb_video_overlay_hover { position:absolute; z-index:100; width:100%; height:100%; background:rgba(0, 0, 0, 0); -webkit-transition all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; } .et_pb_video_overlay_hover:over { color:#000; background:rgba(0, 0, 0, 0.5); } /* right column, specs */ .variety .col-specs { width:40%; padding:0 0 0 1%; } .variety .plant-desc-wrapper { display:inline-block; float:left; margin:0; text-align:left; } .variety .plant-desc-header { display:block; clear:both; margin:0 0 20px 0; } .variety .plant-name { color:#666; font-size:18px; line-height:1; font-weight:800; font-family:Arial, Helvetica, sans-serif; float:none; text-align:left; margin:0; padding:0; } .variety .plant-genus { color:#666; font-size:16px; line-height:1.6; font-weight:800; font-style:italic; font-family:Arial, Helvetica, sans-serif; float:none; text-align:left; margin:0; padding:0; } .variety .plant-long-desc { color:#666; font-size:15px; line-height:1.4; font-weight:normal; text-align:left !important; } .variety .plant-long-desc h1, .variety .plant-long-desc h2, .variety .plant-long-desc h3, .variety .plant-long-desc h4, .variety .plant-long-desc h5 { text-align:left !important; } .variety .plant-long-desc ul { margin-bottom:16px; } .variety .plant-long-desc li { list-style:disc; list-style-position:inside; text-align:left !important; } .variety .plant-specs { width:100%; border:none; text-align:left !important; } .variety .plant-specs th, .variety .plant-specs td { font-size:13px; line-height:1.2; font-family:Arial, Helvetica, sans-serif; text-align:left; border:none; padding:2px 0px; } .variety .plant-specs th { vertical-align:top; width:140px; } .variety .plant-specs td { vertical-align:bottom !important; } .variety .photo-disclaimer { width:100%; clear:both; margin:20px 0 !important; padding:20px; border:1px solid #ccc; } .variety p small { font-size:85%; } .variety .btn-block { width:100%; clear:both; margin:20px 0 !important; } .variety .btn-info { color:#fff; background:#999; font-size:14px; height:48px; line-height:48px; font-weight:500 !important; font-family:Arial, Helvetica, sans-serif; letter-spacing:0.05em; text-align:center; margin:0; padding:24px 12px 24px 24px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; -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; } .variety .btn-info:hover { color:#fff; background:#4fc6db; } .variety .btn-info > .arrow { width:24px; height:24px; border-width:6px; border-style:double; border-color:#fff; border-width:0 0 2px 2px; display:inline-block; position:relative; margin:0 0 -6px 16px; padding:0px; } .variety .btn-info > .arrow-left { -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); } /* Pulse */ @-webkit-keyframes hvr-pulse { 25% { -webkit-transform: scale(1.1); transform: scale(1.1); } 75% { -webkit-transform: scale(0.9); transform: scale(0.9); } } @keyframes hvr-pulse { 25% { -webkit-transform: scale(1.1); transform: scale(1.1); } 75% { -webkit-transform: scale(0.9); transform: scale(0.9); } } .hvr-pulse { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); } .hvr-pulse:hover, .hvr-pulse:focus, .hvr-pulse:active { -webkit-animation-name: hvr-pulse; animation-name: hvr-pulse; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .attachment .btn-wrapper { display:block; clear:both; overflow:hidden; width:100%; margin:40px 0 50px; } .attachment .btn-jpg { display:inline-block; float:left; font-size:14px; line-height:1.2; width:140px; height:140px; margin:0 10px 0 0; padding:10px; color:#fff; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background-color:#666; background-position:50px 80px; background-size:40px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yMDcsMzgxLjVMMTIuNywxODcuMWMtOS40LTkuNC05LjQtMjQuNiwwLTMzLjlsMjIuNy0yMi43YzkuNC05LjQsMjQuNS05LjQsMzMuOSwwbDE1NC43LDE1NGwxNTQuNy0xNTQKCWM5LjQtOS4zLDI0LjUtOS4zLDMzLjksMGwyMi43LDIyLjdjOS40LDkuNCw5LjQsMjQuNiwwLDMzLjlMMjQxLDM4MS41QzIzMS42LDM5MC44LDIxNi40LDM5MC44LDIwNywzODEuNUwyMDcsMzgxLjV6Ii8+Cjwvc3ZnPgo="); -moz-border-radius:2px; -webkit-border-radius:2px; text-align:center; border-radius:2px; -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; } .attachment .btn-tif { display:inline-block; float:left; font-size:14px; line-height:1.2; width:140px; height:140px; margin:0 10px 0 0; padding:10px; color:#fff; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background-color:#666; background-position:50px 80px; background-size:40px; background-repeat:no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIyLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NDggNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NDggNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yMDcsMzgxLjVMMTIuNywxODcuMWMtOS40LTkuNC05LjQtMjQuNiwwLTMzLjlsMjIuNy0yMi43YzkuNC05LjQsMjQuNS05LjQsMzMuOSwwbDE1NC43LDE1NGwxNTQuNy0xNTQKCWM5LjQtOS4zLDI0LjUtOS4zLDMzLjksMGwyMi43LDIyLjdjOS40LDkuNCw5LjQsMjQuNiwwLDMzLjlMMjQxLDM4MS41QzIzMS42LDM5MC44LDIxNi40LDM5MC44LDIwNywzODEuNUwyMDcsMzgxLjV6Ii8+Cjwvc3ZnPgo="); -moz-border-radius:2px; -webkit-border-radius:2px; text-align:center; border-radius:2px; -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; } .attachment .btn-text { display:inline-block; width:auto; color:#fff; font-size:14px; line-height:16px; cursor:pointer; font-weight:500 !important; font-family:Arial, Helvetica, sans-serif; letter-spacing:0.05em; margin:20px auto; } .attachment .filesize { font-size:12px; } .attachment .btn-jpg:hover { background-color:#000000; font-size:14px; line-height:1.2; width:140px; height:140px; margin:0 10px 0 0; padding:10px; background-position:50px 90px; } .attachment .btn-tif:hover { background-color:#000000; font-size:14px; line-height:1.2; width:140px; height:140px; margin:0 10px 0 0; padding:10px; background-position:50px 90px; } .attachment p small { text-align:left !important; font-size:85%; } @media only screen and (max-width:479px) { #main-content .container { padding-top:0; } .variety header { height:125px; } .variety .container { width:100% !important; margin:20px 0; padding:0 !important; } .variety .row { display:block; width:100%; justify-content:center; text-align:center; } .variety .col-images { display:block; float:none; clear:both; width:90%; margin:0px auto 20px; padding:0; } .variety .col-specs { display:block; float:none; clear:both; width:90%; margin:0px auto 20px; padding:0; text-align:left !important; } }