.content-truncate{
  display: block;
  height:41.6px;/*this is for browsers that dont support '-webkit' (lineheight*fontsize*numOfLines)-- 2 Lines */
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@-moz-document url-prefix() {
  h2.content-truncate{
    height:45px;
  }
  .col-3-img p.content-truncate{
    height:100px;
  }
}
.title-truncate{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /*max-width: 70ch;*/
}
.col-3-img p.content-truncate{
  height:auto;
  -webkit-line-clamp: 5;
}
.drawers hr {
  margin-top: 5px;
  margin-bottom: 5px;
  border: 0;
  border-top: 1px solid #0084A9!important;
}
p#ruoNum {
  font-size: 11px;
  padding-bottom: 25px;
}
div.shade-box{
  background: #F4F4F4;
  padding: 15px;
  margin: 20px 0 20px;
  position: relative;
}
div.shade-box ul{
  margin: 0;
  padding: 0;
  padding-left:15px;
}
#follow-me a{
  color: #00afdb;
}
#closeIcon{
  display: none; width: 19px; height: 19px; right: 25px; top: 38px; position: absolute; z-index: 4;
} 
#popUpVideoBackground{
  background-color: grey; display: none; z-index: 3; position: absolute; opacity: 0.9; top: -100%; left: -100%; 
  width: 500%; height: 500%; 
}
#popUpVideoContainer{
 padding:5px;
 left:30%;
 width:40%;
 height:auto!important;
 border: 2px solid black; 
 top:33%;
 position: fixed;
 display: none; 
 background-color: white; 
 font-size: 20px;  
 z-index: 4;
}
#videoCaption{
  line-height:30px;
}
#popUpVideo{
  display: none; 
  z-index: 4;  
  margin: auto;
  width:100%;
  height:auto!important;
  right:0px;
  bottom:0px;
  position:relative;
}
.header-bar{
  position: absolute;
  display: block;
  left: 0;
  bottom: 0;
  background: rgba(95, 96, 98, 0.75);
  /*padding: 10px 15px;*/
  padding:15px;
  width:100%;
}
.header-bar:hover{
  background: rgba(95, 96, 98, 0.95);
}
.header-bar .heading-1, .tabHeader .heading-1{
  color:#fff;
  margin:0px;
}
.header-bar .heading-1{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 40ch;
}
.header-bar .findMore{
  position: absolute;
  right: 15px;
  top: 10px;
}
.border-right{
  border-right: 1px solid #D3D3D3;
}
.carousel-indicators{
  bottom:-50px;
  left: 97%;
  z-index: 0;
}
.carousel-indicators li{
  width: 15px;
  height:15px;
  border-radius: 0px;
  border: 1px solid #0084A9;
  background-color: #82C0D2;
}
.carousel-indicators .active{
  width:15px;
  height:15px;
  background-color: #0084A9;
}
.carousel-inner{
  margin-bottom:25px;
}
.carousel-inner>.item>img/*.carousel-inner>.item>a>img*/ {
  margin: auto;
  border: 1px solid #d3d3d3;
}
.mainCTA{
  margin:20px auto;
}
.cta .btn.orange{
  width: 100%;
}
.row .cta{
  padding:0 2px;
}
.grpCTA .learnMore {
  position: relative;
}
#videoId{
  width:100%;
  height:auto;
  margin-bottom:20px;
}
/* Drawers Starts */
.drawers .panel-title p{
  color:rgb(95, 96, 98);
  line-height: 20px;
}
.drawers .accordion-1, .accordion-1:hover, .accordion-1:focus{
  outline: none!important;
}
.drawers .panel-default{
  border-color: #fff;
}
.drawers .tabHeader{
  height:90px;
}
.drawers .panel-body hr{
  margin-top:-10px;
  border-top: 1px solid #0084A9;
}
.drawers .panel-group .panel+.panel{
  margin-top:-30px;
}
.drawers.drawers-simple .panel-group .panel+.panel{
  margin-top:-2px;
}
.drawers.drawers-simple .panel-group .panel-default:nth-child(2){
  margin-top:-30px;
}
.drawers.drawers-simple .panel-group .panel-heading{
  padding-bottom:0px;
}
.expandSign{
  padding:0 0 0 0 !important;
  margin-top:-5px;
}
.expandSign h2, .expandSign h4{
  font-weight: bold;
  font-size: 30px;
}
.expandSign h2.plus:after, .expandSign h4.plus:after{
  content : "+";
}
.expandSign h2.minus:after, .expandSign h4.minus:after{
  content: "-";
}
.drawers .panel-group .panel-heading+.panel-collapse>.panel-body{
  border-top:none;
  /*margin-bottom:20px;*/
}
.drawers .panel-body{
  background-color: #f5f5f5;
  padding-top: 0px!important;
}
.drawers .panel-body>.row{
  margin: 0px;
}
.drawers .panel-body .row{
  /*margin: 0px;*/
}

