﻿BODY
{	font-family: Verdana, Arial;
	font-weight: normal;
	/*font-size:   11px;*/
	color:		 Black;
	margin:0px;
}

/*MODAL:START*/
#divModal
{

}
#divModalCloak
{
	display:none;
	width:100%;
	height:100%;
	position:absolute;
	top:0px;
	background:#000000;
	opacity:.5;
}
#divModalWrapper
{
	display:none;
	margin: auto auto;
	position:absolute;
	width:50%;
	top:100px;
	left:200px;
}
#divModalHeader
{
	background:#efefef;
	position:relative;
	border-radius:10px 10px 0px 0px;
	padding:10px;
	border-left:2px solid #000000;
	border-top:2px solid #000000;
	border-right:2px solid #000000;
	border-bottom: 1px solid #ccc;
	font-weight:bold;
	font-size:14pt;
}
#divModalBody
{
	background:#ffffff;
	position:relative;
	padding:5px;
	border-left:2px solid #000000;
	border-right:2px solid #000000;
	max-height:400px;
}
.modalTrackTypeLabel {
	position: fixed;
    background: #afadad;
    display: -webkit-inline-box;
    padding: 5px;
	margin: -9px 0px 0px -7px;
	color:#fff;
}
#divModalFooter
{ 
	background:#efefef;
	position:relative;
	border-radius:0px 0px 10px 10px;
	padding:10px;
	border-left:2px solid #000000;
	border-bottom:2px solid #000000;
	border-right:2px solid #000000;
}
#divModalCloserWrapper
{
	position:absolute;
	top:10px;
	right:10px;
	border-radius:12px 12px 12px 12px;
	background:#ffffff;
	border:1px solid #ccc;
	padding:3px;
	width:20px;
	text-align:center;
	cursor:pointer;
}
#divModalCloserWrapper a
{
	text-decoration:none;
	color:#000000;
	font-size:12pt;
}
.divTopWrapper{
	text-align:center;
}
#txtSrch {
	font-size:18px;
}
.divDiscussion {
	font-size:14px;
}
.divDiscussion a {
	background:#efefef;
	padding:5px;
	text-decoration:none;
	border:1px solid #ccc;
	margin:0px 0px 10px 0px;
}
.spanSongModalToolItem
{
	cursor:pointer;
	border-radius:5px;
	border:1px solid #ccc;
	background:#ffffff;
	padding:3px;
	margin:0px 5px 0px 0px;
	font-size:11px;
}
.spanSongModalToolItemActive
{
	cursor:pointer;
	border-radius:5px;

	background:#ccc;
	padding:3px;
	margin:0px 5px 0px 0px;
}
.spanSongModalToolItemFloatRight
{
	cursor:pointer;
	border-radius:5px;
	border:1px solid #ccc;
	background:#ffffff;
	padding:3px;
	float:right;
	margin-top:-5px;
}
#divModalBody
{
	height:400px;
	overflow:auto;
}
.lyricContainer {
	padding: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    text-align:left;
    margin:20px;
    min-height:400px;
    box-shadow: 0px 0px 14px rgb(0 0 0 / 33%);
}
#spanModalFooterHints
{
	width:100%;
	margin:0px 0px 0px 50px;
}
.spanSongModalToolItem input {
	border:1px solid red;
}
.pd-30{
	padding:30px;
}
.mg-t-30 {
	margin-top:30px;
}
.mg-r-30 {
	margin-right:30px;
}
.mg-b-30 {
	margin-bottom:30px;
}
.mg-l-10 {
	margin-left:10px;
}
.svgIcon {
	width:30px;
	color:#ccc;
}
@media screen and (max-width: 480px) {
	.pd-30 {
		padding:0px;
	}
	.mg-t-30 {
		margin-top:30px;
	}
	.mg-r-30 {
		margin-right:0px;
	}
	.mg-b-30 {
		margin-bottom:30px;
	}
	.mg-l-10 {
		margin-left:0px;
	}
}
.tx-8 {
	font-size:8px;
}
.tx-11 {
	font-size:11px;
}
.udr-ln {
	text-decoration: underline;
}
.cur-pt{
	cursor:pointer;
}
.w-20 {
	width:20px;
}
.clrB {
	clear:both;
}
.ft-12 {
	font-size:12px;
}
.ft-14 {
	font-size:14px;
}
.ft-16 {
	font-size:16px;
}
.ft-18 {
	font-size:18px;
}
.ft-20 {
	font-size:20px;
}
.ft-22 {
	font-size:22px;
}
.ft-24 {
	font-size:24px;
}
.ft-b {
	font-weight: bold;
}
.tx-red {
	color:red;
}
.tx-green {
	color:green;
}
.hide {
	display:none;
}
.show {
	dusplay:inline-block;
}
.dataRow
{
	background:#efefef;
}
/*MODAL:END*/

