@media (min-width: 992px) and (max-width: 1400px) {
	.bio-textLeft {
		padding-right: 60px;
		padding-left: 120px;
		overflow: hidden;
		text-align: right;
		font-size: 120%;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.bio-textLeft {
		padding-right: 0px;
		padding-left: 0px;
		overflow: hidden;
		text-align: right;
		font-size: 120%;
	}
}

@media (max-width: 767px) {
	#portfolioCarousel video {
		aspect-ratio: 16 / 9;
		max-height: none;
	}

	.navbar>.container-fluid {
		justify-content: center;
	}

	.navbar-dark .navbar-toggler {
		border-color: #444;
	}

	.navbar-dark .navbar-toggler:focus {
		background-color: rgba(255, 255, 255, 0.1);
		outline: 0;
	}

	.navbar-nav {
		margin-left: -120px;
		text-align: center;
	}

	.navbar-collapse {
		margin-left: 120px;
	}

	.navbar-text {
		justify-content: center;
	}

	#instructions {
		display: none;
	}

	#canvas{
        display: block !important;
	}

	#game-over {
    width: 70%;
    max-width: 280px;
    max-height: 40vh;
    padding: 20px 15px;
	}
	
	#game-over h1 {
	    font-size: 2em;
	}
	
	#game-over button {
	    font-size: 1.1em;
	}
	
	#game-over a {
	    width: 65px;
	    height: 34px;
	    font-size: 12px;
	    line-height: 34px;
	    margin: 3px;
	}
	
	#game-over-overlay {
    display: none !important;
	}
	
    #game-container {
        margin-top: 56px;
    }
	
    #touch-controls {
        display: flex;
    }
	
	#bio {
	    padding-top: 20px;
	}

	.foto {
    max-width: 50%;
    max-height: 200px;
    width: auto;
    display: block;
    margin: 0 auto;
	}
	
	#bio p {
    margin-bottom: 5px;
	}
	
	.bio-textRight {
		margin-top: 2px;
	}

	.bio-textLeft {
		margin-top: 2px;
		padding-left: 30px;
		overflow: hidden;
		text-align: left;
		font-size: 120%;
	}
	
	#portfolioCarousel .carousel-control-prev,
	#portfolioCarousel .carousel-control-next {
	    top: 10px;
	    bottom: auto;
	    width: 36px;
	    height: 36px;
	    right: 50px;
	    left: auto;
	}
	
	#portfolioCarousel .carousel-control-next {
	    right: 10px;
	    left: auto;
	}
	
	#portfolioCarousel .carousel-control-prev:hover,
	#portfolioCarousel .carousel-control-next:hover {
	    background-color: rgba(255, 255, 255, 0.3);
	    opacity: 1;
	}

	.footer-social {
		padding: 0 0 20px 0;
	}

	.footer-social a {

		margin-left: 30px;
		margin-right: 30px;
		margin-top: 20px;
	}

}
