/*
purple: #58008F
black: #444
orange: #e54426

*/

:root{
    --main-color-purple:#58008F;
    --main-color-orange:#e54426;
	--main-color-black:#444444;
    --main-font-family:'Montserrat', sans-serif;
	--secondary-font-family:'Open Sans', sans-serif;
}

input[type=submit]{
	background-color:var(--main-color-purple);
	color:#fff;
	padding:8px 60px;
	box-shadow: inset 0 0 5px rgba(0,0,0,0.6);
	border:0;
	font-size:12px;
	cursor:pointer;
}

input[type=submit]:disabled{
	background-color:#aaa;
	cursor: default;
}

h1.purpleHead{
	font-family: var(--main-font-family);
	margin:0;
	margin-bottom:25px;
	color:var(--main-color-purple);
	font-size:20px;
}

h2.blackBar{
	font-family: var(--main-font-family);
	margin:0;
	margin-bottom:25px;
	color:#FFF;
	background-color:#484848;
	font-size:16px;
	padding:5px 8px;
}

h1.orangeHead{
	font-family: var(--main-font-family);
	margin:0;
	margin-bottom:25px;
	color:var(--main-color-orange);
	font-size:20px;
	font-weight:400;
}

#toolNavWrap{
	padding:12px;
	border:1px solid #ccc;
	margin-bottom:10px;
	min-height:20px;
	margin-bottom:40px;
}

.pageLinks{
	float:right;
}

.pageLinks a{
	color:#000;
	margin-right:20px;
	position:relative;
}

.pageLinks a:last-child{
	margin-right:10px;
}


.pageLinks a:not(:last-child):after{
	content:"|";
	position:absolute;
	right: -13px;
	color:#ccc;
	top:-2px;
}

.pageLinks a.selected{
	color:#9E3A98;
}

#sidebar{
	width:200px;
	display:inline-block;
	vertical-align:top;
	margin-right:30px;
}

#sidebar .filterSections{
	border:1px solid #ccc;
	margin-bottom:22px;
	padding:12px;
}

#sidebar .filterSections h2{
	font-size:12px;
	font-weight:bold;
	margin:0;
	padding:0;
	padding-bottom:6px;
	border-bottom:1px solid #ccc;
	margin-bottom:10px;
}

#sidebar .filterSections h2 i,
i.fa-info-circle,
i.tip-icon{
	color:var(--main-color-orange);
	font-size:13px;
	cursor:pointer;
}

#sidebar .filterSections ul{
	margin:0;
	padding:0;
}

#sidebar .filterSections li{
	list-style:none;
	margin-bottom:3px;
	/*padding-left:25px;
	text-indent:-25px;*/
}

#sidebar .filterSections li span{
	display:block;
	font-size:10px;
	font-style:italic;
	line-height:120%;
	margin-bottom:10px;
}

#content {
    width: calc(100% - 240px);
}

#content, #sidebar {
    display: inline-block;
    vertical-align: top;
}

.eventDetails h1{
	color: var(--main-color-orange);
    font-size: 16px;
    margin: 0 0 10px;
	font-family: var(--main-font-family);
}

.eventDetails p{
	margin: 0 0 5px;
	color: #666;
    font-size: 12px;
}

.eventDetails .buttonWrapper{
    padding-top: 20px;
	padding-bottom:10px;
}

.eventDetails .buttonWrapper a,
span.button {
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6) inset;
    color: #fff;
    display: inline-block;
    margin-right: 15px;
    padding: 10px 15px;
	margin-bottom:15px;
}

.eventDetails .buttonWrapper a.viewMoreDetails{
	 background-color:#9E3997;
 }

.eventDetails .buttonWrapper a.register {
    background-color: var(--main-color-orange);
}

.eventDetails .buttonWrapper a.get-ce {
    background-color: var(--main-color-black);
}

span.alreadyRegistered {
    background-color: #cdcdcd;
	color:#333;
}

.eventDetails .buttonWrapper a.slideFiles {
    background-color: #9E3A98
}

#myEvents .eventDetails,
#otherEvents .eventDetails,
#event-detail .eventDetails{
	border-top:1px solid #ccc;
}

.eventDetails dl{
	display:grid;
	grid-template-columns:120px 1fr;
	gap: 20px;
}

.eventDetails dt
,.eventDetails dd{
	vertical-align:top;
}

.eventDetails dt{
	font-weight:bold;
	font-family: var(--main-font-family);
}

.eventDetails dd{
	font-family: var(--main-font-family);
	margin-left:0;
}

.eventDetails h1{
	margin-bottom:5px;
	padding-right:20px;
	position:relative;
}

.fa-chevron-down, .fa-chevron-up {
    color: var(--main-color-purple);
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
}

#event-detail .eventDetails{
	padding-top:15px;
}

