/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 
.avatarimage {
max-width: 96px;
max-height: 96px;
}
.card-trip {
	overflow: hidden;
	position: relative;
  }
  
.card-link {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
}

.card-link:hover {
	
	box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
}

.tavoitelista {
	display: none;
}
.btn-orange {
	background-color: #e4631a;
	color: #FFFFFF;
}

.mainactive { border-bottom: #e4631a solid 5px; }

.saavutettutavoite {
	text-decoration: line-through;
}

.swrapper{
	width: 100%;
	background: #fff;
	border-radius: 5px;
  }
  .swrapperform {
	height: 167px;
	display: flex;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	border-radius: 5px;
	border: 2px dashed #6990F2;
  }
  section .row{
	margin-bottom: 10px;
	background: #E9F0FF;
	list-style: none;
	padding: 15px 20px;
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: space-between;
  }
  section .row i{
	color: #6990F2;
	font-size: 30px;
  }
  section .details span{
	font-size: 14px;
  }
  .progress-area .row .content{
	width: 100%;
	margin-left: 15px;
  }
  .progress-area .details{
	display: flex;
	align-items: center;
	margin-bottom: 7px;
	justify-content: space-between;
  }
  .progress-area .content .progress-bar{
	height: 6px;
	width: 100%;
	margin-bottom: 4px;
	background: #fff;
	border-radius: 30px;
  }
  .content .progress-bar .progress{
	height: 100%;
	width: 0%;
	background: #6990F2;
	border-radius: inherit;
  }
  .uploaded-area{
	max-height: 232px;
	overflow-y: scroll;
  }
  .uploaded-area.onprogress{
	max-height: 150px;
  }
  .uploaded-area::-webkit-scrollbar{
	width: 0px;
  }
  .uploaded-area .row .content{
	display: flex;
	align-items: center;
  }
  .uploaded-area .row .details{
	display: flex;
	margin-left: 15px;
	flex-direction: column;
  }
  .uploaded-area .row .details .size{
	color: #404040;
	font-size: 11px;
  }
  .uploaded-area i.fa-check{
	font-size: 16px;
  }




.grow-wrap {
	/* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */
	display: grid;
  }
  .grow-wrap::after {
	/* Note the weird space! Needed to preventy jumpy behavior */
	content: attr(data-replicated-value) " ";
  
	/* This is how textarea text behaves */
	white-space: pre-wrap;
  
	/* Hidden from view, clicks, and screen readers */
	visibility: hidden;
  }
  .grow-wrap > textarea {
	/* You could leave this, but after a user resizes, then it ruins the auto sizing */
	resize: none;
  
	/* Firefox shows scrollbar on growth, you can hide like this. */
	overflow: hidden;
  }
  .grow-wrap > textarea,
  .grow-wrap::after {
	/* Identical styling required!! */
	padding: 0.5rem;
	font: inherit;
  
	/* Place on top of each other */
	grid-area: 1 / 1 / 2 / 2;
  }


#postformoptions {
    display: none;
}
/*
	Make 
	Wordpress [video] shortcode
	Responsive
	More info : https://cfxdesign.com/how-to-make-the-wordpress-video-shortcode-responsive/
-------------------------------*/
.wp-video, video.wp-video-shortcode, .mejs-container, .mejs-overlay.load {
	width: 100% !important;
	height: 100% !important;
}
.mejs-container {
	padding-top: 56.25%;
}
.wp-video, video.wp-video-shortcode {
	max-width: 100% !important;
}
video.wp-video-shortcode {
	position: relative;
}
.mejs-mediaelement {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.mejs-controls {
	display: none;
}
.mejs-overlay-play {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto !important;
	height: auto !important;
}

.useravataracontainer {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .useravataracontainer:hover .changeavatar {
    display: block;
  }
a.changeavatar {
  position: absolute;
  font-size: 50px;
  color: rgba(0,0,0,0.6);
  z-index: 99;
  display: none;
}

blockquote {
    border-radius: 10px;
    background: #f2f2f2;
    padding: 20px;
    font-style: italic;
  }

