@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css");

:root{
	--red:rgba(192, 57, 43,1.0);
	--primary-color:#f5821e;
	--secondary-color:#00467d;
	--default-font-size:1.1rem;
	--header-icon-color:rgba(52, 73, 94,1.0);
	--form-h2-weight:600;
	--form-h2-size:1.2rem;
	--info-icon-color:rgba(52, 152, 219,1.0);
}
div[data-group="control-field"]{
	display:none;	
}
.navbar-nav>li>a{
	color:#ffffff !important;
}
html{
	min-height: 100%;
	background: url('https://mycs-cdn.myconferencesuite.com/other/Project/3850/a6/24/a624127f3767e4f7437ace017987ec8de4725a957635e37e7f73f09856d115f0.jpg') no-repeat center center fixed;
	background-size: cover;
	background-attachment: fixed !important;
	font-size:var(--default-font-size);
}
body{
	background:transparent;
	font-size:var(--default-font-size);
}
span.btn-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px;
}
#fieldContainer{
	display: grid;
	gap: 1.2rem;
}
#header .innheader{
	display:flex;
	align-items: center;

}
#header .innheader div img{
	width: 100%;
}
#header .innheader .event-information{
	display: grid;
	gap: 0.5rem;
	padding: 0 30px 0 0;
	align-items: center;
	width: 100%;
}

#header .innheader .event-information h1,
#header .innheader .event-information h2,
#header .innheader .event-information h3{
	font-weight: bold;
	color: #00447c;
	text-align:right;
	margin: 0;
	padding: 0;
	line-height: unset;
	position:relative;
}
#header .innheader .event-information h2,
#header .innheader .event-information h3{
	display:flex;
	align-items: center;
	gap:0.5rem;
	justify-content: flex-end;
	color:var(--header-icon-color);
}
#header .innheader .event-information h2:before,
#header .innheader .event-information h3:before{
	font-family: "Font Awesome 7 Free";
	display:inline-block;
	font-weight: 900;
	content:"";
	color:var(--header-icon-color);
}
#header .innheader .event-information h2:before{
	content:"\f7a2";
}
#header .innheader .event-information h3:before{
	content:"\f073";
}

#header .innheader .event-information h1{
	font-size: 1.7rem;
}
#header .innheader .event-information h2{
	font-size: 1.5rem;
}
#header .innheader .event-information h3{
	font-size: 1.3rem;
}
.dropdown-menu{
	font-size:var(--default-font-size);
}
.dropdown-menu>li>a{
	padding: 12px 48px 12px 15px;
}

.navbar{
	border-radius:0px;	
}
.custom-footer{
	border-radius:0px 0px 25px 25px;	
}
#iaa-2022-closed {
	border-radius: 25px;
	width: auto !important;
	box-shadow: 0px 0px 20px rgba(192, 57, 43, 0.4);
	padding: 25px;
	margin: 30px;
}
#iaa-2022-closed p{
	font-size: 24px;
	text-align: center;
	width: 80%;
	margin: 15px auto;	
}
.h2, h2 {
	color: var(--primary-color); 
	font-family: inherit;
	font-weight: 700;
	line-height: 1.1;
}
.valueSpan.highlighted{
	display:none !important;	
}
.ticket-alert{
	width: 100%;
	text-align: center;
	font-weight: bold;	
}
.nullified{
	opacity:0.5 !important;	
}
.fancybox-bg{
	opacity:1 !important;
	background:rgba(255, 255, 255, 0.1) !important;
	backdrop-filter: blur(20px);
}

.pageinfo {

	display: none;
}


.row {
	width: auto !important;
}

.de_required{
	color:var(--red);
}

#room-booking-btn {

	background-color:var(--primary-color);
	color: #fff;
	padding: 12px 28px;
	font-size: 18px;
	font-weight: 600;
	border-radius: 5px;
	text-decoration: none;
	display: inline-block;
	transition: background 0.3s ease;
	white-space: normal; 
	margin-bottom: 20px;
}
#room-booking-btn {
	color: #fff !important;
}
/*
.button, html input[type=button], input[type=reset], input[type=submit] {
	-webkit-appearance: button;
	cursor: pointer;
	background-color: #28455e;
	COLOR: WHITE;
}
*/
.m-seminar-list__list__items {
	align-items: stretch !important;  
	width: 100% !important;      
}

.m-seminar-list__list__items .m-seminar-list__list__items__item {
	width: 100% !important;          
	max-width: 100%;
}


hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0 !important;
	border-top: 1px solid #999 !important;
}

div[data-group="fieldwnote"] p{
	display:none;
}
div[data-group="fieldwnote"] p.footNote{
	flex: 1 1 100% !important;
	margin: 5px 0;
	display: inline-flex !important
		;
	justify-content: end;
}

div[data-group="fieldwnote"] .form-group{
	flex-wrap: wrap !important;
}

div[data-group="fieldwnote"] .form-group .label,
div[data-group="fieldwnote"] .form-group div {
	flex: 1 1 calc(50% - 0.5rem) !important; /* adjust for gap */
}


.nav .open>a,
.nav .open>a:focus,
.nav .open>a:hover,
.navbar-nav>li>a:hover,
.navbar-nav>li>a:focus{
	background-color:  #00447c;
	border-color: #337ab7;
}

.links-wrapper .nav > li > a{
	color:#ffffff;
}
.links-wrapper .nav > li > a:hover {
	text-decoration: none;
	background-color: #00447c;
	color: #fff;
}

#register {
	display:none;
}

/*
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
	cursor: default;
	background-color: #00447c;
	border: 1px solid #ddd;
	color: white;
}
.nav>li>a:focus, .nav>li>a:hover {
	text-decoration: none;
	background-color: white;
}
	*/

.dropdown-menu{
	background:var(--primary-color);
}
.dropdown-menu li a{
	color:#ffffff;
}
.dropdown-menu li a:hover,
.dropdown-menu li a:focus{
	color:#ffffff;
	background:var(--secondary-color);
}




.de_field_small {
	display: block;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	padding: 0.375rem 0.75rem;
	line-height: 1.5rem;
	border-radius: 0.5rem;
	border: 1px solid #D1D5DB;
	background-clip: padding-box;
	transition: box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px !important;

}

span.valueSpan.de_cols_1 input[type=radio]
{
	width: 10px;
	margin: 0px;
}

