* {
margin:0px auto;
padding: 0px auto;
}

.logo {
src: url("logo.svg");
width: 48px;
height: 64px;
padding-top: 54px;
position: absolute;
left: 0;
top: 0;
}

.content-container {
padding-top:48px ;
width: 1000px;
background-position: center;
position:relative;
}

.bg1 {
background-image: url("bg1.webp");
background-size:cover;
background-repeat: no-repeat;
height:518px;
}

.bg2 {
background-color: black;
background-image: url("bg2.webp");
background-size:cover;
height:480px;
padding-bottom:64px;
background-repeat: no-repeat;
}

.bg3 {
background-image: url("bg3.webp");
background-size:cover;
height: 480px;
padding-bottom: 32px;
background-repeat: no-repeat;
}

.menu {
position: absolute;
text-decoration: none;
right: 0;
top: 0;
}

.menu nav {
margin : 0;
margin-right:48px;
}

.menu ul {
padding-top: 54px;
list-style-type: none;
}

.menu li {
display : inline;
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 14px;
letter-spacing: 0;
padding-left: 24px; 
color: white;
}

.menu li a {
text-decoration: none;
color: white;
}

.menu li a:hover {
text-decoration: underline;
color: white;
}

.statement {
padding-top:48px;
width: 1000px;
background-position: center;
position: relative;
float: left;
}

.hello {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 18px;
color: #FFFFFF;
letter-spacing: 0;
line-height: 20px;
padding-bottom:14px;
}

.name {
font-family: 'Roboto', sans-serif;
font-weight:500;
font-size: 30px;
color: #FFFFFF;
letter-spacing: 0.5px;
padding-bottom:24px;
}

.intro {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size:16px;
color: #FFFFFF;
letter-spacing: 0;
line-height: 24px;
position: absolute;
right :18%;
}

.SocialMedia {
position: absolute;
right: 0;
bottom: 0;
padding-bottom: 100px ;
}

.achievements {
background-size:cover;
background: #F5F5F5;
height:100px;
text-align: center;
margin-top:-45px;
}

.aboutme {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 14px;
color: #000;
padding-top:64px;
width:1000px;
height:448px;
position: relative;
text-align: left;
}

.aboutme .experience0{
text-align: left;
position: absolute;
width: 90px;
left: 0px;
}

.aboutme .experience1 {
text-align: left;
position: absolute;
left: 120px;
width: 150px;	
border-left: .2px solid;
padding-left: 24px ;
}

.aboutme .experience2 {
text-align: left;
position: absolute;
left: 333px;
width: 249px;
}

.aboutme .experience3 {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 14px;
color: #000;
letter-spacing: 0;
line-height: 20px;
position: absolute;
left: 615px;
width: 375px;
}

.title{
font-family: 'Roboto', sans-serif;
font-weight:700;
font-size: 30px;
letter-spacing: 0.3px;	
color: #000000;
line-height: 36px;
padding-bottom:20px;
}

.bullet{
position: absolute;
left: -14px;
}

.office{
font-family: 'Roboto', sans-serif;
font-size: 14px;
color: #000000;
letter-spacing: 0;
line-height: 24px;
padding-bottom:21px;
}

.office1{
font-family: 'Roboto', sans-serif;
font-size: 14px;
color: #000000;
letter-spacing: 0;
line-height: 24px;
}

.Btn-DR{  
width: 148px;
height: 40px;
padding: 12px 20px 12px 20px;
text-align: center;
border-radius:100px;
color: #fff;
font-family: 'Roboto', sans-serif;
font-weight:500;
font-size: 12px;
background: #000;
border: none;
text-decoration: none;
}  

.Btn-DR a {  
text-decoration: none;
color: white;
}  

.awards {
background-size:cover;
background: #F5F5F5;
height:100px;
text-align: center;
}

.awards-titles {
height:36px;
background-size:cover;
text-align: center;
    width: 1000px;
}

.para{
line-height:20px; margin-bottom:20px;
}

.para2{
line-height:20px; margin-bottom:24px;
}

.para-2{
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 13px;
color: #FFFFFF;
line-height:18px;
margin-bottom:20px;
width:110%;
}

.subtitle{
font-family: 'Roboto', sans-serif;
font-weight:700;
font-size: 30px;
color: #FFFFFF;
letter-spacing: 0.3px;
line-height: 32px;
padding-bottom: 20px;
width:272px;
}

.content-container-2 {
width: 1000px;
height: 480px;
position: relative;
padding-bottom: 64px ;
}

.uxd{
padding-top: 72px ;
width: 250px;
height: 480px;
position: absolute;
left: 0;
top: 0;
}

.diagram{
padding-top: 90px ;
position: absolute;
height: 480px;
right: 0;
top: 0;
}


.MySpecialities{
padding-top:90px ;
position: absolute;
height: 480px;
left: 0;
top: 0;
}

.DesignSkills{
padding-top:90px;
position: absolute;
height: 480px;
right: 0;
top: 0;
}

.content-container-3 {
width: 1000px;
height: 480px;
position: relative;
}

.content-container-4 {
width: 1000px;
height: 480px;
text-align: center;
padding-top:64px ;
padding-bottom:200px;
}

p{
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 16px;
color: #000000;
letter-spacing: 0;
text-align: center;
}

.subtitle2 {
font-family: 'Roboto', sans-serif;
font-weight:700;
font-size: 32px;
color: #000000;
letter-spacing: 0;
text-align: center;
line-height: 36px;
padding-bottom: 14px ;
}

.projects {
padding-top: 54px;
padding-bottom: 44px;
text-decoration: none;
width: 1000px;
}

.footer {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 12px;
color: #FFFFFF;
letter-spacing: 0;
text-align: center;
padding-top: 20px;
}

.phs{
padding-top: 3px;
}

.linkedin {
float:right;
padding-top:60px;
}

.linkedin-txt a {
font-family: 'Roboto', sans-serif;
font-weight:400;
font-size: 14px;
color: #FFFFFF;
letter-spacing: 0;
text-align:right;
float:right;
padding-top:74px;
text-decoration: none;
}

.bg4{
background-size:cover;
background: #000;
height: 48px;
}