body {
	background-color: var(--background-gradient-bottom);
	overflow:hidden;
}

a, a:link, a:visited, a:hover {
    color: var(--primary-font-color);
    text-decoration:underline;
    cursor:pointer;
}

input,input[type=text], input[type=password] {
    font-size:var(--input-font-size);
}

input[type=button], input[type=submit] {
    font-size:var(--button-font-size);
}
.dropdown-menu {
	background-image: linear-gradient(var(--dropdownmenu-background-gradient-top), var(--dropdownmenu-background-gradient-bottom));
	color: var(--dropdownmenu-font-color);
	opacity:var(--dropdownmenu-opacity);
	border-color:var(--dropdownmenu-border-color);
	padding-top:1px;
	padding-bottom:1px;
}

.dropdown-item {
	border-bottom:1px solid var(--dropdownmenu-border-color);
	text-decoration:none;
}

.dropdown-item:last-child {
	border-bottom:none;
}


.dropdown-item a, .dropdown-item a:visited, .dropdown-item a:hover {
	color: var(--dropdownmenu-font-color);
}

.dropdown-item.active, .dropdown-item:active {
    color: var(--dropdownitem-active-color);
    text-decoration: none;
    background-color: var(--dropdownitem-active-background);
}

.dropdown-item:focus, .dropdown-item:hover {
    color: var(--dropdownitem-focus-color);
    text-decoration: none;
    background-color: var(--dropdownitem-focus-background);
}

.bodycontainer {
	margin-left: auto;
    margin-right: auto;
	width:100%;
	max-width:var(--container-max-width);
	margin:0px;
	border:var(--body-container-border) solid var(--background-border);
	background-image: linear-gradient(var(--background-gradient-top), var(--background-gradient-bottom));
	color:var(--primary-font-color);
	border-radius: 5px;
    padding: 3px;
}

.bodycontainer h2 {
	font-size: var(--topic-font-size);
	color: var(--header-font-color);
	font-weight:var(--primary-font-weight);
	margin-bottom:0px;
}

.bodycontainer h3 {
	font-size: var(--subhead-font-size);
	color: var(--header-font-color);
	font-weight:var(--primary-font-weight);
	margin-top:5px;
	margin-bottom:0px;
}

.bodycontainer h5 {
	font-size: var(--subtopic-font-size);
}

.content-area {
	padding:0px;
	position:relative;
}

.inset {
	linear-gradient(var(--inset-gradient-top), var(--inset-gradient-bottom));
}

.bevel {
	border-top: var(--bevel-height) solid var(--bevel-top-color);
	border-bottom: var(--bevel-height) solid var(--bevel-bottom-color);
}
.bevel-top {
	border-top: var(--bevel-height) solid var(--bevel-top-color);
}

.bevel-bottom {
	border-bottom: var(--bevel-height) solid var(--bevel-bottom-color);
}

.client-banner {
	padding: 3px 5px 3px 5px;
}

.topic-row {
	position:relative;
	margin-left:var(--topic-row-left-margin);
	padding: var(--topic-row-padding) var(--topic-row-padding) var(--topic-row-padding) 0px;
	display:flex; 
	flex-direction:row;
}


.indent-row {
	margin-left:var(--topic-row-left-margin);
	padding: var(--topic-row-padding) var(--topic-row-padding) var(--topic-row-padding) 0px;
}

.full-width-row {
	padding: var(--topic-row-padding) var(--topic-row-padding) var(--topic-row-padding) var(--topic-row-padding);
}

.separator {
	border-top: var(--separator-border-height) solid var(--separator-color);
}

.section-header {
	border-top: var(--separator-border-height) solid var(--separator-color);
	position:relative;
	margin-left:var(--topic-row-left-margin);
	padding: 8px 8px 8px 0px;
}

.round {
	border-radius:50%;
}

.rectangle {
	border-radius:var(--rectangle-border-radius);
}

.round-bezel {
	width:var(--bezel-size); height:var(--bezel-size);
}

.blue-control-base {
	background-image: linear-gradient(var(--blue-control-top), var(--blue-control-bottom));
}


.orange-control-base {
	background-image: linear-gradient(var(--orange-control-top), var(--orange-control-bottom));
}

.fixed-bezel-size {
	flex: 0 0 var(--bezel-size);
}

.bezel-base {
	background-image: linear-gradient(var(--inset-gradient-top), var(--inset-gradient-bottom));
	border: 1px solid var(--bezel-border-color);
}

