.grid .column {
    margin-right:0;
}
.span-23 {
    width: 100%;
}
.grid .header {
    background:transparent;
    height: auto;
}

.superHeader h3.header{
    font-family: 'Roboto',Arial,sans-serif;
    color: #0A253E;
    padding-bottom: 10px;
}

h4.header{
    font-family: 'Roboto',Arial,sans-serif !important;
}

h3.header:hover { cursor: pointer; color: #2184D0; }

.superHeaderContent {padding-left: 20px;}

.instruction{margin-top: 10px; margin-bottom:10px;}

.even.selected {
    background-color:black !important;
}

.tagCol {
    font-weight: bold;
}

.card .content .header{
    background: transparent;
    height: auto;
}

.ui.card>.button, .ui.card>.buttons, .ui.cards>.card>.button, .ui.cards>.card>.buttons {
    color:black !important;
    height: auto !important;
}

.card {
    width:200px !important;
    display:inline-block !important;
    vertical-align:top;
    height:500px;
    margin-top:1px !important;
}

.filterHeading {font-family:'Roboto',Arial,sans-serif; text-transform: uppercase; letter-spacing: 0.1em; float:left;}

#compareModal {

}

.close.icon {
    cursor: pointer;
}

.timeRet {
    cursor:pointer;
    font-size: 14px;
    font-family:'Roboto',Arial,sans-serif;
}

#content {
    position: static;
}

.scrolls {
    overflow-x: scroll;
    height: 500px;
    white-space:nowrap
}

.description {
    white-space: normal;
}

.ui.card:first-child {
    margin-top:1px !important;
}

.DTFC_LeftBodyWrapper{
    font-weight: bold;
}

div.dts div.dataTables_scrollBody {
    background: none;
}

.text-wrap{
    white-space:normal;
}
.width-200{
    width:200px;
}

.opTest {
    margin-right:5px;
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
    margin-left:5px;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    color: black;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    border: 1px solid black;
    background-color:white;
    font-weight: normal;
    font-size:14px;
    text-decoration: none;
    /* Position the tooltip */
    position: absolute;
    z-index: 99;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.operatorDrop {
    font-size:14px;
}

.returnCustom, .sizeCustom, .priceCustom {
    width:80px;
    height:20px;
}

.priceCustom {
    margin-left:2px !important;
    margin-right:2px !important;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;
    background: #d3d3d3;
    outline: none;
    opacity: 1;
}

.screensHeader {color: #369; margin-bottom: -1px;font-family:'Roboto',Arial,sans-serif;}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #0c263e;
    cursor: pointer;
}

.slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #0c263e;
    cursor: pointer;
}

section.range-slider {
    position: relative;
    width: 200px;
    height: 35px;
    text-align: center;
}

section.range-slider input {
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 15px;
    width: 200px;
    outline: none;
    margin: 0;
    padding: 0;
}

section.range-slider input::-webkit-slider-thumb {
    pointer-events: all;
    position: relative;
    z-index: 1;
    outline: 0;
}

section.range-slider input::-moz-range-thumb {
    pointer-events: all;
    position: relative;
    z-index: 10;
    -moz-appearance: none;
    width: 9px;
}

section.range-slider input::-moz-range-track {
    position: relative;
    z-index: -1;
    background-color: rgba(0, 0, 0, 1);
    border: 0;
}
section.range-slider input:last-of-type::-moz-range-track {
    -moz-appearance: none;
    background: none transparent;
    border: 0;
}
section.range-slider input[type=range]::-moz-focus-outer {
    border: 0;
}

#compareButton {
    background:url('https://www.materialui.co/materialIcons/action/compare_arrows_white_192x192.png') no-repeat left center;
    background-position: 5px;
    background-color: #45A049;
    background-size: 30px;
    padding: 10px 10px 10px 40px;
    border: 1px solid #EBEBEB;
    color: white;
    border-radius: 4px;
    margin-bottom: 2px;
    font-family: 'Roboto',Arial,sans-serif;
}

#compareButton:hover {background-color: #40bc44; cursor:pointer;}

#criteria {border-top: 4px solid #444;}

#criteriaButton {
    background:url('https://cdn2.iconfinder.com/data/icons/applications-windows/24/Left_Sidebar_panel_application_browser-512.png') no-repeat left center;
    background-position: 5px;
    background-color: #FFF;
    background-size: 25px;
    padding: 10px 10px 10px 33px;
    border: none;
    color: #999;
    text-decoration: underline;
    margin-bottom: -50px;
}

#criteriaButton:hover {
    background-color: #F1F1F1; 
    color: #2184D0; 
    cursor:pointer;
}

#resetButton { 
    padding: 6px; 
    margin-top: -6px; 
    background-color: #555; 
    color: white; 
    border:none; 
}

#resetButton:hover {
    background-color: #999; 
    cursor:pointer;
}

#expandCollapse {
    padding: 6px 15px 6px 15px; 
    border:none;
}

#expandCollapse:hover {
    background-color: #EFEFEF;
    cursor:pointer;
}

.apply { 
    border:none; 
    color: white; 
    background-color: #555; 
    padding: 6px 10px 6px 10px; 
}
.apply.active {
    background-color: #2184d0; 
}

.apply:hover {
    cursor:pointer;
    background-color:#1d8ee5;
}

td { 
    font-family: Arial, sans-serif !important; 
}

th { 
    font-family: 'Roboto',Arial, sans-serif !important; 
}

.filterList {
    max-height:525px;
    overflow-y:scroll;
    margin-right:-14px;
}

.blueButton {
   border:none; 
    background-color: #2184d0; 
    color: white; 
    padding: 6px 10px 6px 10px;
}

.saveButton {
   border:none; 
    background-color: #555; 
    color: #FFF; 
    padding: 6px 10px 6px 10px;
}

.saveButton:hover { background-color: #999; cursor: pointer; }

.btn-primary {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}
.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.compareHeader {padding-left:8px;font-size:16px;font-weight:bold;background-color: #D7D7D7}

input.manage { padding: 8px; border: 1px solid #BBB; border-radius: 4px; }

.addticker:hover {filter: invert(100%);}

.compareFooter {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background: rgba(35,31,32,.75);
   text-align: center;
   z-index: 500;
   height:200px;
}

#compare {
    width: 1000px;
    margin: 0 auto;
    padding-top: 10px;
    overflow-x:scroll;
}


.scrolling-wrapper-flexbox {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    height: 120px;
    
}

.card {
    width: 150px;
    height: 100px;
    background: white;
    flex: 0 0 auto;
    margin-right: 5px;
    border: 3px solid #2184d0;
    border-radius: 5px;
    padding:10px;
}
.scrolling-wrapper-flexbox::-webkit-scrollbar-thumb:horizontal{
    background: lightgray;
    border-radius: 10px;
}

.compareContent{
    width:1000px;
    margin: 0 auto;
}

.compareOptions {
    height:40px;
    margin-top:20px;
    margin-bottom:10px;
}

#clearCompare {
    color:orange;
    text-decoration: underline;
    font-weight: bold;
    cursor: pointer;
    margin-right: 20px;
    margin-top:10px;
}

.symbolName {
    text-align: center;
}

.DTFC_LeftBodyLiner {
    overflow-x:hidden !important;
}

#closeCompare {
    background-color: darkgray;
    padding: 10px 10px 10px 10px;
    border: 1px solid #EBEBEB;
    color: white;
    border-radius: 4px;
    font-family: 'Roboto',Arial,sans-serif;
}

#closeCompare:hover {background-color:  #808080; cursor:pointer;}