/*TEXT*/
.tx-10 {
	font-size:10px;
}
.tx-12 {
	font-size:12px;
}
.tx-center {
	text-align: center;
}
/*TEXT"END*/

/*USER MODAL:START*/
#divUserModalSkillsList
{
	overflow:auto;
	height:300px;
	background:#efefef;
	border:1px solid #ccc;
}
#divBtnSaveSkills
{
	width:100px;
	opacity:0;
}
.divPrincipleVisible
{
	opacity:1;
}
.divPrincipleHidden
{
	opacity:0;
}
#divUserModalTwasm
{
	background:#efefef;
	border:1px solid #ccc;
	padding:5px;
}
.clsHdrPlayerWrapper {
	position:absolute;
	float:left;
	width: -webkit-fill-available;
	display:unset;
}
.clsHdrPlayerControls {
	position:absolute;
	float:left;
	width:20%;
	margin: 4px 0px 0px 10px;
}
.clsHdrPlayerWave {
	/*position:absolute;*/
	float:right;
	width: calc(20vw);
	margin-left:35px;
}
.waveButtonInactive {
	display:none;
}
/*USER MODAL:END*/

/*PLAYER:START*/
#audioPlayerProgressBarWrapper
{
	width:400px;
}
.clsModalTrackItem {

	border:1px solid transparent;
	border-radius: 5px;
    margin: 10px;
    background:#efefef;
}
.clsModalTrackItemActive {

	border:1px solid green;
	border-radius: 5px;
    margin: 10px;
    background:transparent;
}
#audioPlayerProgressBar
{

	border:1px solid #cccccc;
	width:400px;
	height:20px;
}

#audioPlayerProgressBarCurrent
{
	position:relative;
	float:left;
	height:20px;
	background:#cccccc;
	
}
#audioPlayerProgressBarClickers
{
	position:absolute;
	float:left;
}
.divProgressBarClickable
{
	width:1%;
	height:20px;
	background:transparent;
	float:left;
	cursor:pointer;
	
}
.playerButton
{
	background:#ccc;
	padding:5px;
	
}
.playerClock
{
	background:transparent;
	padding:5px;
	font-size:10pt;
}
#spanAudioClock {
	position:absolute;
	width:85%;
	text-align:center;
}
.trackGlobalPlayer {
	margin: -6px 0px 0px -18px;
	clip-path: polygon(24.33% 18.52%, 75.02% 18.52%, 100% 19%, 100% 80%, 78.01% 80.95%, 26.29% 80.95%, 0% 80%, 0px 20%);
}
#audioPlayerTrackName
{
	margin:0px 0px 0px 0px;
}
#audioPlayerTrackName select
{
	font-size:18pt;
}
#audioPlayerSongTitle
{
	font-size:14pt;
}
#audioPlayerFileDesc
{
	font-size:14pt;
}
#audioPlayerSource
{
	
}
#audioPlayerDownloadFile
{
	cursor:pointer;
	background:#cccccc;
	padding:10px;
	text-align:center;
	width:200px;
	margin:0px 0px 0px 0px;
	border:1px solid #cccccc;
	border-radius:5px;
	position:relative;
}

