body{   font-family: 'proxima_novaregular';}
@font-face {
    font-family: 'proxima_novaregular';
    src: url('fonts/proxima_nova_font-webfont.woff2') format('woff2'),
         url('fonts/proxima_nova_font-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'apolloregular';
    src: url('fonts/apollo-webfont.woff2') format('woff2'),
         url('fonts/apollo-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

h1,h3 {
    font-family: 'apolloregular';
}


   .containerf .box {
    width:23%;
       border: 4px solid #ddc86a;
}
.containerf .box .content{ position: static;}
.containerf .box .content h2,.containerf .nominee .content h2 {
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-size: 20px;
}
.containerf .box .imgBx {
    width: 100%;
    height: auto;
}
h4{color:#ddc86a;}
.containerf .box{ height: auto;}
.containerf .box .imgBx img { border: 4px solid #ddc86a;
       width: 100%;
}
.containerf .box .content h3{   transform: none;}

.nominee {
    text-align: center;
    margin-top: 50px;
    width: 14%;
    margin: 0 10px;
}
.containerf .box .content{ height: auto;}

.containerf .box {
    width: 18%;
    overflow: hidden;
    margin-right: 15px;
    margin-left: 15px;
    margin-top: 0;
    border: 0;
}
.containerf .nominee .imgBx img {
    border: 4px solid #ddc86a;
    width: 100%;
}
.row{width: 100%;}
.containerf .nominee .content h3 {
    color: #fff;
    transition: 0.5s;
    font-size: 14px;
    transform: none;
    transition-delay: 0.4s;
}
.containerf .nominee .content h2.user__name, {
    color: #ddc86a;
}
.containerf .nominee .content h3 {
    color: #fff;
    transition: 0.5s;
    font-size: 14px;
    transform:none;
    transition-delay: 0.4s;
}

.containerf .box .content {
    position: static;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.about {
    background: url(https://indiantellystreamingawards.com/2024/assets/images/partners.jpg) no-repeat left top fixed;
    background-size: cover;
    background-attachment: fixed;
    display: flex;
    justify-content: center;
    flex-direction: column;
    
}.about h3 {
text-transform: capitalize;
    background: #DBAB3A;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    border-radius: 10px;
    padding: 5px 20px;
    font-size: 24px;
    color: #081d42 !important;
}h3.user__title {
 background: unset;
    color: #fff !important;
}
.tba-quotes {
    position: relative;
    text-align: center;
    background: #080f2e;
    padding: 10px 0px 10px 0px;
    color: #DBAB3A;
font-size:30px;
font-weight:600;

}.tba-quotes p{margin:0;}
.containerf {
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
        margin: 0 auto;
    width: 100%;
}

section#hero-area {
    margin: 60px 0 0 0;
}

.navbar-light .navbar-brand{color:#fff;font-weight:bold;}
.containerf h4{background: #fff;
    margin: 20px 0;
    padding: 10px 45px;
    color: #081d42;
    border-radius: 10px 19px;}

.containerf .box .content h2.user__name,.containerf .nominee .content h2.user__name {
    color: #DBAB3A;
    font-size: 22px;
    font-weight: 600;
    margin: 0;
    padding: 0;
}

.containerf .box .content h3.user__title,.containerf .nominee .content h3.user__title {
    background: unset;
    color: #fff !important;
    font-size: 17px;
    font-family: 'proxima_novaregular';
    padding: 0;
margin:0;
}

.containerf .imgBx {
    margin: 0 0 15px 0;
}
.about h3{margin-top:30px;}
hr.goldenl {
    margin: 1rem 0;
    color: inherit;
    background-color: currentColor;
    border: 0;
}

.jury h3 {
    font-size: 20px;
}
.jury h4 {
    font-size: 17px;color:#fff;
}
nav.navbar.navbar-expand-lg.navbar-dark {
    background: #080f2e;
}

.banner {
    margin: 64px 0 0 0;
}
@media (min-width:0px) and (max-width:1024px){
.nominee{width:50%;margin-bottom:20px;}
.containerf .box{width:60%;margin-bottom:20px;}

}














.grid {
  text-align: center;
  max-width: 95vw;
  margin: 2.5vw auto;
}


/* Step 3: how big should the gap be between grid items? remember that the total gap between two items would be double what you set here since both would have that amount set as their individual padding. Also add box-sizing:border-box to make sure the padding doesn't affect the total widh of the item */

.grid-item {
  padding: 5px;
  box-sizing: border-box;
    display:inline;
}


/* Step 4: Add media queries (subjective) to make the whole grid resposive. */

@media (min-width: 500px) {
  .grid-item {
    width: 50%;
  }
}

@media (min-width: 1000px) {
  .grid-item {
    width: 33.333%;
  }
}

@media (min-width: 1700px) {
  .grid-item {
    width: 25%;
  }
}

@media (min-width: 2100px) {
  .grid-item {
    width: 20%;
  }
}