/* Drawrs Ends */
/* Multi-Col Starts */
#colWrapper {
  overflow: hidden;
  margin:15px -15px;
}
@-moz-document url-prefix() {
  .drawers #colWrapper {
    overflow: visible
  }
}
.gridView {
  height: 330px;/*it should be overwritten if needed */
  margin-bottom: 20px;
  padding:0px;
}
.gridView>.row{
  margin:0px;
}
/* Multi-col Ends */
.col-3-img .gridView{
  height:400px;
}
.col-3-img .contentRow{
  height:185px;
}
/* 4-column Starts */
.col-4-img .gridView{
  height:335px;
  padding:0px;
}
/* 4-column Ends */
/* 5-column Starts */
.col-5-img>div.col-lg-2, .col-5-img>div.col-md-2, .col-5-img>div.col-sm-2, .col-5-img>div.col-lg-2, .col-5-img>div.col-md-2, .col-5-img>div.col-sm-2{
  width:20%;
}
.col-5-img .gridView {
  height: 475px;
  /*padding:0 10px;*/
}
.tableView > div {
  padding:0px;
}
.tableView.imageRow{
  margin-bottom:15px;
}
/* 5-columns Ends */
.CTA-detailed hr, .community hr, .drawers .panel-body hr{
  margin-top: 5px;
  margin-bottom: 5px;
  border: 0;
  border-top: 1px solid #0084A9;
}
.CTA-detailed .gridView{
  height:175px;
}
.CTA-detailed .gridView >div, .CTA-detailed .gridView>div.row>div{
  padding-left:0px;
}
.CTA-detailed .gridView>div.row {
  padding-left: 15px!important;
}
/* Image Popup Starts */
img.thumb { 
  border:1px solid #D3D3D3; 
  max-width:200px;
}
.imagepreview{
  width:auto!important;
}
#imageModal #imgCaption {
  padding: 15px
}
.modal-dialog{
  margin-top:10%;
  width:auto;
  max-width:800px;
}
.tabHeader{
  background-color: #0084A9!important;
  border-radius:0px!important;
  /*padding:10px 15px;*/
  padding:15px;
}
.blue-header{
  /*margin: 20px 15px 15px 15px;*/
  margin:20px 0;
}
.blue-header .blue-header-content{
  background-color: #F5F5F5;
  padding:15px;
}
.learnMore{
  position: absolute;
  bottom:0px;
}
.learnMore a, .orange-text{
  color:#F99D31;
}
.course-list div.row{
  padding: 10px 15px 0 15px;
}
.course-list h2{
  /*margin-bottom: 0px*/
}
.course-list hr{
  margin: 0 15px;
  border: 0;
  border-top: 1px solid #0084A9;
}
.education-header{
  margin: 20px 0;
}
.education-content{
  overflow: hidden;
  background-color: #F5F5F5;
  padding: 20px 0 20px 0;
}
.education-content > div{
  height:135px;
}
.education-content > div:first-of-type{
  padding: 0px 10px 5px 30px;
}
.education-content div>p{
  font-size:14px;
}
.sciexTeam img{
  float:right;
}
.sciexNow-community{
  margin:20px 0;
}
.sciexNow-community>.row {
  background-color: #f5f5f5;
  padding: 20px;
  margin: 0px
}
.sciexNow-community>.row:first-child>div:last-child {
  margin-top: -20px
}
.sciexNow-community > .row:first-child >div:last-child img {
  float: right
}
.sciexNow-community >.row:last-child {
  padding-bottom: 0px
}
/* Popup Starts */
.popupFrame, .popupPage{
  background: rgba(119,119,119,0.4);
  position: fixed;
  display: none;
  z-index: 5000;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}
