.container {
	    padding: 0 1em;
}
 h1 {
	font-size: 1.75em;
}

.filters #mainOptions  a {
    color: #ffc112;
	padding: 0 0.1em;
}

.filters #mainOptions a.selected {
    color: white;
	font-size:1.2em;
	padding: 0;
}
/* .filters #mainOptions .clipFilter a:hover { */
		/* color: orange; */

/* } */
.filters #mainOptions  .invBu {
	font-size:1.1em;
	font-weight: 100;
}
	
.filters #mainOptions  .invBu.selected {
    color: white;
	font-size:1.2em;
	font-weight: bold;
}

.xdsoft_timepicker   {
	display: none !important;
}
#topBar {
    /* margin-right: 4em; */
}
.xdsoft_datetimepicker .xdsoft_label>.xdsoft_select {
	z-index:9999999;
}
.xdsoft_datetimepicker .xdsoft_month {
	text-align:center;
}
.pickerCtrls {
		text-align: right;

}
.nameBar {
	background: linear-gradient(0deg, rgba(25,25,25,0) 0%, rgba(25,25,25,0.05) 3%, rgba(25,25,25,0.2) 11%, rgba(25,25,25,0.45) 28%, rgba(25,25,25,1) 100%);
}
.pickerClose {
	margin-top:3px;
}
.pickerGo {
	display: none;
}
.container {
	    margin: 2em 2em;
			    /* box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
    background: linear-gradient(0deg, rgb(36 49 62 / 0%) 0%, rgba(44,62,77,1) 32%, rgb(51 72 91) 100%);
	    margin: 1.25em 1em;
		    margin: 0;
}
#topBar > h1 {
    flex: 2 2;
    color: white;
    margin: 0.5em 1em;
    text-align: center;
}

#emptyClipMessage {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    font-size: 3em;
    text-aligN: center;
    flex-direction: column;
    color: grey;
}

#hideTamperNag {
	flex: 0 0  2em;	
}
#installTamperScript {
	flex: 2 2;
}
#installTamperScript, #hideTamperNag {
	display: block;
}
.hasRootClipsButtonNotification {
	text-align:right;
	display: none;
	align-items: center;
	flex: 1 1; 
	padding: 3px;
	text-align: center;
	background-color: #374c5d;
    border-radius: 5px;
}



#clipsCtrls > a  * {
	margin-bottom: 3px;
}
 #clipSearchMode  > div:last-of-type{
		display: flex;
    justify-content: space-between;
	align-items:center;
}




 .rangeSelector .disabled{
	color: grey;
	pointer-events:none;
}
 #rangeCtrls.inner > div.disabled {

}

 #topBar{ 
    display: flex;
align-items: flex-start;}
 h1{ 
	display:inline-block;
	
}

 #rangeCtrls.inner> div {
	display: inline-block;

}

 /* .filters[data-mode='all'] #clipFromDate, */
 /* .filters[data-mode='recent'] #clipFromDate  */
 /* { */
	 /* display:none; */
 /* } */

 /* .filters[data-sort='top'] .topOption,   .filters[data-sort='new'] .recentOption , .filters .selected,  */
 /* .filters[data-mode='all'] a[data-mode='all'], */
 /* .filters[data-mode='recent'] a[data-mode='recent'], */
 /* .filters[data-mode='from'] a[data-mode='from'] */
 /* { */

    /* border: 1px solid #ffc112; */
    /* box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 1);		 */
/* } */
 .filters[data-sort='top'] .topOption,   .filters[data-sort='new'] .recentOption , .filters .selected:not(.jumpToDate) {

    pointer-events: none;
}

 /* .filters[data-sort='top'] .recentOption:hover,   .filters[data-sort='new'] .topOption:hover , .filters  #rangeCtrls a:not(.selected):hover,  .filters .jumpToDate:hover { */
    /* border: 1px solid #ffc112; */

		    /* box-shadow: 2px 2px 8px 1px  rgba(254, 192, 17, 1) */

/* } */
 .rangeSelector  a{
    /* margin-bottom: 4px; */
	position: relative;
z-index: 1;
	    /* margin-right: 5px; */
		

}
.filters .buttonBar {
	
    font-size: 1.1em;
    font-size: 1.2em;
    /* line-height: 1.1em; */
    line-height: 1.2em;
    display: flex;
    /* margin-top: 0.5em; */
    justify-content: space-between;
	    align-items: center;
}
.filters .buttonBar > div {
    display: flex;
    gap: 0.5em;
    align-items: center;
}
.filters .buttonBar #optionsIcon {
	display: flex;
    align-items: center;

}
.filters .buttonBar .invBu {
	    /* height: 100%; */
    /* width: 100%; */
    font-size: 1.1em;
}
.filters .buttonBar #optionsIcon .invBu {
	display: flex;
    align-items: center;
		    font-size: 0.7em;

}
.filters .buttonBar .fa-cog {
	/* font-size: 1.25em; */
	height: 1.3em;
	width: auto;
	
}
#rangeStartCustom.selected {
    /* border: 1px solid #ffc112; */
	    filter: grayscale(1);
}
#mainOptions  .invBu {
	display: flex;
	gap: 0.4em;
	align-items: center;
	/* align-items: baseline; */
}
#mainOptions  .clipFilter .invBu svg {
    color: #ffc112;
	font-size: 0.75em;
	
}
#mainOptions  #daysContainer .invBu svg {
	font-size: 0.9em;
}
#mainOptions  .invBu:hover * {
    color: orange;
}
#mainOptions   .clipFilter .invBu {
	color: white;
		font-size:1.2em;
			font-weight: bold;


}
#mainOptions   .clipFilter .invBu:hover * {
    color: orange;
}
#clipBroadcasterSearch .invBu.empty {
	color: grey;
	pointer-events:none;
	
}
.filters #mainOptions .rangeSelector > a:not(.selected):hover {
	color: orange;
}
#mainOptions #daysContainer #clipPeriodTime:hover  *{
    color: orange;
}
#loadingClips {
    color: #ffc110;
    text-align: center;
    width: 100%;
}

 .filters[data-sort='top'] .recentOption,    .filters[data-sort='new'] .topOption,  .filters  #rangeCtrls a:not(.selected),  .filters .jumpToDate:not(.selected) {

    /* border: 1px solid transparent; */
}

