body{
    background: linear-gradient(180deg, var(--token-7a5f7b10-cce9-400c-894c-85c04b958619, rgba(255, 255, 255, .5)) 0%, var(--token-c31069f2-ff47-4be6-93e4-40ea33ce23c3, rgb(242, 242, 247)) 100%);
}
.logo{
    text-align: center;
    padding:30px 0px;
    width:100%;
    float:left;
}
.logo a img{
    width:237px;
} 
.register_txt{font-size:14px;font-style:italic;font-weight:600;line-height:17px;color:#464168;margin-top:10px;}

.banner-overlay{
    width:100%;
    background-image: url('images/transparent.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:auto;
    padding:60px 0;
}
.banner-content-col {
    text-align: center;
}
.banner-content-col span{
    color: #191439;
    text-align: center;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 60px; /* 187.5% */
    letter-spacing: -2px;
    margin-bottom: 5px;
    display: block;
}
.banner-content-col button{
    border-radius: 100px;
    background: var(--color-red-45, #CE1815);
    height:58px;
    display:flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    margin:45px auto 0px auto;
    width:180px;
    border:none;
    box-shadow: none;
	text-decoration:underline;
}
.banner-content-col h1{
    color: #191439;
    text-align: center;
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 75px; /* 125% */
    letter-spacing: -2px;
    margin-bottom: 15px;
}
.banner-content-col  p{
    color: #464168;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.8px;
}
.dates{
    width:100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap:10px;
    padding-bottom: 10px;
}
.date-col{
    border-radius: 24px;
    background: #DADADA;
    padding: 8px 14.253px 9.51px 16px;
    display:flex;
    align-items: center;
    justify-content: center;
}
.date-col img{
    margin-right:7px;
}
.date-col span{
    color: var(--color-red-45, #CE1815) ;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.8px;
}
.important-updates .col{
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    padding:32px;
}
.important-updates .col h2{
    color: #464168;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px;
}
.important-updates .col p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin:0px;
}
.important-updates .col ul{
    margin: 26px 0px 0px 0px;
    padding: 0px 0px;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 50px;
}
ul.workshop_sdg {display:flex;list-style:none;padding:0px;}
.workshop_sdg li{margin-right:20px;margin-top:30px;    flex-basis: calc(10% - 25px);}
.important-updates .col ul li{}
.py-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 0.3rem !important;
}
.sn-computer-science{
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    padding:32px;
	min-height: 246px;
}
.sn-computer-science p{
    color: #464168;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
}

.key-highlights{
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    padding:32px;
}
.key-highlights h2{
    color: #191439;
    font-size: 22.313px;
    font-style: normal;
    font-weight: 700;
    line-height: 26.4px;
	margin-bottom:20px;
}
.key-highlights p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin:0px 0px 10px 0px;
}
.key-list{
    width:100%;
    display: flex;
    flex-flow: column;
    gap:10px;
}
.key-list span{
    border-radius: 24px;
    background: #EBEBEB;
    padding:8px 16px;
    color: var(--color-red-45, #CE1815);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
}


.key-notes{
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    padding:32px;
	min-height: 349px;
}
.key-notes h2{
    color: #191439;
    font-size: 22.313px;
    font-style: normal;
    font-weight: 700;
    line-height: 26.4px;
}
.speakers-col h4{
    color: #464168;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}
.speakers-col h5{
    color: #464168;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
	
}
.wrapTxt{white-space: nowrap;}
.key-notes p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin:0px 0px 10px 0px;
}
.speakers-col{
    width:100%;
    display:flex;	
}
.col1{flex-basis:calc(52% - 10px)}
.speakers-col .col1 img{
    margin-bottom: 10px;;
}
.speakers-col .col1 span{
    color: #464168;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height:18px;
    margin-bottom: 10px;
    display: block; 
}
.speakers-col .col1 small{
    color: #464168;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}


.who-attend{
    width:100%;
    float:left;
    padding:0px 0px;
}
.who-attend h2{
    color: #464168;
    font-size: 29.875px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px;
    margin-bottom: 16px;
}

.attend-box{
    padding:32px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
}
.attend-box img{
    margin-bottom: 32px;
}
.attend-box h3{
    color: #464168;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 26.4px;
}
.attend-box p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px; 
}
.about-workshop{
    width:98%;
    padding:32px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    margin:16px auto 0px auto;
}

.about-workshop h2{
    color: #464168;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px; 
    margin-bottom: 11px;
}
.about-workshop p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    
}
.about-workshop p strong{
    color: #CE1815;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
}

.contact-col{
    padding:32px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 0.796px 0.796px -0.625px rgba(0, 0, 0, 0.03), 0px 2.415px 2.415px -1.25px rgba(0, 0, 0, 0.02), 0px 6.383px 6.383px -1.875px rgba(0, 0, 0, 0.02), 0px 20px 20px -2.5px rgba(0, 0, 0, 0.02), 0px -0.602px 0.602px -0.833px rgba(0, 0, 0, 0.02), 0px -2.289px 2.289px -1.667px rgba(0, 0, 0, 0.02), 0px -10px 10px -2.5px rgba(0, 0, 0, 0.02);
    margin:16px 0;
    width:100%;
}
.contact-col h2{
    color: #464168;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px;
    margin-bottom: 13px;
}
.contact-col p{
    color: #464168;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 10px;
}
.contact-col h5{
    color: #464168;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 17px;
    margin-bottom: 10px;
	font-style:italic;
}
.contact-col span{
    color: #464168;
    font-size: 16px;
    font-style: italic;
    font-weight: 700;
    line-height: 16px;
    margin-bottom: 10px;
    display: block;
}
.contact-col small{
    color: #464168;
    font-size: 16px;
    font-style: italic;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 0px;
    display: block;
}
.contact-col strong{
    color: #464168;
    text-align: center;
    font-size: 18px;
    font-style: italic;
    font-weight: 700;
    line-height: 16.8px;
    margin-top:20px;
    display: block;
}
.contact-col button{
    border-radius: 100px;
    background: var(--color-red-45, #CE1815);
    width:100%;
    height:58px;
    display:flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    border:none;
    margin-top:60px;
}

.address{
    display:flex;
    align-items:center;
    padding-bottom: 15px;
}
.address img{
    margin-right:10px;
}

.add-content span{
    color: #464168;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.8px;
}
.add-content small{
    color: #9C9AAC;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.8px;
}

.footer-copyright{
    background: var(--Headline, #111827);
    display: inline-flex;
    height: 40px;
    padding: 7px 0px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width:100%; 
}
.footer-copyright p{
    margin:0px;
    color: var(--color-white-solid, #FFF);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
}

.footer{
    width:100%;
    float:left;
    background-image: url('images/transparent.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:auto;
    padding:60px 0;
}
.foot-content {
    text-align: center;
    padding: 0 50px;
}
.foot-content span{
    color: #464168;
    text-align: center;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px;
}
.foot-content h2{
    color: #464168;
    text-align: center;
    font-size: 22.5px;
    font-style: normal;
    font-weight: 700;
    line-height: 35.2px;
    margin-bottom: 14px ;
}
.foot-content p{
    color: #464168;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin:0px;
}


@media (max-width: 768px) {
    .dates{
        flex-direction: column;
    }
    .important-updates .col ul{
        flex-flow: wrap;
        gap:20px;
    }
    .banner-content-col span{
        font-size: 28px;
    }
    .banner-content-col h1{
        font-size:50px;
        line-height: 65px;
    }
    .banner-content-col p{
        line-height: 26px;
    }
    .key-highlights{
        margin-bottom: 20px;
        padding:20px;
    }
    .important-updates .col{
        margin-bottom: 20px;
        padding: 20px;
    }
    .key-notes{
        padding: 20px;
    }
    .speakers-col{
        
		display:block;
    }
	
    .speakers-col .col1 {        
        width: 100%;
		margin-top:20px;
    }
    .attend-box{
        padding:20px;
        margin-bottom: 16px;
    }
    .about-workshop{
        width:92%;
        padding: 20px;
        margin-bottom: 10px;
    }
    .contact-col{
        padding: 20px;
        margin:16px 0;
    }
    .sn-computer-science{
        padding: 20px;
    }
    .banner-content-col {
    text-align: center;
        padding: 0 14px;
    }
    .important-updates .col ul li{
        width:46%;
    }
    .who-attend .row{
        display: block !important;
    }
    .speakers-col .col1 img {
        margin-bottom: 10px;
        width: 100%;
    }
	.workshop_sdg li{flex-basis: 100%;}
	.register_txt{margin-top:15px;}
}

@media only screen and (min-width: 1200px) and (max-width: 1440px) {
	.key-notes{min-height: 372px;}
}