html, body {
	margin:0;
	width: 100%;
	font-family: 'Open Sans', sans-serif;
}

html {
	scroll-behavior: smooth;
}

body {
	background-color: #f5f5f5;
}

pre {
	font-family: 'Open Sans', sans-serif;
	white-space: pre-wrap;
  word-wrap: break-word;

}

.nomargin {
  margin:  0 auto;
}

.getinfo {
  cursor: pointer;
}

.padding-40 {
	padding: 40px;
}

.banner {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	height: 300px;
	width: 100%;
}

.tabs {
  height: 100px;
}

.tabs .tab {
  line-height: 100px;
  height: 100px;
}

.tab .material-icons {
  line-height: 100px;
}

.tabs .tab a {
  color: #FFF;
  width: 100%;
  height: 100%;
  padding: 0 24px;
  font-size: 24px;
}

.tabs .tab a:hover, .tabs .tab a.active {
  background-color: #3ac7ba;
  color: #ffffff;
}

/* TIMELINE */
.timeline {
  position: relative;
}

.timeline .timeline-event {
  position: relative;
  padding-top: 5px;
  padding-bottom: 5px;
}

.timeline .timeline-event .timeline-content {
  position: relative;
  width: calc(50% - 50px);
}

.timeline .timeline-event::before {
  display: block;
  content: "";
  width: 2px;
  height: calc(50% - 30px);
  position: absolute;
  background: #d2d2d2;
  left: calc(50% - 1px);
  top: 0;
}

.timeline .timeline-event::after {
  display: block;
  content: "";
  width: 2px;
  height: calc(50% - 30px);
  position: absolute;
  background: #d2d2d2;
  left: calc(50% - 1px);
  top: calc(50% + 30px);
}

.timeline .timeline-event:first-child::before {
  display: none;
}

.timeline .timeline-event:last-child::after {
  display: none;
}

.timeline .timeline-event:nth-child(even) .timeline-content {
  margin-left: calc(50% + 50px);
}

.timeline .timeline-event:nth-child(odd) .timeline-content {
  margin-left: 0;
}

.timeline .timeline-badge {
  display: block;
  position: absolute;
  /*width: 10px;*/
  /*height: 10px;*/
  /*background: #d2d2d2;*/
  top: calc(50% - 11px);
  left: calc(50% - 18px);
  border-radius: 50%;
  text-align: center;
  cursor: default;
}

.timeline .timeline-badge i {
  font-size: 25px;
  line-height: 40px;
}

@media (max-width: 600px) {
	.padding-40 {
		padding: 10px 0;
	}
  .timeline .timeline-event .timeline-content {
    width: calc(100% - 70px);
  }
  .timeline .timeline-event::before {
    left: 19px;
  }
  .timeline .timeline-event::after {
    left: 19px;
  }
  .timeline .timeline-event:nth-child(even) .timeline-content {
    margin-left: 70px;
  }
  .timeline .timeline-event:nth-child(odd) .timeline-content {
    margin-left: 70px;
  }
  .timeline .timeline-badge {
    left: 3px;
  }
}

/*@page {
 size: 29.7cm 42cm; -> that would be a regular A4 page 
 size: 35cm 49.5cm;
}*/

@media print { 
  body {
		background-color: #fff;
		font-size: 0.6em;
	}
	footer {
		display: none;
	}
  h5 {
    font-size: 1rem;
  }
  .print-margin {
    margin: 10px auto !important;
  }
  .getinfo {
    color: rgba(0,0,0,0.87);
  }
	#work, #education, #languages, #personal {
		break-inside: avoid;
    padding: 1px 0 !important;
	}
  #print-work, #print-education, #print-languages, #print-personal {
    margin: 20px auto;
  }
	#education {
		width: 100%;
	}
	.timeline div {
		break-inside: avoid;
	}
	#education div {
		break-inside: avoid;
	} 
	#languages div { 
		break-inside: avoid;
	}
	#personal div {
    break-inside: avoid;
  }
  #print-photo {
  	width: 50%;
  }
  #print-name {
  	width: 50%;
  }
  #print-info {
  	width: 50%;
  }
  #print-about {
  	width: 50%;
  }
  #print-personal, #print-languages {
  	width: 50%;
  	float: left;
  }
  #print-languages {
  	float: right;
  }
	.z-depth-3 {
		box-shadow: none;
		-webkit-box-shadow: none;
	}
	#menu-bar {
		display: none;
	}
	#work #languages #education #personal {
		background-color: #FFF;
		color: #26a69a;
	}

}

/* SOCIAL BUTTONS */
.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block
}

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0.2em 0.5em;
}

.resp-sharing-button {
  border-radius: 5px;
  transition: 25ms ease-out;
  padding: 0.5em 0.75em;
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  display: inline;
}

.resp-sharing-button__icon svg {
  width: 1em;
  height: 1em;
  margin-right: 0.4em;
  vertical-align: top
}

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle
}

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none
}

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none
}

.resp-sharing-button--twitter {
  /*background-color: #55acee*/
}

.resp-sharing-button--twitter:hover {
  /*background-color: #2795e9*/
  color: #2795e9
}

.resp-sharing-button--pinterest {
  background-color: #bd081c
}

.resp-sharing-button--pinterest:hover {
  background-color: #8c0615
}

.resp-sharing-button--facebook {
  /*background-color: #3b5998*/
}

.resp-sharing-button--facebook:hover {
  /*background-color: #2d4373*/
  color: #2d4373
}

.resp-sharing-button--tumblr {
  background-color: #35465C
}

.resp-sharing-button--tumblr:hover {
  background-color: #222d3c
}

.resp-sharing-button--reddit {
  background-color: #5f99cf
}

.resp-sharing-button--reddit:hover {
  background-color: #3a80c1
}

.resp-sharing-button--google {
  background-color: #dd4b39
}

.resp-sharing-button--google:hover {
  background-color: #c23321
}

.resp-sharing-button--linkedin {
  /*background-color: #0077b5*/
}

.resp-sharing-button--linkedin:hover {
  background-color: #046293
}

.resp-sharing-button--email {
  /*background-color: #777*/
}

.resp-sharing-button--email:hover {
  /*background-color: #5e5e5e*/
  color: #5e5e5e
}

.resp-sharing-button--xing {
  background-color: #1a7576
}

.resp-sharing-button--xing:hover {
  background-color: #114c4c
}

.resp-sharing-button--whatsapp {
  /*background-color: #25D366*/
}

.resp-sharing-button--whatsapp:hover {
  /*background-color: #1da851*/
  color: #1da851
}

.resp-sharing-button--hackernews {
background-color: #FF6600
}
.resp-sharing-button--hackernews:hover, .resp-sharing-button--hackernews:focus {   background-color: #FB6200 }

.resp-sharing-button--vk {
  background-color: #507299
}

.resp-sharing-button--vk:hover {
  background-color: #43648c
}

@media (max-width: 768px) {
  .signature {
    font-size: 8px;
    margin-bottom: 6px;
  }
}
@media (min-width: 768px) {
  .signature {
    font-size: 0.6em;
    margin-bottom: 10px;
  }
}