@charset "UTF-8";
/* CSS Document */


/* Mobile Portrait Layout: 320px and below. */

.wrapper {
	margin-left: auto;
	margin-right: auto;
	width: 92%;
	padding-left: 4%;
	padding-right: 4%;
}

h1 {font-size: 1.5em}

.site-wrapper .mobile-nav {display: block}

header .wrapper {padding-top: 8px; padding-bottom: 8px}
header .wrapper .logo {width: 42%; max-width: 140px; margin: auto}

header .wrapper .utilities {margin-right: -5px}

header .menu, footer .menu, header .wrapper .utilities li.account {display: none}

main .wrapper {padding-top: 50px}

#block-products .views-row .views-field-title {padding: 20px 0 20px 0; text-align: center}
#block-products .views-row .views-field-field-image img {max-height: 350px}
#block-products .views-row .views-field-body p, #block-products .views-row .views-field-view-commerce-product {text-align: center}

.product-grid ul li img {max-width: 150px}
.product .left img {max-width: 190px}

.path-cart .cart table tr td {text-align: center; padding-bottom: 20px}
main .form-actions {padding: 40px 0 80px 0; text-align: center}

.share {display: none}
.share .links {top: 30px; left: 0}

.form-text, .form-number, .form-email, .form-textarea {width: 100%}

/* Mobile Landscape Layout: 321px to 480px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 321px) {

.wrapper {
	margin-left: auto;
	margin-right: auto;
	width: 92%;
	padding-left: 4%;
	padding-right: 4%;
}

#commerce-product-add-to-cart-form .form-actions {position: absolute; right: 0; top: 0}

#block-products .views-row .views-field-title {text-align: left}
#block-products .views-row:nth-child(even) .views-field-field-image {float: left}
#block-products .views-row:nth-child(odd) .views-field-field-image {float: right}
#block-products .views-row .views-field-body p, #block-products .views-row .views-field-view-commerce-product {text-align: left}

.product .left img {max-width: 250px}

.product-grid li {float: left; margin-right: 5%; width: 47.5%}
.product-grid ul li:nth-child(2n+2), .news-grid ul li:nth-child(2n+2) {margin-right: 0}
.product-grid ul li img {max-width: 170px}

footer .wrapper .campaignmonitor-subscribe .form-item {display: inline-block}

.form-text, .form-number, .form-email, .form-textarea {width: auto}

}


/* Tablet Portrait Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

.wrapper {
	width: 97.9168%;
	margin: auto;
	padding-left: 1.0416%;
	padding-right: 1.0416%;
}

h1 {font-size: 1.8em}

header .utilities .account {display: inline-block}

#block-products .views-row {width: 80%; margin: auto}
#block-products .views-row .views-field-title {padding: 60px 0 20px 0}
#block-products .views-row .views-field-field-image img {max-height: 470px}
#block-products .views-row:nth-child(even) .views-field-field-image {float: left; margin-right: 3%}
#block-products .views-row:nth-child(odd) .views-field-field-image {float: right; margin-left: 3%}

.product .left {float: left; margin-right: 3%; width: 37%}
.product .left img {max-width: none}
.product .right {margin-left: 40%}
.product .right .title {padding-top: 90px}

.product-grid li {float: left; margin-right: 5%; width: 30%}
.product-grid ul li:nth-child(2n+2), .news-grid ul li:nth-child(2n+2) {margin-right: 5%}
.product-grid ul li:nth-child(3n+3), .news-grid ul li:nth-child(3n+3) {margin-right: 0}
.product-grid ul li img {max-width: 250px}

.path-news .views-element-container .views-row:nth-child(odd) .views-field-field-image {float: left; width: 32%; margin-right: 3%}
.path-news .views-element-container .views-row:nth-child(odd) .views-field-title, .path-news .views-element-container .views-row:nth-child(odd) .views-field-body, .path-news .views-element-container .views-row:nth-child(odd) .views-field-view-node {margin-left: 35%}

.path-news .views-element-container .views-row:nth-child(even) .views-field-field-image {float: right; width: 32%; margin-left: 3%}
.path-news .views-element-container .views-row:nth-child(even) .views-field-title, .path-news .views-element-container .views-row:nth-child(even) .views-field-body, .path-news .views-element-container .views-row:nth-child(even) .views-field-view-node {margin-right: 35%}

}


/* Tablet Landscape Layout: 769px to a max of 1024px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.wrapper {
	width: 97.9168%;
	margin: auto;
	padding-left: 1.0416%;
	padding-right: 1.0416%;
}

#drawer-toggle, #drawer-toggle-label, .site-wrapper .mobile-nav {display: none}

header .wrapper {padding-bottom: 20px}
header .wrapper .logo {width: 18%; max-width: none; float: left; margin-top: 12px}
header .wrapper .utilities {margin-bottom: 15px; margin-right: 0}
header .wrapper .utilities li.account {display: inline-block}

header .menu, footer .menu {display: table}
main .wrapper {padding-top: 100px}

.product-grid li {float: left; margin-right: 0; width: 25%}
.product-grid ul li:nth-child(2n+2), .news-grid ul li:nth-child(2n+2) {margin-right: 0%}
.product-grid ul li:nth-child(3n+3), .news-grid ul li:nth-child(3n+3) {margin-right: 0%}
.product-grid ul li:nth-child(4n+4), .news-grid ul li:nth-child(4n+4) {margin-right: 0}

#block-products .views-row {padding: 0 15%}

.product {padding: 0 10%}
.path-cart .cart table tr td {text-align: inherit; padding-bottom: 0}
main .form-actions {padding: 40px 0 80px 0; text-align: right}

.node--type-article .image.float {float: right; margin-left: 30px; width: 45%}

}


/* Desktop Layout: 1025px to a max of 1260px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1025px) {

.wrapper {
	width: 88.75%;
	max-width: 960px;
	margin: auto;
	padding-left: 0.625%;
	padding-right: 0.625%;
}

.path-news .views-element-container, .path-news #block-kelvedon-page-title {width: 80%; margin: auto}

.share {display: block}
.share .links {top: 0; left: 30px; width: 140px}

}


/* Desktop Layout: 1261px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1261px) {

.wrapper {
	width: 88.75%;
	max-width: 1170px;
	margin: auto;
	padding-left: 0.625%;
	padding-right: 0.625%;
}

}


/* Retina display */