audio
{/*
-webkit-transition:all 0.5s linear;
-moz-transition:all 0.5s linear;
-o-transition:all 0.5s linear;
transition:all 0.5s linear;
-moz-box-shadow: 2px 2px 4px 0px #006773;
-webkit-box-shadow:  2px 2px 4px 0px #006773;
box-shadow: 2px 2px 4px 0px #006773;
-moz-border-radius:7px 7px 7px 7px ;
-webkit-border-radius:7px 7px 7px 7px ;
border-radius:7px 7px 7px 7px ;
*/
	margin:0px 0px 0px 20px;
	border:1px solid transparent;
	background:#efefef;
}
@-webkit-keyframes blinker {
  from { border: 1px solid red; }
  to { border: 1px solid transparent; }
}

.waitingForConnection {
  -webkit-animation-name: blinker;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: cubic-bezier(.5, 0, 1, 1);
  -webkit-animation-duration: 3s;
}
#hdPlayer {

}
.playerTrackNameContainer {
	clear: both;
    float: right;
    /*width: 100%;*/
    position: relative;
    z-index:1;
    display:none;
}
.playerTrackName {
    text-align: center;
    font-size: 10px;
    margin-top: -18px;
    color:grey;
    /*width: 50%;
    float: right;*/
}
/*PLAYER:END*/

/*ALBUM MODAL:START*/
.clsTextBoxDisplay
{
	font-size:14pt;
	width:40%;
}
.iconSmall
{
	width:20px;
	cursor:pointer;
}
.iconSmaller
{
	width:10px;
	cursor:pointer;
}
.spanAlbumTrackSongTitle
{
	font-size:14pt;
}
#divBandDropDown
{
	display:none;
}
#divBandDropSong
{
	display:none;
}
.error
{
	padding:5px;
	color:red;
}
.clsAlbumGraphicsCol
{
	height:375px;
	overflow:auto;
	position:relative;
	float:left;
	width:100%;
}
.clsAlbumTileTitle {
	cursor:pointer;
	text-decoration:underline;
	padding:10px;
	border-radius:5px;
	text-align: center;
	font-size:22px;
}
#spanAlbumModalFooterItem2
{
	display:none;
}
#divAlbumGraphicsCol1
{

}
.clsFileUploadWrapper
{
	width:250px;
	white-space: nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.clsFlLeftGraphicStage
{
	float:left;
}
.clsFlRightGraphicDelete
{
	float:right;
	margin:0px 0px 5px 0px;
	border:1px solid #ccc;
	padding:3px;
	border-radius:5px;
	background:#efefef;
	color:#cccccc;
}
.clsFlRightGraphicDelete a
{
	font-size:10pt;
	text-decoration:none;
}
.divTempMessage
{	
	display:none;
}
#divRemoveGraphicConfirm
{
	/*display:none;*/
	position:relative;
	overflow:hidden;
	height:0px;
}
#divAlbumLargeImage
{
	text-align:center;
	width:100%;
}
#divAlbumLargeImage img
{
	width:100%;
}
.trackVersionLinkActive {
	font-weight:bold;
	background:#ccc;
	padding:5px;
	margin:0px 5px 5px 0px;
}
.trackVersionLink {
	cursor:pointer;
	background:transparent;
	padding:5px;
	margin:0px 5px 5px 0px;
}
.trackVersionLinkIsDefault {
	padding:5px;
	margin:0px 5px 5px 0px;
	border:1px solid green;
}
.clsGraphicsThumbWrapper
{
	float:left;
	height:60px;
	margin:10px;
	background:#efefef;
	cursor:pointer;
}
.clsGraphicsThumbWrapperDefault
{
	float:left;
	height:60px;
	margin:10px;
	background:lightgreen;
	cursor:pointer;
}
.clsGraphicsThumb
{
	cursor:pointer;
	float:left;
	
}
/*ALBUM MODAL:END*/

#divPageWrapper
{
	/*position:absolute;
	float:left;*/
	width:100%;
}
#divHeaderWrapper
{
	float:left;
	width:-webkit-fill-available;
	background:#efefef;
	top:0px;
	padding:10px;
	border-bottom:1px solid #cccccc;
	margin:0px;
	position:fixed;
	z-index:1;
}
#panelResetPassword {
	margin:inherit;
}
#pageContent {
	height:100%;
	margin:20px auto;
}
#divFooterWrapper {
	position: relative;
	left: 0;
	bottom: 0;
	padding:10px;
	width:100%;
	background-color: #ccc;
	color: #000;
}