.topic-text {
	font-size:var(--topic-font-size);
	font-weight:var(--primary-font-weight);
	margin-bottom:0px;
	margin-top:calc(var(--bezel-size)/2 - var(--topic-font-size)* 0.8);
	line-height:1.2;
}

#EventSponsor {
	color:var(--sponsor-font-color);
	font-weight:400;
	font-size:var(--sponsor-font-size);
}

#EventTitle {
	color:var(--event-title-color);
	font-weight:400;
	font-size:var(--event-font-size);
	margin-bottom:8px;
}

#SponsorLogo {
	height: var(--sponsor-logo-height);
}

.topic-title {
	flex-grow:5;
	margin-left:8px;
	margin-right:8px;
}

.topic-vote {
	flex-grow:1;
	text-align:right;
}

#IntensitySlider .ui-slider {
    margin-top: 20px;
    height: 7px;
    position: relative;
    border: none;
    background: var(--blue-control-bottom);
}

#IntensitySlider .ui-state-default, #IntensitySlider .ui-widget-content .ui-state-default, #IntensitySlider .ui-widget-header .ui-state-default {
    border-radius: calc(var(--intensity-control-size)/2);
    outline: none;
    position: absolute;
    height:var(--intensity-control-size);
    width:var(--intensity-control-size);
    border: 1px solid var(--blue-control-bottom);
}

#IntensitySlider .ui-state-active,
#IntensitySlider .ui-widget-content .ui-state-active,
#IntensitySlider .ui-widget-header .ui-state-active,
#IntensitySlider a.ui-button:active,
#IntensitySlider .ui-button:active,
#IntensitySlider .ui-button.ui-state-active:hover {
	border: 1px solid var(--blue-control-bottom);
	background: var(--blue-control-bottom);
	font-weight: normal;
	color: #ffffff;
}


#IntensitySlider .ui-slider-horizontal .ui-slider-range {
    background: #e9ecf1;
}


#IntensitySlider {
	position:absolute; 
	width:calc(100% - var(--bezel-width)*2);
    background-image: linear-gradient(var(--blue-control-top), var(--blue-control-bottom));
	height:var(--intensity-slider-height);
	top:4px;
	left:5px;
	border-radius:var(--rectangle-border-radius);
	border:none;
}

#IntensitySliderBevel {
	height: calc(var(--intensity-slider-height) + var(--bezel-width)*2);
}

.chartcontent {
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid var(--primary-font-color);
}

#IntensityStart, #IntensityEnd {
	color:var(--primary-font-color);
	font-size: var(--subhead-font-size);
}

.chat-delete-image {
	/*
	border-top: 2px solid var(--bevel-bottom-color);
    border-bottom: 2px solid var(--bevel-top-color);
    border-left: 2px solid var(--bevel-side-color);
    border-right: 2px solid var(--bevel-side-color);
    */
    width:var(--chat-delete-image-size);
}

#FavoriteContainer {
	max-height: calc( (var(--bezel-size) + 2*var(--topic-row-padding) + 2*var(--bevel-height)) *3);
	overflow-x:hidden;
	overflow-y:auto;
}

#NewChatDiv {
	min-height:225px;
	max-height:35vh;
	overflow-x:hidden;
	overflow-y:auto;
}

#NewChatDetail p {
	font-size:var(--paragraph-font-size);
}

#IntensitySliderHolder {
	padding: calc(var(--topic-row-padding)/2) var(--topic-row-padding) calc(var(--topic-row-padding)/2) 0px;
}

.chartcontent {
    background-color: transparent;
}

#OfferAcceptedContainer {
	background-image: linear-gradient(var(--offer-background-gradient-top), var(--offer-background-gradient-bottom));
	color:var(--primary-font-color);
	border: 1px solid var(--primary-font-color);
}

#OfferAcceptedContainer p, #OfferAcceptedContainer input, #OfferAcceptedContainer button {
	font-size: var(--offer-font-size);
}


.modal-content {
	background-image: linear-gradient(var(--modal-background-gradient-top), var(--modal-background-gradient-bottom));
	color:var(--primary-font-color);
	border: 1px solid var(--primary-font-color);
}

.modal-title {
	font-size:var(--topic-font-size);
}

.modal-body p, .modal-body input, .modal-body button {
	font-size: var(--paragraph-font-size);
}

.modal-dialog {
}

.topic-menu-icon {
	margin-top: var(--topic-menu-top-margin);
	font-size: var(--topic-menu-font-size);
}

