/*Course Page CSS*/
.vlab-body {
  max-width: 1200px;
  background: white;
  margin-left: auto;
  margin-right: auto;
}

.vlab-body .ngi-title {
  font-size: 3em;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5em;
}

.vlab-course-title.row {
  padding-top: 3em;
  padding-bottom: 1.5em;
}

.vlab-course-content.row {
  padding-top: 2em;
  padding-bottom: 2em;
  border: 1px solid #ddd;
  border-bottom: none;
  border-left: none;
  border-right: none;
  margin-top: -25px;
  padding-left: 2em;
  padding-right: 2em;
  font-size: 1.5em;
  line-height: 1.7em;
}

.vlab-title-row.row > .col-sm-12.col-md-4 >div {
  text-align: center;
  background-color: #5cb85c;
  color: white;
  padding: 0.5em;
  border: 1px solid #5cb85c;
  width: 200px;
  margin-left: auto;
  margin-right: auto;
}

.vlab-title-row.row > .col-sm-12.col-md-4 >div>span {
  font-size: 1.5em;
}

body {
  padding-top: 50px;
}

.panel {
  border-radius: 3px;
}

.panel-heading {
  border-top-left-radius: 1px;
  border-top-right-radius: 1px;
  background: #3498db;
}

.panel-primary>.panel-heading {
  background-color: #3498db;
}

.navbar-default .navbar-toggle .icon-bar {
  background: white;
}


/*Button*/

.circleButton {
  border-radius: 50% !important;
  border: 2px solid white;
  margin-left: 3px !important;
  magrin-right: 3px !important;
  line-height: 1.5 !important;
}


/*Spinner*/

.glyphicon-refresh-animate {
  -animation: spin .7s infinite linear;
  -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  from {
    transform: scale(1) rotate(0deg);
  }
  to {
    transform: scale(1) rotate(360deg);
  }
}

#nav .navbar {
  padding-left: 10px;
  padding-right: 5px;
  /*margin-left: 20px;
	margin-right: 20px;
	margin-top: 10px;
	margin-bottom: 10px;*/
  background: #3498db;
  border: none;
  border-bottom: 1px solid white;
}

#nav .navContainer {
  padding-left: 0px;
  padding-right: 0px;
}

.navbar-header .navbar-brand {
  color: white;
}

.navbar-header .navbar-brand:hover {
  color: white;
  background-color: #337ab7;
}

.navbar-header .navbar-brand.active {
  background: #2c3e50;
}

.navbar-collapse .navbar-left li a {
  color: white;
}

.navbar-collapse .navbar-right li a {
  color: white;
}

.navbar-collapse .navbar-left li a:hover {
  color: white;
}

.navbar-collapse .navbar-right li a:hover {
  color: white;
}

.navigationLink {
  border: 1px solid white;
  padding: 8px !important;
  margin-top: 6px;
  border-radius: 4px;
  margin-left: 3px;
  margin-right: 3px;
}

.navigationLink.instructorLink {
  background-color: #00B1FF;
}

.navigationLink.studentLink {
  background-color: #5cb85c;
}

.navigationLink.studentLink:hover {
  background-color: #287A28 !important;
}

.navbar-collapse .navbar-left li a.active {
  background: #2c3e50;
}

div#weatherModal.modal.fade.in {
  padding-right: 0px !important;
}

.invisiblePanel {
  background: transparent;
  ;
  border-radius: 0px;
  border: none;
  box-shadow: none;
}

.infoPanel,
.summaryPanel {
  margin: 20px;
  margin-top: 0px;
}

.infoPanel .list-group-item,
.summaryPanel .list-group-item {
  border: none;
}

.summaryPanel li:before {
  /*Using a Bootstrap glyphicon as the bullet point*/
  content: "\e250";
  font-family: 'Glyphicons Halflings';
  font-size: 12px;
  margin-right: 5px;
  /*float: left;*/
  /*margin-top: 4px;*/
  /*margin-left: -17px;*/
  /*color: #CCCCCC;*/
}

.summaryPanel {
  border-top: none;
  border-top-right-radius: 0px;
  border-top-left-radius: 0px;
}

.summaryTab {
  margin-left: 20px;
  margin-right: 20px;
}

.summaryDiv {
  /*margin: 20px;*/
  border: none;
}

.summaryContent {
  border-top: none;
}

.quotePanel {
  margin: 5px;
}

.quotePanel >.panel-body>div>a {
  border-radius: 5px;
}

.quoteInner {
  border-radius: 5px;
  /*border: 1px solid gray;*/
  border: none;
}

.quoteInner .item {
  border-radius: 5px;
  background: transparent;
}

.left.carousel-control {
  background: transparent;
}

.left.carousel-control >.glyphicon-chevron-left {
  color: grey;
  font-size: 20px;
  margin-left: -20px;
}

.right.carousel-control {
  background: transparent;
}

.right.carousel-control >.glyphicon-chevron-right {
  color: grey;
  font-size: 20px;
  margin-right: -20px;
}

.carouselBanner {
  background: #20948b;
  width: 100%;
}

.media {
  text-overflow: ellipsis;
  overflow: hidden;
  max-height: 200px;
  color: white;
}

.bannerContainerFluid img {
  margin-left: auto;
  margin-right: auto;
}

.bannerContainerFluid {
  margin-top: 15px;
  margin-bottom: 50px;
  margin-left: 5px;
  margin-right: 5px;
  color: black;
  /*max-height: 200px;*/
}

.bannerContainerFluid > .media >.media-body> p {
  /*max-height: 160px;*/
  text-overflow: ellipsis;
  overflow: hidden;
}

.bookPanel {
  border: none;
  border-top: 1px solid white;
  box-shadow: none;
}

.bookPanel >.panel-heading {
  background: #4897b8;
  border: none;
  color: white;
  text-align: left;
}

.bookPanel >.panel-body {
  border: none;
  /*padding: 5px 20px;*/
}

.bookPanel >.panel-body .col-md-4 {
  /*padding: 5px 5px;*/
  padding-left: 10px;
  padding-right: 10px;
}

.bookPanel >.panel-body .thumbnail {
  
}

.mainpage-info-btn {
  display: none;
  border-radius: 4px;
  padding: 10px 60px;
  font-size: 1.3em;
  background-color: #00B0FF;
  border: none;
}

.mainpage-thumbnail {
  border: none;
  background: white;
  border-radius: 4px;
}

.mainpage-thumbnail:hover {
  -webkit-box-shadow: 0px 0px 5px 1px rgba(33,33,33,0.3);
  -webkit-moz-box-shadow: 0px 0px 5px 1px rgba(33,33,33,0.3);
  box-shadow: 0px 0px 5px 1px rgba(33,33,33,0.3);
  background-color: #fafafa;
}