
PK 
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&display=swap');
html{
scroll-behavior: smooth;
}
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
font-size: 20px;
line-height: 30px;
color: var(--text-color);
font-weight: 300;
font-family: 'Barlow', sans-serif;
}
/****************navbar****************/
/* Add this to your CSS */
.navbar { padding: 10px 70px; }
.navbar-brand img{ width: 190px; }
.nav-fixed-top {
position: fixed;
right: 0;
left: 0;
z-index: 1030;
}
.nav-fixed-top.scrolled {
/*background-color: #e57432;*/
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Optional: adds a shadow when scrolled */
transition: background-color 0.3s ease; /* Smooth transition */
top: 0;
}
.header-con {
position: absolute;
padding-top: 35px;
top: 0;
z-index: 1;
}
.navbar-light .navbar-nav .nav-item .nav-link {
color: var(--secondary-color);
font-size: 18px;
line-height: 18px;
font-weight: 400;
position: relative;
padding: 0 0 5px !important;
display: inline-block;
}
.navbar-light .navbar-nav .nav-item .nav-link::before{
content: "";
background: var(--secondary-color);
width: 0;
height: 2px;
position: absolute;
left: 0;
bottom: 0;
transition: .4s ease-in-out;
}
.navbar-light .navbar-nav .nav-item .nav-link:hover::before{
width: 100%;
}
.navbar-light .navbar-nav .nav-item {
padding-left: 25px;
padding-right: 25px;
}
.navbar-expand-lg .navbar-nav .dropdown-menu {
top: 35px;
left: 25px;
}
.navbar-btn a {
background: rgb(0 0 0 / 59%);
border-radius: 30px;
cursor: pointer;
border: none;
color: var(--primary-color);
font-size: 17px;
line-height: 18px;
font-weight: 600;
padding: 9px 9px 9px 23px;
transition: .4s ease-in-out;
display: inline-block;
text-decoration: none;
}
.navbar-btn a:focus{
outline: none;
}
.navbar-btn a i {
color: var(--button-color);
padding: 9px 23px;
border-radius: 20px;
background: var(--primary-color);
margin-left: 8px;
transition: .4s ease-in-out;
}
.navbar-btn{
margin-left: 70px;
}
a.dropdown-item{
display: inline-block;
}
.navbar-light .dropdown-menu ul li{
margin-bottom: 5px;
width: 100%;
}
.dropdown-item:focus, .dropdown-item:hover {
color: #fff;
background-color: var(--button-color);
}
/****************navbar****************/
/****************banner****************/
.banner-social-icons {
position: absolute;
top: 36%;
left: 47px;
}
.banner-social-icons ul li a{
border: 1px solid var(--primary-color);
border-radius: 50%;
height: 38px;
width: 38px;
margin-bottom: 19px;
color: var(--primary-color);
font-size: 16px;
line-height: 16px;
padding: 10px;
transition: .4s ease-in-out;
}
.banner-social-icons ul li a:hover,
.footer-social-sec ul li a:hover{
color: var(--button-color);
background: var(--primary-color);
transform: translateY(-8px);
}
.banner-main-sec{
background: url(../images/banner-background-img.jpg) no-repeat center bottom;
background-size: cover;
height: 912px;
}
.banner-inner-sec ul li:first-child {
border-right: 1px solid var(--primary-color);
padding-right: 15px;
}
.banner-inner-sec ul li{
font-size: 16px;
line-height: 16px;
}
.banner-inner-sec ul li i {
padding-right: 6px;
font-size: 14px;
}
.banner-inner-sec ul li:last-child{
padding-left: 11px;
}
.banner-inner-sec span {
font-size: 35px;
line-height: 60px;
font-weight: 400;
letter-spacing: 12px;
}
.banner-inner-sec h1{
padding-left: 20px;
margin-bottom: 16px;
}
.banner-inner-sec h1::before {
content: "";
position: absolute;
left: 0;
top: 16px;
height: 160px;
width: 3px;
background: var(--primary-color);
}
.banner-inner-sec p{
line-height: 34px;
font-weight: 400;
margin-bottom: 24px;
}
/****************banner****************/
/****************conference section****************/
.confernce-text-sec h2{
margin-bottom: 24px;
}
.confernce-text-sec p{
margin-bottom: 14px;
}
.confernce-text-sec p:nth-child(3){
margin-bottom: 32px;
}
.confernce-text-sec{
padding-right: 15px;
}
.confernce-static-sec ul li {
width: 50%;
float: left;
padding: 0 15px;
}
.static-con {
background: var(--primary-color);
box-shadow: 6px 0 38px #e0f2fd;
padding: 26px 19px;
margin-bottom: 30px;
position: relative;
}
.static-con figure{
margin-bottom: 25px;
}
.value {
font-size: 32px;
line-height: 34px;
font-weight: 600;
color: var(--secondary-color);
}
.static-con span{
font-size: 19px;
}
.confernce-static-sec ul{
margin: 0 -15px;
}
/****************conference section****************/
/****************speaker section****************/
.speakers-sec{
background: #eef8fe;
}
.speaker-con{
margin-bottom: 30px;
}
.speaker-status h6{
font-size: 25px;
line-height: 28px;
font-weight: 600;
margin-bottom: 2px;
}
.speaker-status span{
font-size: 18px;
}
.speaker-btn i {
color: var(--primary-color);
background: var(--accent);
padding: 8px 22px;
border-radius: 20px;
transition: .4s ease-in-out;
}
.speaker-btn i:hover{
background: var(--button-color);
transform: translateY(-8px);
}
.speaker-con figure{
overflow: hidden;
}
.speaker-con figure img{
transition: .4s ease-in-out;
}
.speaker-con:hover img{
transform: scale(1.1);
}
.speaker-detail {
position: absolute;
bottom: 26px;
padding: 0 29px;
}
.generic-title h2{
margin-bottom: 16px;
}
.generic-title p{
margin-bottom: 36px;
}
.speakers-sec::before,
.blog-main-sec::before,
.members-main-sec::before {
background: url(../images/red-circle.png) no-repeat top left;
top: 140px;
left: 0;
animation: move 1s infinite alternate;
}
.speakers-sec::before,
.speakers-sec::after,
.blog-main-sec::before,
.blog-main-sec::after,
.members-main-sec::before,
.members-main-sec::after{
content: "";
position: absolute;
width: 149px;
height: 383px;
animation: move 1s infinite alternate;
}
.speakers-sec::after,
.blog-main-sec::after,
.members-main-sec::after {
background: url(../images/yellow-circle.png) no-repeat bottom right;
bottom: 120px;
right: 0px;
animation: move 1s infinite alternate;
}
@keyframes move{
0% { transform: translatex(0); }
100% { transform: translatey(-10px); }
}
/****************speaker section****************/
/****************registration section****************/
.registration-sec{
background: url(../images/registration-background-img.jpg) no-repeat center;
background-size: cover;
}
.registration-inner-sec .generic-title h2{
font-size: 60px;
line-height: 54px;
font-weight: 700;
margin-bottom: 26px;
}
.registration-inner-sec .generic-title p{
margin-bottom: 31px;
}
/****************registration section****************/
/****************tabs-section****************/
#tsum-tabs h1 {
padding: 50px 0;
font-weight: 400;
text-align: center;
}
#tsum-tabs p {
margin: 0 0 5px;
padding-right: 58px;
}
.tab-description p:last-child{
padding-right: 75px !important;
border-left: 2px solid var(--accent);
padding-left: 15px;
}
.tab-sec-img{
margin-left: -7px;
}
#tsum-tabs section {
display: none;
padding: 47px 0 0;
text-align: left;
}
#tsum-tabs input {
display: none;
}
#tsum-tabs label {
display: inline-block;
width: 18.5%;
text-align: center;
margin: 0 7px 0 6px;
}
#tsum-tabs label:before {
font-family: fontawesome;
font-weight: normal;
margin-right: 10px;
}
#tsum-tabs label:hover {
color: #888;
cursor: pointer;
}
#tsum-tabs #tab1:checked ~ #content1,
#tsum-tabs #tab2:checked ~ #content2,
#tsum-tabs #tab3:checked ~ #content3,
#tsum-tabs #tab4:checked ~ #content4 {
display: block;
}
#tsum-tabs .Effective-sec-item {
position: relative;
box-shadow: 6px 0 38px #e0f2fd;
padding: 23px 27px 19px;
transition: .6s all ease-in-out;
}
#tsum-tabs .Effective-sec-item:hover{
border-color: transparent;
color: var(--primary-color);
background: var(--button-color);
}
#tsum-tabs [id^="tab"]:checked + label img{
filter: brightness(0) invert(1);
}
#tsum-tabs .Effective-sec-item-title h4,
#tsum-tabs .Effective-sec-item-title span
{
padding: 0 39px;
}
#tsum-tabs [id^="tab"]:checked + label{
background: var(--accent);
color: var(--primary-color);
}
#tsum-tabs [id^="tab"]:checked + label:after {
content: "";
display: inline-block;
width: 0;
height: 0;
position: absolute;
border-style: solid;
border-width: 12px 10px 0 10px;
border-color: var(--accent) transparent transparent transparent;
left: 50%;
transform: translate(-10px, 97px);
top: 0px;
}
#tsum-tabs .Effective-sec-item-title span{
font-size: 24px;
line-height: 26px;
font-weight: 600;
}
#tsum-tabs .Effective-sec-item-title small{
font-size: 18px;
line-height: 20px;
}
.admin-con span{
font-size: 16px;
font-weight: 400;
}
.admin-con h5 {
font-size: 24px;
line-height: 28px;
font-weight: 600;
color: var(--secondary-color);
margin-bottom: 6px;
}
.admin-con {
margin-right: 34px;
}
.admin-con ul li i {
font-size: 14px;
color: var(--button-color);
margin-right: 5px;
}
.admin-con ul li {
margin-right: 20px;
}
.detail-sec .generic-button i {
padding: 8px 22px;
margin-left: 6px;
}
.detail-sec .generic-button a {
padding: 8px 9px 9px 26px;
font-size: 17px;
}
.value-sec{
margin-right: 60px;
}
.value-sec .count{
font-size: 70px;
line-height: 54px;
font-weight: 700;
color: var(--secondary-color);
margin-right: 23px;
transition: .4s ease-in-out;
}
.value-sec .date-con span{
font-weight: 600;
font-size: 26px;
line-height: 28px;
color: var(--secondary-color);
}
.value-sec .date-con small{
font-size: 18px;
}
.tabs-content {
padding: 27px 34px;
background: var(--primary-color);
box-shadow: 6px 0 38px #e0f2fd;
border-left: 3px solid var(--button-color);
margin-bottom: 35px;
transition: .4s ease-in-out;
position: relative;
}
.tabs-content::before {
content: "";
background: var(--accent);
width: 0;
height: 0;
position: absolute;
left: -3px;
bottom: 0;
transition: .4s ease-in-out;
}
.tabs-content:hover::before{
width: 3px;
height: 100%;
}
.tabs-content:hover .count{
color: var(--accent);
}
.tabs-content:hover ul li i{
color: var(--accent);
}
.tabs-content:hover {
transform: scale(1.04);
}
.detail-sec figure {
margin-right: 25px;
}
/****************tabs-section****************/
/****************price-section****************/
.price-plan-sec{
background: url(../images/price-background-img.jpg) no-repeat center;
background-size: cover;
overflow: hidden;
}
.price-con {
background: var(--primary-color);
padding: 20px 0 53px 0;
transition: .4s ease-in-out;
}
.price-con:hover{
transform: translateY(-8px);
}
.price-con h5 {
font-size: 23px;
line-height: 25px;
font-weight: 600;
padding: 0 0 18px 0;
border-bottom: 1px solid #e2e2e2;
margin-bottom: 25px;
position: relative;
}
.price-con:hover h5::after{
width: 100%;
height: 1px;
}
.price-con h5::after{
content: "";
background: var(--button-color);
width: 0;
height: 0;
position: absolute;
left: 0;
bottom: 0;
transition: .4s ease-in-out;
}
.price-con .price {
font-size: 76px;
line-height: 54px;
color: var(--button-color);
font-weight: 500;
margin-bottom: 35px;
}
.price-con .price-label {
color: var(--button-color);
font-weight: 500;
padding: 6px 24px 5px;
background: #fef2f6;
margin-bottom: 20px;
font-size: 22px;
}
.price-con ul li {
margin-bottom: 8px;
}
.price-con ul{
margin-bottom: 31px;
}
.price-con .generic-button a {
font-size: 17px;
line-height: 17px;
padding: 9px 9px 9px 28px;
}
.price-con .generic-button i {
padding: 9px 22px 8px;
margin-left: 11px;
font-size: 18px;
}
.price-special-con{
margin-top: 40px;
min-height: 450px;
}
.bronze-price-con .price{
font-weight: 700;
}
.bronze-price-con h5{
margin-bottom: 36px;
}
.bronze-price-con ul{
margin-bottom: 27px
}
.bronze-price-con {
padding: 20px 0 45px 0;
}
.price-plan-sec::before{
background: url(../images/white-left-circle.png) no-repeat left bottom;
left: -244px;
bottom: 50px;
}
.price-plan-sec::after {
background: url(../images/white-right-cirecle.png) no-repeat top right;
right: -240px;
top: 106px;
}
.price-plan-sec::before,
.price-plan-sec::after{
content: "";
width: 387px;
height: 383px;
position: absolute;
animation: move 1s infinite alternate;
}
/****************price-section****************/
/****************service-section****************/
.service-box {
margin-bottom: 50px;
}
.service-box figure img{
transition: .4s ease-in-out;
}
.service-box:hover img{
transform: translateY(8px);
}
.service-box:hover h4{
color: var(--button-color);
}
.service-box h4{
font-size: 28px;
line-height: 30px;
font-weight: 600;
color: var(--secondary-color);
}
/****************service-section****************/
/****************blog-section****************/
.blog-main-sec{
background: #ebf8ff;
padding-bottom: 212px;
}
.blog-inner-con .admin-con ul li {
margin-right: 7px;
}
.blog-inner-con .admin-con ul{
margin-bottom: 11px;
}
.blog-inner-con .admin-con span{
font-size: 15px;
line-height: 16px;
}
.blog-inner-con .admin-con{
margin-right: 0;
}
.blog-inner-con {
padding: 20px 29px 30px;
background: var(--primary-color);
border-bottom: 3px solid var(--button-color);
min-height: 120px;
}
.blog-inner-con h5{
font-size: 22px;
line-height: 30px;
font-weight: 500;
margin-bottom: 5px;
}
.blog-inner-con p{
font-size: 18px;
line-height: 28px;
margin-bottom: 20px;
}
.blog-arrow a{
color: var(--primary-color);
background: var(--button-color);
padding: 3px 22px 2px;
border-radius: 20px;
transition: .4s ease-in-out;
}
.blog-arrow a:hover{
background: var(--accent);
transform: translateY(-8px);
}
.blog-inner-con > a:hover{
color: var(--button-color);
}
.blog-inner-con > a {
text-decoration: none;
color: var(--secondary-color);
}
.blog-img .date span{
font-size: 30px;
line-height: 30px;
font-weight: 600;
}
.blog-img .date small{
font-weight: 500;
font-size: 16px;
line-height: 16px;
}
.blog-img .date {
height: 77px;
width: 77px;
position: absolute;
top: 16px;
left: 15px;
background: var(--accent);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.blog-con::after{
content: "";
background: var(--accent);
width: 0;
height: 3px;
position: absolute;
left: 0;
bottom: 0;
transition: .4s ease-in-out;
}
.blog-con:hover::after{
width: 100%;
}
.blog-con{
position: relative;
}
.blog-con:hover .blog-img img{
transform: scale(1.1);
}
.blog-img figure{
overflow: hidden;
}
.blog-img figure img{
transition: .4s ease-in-out;
width: 100%;
}
.blog-con:hover .admin-con i{
color: var(--accent);
}
/****************blog-section****************/
/****************form-section****************/
.form-sec {
background: var(--primary-color);
padding: 42px 56px 42px 54px;
position: absolute;
top: -85px;
}
.form-sec h3 {
font-size: 40px;
line-height: 45px;
font-weight: 700;
color: var(--secondary-color);
margin-right: 38px;
font-family: 'Barlow', sans-serif;
}
.form-btn button{
border: none;
cursor: pointer;
padding: 10px 14px 9px 32px;
}
.form-btn button i {
margin-left: 20px;
}
.form-btn button:focus{
outline: none;
}
.form-sec input {
font-size: 18px;
background: #ebf8ff;
padding: 17px 32px 16px 32px;
border: none;
border-radius: 30px;
margin-right: 24px;
width: 449px;
color: #696767;
}
.form-sec input::placeholder{
font-size: 18px;
color: #696767;
}
.form-sec input:focus{
outline: none;
}
/****************form-section****************/
/****************footer-section****************/
.footer-main-sec {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1189e3+0,3ee5d3+100 */
background: #1189e3; /* Old browsers */
background: -moz-linear-gradient(left, #1189e3 0%, #3ee5d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #1189e3 0%,#3ee5d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #1189e3 0%,#3ee5d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1189e3', endColorstr='#3ee5d3',GradientType=1 ); /* IE6-9 */
padding-top: 151px;
padding-bottom: 35px;
}
.footer-inner-sec ul li a {
text-decoration: none;
font-weight: 400;
position: relative;
padding: 0 0 5px;
}
.footer-social-sec ul li a::after{
display: none;
}
.footer-inner-sec ul li a:hover::after{
width: 100%;
}
.footer-inner-sec ul li a::after{
content: "";
background: var(--primary-color);
width: 0;
height: 2px;
position: absolute;
left: 0;
bottom: 0;
transition: .4s ease-in-out;
}
.footer-inner-sec ul li {
padding: 0 21px;
font-size: 18px;
line-height: 20px;
}
.footer-inner-sec ul {
padding-bottom: 53px;
margin-bottom: 40px;
border-bottom: 1px solid var(--primary-color);
}
.footer-social-sec ul {
border: none;
margin-bottom: 25px;
}
.footer-social-sec ul li a {
padding: 15px 15px;
border: 1px solid var(--primary-color);
width: 52px;
height: 52px;
color: var(--primary-color);
transition: .4s ease-in-out;
}
.footer-social-sec ul li{
padding: 0;
margin: 0 7px;
}
.footer-social-sec figure{
margin-bottom: 0;
}
.footer-social-sec > a{
margin-bottom: 30px;
/*display: inline-block;*/
}
.footer-social-sec span{
font-size: 16px;
line-height: 18px;
}
/****************footer-section****************/
/***********************speaker page***********************/
/****************sub-banner-section****************/
.sub-banner-sec {
background: url(../images/sub-banner-img.png) no-repeat center;
background-size: cover;
height: 400px;
}
.sub-banner-sec h1 {
font-size: 75px;
line-height: 95px;
font-weight: 700;
margin-bottom: 25px;
}
.banner-inner-con .breadcrumb {
background: rgb(255 255 255 / 15%);
margin: 0 auto;
border-radius: 30px;
padding: 10px 26px 13px;
}
.breadcrumb-item+.breadcrumb-item::before {
color: var(--primary-color);
padding: 0 12px;
}
/****************sub-banner-section****************/
/****************speaker-section****************/
.speakers-main-sec{
background: transparent;
}
.speakers-main-sec::before,
.speakers-main-sec::after{
display: none;
}
/****************speaker-section****************/
/****************members-section****************/
.members-main-sec {
background: #ebf8ff;
padding-bottom: 217px;
overflow: hidden;
}
.member-detail{
margin-bottom: 60px;
}
.member-detail ul li a {
color: var(--primary-color);
background: var(--button-color);
font-size: 15px;
border-radius: 100%;
height: 34px;
width: 34px;
line-height: 34px;
transition: .4s ease-in-out;
}
.member-detail ul li a:hover{
transform: translateY(-8px);
background: var(--accent);
}
.member-detail ul li:nth-child(2){
margin: 0 8px;
}
.member-detail h6{
color: var(--secondary-color);
}
.member-detail span{
margin-bottom: 13px;
}
.member-detail figure{
margin-bottom: 24px;
}
.member-detail figure img{
transition: .4s ease-in-out;
}
.member-detail:hover figure img{
transform: translateY(8px);
}
.member-detail:hover h6{
color: var(--button-color);
}
/****************members-section****************/
/***********************speaker page***********************/
/***********************event detail page***********************/
/***********************sub banner page***********************/
.breadcrumb-item.active{
color: var(--primary-color);
}
.breadcrumb-item a{
text-decoration: none;
}
/***********************sub banner page***********************/
/***********************event detail sec***********************/
.event-details {
background: var(--primary-color);
padding: 49px 45px 50px 40px;
border-right: 3px solid var(--button-color);
}
.event-details-main-con{
margin-bottom: 55px;
}
.event-details h2{
font-size: 34px;
line-height: 42px;
margin-bottom: 10px;
}
.event-details .admin-con ul li i{
font-size: 18px;
}
.event-details .admin-con ul li {
margin-right: 13px;
}
.event-details .admin-con ul{
margin-bottom: 14px;
}
.event-details .admin-con span {
font-size: 18px;
}
.event-detail-sec{
background: #ebf8ff;
}
.event-details :nth-child(3){
margin-bottom: 10px;
}
.event-details p{
margin-bottom: 25px;
}
.event-detail-sec .blog-img .date{
height: 105px;
width: 105px;
top: 28px;
left: 29px;
}
.event-detail-sec .event-image-con {
width: 48.7%;
float: left;
}
.event-detail-sec .event-details {
width: 51.3%;
float: right;
}
.event-detail-sec .blog-img .date span{
font-size: 50px;
line-height: 45px;
}
.event-detail-sec .blog-img .date small{
font-size: 22px;
line-height: 25px;
}
.sponsers-images ul li figure img{
transition: .4s ease-in-out;
}
.sponsers-images ul li figure img:hover{
transform: translateY(-8px);
filter: brightness(0) saturate(100%) invert(10%) sepia(0%) saturate(1%) hue-rotate(33deg) brightness(101%) contrast(91%);
}
/***********************event detail sec***********************/
/******************event speaker sec*****************/
.generic-banner{
background: url(../images/sub-banner-img.png) #ebf8ff no-repeat center;
background-size: cover;
}
.event-speakers .member-detail{
margin-bottom: 0;
}
.event-text-con ul li {
color: #696767;
font-weight: 500;
margin-bottom: 15px;
padding-left: 26px;
}
.event-text-con ul {
width: 32%;
margin-right: 22px;
}
.event-text-con ul:last-child{
margin-right: 0;
padding-left: 3px;
}
.event-text-con ul li i {
color: var(--button-color);
font-size: 18px;
position: absolute;
left: 0;
top: 6px;
}
.event-text-con ul li:last-child{
margin-bottom: 0;
}
.event-speakers .generic-title p {
margin-bottom: 41px;
}
/*****************event speaker sec******************/
/***********************event detail page***********************/
.info-text-con {
padding: 0px 360px 24px 66px;
}
.about-text-con {
padding: 0 58px 11px 390px;
}
.sponsers-images ul li {
padding: 0 56px;
}
.sponsers-sec .generic-title p{
margin-bottom: 32px;
}
.info-text-con p:nth-child(3),
.about-text-con p:nth-child(3){
margin-bottom: 32px;
}
.info-main-sec,
.about-us-main-sec{
background: #eef8fe;
}
.info-text-con h2,
.about-text-con h2{
margin-bottom: 18px;
}
.info-img-sec {
background: url(../images/info-img.png) no-repeat center;
background-size: cover;
width: 50%;
height: 699px;
float: left;
}
.about-us-image-sec{
background: url(../images/conference-img.png) no-repeat center;
background-size: cover;
width: 50%;
height: 699px;
float: right;
}
.about-text-con,
.info-text-con{
width: 50%;
float: left;
}
.video-play-icon{
position: absolute;
top: 43%;
left: 42%;
}
#fade {
display: none;
position: fixed;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
#light {
display: none;
position: absolute;
top: 54%;
left: 50%;
max-width: 600px;
max-height: 360px;
margin-left: -300px;
margin-top: -180px;
z-index: 1002;
overflow: visible;
}
#boxclose {
float: right;
cursor: pointer;
border-radius: 100%;
color: var(--button-color);
background: var(--primary-color);
font-size: 31px;
font-weight: bold;
display: inline-block;
line-height: 0px;
padding: 13px 8px 16px;
position: absolute;
right: -7px;
top: -10px;
z-index: 1002;
}
.boxclose:before {
content: "×";
}
#fade:hover ~ #boxclose {
display:none;
}
.test:hover ~ .test2 {
display: none;
}
/************************************************************************/
.countdown-sec{
background: url(../images/countdown-background-img.jpg) no-repeat center;
background-size: cover;
}
.countdown-sec h2{
font-size: 45px;
line-height: 52px;
font-weight: 600;
margin-bottom: 34px;
}
#countdown ul li {
display: inline-block;
font-size: 23px;
line-height: 34px;
list-style-type: none;
padding: 45px 40px;
height: 169px;
width: 169px;
color: var(--secondary-color);
background: var(--primary-color);
border-radius: 50%;
margin-right: 35px;
}
#countdown ul li::after {
content: "";
background: url(../images/countdown-circles.png) no-repeat center;
height: 20px;
width: 6px;
position: absolute;
top: 43%;
right: -22px;
}
#countdown ul li:last-child{
margin-right: 0;
}
#countdown ul li:last-child::after{
display: none;
}
#countdown ul li span {
display: block;
font-size: 55px;
line-height: 34px;
color: var(--button-color);
font-weight: 600;
margin-bottom: 14px;
}
#countdown .emoji {
display: none;
padding: 1rem;
}
#countdown .emoji span {
font-size: 4rem;
padding: 0 .5rem;
}
@media all and (max-width: 768px) {
h1 {
font-size: calc(1.5rem * var(--smaller));
}
li {
font-size: calc(1.125rem * var(--smaller));
}
li span {
font-size: calc(3.375rem * var(--smaller));
}
}
/************************************************************************/
/************************************************************************/
/************************************************************************/
.contact-main-sec{
background: #ebf8ff;
}
.contact-details {
margin-left: 24px;
margin-top: -8px;
}
.contact-main-sec .row .col-lg-4 ul {
background: #fff;
padding: 40px 29px 22px;
}
.contact-main-sec ul li{
margin-bottom: 30px;
}
.contact-details h5{
font-size: 22px;
line-height: 38px;
font-weight: 600;
}
.contact-details span{
font-size: 18px;
line-height: 27px;
display: inline-block;
}
.contact-details span a{
text-decoration: none;
color: var(--text-color);
}
.contact-btn a {
background: rgb(255 255 255 / 15%);
border-radius: 30px;
padding: 9px 9px 9px 24px;
font-size: 17px;
}
.contact-btn a i{
padding: 8px 22px 7px;
margin-left: 10px;
}
/*.contact-main-sec ul li:last-child {
background: linear-gradient(to right, #1189e3 0%,#3ee5d3 100%);
padding: 10px 16px 30px;
}*/
.contact-main-sec ul li h4{
font-size: 27px;
line-height: 54px;
font-weight: 700;
}
.contact-form {
background: var(--primary-color);
padding: 37px 30px 42px;
}
.contact-form form ul li {
width: 49.2%;
margin-right: 10px;
margin-bottom: 18px;
}
.contact-form form ul li:nth-child(2),
.contact-form form ul li:nth-child(4){
margin-right: 0;
}
.contact-form form ul li:nth-child(5){
margin-bottom: 25px;
}
.contact-form form ul li:last-child{
background: none;
margin: 0;
padding: 0;
}
.contact-form form ul li::placeholder, .contact-form form ul li input, .contact-form form ul li textarea {
font-size: 18px;
line-height: 30px;
border: none;
background: #ebf8ff;
padding: 16px 27px 17px;
}
.contact-form form ul li input{
border-radius: 50px;
}
.contact-form form ul li input:focus,
.contact-form form ul li textarea:focus{
outline: none;
}
.contact-form form ul li textarea{
height: 229px;
border-radius: 25px;
}
.contact-form form ul li textarea{
resize: none;
}
.contact-form form .form-btn button{
padding: 10px 10px 9px 32px;
}
.contact-form form .form-btn button i {
margin-left: 15px;
}
/****************************************************************************/
.confernce-static-sec .static-con::before,
.confernce-static-sec .static-con::after,
.static-con span::before,
.static-con span::after {
content: '';
position: absolute;
width: 0px;
height: 0px;
background: transparent;
transition: .7s ease-in-out;
opacity: 0;
}
.confernce-static-sec .static-con::before {
top: 0;
left: 0;
border-top: solid var(--button-color);
border-left: solid var(--button-color);
}
.confernce-static-sec .static-con::after {
top: 0;
right: 0;
border-top: solid var(--button-color);
border-right: solid var(--button-color);
}
.static-con span::before {
bottom: 0;
left: 0;
border-bottom: solid var(--button-color);
border-left: solid var(--button-color);
}
.static-con span::after {
bottom: 0;
right: 0;
border-bottom: solid var(--button-color);
border-right: solid var(--button-color);
}
.static-con:hover::before,
.static-con:hover::after,
.static-con:hover span::before,
.static-con:hover span::after{
width: 100%;
height: 100%;
opacity: 1;
}
.static-con:hover .value{
color: var(--button-color);
}
.static-con figure{
transition: .4s ease-in-out;
}
.static-con:hover figure{
transform: translateY(10px);
}
.navbar-btn a:hover{
background: var(--primary-color);
color: var(--button-color);
transform: translateY(-8px);
}
.navbar-btn a:hover i{
color: var(--primary-color);
background: var(--button-color);
}
.white-btn a:hover{
background: var(--button-color);
color: var(--primary-color);
transform: translateY(-8px);
}
.white-btn a:hover i{
background: var(--primary-color);
color: var(--button-color);
}
.red-btn a:hover, .red-btn button:hover{
color: var(--primary-color);
background: var(--accent);
transform: translateY(-8px);
}
.red-btn a:hover i, .red-btn button:hover i{
color: var(--button-color);
}
.facility-con figure img{
transition: .6s ease-in-out;
}
.facility-con:hover img{
transform: translateY(8px);
}
.facility-con:hover h3{
color: var(--button-color);
}
/********************************************************************/
.masonry-item img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 5px;
pointer-events: none;
}
.masonry {
width: 100%;
height: 100vh;
display: grid;
grid-template-columns: repeat(14, 1fr);
grid-template-rows: repeat(14, 1fr);
column-gap: 20px;
margin-bottom: 50px;
}
.cell-1 {
grid-column: 1 / 6;
grid-row: 1 / 8;
margin-bottom: 20px;
}
.cell-2 {
grid-column: 6 /10;
grid-row: 1 / 15;
position: relative;
}
/* .cell-2::before {
content: "";
background: url(../images/Plus-icon.png) no-repeat;
width: 70px;
height: 70px;
position: absolute;
top: 43%;
left: 40%;
} */
.cell-3 {
grid-column: 10 / 15;
grid-row: 1 / 8;
margin-bottom: 20px;
}
.cell-4 {
grid-column: 10 / 15;
grid-row: 15 / 8;
}
.cell-5 {
grid-column: 1 / 6;
grid-row: 15 / 8;
}
.masonry-item{
overflow: hidden;
position: relative;
}
.masonry-item img{
transition: .4s ease-in-out;
}
.masonry-item:hover img{
transform: scale(1.1);
}
.gallery-sec .masonry-item a::before {
content: "";
background: url(../images/Plus-icon.png) no-repeat center;
width: 50px;
height: 50px;
position: absolute;
left: 44%;
top: 41%;
z-index: 2;
display: none;
}
.gallery-sec .masonry-item:hover a::before{
display: block;
}
.gallery-sec .gallery_title{
font-size: 22px;
background-color: #0058e1;
padding: 15px 10px;
margin-bottom: 40px;
min-height: 100px;
}
/*****************************************************************/
/*Body of the Panel when it expands*/
.panel .panel-body {
position: relative;
padding: 0 !important;
overflow: hidden;
height: auto;
}
/*Image size and transition*/
.panel .panel-body a img {
display: block;
margin: 0;
width: 100%;
height: 150px;
transition: all 0.5s;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
}
/*Transform scale effect when you hover over*/
.panel .panel-body a.zoom:hover img {
transform: scale(1.3);
-ms-transform: scale(1.3);
-webkit-transform: scale(1.3);
-o-transform: scale(1.3);
-moz-transform: scale(1.3);
}
/*Zoom Button*/
.panel .panel-body a.zoom span.overlay {
position: absolute;
top: 0;
left: 0;
visibility: hidden;
height: 100%;
width: 100%;
background-color: #000;
opacity: 0;
transition: opacity .25s ease-out;
-moz-transition: opacity .25s ease-out;
-webkit-transition: opacity .25s ease-out;
-o-transition: opacity .25s ease-out;
}
/*Zoom Button and Tint Overlay*/
.panel .panel-body a.zoom:hover span.overlay {
display: block;
visibility: visible;
opacity: 0.55;
-moz-opacity: 0.55;
-webkit-opacity: 0.55;
filter: alpha(opacity=65);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
}
/*Zoom Button*/
.panel .panel-body a.zoom:hover span.overlay i {
position: absolute;
top: 45%;
left: 0%;
width: 100%;
font-size: 2.25em;
color: #fff !important;
text-align: center;
opacity: 1;
-moz-opacity: 1;
-webkit-opacity: 1;
filter: alpha(opacity=1);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
}
#lightbox .modal-content {
display: inline-block;
text-align: center;
background: none;
border: none;
}
.modal-header{
border: none;
}
button.close:focus{
outline: none;
border: none;
}
button.close {
border: 0;
position: fixed;
right: -5px;
top: -14px;
color: #fff;
background: var(--button-color);
opacity: 1;
padding: 11px 16px 14px !important;
border-radius: 50%;
height: 50px;
width: 50px;
z-index: 2;
}
button.close span i{
font-size: 20px;
}
button.close:hover{
background: var(--accent);
color: var(--primary-color);
opacity: 1;
}
.modal-dialog {
max-width: fit-content;
top: 10%;
width: 55%;
}
.modal-content{
height: 100vh;
overflow: inherit;
}
.map-sec iframe{
width: 100%;
}
.model-list li i {
color: var(--button-color);
margin-right: 10px;
}
.modal-body {
padding: 0;
}
.modal-body .admin-con{
margin: 0;
}
.modal-open .modal{
padding: 0;
}
.modal-body .contact-form {
padding: 20px 30px 30px 37px;
}
.modal-body > ul li {
margin-bottom: 5px;
}
.team-text-con span{
color: var(--button-color);
font-weight: 500;
}
.team-dteails{
background: #ebf8ff;
}
.team-image-con figure img{
width: 100%;
}
#blog1 .modal-content, #blog2 .modal-content, #blog3 .modal-content{
height: 100vh;
overflow: auto;
padding: 0 15px;
}
/*****skills section*****/
.left-sec h5 {
margin-bottom: 15px;
}
.left-sec h2{
margin-bottom: 12px;
}
.left-sec :last-child{
margin-bottom: 0;
line-height: 33px;
}
.skills span {
float: right;
margin-top: -41px;
border-radius: 6px;
color: var(--secondary-color);
font-weight: 600;
font-size: 20px;
margin-bottom: 22px;
}
.skillbar{
background-color:var(--button-color);
width:0px;
height:11px;
border-radius: 8px;
}
.title-bar h5 {
position: relative;
top: -36px;
color: var(--primary--color);
line-height: 20px;
font-size: 20px;
color: var(--secondary-color);
}
.skills {
background-color: #f7f7f7;
width: 100%;
height: 11px;
position: relative;
margin: 63px 0;
border-radius: 8px;
}
.title-bar{
position:absolute;
top: 0;
}
.percentage{
position: absolute;
top: -41px;
right: -16px;
font-size: 20px;
}
.left-sec{
padding: 0 50px;
}
.left-sec ul li i{
font-size: 18px;
color: var(--button-color);
margin-right: 8px;
}
.team-professional-lft h3,
.left-sec h5{
color: var(--secondary-color);
}
/*****skills section*****/


PK 99