
.carouselcard{
    background: #fff;
    height: 300px;
    padding:15px;
    border : 1px solid #da0030;
}


.carouselcard2{
    background: #fff;
    height: 300px;
    padding:15px;
border : 1px solid #da0030;
}

.gridsection .gridcoll{
	padding:0px;
}	
.gridsection .parentdiv{
  display:flex;
}

/* Container for the grid */
    .grid-container {
        display: grid;
        grid-template-columns: repeat(6, 1fr); /* 6 equal columns */
        /* gap: 10px; */
        /* padding: 10px; */
    }

    /* Grid item styles */
    .grid-item {
        background-color: lightgray;
        text-align: center;
        border: 1px solid #ddd;
        height: 150px;
        width: 200px;
    }
    .sBox{
        position: relative;
        background-color: #ba0027; 
        width: clamp(150px, 100%, 250px); 
        height: 150px; display: flex ; 
        align-items: center; 
        justify-content: center; 
        flex-flow: column;
        margin:0 auto;
        padding:20px;
    }

    .sBox b {
        position: absolute;
        left: -38px;
        top: 0;
        z-index: 1;
        font-size: 60px;
        color: #000;
        font-weight: bold;
        line-height: 40px;
    }

    .sectionone{
        text-align:center;
        background: #fff6e9 !important;
        margin-top: 0px; 
        padding: 50px;
    }

    .sectionone h3{
        color: #000; 
        font-weight: bold;
        font-family: 'Patrick Hand', cursive;
    }

    .sectionone .subhead{
        text-align:center !important;
        color: #c4002a;
    }

    .sectionone h4{
        font-size:20px;
        color: #fff; 
        font-weight: 600;
    }

    .sectionone p{
        text-align:center !important;
        padding-top:5px;
        font-size:15px;
	color:#fff;
    }
    .sectionone a{
        background-color: #F6AD1B;
        padding: 12px;
        color: #000;
        font-weight: bold;
        text-transform: uppercase;
        font-size: 14px;
    }

    .sectiontwo{
        padding-top:60px;
    } 
    .secHeading{
        position: relative;
        border-bottom: 1px solid #F6AD1B;
        margin-bottom: 20px;
        text-align: center;
    }
    .sectiontwo b{
        font-size: 100px;
        font-weight: bold;
        color: #F6AD1B;
        position: absolute;
        left: 50px;
        bottom: -11px;
        line-height: 1;
    }
    .sectiontwo h4{
        color: #000;
        font-weight: 600;
    }

    .sectiontwo .subhead{
        text-align: center;
        color: #2e64ae;
        padding-bottom: 25px;
        padding-top: 10px;
    }

    .sectiontwo h3{
        color: #000000;
        margin-top: 40px;
    }

    .iconBox{
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 15px;
        background: #c4002a;
        color: #fff;
        height: 140px;
        margin-bottom: 20px;
        padding: 30px;
    }
    .sectiontwo h5{
        font-size: 35px;
        font-weight: bold;
    }
    .ibDetails p{
        color:#fff;
        text-align:left;
        font-size:14px;
    }

    /* tabs */

    .season_tabs {
        position: relative;   
        min-height: 360px; /* This part sucks */
        clear: both;
        margin: 25px 0;
    }
    .season_tab {
        float: left;  
        clear: both;
        width: 359px;
    }
    .season_tab label {
        background: #cf002d;
        padding: 10px;
        border: 1px solid #fff;
        margin-left: -1px;
        font-size:14px;
        vertical-align: middle;
        position: relative;
        left: 1px;
        width: 359px;
        height: 68px;
        display: table-cell;
        color: #fff;
    }
    .season_tab [type=radio] {
        display: none;   
    }
    .season_content {
        position: absolute;
        top: 0;
        left: 360px;
        background: white;
        right: 0;
        bottom: 0;
        padding: 20px;
        border: 1px solid #ccc;
        height:408px;
    }
    .season_content span {
        animation: 0.5s ease-out 0s 1 slideInFromTop; 
    }
    [type=radio]:checked ~ label {
        background: white;
        border-bottom: 2px solid #cf002d;
        z-index: 2;
        color: #000;
    }
    [type=radio]:checked ~ label ~ .season_content {
        z-index: 1;
    }

    .sectionthree{
        text-align:center;
        background: #fff6e9 !important; 
        margin-top: 10px; 
        padding: 50px;
    }
    .sectionthree h3{
        color: #000;
        font-size: 24px;
        font-weight: 600;
        margin-bottom:30px;
    }

    .sectionfour h4{
        color: #000;
        margin-top: 40px;
        text-align:center;
        font-weight:600;
    }
    
    .alumnicard{
	border: 4px solid #cf002d;
    	height: 400px;
	padding:18px;
	position:relative;
    }

    .alumnicard img{
	width:170px;
	height:93px;
    }

    .alumnicard span{
	font-size:12px;
    }

    .alumnicard hr{
	margin-top:6px;
	margin-bottom:6px;
    }

    .alumnicard h5{
	color: #000;
    }

    .alumnicard p{
	font-size:14px;
	font-weight: 600; 
	color: #000;
    }
 
    .alumnicard ul{
	list-style: disc;
    	margin-left: 20px;
    }	
    
    .alumnicard ul li{
	font-size: 15px; 
	font-weight: 600; 
	color: #000;
    }
	
    .alumnicard button{
	background-color: #cf002d;
    	border-color: #cf002d;
        position:absolute;
        right: 10px;
        bottom: 15px;
    }

    .alumnicard button:hover{
	background-color: #cf002d;
    	border-color: #cf002d;
    }
 
    .sectionfive h4{
        color: #000;
        margin-top: 40px;
        text-align:center;
        font-weight:600;
    }

    .alumnispeak{
	border: 1px solid #000;
    	height: 500px;
	background: #006cb3;
	padding:30px;
    }	
	
    .alumnispeak p{
	font-size: 14px;
    	color: #fff;
    	text-align: left;
    }	

    .alumnispeak h5{
	color: #ffb874;
    	font-weight: 600;
     }	

	
     .secHeading2 {
    	position: relative;
    	border-bottom: 1px solid #F6AD1B;
    	margin-bottom: 20px;
    	text-align: center;
     }

     .secHeading2 b {
    	font-size: 100px;
    	font-weight: bold;
    	color: #F6AD1B;
    	position: absolute;
    	left: 50px;
    	bottom: -11px;
    	line-height: 1;
     }

     .secHeading2.secRight b {
    	left: initial;
    	right: 50px;
     }
     
     .secHeading2 h4{
	font-size: 28px;
    	color: #156CB3;
    	font-weight: bold;
     }

     .secHeading2 p{
	font-size: 18px;
   	margin-bottom: 1rem;
    	color: #156CB3;
	text-align:center;
     }

     .sectionsix_cnt h3{
	font-size: 30px;
   	color: #156CB3;
	text-align:center;
     }

     .sectionsix_cnt p{
	font-size: 18px;
    	margin-bottom: 1rem;
	text-align:center;
     }

    .secHeading3{
	position: relative;
    	border-bottom: 1px solid #F6AD1B;
    	margin-bottom: 20px;
    	text-align: center;
     }
    .secHeading3 h4{
	font-size: 28px;
    	color: #156CB3;
    	font-weight: bold;
    }

    .secHeading3 p{
	font-size: 18px;
   	margin-bottom: 1rem;
    	color: #156CB3;
	text-align:center;
     }

     .secHeading3 b{
	font-size: 100px;
    	font-weight: bold;
    	color: #F6AD1B;
    	position: absolute;
    	left: 50px;
    	bottom: -10px;
    	line-height: 1;
     }
     .sectionseven_cnt h3{
	font-size: 24px;
   	color: #156CB3;
	text-align:center;
     }







		