.popupFrame iframe{
  width: 50%;
  height: 625px;
  top: 15%;
  left: 25%;
  overflow-y: scroll;
  overflow-x: scroll;
  position: fixed;
}
/* Popup Ends */
/* Quote Starts */
.quote-only{
  padding:0 30px;
}
blockquote {
  font-size: 18px;
  font-style: italic;
  margin: 0.25em 0;
  padding: 0.25em 50px;
  line-height: 1.45;
  position: relative;
  border:0px!important;
}
blockquote:before, blockquote:after{
  display: block;
  font-size: 700%;
  position: absolute;
  color: rgba(102, 188, 41, 0.8);
}
blockquote:before{
  content: "\201C";
  left: -10px;
  top: -35px;
}
blockquote:after{
  content: "\201D";
  bottom: -0.7em;
  right: 0.2em;
}
blockquote cite {
  color: #0084a9;
  font-size: 14px;
  display: block;
  font-family: 'proxima-nova', Arial, Verdana, sans-serif;
  margin-top: 5px;
}
blockquote cite:before {
  content: "\2014 \2009";
}
.quote-img hr{
  border-top: 1px solid #0084A9;
}
.quote-img .quote-content{
  height:255px;
}
.quote-img .findMore {
  bottom: 0px;
  position: absolute;
}
.quote-img .quote-owner p{
  margin-bottom: 0px;
  padding-top: 10px;
}
/* Quote Ends */
/* Horizontal View Starts */
.col-horizontal .row h2{
  padding:0 15px;
}
.col-horizontal .row{
  margin:30px -15px;
}
.col-horizontal hr{
  display: none;
}
/* Horizontal View  Ends */
.icon-col .gridView {
  height: 175px;
}
.icon-col #colWrapper{
  margin:0px;
}
.icon-col .gridView >div.row {
  padding-left: 15px!important;
}
/*bottom References Section */
.references>.row{
  margin:0px;
}
.references>.row>div{
  padding:0px;
}
.refer-header h4{
  text-align:center;
}
.references hr{
  border-top: 1px solid #0084A9;
}
.references-content{
  background-color: #f5f5f5;
  padding: 10px 15px 0 15px;
}
.references-content .gridView{
  height:260px;
}
.references-content .contentRow h4{
  height:40px;
}
.references #colWrapper div img{
  padding-left:30%;
}
/* TABLETS */
@media (min-width: 768px) and (max-width: 1024px) {
  #popUpVideoContainer{
    left:13%;
    width:75%;
    top:30%;
  }
  .popupFrame iframe{
    width: 75%;
    left: 15%;
  }
  .modal-dialog{
   margin-top:15%;
 }

}
/* TABLETS - Landscape */
@media (min-width: 678px) and (max-width: 1024px) and (orientation:landscape){
  .modal-dialog {
    margin-top: 25%;
    max-width: 600px;
  }
}
/* PHONES-Portrait*/
@media (max-width: 767px){
  .header-bar .heading-1, .tabHeader .heading-1{
    font-size:22px;
  }
  .header-bar{
    height:85px;
    position: relative;
    padding:5px;
  }
  .header-bar .heading-1{
    white-space: normal;
    max-width: inherit;
    margin-top:0px;
    margin-bottom:0px;
  }
  .header-bar .findMore{
    /*margin-top:0px;
    margin-bottom:0px;*/
    float: right;
    position: relative;
    right: inherit;
    top: inherit;
  }
  .carousel-indicators{
    left:93%;
  }
  .tabHeader{
    padding:10px 15px;
  }
  #videoId{
    margin-bottom: 0px;
  }
  .border-right {
    border: 0px;
    border-bottom:1px solid #d3d3d3;
  }
  .row .cta{
    padding:0 1px;
  }
  .mainCTA .cta a{
    padding:5px 2px;
    font-size:12px;
  }
  .blue-header #colWrapper{
    padding:0px;
  }
  #colWrapper .gridView .learnMore, .findMore{
    position: relative;
  }
  .gridView{
    height:auto!important;
  }
  .drawers .panel-group{
    margin-top:20px;
  }
  .drawers .tabHeader{
    margin-bottom: 30px;
    height:auto;
  }
  .drawers .panel-body{
    /*padding:0px;*/
  }
  .drawers .panel-body hr{
    /*margin: -10px 15px 0px 10px;*/
  }
  .course-list div.row{
    /*padding: 5px 15px;*/
    padding:5px;
  }
  .course-list hr{
    /*margin: 0 15px;*/
    margin:0 5px;
  }
  .education-content > div:first-of-type, .education-content > div{
    padding: 0px 10px 5px 10px;
  }
  .education-content > div{
    height:auto;
    margin-bottom: 15px;
  }
  .popupFrame iframe{
    width: 85%;
    left: 5%;
  }
  #popUpVideoContainer{
    font-size: 16px;
    padding:10px;
    width:90%;
    left:5%;
  }
  #videoCaption{
    line-height:20px;
  }
  #videoTime{
    font-size:16px;
  }
  .modal-dialog{
    margin-top:35%;
  }
  img.thumb { 
    max-width:none;
  }
  .imgPopup p, .imgPopup{
   display:none;
 }
 .quote-only{
  padding:10px 5px 0px 5px;
}
.CTA-detailed #colWrapper {
  padding: 0px
}
.CTA-detailed #colWrapper>div {
  padding: 0px
}
.sciexNow-community >.row {
  padding: 10px 0px
}
.sciexNow-community >.row:first-child>div:last-child {
  margin-top: 10px
}
.col-5-img >div.col-xs-12 {
  width: 100%;
}
.col-3-img .contentRow{
  /*height:auto;*/
}
/* 4-column starts */
.tableView {
  /*display: table-cell;
  float: none;
  vertical-align: top;*/
  /*padding:0 10px!important;*/
  margin-bottom: 15px;
  height:auto!important;
}
.col-4-img .gridView {
  height:auto;
}
.col-4-img .gridView h2{
  /*margin:0;*/
}
.gridView p{
  /*margin:10px 0;*/
}
.gridView h2, .gridView h4{
  height: auto!important;
}
/* 4-column ends */
.col-horizontal hr{
  display: block;
  border-top:1px solid #eee!important;
}
.col-horizontal .row{
  margin: 15px -15px;
}
.icon-col #colWrapper {
  padding: 0px;
}
.icon-col #colWrapper > div {
  padding: 0px;
}
}
/* PHONES-Landscape*/
@media (max-width: 767px) and (orientation: landscape){
  #popUpVideoContainer{
    width:65%;
    left:17%;
    top:15%;
  }
  .header-bar{
    height:65px;
  }
  .drawers .tabHeader{
    /*margin-bottom:0px;*/
  }
  .border-right{
    border:0px;
    border-right: 1px solid #D3D3D3;
  }
  .col-4-img .gridView{
    /*width:25%;*/
    height:335px;
  }
  .col-4-img .gridView > .col-xs-6, .col-3-img .gridView > .col-xs-6{
    /*width:100%;*/
  }
  .col-4-img .gridView .learnMore, .col-3-img .gridView .learnMore{
    /*position: absolute!important;*/
  }
  .col-3-img .gridView{
    /*width:33.333%;*/
  }
}