span.valueSpan.de_cols_1 {
	display: grid;
	/*grid-template-columns: 0.5fr 9fr; */
	align-items: start;
	gap:7px;
	grid-template-columns: auto 1fr;
}

/*.btn {
display:none;
}*/


#finalProcessButton {
	margin-left: 41%;
	padding: 14px 40px;
	font-size: 20px;
	background-color: #4fa263;
	border-color: #3a5633;
	color: #fff;
	border-radius: 6px;
	text-transform: uppercase;
}


#finalProcessButton:hover {
	color: #fff;
	background-color: #50a670 ;
	border-color: #204d74;
}
.container{
	padding: 0px 
}

.panel{
	border: none;
}
.col-sm-9 {
	width:100%;
}
.modalPopUp {
	width: 100% !important;
	max-width: 75%;
	font-size: 1.1rem;
	display: flex;
	flex-wrap: wrap;
	padding: 40px;
	font-family: Arial, sans-serif;
	background-color: #FAFAFA;
	border: none;
	position: relative;
	font-size:var(--default-font-size);
	border-radius: 25px !important;
	box-shadow: 0px 7px 20px rgba(00, 00, 00, 0.3) !important;
}

.modalPopUp h4 {
	margin: 0 0 10px 0;
	font-size: 35px;
	color: var(--red);
	flex: 1 1 100%;
	display: inline-block;
	margin-top: 30px;
	width: 44%;
}
.navbar { 
	background: var(--primary-color);
	margin: 0px auto;
	width: 100%;
	top: 0px;
	left: 0px;
}
#button{
	display:flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.fa-exclamation-circle {
    color: rgba(52, 152, 219, 1.0);
    font-size: 1.3rem;
    margin: 0 0.5rem 0 0;
}
#button .navButton,
#rhome{
	padding: 15px 30px;
	border-radius: 1rem;
	transition: all 0.3s ease;
	transform: scale(1);
	box-shadow:0px 0px 0px rgba(0, 0, 0, 0);
	background:rgba(39, 174, 96,1.0);
	border: 2px solid rgba(39, 174, 96, 1);
	font-size: 1.3rem;
	color: #ffffff;
}
#button .navButton:hover,
#button .navButton:focus,
#rhome:hover,
#rhome:focus{
	transition: all 0.3s ease;
	transform: scale(1.05);
	box-shadow:0px 3px 8px rgba(0, 0, 0, .05);
	background:rgba(46, 204, 113,1.0);
	border-color:rgba(46, 204, 113,1.0);
	color: #ffffff;
}
#rhome{
	display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 0 2rem 0;
}

#inner-wrapper {
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(20px);
	border-radius: 25px;
	box-shadow: 0px 5px 20px rgba(00, 00, 00, 0.2);
	max-width: 80%;
	width: 100%;
	margin: 25px auto;
}


.container{
	width:100% !important;
}

input[type=checkbox], input[type=radio] {
	margin: 0px;
	line-height: normal;
	width: 20px !important;
	height: 20px !important;
}

#registerButton {
	float: right;
	margin: 0 0 15px 0;
}
#registerButton:hover,
#registerButton:focus{
	color:#ffffff !important;
	text-decoration: none;
}

#returning {
	color: white;
	background-color: #28455e;
	padding: 10px 20px;
	border-radius: 5px;
	text-decoration: none;
	display: inline-block;
	font-weight: bold;
	transition: background-color 0.3s ease;
	margin-bottom: 10px;
	display:none;
}



.nav>li>a:focus, .nav>li>a:hover {
	text-decoration: none;
	
}
/*
button, html input[type=button], input[type=reset], input[type=submit] {
	-webkit-appearance: button;
	cursor: pointer;
	background-color: #28455e;
}
*/
.de_field_small {
	width: 100%;
}
#fields .field {
	width: 100% !important;
	margin: 0;
}


#fields .form-group{
	display: flex !important;      
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	margin:0;
	line-height: 1.8;
	gap:1rem;
}
#fields .form-group#field-141206, #fields .form-group#field-141213{
	display: grid !important;
	grid-template-columns: 1fr 5fr;

}
#fields .form-group#field-141213 :nth-child(5){
	grid-column:2;
}


#fields .form-group > label{
	display: inline-block !important;
	flex: 0 0 26%;             
	width: 26% !important;       
	margin: 0 !important; 
}


#fields .form-group > div{
	flex: 1 1 auto;
	min-width: 0;                
}

label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 0px;
	font-weight: 100;
	line-height: normal;
}
legend {
	font-size:var(--default-font-size);
	font-weight: normal;
	margin-bottom: 5px;
	border: none;
}

#fields .form-group label .de_required{ margin-left: 4px; }

input[type="text"], input[type="email"], textarea {
	display: block;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	padding: 0.375rem 0.75rem;
	line-height: 1.5rem;
	border-radius: 0.5rem;
	border: 1px solid #D1D5DB;
	background-clip: padding-box; 
	transition: box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding:10px;

}
.nav.navbar-nav {
	justify-content: center;
	float: none;
	display: flex;
	align-items: center;
	gap: 1rem;
}
.pageinfo {
	padding: 1rem;
	border-radius: 4px;
	font-size: 1.5rem;
	background-color: #175c95e6;
	color: #fff;
	margin: 1rem;
	margin-bottom: 0;
}

#content .panel {
	padding: 0 1rem;
	margin:0;
}
.panel-default {
	border-color: #ddd;
}
.panel {
	margin-bottom: 20px;
	background-color: transparent;
	border: 1px solid transparent;
	box-shadow: none;
	border: none;
	border-radius: 0;
}
#accommodations .addr {
	margin-bottom: 12px;
	white-space: normal !important;
}


@media (max-width: 768px) {
	.h2, h2 {
		font-size: 2rem;      
	}
	.panel-body {
		padding: 0;
	}

	.row {
		margin-right: -15px;
		margin-left: -15px;
	}
	#fields .form-group {
		display: block !important;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		gap: 1px;
		margin-bottom: 14px;
		line-height: 1.8;
	}
	#fields .form-group#field-141206, #fields .form-group#field-141213{
		display: block !important;
		grid-template-columns: 1fr 5fr;
	}
	#fields .form-group#field-141206, #fields .form-group#field-141213 {
		display: block !important;

	}
	#inner-wrapper {
		margin:0;
		width:100%;
		max-width: 100% !important;
		border-radius: 0;

	}
	#header{
		margin-bottom: 1rem;
	}
	#fees {

		font-size: 1rem !important;
	}
	.navbar {

		margin-left: 3rem;
		margin-right: 3rem;
	}

	#siteNav {
		width: 100%;
		top: 0px;
		left: 0px;
		background: rgb(247, 147, 29);
		margin: 0px auto;	
	}
	.navbar-nav>li>a {
		padding-top: 10px;
		padding-bottom: 10px;
		line-height: 20px;
		padding-left: 20px;
	}
	.links-wrapper .nav > li > a:hover {
		text-decoration: none;
		background-color: #00447c;
		color: #fff;

		margin-left: 13px;
		margin-right: 13px;
	}
	.de_menu.navbar-nav li a {
		color: white !important;
	}
	.nav-tabs {
		border: 1px solid #ddd;
	}

}

