.main .textAndRoutesNav {
	min-height: 500px;
	justify-content: space-between;
	display: flex;
	margin-top: 10px;
}
.textAndRoutesNav .articleText {
	width: 67%;
	position: relative;
}
.textAndRoutesNav .articleText p {
	padding: 12px 0;
	color: #42474c;
}
.textAndRoutesNav .articleText p.dot {
	padding-left: 15px;
	position: relative;
}
.textAndRoutesNav .articleText p.dot:before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(50% - 3px);
	height: 6px;
	width: 6px;
	background-color: #63d2af;
	border-radius: 100%;
}
.textAndRoutesNav .articleText p.indent {
	text-indent: 15px;
} 
.textAndRoutesNav .articleText p span.bold {
	font-weight: bold;
}	
.textAndRoutesNav .articleText img {
	max-width: 40%;
	padding: 10px;
}
.textAndRoutesNav .articleText img.imgFloatRight {
	float:right;
}
.textAndRoutesNav .articleText img.imgFloatLeft {
	float:left;
}
.textAndRoutesNav .articleText div.lineTextBreak {
	height: 1px;
	width:20%;
	background-color: #56b0d2;
	border: 1px solid #56b0d2;
	margin:15px 0;
}
.textAndRoutesNav .routesNav {
	width: 32%;
	background-color: #ededed;
	position:relative;
	border-radius: 10px;
	padding: 15px 30px;
	height: fit-content;
}
.textAndRoutesNav .routesNav:before {
	content: "";
	position: absolute;
	top: 0;
	width: 0;
	height: 10px;
	left:0;
	transition: width 1s;
	background-color: #56b0d2;
	width: 100%;
	border-top-left-radius: 10px ;
	border-top-right-radius: 10px;
}
.textAndRoutesNav .routesNav > * {
	margin-bottom: 20px;
}
.textAndRoutesNav .routesNav p.currentPage {
	background-color: #63d2af;
}

.textAndRoutesNav .routesNav h2,
.textAndRoutesNav .routesNav h3 {
	color: #56b0d2;
	font-weight: normal;
}
.textAndRoutesNav .routesNav p {
	text-indent: 15px;
	position: relative;
	margin-bottom: 10px;
	border-radius: 5px;
	cursor: pointer;
}
.textAndRoutesNav .routesNav p:hover {
	background-color: #56b0d2;
}
.textAndRoutesNav .routesNav p:before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(50% - 2px);
	height: 4px;
	width: 4px;
	background-color: #56b0d2;
	border-radius: 5px;
	border: solid 1px #56b0d2;
}
.textAndRoutesNav .routesNav p.currentPage:before {
	height: 0;	
	width:0;
	border: 0;
} 
.textAndRoutesNav .routesNav p a {
	text-decoration: none;
	color: #42474c;
	padding: 5px;
	display: block;
}

@media (max-width: 1200px) {
	.textAndRoutesNav {
		flex-direction: column-reverse;
	}
	.textAndRoutesNav .routesNav {
		width: 100%;
		display: flex;
		justify-content: space-around;
		padding: 40px 0 0 0;
	}
	.textAndRoutesNav .routesNav > * {
		margin: 0;
	}
	.textAndRoutesNav .routesNav h2 {
		position: absolute;
		top: 10px;
		left: calc(50% - 75px);
	}
	.textAndRoutesNav .articleText {
		width: 100%;
		padding: 0 10px;
	}
}
@media (max-width: 768px) {
	.textAndRoutesNav .routesNav {
		flex-direction: column;
	}
	.routesNavRoute {
		text-align: center;
	}
	.textAndRoutesNav .routesNav p:before {
		content: none;
	}
	.routesNav h3 {
		text-align: center;
	}
	.textAndRoutesNav .articleText img {
		max-width: 60%;
		min-width: 220px;
	}
}