@media only screen and (-webkit-min-device-pixel-ratio:2),
@media only screen and (-moz-min-device-pixel-ratio:2),
@media only screen and (min-device-pixel-ratio:2) {

header .wrapper .utilities li.cart a {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/cart@2x.png); background-size: 24px 29px}

footer .wrapper ul.follow li a.instagram {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/instagram@2x.png); background-size: 30px 30px}

footer .wrapper ul.follow li a.facebook {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/facebook@2x.png); background-size: 16px 32px}

.owl-carousel .down {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/chevron@2x.png); background-size: 36px 20px}

.share span, .share .links ul li a {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/icons-share@2x.png); background-size: 160px 32px}

footer .wrapper .campaignmonitor-subscribe .form-item .form-text {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/icon-envelope@2x.png); background-size: 46px 29px}

.form-submit, .views-field-view-commerce-product a, .views-field-view-node a {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/icon-more@1x.png); background-size: 35px 70px}

#commerce-product-add-to-cart-form .form-submit {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/icon-add@2x.png); background-size: 35px 70px}

.views-field-remove-button .form-submit {background-image: url(/sites/kelvedonestate.com.au/themes/kelvedon/images/icon-close@2x.png); background-size: 35px 70px}

}

/* Tables */

@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

  table caption {
    font-size: 1.3em;
  }
  
  table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table tr {
    /*border-bottom: 3px solid #ddd;*/
    display: block;
    margin-bottom: .625em;
  }
  
  table td {
    /*border-bottom: 1px solid #ddd;*/
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  table td:last-child {
    border-bottom: 0;
  }
}