.colleagueForm .field{
	width:100% !important;	
}


@media (max-width: 600px) {
	.container {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
	}
}

.de_fieldset{
	display: block;
	position: relative;
	height: 100%;
	overflow: hidden;	
}

.text-editable h2{
	font-weight:var(--form-h2-weight);
	color:var(--secondary-color);
	font-size:var(--form-h2-size);
	margin: 0 0 12px 0;
	padding: 0 0 12px 0;
	border-bottom: 1px solid var(--secondary-color);
}
#fields,
.review,
.completed-page,
#pay .row>.col-sm-9{
	background: rgba(255, 255, 255, 0.8);
	border-radius: 1rem;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
	padding: 35px;
}
#fields .form-group.noflex{
	position: relative;
	display: inline-block !important;
	width:100%;
}
#fields .form-group.noflex fieldset{
	display: grid;
	grid-template-columns: 27% 68%;
	gap:1rem;
	width: 100%;
}
#fields .form-group.noflex fieldset legend{
	float: left;
	font-size: inherit;
	font-weight: inherit;
	margin: 0;
	padding-right:1rem;
}
.de_fieldset {
	display: grid;
	position: relative;
	height: 100%;
	overflow: visible;
	gap: 1rem;
}
/*
div.field .de_cols_1 label > span{
display: grid !important;
}
*/
div.field .de_cols_1 label > span > span{
	font-size: 0.9rem;
	background: rgba(255, 255, 255, 0.7);
	padding: 15px;
	border-radius: 8px;
	margin: 5px 0;
	border: 1px solid rgba(00, 00, 00, 0.1);
	box-shadow: 0px 3px 8px rgba(00, 00, 00, 0.1);
	line-height: 1.3rem;
	display: flex;
	gap: .5rem;
}

div[data-group="fieldwnote"] .form-group .footNote{
	font-size: 0.9rem;
	padding: 0px 15px;
	margin: 5px 0;
	line-height: 1.3rem;
	gap: .5rem;
}

div.field .de_cols_1 label > span > span:before,
div[data-group="fieldwnote"] .form-group .footNote:before,
.addAnotherColleague:before{
	font-family: "Font Awesome 7 Free";
	display:inline-block;
	font-weight: 900;
	content:"\f05a";
	color:var(--info-icon-color);
	font-size: 1.2rem;
}
.addAnotherColleague:before{
	content:"\f145";
	color: #ffffff;
	transition: all 0.3s ease;
	transform: scale(1);
}
.addAnotherColleague{
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
	background:var(--secondary-color) !important;
	border-color:var(--secondary-color) !important;
	transition: all 0.3s ease;
	transform: scale(1);
	box-shadow: 0px 0px 0px rgba(0,0,0,0.0);
}
.addAnotherColleague:hover,
.addAnotherColleague:focus{
	background:var(--secondary-color) !important;
	border-color:var(--secondary-color) !important;
	transition: all 0.3s ease;
	transform: scale(1.05);
	box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
	text-decoration: none !important;
}

.addAnotherColleague:hover:before{
	transition: all 0.3s ease;
	transform: scale(1.08);
	text-shadow: 0px 3px 8px rgba(0, 0, 0, .1);
}

div.colleagueBag p.remainingColleagues {
    margin: 15px 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.remainingColleagues span {
    background: var(--primary-color);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 13px;
    border: 2px solid #ffffff;
    box-shadow: 0px 2px 7px rgba(00, 00, 00, 0.1);
    color: #ffffff;
    font-size: 0.9rem !important;
}

div[data-group="sessionSelection"]{
	margin:2rem 0 !important;
}

div[data-group="sessionSelection"] fieldset,
div[data-group="day-selection"] fieldset{
	overflow: visible;
	align-items: start;
}
div[data-group="sessionSelection"] fieldset legend,
div[data-group="day-selection"] fieldset legend{
	overflow: visible;
	background: var(--primary-color);
	color:#ffffff;
	border-radius: 12px;
	border:3px solid #ffffff;
	box-shadow: 0px 3px 8px rgba(0, 0, 0, .1);
	width: 95%;
	padding:5px 15px;
	display: flex;
	align-items: center;
	gap:0.5rem;
}
div[data-group="sessionSelection"] fieldset legend .de_required,
div[data-group="day-selection"] fieldset legend .de_required{
	color:#ffffff;
}

.session-confirm:before,
div[data-group="day-selection"] fieldset legend:before,
div[data-group="sessionSelection"] fieldset legend:before,
div.colleagueBag ul li a.loadModal:before,
div.colleagueBag ul li a.colleagueDelete:before,
#rhome:before{
	font-family: "Font Awesome 7 Free";
	display:inline-block;
	font-weight: 900;
	font-size: 1.2rem;
	content:"";
}
#rhome:before{
	content:"\f015";
}

#next:after,
.btn-wrapper a:first-of-type:before,
#finalProcessButton:after{
	font-family: "Font Awesome 7 Free";
	display:inline-block;
	font-weight: 900;
	content:"\f101";
}
.btn-wrapper a:first-of-type:before{
	content:"\f100";
}
#finalProcessButton:after{
	content:"\f101";
}
div.colleagueBag ul li a.loadModal:before{
	content:"\f145";
	color: var(--secondary-color);	
}
div[data-group="day-selection"] fieldset legend:before{
	content:"\f073";
	color: rgba(255,255,255,1);
}
div[data-group="sessionSelection"] fieldset legend:before{
	content:"\f017";
	color: rgba(255,255,255,1);
}

.session-confirm:before{
	color:var(--info-icon-color);
	content:"\f06a";
}

