/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 29 2024 | 21:36:21 */
#pork-cuts-chart {
  background-image: url('https://donkerbergboerdery.co.za/wp-content/uploads/2024/06/cutschartbg.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  padding:25px 0;
  width:1200px;
}

#pork-cutschart-search {
  background-color: #fff;
  border-radius: 5px;
  height:60px;
  margin-bottom: 35px;
  overflow: hidden;
  padding:10px;
}

#pork-cutschart-search .search-field {
  display: grid;
  grid-template-columns: 1fr 40px;
  grid-column-gap: 10px;
}

#pork-cutschart-search .search-field input {
  border:0;
  box-shadow: none;
  height:40px;
  margin:0
}

#pork-cutschart-search .search-trigger {
  width:40px;
  line-height:40px;
  height:40px;
  text-align:center;
}

#pork-cuts-title {
  margin-bottom: 30px;
}

#pork-cuts-title,
#pork-cuts-description p{
  color:#fff;
}

#pork-cutschart-container{
	position:relative;
	width:100%;
	padding-bottom:57.77%;
	overflow:hidden;
  margin-bottom:50px;
}

#pork-cutschart-map,
#pork-cutschart-map-spots,
#pork-cutschart-hover-spots,
#pork-cutschart-hover-spots .cut-hover{
	position:absolute;
	top:0;
	left:0;
	width:100%;
}

#pork-cutschart-map{
	z-index:2;
}

#pork-cutschart-map-spots{
	z-index:1;
}

#pork-cutschart-map-spots{
	visibility: hidden;
}

#pork-cutschart-hover-spots,
#pork-cutschart-hover-spots .cut-hover {
  z-index: 10;
  pointer-events: none;
}

.pork-cuts-items {
  display:grid;
  grid-template-columns: repeat(3, 33%);
  grid-gap: 10px;
}

.pork-cuts-items .porkbutcher-cut-image {
  width:80%;
  height:80%;
  border:solid 4px #fff;
  border-radius: 250px;
  overflow: hidden;
  display:block;
  margin:auto auto 5px;
  background-color: #df4661;
  min-height: 97px;
}

.pork-cuts-items .porkbutcher-cut-title {
  font-weight:600;
  color:#fff;
  font-size:14px;
  margin-bottom: 20px;
}

.pork-cuts-items .porkbutcher-cut-title .cut-section-title {
  font-weight:400;
}

#pork-cut-search-not-found,
#pork-cut-search-not-found p {
  color:#fff;
}

@media screen and (min-width: 40rem) {

  #pork-cuts-chart {
    padding:110px 0 100px;
  }

  .pork-cut:hover .porkbutcher-cut-image {
    border-color:#df4661;
  }

  .pork-cut:hover .porkbutcher-cut-title {
    color:#df4661;
  }

}



.page-template-page-landingpage .vc_row #pork-cuts-chart-wrapper,
main.full-page .vc_row #pork-cuts-chart-wrapper,
#pork-main.full-page .vc_row #pork-cuts-chart-wrapper {
  width:100%;
  left:0;
  position:absolute;
}

.page-template-page-landingpage .vc_row #pork-cuts-chart,
main.full-page .vc_row #pork-cuts-chart,
#pork-main.full-page .vc_row #pork-cuts-chart {
  left:0;
  position:absolute;
}