.countdownBoxWrapper {margin: 40px 0 0 0;display: flex;align-items: center;flex-wrap: wrap;gap: 20px;color: #fff;}
.countdownBoxWrapper .countdown {}
.countdownBoxWrapper .btn {padding: 19px 30px;font-size: 19px;background: var(--c-textcolor);}
.countdownBoxWrapper .btn i:last-child {content:"\f061";margin: -5px 0 -5px 0;font-family: 'Font Awesome 6 Pro';font-weight: 300;font-size: 29px;}
.countdownBoxWrapper .btn i:first-child {content:"\f061";margin: -5px 14px -5px 0;font-family: 'Font Awesome 6 Pro';font-weight: 300;font-size: 29px;}

.countdownBoxWrapper .actions {flex: 0 1 100%;margin: 30px 0 0 0;display: flex;align-items: center;gap: 38px;}
.countdownBoxWrapper .actions > div {position:relative;}
.countdownBoxWrapper .actions .trigger {border: none;background: none;padding: 0;font-size: 12px;margin: 0;display: inline-flex;align-items: center;background: rgb(0 0 0 / 20%);padding: 8px 15px;border-radius: 50px;color: #fff;}
.countdownBoxWrapper .actions .trigger:hover {background:var(--c-textcolor);}
.countdownBoxWrapper .actions .trigger:hover i {opacity:1}
.countdownBoxWrapper .actions div.active .trigger {border-radius: 10px 10px 0 0;background: var(--c-textcolor);}
.countdownBoxWrapper .actions div.active .trigger::after {content:"";background: var(--c-textcolor);position:absolute;height: 3px;width:100%;bottom: -3px;left: 0;}
.countdownBoxWrapper .actions .trigger > i {font-size: 21px;margin: 0 8px 0 0;opacity: 0.3;}
.countdownBoxWrapper .actions div.active .trigger > i {opacity:1}
.countdownBoxWrapper .actions .trigger > span { font-weight: 300; }
.countdownBoxWrapper .actions .dropdown {display:none;}
.countdownBoxWrapper .actions div.active .dropdown {display:block;position: absolute;padding: 40px 15px 15px 15px;background: var(--c-textcolor);border-radius: 10px;min-width: 310px;top: 0;left: 0;z-index: 9;}
.countdownBoxWrapper .actions div.calendar.active .dropdown {min-width: 180px;}
.countdownBoxWrapper .actions div .dropdown ul {list-style: none;padding: 0;margin: 0;font-size: 13px;}
.countdownBoxWrapper .actions div .dropdown ul li {}
.countdownBoxWrapper .actions div .dropdown ul li a {display: flex;align-items: center;padding: 5px 0;cursor:pointer;color: #fff;text-decoration: none;}
.countdownBoxWrapper .actions div .dropdown ul li a:hover {font-weight:600;}
.countdownBoxWrapper .actions div .dropdown ul li a i {font-size: 18px;margin: 0 11px 0 0;width: 15px;}

.countdownBoxWrapper .actions div.active .trigger {z-index: 10;position: relative;}
.countdownBoxWrapper .actions div.timezone .dropdown {top: 0;padding: 40px 15px 15px 15px;z-index: 9;border-radius: 10px;}
.countdownBoxWrapper .actions div.timezone .dropdown ul {}
.countdownBoxWrapper .actions div.timezone .dropdown ul li {display: flex;align-items: center;border-bottom: solid 1px rgb(255 255 255 / 20%);padding: 5px 0;}
.countdownBoxWrapper .actions div.timezone .dropdown ul li:last-child {border:none;}
.countdownBoxWrapper .actions div.timezone .dropdown ul li span {}
.countdownBoxWrapper .actions div.timezone .dropdown ul li span:nth-child(1) {}
.countdownBoxWrapper .actions div.timezone .dropdown ul li span:nth-child(2) {margin: 0 0 0 auto;}

.countdown {margin: 0;display: flex;align-items: flex-start;min-width: 320px;}
.countdown .coll {text-align: center;min-width: 65px;}
.countdown .coll:first-child {min-width:unset;margin: 0 5px 0 0;}
.countdown .dotts {font-size: 28px;margin: 0;margin: 0 4px;text-align: center;}
.countdown .coll .ce-days, .countdown .coll .ce-hours, .countdown .coll .ce-minutes, .countdown .coll .ce-seconds {font-size: 50px;line-height: 0.8;letter-spacing: -1px;font-weight: bold;font-weight: 700;white-space: nowrap;}
.countdown .coll .ce-days span, .countdown .coll .ce-hours span, .countdown .coll .ce-minutes span, .countdown .coll .ce-seconds span {display:inline-block;vertical-align:top;line-height:0.8;}
.countdown .coll .ce-days-label, .countdown .coll .ce-hours-label, .countdown .coll .ce-minutes-label, .countdown .coll .ce-seconds-label {display: block;font-size: 10px;margin: 0;line-height: 1;opacity: 0.6;font-weight: 300;}


@media (max-width: 767px) {
    .countdownBoxWrapper .countdown {flex: 0 1 100%;}
	.countdownBoxWrapper .actions {margin: 0;flex-direction: column;display: flex;align-items: flex-start !important;gap: 10px !important;}
    .countdownBoxWrapper .btn {
    width: 100%;
}
}



.symposium-header > .content .countdownBoxWrapper { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.symposium-header > .content .countdownBoxWrapper .countdown { min-width: auto; }
.symposium-header > .content .countdownBoxWrapper .btn {background: var(--c-textcolor);padding: 20px 40px;font-size: 17px;margin: 0 0 0 40px;}
.symposium-header > .content .countdownBoxWrapper .actions { display: inline-flex; gap: 20px; flex: 0 1 100%; justify-content: center; margin: 30px 0 0 0; }
.symposium-header > .content .countdownBoxWrapper .actions > div { position: relative; }
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger { border: none; background: none; color: #fff; display: inline-flex; align-items: center; font-size: 13px; }
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger i { margin: 0 8px 0 0; font-size: 150%; }
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger span {opacity: 0.8;font-weight: 300;}
.symposium-header > .content .countdownBoxWrapper .actions > div .popup {padding: 15px;background: #0f8172;border-radius: 10px;position: absolute;bottom: 35px;min-width: 320px;left: -40px;display: none;}
.symposium-header > .content .countdownBoxWrapper .actions > div .popup .timezone-item {display: flex;font-size: 13px;border-bottom: solid 1px rgb(255 255 255 / 10%);padding: 6px 0px;}
.symposium-header > .content .countdownBoxWrapper .actions > div .popup .timezone-item:last-child {border:none}
.symposium-header > .content .countdownBoxWrapper .actions > div .popup .timezone-item .location {margin: 0;}
.symposium-header > .content .countdownBoxWrapper .actions > div .popup .timezone-item .time {margin: 0 0 0 auto;}

.symposium-header > .content .countdownBoxWrapper .actions > div .trigger.active {}
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger.active::before {content:"";width: 0;height: 0;border-style: solid;position: absolute;top: -15px;left: 6px;border-right: 10px solid transparent;border-left: 10px solid transparent;border-top: 10px solid #0f8172;border-bottom: 0;}
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger.active span { opacity: 1; }
.symposium-header > .content .countdownBoxWrapper .actions > div .trigger.active + .popup { display: block; }