.session-confirm,
div[data-id="153112"] p.footNote{
	display: flex;
	align-items: center;
	gap: 0.5rem;
	background: rgba(255, 255, 255, 0.5);
	border-radius: 25px;
	padding: 7px 20px;
	font-size: 0.9rem;
	box-shadow: 0px 3px 8px rgba(00, 00, 00, 0.1);
}

div[data-id="153112"] p.footNote{
	padding: 16px 20px !important;
	align-items: flex-start;
	gap: 0.7rem !important;
	font-size: 1rem !important;
}
div[data-id="153112"] p.footNote:before{
	font-size: 1.5rem !important;
	color:var(--primary-color) !important;

}

div.field .de_cols_1 label > span > span{
	transition: all 0.3s ease;
	transform: scale(1);
}
div.field .de_cols_1 label > span > span:hover{
	transition: all 0.3s ease;
	transform: scale(1.05);
}

div.field .de_cols_1 label{
	display:flex;
	gap: 1rem;
}
div.field .de_cols_1 label span{
	display:flex;
}
.de_quantity{
	display:none;
}

input[type="text"],
textarea, 
select{
	transition: all 0.4s ease;
	transform: scale(1);
	box-shadow: 0px 0px 0px rgba(00, 00, 00, 0.00);
}
input[type="text"]:hover,
textarea:hover,
select:hover{
	transition: all 0.4s ease;
	transform: scale(1.005);
	box-shadow: 0px 1px 5px rgba(00, 00, 00, 0.05);
}
input[type="text"]:focus,
textarea:focus,
select:focus{
	transition: all 0.4s ease;
	transform: scale(1.009);
	box-shadow: 0px 3px 8px rgba(00, 00, 00, 0.1);
}

div[data-group="dinner-guest"] .colleagueFieldHeading p{
	display:none;
}
div[data-group="dinner-guest"] .well{
	padding: 0;
	background: transparent;
	border: none;
	box-shadow: none;
}
#fields div[data-group="dinner-guest"] .form-group{
	display: grid !important;
	grid-template-columns: 27% 70%;
	gap: 1rem;
	align-items: flex-start;
}
div.colleagueBag ul li {
	border: 1px solid rgba(00, 00, 00, 0.1);
	padding: 0px 10px;
	height: 100%;
	overflow: hidden;
	margin: 5px 0px;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	background: rgba(255, 255, 255, 0.8);
	border-radius: 15px;
	box-shadow: 0px 0px 8px rgba(00, 00, 00, 00.01);
	transition: all 0.4s ease;
	transform: scale(1);
}
div.colleagueBag ul li a.loadModal {
	font-size: 1.1rem;
	float: left;
	width: 100%;
	max-width: 100%;
	padding: 10px 0px 10px 11px;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	transition: all 0.4s ease;
	transform: scale(1);
	box-shadow: 0px 0px 0px rgba(00, 00, 00, 0);
}
div.colleagueBag ul li a.loadModal:hover,
div.colleagueBag ul li a.loadModal:focus{
	text-decoration: none;
}
div.colleagueBag ul li:hover,
div.colleagueBag ul li:focus{
	transition: all 0.4s ease;
	transform: scale(1.03);
	box-shadow: 0px 3px 12px rgba(00, 00, 00, 00.1);
	text-decoration: none !important;
}
div.colleagueBag ul li a.colleagueDelete{
	transition: all 0.4s ease;
	transform: scale(1);
	box-shadow: 0px 0px 0px rgba(00, 00, 00, 0);
	    transition: all 0.4s ease;
    transform: scale(1);
    box-shadow: 0px 0px 0px rgba(00, 00, 00, 0);
    float: none;
    width: auto;
    background: rgba(192, 57, 43, 1.0);
    font-size: 1rem;
    border-radius: 8px;
}
div.colleagueBag ul li a.colleagueDelete:hover,
div.colleagueBag ul li a.colleagueDelete:focus{
	transition: all 0.4s ease;
	transform: scale(1.05);
	box-shadow: 0px 3px 12px rgba(00, 00, 00, 00.1);
	
}
div.colleagueBag ul li a.colleagueDelete .fa-trash:before{
	content:"\f2ed";
	transition: all 0.4s ease;
	transform: scale(1);
}
div.colleagueBag ul li a.colleagueDelete:hover .fa-trash:before{
	transition: all 0.4s ease;
	transform: scale(1.03);
}

/*************************
	Review
**************************/
.review br,
#pay .col-sm-9 br{
	display:none;
}
.review>h4,
#pay .col-sm-9>h4{
	margin: 0 0 2rem 0;
    padding: 15px 25px;
    display: flex;
    align-items: center;
    background: var(--secondary-color);
    color: #ffffff;
    border-radius: 15px;
    position: sticky;
    top: 1rem;
    z-index: 9;
    font-size: 1.3rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
.review #fieldContainer,
#pay .col-sm-9 #fieldContainer{
	display: grid;
    gap: 0.8rem;
    background: transparent;
}
.review #fieldContainer div.field-summary,
#pay .col-sm-9 #fieldContainer div.field-summary{
    padding: 1.5rem 1rem;
    margin: 0;
    width: 100% !important;
    display: flex;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
	transform: translateY(0);
	transition: all 0.3s ease;
}
.review #fieldContainer div.field-summary:hover,
#pay .col-sm-9 #fieldContainer div.field-summary:hover{
	transform: translateY(-5px) scale(1.02);
	box-shadow: 0 10px 25px rgba(0,0,0,0.1);
	transition: all 0.3s ease;
}


.review #fieldContainer hr,
#pay .col-sm-9 #fieldContainer hr{
	display:none;	
}


/*********************************
Landing Content
*********************************/
.landing-card-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
}

/* Base Card Style */
.landing-card-grid .card {
	background: rgba(255,255,255,0.8);
	border-radius: 1rem;
	padding: 1.5rem;
	box-shadow: 0 4px 15px rgba(0,0,0,0.05);
	transition: all 0.3s ease;
	opacity: 0;
	transform: translateY(30px);
}

.landing-card-grid .card.visible {
	opacity: 1;
	transform: translateY(0);
}

.landing-card-grid .card h3, .card h2 {
	margin-top: 0;
	color: var(--secondary-color);
	font-weight:bold;
}