/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: #1668af;
  color:#fff;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
 width:33.3%;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #f9b03d;
 color:#000;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #f9b03d;
  color:#000;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
  height:350px !important;	
}

   
	
    .wrapper {
        max-width: 1100px;
        width: 100%;
        position: relative;
    }
    .wrapper i {
        top: 50%;
        height: 50px;
        width: 50px;
        cursor: pointer;
        font-size: 1.25rem;
        position: absolute;
        text-align: center;
        line-height: 50px;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
        transform: translateY(-50%);
        transition: transform 0.1s linear;
    }
    .wrapper i:active {
        transform: translateY(-50%) scale(0.85);
    }
    .wrapper i:first-child {
        left: -22px;
        z-index: 9999;
    }
    .wrapper i:last-child {
        right: -22px;
    }
    .wrapper .carousel {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: calc((100% / 3) - 12px);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        border-radius: 8px;
        scroll-behavior: smooth;
        scrollbar-width: none;
    }
    .carousel::-webkit-scrollbar {
        display: none;
    }
    .carousel.no-transition {
        scroll-behavior: auto;
    }
    .carousel.dragging {
        scroll-snap-type: none;
        scroll-behavior: auto;
    }
    .carousel.dragging .card {
        cursor: grab;
        user-select: none;
    }
    .carousel :where(.card, .img) {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .carousel .card {
        scroll-snap-align: start;
        height: 342px;
        list-style: none;
        background: #fff;
        cursor: pointer;
        padding-bottom: 15px;
        flex-direction: column;
        border-radius: 8px;
    }
    .carousel .card .img {
        background: #8b53ff;
        height: 148px;
        width: 148px;
        border-radius: 50%;
    }
    .card .img img {
        width: 140px;
        height: 140px;
        border-radius: 50%;
        object-fit: cover;
        border: 4px solid #fff;
    }
    .carousel .card h2 {
        font-weight: 500;
        font-size: 1.56rem;
        margin: 30px 0 5px;
    }
    .carousel .card span {
        color: #6a6d78;
        font-size: 1.31rem;
    }

	@media only screen and (max-width: 768px) {
	  .alumnigridimg{
          	height : 110px !important;
          }
          .globalimages{
          	width:100% !important;
          }
.carouselcard{
height:auto !important;
}
        }

    @media screen and (max-width: 900px) {
        .wrapper .carousel {
            grid-auto-columns: calc((100% / 2) - 9px);
        }
    }

    @media screen and (max-width: 600px) {
        .wrapper .carousel {
            grid-auto-columns: 96%;
        }
    }



    .wrapper2 {
        max-width: 1100px;
        width: 100%;
        position: relative;
    }
    .wrapper2 i {
        top: 50%;
        height: 50px;
        width: 50px;
        cursor: pointer;
        font-size: 1.25rem;
        position: absolute;
        text-align: center;
        line-height: 50px;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
        transform: translateY(-50%);
        transition: transform 0.1s linear;
    }
    .wrapper2 i:active {
        transform: translateY(-50%) scale(0.85);
    }
    .wrapper2 i:first-child {
        left: -22px;
    }
    .wrapper2 i:last-child {
        right: -22px;
    }
    .wrapper2 .carousel2 {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: calc((100% / 3) - 12px);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        border-radius: 8px;
        scroll-behavior: smooth;
        scrollbar-width: none;
    }
    .carousel2::-webkit-scrollbar {
        display: none;
    }
    .carousel2.no-transition {
        scroll-behavior: auto;
    }
    .carousel2.dragging {
        scroll-snap-type: none;
        scroll-behavior: auto;
    }
    .carousel2.dragging .card {
        cursor: grab;
        user-select: none;
    }
    .carousel2 :where(.card2, .img) {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .carousel2 .card2 {
        scroll-snap-align: start;
        height: 342px;
        list-style: none;
        background: #fff;
        cursor: pointer;
        padding-bottom: 15px;
        flex-direction: column;
        border-radius: 8px;
    }
    .carousel2 .card2 .img {
        background: #8b53ff;
        height: 148px;
        width: 148px;
        border-radius: 50%;
    }
    .card2 .img img {
        width: 140px;
        height: 140px;
        border-radius: 50%;
        object-fit: cover;
        border: 4px solid #fff;
    }
    .carousel2 .card2 h2 {
        font-weight: 500;
        font-size: 1.56rem;
        margin: 30px 0 5px;
    }
    .carousel2 .card2 span {
        color: #6a6d78;
        font-size: 1.31rem;
    }

    @media screen and (max-width: 900px) {
        .wrapper2 .carousel2 {
            grid-auto-columns: calc((100% / 2) - 9px);
        }
    }

    @media screen and (max-width: 600px) {
        .wrapper2 .carousel2 {
            grid-auto-columns: 100%;
        }
    }




.wrapper3 {
        max-width: 1100px;
        width: 100%;
        position: relative;
    }
    .wrapper3 i {
        top: 50%;
        height: 50px;
        width: 50px;
        cursor: pointer;
        font-size: 1.25rem;
        position: absolute;
        text-align: center;
        line-height: 50px;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
        transform: translateY(-50%);
        transition: transform 0.1s linear;
    }
    .wrapper3 i:active {
        transform: translateY(-50%) scale(0.85);
    }
    .wrapper3 i:first-child {
        left: -22px;
     z-index: 9999;
    }
    .wrapper3 i:last-child {
        right: -22px;
    }
    .wrapper3 .carousel3 {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: calc((100% / 3) - 12px);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        border-radius: 8px;
        scroll-behavior: smooth;
        scrollbar-width: none;
    }
    .carousel3::-webkit-scrollbar {
        display: none;
    }
    .carousel3.no-transition {
        scroll-behavior: auto;
    }
    .carousel3.dragging {
        scroll-snap-type: none;
        scroll-behavior: auto;
    }
    .carousel3.dragging .card {
        cursor: grab;
        user-select: none;
    }
    .carousel3 :where(.card3, .img) {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .carousel3 .card3 {
        scroll-snap-align: start;
    	height: 460px;
    	list-style: none;
    	background: #fff;
    	cursor: pointer;
    	padding-bottom: 15px;
    	flex-direction: column;
    	border-radius: 8px;
    	border: 1px solid #da0030;
    	padding: 16px;
        position:relative;
    }
    .carousel3 .card3 .img {
        background: #8b53ff;
        height: 148px;
        width: 148px;
        border-radius: 50%;
    }
    .card3 .img img {
        width: 140px;
        height: 140px;
        border-radius: 50%;
        object-fit: cover;
        border: 4px solid #fff;
    }
    .carousel3 .card3 h2 {
        font-weight: 500;
        font-size: 1.56rem;
        margin: 30px 0 5px;
    }
    .carousel3 .card3 span {
        color: #fff;
        font-size: 14px;
    }
    .carousel3 p {
       font-size:15px;
       position:absolute;
       top: 12px;
       padding: 15px;

    }
    .carousel3 .footerr{
       	width: 100%;
    	position: absolute;
    	bottom: 0px;
    	left: 0px;
    	background: #2368af;
    	padding: 6px;
    }

    

    @media screen and (max-width: 900px) {
        .wrapper3 .carousel3 {
            grid-auto-columns: calc((100% / 2) - 9px);
        }
    }

    @media screen and (max-width: 600px) {
        .wrapper3 .carousel3 {
            grid-auto-columns: 100%;
        }
	.
    }


 .wrapper4 {
        max-width: 1100px;
        width: 100%;
        position: relative;
    }
    .wrapper4 i {
        top: 50%;
        height: 50px;
        width: 50px;
        cursor: pointer;
        font-size: 1.25rem;
        position: absolute;
        text-align: center;
        line-height: 50px;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
        transform: translateY(-50%);
        transition: transform 0.1s linear;
    }
    .wrapper4 i:active {
        transform: translateY(-50%) scale(0.85);
    }
    .wrapper4 i:first-child {
        left: -22px;
	z-index: 99999;
    }
    .wrapper4 i:last-child {
        right: -22px;
    }
    .wrapper4 .carousel4 {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: calc((100% / 3) - 12px);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        border-radius: 8px;
        scroll-behavior: smooth;
        scrollbar-width: none;
    }
    .carousel4::-webkit-scrollbar {
        display: none;
    }
    .carousel4.no-transition {
        scroll-behavior: auto;
    }
    .carousel4.dragging {
        scroll-snap-type: none;
        scroll-behavior: auto;
    }
    .carousel4.dragging .card {
        cursor: grab;
        user-select: none;
    }
    .carousel4 :where(.card4, .img) {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .carousel4 .card4 {
        scroll-snap-align: start;
        height: 430px;
        list-style: none;
        background: #fff;
        cursor: pointer;
        padding-bottom: 15px;
        flex-direction: column;
        border-radius: 8px;
    }
    .carousel4 .card4 .img {
        background: #8b53ff;
        height: 148px;
        width: 148px;
        border-radius: 50%;
    }
    .card4 .img img {
        width: 140px;
        height: 140px;
        border-radius: 50%;
        object-fit: cover;
        border: 4px solid #fff;
    }
    .carousel4 .card4 h2 {
        font-weight: 500;
        font-size: 1.56rem;
        margin: 30px 0 5px;
    }
    .carousel4 .card4 span {
        color: #6a6d78;
        font-size: 14px;
    }

    @media screen and (max-width: 900px) {
        .wrapper4 .carousel4 {
            grid-auto-columns: calc((100% / 2) - 9px);
        }
    }

    @media screen and (max-width: 600px) {
        .wrapper4 .carousel4 {
            grid-auto-columns: 100%;
        }
    }

  	
	
	
	
