/*@media only screen and (min-width:1025px) { *//* non-mobile styles */
@media only screen and (min-width:769px) { /* non-mobile styles */
	body { 
		background: url('images/overlay-white.png') repeat,
		url('images/cshl-bkgd.jpg') no-repeat center center fixed!important; 
		-webkit-background-size:cover!important;
		-moz-background-size:cover!important;
		-o-background-size:cover!important;
		background-size:cover!important; 
  	}
  	h1 { /*color:#fff;*/ font-weight:500; }
}
a.scrolltotop { color:#fff; padding-left:15px;}
p.totop { margin-bottom:10px; }
@media (min-width:769px) {
	a.scrolltotop { padding-left:0; }
}
@media (max-width: 2000px) and (min-width: 768px) {
  footer#colophon.site-footer { 
    background: #fff url('/wp-content/uploads/2017/09/footer-background2.jpg') no-repeat 50% 100%; 
  }
}

/* ===== Start bootstrap styles and overrides ===== */

.well { background:rgba(0,0,0,0.85); color:#fff; border:none; font-weight:300; }

@media (min-width: 769px) { /* non-mobile styles */
	.well { background:rgba(0,0,0,0.65); }
}

/* ===== Start Timeline Objects and Animation Styles ===== */

@media (max-width: 768px) {

  .row.reorder-xs {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    direction: rtl;
  }

  .row.reorder-xs > [class*="col-"] {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
    direction: ltr;
  }

}
#ss-container {  }
@media (min-width:769px) {
	#ss-container {
    	width: 100%;
    	position: relative;
    	text-align: left;
    	float: left;
    	margin-bottom: 100px;
	}

	#ss-container:before {
		display:block;
   		position: absolute;
   		width: 4px;
   		background: #000;
   		top: 0px;
   		content: '';
    	left:50%;
   		height: 101.8%;
	}
}

/* modal styles */
.modal { z-index:5000; }
.modal-header.blue { color:#fff; background:#004982; }
.modal-header.aqua { color:#fff; background:#00a9ac; }
.modal-header.gray { color:#fff; background:#737373; }
.modal-header.green { color:#fff; background:#55a265; }
a.facts { color:#fff; }
a.facts:hover { color:#000; text-decoration:none; }
a.facts div.blue:hover { color:#6588a8; text-decoration:none; }
a.facts:focus { text-decoration:none; color:#fff; outline:none; outline-offset:0; }

/* content-box styles */
.spacer100 {height:0;}
.content-box {
	background:rgba(0,0,0,0.85);  
	padding:0; 
	border-radius:6px;
	color:#fff;
}
.content-box.institute { padding:10px 0px 10px 0px; }
.content-box.institute,
.content-box.current, 
.content-box.moving, 
.content-box.static { margin:0 0 5% 0 }

@media (min-width:769px) {
	.content-box { background:rgba(0,0,0,0.65); }
	.content-box.institute { padding:10px 0px 15px 25px; /*margin:0 10% 5% 10%;*/ }
	.content-box.institute, 
	.content-box.current, /*{ margin:0 10% 5% 10%; }*/
	.content-box.moving, 
	.content-box.static { margin:0 10% 5% 10%; }
}

.content-box h2, 
.content-box h3, 
.content-box h4 { color:#fff; margin-bottom:15px; padding:0 15px; }
.content-box h3, 
.content-box h4 { line-height:1.2; }

.content-box img {
	border-top-left-radius:6px;
	border-top-right-radius:6px;
	border-bottom-left-radius:0px;
}

.content-box .list-group { margin-left:15px; padding:10px; font-size:16px; font-weight:300; margin-right:10%; border-radius:6px; }
.content-box .list-group.blue { background:#004982; }
.content-box .list-group.aqua { background:#00a9ac; }
.content-box .list-group.gray { background:#737373; }
.content-box .list-group.green { background:#55a265; }


@media (min-width:769px) {
/*	.scrollmagic-pin-spacer { padding:0; margin:auto;} */
	.spacer100 {height:100px;}
	.content-box.institute { margin:5% 10% 10% 10%; }
	.content-box.current { margin:5% 5% 15% 5%; }
	.content-box.moving { margin:0 10%; }

	.content-box .list-group {  margin-left:0;  }
	.content-box img {
		border-top-left-radius:6px;
		border-bottom-left-radius:6px;
		border-top-right-radius:0px;
	}
	.content-box h2, 
	.content-box h3, 
	.content-box h4,
	.content-box p { padding-left:0; }

}

@media (min-width:769px) and (max-width:1234px) {
	.content-box.institute { margin:85px 10% 10% 10%; }
	.content-box.current { margin:85px 5% 10% 5%; }
	.content-box.moving, 
	.content-box.static { margin:5% 8%; }

	.content-box h2, 
	.content-box h3, 
	.content-box h4,
	.content-box p { padding-right:10px; font-weight:300; }
	.content-box h2 { font-size:150%; }
	.content-box h3 { font-size:120%; }	
	.content-box h4 { font-size:100%; }	
}


/* date styles */
.date-separator { padding-bottom:0; }
.date-separator60 { padding-bottom:0; }
.date-separator100 { padding-bottom:0; }

.triangle-left,
.triangle-right,
.triangle-up,
.triangle-left h4,
.triangle-right h4,
.triangle-up h4 { display:none; }

@media (min-width:769px) {
	.date-separator { padding-bottom:125px; }
	.date-separator60 { padding-bottom:60px; }
	.date-separator100 { padding-bottom:100px; }

	.triangle-left h4 { margin-top:-8px; width:100px; padding-right:28px; display:block; }
	.triangle-right h4 { margin:-8px 0 0 -81px; width:100px; padding-left:8px; display:block; }
	.triangle-up h4 { margin-top:45px; margin-left:-50px; width:100px; display:block; }

	.triangle-up {
		display:block;
		text-align:center; 
		position: absolute;
		top: -3px;
		left: 0;
		width: 0;
		height: 0;
		border-left: 50px solid transparent;
		border-right: 50px solid transparent;
		border-bottom: 80px solid #004982;
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}

	.triangle-left { 
		display:block;
		text-align:right; 
		position: absolute;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		border-top: 50px solid transparent;
		border-right: 80px solid transparent;
		border-bottom: 50px solid transparent;
	}
	.triangle-left.half { left:100%; }
	
	.triangle-left.blue { border-right:80px solid #004982; }
	.triangle-left.aqua { border-right:80px solid #00a9ac; }
	.triangle-left.green { border-right:80px solid #56a366; }
	.triangle-left.gray { border-right:80px solid #737373; }

	.triangle-right {
		display:block;
		text-align:left;  
		position: absolute;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		border-top: 50px solid transparent;
		border-left: 80px solid transparent;
		border-bottom: 50px solid transparent;
	}
	.triangle-right.blue { border-left:80px solid #004982; }
	.triangle-right.aqua { border-left:80px solid #00a9ac; }
	.triangle-right.green { border-left:80px solid #55a265; }
	.triangle-right.gray { border-left:80px solid #737373; }

	.triangle-left { left: 50%; margin-left: -80px; color:#fff; }
	.triangle-right { left: 50%; margin-left: 4px; color:#fff; }
	.triangle-right.internal { left: 0; }
	.triangle-left.internal { left: 100%; position:relative; margin-left:-65px; }
	.triangle-up { left: 50%; margin-left: -48px; color:#fff; text-align:center; }

	.ss-container-date {
    	left: 50%;
    	margin-left: -37px;
	}
}  
/* ===== End Timeline Objects and Animation Styles ===== */