/* Hover Effect */
.landing-card-grid .card:hover {
	transform: translateY(-5px) scale(1.02);
	box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

/* Hover Effect */
.landing-card-grid.regandfees .card:hover {
	transform: translateY(0px) scale(1);
}

/* Light Hero Card (full width) */
.landing-card-grid .card-hero {
	flex: 0 0 100%;
	background:rgba(255,255,255,0.8);
	color: #222;
	padding: 2.5rem;
	border: 1px solid #dcdcdc;
}

/* Normal Cards (33% width) */
.landing-card-grid .card-small {
	flex: 0 0 calc(33.3% - 1rem);
}
.landing-card-grid .card-medium {
	flex: 0 0 calc(50% - 1rem);
}

@media(max-width: 900px) {
	.landing-card-grid .card-small {
		flex: 0 0 48%;
	}
	.landing-card-grid .card-medium {
		flex: 0 0 calc(100% - 1rem);
	}
}

@media(max-width: 600px) {
	.landing-card-grid .card-small,
	.landing-card-grid .card-medium{
		flex: 0 0 100%;
	}
}

/* Icon style */
.landing-card-grid .icon,
.landingbtn .icon{
	font-size: 2rem;
	/*margin-bottom: 1rem;*/
	color: var(--primary-color);
}


.landing-card-grid .cta-location,
.landingbtn,
.btn-wrapper a,
.btn-wrapper input,
.btn-primary,
#submitPay,
.completed-page .btn-primary{
	--y: 0;
	--s: 1;

	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.9rem 1.6rem;
	background: var(--primary-color);
	color: #fff;
	font-size: 1.05rem;
	font-weight: 600;
	border-radius: 14px;
	text-decoration: none;

	/* Transform variables for hover & pulse */
	transform: translateY(var(--y)) scale(var(--s));
	transition: 
		background 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease;

	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.landing-card-grid .cta-location i,
.landingbtn i{
	font-size: 1.2rem;
	transition: transform 0.25s ease;
}
/* Hover State */
.landing-card-grid .cta-location:hover,
.landingbtn:hover,
.btn-wrapper a:hover,
.btn-wrapper input:hover,
.btn-primary:hover,
.btn-primary:focus,
#submitPay:hover,
#submitPay:focus,
.completed-page .btn-primary:hover,
.completed-page .btn-primary:focus{
	--y: -3px;
	background: var(--secondary-color);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.btn-wrapper a,
.btn-wrapper input{
	border-color:transparent !important;
}
.landing-card-grid .cta-location:hover i,
.landingbtn:hover i{
	transform: scale(1.2);
}

/* Pressed / Active */
.landing-card-grid .cta-location:active {
	--y: 0px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Pulse modifies scale only */
.landing-card-grid .pulse {
	animation: pulse 0.4s ease-in-out;
}

@keyframes pulse {
	0%   { --s: 1; }
	50%  { --s: 1.05; }
	100% { --s: 1; }
}
.custom-footer {
	text-align: center;
	padding: 20px;
	color: #333;

}
.custom-footer p {
	margin: 5px 0;
}
.custom-footer a {
	color: var(--secondary-color);
	text-decoration: none;
}
.custom-footer a:hover {
	text-decoration: underline;
}
.footer-social {
	margin-top: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}
.footer-social a {
	margin: 0px;
	color:  var(--secondary-color);
	transition: all 0.4s ease;
	transform: scale(1);
	font-size: 1.8rem;
}
.footer-social a:hover {
	color: var(--primary-color);
	transition: all 0.4s ease;
	transform: scale(1.07);
}

.footer-social a i{
	transition: all 0.4s ease;
	transform: scale(1);
}

.footer-social a:hover i{
	transition: all 0.4s ease;
	transform: scale(1.07);
	text-shadow: 0px 3px 8px rgba(0, 0, 0, .05);
}
#mycs-loading-mask{
	display:none;	
}
.modal-backdrop,
#mycs-loading-mask{
	opacity: 1 !important;
	background: rgba(255, 255, 255, 0.1) !important;
	backdrop-filter: blur(15px);
}

#mycs-loading-mask #mycs-spinner{
	background: url('https://mycs-cdn.myconferencesuite.com/other/Project/3850/38/be/38bea91d4542e338e3a07611741708bf537f2c9f480c5a560588a19184e5baae.gif') no-repeat center transparent;
	position: fixed;
	top: 48%;
	left: 46%;
	width: 110px;
	height: 110px;
	text-align: center;
	background-size: contain;
}

.alert.alert-success{
	display:none;
}
div[data-group="note"] .form-group{
	gap:0 !important; 
}
.modal-content{
	border-radius: 25px;
    box-shadow: 0px 5px 20px rgba(00, 00, 00, 0.1);
    border: none;
	padding:35px;
}
.colleagueForm div[data-group="sessionSelection"],
.colleagueForm div[data-group="registrant-type"],
.colleagueForm div[data-group="dinner-guest-check"]{
	display:none;
}
.modal-title{
	color: var(--secondary-color);
    font-weight: bold;
    font-size: 1.4rem;
    margin: 0;
    padding: 0;
    border: none;
    line-height: normal;
}
p.modal-submit{
    display: flex;
    align-items: center;
    justify-content: center;
}
p.modal-submit button{
	display: flex;
    align-items: center;
    justify-content: center;
	padding: 15px 30px;
    border-radius: 1rem;
    transition: all 0.3s ease;
    transform: scale(1);
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    background: rgba(39, 174, 96, 1.0);
    border: 2px solid rgba(39, 174, 96, 1);
    font-size: 1.3rem;
}
p.modal-submit button:hover,
p.modal-submit button:focus{
	transition: all 0.3s ease;
	transform: scale(1.05);
	box-shadow:0px 3px 8px rgba(0, 0, 0, .05);
	background:rgba(46, 204, 113,1.0);
	border-color:rgba(46, 204, 113,1.0);
}
.modal-footer{
	display:none;
}
div[data-id="153112"] .form-group{
	align-items: start !important;
}
textarea {
    min-height: 160px;
}

#terms-and-conditions{
	display:none;
	width:100%;
	max-width: 80%;
}



/*****************************
	Schedule Items
*****************************/
/* ROW CONTAINER WITH TIMELINE BAR */
.m-seminar-list__list__row {
    margin: 25px 0;
    padding: 25px 25px 25px 30px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 18px rgba(0,0,0,0.08);
    position: relative;
    opacity: 0;
    transform: translateY(25px);
    transition: all .7s ease;
}

.m-seminar-list__list__row::before {
    content:"";
    position:absolute;
    left:12px; top:20px; bottom:20px;
    width:4px;
    background:linear-gradient(180deg,rgba(00,71,125,0.7),rgba(00,71,125,1));
    border-radius:10px;
}

