html,
body {
overflow-x: hidden; /* Prevent scroll on narrow devices */
}
a:hover {
text-decoration: none;
}
div#main-content {
font-family: "Open Sans", sans-serif;
}
/**
| Fonts
*/
h1 {
font-family: Montserrat, "Trebuchet MS", sans-serif;
font-weight: 600;
font-size: 2em;
color: #477036;
}
h2 {
font-family: "Open Sans", sans-serif;
color: #477036;
font-weight: 600;
font-size: 1.2em;
}
h3 {
font-family: "Open Sans", sans-serif;
color: #477036;
font-weight: 600;
}
h5 {
font-family: "Open Sans", sans-serif;
font-weight: 700;
font-size: 1.1em;
color: #477036;
}
h5 a, h5 a:link, h5 a:visited {
color: #477036;
}
h5 a:hover {
text-decoration: underline;
}
div#product-list h5 {
color: #71b356;
}
h6 {
font-family: "Open Sans", sans-serif;
font-weight: 700;
font-size: 1em;
color: #477036;
}
a h6, a:link h6, a:visited h6 {
text-decoration: none;
}
a:hover h6, a:active h6 {
color: #71b356;
text-decoration: none;
}
.small-text {
font-size: 0.8em;
}
/**
| Header
*/
div#hdr {
background-image: url(../image/background.png);
background-repeat: repeat-x;
background-position-y: 37px;
}
div.mconley-logo {
position: relative;
top: -25px;
left: 0;
/*float: left;*/
z-index: 2;
/*clip-path: circle(200px at center);*/
}
div.mconley-logo-xs {
position: relative;
top: -35px;
left: -60px;
/*float: left;*/
z-index: 2;
/*clip-path: circle(200px at center);*/
}
div.questions {
padding: 10px 0 5px 0;
text-align: right;
font-family: "Open Sans", sans-serif;
font-weight: 600;
color: #477036;
font-size: 18px;
}
div.questions span {
color: #000000;
}
div.primary-nav {
position: relative;
top: 22px;
text-align: right;
}
div.primary-nav a, div.primary-nav a:link, div.primary-nav a:visited {
font-family: "Open Sans", sans-serif;
font-weight: 600;
color: #333333;
font-size: 13px;
padding: 0 2px 0 2px;
text-decoration: none;
}
div.primary-nav a:active, div.primary-nav a:hover {
color: #71b356;
}
div.primary-nav .btn-orange {
color: #ffffff;
background-color: #000000;
border-color: #ccc;
border-top-color: rgb(204, 204, 204);
border-right-color: rgb(204, 204, 204);
border-bottom-color: rgb(204, 204, 204);
border-left-color: rgb(204, 204, 204);
}
.btn-orange {
color: #ffffff;
background-color: #71b356;
border-color: #ccc;
border-top-color: rgb(204, 204, 204);
border-right-color: rgb(204, 204, 204);
border-bottom-color: rgb(204, 204, 204);
border-left-color: rgb(204, 204, 204);
}
div.primary-nav .form-control {
width: 300px;
}
form#search-form-sm .form-control {
width: 80%;
}
/**
| Side Navigation
*/
ul, ol {
list-style-type: none;
}
@media only screen and (min-width: 768px) {
.wsmenu {
width: 240px;
left: 0; /**left: -240px;**/
height: 100%;
position: relative;
}
}
.wsmenu > .wsmenu-list > li > a > .fa {
color: #333333;
}
.wsmenu > .wsmenu-list > li > a {
color: #333333;
}
.mobile-sub .wsmenu-submenu li a {
color: #333333;
}
.mobile-sub .wsmenu-submenu li .wsmenu-submenu-sub li .wsmenu-submenu-sub-sub li a {
color: #333333;
}
/** Make Category Heading Clickable **/
/**
This change allows the parent li function as a link.
**/
.wsmenu-click {
width: 43px;
}
.wsmenu-click02 {
width: 43px;
}
nav.wsmenu {
background-color: #ffffff;
}
.wsmenu > .wsmenu-list > li {
background-color: #ffffff;
}
.mobile-sub .wsmenu-submenu li a {
height: auto;
}
/**
| Breadcrumb
*/
div#breadcrumb {
text-align: right;
font-size: 0.9em;
margin: 4px 0 22px 0;
}
div#breadcrumb, div#breadcrumb a, div#breadcrumb a:link, div#breadcrumb a:visited {
}
div#breadcrumb a:hover, div#breadcrumb a:visited {
}
/**
| Category Pages
*/
div#categories * {
/*width: 165px;*/
text-align: center;
/*margin: 0 auto;*/
}
div#categories > div.row {
margin-bottom: 25px;
}
/**
| Product Lists
*/
div#product-list > .row {
border-bottom: solid 1px #efefef;
}
div#product-list > .row:nth-of-type(odd) {
background-color: #ffffff;
}
div#product-list > .row:nth-of-type(even) {
background-color: #fafafa;
}
.product-thumb {
text-align: center;
padding-top: 5px;
}
.product-thumb img {
max-width: 70%;
max-height: 70%;
padding: 5px;
background-color: #ffffff;
}
div#product-list p {
font-size: 0.9em;
}
div#product-list button {
text-align: center;
margin-top: 20px;
margin-bottom: 10px;
font-size: 1em;
}
div#product-list button:hover {
opacity: 0.8;
}
div#product-list input[type=text] {
/*Qty Field*/
width: 45px;
}
/**
| Detail Page
*/
h1 {
text-align: left;
margin: 0 0 10px 0;
font-size: 1.7em;
}
div#product-images div#more-images {
text-align: center;
margin-top: 20px;
}
div#detail-image {
text-align: center;
}
div#product-images div#detail-image img, div#product-images div#more-images img {
/*display: block;*/
max-width: 350px;
max-height: 350px;
width: 100%;
height: auto;
-webkit-box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
-moz-box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
}
div#product-images div#more-images img {
max-width: 120px;
max-height: 120px;
width: 100%;
height: auto;
-webkit-box-shadow: 2px 2px 3px 0 rgba(50, 50, 50, 0.3);
-moz-box-shadow: 2px 2px 3px 0 rgba(50, 50, 50, 0.3);
box-shadow: 2px 2px 3px 0 rgba(50, 50, 50, 0.3);
}
div#suggestions img {
max-width: 90px;
max-height: 90px;
width: 100%;
height: auto;
-webkit-box-shadow: 1px 1px 3px 0 rgba(50, 50, 50, 0.3);
-moz-box-shadow: 1px 1px 3px 0 rgba(50, 50, 50, 0.3);
box-shadow: 1px 1px 3px 0 rgba(50, 50, 50, 0.3);
}
div#product-images div#more-images img:hover, div#suggestions img:hover {
opacity: 0.70;
}
/**
| Footer
*/
footer {
margin-top: 25px;
color: #ffffff;
// background-color: #477036;
padding: 30px 0;
background-color: #007934; /* For browsers that do not support gradients */
background-image: linear-gradient(#477036, black); /* Standard syntax (must be last) */
}
footer a, footer a:link, footer a:visited {
text-decoration: none;
color: #ffffff;
}
footer a:hover, footer a:active {
text-decoration: none;
color: #5DE339;
}
footer h5 {
font-weight: 600;
font-style: italic;
font-size: 1.3em;
}
footer a:hover img {
opacity: 0.7;
}
/**
| Buttons
*/
.btn-mc-green {
font-weight: bold;
color: #fff;
background-color: #477036;
border-color: #cccccc;
}
.btn-mc-green:hover {
color: #000000;
}
.btn-mc-orange {
color: #fff;
font-weight: bold;
background-color: #000000;
border-color: #cccccc;
}
.btn-mc-orange:hover {
color: #477036;
}
.btn-mc-green-outline {
font-weight: bold;
padding: 0 4px 0 4px;
font-size: 12px;
color: #477036;
background-color: #ffffff;
border: #477036 1px solid;
}
.btn-mc-green-outline:hover {
color: #ffffff;
background-color: #71b356;;
/*opacity: 0.70;*/
}
/**
| Forms
*/
label {
text-align: right;
}
/* If an input has the red-placeholder class, it will be RED. */
.red-placeholder::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #ff0000;
}
.red-placeholder:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #ff0000;
opacity: 1;
}
.red-placeholder::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #ff0000;
opacity: 1;
}
.red-placeholder:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #ff0000;
}
.red-placeholder::-ms-input-placeholder { /* Microsoft Edge */
color: #ff0000;
}
.red-placeholder::placeholder { /* Most modern browsers support this now. */
color: #ff0000;
}
/**
Template Presentation
*/
span.template-category {
font-family: "Open Sans", sans-serif;
font-weight: 700;
font-size: 1.1em;
color: #000000;
}
/**
| Effects
*/
a:hover img.category {
opacity: 0.7;
}
div#specifications ul {
margin: 15px 0 15px 0;
border-top: solid 1px #efefef;
border-bottom: solid 1px #efefef;
}
div#specifications ul li {
list-style: disc;
margin-bottom: 4px;
}
.center_container {
margin: 0 auto;
width: 80% /* value of your choice which suits your alignment */
}
.dashed-box {
margin: 8px;
background-color: #fefefe;
border: dashed 1px #cccccc;
padding: 5px;
}
/*
| Misc
*/
.vertical-space-200 {
height: 200px;
}
.mb20 {
margin-bottom: 20px;
}
.mr-15 {
margin-right: 15px;
}
.mr-25 {
margin-right: 25px;
margin-bottom: 5px;
}
.shadow {
-webkit-box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
-moz-box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
box-shadow: 3px 3px 5px 0 rgba(50, 50, 50, 0.3);
}
.full-height {
display: table-column;
height: 100%;
}
.orange-bg {
background-color: #000000;
}
.green-bg {
background-color: #477036;
}
ul.es-bullet > li {
list-style: disc;
}
.text-orange {
color: #000000;
}
hr.short {
margin: 30px 20% 30px 20%;
}
div.row-stripes > div.row {
padding: 6px;
}
div.row-stripes > div.row:nth-child(even) {
background-color: #e7f5e0;
}
/*div.product-categories div {*/
/*background-color: #efefef;*/
/*}*/
div.product-categories p {
font-size: 16px;
font-weight: 600;
margin: 0 0 20px;
}
div.product-categories p a:hover {
color: #000000;
}
div.category-element {
height: 240px;
}
img.category {
width: 165px;
height: 165px;
}
div.product-categories-row a h6 {
color: #337ab7;
text-align: center;
font-size: 16px;
font-weight: 600;
margin: 5px 0 20px 0;
}
div.product-categories-row a img {
text-align: center;
margin: 0 auto;
}
div.product-categories-row a:hover h6 {
color: #000000;
}
div.product-categories-row a:hover {
color: #000000;
}
div.markdown ul {
list-style-type: disc;
}
div#product-list > .warn {
background-color: #FBE63E;
}
@media print {
a[href]:after {
visibility: hidden;
}
/*div.product-thumb {*/
/*width: 145px;*/
/*height: 145px;*/
/*padding: 0;*/
/*!*float: left;*!*/
/*}*/
.product-thumb img, img.print-img {
width: 113px;
height: 1113px;
max-height: 113px; !important;
max-width: 113px; !important;
padding: 0;
float: left;
}
input[type=text], a.btn, button[type=button] {
display: none;
}
div.print-hide {
display: none;
}
div.col-print-12 {
width: 100%
}
}