@import url('https://fonts.googleapis.com/css2?family=Bitter&family=Suez+One&display=swap');

body,html{
	width: 100%;
	height: 100%;

}
.row{
 	margin: 0%;
 	padding: 0%;
 	justify-content: center;
}

/*** LANGUGE GOOGLE ***/

	.active-lang{
		position: absolute;
		top: 10px;
		right: 20px;
		cursor: pointer;
	}
	
	.lang-esp{
		display: none;
	}

/*** INICIO ***/

	.container-sections{
		width: 100%;
		height: 100%;
		margin: 0% 0% 0% 0%;
		padding: 0% 0% 0% 0%;
		background-color: #fff;
		display: flex;
		position: relative;
	}

	.body-coontent{
		width: 100%;
		padding: 0%;
		margin: auto;
		position: relative;
	}

	.body-lateral-content{
		width: 0%;
		height: 100%;
		padding: 0%;
		background-color: #ffff;
		margin: auto;
		position: absolute;
		display: flex;
		top: 0%;
		right: 0%;
		opacity:0;
		transition: 0.8s;
	}

	.body-id{
		background-color: #0000;
	}

	.dicard-logo{
		position: absolute;
		font-family: 'Bitter', serif;
		bottom: 0.5%;
		right: 1%;
		color: #333;
		font-size: 12px;
		letter-spacing: 1px;
	}

	.dicard-logo:hover{
		color:#fff;
	}

	/*** ETERPRISE LOGO ***/

		.enterprise-logo{
			margin: auto;
			padding: 0%;
			display: flex;
			align-items: center;
		}

		.enterprise-logo img{
			margin: 5% auto;
		    padding: 0%;
		    width: 70%;
		    cursor: pointer;
		}

		@media(max-width:720px){
			.enterprise-logo img{
				
			}
		}

	/*** PICTURE **/

		.picture-id{
			margin: auto;
			width: 100%;
			padding: 0%;
			display: flex;
		}

		.picture-id img{
			margin: 0% auto;
			padding: 0%;
			width: 200px;
			height: 200px;
			border-radius: 100%;
			cursor: pointer;
			border: 4px solid #f00100;
			box-shadow: 0px 0px 10px #0006;

		}

		@media(max-width:720px){
			.picture-id img{
				width: 200px;
				height: 200px;
				border: 3px solid #f00100;
			}
		}

	/*** INFO ***/

		.info-id{ 
			width: 100%;
			margin: 0%;
			padding: 0%;
		}

		.info-id h1{
			font-family: 'Suez One', serif;
			width: 100%;
			margin: 5% auto 0% auto;
			padding: 0%;
			text-align: center;
			font-size: 30px;
			color: #0188f4;
			letter-spacing: 0.5px;
		}

		.info-id h2{
			font-family: 'Bitter', serif;
			width: 100%;
			margin: 0% auto 0% auto;
			padding: 0%;
			text-align: center;
			font-size: 22px;
			color: #333;
			letter-spacing: 0.5px;
		}

		.info-id h3{
			font-family: 'Bitter', serif;
			width: 100%;
			margin: 0% auto 0% auto;
			padding: 0%;
			text-align: center;
			font-size: 16px;
			color: #333;
			letter-spacing: 0.5px;
		}

		.qr-img{
			width: 50%;
    		margin: 0 25%;
		}

	/*** SERVICES ***/

		.descserv{
			display: none;
		}

		.services-id{
			width: 100%;
			margin: 0%;
			padding: 0%;
			text-align: center;
		}

		.services-id button{
			font-family: 'Suez One', serif;
		    width: 60%;
		    margin: 5% auto;
		    padding: 0%;
		    text-align: center;
		    font-size: 22px;
		    color: #ffffffeb;
		    background-color: #f00100;
		    border-radius: 5px;
		    letter-spacing: 1.8px;
		    border: none;
		    outline: none;
		    cursor: pointer;
		}

		.service-list{
			list-style: none;
		    margin: 0;
		    padding: 0 0 0 15px;
		    font-size: 18px;
		    font-family: 'Bitter', serif;
		}

		.service-list > li{
		  position: relative;
		}

		.service-list > li::before{
			content: '•';
		    color: #0188f4;
		    position: absolute;
		    left: -15px;
		    top: -9px;
		    font-weight: bold;
		    font-size: 27px;
		}

	/*** CONTACT ***/

		.contact-id{
			width: 100%;
			margin: 5% 0% 0% 0%;
			padding: 0%;
			text-align: center;
		}

		.contact-id ul{
			width: 100%;
			margin: 0%;
			padding: 0%;
			display: flex;
			list-style: none;
			justify-content: center;
		}

		.contact-id li{
			width: 50px;
			height: 50px;
			display: flex;
			background-color: #0000;
			margin: 0% 2%;
			border-radius: 5px;
		}

		.contact-id i{
			margin: auto;
		    font-size: 30px;
		    color: #333333;
		}
		
	/*** LATERAL CONTENT ***/

		.laterl-content-resume{
			margin: auto;
			width: 100%;
			height: 100%;
			padding: 0%;
			
		}

		.active-lateral-content{
			display: flex;
			width: 100%;
			opacity: 1;
			transition: 0.8s;
		}

		.row-lateral-content{
			display: none;
			margin: auto;
			height: 100%;
			width: 100%;
		}

		.close{
			color: #333;
		    position: absolute;
		    right: 10%;
		    top: 2%;
		    z-index: 2;
		    cursor: pointer;
		}


		.active-row-lateral-content{
			display: block;
		}

	/*** RESUME CONTENT ***/

		.resume-content{
			margin: auto;
			width: 100%;
			height: 100%;
			padding: 0%;
			display: none;
		}

		.resume-content h1{
			font-family: 'Suez One', serif;
			width: 100%;
			letter-spacing: 0.5px;
 			margin: auto;
 			color: #0188f4;
 			text-align: center;
 			font-size: 32px;
		}

		.resume-content h2{
			font-family: 'Bitter', serif;
			width: 100%;
			letter-spacing: 0.5px;
 			margin: auto;
 			text-align: center;
 			color: #333;
 			font-size: 22px;
		}

		.resume-content p{
			font-family: 'Bitter', serif;
		    width: 100%;
		    padding: 5% 5% 5% 5%;
		    letter-spacing: 0.5px;
		    margin: auto;
		    text-align: center;
		    color: #333;
		    font-size: 1.2em;
		}

	/*** SERVICES CONTENT ***/

		.services-content, .services2-content{
			margin: auto;
			width: 100%;
			height: 100%;
			padding: 0%;
			display: none;
		}

		.services-content h2{
			font-family: 'Bitter', serif;
		    width: 100%;
		    letter-spacing: 1.5px;
		    margin: 0px auto 15px auto;
		    padding: 10px 15px;
		    text-align: center;
		    color: #fff;
		    font-size: 1.5em;
		    line-height: 30px;
		    cursor: pointer;
		    font-weight: bold;
		    background: #4d90fe;
		    border-radius: 5px;
		}

		.services-content h2>ol{
			font-family: 'Bitter', serif;
		    width: 100%;
		    list-style: none;
		    margin: 0;
		    padding: 0px 0 0 0;
		    font-size: 0.7em;
		    letter-spacing: 1px;
		    text-align: left;
		    font-weight: normal!important;
		}



		.services-content button{
		    width: 100%;
		    margin: 1% 0%;
		    color: #fff;
		    background-color: #f00100;
		    font-size: 20px;
		    padding: 3px 25px;
		    border: none;
		    outline: none;
		    border-radius: 5px;
		    font-weight: normal!important;
		}

		.services2-content button{
			width: 60%;
		    margin: 1% 20%;
		    background-color: #4CAF50;
		    color: #fff;
		    font-size: 20px;
		    padding: 2px 3px;
		    border: none;
		    outline: none;
		    border-radius: 5px;
		}

	/*** SERVICES CONTENT ***/

		.share-content{
			margin: auto;
			width: 100%;
			height: 100%;
			padding: 0%;
			display: none;
		}

		.share-content h2{
			font-family: 'Questrial', sans-serif;
			width: 100%;
			letter-spacing: 0.5px;
 			margin: 5% auto 10% auto;
 			text-align: left;
 			color: #333;
 			font-size: 22px;
 			cursor: pointer;
 		    position: relative;
		}

		.share-content h2>i{
            font-size: 21px;
            position: absolute;
            left: -35px;
            top: -4px;
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #0188f4;
		}

		
	/*****/

		.active-content{
			display: flex;
		}