.resourcesbodypagebackground{
    width:100%;
    overflow: hidden;
    padding-top: 10%;
}

.dotted-col {
    border-right: 2px dashed white; /* Dotted line on the right */
    padding-right: 10px;
}

.resourcesSubHead{
    padding-left: 10%;
    font-size:30px;
    font-family: 'HelveticaNowDisplay-Bold';
    background: linear-gradient(to right, #ffffff, #999999);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.resourcesLatest{
    font-size:20px;
    font-family: 'HelveticaNowDisplay-Regular';
    color:#ff9900;
}

.resourcesLeftHead{
    margin-top: 10%;
    padding-left: 10%;
    font-size:32px;
    font-family: 'HelveticaNowDisplay-Bold';
    background: linear-gradient(to right, #ffffff, #999999);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.resourcesLeftSubHead{
    margin-top: 10%;
    padding-left: 10%;
    font-size:24px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:#ff9900;
}

.resourcesLeftText{
    margin-top: 10%;
    padding-left: 10%;
    font-size:24px;
    font-family: 'HelveticaNowDisplay-Bold';
    background: linear-gradient(to right, #ffffff, #999999);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.resourcesLeftSubText{
    margin-top: 10%;
    padding-left: 10%;
    font-size:16px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:white;
}

#Articles{
    margin-left:3.5%;
}

#Media{
    margin-left:3.5%;
}

#Events{
    margin-left:3.5%;
}

.Articlesdiv{    
    position:relative;
    height:160px;
    width:auto;
    margin-right: 50px;
    border-bottom: 1px solid white;
    padding-top:10px;
    padding-bottom:10px;
    margin-top:30px;
    margin-bottom:30px;
    overflow: hidden;
    cursor: pointer;
}



.Articlesdiv h1{
    font-size:15px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:white;
    text-decoration: underline;
    text-decoration-color: #FF9900;
}

.Articlesdiv h2{
    position:absolute;
    font-size:15px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:#FF9900;
    bottom:10px;
}

.Articlesdiv p{
    font-family: 'HelveticaNowDisplay-Bold';
    font-size:16px;
    color: white;
}

/* .Articlesdiv img:first-child{
    height:200px;
} */


.res-list {
    list-style: none; /* Remove default bullet points */
    padding-top: 12%;
    gap:20%;
}

.Datediv{
    margin-top: 10%;
    margin-left: 10%;
    background-image: url("https://www.algorithmicbiologics.com/images/Blog/DateVec.png");
    background-size: cover;   /* makes it fill the div */
    background-position: center;
    height:23px;
    width:101px;
}

.Datediv p{
    padding-left: 5%;
    font-size:20px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:#FF9900;
    letter-spacing: 3px;
}

.artText{
    padding-top:10%;
    padding-left: 10%;
    font-size:16px;
    font-family: 'HelveticaNowDisplay-Regular';
    color:white;
}
  
.res-list li {
    position: relative;
    padding-left: 20px; /* Space for the tick icon */
    margin-bottom: 35px; /* Add spacing between list items */
    font-size: 16px;
    font-family: 'HelveticaNowDisplay-Regular';
    color: white;
    text-transform: uppercase;
}
  
.res-list li::before {
    content: '|'; /* Unicode for a checkmark */
    color: #FF9900; /* Yellow color for the tick */
    position: absolute;
    left: 0; /* Position the tick to the left of the text */
    font-size: 16px; /* Adjust size as needed */
}

.res-list li a{
    color:white;
    text-decoration: none;
}

.resourcebodybox{
    background: url('../images/resourcesPageBox.png');
    width:361px;
    height:250px;
    margin-left: 10%;
}

.resourcebodyboxHead{
    padding-top: 25px;
    padding-left: 10%;
    font-size:24px;
    font-family: 'HelveticaNowDisplay-Bold';
    background: linear-gradient(to right, #ffffff, #999999);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.resourcebodyboxText{
    padding-left: 10%;
    font-size:16px;
    font-family: 'HelveticaNowDisplay-regular';
    color:white;
}

.respad{
    margin-left: 10%;
}

.seeall{
    padding-left: 10%;
    font-size:24px;
    font-family: 'HelveticaNowDisplay-Bold';
    background: linear-gradient(to right, #ffffff, #999999);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sellALLarrow{
    margin-top: 10px;
    height:24px;
    width:24px;
}

.educationVideoHead{
    padding-top: 25px;
    padding-left: 10%;
    font-size:24px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:white;
}

.educationVideoText{
    padding-left: 10%;
    font-size:16px;
    font-family: 'HelveticaNowDisplay-Regular';
    color:white;
}

.mediaImg{
    padding-top: 10%;
    height:173px;
    width:213px;
    padding-left: 10%
}

.mediaHead{
    padding-left: 10%;
    font-size:16px;
    font-family: 'HelveticaNowDisplay-regular';
    color:#ff9900
}

.mediaSubHead{
    padding-left: 10%;
    font-size: 16px;
    font-family: 'HelveticaNowDisplay-Bold';
    color:white;
    height:80px;
}

.mediaText{
    width:90%;
    padding-left: 10%;
    font-size: 16px;
    font-family: 'HelveticaNowDisplay-Regular';
    color:white;
    height:80px;
    word-wrap: break-word; /* For old browsers */
}

.leftImg{
    margin-top: 10%;
    height:256px;
    width:287px;
    margin-left: 10%;
}

@media only screen and (max-width: 991px) and (min-width: 700px) {
    .Articlesdiv {
        height: 250px;
        margin-right:10px;
    }
    .Articlesdiv img{
        margin-left:-20px;
    }
}

@media only screen and (max-width: 768px){
    .resourcesSubHead{
        padding-top: 10%;
    }
    .resourcesLatest{
        font-size: 16px;
    }   
    .artText{
        padding-right: 10%;
    }
    .mediaSubHead{
        height:130px;
    }
    .mediaText{
        height:130px;
    }
    .mediaImg{
        padding-left: 10%;
    }
}