#divFooterWrapper p {
	text-align:center;
}

@media screen and (min-width: 480px) {
  #divFooterWrapper {
    /*position: fixed;*/
  }
  #pageContent {
	/*height: 100%;*/
  }
}
#divHeaderTitle
{
	position:relative;
	float:left;
}

#divHeaderTitle .title
{
	font-size:15pt;
}

#divHeaderButtons
{
	float:right;
	text-align:left;
	margin: 2px 0px 2px 0px;
}
.btnHeaderButton
{
	border:2px solid #cccccc;
	border-radius:5px;
	cursor:pointer;
	font-size:14px;
	padding:5px;
}
.btnHeaderButton:hover
{
	background:#cccccc;
	font-style:none;
	
}
.btnHeaderButtonActive {
	background:#fff;
	border:2px solid #cccccc;
	border-radius:5px;
	cursor:pointer;
	font-size:14px;
	padding:5px;
}
.divContentWrapper
{
	position:relative;
	margin:5px 5px 5px 3px;
	top:60px;
	
}
.divLoginWrapper {
	position:absolute;
	width:100%;
	min-width:320px;
}
.divLoginWrapper table {
	/*width:100%;*/
	margin:auto;
	min-width: 300px;
}
#albumLink
{
	float:right;
}
#albumLink a
{
	font-size:10pt;
}
/*
.divGarageBackground
{
	position:absolute;
	background:url(../../resources/images/garageBand.jpg) no-repeat center;
	height:100%;
	width:100%;
	opacity:.1;
}
.divStageBackground
{
	position:absolute;
	background:url(../../resources/images/stage.jpg) no-repeat center;
	height:100%;
	width:100%;
	opacity:.5;
}
*/
.heading1
{
	font-size:14pt;
	float:left;
}
.error
{
	color:red;
}
#spanTrackName {
	font-size:14pt;
}
.spanAddNew
{
	position:absolute;
	right:15px;
}
.spanAddNew a
{
	font-size:12pt;
}
.spanAddNewSmall
{
	margin-right:5px;
}
.spanAddNewSmall a
{
	font-size:10pt;
}
input,a
{
	font-size:14pt;
}
 select 
 {
 	font-size:12pt;
 }
.trackLink a
{
	font-size:14pt;
	text-decoration:none;
	color:blue;
}
.trackDesc
{
	font-size:14pt;
	text-decoration:italic;
} 
.trackIconWrapper {
	text-align:right;
}
.trackIconWrapper a {
	margin:5px 5px 0px 0px;

	padding:5px;
}
.trackIconWrapperActive{
	background:#ccc;
	color:#000;
}
.trackIconWrapperActive a{

	color:#000;
}
a span.wavIconText {
	font-size:10px;
	padding-bottom:5px;
}

