/**

It's best practice to prefix `part-0x` to your CSS class, so you don't
overwrite others' styling, and your styling won't be overwritten by others.

**/

h2 {
  text-align: left;
}

.part1_link {
  color:#F8C331;
}

.part1_xlabel {
    font-family: sans-serif;
    font-size: 11px;
    fill: #ffffff;
}

.part1_ylabel {
    font-family: sans-serif;
    font-size: 11px;
    fill: #ffffff;
}

.part1_point {
  fill: #2ec7c9;
  fill-opacity: 0.5;
}

.part1_position a {
  font-size: 14px;
  text-decoration: none;
  margin-right: 8px;
}

.part1_pg {
  color: #6CB970;
  margin-left: 50px;
}

.part1_sg {
  color: #87D8FB;
}

.part1_sf {
  color: #8EA2F9;
}

.part1_pf {
  color: #E688F6;
}

.part1_c {
  color: #FB8C86;
}

/* .part-01-big-trend-timeseries{
	margin:2rem 6%;
} */

.part1_content{
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap
	justify-content:space-between;
}

.part1_outputs{
	width: 50%;
	margin-right:5%;
	height:100%;
}
.part1_text{
	margin-left:5%;
	width:40%;
	overflow-y:auto;
}

.part1_selection{
	display:flex;
	flex-direction:row;
	justify-content: space-between;
	flex-wrap:nowrap;
}

.part1_slider, .part1_btn {
	width:50%;
}

.part1_slider{
	margin-top:12px;
}

h5{
	color:#F8C331;
}

#play{
	margin-left:45%;
	width:100px;
    font-size: 14px;
    font-weight: bold;
    padding: 15px;
    /* background-color: aquamarine; */
    border-radius: 30px;
    margin-top: 12px;
	border:1px solid white;
	background-repeat: repeat-x;
	background-position: 0 -100%;
	transition: 0.35s ease;
}

#play:hover{
	background-color:#F9D04D;
	cursor:pointer
	border:1px solid #F9D04D;
}