@font-face {
	font-family: Inter-Regular;
	src: url('../fonts/Inter-Regular.ttf');
}
@font-face {
	font-family: Inter-Medium;
	src: url('../fonts/Inter-Medium.ttf');
}
@font-face {
	font-family: Inter-Bold;
	src: url('../fonts/Inter-Bold.ttf');
}

html,body{
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
	font-family: Inter-Regular;
	background-color: #000000;
}

html{
	scroll-behavior: smooth;
}

.bgcolor-white{
	background-color:white;	
}

.bgcolor-black{
	background-color:black;	
}

a:link {
	//color: #ffffff !important;
	color: #ffffff;
}

#loadPy:hover{
  background-color: #ffffff !important;
  color: #000000 !important;
  text-decoration: none !important;
}

.txt-position-mobile, .txt-position-mobile:hover, .txt-position-mobile:active, .txt-position-mobile:visited, .txt-position-mobile:focus {
    text-decoration:none;
}

#link_bio_movil{
    text-decoration:none;
}

p {
    margin-top: 0;
    margin-bottom: 15px !important;
}

#tgreen1{
	color:#7ec142;
}
#tgreen2{
	color:#39a855;
}
#tblue{
	color:#5480c0;
}
#tred{
	color:#e8443a;
}
#torange{
	color:#f59120;
}
#tyellow{
	color:#f5b825;
}

#submitBtn{
	color:white;
	background-color:#1a1a1a;
	border-radius: 0 !important;
	font-family: Inter-Medium !important;
	font-size:15px !important;
	letter-spacing: 3px;
}

.imgtxt-container{
	position: relative;
	//text-align: center;
	color: white;
}

#load{
	display:none;	
}

#plus{
	font-size: 25px;	
}

.plus-open{
	transform: rotate(45deg);
    -ms-transform: rotate(45deg);	 /*  for IE  */
    /* 	for browsers supporting webkit (such as chrome, firefox, safari etc.). */
    -webkit-transform: rotate(45deg);
    display: inline-block;
}

.ab-sec:hover{
	text-decoration:none;
}