.m-seminar-list__list__row.visible { opacity:1; transform:translateY(0); }

/* TIME HEADER */
.m-seminar-list__list__row__header {
    font-size: 1.35rem;
    font-weight: 700 !important;
    color: #202020 !important;
    display: flex;
    align-items: center;
    gap: 10px;
    width: unset !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

.m-seminar-list__list__row__header:before {
    content:"\f017"; /* clock */
    font-family:"Font Awesome 7 Free";
    font-weight:900;
    color:var(--secondary-color);
    font-size:1.2rem;
}

/* SESSION ITEMS */
.m-seminar-list__list__items__item {
    margin-bottom:18px;
    padding:20px;
    background:#f9fbff !important;
    border-radius:14px;
    box-shadow:0 3px 10px rgba(0,0,0,0.05);
    opacity:0;
    transform:translateX(35px);
    transition:all .7s cubic-bezier(.25,.8,.25,1);
    position:relative;
}

.m-seminar-list__list__items__item.visible {
    opacity:1;
    transform:translateX(0);
}
.m-seminar-list__list__row{
	display:grid !important;
}


.m-seminar-list__list__items__item:hover {
    box-shadow:0 6px 20px rgba(0,0,0,0.12);
    transform:translateY(-3px);
}

/* REMOVE HRs */
.m-seminar-list__list__items__item hr { display:none !important; }

/* TAG / CATEGORY COLOR */
.tag-button {
    padding:5px 12px;
    border-radius:8px;
    font-size:.75rem;
    font-weight:700;
    color:#fff !important;
    text-transform:uppercase;
    display:inline-block;
    margin-bottom:10px; /* spacing below tag */
}

/* CATEGORY COLORS */
.tag-closed      { background:#ffbf0f !important; color:#000 !important; }
.tag-workshop    { background:#007bff !important; }
.tag-keynote     { background:#e63946 !important; }
.tag-social      { background:#9b59b6 !important; }
.tag-session     { background:#6c757d !important; }
.tag-break       { background:#2ecc71 !important; }

/* DATE/TIME AREA */
.session-date-time {
    margin-top:0;
    display:flex;
    flex-wrap:wrap;
    font-size:.9rem;
	font-size: 1rem !important;
}

.session-date-time i { color:#555; }

/* SUMMARY LINK BUTTONS */
.session-operations a.download-btn {
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 14px;
    border-radius:8px;
    background:var(--secondary-color);
    color:#fff !important;
    font-weight:600;
    font-size:.85rem;
    text-decoration:none;
    opacity:0;
    transform:translateX(25px);
    transition: all .6s ease;
}

.session-operations a.download-btn.visible {
    opacity:1;
    transform:translateX(0);
}

.session-operations a.download-btn:hover {
    background:#0056b3;
    box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

/* ACCORDION ARROW REMOVED */
.m-seminar-list__list__items__item::after { content:none; }

.left-side h4>i{
	color:var(--primary-color);
}
.session-date-time i{
	color:var(--secondary-color);
}
.session-schedule-card .session-header{
	    background: transparent !important;
    box-shadow: none !important;
    padding: 1rem !important;
    border-radius: 0 !important;
}
.session-title h4{
	margin: 0 0 15px 0;
    font-size: 1.3rem;
}
.tabarea ul.nav-tabs {
    display: flex;
    gap: 1rem;
    border-bottom: none; /* Remove default bootstrap underline */
    padding: 0;
    margin: 20px 0;
    justify-content: center;
}

.tabarea .nav-tabs li {
    list-style: none;
}

.tabarea .nav-tabs li a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 50px; /* pill shape */
    text-decoration: none;
    font-weight: 600;
    color: #555;
    background: #f4f4f4;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
	border:none !important;
}

.tabarea .nav-tabs li a:hover {
    background: var(--secondary-color);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transform: translateY(-2px);
}

.tabarea .nav-tabs li.active a,
.tabarea .nav-tabs li a.active {
    background: var(--secondary-color);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.tabarea .nav-tabs li a i {
    font-size: 0.9em;
}

/* Optional: Smooth fade for tab content if using tab panes */
.tabarea .tab-pane {
    opacity: 0;
    transition: opacity 0.5s ease;
    display: none;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 10px;
    margin-top: 10px;
}

.tabarea .tab-pane.active {
    display: block;
    opacity: 1;
}
.col-sm-9>h2{
	text-align: center;
	color: var(--secondary-color);
}

/* Container */
.fee-breakdown {
    display: grid;
    gap: 20px;
	margin: 2rem 0;
}

/* Header row - desktop only */
.fee-breakdown-header {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.95rem;
    color: #555;
    padding: 14px 20px;
    background: #e9ecef;
    border-radius: 8px;
	align-items: center;
}

.fee-breakdown-header span.muted {
    display: block;
    font-weight: 400;
    font-size: 0.75rem;
    color: #888;
}

/* Row cards */
.fee-breakdown-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    background: #fff;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    align-items: center;
    gap: 2rem;
    position: relative;
    cursor: pointer;
    overflow: visible; /* tooltip fix */
    border: 1px solid #dee2e6;
}

.fee-breakdown-row:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.15);
    background: #f8f9fa;
}

/* Columns */
.col-category {
    font-size: 1rem;
    line-height: 1.4;
    color: var(--secondary-color);
    font-weight: 500;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}
.col-category i{
	font-size: 1.3rem;
    color: var(--primary-color);
}
.col-meetings, .col-dinner {
display: grid;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 500;
    color: #333;
    position: relative;
    text-align: center;
}

.col-meetings i, .col-dinner i {
    font-size: 1.2rem;
    transition: transform 0.5s ease, color 0.5s ease;
	    display:none;
    width: 100%;
}

/* Icon sliding on hover 
.fee-breakdown-row:hover .col-meetings i {
    transform: translateX(6px) rotate(10deg);
    color: #007bff;
}
.fee-breakdown-row:hover .col-dinner i {
    transform: translateX(6px) rotate(-10deg);
    color: #28a745;
}
*/

/* Tooltip */
.col-meetings[data-tooltip]:hover::after,
.col-dinner[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;

    background: rgba(0,0,0,0.85);
    color: #fff;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
    white-space: nowrap;
    z-index: 10;
    pointer-events: none;
}

.col-meetings[data-tooltip]:hover::before,
.col-dinner[data-tooltip]:hover::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: rgba(0,0,0,0.85) transparent transparent transparent;
}

.landing-card-grid.regandfees {
    margin: 2rem 0 0 0;
}

/* Mobile adjustments - modern stacked card */
@media (max-width: 768px) {
    .fee-breakdown-header {
        display: none;
    }

    .fee-breakdown-row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 24px;
        gap: 16px;
    }

    .col-category {
        font-weight: 600;
        font-size: 1.05rem;
    }

    .col-meetings, .col-dinner {
        justify-content: flex-start;
        width: 100%;
    }
}

.travel p {
    margin: 1rem 0;
    padding: 1rem;
    box-shadow: 0 3px 10px rgba(00, 00, 00, 0.1);
    border-radius: 25px;
}

.travel p strong {
    color: var(--secondary-color);
    margin: 0 0 0.5rem;
    display: block;
}
.travel p br {
    display: none;
}
p.traveltoandfrom{
	display: grid;
      gap: 1rem;	
}
p.traveltoandfrom span b{
	display:block;	
}
#infoTable tr:nth-child(3) td:nth-child(2),
#infoTable tr:nth-child(4) td:nth-child(2) {
    display: flex;
    gap: 1rem;
}

#infoTable tr:nth-child(4) td:nth-child(2) .row div.col-xs-5 {
    padding-left: 0;
}

#infoTable tr:nth-child(5) td:nth-child(1) {
    display: flex;
    gap: 1rem;
}

#infoTable tr:nth-child(5) td:nth-child(1) br {
    display: none;
}

