.grid-wrapper {
    display: grid;
}

#isoc-team-search-wrapper {
    position: relative; 
    color: #0c1c2c;
    margin-bottom: 10px;
}

@media (min-width: 700px) {
    #isoc-team-search-wrapper {
        display: inline-block;
    }
}

.isoc-year-dropdown {
    margin: 30px 0 20px 20px;
    display: inline-block;
}

.isoc-year-dropdown select {
    padding: 4px 8px;
    border-radius: 4px;
}

.filters {
    text-align:right;
    padding-right: 20px;
}

@media (max-width: 699px) {
    #isoc-team-search-wrapper {
        margin-left:auto;
        margin-right:auto;
        width:80%;
        display: block;
    }
    .isoc-year-dropdown {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 70%;
        text-align: center;
    }
    .bot-positions-columns li {
        margin-left:5px !important
    }
}



/* inline for isoc-team-search-wrapper ; border:1px solid blue;width:100%; margin-bottom:10px */

.isoc-year-dropdown, #isoc-team-search {
    color: #0c1c2c;
    font-size: 18px !important;
}

#isoc-team-search-clear {
    position:absolute; 
    right:6px; 
    top:50%; 
    transform:translateY(-50%);
    background:none; 
    border:none; 
    font-size:18px; 
    cursor:pointer; 
    display:none;
}

.bot-positions-list {
    background-color: #eff2ec;
    padding-left: 50px;
    padding-bottom:50px;
}

@media (min-width: 1024px) {
    .col6 {
        grid-template-columns: repeat(6, 1fr);
    }
    .col4 {
        grid-template-columns: repeat(4, 1fr);
    }
    .col2 {
        grid-template-columns: repeat(3, 1fr);
    }
    div.grid-item.bot a {
        height:100%;
        padding-bottom: 40px;
    }
    .bot-positions-columns {
        column-count: 3;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .col6 {
        grid-template-columns: repeat(3, 1fr);
    }
    .col4 {
        grid-template-columns: repeat(3, 1fr);}
    .col2 {
        grid-template-columns: repeat(2, 1fr);
    }
     .bot-positions-columns {
        column-count: 2;
    }
}

@media (min-width: 500px) and (max-width: 768px) {
    .col6 {
        grid-template-columns: repeat(2, 1fr);
    }
    .col4 {
        grid-template-columns: repeat(2, 1fr);
    }
    .col2 {
        grid-template-columns: 100%;
    }
     .bot-positions-columns {
        column-count: 1;
    }
}

@media (max-width: 500px) {
    .col2 {
        grid-template-columns: 100%;
    }
    .bot-positions-columns {
        column-count: 1;
    }
    .bot-positions-list {
        padding-left: 20px;
    }
}

div.grid-content { 
    padding: 10px 8px;
    opacity: 0.7;
    top: -75px;
    font-size: 15px;
    margin-top: -6px;
 }

 div.grid-content div {
    margin-bottom: 8px;
    text-align:left;
}

 div.grid-item.jobs {
    text-align:center; 
    background-image:url(/wp-content/uploads/2022/06/Background-Calm-Green.png); 
    min-height: 313px;
    max-height: 368px;
}
 div.grid-item.jobs p {
    font-size:18px;
}

.grid-item.staff.jobs a {
    display: flex;
    flex-direction: column;   /* stack <strong> and text vertically */
    justify-content: center;  /* vertical centering */
    height: 100%;             /* required so it fills the parent */
}

div.grid-item.staff {
    background-color:#d0e6da;
    margin:15px;
    color:#0c1c2c;
}

div.grid-wrapper div.grid-item img {
    filter: grayscale(100%);
    width: 100% 
}

.grid-item.bot a { 
    text-decoration:none !important; 
    color: #0b1c2d !important;
}

div.grid-item.bot, div.grid-item.bot a {
    display:block;
}

.grid-content {
    line-height: 1.6;
}

div.grid-wrapper div.grid-item:hover .grid-content {
    font-size: 16px;
    filter: sepia(30%);
    transition: all 1s cubic-bezier(0, 1, 0.5, 1);
}

div.grid-wrapper div.grid-item:hover img{
    filter:  sepia(30%);
}

.body-text div {
    margin-bottom: unset
}

div.country {
    margin-bottom:15px !important;
    margin-top: -4px !important;
    display:block !important;
}



.bot-positions-list ul,
.bot-positions-list ul li,
.bot-positions-list ul ul {
    list-style: none !important;
    margin: 0;
    padding: 0;
    font-size:18px;
    margin-left:0px !important;
}

.bot-positions-columns {
    column-gap: 2rem;
    list-style: none;
    padding-left: 0;
    width: 80%;
    margin: 0;
}

.bot-positions-list strong {
    margin-bottom: 10px;
    display: block;
}

.bot-positions-columns > li {
    break-inside: avoid;
    margin-bottom: 1.5rem;
}


.bot-positions-columns ul {
    margin: 0.5rem 0 30px 0;
    padding: 0;
    list-style: none;
}

.bot-positions-list .wp-block-heading { 
        margin: 50px 0 40px;
}