/**
 * Simple Timeline Styling
 */

/*@import url("http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300");
@import url("http://fonts.googleapis.com/css?family=PT+Sans");
*/
/**
* Just container styling
*/



.dbuttons {
	margin-top:180px;
	margin-left: 65px;
}


.eventContent {
	font-size:15px;
	text-align:justify;
}

.eventContentInfo{
	text-align:center;
	font-size:15px;
}

.hidden {
	display:none;
}

div.tlcontainer {
	margin-top:2em;
	overflow:auto;
}

#timelineWrap {
	width:850px;
	margin: auto;
	margin-top:20px;
	margin-bottom:20px;
}

.timelineLine {
	background: none repeat scroll 0 0 #444;
	height:1px;
	width:100%
	position:relative;
}

.blob {
	background: none repeat scroll 0 0 #fefefe;
	border: 1px solid #444;
	border-radius:8px;
	cursor:pointer;
	height:6px;
	margin-left:0px;
	margin-top:-2.7px;
	position:absolute;
	width:6px;
}

#event-2 {
	margin-left:50.2px;
	poition:absolute;
	top:0;

}

div.hoverInfo {
	background: none repeat scroll 0 0 #222;
	color:#efefef;
	margin-left:0;
	font-family: "Comfortaa", sans-serif;
	overflow:visible !important;
	padding:8px;
	padding-top:4px;
	padding-bottom:5px;
	cursor:pointer;
	margin-top:20px;
	border-radius:4px;
	font-size:12px;
	z-index: 100;
	position:relative;

}

.hoverInfo span {
	font-size:10px;
	color: #bbb;

}

button.yselect {
	border: 0;
	font-family: "Comfortaa", sans-serif;
	font-size:28px;
	cursor:pointer;
	background:none;
}

button.dselect {
	border: 0;
	font-family: "Comfortaa", sans-serif;
	font-size:28px;
	cursor:pointer;
	background:none;
	margin-left:0px;
}

.currentYear {
	display:inline;
	margin-left:2px;
	font-family: "Comfortaa", sans-serif;
	font-size:26px;
}

.currentDate {
	display:inline;
	margin-left:5px;
	font-family: "Comfortaa", sans-serif;
	font-size:26px;
}

.months {
	color: #222;
	margin-left:0;
	position:absolute;
	margin-top: -30px;
}

.monthLine {
	background: none repeat scroll 0 0 #bbb;
	content: "";
	display:block;
	height:3px;
	#margin-left: 50px;
	position:absolute;
	top:27px;
	width:1px;
}

.firstlast {
	height:6px;
	top:27.5px;
	background: none repeat scroll 0 0 #444;
}



.eventTitle {
	font-family: "Comfortaa", sans-serif;
	font-size:20px;
	margin-bottom:0px;
	text-align: justify;
}

.eventDate {
	font-size:16px;
	font-family: "Comfortaa", sans-serif;
	margin-bottom:6px;
	margin-top:-2px;
	color:grey;   /*#bbb;*/
}



.imgdiv {
	margin-right:25px;
	margin-top:11px;
}


.imgdiv img {
	width:100%;
	height:100%;
}


#contentWrap {
	width:100%;
	margin:auto;
	overflow:auto;
}


.dateRight {
	float:right;
	margin-right: 80px;
}

.column,
  .columns {
    position: relative;
    padding-left: 1.2375rem;
    padding-right: 1.2375rem;
    float: left; }

  .large-1 {
    width: 10.33333%; }

  .large-2 {
    width: 16.66667%; }

  .large-3 {
    width: 25%; }

  .large-4 {
    width: 33.33333%; }

  .large-5 {
    width: 41.66667%; }

  .large-6 {
    width: 50%; }

  .large-7 {
    width: 58.33333%; }

  .large-8 {
    width: 66.66667%; }

  .large-9 {
    width: 75%; }

  .large-10 {
    width: 80.33333%; }

  .large-11 {
    width: 91.66667%; }

  .large-12 {
    width: 99%; }

	
