body, html {
  margin: 0;
  overflow: hidden;
  height:100%;
}

@media (min-width: 768px){
  #left {
    position: absolute;
    top: 0px;
    bottom: 0;
    left: 0;
    width: 70%;
    overflow-y: scroll; 
  }
  #right {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    overflow-y: scroll;
    width: 30%;
  }
   #center {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    overflow-y: scroll;
    width: 100%;
  }
  #full {
	position: absolute;
    top: 20px;
    bottom: 0;
    right: 0;
    overflow-y: scroll;
    width: 100%;
  }
}

#left {
	height:100%;
	margin-top: 53px;
	/* border-right: .25rem solid transparent; */
	overflow:hidden;
	background: #FFF;
}

#right {
	margin-top: 53px;
	border-left: 2px solid #e2e2e2;
	border-left: 0px solid #4b3c4b;
	/* border-right: .25rem solid transparent; */
	overflow:hidden;
	background: #FFF;
	background: #fff;
}

#full {
	margin-top: 63px;
	overflow-y: scroll;
	background: #FFF;
	padding: 0px 30px;
}

#center {
	margin-top: 53px;
	overflow-y: scroll;
	background: #FFF;
}


/* https://stackoverflow.com/questions/90178/make-a-div-fill-the-height-of-the-remaining-screen-space */
.cdx-fullpanel-box {
  display: flex;
  flex-flow: column;
  height: 100%;
}
.cdx-fullpanel-content {
	padding-bottom: 20px;
}
.cdx-fullpanel-box .cdx-fullpanel-row {
	/* border: 1px dotted grey; */
}

.cdx-fullpanel-box .cdx-fullpanel-row.cdx-fullpanel-header {
  flex: 0 0 auto;
 
  /* The above is shorthand for:
  flex-grow: 0,
  flex-shrink: 0, --- WAS 1
  flex-basis: auto
  */
}

.cdx-fullpanel-box .cdx-fullpanel-row.cdx-fullpanel-content {
  flex: 1 1 auto;
  overflow-y: scroll;
}

.cdx-fullpanel-box .cdx-fullpanel-row.cdx-fullpanel-footer {
  flex: 0 1 20px;
  min-height: 190px !important;

}
#cdx-msg-form .cdx-reply {
	max-height: 170px !important;
}
.cdx-scrollto-bottom {
	padding-bottom: 10px;
}

/* BOOTSTRAP ADJUST */
.navbar {
	box-shadow: none;
}
.col-sm-4, .col-sm-5, .col-sm-3, .col-sm-2 {
	padding: 0px;
}

#cdx-filters > * {
	padding: 4px!important;
}
.col-sm-8, .col-sm-7, .col-sm-12 {
	padding: 0px 0px 0px 0px;
}

.cdx-fullpanel-content {
	border-right: 4px solid transparent;
}
.cdx-fullpanel-content::-webkit-scrollbar {
    width: 8px; 
    -webkit-appearance: none;
}

.cdx-fullpanel-content::-webkit-scrollbar-track {  
	background-clip: padding-box!important; 
	border-radius: 3px;
	color: #FFF;
    background: #f3f3f3;
    background-clip: padding-box!important;
    border-radius: 3px;
    color: #fff;
    
}
.cdx-fullpanel-content::-webkit-scrollbar-thumb {
    background: #d9d9de;
    background: #d6d6d8;
   /*  box-shadow: inset 0 -2px, inset 0 -3px, inset 0 2px, inset 0 3px; */
  	border-top:4px solid #FFF;
  	border-bottom:4px solid #FFF;
    min-height: 36px;
    border-right: 1px solid #EFEFEF;
    margin-right: 4px;
}