#infoTable tr td {
    align-items: center;
}

table.breakdown {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
    font-size: 1rem;
    border: 1px solid var(--ultra-light-black);
}

#project_payment_methods>h4 {
    display: flex;
    background: rgba(39, 174, 96, 1.0);
    padding: 15px 20px;
    width: 40%;
    margin: 34px 0;
    color: #ffffff;
    border-radius: 10px;
    border: 2px solid #ffffff;
    box-shadow: 0px 3px 8px rgba(var(--black), 0.1);
}

#project_payment_methods label {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    margin: 15px 20px;
    width: auto;
}

#project_payment_methods label input {
    margin: 0px;
    width: 20px;
    height: 20px;
}


table.breakdown thead th {
    background: #f8fafc;
    color: #334155;
    font-weight: var(--extra-weight);
    padding: 14px 12px;
    border-bottom: 1px solid #e5e7eb;
    white-space: nowrap;
}

table.breakdown thead th.desc {
    text-align: left;
    border: none;
    border-color: transparent;
}


table.breakdown tbody tr {
    transition: background .25s ease, transform .15s ease;
}

table.breakdown tbody tr:not([style*="border-top"]) td {
    border-bottom: none;
}

table.breakdown tbody tr:hover {
    background: #f8fafc;
}


table.breakdown td {
    padding: 14px 12px;
    vertical-align: middle;
    color: #334155;
}

table.breakdown td.amount,
table.breakdown td.sum_total,
table.breakdown td.sum_subtotal,
table.breakdown td.sum_tax,
table.breakdown td.sum_taxable {
    text-align: right;
    font-weight: var(--extra-weight);
}


table.breakdown td.desc {
    font-weight: var(--base-weight);
    line-height: 1.4;
    border: none;
}


table.breakdown td:nth-child(2),
table.breakdown td:nth-child(3) {
    text-align: center;
    color: #64748b;
}


.info.taxExempt {
    margin-right: 6px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: var(--extra-weight);
    border-radius: 999px;
    background: #e0f2fe;
    color: #0369a1;
    vertical-align: middle;
    display: none;
}

.info.taxExempt::before {
    content: "Tax Exempt";
}

table.breakdown tr[style*="border-top"] td {
    border-top: 2px solid #e5e7eb !important;
    padding-top: 18px;
    border: transparent;
}

.sum_total {
    font-size: 18px;
    color: #0f172a;
}

tr:last-child td {
    background: #f8fafc;
}

#breakdown_body div.btn-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 96%;
    margin: 20px auto;
}

#noTax {
    font-size: 13px;
    color: #64748b;
    opacity: 0;
    visibility: hidden;
}

#noTax .info {
    display: inline-block;
    margin-right: 6px;
    font-weight: bold;
    color: #10b981;
}

/***************************
	Coupon Form
****************************/
#couponForm {
    max-width: 41%;
    margin: 1rem 0rem 1.5rem 1rem;
    padding: 1rem 1.25rem;
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    position: relative;
    float: right;
    width: 100%;
}

#couponForm .field {
    width: 83%;
}

#couponForm .form-group {
    position: relative;
    align-items: center;
    gap: 0;
    margin-bottom: 0;
}

#couponForm label {
    display: block;
    font-size: 1rem;
    font-weight: var(--extra-weight);
    color: #6b7280;
    margin-bottom: 0.35rem;
}

#couponForm .de_p_hide {
    font-size: 0.75rem;
    color: #9ca3af;
    margin: 0 0 0.4rem;
}

#couponForm .form-group>div {
    position: relative;
}

#couponForm input[type="submit"] {
    position: absolute;
    top: calc(0.3rem + 0.9rem);
    right: 1.25rem;
    height: 46px;
    padding: 0 1.1rem;
    border-radius: 8px;
    border: none;
    background: linear-gradient(135deg, #6366f1, #4f46e5);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: var(--extra-weight);
    cursor: pointer;
    transition: all 0.25s ease;
}

#couponForm input[type="submit"]:hover {
    box-shadow: 0 6px 16px rgba(79, 70, 229, 0.35);
}

#couponForm input[type="submit"]:active {
    transform: scale(0.96);
}


