/*     <-------- CSS/CUSTOM.CSS -------->     */

	/* Fonts */
    
    
		/* google font imports */
        
        @import url('https://fonts.googleapis.com/css2?family=Chewy&family=Just+Another+Hand&family=Rancho&display=swap');

		/* google font imports */

		.fa {
			font-size: .8em;
			padding: 0 20px;}
        
	/* Fonts */

	/* ie10 viewport bug workarround */
		@-ms-viewport{width:device-width;}
		@-o-viewport{width:device-width;}
		@viewport{width:device-width;}
	/* ie10 viewport bug workarround */

	/* Static Generic Material */

		/* Shortcuts */	
			.floatleft{float:left}
			.floatright{float:right}
			.clr{clear:both}
			.center{text-align:center}
			.right{text-align:right}
			.left{text-align:left}
			.posRel{position:relative}
			.posAbs{position:absolute}
		/* Shortcuts */

	/* Static Generic Material */
		img{
			max-width:100%;
			display: block;}
		h1{
			font-family: 'Just Another Hand';
			color:#2d3431;}
		p{
			color:#2d3431;
			font-family: 'Just Another Hand';}

		a,a:hover,a:focus,a:active,a:visited{text-decoration:none !important;outline-offset: 0px;}

		.container-fluid,.container{margin:0;padding:0;width:100%;}


	/* Static Generic Material */

	/* Customizable Generic Material */
	
		/* Structural */
		#wrapper{
			background: #eab089;
			width:100%;
			height:100vh;
			position:relative;
			display:block;
			margin:0 auto;
			padding:0;
			overflow: hidden;
		}


		#home{
			width:90%;
			height:100vh;
			position:relative;
			margin:5% auto;
			padding:0;
		}

		.leftBg{
			background: transparent url("../images/bg/bg-left.png");
			background-repeat:no-repeat;
			background-position:left bottom; 
			background-size: contain;
			width: 100%;
			height: 80vh;
			margin: 20vh 0 0;}
		.rightBg {
			background: transparent url("../images/bg/bg-right.png");
			background-repeat:no-repeat;
			background-position:right top; 
			background-size: contain;
			width: 100%;
			height: 80vh;
			margin: 0 0 20vh ;}


		.arrowTop {
			font-family: 'Rancho';
			line-height: .6;
			color: #79ffa0;
			text-align: left;
			font-size: 10.8vw;
			letter-spacing:  .03em;
			padding: 0;
			margin: 0;}
		.titleBig{
			line-height: 1;
			font-size: 7vw;
			text-align: left;
			width: 95%;
			margin: 0 0 0 13%;}
		.titletext01{
			line-height: 1;
			font-size: 4.5vw;
			text-align: left;
			width: 95%;
			margin: 0 0 0 13%;}
		.titletext02{
			line-height: 1;
			padding-top: 20vh;
			font-size: 4.5vw;
			text-align: center;
			width: 92.5%;
			margin: 0 auto 0 9%;}
		.arrowBottom{
			font-family: 'Rancho';
			line-height: .9;
			color: #79ffa0;
			text-align: right;
			font-size: 10.8vw;
			letter-spacing:  .03em;
			padding: 0;
			margin: 0;}
		.textInstagram{
			line-height: 1;
			font-family: 'Chewy';
			color:#2d3431;
			font-size: 3vw;
			text-align: center;
			padding: 0;
			margin: 0;}

		a, a:hover, a:focus, a:active, a:visited, a:focus, a:hover {
			color:#2d3431;
			-webkit-transition:all 0.5s ease;
			-moz-transition:all 0.5s ease;
			-o-transition:all 0.5s ease;
			transition:all 0.5s ease;}

	span.fa-instagram{
			color:#2d3431;
			padding: 3px 5px;
			border-radius: 12%;
			-webkit-transition:all 0.5s ease;
			-moz-transition:all 0.5s ease;
			-o-transition:all 0.5s ease;
			transition:all 0.5s ease;}
        
		span.fa-instagram:hover {
			color:#FFF;
			background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
			-webkit-transition:all 0.5s ease;
			-moz-transition:all 0.5s ease;
			-o-transition:all 0.5s ease;
			transition:all 0.5s ease;}
		
		/* Structural */



	/* Customizable Generic Material */

		

	/* Responsive */

		/* Big Screens */
			@media screen and (min-width: 1920px) {
			}
		/* Big Screens */


		/* Tablets y PC */


			@media screen and (max-width: 1366px), 
       				screen and (max-height: 680px){  
						.titletext02 {padding-top: 11vh;}
			}


			@media screen and (max-width: 1280px){  
			}

			@media screen and (max-width: 1112px){  
			}

			@media screen and (max-width: 1049px){  
			}

			@media screen and (max-width: 1024px){  
				.leftBg{
					height: 70vh;
					margin: 30vh 0 0;}
				.rightBg {
					height: 70vh;
					margin: 0 0 30vh ;}
			}

			@media screen and (max-width: 800px){
			}

			@media screen and (max-width: 768px){
				.leftBg{
					height: 50vh;
					margin: 50vh 0 0;}
				.rightBg {
					height: 50vh;
					margin: 0 0 50vh ;}
				
				.arrowTop {margin: 10vh 0 0;font-size:10vw;}
				.arrowBottom {font-size:10vw;}
				.titleBig {font-size: 11vw;margin: 0 0 0 12.5%;}
				.titletext01 {font-size: 7vw;margin: 0 0 0 12.5%;}
				.titletext02 {font-size: 7vw;padding-top: 20vh;}
				.fa {padding: 0 10px;}
			}
		/* Tablets y PC */

			@media screen and (max-width: 767px){
			}

		/* Celu horizontal */
			@media screen and (max-width:736px){  
			}

			@media screen and (max-width:667px){  
			}

			@media screen and (max-width:640px){  
			}

			@media screen and (max-width:568px){  
			}
		/* Celu horizontal */

        
            @media screen and (max-height: 575px){
            }

		/* Celu vertical */
			@media only screen and (max-width:480px){
				.leftBg{
					height: 40vh;
					margin: 60vh 0 0;}
				.rightBg {
					height: 40vh;
					margin: 0 0 60vh ;}
				
				.arrowTop {margin: 17vh 0 0;font-size:8vw;}
				.arrowBottom {font-size:8vw;}
				.titleBig{font-size: 13vw;}
				.titletext01{
					font-size: 9vw;}
				.titletext02{
					padding-top:  14vh;
					font-size: 9vw;}
				.textInstagram{
					font-size: 4vw;}
				.fa {padding: 0 8px;}
			}

			@media screen and (max-width: 414px){  
				.arrowTop {font-size:7.5vw;}
				.arrowBottom {font-size:7.5vw;}
			}

			@media screen and (max-width: 375px){  
				.arrowTop {font-size:7vw;}
				.arrowBottom {font-size:7vw;}
				.fa {padding: 0 5px;}
			}

			@media screen and (max-width: 320px){  
			}
		/* Celu vertical */

	/* Responsive */