/* Sidebar-responsive css
---------------------------------------- */

@media (max-width: 99999px) {
	.sidebar-responsive {
		display: none;
	}

	.sidebar-left-responsive {
		display: none;
	}

	.sidebar-right-responsive {
		display: none;
	}

	.menutitle-sidebar {
		display: none;
	}

	#menutitle-sidebar {
		display: none;
	}
}

@media (max-width: 1200px) {
	.sidebar-left-responsive {
		display: block;
		margin-left: 5%;
		width: 35%;
	}

	.sidebar-right-responsive {
		display: block;
		margin-top: -592px;
		margin-bottom: 4em;
		margin-left: 60%;
		width: 35%;
	}

	.bgi-sidebar {
		padding: 5px 0px 5px 2px;
	}

	.menutitle-sidebar {
		display: block;
		background-color: #b7deed;
		background-image: -moz-linear-gradient(-45deg,  #b7deed 2%, #070403 26%, #070403 26%, #1d5e80 50%, #070403 67%, #b7deed 88%, #070403 100%);
		background-image: -webkit-linear-gradient(-45deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		background-image: linear-gradient(135deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#070403',GradientType=1 );
		border: 2px solid #0076b1;
		border-radius: 6px;
		color: #ffffff;
		cursor: pointer;
		float: left;
		font-size: 1.1em;
		font-weight: bold;
		margin-bottom: 15px;
		margin-left: 45%;
		margin-top: 2em;
		padding: 3px 25px;
		text-align: center;
		width: 55px;
	}

	.menutitle-sidebar:hover {
		background-color: #b7deed;
		background-image: -moz-linear-gradient(-55deg,  #b7deed 2%, #070403 26%, #070403 26%, #1d5e80 50%, #070403 67%, #b7deed 88%, #070403 100%);
		background-image: -webkit-linear-gradient(-55deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		background-image: linear-gradient(155deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#070403',GradientType=1 );
		text-decoration: underline;
		color: #d7d7d7;
	}
}

@media (max-width: 880px) {
	.menutitle-sidebar {
		margin-left: 44%;
	}
}

@media (max-width: 780px) {
	.sidebar-responsive {
		display: block;
		margin-left: 25%;
		margin-bottom: 1em;
		width: 50%;
	}

	.menutitle-sidebar {
		margin-left: 42%;
	}

	#menutitle-sidebar {
		display: block;
		background-color: #b7deed;
		background-image: -moz-linear-gradient(-45deg,  #b7deed 2%, #070403 26%, #070403 26%, #1d5e80 50%, #070403 67%, #b7deed 88%, #070403 100%);
		background-image: -webkit-linear-gradient(-45deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		background-image: linear-gradient(135deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#070403',GradientType=1 );
		border: 2px solid #0076b1;
		border-radius: 6px;
		color: #ffffff;
		cursor: pointer;
		float: left;
		font-size: 1.1em;
		font-weight: bold;
		margin-bottom: 15px;
		margin-left: 42%;
		margin-top: 2em;
		padding: 3px 25px;
		text-align: center;
		width: 55px;
	}

	#menutitle-sidebar:hover {
		background-color: #b7deed;
		background-image: -moz-linear-gradient(-55deg,  #b7deed 2%, #070403 26%, #070403 26%, #1d5e80 50%, #070403 67%, #b7deed 88%, #070403 100%);
		background-image: -webkit-linear-gradient(-55deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		background-image: linear-gradient(155deg,  #b7deed 2%,#070403 26%,#070403 26%,#1d5e80 50%,#070403 67%,#b7deed 88%,#070403 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#070403',GradientType=1 );
		text-decoration: underline;
		color: #d7d7d7;
	}
}

@media (max-width: 754px) {
	#menutitle-sidebar {
		margin-left: 42%;
	}
}

@media (max-width: 600px) {
	.sidebar-responsive {
		margin-left: 25%;
	}

	.menutitle-sidebar {
		margin-left: 41%;
	}

	#menutitle-sidebar {
		margin-left: 39%;
	}
}

@media (max-width: 480px) {
	.menutitle-sidebar {
		margin-left: 37%;
	}

	#menutitle-sidebar {
		margin-left: 38%;
	}
}

@media (max-width: 420px) {
	.menutitle-sidebar {
		margin-left: 36%;
	}

	#menutitle-sidebar {
		margin-left: 36%;
	}
}

@media (max-width: 350px) {
	.menutitle-sidebar {
		margin-left: 33%;
	}

	#menutitle-sidebar {
		margin-left: 32%;
	}
}
