index.css

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,200;1,14..32,200&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

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

* {
	margin: 0;
}

body {
	line-height: 180%;
	height: 100%;
	min-height: 100vhmax;
	width: 100%;
	background-size: content;
	background: linear-gradient(90deg, #051937, #002151, #00286c, #002e87, #0a32a1);
	font-family: "Montserrat", sans-serif;
	padding: 5px;
	margin: 5px;
}

p {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 200;
	font-style: normal;
}

li {
	list-style: circle inside;
	font-weight: 200;
}

li strong {
	font-weight: 400;
}

.container {
	display: flex;
	flex-direction: row;
}

.container :nth-child(1) {
	order: 2;
}

.container :nth-child(2) {
	order: 1;
}

.container #header {
	text-align: center;
	font-size: 25pt;
	color: #fffff;
}

#more-about-me {
	margin-top: 1rem;
	font-size: 1.2rem;
	font-weight: 500;
	color: #ffffff;
}


#links {
	font-size: 1.2rem;
	color: #ffffff;
	font-weight: 500;
}

.social-links {
	width: 40vw;
}

.social-links li {
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
	padding: 0px 10px;
}

.social-links li a {
	color: lightblue;
}

.item {
	padding: 2%;
	text-align: justify;
	justify-content: center;
}

.item p {
	font-size: 12pt;
	color: #ffffff;
	transition: .2s;
}

.item p {
	font-size: 14pt;
	font-weight: 100;
}

.item ul li {
	font-size: 12pt;
	color: #ffffff;
	margin-bottom: 5px;
	transition: .2s;
}

.profile {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 1rem;
}

.profile img {
	border-radius: 50%;
	border: solid #104c85;
	transition: .7s ease-in-out;
	width: 200px;
	height: 200px;
	border-width: 4px;
	object-fit: cover;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.profile img:hover {
	border-radius: 50%;
	border: 6px dotted #31adf5;
	transform: scale(1.05);
	cursor: pointer;
}

.profile #name {
	color: #98c1f2;
	font-size: 1.2rem;
	text-transform: uppercase;
	order: 2;
}

.profile #title {
	color: #52bdc9;
	text-transform: capitalize;
	font-size: 1rem;
	order: 3;
}

<div class="container">
   <div class="item">
      <div class="profile">
         <img src="https://i.ibb.co/5WyGvSzz/ Potfolio.jpg" alt="Potfolio" />
         <div id="name">Jose Acuña</div>
         <div id="title">Fullstack Developer</div>
      </div>
      <p>Hi everyone! I am a beginner developer in Java, HTML5 and CSS3.</p>
      <p>I have created a simple calculator, a restaurant menu with a user interface with Java and a tribute page with HTML5 and CSS3, JavaScript & React.</p>
      <p>Addionally I'm studying English.</p>
      <p>Programming is a field that interests me a lot and although I have not been programming for a long time, I can say that I really like it, I consider programming one of my favorite hobbies.
      </p>
      <p id="more-about-me"> More About Me:</p>
      <ul>
         <li><strong>Programming Languages:</strong> HTML, CSS, JavaScript, Oracle APEX</li>
         <li><strong>English Proficiency:</strong> Having this language studied for over 2 years and still learning to be even better in the future</li>
         <li><strong>Games I like:</strong> several games such as Pug , Call of Duty, Stardew Valley and some Left 4 Dead 2 Campaigns and Black.</li>
      </ul>
   </div>
   <div class="item">
      <p> I’m constantly growing my expertise, with a current focus on Java,Html, and Css.</p>
      <p id="links">Links:</p>
      <ul class="social-links">
         <li id="gitHubList"> <a href="https://github.com/JoseNahumA" target="_blank" rel="noopener noreferrer">Github</a></li>
         <li id="linkedInList"> <a href="https://www.linkedin.com/in/jose-nahum-acu%C3%B1a-lopez-87432334a/" target="_blank" rel="noopener noreferrer">LinkedIn</a></li>
         <li id="emailList"> <a href="[email protected]" target="_blank" rel="noopener noreferrer">My Email</a></li>
      </ul>
   </div>
</div>