.filters[data-mode='all'] #mainOptions .rangeSelector a    {
	color:grey;
	pointer-events: none;

}
 
.rightText {
	text-align: right;
}
.clearLink {
    /* margin-left: auto; */
}
.filters:not(.changed) #doSearchLink {
	pointer-events:none;
	color: grey;
}
.filters.changed {
	border: 1px solid #ffc112;
}
#notTheDroids {
	display: flex;
	justify-content:center;
}
#notTheDroids > div {
	padding: 1em;
    background-color: #30475a30;
    border: 1px solid #30475a85;
}

#topBar > .heading {
	font-size: 1.5em;
font-weight: bold;
}
.heading{
	color: #97bee0;
}

#clipFromDate  {
	font-size: 1.2em;
}
#clipDateHolder {
	display: flex;
    gap: 0.25em;
    align-items: center;
}
.rangeSelector {
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 1.2em;
    row-gap: 0.25em;
    margin: 0 .25em;
    flex-direction: column;
    position: absolute;
    background-color: #212e3a ;
    padding: 1.25em;
    gap: 0.5em;
	    border: 1px solid #30475a85;
		overflow:hidden;
box-shadow: 2px 2px 10px 3px rgb(30 41 50) !important;
    margin-top: 1.5em;
}

#clipDataPeriod {
	display: flex;
	justify-content: space-between;
	gap: 1em;
	
    margin: 0 0 0.25em 0;
font-size: 1.2em;


}
#clipFromDate, #clipPeriodTime {
	display: flex; 
	gap: 0.25em;
	    align-items: center;

}
h1 > a {
	    margin-right: 5px;
}
.filters #broadcastFilter svg { 
vertical-align: text-bottom;}

#clipSearchMode > div ,
#mainOptions .sortChoice  ,
#mainOptions .clipFilter

{
	    display: flex;
    /* padding: 1em; */
    gap: 1em;
    align-items: flex-end;
	align-items: center;
}
#mainOptions .clipFilter {
	white-space: nowrap;
}
 
#broadcastFilter {
    align-items: center;}