#divModalFooter select, input
{
	font-size:10pt;
}
.fRight
{
	float:right;
}
.fRightMarginRight
{
	position:absolute;
	right:40px;
	font-weight:normal;
}
.clsListWrapper
{
	height:calc(100vh - 100px);
	overflow:auto;
	width:100%;
}
.hardTrackLink {
	font-size:12px;
}
.zipMenuItem {
	font-size:14px;
	padding:5px;
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	border-bottom:1px solid transparent;
	margin-right:5px;
	cursor:pointer;
}
.zipMenuItemActive {
	background:#efefef;
}
#divZipList
{
	font-size:14px;
	height:250px;
	overflow:auto;
	width:100%;
	margin:4px 20px 0px 0px;
	background:#efefef;
	padding:5px;
	border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
.divZipListItem {
	padding:5px;
}
.zipChk {
	margin:10px 10px 10px 0px;
}
.zipContent {
	margin-left:20px;
}
.zipInstructions li{
	margin:0px 0px 20px 0px;
	
}
#zipProgress {
	display:none;
}
#zipProgress img{
	width:20px;
}

.icon
{
	width:30px;
	opacity:.5;
}
.colorRed
{
	color:red;
}
.colorGreen
{
	color:green;
}
.garageMenuButton
{	float:left;
	text-decoration:none;
	border:2px solid #cccccc;
	border-radius:5px;
	background:#efefef;
	color:#000000;
	padding:5px;
	margin:0px 0px 0px 0px;
	width:150px;
}
.garageMenuButton:hover
{
	background:#cccccc;
}

.addNewButton
{
	text-decoration:none;
	border:2px solid #cccccc;
	border-radius:5px;
	background:#efefef;
	color:#000000;
	padding:3px;
}
.addNewButtonSmall
{
	text-decoration:none;
	border:2px solid #cccccc;
	border-radius:5px;
	background:#efefef;
	color:#000000;
	padding:3px;
}
.divZipConfirm
{
	padding:10px;
	font-size:14pt;
}
.spanLabelMedium
{
	font-size:12pt;
}
.ctrlListLink
{
	padding:5px;
	background:#ffffff;
	width:100%;
	float:left;
	text-decoration:none;
}
.ctrlListLink:hover
{
	background:#efefef;
}
#formWrapper
{
	margin:0px 0px 0px 10px;
}
.searchButton
{
}
.twasm
{
	font-size:8pt;
	right:10px;
	bottom:10px;
	opacity:0;
	background:#efefef;
	padding:5px;
	border:1px solid #ccc;
	border-radius:5px;
	position:fixed;
}
.clsBigAsHell
{
	font-size:24pt;
}
/*TATOR:START*/
.tatorContainer {
	width:99%;
	float:left;
	position:absolute;
	max-height:300px;
}
.tatorTopAreaContainer {
	display:flow-root;
	background:#ffffff;
	margin:10px;
}
.tatorLyricContainer, .tatorLyricContainerTextArea {
	clear:both;
	font-size:12px;
	font-weight:normal;
	padding:10px;
	width: -webkit-fill-available;
	position: absolute;
    text-align:center;
}
.tatorLyricContainer pre {
	padding: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    text-align:left;
    margin:auto;
    box-shadow: 0px 0px 14px rgb(0 0 0 / 33%);
}
.tatorLyricLinkContainer {
	clear:both;
	text-align:right;
	padding:10px;
	background:#efefef;
	width:100%
}
.tatorDiscussionCheckbox, .tatorDiscussionCheckboxText {
	font-size:14px;
	float:left;
	font-weight:normal;
}
#tatorWav {
	/*display:none;*/
}
#tatorAudioTypeToggler{
	/*display:none;*/
	margin-right:20px;
	font-size:14px;
}
.tatorAudioTypeToggler a{
	margin:20px;
	color:#000;
}
.tatorNotesLink {
	font-size:12px;
	margin: 0px 10px 0px 0px;
	cursor:pointer;
}
.tatorLyricLink {
	font-size:12px;
	margin: 0px 10px 0px 0px;
	cursor:pointer;
}
.tatorSliderContainer {
	position:relative;
}
.tatorBar {
	width:100%;
}
#tatorSlider {
	display:none;
}
.tatorSlider {
	width:-webkit-fill-available;
}
.tatorTimelineContainer {
	position:relative;
	margin:0px 0px 10px 3px;
}
.tatorTimelineItem {
	position:absolute;
	float:left;
	font-size:12px;
}
.tatorPlay {
	background-image: url(/resources/images/audioControlsPlay.png);
	background-repeat:no-repeat;
	background-size:cover;
}
.tatorPause {
	background-image: url(/resources/images/audioControlsPause.png);
	background-repeat:no-repeat;
	background-size:cover;
}
.tatorButton {
	width:20px;
	height:20px;
	padding:5px;
	margin:0px 5px 0px 0px;
	border:1px solid transparent;
	cursor:pointer;
	float:left;
}

