.titolo{
	text-align: center;
	margin-bottom: 0;
	padding: 0;
}

.container{
	width: 100%;
	height: auto;
	display: flex;
}

.navigation{
	top: calc(60px + 10px);
	bottom: 10px;
	left: 10px;
	background: linear-gradient(to bottom, #dddddd, #dddddd, #dddddd, #ffffff);
	width: 15%;
	overflow-y: scroll;
	overflow-x: hidden;
	border-radius: 15px;
	position: fixed;
	padding: 10px;
}

.navigation::-webkit-scrollbar {
	width: 0px;
	background: transparent;
}

.navigation h3{
	padding-left: 15px;
	margin: 10px 0;
}

.main{
	/* nav width + nav left + main own margin */
	margin-left: calc(15% + 10px + 35px); 
	width: calc(100% - 15%);
	padding-right: 30px;
}

.es_list{
	list-style: none;
	display: flex;
	flex-direction: column;
}

.es_list a{
	margin: 0;
	padding: 8px 0;
	padding-left: 10%;
	width: 100%;
	border-radius: 15px;
}

.par:hover{
	background: #cccccc;
}

.es_list .active{
	background: var(--codebar);
	color: #fff;
	font-weight: 500;
}

.es_list a{
	color: black;
}

.tag{
	font-size: 0.7em;
	border-radius: 15px;
	padding: 5px 10px;
	background: var(--tagbg);
	color: var(--tagtxt);
	font-weight: 600;
}

.arg_titolo{
	margin: 15px 0;
}

.arg_titolo a{
	cursor: pointer;
}

.code{
	background-color: #e7e9eb;
	padding: 20px;
	margin: 10px 0;
	border-left: 5px solid var(--codebar);
	font-size: 1.2em;
}

.code pre{
	margin: 0;
}

#copied1{
	display: none;
	border-radius: 5px;
	background-color: #aaa;
	box-shadow: 5px 10px 8px #888888;
	padding: 10px;
}

.copycode_div{
	position: relative;
	float: right;
	font-family: 'Roboto', sans-serif;
	font-size: 1rem;
}

.copycode_button{
	height: 1.5rem;
	cursor: pointer;
}

.prevnext{
    display: flex;
    justify-content: space-between;
	margin: 20px;
}

.prevnextbutton{
    background-color: #04bd79;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 5px;
    color: #ffffff;
	text-align: center;
	font-size: 1rem;
}

.prevnextbutton:hover{
	background-color: #059862;
}