.filters {	  
-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
		display: flex;
		pointer-events:all;
	flex-direction: column;
    z-index: 999999;
padding: 5px;
    font-weight: bold;
	color: white;
    margin-left: auto;
    margin-bottom: 10px;
	margin-top: 5px;
    /* background-color: #374b5e; */
	padding: 1em;
	    background-color: #30475a30;
		
    border: 1px solid #30475a85;
	margin: 1.5em;
    padding: 0.5em;
}
#broadcastFilter .newTwitchSVG {
    height: 1.5em;
	width: auto;
	height:22px;
}
#clipBroadcasterSearch , #clipBroadcasterSearch > div:first-of-type{
	display: flex;
	gap: 0.5em;
	/* align-items: center; */
}
#clipBroadcasterSearch { 
	flex-direction: column;
}
#broadcastFilter .broadcasterComplete {
	margin: 0;
	
}
#clipBroadcasterSearch .invBu {
    font-size: 1em;
}
#broadcasterLinkHolder, #broadcasterLinkHolder > div {
	display: flex;
    align-items: center;
    gap: 0.25em;
}
#broadcasterLinkHolder{
	justify-content: space-between;
}
.filters #mainOptions > div {
	display: flex;
	gap: 1em;
}
#clipPeriodTime .fa-caret-down {
	    font-size: 1.5em;
    /* margin-top: -2px; */
}

.filters .newHrBg {
		display: flex;

}
#daysContainer {
	/* display: block; */
}

#clipBroadcasterSearch input {
	    width: 10em;
    border-radius: 3px;
    background: #30475a;
    border: 1px solid #30475a85;
	color: white;
	font-weight: bold;
}
.filters #mainOptions .leftCol {
	display: flex;
    flex-direction: column;
    gap: 0.5em;
    gap: .75em;
    /* gap: 1em; */
    /* gap: 1.5em; */
		flex-direction: row;
	flex-wrap: wrap;
	align-items:flex-start;
}
#filterCtrls {

    display: flex;
    justify-content: center;
}
.filters #mainOptions {
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 2em;
	    gap: 1em;
	align-items: flex-start;
	justify-content: space-between;
	    flex-wrap: wrap;
    margin: 0.5em;
	flex-direction: column;
	align-items: center;
}
#clipPeriodTime {
	font-size: 1.2em;
}
.filters > h2 {
	text-align: center;
	flex-grow: 2;
    margin: 0px;}


#clipSearchMode > div:last-of-type, #rangeCtrls > .inner {
		    max-width: 300px;

}

.xdsoft_datetimepicker {
    z-index: 999999;
}


.chunk:not([data-chunk-index="0"]) {
	display: none;
}
#clipsContainer {
	display: flex;
	justify-content: space-around;
    flex-wrap: wrap;
	/* width: calc(100%-90px); */
}

#clipsCtrls h3 {
    color: white;
    margin: 0px;
} 
#clipsCtrls {
	    margin-right: -5px;
	pointer-events: all;

    width: 42px;
    /* position: fixed; */
    /* top: 40vh; */
    /* right: 15px;     */
    /* border-radius: 3px; */
	padding: 10px;
    background-color: #212d38;
    z-index: 50;
    border: 1px solid #ffc112;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,1);
}
#filterCtrls > a   {
		pointer-events: all;

}
#filterCtrls > a  >  svg {       filter: drop-shadow(1px 7px 5px black);

}
#filterCtrls {

}
#moreClips{ 
-ms-flex-item-align: end;-ms-grid-row-align: end;align-self: end;
-ms-grid-column-align: end;justify-self: end;
}
#backToTop a, #moreClips a {
	/* display:none; */
		pointer-events: all;

	color: #ffc112;

	z-index: 50;
}
#clipsCtrls a svg:first-of-type {
    margin-right: 6px;
}


	
#clipsCtrlContainer {
    float: right;
    position: fixed;
    right: 0;
    /* top: 0.5em; */
    top: 0;
    /* bottom: 0.5em; */
    bottom: 0;
    /* height: 100%; */
    display: flex;
    z-index: 999999;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: none;
    margin: 0 0.5em;
    z-index: 9999999;
}





.noMenu #filterCtrls > a {
	margin-top: 5px;
}
.noMenu #clipsCtrlContainer{
	top:0px;

	
}

#backToTop svg, #moreClips svg{
	filter: drop-shadow(1px 7px 5px black);
}

 .sortChoice {
	display: flex;
    max-width: 200px;
    justify-content: space-between;
}
.clipsContainer {
		max-width: 1530px;
    padding: 15px 15px;
    border: 1px solid #30475a85;
	/* background-color:red; */
	background-color:#30475a30;
	    /* border-radius: 3px; */
	    border-radius: 2px;
		margin: 0 auto;
		gap: 1em 0.75em;
}

.filters .invBu {
	    /* min-width: 1em;r */

}

#clipsSearchLink	 {
	display: block !important;
}
#clipsActivityLink	 {
	display: none !important;
}

 @media (max-width: 925px) {


 }
 #centerHelper {
	 -ms-grid-column-align: end;justify-self: end
 }