@media only screen and (min-width: 1401px){
	html {
        box-sizing: border-box;
    }

    *,
    *:before,
    *:after {
        box-sizing: inherit;
      }

    body {
        margin: 0;
		background: black;
		-webkit-user-select: none;
		-moz-user-select: none; 
		-ms-user-select: none; 
		user-select: none;
    }

	@font-face{
		font-family: "BebasNeue";
  		src: url("/data/font/BebasNeue-Regular.ttf") format("truetype");
	}

	@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@200;300;400&display=swap');

	.container-mobile{
		display: none;
	}

	.container {
    	display: flex;
    	min-height: 100vh;
    	overflow: hidden;
		color: white;
    }

    .carousel {
    	display: flex;
    }

    .item {
        width: 100vw;
        display: flex;
        flex-direction: column;
        position: relative;
        transition: all 2s;
        font-family: 'Source Code Pro', monospace;
        font-size: 16px;
    }

	img.picture_left{
		bottom: 0;
		height: 892px;
		right: -251px;
		position: absolute;
		left: -202px ;
	}

	.controls{
		position: relative;
		bottom: 0;
	}

	img.picture_right{
		bottom: 0;
		height: 892px;
		right: -251px;
		position: absolute;
		align-self: end;
		animation-name: picture;
		animation-duration: 2s;
	}

	@keyframes picture{
		from{right: -500px;}
		to{right: -251px;}
	}
	
	@keyframes button_seta_direita_inicio{
		from{
			color: black;
			padding-top: 50vh;
		}
		to{color: rgb(150,150,150);}
	}

	.button_seta_direita_inicio{
		background: none;
		position: fixed;
		margin-left: 60%;
		border: none;
		padding-top: 97vh;
		height: 100%;
		width: 40%;
		bottom: 0;
		cursor:pointer;
		animation-name: button_seta_direita_inicio;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	@keyframes animation_avancar_voltar{
		0%{color: black;}
		50%{color: rgb(150,150,150);}
	}

	.button_seta_esquerda{
		background: none;
		position: fixed;
		margin-left:0;
		height: 100vh;
		width: 40%;
		padding-top: 97vh;
		bottom: 0;
		text-align: end;
		cursor:pointer;
		color: black;
		animation-name: animation_avancar_voltar;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	.button_seta_direita{
		background: none;
		position: fixed;
		margin-left: 60%;
		height: 100vh;
		width: 40%;
		padding-top: 97vh;
		bottom: 0;
		cursor:pointer;
		color: black;
		animation-name: animation_avancar_voltar;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	h1{
		position: relative;
		margin-top: 60px;
		margin-left: 60px;
		margin-bottom: 0px;
		color: white;
		font-family: BebasNeue;
		font-weight: normal;
		line-height: 0px;
		font-size: 70px;
		animation-name: home;
		animation-duration: 3s;
	}

	h2{
		position: relative;
		margin-left: 60px;
		margin-bottom: 0px;
		color: white;
		font-weight: normal;
		font-size: 28px;
		font-family: 'Source Code Pro', monospace;
		animation-name: home;
		animation-duration: 3s;
	}

	a.link{
		color:white;
		text-decoration: none;
		animation-name: home;
		animation-duration: 3s;
		cursor: pointer;
	}

	a.link:hover{
		color:white;
		text-decoration: none;
		animation-name: home;
		animation-duration: 3s;
		color: rgb(255,255,255, .5);
		transition: 1s;
	}

	.container_home{
		animation-name: home;
		animation-duration: 3s;
		margin-left: 60px;
	}

	.button_copy{
		padding: 0px;
		background: none;
		border: none;
		cursor:pointer;
		color: white;
		font-family: 'Source Code Pro', monospace;
        font-size: 16px;
		animation-name: home;
		animation-duration: 3s;
	}

	.button_copy:hover{
		background: none;
		border: none;
		cursor:pointer;
		color: rgb(255,255,255, .5);
		transition: 1s;
		font-family: 'Source Code Pro', monospace;
        font-size: 16px;
	}


	@keyframes home{
		from{color: black;}
		to{color: white;}
	}

	.sintese{
		position: absolute;
		top: 50vh;
		margin-top: -135px;
		width: 854px;
		height: 270px;
		text-align: justify;
		right: 60px;
		font-family: 'Source Code Pro', monospace;
	}

	.classh2{
		top: 10vh;
		position: relative;
		text-align: center;
		margin-bottom: 0px;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-size: 28px;
	}

	.competencias{
		position: absolute;
		display: flex;
		top: 50vh;
		margin-top: -130px;
		width: 900px;
		margin-left: 60px;
	}

	.competencias01{
		color: white;
	}

	.competencias02{
		color: white;
		margin-left: 60px;
	}

	.formacao{
		position: absolute;
		top: 50vh;
		margin-top: -192px;
		align-self: end;
		margin-right: 5%;
		width: 45%;
		text-align: justify;
	}

	.classh2_direita{
		position: relative;
		padding-top: 10vh;
		margin-bottom: 0px;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-weight: normal;
		font-size: 28px;
	}

	::-webkit-scrollbar-track {
		background-color: none;
	}
	
	::-webkit-scrollbar {
		height: 2px;
		width: 2px;
	}
	::-webkit-scrollbar-thumb {
		
		background: white;
	}

	.container_experiencia{
		margin-left: 60px;
		margin-top: 12vh;
		height: 60vh;
		width: 760px;
		overflow: auto;
		direction: rtl;
		z-index: 1;
	}

	.experiencia{
		direction: initial;
		margin-left: 20px;
	}

	.certificacao{
		position: absolute;
		top: 50vh;
		margin-top: -60px;
		margin-right: 5%;
		align-self:end;
	}

}

@media only screen and (max-width: 1400px){
	html {
        box-sizing: border-box;
    }

    *,
    *:before,
    *:after {
        box-sizing: inherit;
      }

    body {
        margin: 0;
		background: black;
		-webkit-user-select: none;
		-moz-user-select: none; 
		-ms-user-select: none; 
		user-select: none;
    }

	@font-face{
		font-family: "BebasNeue";
  		src: url("/data/font/BebasNeue-Regular.ttf") format("truetype");
	}

	@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@200;300;400&display=swap');

	.container-mobile{
		display: none;
	}
	
	.container {
    	display: flex;
    	min-height: 100vh;
    	overflow: hidden;
		color: white;
    }

    .carousel {
    	display: flex;
    }

    .item {
        width: 100vw;
        display: flex;
        flex-direction: column;
        position: relative;
        transition: all 2s;
        font-family: 'Source Code Pro', monospace;
        font-size: 16px;
    }

	img.picture_left{
		bottom: 0;
		height: 717px;
		position: absolute;
		left: -202px ;
	}

	.controls{
		position: relative;
		bottom: 0;
	}

	img.picture_right{
		bottom: 0;
		height: 717px;
		right: -202px;
		position: absolute;
		align-self: end;
		animation-name: picture;
		animation-duration: 2s;
	}

	@keyframes picture{
		from{right: -500px;}
		to{right: -202px;}
	}
	
	@keyframes button_seta_direita_inicio{
		from{
			color: black;
			padding-top: 50vh;
		}
		to{color: rgb(150,150,150);}
	}

	.button_seta_direita_inicio{
		background: none;
		position: fixed;
		margin-left: 60%;
		border: none;
		padding-top: 97vh;
		height: 100%;
		width: 40%;
		bottom: 0;
		cursor:pointer;
		animation-name: button_seta_direita_inicio;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	@keyframes animation_avancar_voltar{
		0%{color: black;}
		50%{color: rgb(150,150,150);}
	}

	.button_seta_esquerda{
		background: none;
		position: fixed;
		margin-left:0;
		height: 100vh;
		width: 40%;
		padding-top: 97vh;
		bottom: 0;
		text-align: end;
		cursor:pointer;
		color: black;
		animation-name: animation_avancar_voltar;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	.button_seta_direita{
		background: none;
		position: fixed;
		margin-left: 60%;
		height: 100vh;
		width: 40%;
		padding-top: 97vh;
		bottom: 0;
		cursor:pointer;
		color: black;
		animation-name: animation_avancar_voltar;
		animation-duration: 5s;
		animation-iteration-count: infinite;
	}

	h1{
		position: relative;
		margin-top: 60px;
		margin-left: 60px;
		margin-bottom: 0px;
		color: white;
		font-family: BebasNeue;
		font-weight: normal;
		line-height: 0px;
		font-size: 70px;
		animation-name: home;
		animation-duration: 3s;
	}

	h2{
		position: relative;
		margin-left: 60px;
		margin-bottom: 0px;
		color: white;
		font-weight: normal;
		font-size: 28px;
		font-family: 'Source Code Pro', monospace;
		animation-name: home;
		animation-duration: 3s;
	}

	a.link{
		color:white;
		text-decoration: none;
		animation-name: home;
		animation-duration: 3s;
		cursor: pointer;
	}

	a.link:hover{
		color:white;
		text-decoration: none;
		animation-name: home;
		animation-duration: 3s;
		color: rgb(255,255,255, .5);
		transition: 1s;
	}

	.container_home{
		animation-name: home;
		animation-duration: 3s;
		margin-left: 60px;
	}

	.button_copy{
		padding: 0px;
		background: none;
		border: none;
		cursor:pointer;
		color: white;
		font-family: 'Source Code Pro', monospace;
        font-size: 16px;
		animation-name: home;
		animation-duration: 3s;
	}

	.button_copy:hover{
		background: none;
		border: none;
		cursor:pointer;
		color: rgb(255,255,255, .5);
		transition: 1s;
		font-family: 'Source Code Pro', monospace;
        font-size: 16px;
	}


	@keyframes home{
		from{color: black;}
		to{color: white;}
	}

	.sintese{
		position: absolute;
		margin-top: 20vh;
		width: 45%;
		text-align: justify;
		right: 5%;
		font-family: 'Source Code Pro', monospace;
	}

	.classh2{
		position: relative;
		padding-top: 10vh;
		text-align: center;
		margin-bottom: 0px;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-size: 28px;
	}

	.competencias{
		position: absolute;
		top: 50vh;
		margin-top: -136px;
		display: flex;
		margin-left: 60px;
	}

	.competencias01{
		color: white;
	}

	.competencias02{
		color: white;
		margin-left: 60px;
	}

	.formacao{
		align-self: end;
		margin-right: 5%;
		width: 45%;
		text-align: justify;
	}

	.classh2_direita{
		position: relative;
		padding-top: 60px;
		margin-bottom: 0px;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-weight: normal;
		font-size: 28px;
	}

	.exp_formacao{
		height: 300px;
		overflow: auto;
		padding-right: 8px;
	}

	::-webkit-scrollbar-track {
		background-color: none;
	}
	
	::-webkit-scrollbar {
		height: 2px;
		width: 2px;
	}
	::-webkit-scrollbar-thumb {
		
		background: white;
	}

	.container_experiencia{
		margin-left: 60px;
		margin-top: 60px;
		width: 760px;
		height: 347px;
		overflow: auto;
		direction: rtl;
		z-index: 1;
	}

	.experiencia{
		direction: initial;
		margin-left: 20px;
	}

	.certificacao{
		position: absolute;
		top: 50vh;
		margin-top: -75px;
		margin-right: 5%;
		align-self:end;
	}

	
}

@media only screen and (max-width: 768px){
	@font-face{
		font-family: "BebasNeue";
  		src: url("/data/font/BebasNeue-Regular.ttf") format("truetype");
	}

	@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@200;300;400&display=swap');

	body{
		background-color: black;
		-webkit-user-select: none; 
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		font-family: 'Source Code Pro', monospace;
        font-size: 16px;
	}

	.container{
		display: none;
	}

	.container-mobile{
    	display: block;
    	height: 100%;
    	overflow: hidden;
		color: white;
    }

	.container_home{
		position: fixed;
		background: black;
		margin-left: 0;
		height: 410px;
		width: 100vw;
	}

	@keyframes picture{
		from{right: -500px;}
		to{right: -130px;}
	}

	img.picture_right{
		top: 0;
		margin-top: -59px;
		height: 469px;
		right: -130px;
		position: fixed;
		animation-name: picture;
		animation-duration: 2s;
	}

	h1{
		padding: 0;
		margin-top: 0px;
		margin-left: 2%;
		color: white;
		font-family: BebasNeue;
		font-weight: normal;
		line-height: 0px;
		font-size: 70px;
		animation-name: home;
		animation-duration: 3s;
	}

	h2{
		position: relative;
		margin-left: 2%;
		max-width: 85%;
		margin-bottom: 0px;
		color: white;
		font-weight: normal;
		font-size: 28px;
		font-family: 'Source Code Pro', monospace;
		animation-name: home;
		animation-duration: 3s;
		filter: drop-shadow(2px 4px 6px black);
	}

	.button_copy {
	    padding: 0px;
		margin-left: 2%;
	    background: none;
	    border: none;
	    cursor: pointer;
	    color: white;
	    font-family: 'Source Code Pro', monospace;
	    font-size: 16px;
	    animation-name: home;
	    animation-duration: 3s;
	}

	a.link{
		margin-left: 2%;
		color:white;
		text-decoration: none;
		animation-name: home;
		animation-duration: 3s;
		cursor: pointer;
	}

	.classh2_inicio{
		position: static;
		margin-top: 430px;
		margin-left: 2%;
		margin-bottom: 0px;
		text-align: initial;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-size: 28px;
		animation-name: home;
	    animation-duration: 3s;
	}

	.classh2{
		position: static;
		padding: 0px;
		margin-top: 60px;
		margin-left: 2%;
		margin-bottom: 0px;
		text-align: initial;
		color: white;
		font-family: 'Source Code Pro', monospace;
		font-size: 28px;
	}

	.sintese{
		position: static;
		width: 96%;
		margin-top: 60px;
		margin-left: 2%;
		animation-name: home;
	    animation-duration: 3s;
	}

	.competencias{
		position: static;
		width: 96%;
		margin-top: 60px;
		margin-left: 2%;
	}

	.formacao{
		position: static;
		width: 96%;
		margin-top: 60px;
		margin-left: 2%;
	}

	.container_experiencia{
		position: static;
		width: 96%;
		margin-top: 60px;
		margin-left: 2%;
		height: auto;
	}

	.certificacao{
		position: static;
		width: 96%;
		margin-top: 60px;
		margin-left: 2%;
		padding-bottom: 50px;
	}

	.experiencia{
		margin-left: 0;
	}

	

}

@media only screen and (max-width: 425px){
	@font-face{
		font-family: "BebasNeue";
  		src: url("/data/font/BebasNeue-Regular.ttf") format("truetype");
	}

	@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@200;300;400&display=swap');

	body{
		background-color: black;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	.container{
		display: none;
	}
}