/* Theme Name: Simcro Theme URI: Description: Canvas Child Theme Author: DVELOPIT Author URI: http://dvelopit.co.nz/ Template: canvas Version: 1.0.0 Text Domain: canvas-child */ @import url("../canvas/style.css"); /* GLOBAL STYLES ---------------- Add styles beneath this line that you want to be applied across your entire site */ #spacer { width:100%; float:none; clear:both; height:20px; } .postid-5121 #product-image .flexslider, .postid-5092 #product-image .flexslider, .postid-5093 #product-image .flexslider { background: #000000 !important; border: 4px solid #000000 !important; } #fancybox-wrap { width:80%; } #social-icons2 img { float:left !important; margin-right:3px; display: block; } #nav_menu-2 h3 { color:#ffffff !important; font-size:30px !important; } div.footer-widget-3 p, .footer-widget-3 a { color: #ffffff; } #footer-widgets .block { padding-top:0px !important; margin-top:20px; } .footer-widget-3 h3 { border-bottom:0px !important; padding:0; margin-bottom:5px; } .footer-widget-3 ul li a { background-color:#383e54; text-transform:uppercase; color:#ffffff; font-size:22px; padding:15px; display:block; } .footer-widget-3 ul li { list-style-type:none; margin-bottom:5px; } a.button { background-color: #442682 !important; margin-bottom: 0; padding: 6px 15px; border-radius: 0; font-weight: 700; text-transform:uppercase; } a.button:hover { background-color: #b3aed3 !important; } #header-container { border-bottom: 5px solid #333333; margin-bottom: 30px; } .home #header-container { margin-bottom:0px; } #the-title, .title { text-transform: uppercase; } #logo:after { content:"" !important; } .searchform, #searchform { background-color:#555555 !important; } .searchform input.s, #searchform input#s { color:#ffffff; } .searchform .fa-search:before { color: rgba(255, 255, 255, 1); } /* Home Template */ #slide-text { background-color: #67559C; padding:20px; } #soliloquy-container-2087 { border-bottom: 5px solid #B3AED3; } #post-search-page {padding-top: 40px; padding-bottom: 40px; width:100%; clear:both; margin-top:30px; overflow:auto;} #home-bottom-bg { background-color:#333333; padding-top: 40px; padding-bottom: 40px; width:100%; clear:both; overflow:auto; } #home-bottom { padding-left: 1.618em; padding-right: 1.618em; max-width: 1000px !important; margin-left: auto; margin-right: auto; } #home-bottom h2 { text-align:center; margin-bottom:20px; } .post-link-image { height: 180px; background-size: contain; background-repeat: no-repeat; margin-bottom:20px; background-position: bottom; } .post-link-title { font-size:20px; text-align: center; } .post-link-content a { color:#000000 !important; background-color:#67559C; text-align: center; padding: 7px; margin-left:auto; margin-right:auto; text-align:center; margin-top:20px; display: block; width: 100px; margin-bottom:50px; } .post-link-content a:hover { text-decoration:none; background-color:#442682; } #home-search-bg { background-color:#67559c; padding-top: 40px; padding-bottom: 40px; width:100%; clear:both; overflow:auto; } .search-filter select { border-radius:0px !important; padding-left:15px !important; font-size:13px; border: solid 1px #cccccc !important; } .search-filter input#search-button.search-button { border: solid 3px #442682; } .search-filter input#search-button.search-button:hover { border: solid 3px #b3aed3; } /* 1 Column Template */ #header-image { margin-bottom:25px; } #the-title h1 { margin-bottom:10px; color:#B3AED3; } #intro-text { padding-top: 15px; padding-bottom: 0px; border-top:3px solid #ffffff; border-bottom: 3px solid #ffffff; margin-bottom: 30px; margin-top: 30px; } #page-content { background-color: #394a59; padding: 3%; overflow: auto; } /* Team Template */ .page-template-template-territory-managers2 h1, .page-template-template-territory-managers2 h2, .page-template-template-territory-managers2 h3 { color:#ffffff; } #territory-group { overflow:auto; } div.single-person p { font-size:12px !important; } div.single-person #image { margin-bottom:15px; } div.single-person #name { font-weight:bold; color:#4814a0; font-size:15px; } div.single-person #role { color:#ad98da; } #divide-line { background-color:#ffffff; height:2px; width:60%; margin-top:10px; margin-bottom:10px; } div.single-person { margin-bottom:25px; min-height: 340px; } /* Stories Template */ ul.display-posts-listing li.listing-item { border-bottom:2px solid #333333; padding-top:40px; } ul.display-posts-listing a.title { clear:right; display: block; color:#B3AED3; font-size:32px; } ul.display-posts-listing a.title:hover { text-decoration:none; } ul.display-posts-listing .excerpt-dash, .post-entries, #comments { display:none; } ul.display-posts-listing .excerpt a { clear:both; display: block; color:#000000; background-color:#B3AED3; text-align: center; padding: 7px; width:100px; margin-top: 20px; margin-bottom: 50px; } ul.display-posts-listing .excerpt a:hover { text-decoration:none; background-color:#67559C; } ul.display-posts-listing a.image { margin-bottom: 40px; } /* Single Product Template */ #product-image img { width:100%; } #product-top { clear:both; margin-bottom:30px; overflow:auto; } #product-top-left { width:100%; margin-bottom:20px; } #product-top-right { width:100%; margin-bottom:20px; } #product-description ul li { list-style-type:disc; list-style-position:inside; } #product-description { margin-bottom:20px; } #download-files div.download-file { background-color:#67569D; color:#ffffff; padding: 5px; margin-top:20px; padding: 10px; float: left; } #download-files div.download-file:hover { background-color:#4814A0; } #product-title h1 { color:#B3AED3; } #product-heading { text-align: center; display: block; } #product-heading h2 { background-color: #000000; display: inline-block; padding: 20px; } #heading-line { height:3px; background-color:#ffffff; margin-top:-40px; margin-bottom:40px; } #videos, #animations, #options { overflow: auto; } #videos img, #animations img, #options img { margin-bottom: 20px; } #video-thumb { width: 100%; padding-bottom: 53.0%; background-size: cover; display: block; margin-bottom: 15px; } #video-thumb:hover { background-position: bottom; } #single-cats h2 { font-size:18px; clear:both; margin-top:35px; } #single-cats ul li { float:left; margin-right: 10px; } #single-cats ul li::after { content:','; color:#b3aed3; } #single-cats ul li:last-child:after { content: ""; } a.instructions-button { background-color: #B3AED3; color: #ffffff !important; padding: 5px; margin-top: 20px; padding: 10px; float: none; } /* Dropdown Button */ .dropbtn { background-color: #B3AED3; color: white; padding: 16px; font-size: 16px; border: 0px; cursor: pointer; margin-left: 0px !important; margin-bottom: 0px !important; } /* Dropdown button on hover & focus */ .dropbtn:hover, .dropbtn:focus { background-color: #B3AED3; } /* The container
- needed to position the dropdown content */ .dropdown { position: relative; display: inline-block; } /* Dropdown Content (Hidden by Default) */ .dropdown-content { display: none; position: absolute; background-color: #B3AED3; min-width: 160px; z-index: 1; } /* Links inside the dropdown */ .dropdown-content a { color: #ffffff !important; padding: 12px 16px; text-decoration: none; display: block; } /* Change color of dropdown links on hover */ .dropdown-content a:hover {background-color: #67569D} /* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */ .show {display:block;} /* Product Category Archive */ .tax-product_category article, .tax-species article, .tax-dosages article { width:100%; } #image-thumb { width:100%; height:290px; background-repeat:no-repeat; background-size:contain; background-position: center left; margin-bottom:40px; position:relative; } #image-thumb header { position:absolute; bottom: 0; left: 0; background-color:#000000; width:100%; padding-top:15px; } .tax-product_category .post-more, .tax-species .post-more, .tax-dosages .post-more { display:none; } .type-product h4.title a { height: 80px; display: block; } /* Category Template */ #cat-left { width:100%; } #cat-left div.category { width:94%; margin-bottom:1%; color:#ffffff; background-color:#67559C; padding:3%; font-size:34px; } #cat-left div.category:hover { text-decoration:none; background-color:#442682; } #cat-left div.category a:hover { text-decoration:none; } #cat-right { width: 100%; height: 500px; background-size: contain; background-repeat: no-repeat; margin-top:20px; } /* Industry Links Template */ .single-image { float: left; margin-right: 1%; margin-left: 1%; margin-bottom: 2%; width: 46%; height: 180px; } #dist-image { background-size:contain; background-position:center; width: 100%; height:100%; background-repeat:no-repeat; } .single-image:hover { opacity:0.8; } /* Media Releases Template */ span.date { display:block; } /* Single Post Template */ #featured-image img { float:left; margin-right:20px; margin-bottom:20px; } /* Awards Template */ #temp-a-background_over h4 { font-size: 32px; color:#b3aed3 !important; } .purple-text p { font-size: 18px; font-weight:bold; color:#b3aed3 !important; } /* Method Template */ #method-image { float:left; margin-right:20px; } .page-template-template-method #fancybox-outer { background: #000000; max-width: 80%; margin-left:auto; margin-right:auto; } .page-template-template-method #fancybox-content { border: 0 solid #000; padding: 2%; background: #000000; width:auto !important; } .page-template-template-method #fancybox-wrap { width:auto !important; } #step { height: 130px; } #excerpt p::after { content:' ...read more'; color:#b3aed3; } /* DESKTOP STYLES ----------------- Add styles inside the media query below that you only want to be applied to the desktop layout of your site */ @media only screen and (min-width: 768px) { /* Desktop styles go below this line */ #footer-widgets .footer-widget-2 { border-right: 1px solid #ffffff; padding-top:0px !important; margin-top:20px; } .footer-widget-2 img { margin-top:126px !important; } #social-icons2 { margin-top:157px; } #navigation { float: right; width: auto; max-width: 600px; } #top-nav { float:right; right:0px; } #navigation .nav li.parent > a:after { content:''; width:0; } #nav-container { padding-right:0px; float: right; margin-top:100px; } .header-widget { width:29%; margin-top: 35px; margin-bottom: -60px;} #social-icons2 img:hover { opacity:0.8; } /* Home Template */ /*#slide-text { margin-top:-50px; max-width:500px; margin-bottom:50px; } */ #home-text { width:60%; float:left; display:block; margin-top:50px; } #home-text h3 { color:#B3AED3; } #home-right { width:40%; float:right; display:block; margin-top:-90px; } #post-links li { width: 30%; float:left; margin:1.5%; } #search-post-links li { width: 30%; float:left; margin:1.5%; height:300px; margin-bottom:20px } /* Team Template */ div.single-person { width: 23%; float:left; margin-right:2%; } /* 1 Column Template */ #intro-text { width:60%; } /* Stories */ ul.display-posts-listing .excerpt a { margin-left: 320px; } ul.display-posts-listing a.image { float: left; margin-right: 20px; } /* Single Product Template */ #product-top { overflow: hidden; width: 100%; } #product-top-left { float:left; margin-right:20px; padding-bottom: 500em; margin-bottom: -500em; width: 35%; } #product-image img { width:100%; } #product-top-right { float:left; width: 63%; margin-right: -1px; padding-bottom: 500em; margin-bottom: -500em; } #product-specs img { width:300px; } div.video, div.animation { width: 30%; margin: 1.5%; float: left; display:block; } div.option { width: 22%; margin: 1.5%; float: left; display:block; } /* Product Category Archive */ .tax-product_category article, .tax-species article, .tax-dosages article { width:22%; float:left; margin-right:3%; } #image-thumb { width:100%; height:290px; background-repeat:no-repeat; background-size:contain; background-position: center; margin-bottom:40px; position:relative; } #image-thumb header { position:absolute; bottom: 0; left: 0; background-color:#000000; width:100%; padding-top:15px; } .tax-product_category .post-more, .tax-species .post-more, .tax-dosages .post-more { display:none; } /* Category Template */ #cat-left { width:55%; float:left; margin-right:1%; } #cat-left div.category { width:100%; margin-bottom:1%; color:#ffffff; background-color:#67559C; padding:3%; font-size:34px; } #cat-left div.category:hover { text-decoration:none; background-color:#442682; } #cat-left div.category a:hover { text-decoration:none; } #cat-right { width: 41%; height: 500px; float: right; background-size: contain; background-repeat: no-repeat; margin-top:0px; } /* Industry Links Template */ .single-image { float: left; margin-right: 2%; margin-bottom: 2%; width:22%; height: 180px; } #dist-image { background-size:contain; background-position:center; width: 100%; height:100%; background-repeat:no-repeat; } /* Contact Page Template */ #contact-left { width: 60%; float: left; margin-right: 4%; } #contact-right { width: 36%; float: left; } #contact-menu { width: 100%; display: block; margin-bottom: 30px; margin-top: 20px; height: 50px; } #contact-left iframe { width:100%; } /* Method Template */ #step { width: 46%; float: left; margin-bottom: 4%; margin-right: 2%; height: 130px; } } /* CUSTOM STYLES ----------------- Add styles inside the media query below that you only want to be applied to the mobile layout of your site */ @media only screen and (max-width: 1000px) { /* Mobile styles go below this line */ #step { height: 170px; } } /* MOBILE STYLES ----------------- Add styles inside the media query below that you only want to be applied to the mobile layout of your site */ @media only screen and (max-width: 767px) { /* Mobile styles go below this line */ #social-icons2 img { margin-bottom:20px; } #header-widget { display:none; } #footer-widgets .footer-widget-2 { border-right:0px !important; } .header-widget { margin-top: -255px; margin-bottom: 255px; float: right; } .wpml-ls-statics-shortcode_actions .wpml-ls-current-language:hover>a, .wpml-ls-statics-shortcode_actions .wpml-ls-current-language>a:focus, .wpml-ls-statics-shortcode_actions .wpml-ls-current-language>a, .wpml-ls-statics-shortcode_actions a { color:#ffffff !important; background-color:#000000 !important; border:none; } .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a { border:none; } .wpml-ls-legacy-dropdown { width:10.5em !important; } #social-icons, #social-icons img { display:none !important; } /* Home Template */ #logo { text-align: center; margin-bottom: 30px; margin-top:20px; } #slide-text { margin-bottom:20px; } #home-right { text-align: center; } #search-post-links li { margin-bottom:30px } /* Product Category Archive */ .tax-product_category #main, .tax-product_category article { text-align:center; } #image-thumb { margin-left: auto; margin-right: auto; width: 300px; } .tax-product_category article { margin-top: 30px; } /* Method Template */ .page-template-template-method #fancybox-outer { max-width: 92%; } #step { height: auto; overflow: auto; padding-bottom: 40px; } #method-image { float: none; margin-bottom: 10px; } } .search-filter { background-color: #67559c; padding: 30px 0; margin: 0 auto; } .search-filter h2 { font: bold 30px/1.2em 'Montserrat', arial, sans-serif; color: #ffffff; text-align: center; text-transform: uppercase; } .search-filter .form-control { text-align: center; margin: 35px 0 0 0; } .search-filter select { height: 35px; margin: 5px 0; padding: 5px 40px; display: inline-block; margin-right: 15px; padding-left: 5px; } .search-filter select{ background-image: linear-gradient(45deg, transparent 50%, #67559c 50%), linear-gradient(135deg, #67559c 50%, transparent 50%); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.5em; background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat: no-repeat; border: 0 !important; -webkit-appearance: none; -moz-appearance: none; } .search-filter select:focus { background-image: linear-gradient(45deg, #67559c 50%, transparent 50%), linear-gradient(135deg, transparent 50%, #67559c 50%); background-position: calc(100% - 15px) 1em, calc(100% - 20px) 1em; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; outline: 0; } .search-filter input[type="submit"] { background: #442682; margin-bottom: 0; padding: 6px 15px; border-radius: 0; font-weight: 700; } @media only screen and (max-width: 530px) { .search-filter select { height: 35px; margin: 5px 30px; padding: 5px 15px; display: inline-block; width: 71%; }.search-filter input[type="submit"] { margin-top: 5px; } }