/*-----------*/
@media screen and (min-width: 768px) {
	
	a.link-nav:hover{
		background-color: #ffffff !important;
		color: #000000 !important;
		text-decoration: none !important;
	}
	
	.nav-cust{
		background-color:#000000;
		padding-left: 80px;
		padding-right: 80px;
	}	

	#logo {
		font-family: Inter-Regular !important;
		font-size:45px !important;
		color:#ffffff;
		padding-left: 11px !important;  
		padding-right: 11px !important;
		padding-top: 6px !important;
		padding-bottom: 6px !important;
		line-height: 38px;
	}

	/*#proyect_content{
			margin-top:90px;
	}*/

	.container-fluid{
		margin-top:100px;
	}

	.bio-work{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#ffffff;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	
	.ab-sec{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#4d4d4d !important;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.in{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#666666 !important;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.m-bio{
		padding-left:400px;
		padding-right:400px;
	}

	.txt1{
		font-family: Inter-Medium !important;	
		font-size:55px;
		line-height:60px;
	}
	.txt2{
		font-family: Inter-Medium !important;
		font-size:38px;
		color:#4d4d4d;
		line-height:43px;
	}
	.txt3{
		font-family: Inter-Regular !important;
		font-size:21px;
		color:#4d4d4d;
		line-height:30px;
	}
	.txt4{
		font-family: Inter-Regular !important;
		font-size:21px;
		color:#4d4d4d;
		line-height:25px;
	}

	.titles4{
		font-family: Inter-Bold !important;
		font-size:21px;
		color:#4d4d4d;
	}

	#bio{
		display:none;	
	}

	#work{	
		padding-left: 95px;
		padding-right: 95px;
	}

	#loadBtn{
		color:white;
		background-color:#1a1a1a;
		border-radius: 0 !important;
		font-family: Inter-Medium !important;
		font-size:15px !important;
		letter-spacing: 3px;
	}

	.txt-position{
		position: absolute;
		top: 45px;
		left: 0%;
		width: 45%;
		background-color:black;
		padding-top:40px;
		padding-right:80px;
		padding-bottom:40px;
		opacity: 0;
		cursor: default;
	}

	.txt-position-mobile{
		display:none;
	}
	
	.p-info-web{
		display:block;
		cursor:pointer;
		color:#ffffff;
	}	

	.title-proyect{
		font-family: Inter-Medium !important;
		font-size: 30px;
		//color:#111010;
		color:#ffffff;
	}

	.txt-proyect{
		font-family: Inter-Regular !important;
		font-size:17px;
		line-height:21px;
		color:#ffffff;
	}
	
	.txt-credits{
		font-family: Inter-Regular !important;
		font-size:14px;
		line-height:18px;
		color:#ffffff;
	}

	.client-at{
		font-family: Inter-Bold !important;
	}

	.sp{
		height:13px;	
	}

	.sp-txt{
		height:100px;	
	}

	.sp-py{
		height:100px;	
	}

	.sp-txt4{
		height:57px;	
	}
	
	.sp-load{
			height:50px;
	}

	.form-container{
		background-color: #f1f1f1;
		margin-right: 80px;
		margin-left: 80px;
	}

	.form-ctc{
		font-family: Inter-Medium !important;
		font-size:30px;
		color:#4d4d4d;
		padding-bottom:40px;
		line-height: 30px;
	}

	textarea{
		width: 948px;
		height: 216px;
		margin-left: 200px;
		margin-right: 200px;
		margin-bottom:40px;
		border-radius: 0 !important;
	}

	.form-padding-y{
		padding-top:80px;
		padding-bottom: 80px;
	}

	.footer-menu{
		background: #333333;
		text-align: center;
		margin-right: 80px;
		margin-left: 80px;
	}


	.footer-img {
		margin-top:10px;
		margin-bottom:10px;
		margin-left:11px;
	}

	.footer-links {
		float: left;
	}

	.footer-links ul {
		display: inline-block;
		margin-top:10px;
		margin-bottom:10px;
		margin-left:11px;
	}

	.footer-links ul li {
		display: inline-block;
		margin-right:50px;
	}

	.footer-links ul li a{
		font-family: Inter-Medium !important;
		font-size:18px !important;
		color: white;
		letter-spacing: 3px;
	}

	.footer-credits{
		font-family: Inter-Medium !important;
		font-size:12px !important;
		background: #333333;
		//text-align: center;
		margin-right: 80px;
		margin-left: 80px;
		color:white;
	}
	
	/*.txt-position{
		opacity: 0;
	}

	.imgtxt-container{
		cursor: pointer;
	}

	.imgtxt-container:hover > div {
		transition: opacity 2s; 
		-webkit-transition: opacity 2s; 
		cursor: pointer;
		opacity: 1;
	}

	.imgtxt-container:hover > img{
		transition: opacity 2s; 
		-webkit-transition: opacity 2s; 
		opacity: 0.5;
	}*/
	
	.proyect-desc {
		transition: opacity 2s; 
		-webkit-transition: opacity 2s; 
		opacity: 1;
	}

	.proyect-img{
		transition: opacity 2s; 
		-webkit-transition: opacity 2s; 
		opacity: 0.5;
	}
}