@media (max-width: 768px) {
	.navbar-toggle{
		background: var(--secondary-color);
	}
	.navbar-toggle .icon-bar{
		background:var(--primary-color);
	}
    #content {
        width: 100%;
        max-width: 100% !important;
    }

    #content .panel {
        margin: 0rem !important;
    }

    section#header .banner .banner-info {
        width: 95%;
        margin: 8px auto;
    }

    section#header .banner .banner-info h2 {
        font-size: 1.2rem;
    }

    section#header .banner .banner-info h3 {
        font-size: 1.1rem;
    }

	#header .innheader{
		display:grid;
	}
	#header .innheader .event-information{
		padding:0px 0px 10px 0px;
	}
	
    .body-wrapper .card,
    .travel-wrapper .card {
        padding: 13px;
    }

    .body-wrapper p,
    .travel-wrapper p {
        padding: 0rem;
    }

    .body-wrapper ul,
    .travel-wrapper ul {
        padding-left: 4px;
    }

    .panel-body {
        padding: 0px;
    }

    div.review div.field-summary.row {
        display: grid;
        gap: 0.5rem;
    }

    .btn-wrapper {
        margin: 20px 0;
    }

    .buttonwrap {
        width: 100%;
        gap: 1rem;
        display: grid;
        align-items: center;
        justify-content: center;
    }

    #couponForm p.footNote {
        font-size: 0.68rem;
    }

    #singleTab .row>.col-sm-3,
    .review-page .panel-body>.row>.col-sm-3,
    .breakdown-page .panel-body>.row>.col-sm-3 {
        position: relative !important;
        top: 0 !important;
        padding: 0px 15px;
    }

    .breakdown,
    table.breakdown tr,
    table.breakdown .desc,
    table.breakdown .amount,
    table.breakdown td.totalQuantity {
        border: none !important;
    }

    .breakdown {
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    .breakdown thead {
        display: none !important;
    }

    table.breakdown .desc {
        display: grid;
        align-items: center;
        justify-content: flex-start;
        padding: 10px 0;
        text-align: left;
    }

    table.breakdown .desc:before {
        position: relative;
    }

    .panel-body>.row>.col-sm-9,
    .panel-body>.row>.col-sm-3 {
        float: none;
        clear: both;
        height: 100%;
        overflow: visible;
        width: 100%;
        display: grid;
		padding: 5px;
    }
	.landing-card-grid .card{
		padding:1.5rem;
	}
    .panel-body>.row>.col-sm-3 {
        padding: 10px;
    }

    .breakdown,
    .breakdown tbody,
    .breakdown tr,
    .breakdown td {
        display: block;
        width: 100%;
    }

    .breakdown tr {
        margin-bottom: 18px;
        padding: 16px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.22);
        backdrop-filter: blur(14px) saturate(160%);
        -webkit-backdrop-filter: blur(14px) saturate(160%);
        border: 1px solid rgba(255, 255, 255, 0.45);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
        opacity: 0;
        transform: translateY(10px);
        animation: fadeSlideIn 0.35s ease forwards;
    }

    @keyframes fadeSlideIn {
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .breakdown tr:nth-child(odd) {
        background: rgba(255, 255, 255, 0.32);
    }

    .breakdown tr:nth-child(even) {
        background: rgba(255, 255, 255, 0.18);
    }

    .breakdown td {
        text-align: right;
        padding: 10px 0;
        position: relative;
        font-size: 15px;
        line-height: 1.3;
    }

    .breakdown td:nth-child(1)::before {
        content: "Description";
    }

    .breakdown td:nth-child(2)::before {
        content: "Quantity";
    }

    .breakdown td:nth-child(3)::before {
        content: "";
    }

    .breakdown td:nth-child(4)::before {
        content: "Unit Price";
    }

    .breakdown td:nth-child(5)::before {
        content: "Tax";
    }

    .breakdown td:nth-child(6)::before {
        content: "Amount";
    }

    .breakdown td::before {
        position: absolute;
        left: 0;
        font-weight: var(--extra-weight);
        color: #2a2a2a;
        text-align: left;
        font-size: 14px;
    }

    .breakdown td:empty::before {
        content: "";
    }

    #infoTable tr td,
    #billinfoTable tr td {
        display: block;
        border: none;
        width: 100%;
    }

    #infoTable tr td input[type="text"],
    #infoTable tr td select,
    #billinfoTable tr td input,
    #billinfoTable tr td select {
        width: 100%;
        height: auto;
        font-size: 1.2rem;
        line-height: normal;
    }

    #cvv {
        width: 75px;
        letter-spacing: 4px;
        text-align: center;
        padding: 10px 15px;
    }

    #CVVmodal {
        width: 91% !important;
        border-radius: 25px;
        box-shadow: 0px 3px 20px rgba(00, 00, 00, 0.1);
        text-align: center;
    }

    .breakdown td:nth-child(5)::before {
        display: none;
    }

    td.item_tax_col.hide {
        display: block !important;
        float: left;
        width: 50%;
    }

    td.item_tax_col.hide:nth-child(2):before {
        content: "Tax";
        display: inline-block;
    }


    #fieldContainer .form-group,
    #fieldContainer .form-group.noflex fieldset {
        grid-template-columns: 100% !important;
    }


    #content>.panel,
    #singleTab,
    .custom-page .panel.panel-default {
        margin: 0.51rem;
    }

    .modalPopUp,
    .modal-dialog {
        width: 95%;
    }

    .btn-wrapper {
        display: grid;
        flex-wrap: wrap;
        gap: 1rem;
        justify-content: center;
    }

    #footer .footer .MyCS_brand {
        display: block;
        top: 0;
        margin: 10px 0;
    }

    #footer .footer .MyCS_brand:after {
        font-size: 3.5rem;
    }

    #footer .footer>p {
        font-size: 0.9rem;
    }

    #mycs-spinner {
        top: 40% !important;
        left: 40% !important;
    }

    #paymentForm {
        padding: 0px;
    }

    #paymentForm .btn-wrapper {
        display: grid;
    }

    #couponForm {
        width: 100% !important;
        max-width: 100%;
        margin: 0;
    }

    #couponForm input[type="submit"] {
        position: relative;
        top: 0;
        right: 0;
        border-radius: 10px;
        margin: 5px 0;
    }

    #couponForm .field {
        width: 100%;
    }

    #project_payment_methods>h4 {
        width: 100%;
    }
	.nav.navbar-nav{
		display: grid;
	}
	#header .innheader .event-information h1 {
		font-size: 1.25rem;
	}
	#header .innheader .event-information h2 {
		font-size: 1.1rem;
	}
	#header .innheader .event-information h3 {
		font-size: 0.9rem;
	}
	#header .innheader .event-information h2, #header .innheader .event-information h3{
		justify-content: center;
	}
	#header .innheader .event-information h1,
	#header .innheader .event-information h2,
	#header .innheader .event-information h3{
		margin:0.3rem 0;
		text-align: center;
	}
	#header .innheader div{
		text-align: center;
	}
	#header .innheader div img{
		width:75%;
	}

}
#finalProcessButton:before{
	display:none;	
}