.tatorClock {
	font-size:19px;
	min-width:100px;
	padding:5px;
	border:1px solid transparent;
}
.tatorZoomSliderContainer {
	margin-top: -36px;
    position: absolute;
    margin-left: 100%;
    margin-right: 100%;
    width: 300px;
    height: 0px;
}
.tatorClockContainer {
	float:right;
	margin:10px;
}
.tatorPlayPauseContainer{
	position:absolute;
	float:left;
	margin: 5px 10px 10px 10px;
}
.tatorFormContainer{
	background:#efefef;
	padding:10px;
	clear:both;
}
.tatorPositionHint{
	font-size:12px;
}
.tatorTextArea{
	width:99%;
	height:100px;
}
.tatorSave {
	margin:5px 0px 0px 0px;
}
.tatorCancel {
	margin:5px 0px 0px 0px;
}
.tatorFormButtonsContainer {
	text-align:right;
}
.tatorAnnotationsListContainer {
	clear:both;
	margin:0px 5px 0px 5px;
	font-size:16px;
	height:200px;
}
.annotationItem {
	background: #efefef;
    padding: 10px;
    margin: 0px 5px 10px 5px;
    border:1px solid #ccc;
    border-radius: 5px;
}
.annotationItemActive {
	background: transparent;
	border:1px solid green;
}
.tatorLink {
	float:right;
	margin:0px 10px 0px 0px;
}
.tatorLink a {
	background:#efefef;
	padding:5px;
}
#tatorUrl {
	position: absolute;
    left: 0px;
    padding: 5px;
    font-size:12px;
    font-weight:normal;
    width: 50%;
    text-align: left;
}
.tatorShow {
	display:block;
}
.tatorHide {
	display:none;
}
.tatorVisible {
	visibility:visible;
}
.tatorHiddden {
	visibility:hidden;
}
.tatorActive {
	background:#ccc;
	padding:10px;
}
.tatorIdle {
	background:transparent;
	padding:10px;
}
/*TATOR:END*/
#divBandBio
{
clear:both;
padding:5px;
font-size:14pt;
}
#divBandLocation
{
clear:both;
padding:5px;
font-size:14pt;
}
#divBandMembers
{
clear:both;
padding:5px;
font-size:10pt;
}
#divBandMembers a
{
font-size:10pt;
}
#divBandPhoto
{
	float:left;
}
#divBandPhotoUpload
{
	float:left;
}
#txtAreaBandBio
{
	width:95%;
	height:75%;
}
.spanBandModalToolItem
{
	cursor:pointer;
	border-radius:5px;
	border:1px solid #ccc;
	background:#ffffff;
	padding:3px;
	margin:0px 5px 0px 0px;
}
.actionMessageSuccessSmall
{
	font-size:12pt;
	color:#006600;
}
.actionMessageSuccess
{
	color:#006600;
}
.actionMessageFailure
{
	color:red;
}
#divAlbumCreditCopyRightBlock
{
	display:none;
}
.clsGrayPad5
{
	background:#efefef;
	padding:15px;
	border:1px solid #ccc;
}
#divPassword1
{
	display:block;
}
#divPassword2
{
	display:none;
}
#divNewPassCartoon
{
	display:none;
}
.clsSmallLink
{
	font-size:10pt;
}
.clsCartoon
{
	width:50px;
	height:50px;
}
audio::-moz-media-controls-panel {background:red;}