@media screen and (max-width: 767px) {
	
	a.link-nav:hover{
		background-color: #ffffff;
		color: #000000;
		text-decoration: none !important;
	}
	
	.nav-cust{
		background-color:#000000;
		padding-left: 10px;
		padding-right: 10px;
	}	

	#logo {
		font-family: Inter-Medium !important;
		font-size:28px !important;
		//color:#333333;
		color:#ffffff;
		padding-left: 11px !important;  
		padding-right: 11px !important;
		padding-top: 6px !important;
		padding-bottom: 6px !important;
	}

	.container-fluid{
		margin-top:100px;
	}

	.bio-work{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#ffffff;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	
	.ab-sec{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#4d4d4d !important;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.in{
		font-family: Inter-Medium !important;
		font-size:15px !important;
		color:#666666 !important;
		letter-spacing: 3px;
		padding-left: 11px;  
		padding-right: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.m-bio{
		padding-left:40px;
		padding-right:40px;
	}
	
	.p-bio{
		padding-left:40px;
		padding-right:40px;
	}

	.txt1{
		font-family: Inter-Medium !important;	
		font-size:35px;
		line-height:40px;
	}
	.txt2{
		font-family: Inter-Medium !important;
		font-size:28px;
		color:#4d4d4d;
		line-height:33px;
	}
	.txt3{
		font-family: Inter-Regular !important;
		font-size:15px;
		color:#4d4d4d;
		line-height:20px;
	}
	.txt4{
		font-family: Inter-Regular !important;
		font-size:15px;
		color:#4d4d4d;
		line-height:20px;
	}

	.titles4{
		font-family: Inter-Bold !important;
		font-size:15px;
		color:#4d4d4d;
	}

	#bio{
		display:none;	
	}

	#work{	
		padding-left: 0px;
		padding-right: 0px;
	}

	#loadBtn{
		color:white;
		background-color:#1a1a1a;
		border-radius: 0 !important;
		font-family: Inter-Medium !important;
		font-size:10px !important;
		letter-spacing: 3px;
	}
	
	#loadPy{
			padding-left: 40px;
	}

	.txt-position{
		display:none;
	}
	
	.p-info-web{
		display:none;
	}
	
	.txt-position-mobile{
		padding-left: 40px;  
		padding-right: 40px;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.title-proyect{
		font-family: Inter-Bold !important;
		font-size: 20px;
		color:#ffffff;
	}

	.txt-proyect{
		font-family: Inter-Regular !important;
		font-size:18px;
		line-height:22px;
		color:#ffffff;
	}
	
	.design{
		font-family: Inter-Regular !important;
		font-size:14px;
		line-height:18px;
		color:#ffffff;
	}
	
	.txt-credits{
		font-family: Inter-Regular !important;
		font-size:14px;
		line-height:18px;
		color:#ffffff;
	}
	
	.client-at{
		font-family: Inter-Bold !important;
	}

	.sp{
		height:13px;	
	}

	.sp-txt{
		height:50px;	
	}

	.sp-py{
		height:50px;	
	}

	.sp-txt4{
		height:35px;	
	}
	
	.sp-load{
			height:20px;
	}

	.form-container{
		background-color: #f1f1f1;
		margin-right: 0px;
		margin-left: 0px;
	}

	.form-ctc{
		font-family: Inter-Medium !important;
		font-size:30px;
		color:#4d4d4d;
		padding-bottom:40px;
		line-height: 30px;
	}

	textarea{
		width: 100%;
		height: 100p%;
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom:40px;
		border-radius: 0 !important;
	}

	.form-padding-y{
		padding-top:80px;
		padding-bottom: 80px;
	}

	.footer-menu{
		background: #333333;
		text-align: center;
		margin-right: 0px;
		margin-left: 0px;
	}

	.footer-img {
		display: block;
		margin: 0 auto;
		margin-top: 10px;
	}
	
	.footer-links {
		float: left;
	}

	.footer-links ul {
		display: inline-block;
		margin-top:10px;
		margin-bottom:10px;
		margin-left:50px;
	}

	.footer-links ul li {
		display: inline-block;
		margin-right:50px;
	}

	.footer-links ul li a{
		font-family: Inter-Medium !important;
		font-size:18px !important;
		color: white;
		letter-spacing: 3px;
	}

	.footer-credits{
		font-family: Inter-Medium !important;
		font-size:12px !important;
		background: #333333;
		text-align: center;
		margin-right: 0px;
		margin-left: 0px;
		color:white;
	}
}

.navbar-toggler {
	padding: 0 !important;
	background-color: transparent;
	border: 0px !important;
}

.hide{
	display:none;	
}