.topic-score {
	font-size:var(--topic-font-size);
	font-weight:var(--primary-font-weight);
	margin-bottom:0px;
	margin-top:calc(var(--bezel-size)/2 - var(--topic-font-size)* 0.8 - var(--topic-menu-font-size) + 2px);
	line-height:1.2;
	
}

.topic-menu {
	z-index:2000;
	padding:0px 0px 2px 0px; 
	border:1px solid #009ddc; 
	display:none;
	position:absolute;
	top:10px;left:30px;
	background-color:#fff;
	color:#000;
}

.spaced-text {
	line-height:1.5;
}

/* Popover */
.popover {
  border: 1px solid var(--popover-border-color);
  background-image: linear-gradient(var(--popover-background-gradient-top), var(--popover-background-gradient-bottom));
  color:var(--popover-font-color);
}

.popover-content {
  color:var(--popover-font-color);
  font-size:var(--popover-content-font-size);
}

.popover-hint {
  color:var(--popover-font-color);
  font-size:var(--popover-content-hint-font-size);
}

/* Popover Header */
.popover-title {
}

.popover-body {
    color: var(--popover-font-color);
    box-shadow: var(--box-shadow-x) var(--box-shadow-y) var(--box-shadow-blur) var(--box-shadow-spread) var(--boxshadow-color);
}


/* Popover Arrow 
.arrow {
  border-right-color: red !important;
}
*/

.video-welcome {
	
}

.video-welcome h3 {
	font-size:20px;
	margin-top: 40px;
	margin-bottom: 15px;
}

.login-header h2 {
	font-size:20px;
}



/* CSS scrolling text from https://www.html.am/html-codes/marquees/css-scrolling-text.cfm */


.scroll-left-container {
 overflow: hidden;
 position: relative;
 }

.scroll-left-container p {
 position: absolute;
 height: 100%;
 margin: 0;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);
 /* Apply animation to this element */	
 -moz-animation: animation-scroll-left 18s linear 1;
 -webkit-animation: animation-scroll-left 18s linear 1;
 animation: animation-scroll-left 18s linear 1;
}

/* Move it (define the animation) */
@-moz-keyframes animation-scroll-left {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}

@-webkit-keyframes animation-scroll-left {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}

@keyframes animation-scroll-left {
 0%   { 
 -moz-transform: translateX(100%); /* Browser bug fix */
 -webkit-transform: translateX(100%); /* Browser bug fix */
 transform: translateX(100%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); /* Browser bug fix */
 -webkit-transform: translateX(-100%); /* Browser bug fix */
 transform: translateX(-100%); 
 }
}


/* end scrolling text */

.shareicon {
	margin-right:5px;
	font-size:32px;
}

.container-embed {
	width: 100%;
    max-width: none;
}

/* override bootstrap form stuff */

.col-form-label {
	padding-top:0px;
	line-height:1;
	font-size:var(--paragraph-font-size);
}

.error {
	color:var(--primary-font-color);
}


#ScrollingCaption {
	width:100%; 
	height:3px;
}


.topic-hamburger-button {
	flex: 0 0 15px;
	margin-top:-1px;
}


#FullTopicList {
	max-height:120px;
	overflow-y:auto;
	box-shadow: var(--box-shadow-x) var(--box-shadow-y) var(--box-shadow-blur) var(--box-shadow-spread) var(--boxshadow-color);	
}

.alltopicsbuttoncontainer {
	padding-top: 0px;
	padding-bottom: 0px;
	font-size:var(--button-font-size);	
	vertical-align:top;
}


.largeh2 {
	font-size:36px;
}

.section-head h2 {
 	font-size:36px;
}

.section-head .bigh2, .bodycontainer h2 .bigh2 {
	font-size: 60px;
    font-weight: 300;
    color: #009ddc;
    padding-top:20px;
    text-align: left;
}

#ClientBanner {
	margin-bottom:15px;
	border-radius:5px;
}

/*
 website styles for use in the onramp
*/
.section-head .boldh2, .boldh2 {
	font-size: 60px;
    font-weight: 600;
    color: #f47321;
    padding-top:20px;
    text-align: left;
}

#EventDescription {
    font-size: 16px;
    line-height: 1.6;
}

#PlayerContent {
	padding-right:20px;
}

.chatdiv-embedded {
	/*
	 box-shadow: var(--box-shadow-x) var(--box-shadow-y) var(--box-shadow-blur) var(--box-shadow-spread) var(--boxshadow-color);
	*/
	 max-height:none;
	 border:var(--body-container-border) solid var(--chat-embed-border-color);
	 border-radius:5px;
	 padding:10px;
}