audio::-webkit-media-controls-mute-button {}

audio::-webkit-media-controls-play-button {}

audio::-webkit-media-controls-timeline-container {}

audio::-webkit-media-controls-current-time-display {}

audio::-webkit-media-controls-time-remaining-display {}

audio::-webkit-media-controls-timeline {}

audio::-webkit-media-controls-volume-slider-container {}

audio::-webkit-media-controls-volume-slider {}

audio::-webkit-media-controls-seek-back-button {}

audio::-webkit-media-controls-seek-forward-button {}

audio::-webkit-media-controls-fullscreen-button {}

audio::-webkit-media-controls-rewind-button {}

audio::-webkit-media-controls-return-to-realtime-button {}

audio::-webkit-media-controls-toggle-closed-captions-button {}
/*native audio player:start*/

/*native audio player:end*/

/*slider:start*/
input[type=range] {
  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
  width: 100%; /* Specific width is required for Firefox. */
  background: transparent; /* Otherwise white in Chrome */
}

input[type=range]:focus {
  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;

  /* Hides the slider so custom styles can be added */
  background: transparent; 
  border-color: transparent;
  color: transparent;
}

input[type=range] {
  -webkit-appearance: none;
  margin: 52px 0;
  width: 100%;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 5.4px;
  cursor: pointer;
  /*box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
  background: #ccc;
  border-radius: 1.3px;
 /* border: 0.2px solid #010101;*/
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: transparent;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -17px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #efefef;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  /*box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
  background: #ccc;
  border-radius: 1.3px;
  /*border: 0.2px solid #010101;*/
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: transparent;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #efefef;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #efefef;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #efefef;
}
input[type=range]:focus::-ms-fill-upper {
  background: #efefef;
}
/*slider"end*/

/*payment start*/
.paymentFormWrapper {
	background:#efefef;
	margin:0px 5px 5px 5px;
	padding:5px;
	border-radius:5px;
	border:1px solid #ccc;
}
@media screen and (max-width: 480px) {
	.paymentFormWrapper {
	margin:0px;
	}
}
.paymentsTxtBox, .securityTxtBox {
	width:100%;
	margin:0px 0px 10px 0px;
	padding:5px;
	border:1px solid #d9d9d9;
	border-radius:5px;
}
#paymentFormAmountWrapper {
	width:100%;
	text-align:center;
}
.paymentsTxtBoxAmount {
	margin:0px 0px 10px 0px;
	padding:5px;
	border:1px solid #d9d9d9;
	border-radius:5px;
	text-align:right
}
.invalidBorder{
	border:1px solid red;
}
#card-button {
	background:#ccc;
	border:1px solid green;
	margin-right:20px;
}
.hidden {
	visibility:hidden;
}
/*payment end*/

.tox-promotion, .tox-statusbar__branding {
	display:none;
}
.tb-comm {
	padding:5px;
	font-size:18px;
}
.commLink {
	padding:5px;
	border:1px solid #ccc;
	text-decoration:none;
	margin:0px 5px 0px 0px;
}
.commLinkActive {
	padding:5px;
	border:1px solid #ccc;
	background:#efefef;
	text-decoration:none;
	margin:0px 5px 0px 0px;
}
.fl-right {
	float:right;
}
.divCommPreviewWrapper {
	display: flex;
    justify-content: center;
}
.divCommPreviewContainer {
    background: #efefef;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    position: absolute;
    width: 50%;
}
.activate {
	background:green;
	color:#fff;
}
.deactivate {
	background:red;
	color:#fff;
}
.labelInvalid {
	color:red;
}
.labelValid {
	color:green;
}