#secondaryNav{
	position:absolute;
	right:0;
	top:10px;
}

#secondaryNav a
,#secondaryNav span{
	display:inline-block;
	margin-left:15px;
	color:#fff;
}

#otherEvents header li a.otherEvents
,#myEvents header li a.myEvents
,#myProfile header li a.myProfile{
	color:var(--main-color-orange);
}

#myProfile .orangeHead
,#newUser .orangeHead{
	height:40px;
	position:relative;
}

#myProfile .orangeHead:before
,#newUser .orangeHead:before{
	content:"\f2bd";
	font-family:"FontAwesome";
	position:absolute;
	right:0;
	top:0;
	font-size:100px;
	color:var(--main-color-purple);
	line-height:30%;
}

#otherEvents #contentContainer
,#event-detail #contentContainer{
	padding-top:40px;
}

/************ tooltip *****************/

.ttArrow {
  width: 50px;
  height: 16px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -32px;
  bottom: -16px;
}
.ttArrow.top {
  top: -16px;
  bottom: auto;
}
.ttArrow.left {
  left: 20%;
}
.ttArrow:after {
  content: "";
  position: absolute;
  left: 20px;
  top: -20px;
  width: 25px;
  height: 25px;
  box-shadow: 6px 5px 9px -9px black;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.ttArrow.top:after {
  bottom: -20px;
  top: auto;
}

.ui-tooltip{
	box-shadow: 0 0 7px rgba(0, 0, 0, 0.7) !important;
}

.ui-widget-shadow{
	opacity:1 !important;
}


/************ end tooltip *****************/

.hiddenSummary{
	display:none;
}

.chevron{
    color: var(--main-color-purple);
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
	font-family:"FontAwesome";
	font-weight:normal;
	font-style:normal;
}

.chevron:before{
	content:"\f078";
}

.expand .chevron:before{
	content:"\f077";
}

.expand .hiddenSummary{
	display:block;
}

.projectSections{
	margin-bottom:20px;
}

/************ sitewide notifications *****************/

.alertNotification{
	border-radius:4px;
	padding:10px 15px;
	margin:-10px auto 10px !important;
}

.errorMessage{
    background-color: #f2dede;
    border:1px solid #ebccd1;
    color: #a94442;
}

.successMessage{
	background-color:#dff0d8;
	border:1px solid #d6e9c6;
	color:#3c763d;
}

.infoMessage{
	background-color:#d9edf7;
	border:1px solid #bce8f1;
	color:#31708f;
}

.brightMessage{
	background-color:#E74318;
	border:none;
	color:#FFF;
}

#sitewideNotification{
	background-color:rgba(0,0,0,0.8);
	position:fixed;
	width:100%;
	height:100%;
	z-index:2000;
}

#sitewideNotification .modal{
	color:#fff;
	background-color:#F00;
	box-sizing:border-box;
	padding:40px;
	width:530px;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	font-size:16px;
	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.75);
	-ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.75);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.75);
}

#sitewideNotification .modal i{
	font-size: 50px;
}

#sitewideNotification_close{
	font-size:16px;
}

.emulateButton {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;

  text-decoration: none;
  color: initial;
	font-weight:normal;
	font-size:11px;

	padding:0 10px;
	cursor:pointer;
}

/************ reskinned 2021 *****************/

footer.reskinned_2021{
	background-color: #3c3e44;
	margin-top: 30px;
}

footer.reskinned_2021 .copyright{
	background-color: #303236;
	color:white;
	padding: 20px 0;
}

footer#footer.reskinned_2021 a{
	color:white;
	font-size: 12px;
}

/*********  cookies policy  ***********/

#cookies_policy{
	position: fixed;
	bottom:0;
	background-color: var(--main-color-orange); 
	padding:30px 0;
	color:white;
	z-index: 9999;
	width: 100%;;
	font-size: 16px;
	line-height: 160%;
}

#cookies_policy p a{
	color:white;
	text-decoration: underline;
}

.button{
    background-color: var(--main-color-purple);
    color: #ffffff;
    text-decoration: none;
    display:inline-block;
    padding: 10px 20px;
    border:none;
    font-size: 18px;
    cursor: pointer;
}

.button:hover{
	color:inherit;
}

.button.rounded{
    border-radius:8px;
}

.button.orange{
    background-color: var(--main-color-orange);
}


/********* ce form ***********/

.ce-user-info-wrapper{
	margin-bottom: 30px;
	background-color: #efefef;
	padding: 20px;
}

.ce-user-info-wrapper p{
	margin-top: 0;
}

.is-ce-wrapper{
	padding: 10px 0;
}

.is-ce{
	display:flex;
	gap: 10px;
	margin: 0;
}

.is-ce > *{
	align-self:center;
}