@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/awesome/fontawesome-webfontba72ba72.html?v=4.0.3');
	src: url('fonts/awesome/fontawesome-webfontd41dd41d.html?#iefix&v=4.0.3') format('embedded-opentype'), url('fonts/awesome/fontawesome-webfont.html') format('woff'), url('fonts/awesome/fontawesome-webfontba72-2ba72.html?v=4.0.3') format('truetype'), url('fonts/awesome/fontawesome-webfontba72-3ba72.html?v=4.0.3#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
  }
  
  
  /* -----------------------------------
   TIMELINE FLAT PORTFOLIO 
   ---------------------------------- */
  
  .timelineFlat.timelineFlatPortfolio .item .read_more {
	  margin-top:20px;
  }
  
  .timelineFlat.timelineFlatPortfolio .item,
  .timelineFlat.timelineFlatPortfolio .item_open {
	  height: 427px;
  }
  
  /* -----------------------------------
   TIMELINE FLAT BLOG 
   ---------------------------------- */
  .timelineFlat.timelineFlatBlog .item,
  .timelineFlat.timelineFlatBlog .item_open {
	  height: 338px;
  }
  
  .timelineFlat.timelineFlatBlog .item .post_date {
	  font-family: Montserrat;
	  background: #dd5555;
	  color: #ffffff;
	  border-radius: 50%;
	  width: 35px;
	  height: 35px;
	  padding: 15px;
	  text-align: center;
	  font-size: 24px;
	  line-height: 24px;
	  margin: -34px 18px 0 0;
	  float: right;
	  position: relative;
	  z-index: 2;
  }
  
  .timelineFlat.timelineFlatBlog .item .post_date span {
	  display: block;
	  width: auto;
	  height: auto;
	  font-size: 12px;
	  line-height: 12px;
	  margin: 0;
  }
  
  
  /* -----------------------------------
   TIMELINE FLAT BASE DESIGN
   ---------------------------------- */
  
  .timelineFlat {
	  display:none;
  }
  .timelineLoader {
	  width:100%;
	  text-align:center;
	  padding:150px 0;
  }
  
  
  /* fixed line holder */
   .timeline_line {
	  margin-top:10px;
	  margin-bottom:10px;
	  width:900px;
  }
  
  /* full (including months that are not shown) line holder */
  .timelineFlat .t_line_holder {
	  padding: 10px 0 0 0;
	  height:80px;
	  background:url('../images/timeline/light/line.html') repeat-x 0px 49px;
  }
  
  /* 2 months are stored in one view */
  .timelineFlat .t_line_view {
	  height:20px;
	  width:900px;
  }
  
  
  
  /* holder for 1 month (constist of nodes and month caption) - we use borders to separate months thats why it has width 2px less then 50% */
  .timelineFlat .t_line_m {
	  margin-top:35px;
	  height:10px;
	  border-left:1px solid transparent;
	  border-right:1px solid #b7b6b6;
	  width:448px;
  }
  
  /* month on the right side - has left set at 459 so border would overlap border from first element (to evade duplicated borders) */
  .timelineFlat .t_line_m.right {
	  left:449px;
	  width:449px;
	  border-left:1px solid #b7b6b6;
	  border-right:1px solid transparent;
  }
  
  /* month caption */
  .timelineFlat h4.t_line_month {
	  font-family: Montserrat;
	  font-size: 12px;
	  margin:-30px 0 0;
	  color:#b7b6b6;
  }
  
  
  /* node on the timeline */
  .timelineFlat a.t_line_node {
	  text-decoration:none;
	  padding:38px 0 4px;
	  font-family: Montserrat;
	  height:10px;
	  font-size:12px;
	  top:-25px;
	  position: relative;
	  color:#b7b6b6;
  }
  .timelineFlat a.t_line_node:after {
	  content: "";
	  border-radius: 22px;
	  height: 10px;
	  width: 10px;
	  border: 2px solid #ffffff;
	  position: absolute;
	  top: 23px;
	  left: 50%;
	  margin: 0 0 0 -7px;
	  background:#dd5555;
  }
  .timelineFlat a.t_line_node.active {
	  color:#dd5555;
  }
  
  .timelineFlat a.t_line_node.active:after {
	  border: 2px solid #b7b6b6;
  }
  
  /* node description */
  .timelineFlat .t_node_desc {
	  white-space: normal !important;
	  top:-50px;
	  opacity: 0;
	  filter: alpha(opacity=0);
	  left: 50%;
	  color:#fff;
	  display: inline-block !important;
	  position: relative;
	  transition:top 200ms, opacity 500ms;
	  -webkit-transition:top 200ms, opacity 500ms;
	  -moz-transition:top 200ms, opacity 500ms;
  }
  
  .timelineFlat a.t_line_node:hover .t_node_desc {
	  top:0;
	  opacity: 1;
	  filter: alpha(opacity=100);
  }
  
  .timelineFlat .t_node_desc span {
	  white-space: nowrap;
	  margin-left: -50%;
	  margin-right: 50%;
	  margin-top: -16px;
	  display: block !important;
	  padding:8px;
	  border-radius: 3px;
	  background: #dd5555;
	  position: relative;
  }
  .timelineFlat .t_node_desc span:after {
	  content: "";
	  width: 0;
	  height: 0;
	  display: block;
	  position: absolute;
	  bottom: -10px;
	  border:5px solid transparent;
	  border-top:5px solid #dd5555;
	  left:50%;
	  margin-left: -5px;
  }
  
  
  .timelineFlat #t_line_left,
  .timelineFlat #t_line_right {
	  display: inline-block;
	  font-family: FontAwesome;
	  font-style: normal;
	  font-weight: normal;
	  line-height: 1;
	  -webkit-font-smoothing: antialiased;
	  -moz-osx-font-smoothing: grayscale;
	  cursor:pointer;
	  top:39px;
	  width:14px;
	  height:21px;
	  font-size: 21px;
	  color: #b7b6b6;
	  position: relative;
  }
  
  .timelineFlat #t_line_left:hover,
  .timelineFlat #t_line_right:hover {
	  color: #dd5555;
  }
  
  /* line arrow left */
  .timelineFlat #t_line_left {
	  left:-30px;
  }
  .timelineFlat #t_line_left:after {
	  content: "\f104";
	  position: absolute;
	  right: 0;
	  top:0;
  }
  
  
  /* line arrow right */
  .timelineFlat #t_line_right {
	  right:-30px;
  }
  .timelineFlat #t_line_right:after {
	  content: "\f105";
	  position: absolute;
	  left: 0;
	  top:0;
  }
  
  .timelineFlat {
	  display:none;
  }
  
  .timeline_items_wrapper {
	  position: relative;
	  width: 100%;
	  margin: 10px 0;
  }
  
  /* items container */
  .timelineFlat .timeline_items {
	  padding:0;
  }
  
  /* single item (margines set from javascript) */
  .timelineFlat .item {
	  width:410px;
	  height:410px;
	  background:#eaeaea; 
	  color:#777777;
	  font-size:14px;
	  line-height:14px;
	  position: relative;
  }
  .timelineFlat .item.item_node_hover:before {
	  content: "";
	  position: absolute;
	  height: 4px;
	  background: #dd5555;
	  width: 100%;
	  z-index: 2;
	  top:0;
	  left:0;
  }
  
  
  /* ----------------------------------------- */
  
  /* item details (margines set from javascript) */
  .timelineFlat .item_open {
	  width:410px;
	  height:410px;
	  background:#eaeaea; 
	  position:relative;
	  color:#777777;
	  z-index:2; 
	  
  }
  
  .timelineFlat .item_open h2 {
	  font-family: Montserrat;
	  margin:0 0 10px;
	  padding-top:0;
	  font-size:12px;
	  line-height:12px;
	  color: #dd5555;
  }
  
  /* item details content wrapper (used for animation - shuld have same width as .item_open) */
  .timelineFlat .item_open_cwrapper {
	  width:410px;
	  height:100%;
  }
  
  .timelineFlat .item_open_content {
	  width:100%;
	  height:100%;
	  position:relative;
  }
  
  .timelineFlat .item_open_content .ajaxloader {
	  position:absolute;
	  top:50%;
	  left:50%;
	  margin:-10px 0 0 -100px;
	  
  }
  
  /* ----- content - non-plugin elements ----- */
  .timelineFlat .timeline_open_content {
	  padding:20px;
  }
  .timelineFlat .mCSB_container {
	  margin-right: 16px;
  }
  .timelineFlat .mCS-light-thin > .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar  {
	  background: #dd5555;
  }
  .timelineFlat .mCS-light-thin > .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	  color:#f75f5f;
  }
  .timelineFlat .mCS-light-thin > .mCSB_scrollTools .mCSB_draggerRail {
	  background: #aaaaaa;
  }
  .timelineFlat .mCustomScrollBox > .mCSB_scrollTools {
	  width: 8px;
  }
  .timelineFlat .item_open .t_close {
	  position:absolute;
	  top:20px;
	  right:16px;
	  padding:0 2px 2px 2px;
	  width: 12px;
	  height: 12px;
	  font-size:16px;
	  line-height: 12px;
	  color: #dd5555;
	  cursor:pointer;
	  z-index:2;
	  text-align: center;
	  transition:color 300ms;
	  -webkit-transition: color 300ms;
	  -moz-transition: color 300ms;
  }
  .timelineFlat .item_open .t_close:hover {
	  color:#f75f5f;
  }
  /* ----------------------------------------- */
  
  /* left/right controles */
  .timelineFlat .t_controles {
	  margin:0;
  }
  
  .timelineTouch.timelineFlat .t_left,
  .timelineTouch.timelineFlat .t_right {
	  display: none;
  }
  
  .timelineFlat:hover .t_left,
  .timelineFlat:hover .t_right {
	  opacity: 1;
	  filter: alpha(opacity=100);	
  }
  
  .timelineFlat .t_left,
  .timelineFlat .t_right {
	  position: absolute;
	  display:block;
	  height:100%;
	  width:75px;
	  margin:0;
	  cursor:pointer;
	  top:0;
	  z-index: 10;
	  opacity: 0;
	  filter: alpha(opacity=0);	
	  transition:background-color 300ms, opacity 300ms;
	  -webkit-transition: background-color 300ms, opacity 300ms;
	  -moz-transition: background-color 300ms, opacity 300ms;
  }
  
  
  /* -----------------------------------------------------------------------*/
  /* ------------------------------ RESPONSIVE -----------------------------*/
  /* -----------------------------------------------------------------------*/
  
  
  
  /* --- 768px --- */
  @media screen and (max-width:980px) {
	   .timeline_line {
		  width:680px;
	  }
	  
	  .timelineFlat .t_line_view {
		  width:680px;
	  }
	  
	  .timelineFlat .t_line_m {
		  width: 338px;
	  }
	  .timelineFlat .t_line_m.right {
		  left: 339px;
		  width: 339px;
	  }
  }
  
  
  /* --- 610px --- */
  @media screen and (max-width:767px) {
	  
	   .timeline_line {
		  width:530px;
	  }
	  
	  .timelineFlat .t_line_view {
		  width:1060px;
	  }
	  
	  .timelineFlat .t_line_m {
		  width: 528px;
	  }
	  .timelineFlat .t_line_m.right {
		  left: 530px;
		  width: 528px;
	  }
	  
	  .timelineFlat .t_line_node span {
		  
	  }
	  .timelineFlat .t_node_desc {
		  font-size:8px;
	  }
	  .timelineFlat .t_line_m.right .t_node_desc {
		  right:auto;
		  left:0;
	  }
  }
  
  
  /* --- 300px --- */
  @media screen and (max-width:609px) {
	   .timeline_line {
		  width:240px;
	  }
	  
	  .timelineFlat .t_line_view {
		  width:480px;
	  }
	  
	  .timelineFlat .t_line_m {
		  width: 238px;
	  }
	  .timelineFlat .t_line_m.right {
		  left: 240px;
		  width: 238px;
	  }
	  
	  .timelineFlat .item_open {
		  width:280px;
		  height:390px;
	  }
	  .timelineFlat .item_open img {
		  max-width:280px;
	  } 
	  .timelineFlat .item_open_cwrapper {
		  width:280px;
	  }
  }