@media only screen and (max-device-width: 480px) {
	.column,
	.columns {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
	
	.img-news{
		width:95%;
	}
	.custom-col{
		overflow : scroll;
	}
	
	.ytbvideo {
		width: 360px;
		height: 250px;
		display:none;
	}
	
	#contentWrap{
	width: 200%
	}
	
	#yprev{
		margin-left:5px;
	}
	
	.dateRight{
		margin-right:-410px;
	}
	
	.large-1 {
		width: 3.333%;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 0px;
	}
	
	.large-10{
		width: 90%
	}
}

@media (min-width: 479px) {
	.column,
	.columns {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
	
	.img-news{
		width:90%
	}
	
	.custom-col{
		overflow : scroll;
	}
	

	.ytbvideo {
		width: 360px;
		height: 250px;
		display:none;
	}
	
	#contentWrap{
		width: 150%
	}
	
    
	#yprev{
		margin-left:5px;
	}
	
	.dateRight{
		margin-right:-410px;
	}
	
	.large-1 {
		width: 6.333%;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 0px;
	}
	
	.large-10{
		width: 88%
	}
  
}

@media (min-width: 639px) {

	.column,
	.columns {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
	
	.img-news{
		width:100%
	}
	
	.custom-col{
		overflow : scroll;
	}
	
	.special{
		display: block;
	}
	
	.ytbvideo {
		width: 360px;
		height: 250px;
		display: none;
	}
	
	#contentWrap{
	width: 100%
	}
	
	#yprev{
		margin-left:5px;
	}
	
	.dateRight{
		margin-right:-250px;
	}
	
	.large-1 {
		width: 6.333%;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 0px;
	}
	
	.large-10{
		width: 88%
	}
}

@media (min-width: 767px) {

	.column,
	.columns {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
	
	.custom-col{
		overflow : scroll;
	}
	
	.special{
		display: block;
	}
	.ytbvideo {
		width: 360px;
		height: 250px;
	}
	
	#contentWrap{
	width: 120%
	}
	
	#yprev{
		margin-left:5px;
	}
	
	.dateRight{
		margin-right:-145px;
	}
	
	.large-1 {
		width: 5%;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 0px;
	}
	
	.large-10{
		width: 90%
	}

}

@media (min-width: 992px) {
	.column,
	.columns {
		padding-left: 0.2rem;
		padding-right: 0.2rem;
	}
	
	.ytbvideo {
		width: 470px;
		height: 300px;
		display:block;
	}
	
	.custom-col{
		overflow : visible;
	}

	.special{
		display: none;
	}
	
	#contentWrap{
		width: 100%
	}
	#yprev{
		margin-left:20px;
	}
	
	.dateRight{
		margin-right:15px;
	}
	
	.large-1 {
		width: 5%;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 15px;
	}
	
	.large-10{
		width: 7-.333%
	}
	
	.currentYear{
		margin-left: 40px;
	}
	
}
    
@media (min-width: 1023px) {
	.column,
	.columns {
		padding-left: 0.2rem;
		padding-right: 0.2rem;
	}
    
	.ytbvideo {
		width: 470px;
		height: 300px;
		display:block;
	}
	
	.custom-col{
		overflow : visible;
	}
	
	.special{
		display: none;
	}
	
	#contentWrap{
		width: 100%
	}
	
	#yprev{
		margin-left:20px;
	}
	
	.dateRight {
		margin-right:20px;
	}
	
	.currentDate{
		margin-right: 20px;
	}
	
	.dbuttons{
		margin-left: 15px;
	}
	
	.currentYear{
		margin-left: 40px;
	}
	
	.large-1{
		width: 5%;
	}
	
	.large-10{
		width:90%;
	}
}

@media (min-width: 1200px) {
	.column,
	.columns {
		padding-left: 0.2rem;
		padding-right: 0.2rem;
	}
	
	.ytbvideo {
		width: 560px;
		height: 360px;
		display:block;
	}
	
	.custom-col{
		overflow : visible;
	}	
	
	#contentWrap{
		width: 100%
	}
	
	.special{
		display: none;
	}
	
	#yprev{
		margin-left: 60px;
	}
	
	.dateRight {
		margin-right:30px;
	}
	
	.currentDate{
		margin-right: 60px;
	}
	
	.currentYear{
		margin-left: 100px;
	}
	
	.dbuttons{
		margin-left: 75px;
	}
	
	.large-1{
		width: 9.7%;
	}
	
	.large-10{
		width:80.333%;
	}
}