.elementor-19291 .elementor-element.elementor-element-f49cc3d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:60px;--padding-bottom:60px;--padding-left:20px;--padding-right:20px;}.elementor-19291 .elementor-element.elementor-element-f49cc3d:not(.elementor-motion-effects-element-type-background), .elementor-19291 .elementor-element.elementor-element-f49cc3d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0C3A6B;}.elementor-19291 .elementor-element.elementor-element-110351f{text-align:center;}.elementor-19291 .elementor-element.elementor-element-110351f .elementor-heading-title{font-family:"Open Sans", Sans-serif;font-size:34px;font-weight:700;text-transform:none;line-height:1.5em;letter-spacing:1.2px;color:#FFFFFF;}.elementor-19291 .elementor-element.elementor-element-add0f4a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:40px;--padding-left:10px;--padding-right:10px;}.elementor-19291 .elementor-element.elementor-element-93693e6{--display:flex;}@media(min-width:768px){.elementor-19291 .elementor-element.elementor-element-add0f4a{--content-width:1350px;}}@media(max-width:767px){.elementor-19291 .elementor-element.elementor-element-110351f{text-align:center;}.elementor-19291 .elementor-element.elementor-element-110351f .elementor-heading-title{font-size:24px;}}/* Start custom CSS */#dairy__hero { background: linear-gradient(to right, #005daa, #249fe9); }

#dairy__judges .comp__judge .judge_desc,
#dairy__judges .comp__judge .judge__popup_close { display: none; }

.comp__judge { width: 300px; }

.judge_header,
.judge_header { background-color: transparent; }

#dairy__judges_cont { position: relative; }

#dairy__judges .elementor-loop-container {
  display: grid !important;
  grid-auto-flow: column; /* scrolls horizontally */
  grid-auto-columns: min-content;
  grid-template-rows: repeat(2, auto); /* two rows */
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  gap: var(--e-container-default-gap, 2rem);
  padding: 5px 0;
}

#dairy__judges .elementor-loop-container > [data-elementor-type="loop-item"] {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

#dairy__judges_cont #prev,
#dairy__judges_cont #next {
  position: absolute;
  z-index: 10;
  display: grid;
  place-items: center;
  cursor: pointer;
  user-select: none;
}

#dairy__judges_cont #prev { left: 0; }

#dairy__judges_cont #next { right: 0; }

#dairy__judges .elementor-loop-container::-webkit-scrollbar { height: 0; }

#dairy__judges .judge .comp__judge img {
    max-width: 180px;
    height: 180px;
    object-position: 50% 40%;
}

/* LIGHTBOX */
.comp__judge.active {
    display: flex;
    align-content: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 20px;
    background-color: rgba(0, 0, 0, .4)!important;
    z-index: 999999999;
}

.comp__judge.active .judge_header {
    width: 40%;
}

body #dairy__judges .comp__judge.active .judge_desc {
    display: block;
    width: 60%;
}

body #dairy__judges .comp__judge.active .judge__popup_close {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 9999999999;
}

.comp__judge.active > .elementor-element {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 95%;
    max-width: 800px;
    padding: 25px 15px 0;
    background-color: #FFF;
    align-self: center;
}

#dairy__judges .judge .comp__judge.active img {
    max-width: 250px;
    height: 280px;
}

@media (max-width: 767px) {
    .comp__judge { width: 340px; }
    
    .comp__judge.active { align-content: start; }
    
    .comp__judge.active > .elementor-element {
        justify-content: center;
        gap: 0;
        width: calc(100% - 60px);
        height: auto;
        max-height: 100%;
        padding: 30px 15px 15px!important;
        overflow-y: auto;
    }
    
    .comp__judge.active .judge_header { width: 300px; }
    
    body #dairy__judges .comp__judge.active .judge_desc { width: 100%; }
}/* End custom CSS */