@charset "UTF-8";
/* CSS Document */
*, *:before, *:after{
	box-sizing: border-box;
	transition: all .4s ease;
}
h1{
	font-size: 5em;
	color: #9C5D6A;
	text-align: center;
}
a{
	text-decoration: none;
	font-weight: 700;
 	font-size: 1em;
	color: #FFFFFF;
}
header {
	padding: .5em 0;
}

nav {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.Header_Nav {
text-decoration: none;
color: #b5838d;
font-size: 1.2em;
font-weight: 800;
}

.Header_Nav :hover {
color: #D8A7AA;
font-size: 1.1em;
} 

.Header_Nav2 {
text-decoration: none;
color: #b5838d;
font-size: 1.6em;
font-weight: 800;
}

.Header_Nav2 :hover {
color: #D8A7AA;
font-size: 1.4em;
} 


.Hero{
	background: url("Image/Hero_img.jpg")center/cover no-repeat;
	height: 40em;
	width: 100vw;
	min-height: 80vh;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 4em 6em;
	box-sizing: border-box;
}

.Hero_Text {
	max-width: 50%;
	text-align: center;
	margin-bottom: 13em;
}
.Hero_Text h3{
	margin-top: -1.8em;
	text-align: right;
	color: #FFFFFF;
	font-weight: 300;
	line-height: 1.5em;
	font-size: 1.2em,
}

                                                                  /* Designs */

.Design_div3 {
padding: 1em;
display: flex;
flex-direction: row;
justify-content: center;
	gap: 1em;
}

.Design_div3 img{
width: 25em; 
overflow: hidden;
}

.gallery img{
	height: 14em
}
.gallery{
	position: relative;
	overflow: hidden;
	width: 100%;
	margin-bottom: 2em;
	
}

.row{
	display: flex;
	gap: 2em;
	will-change: transform;
	transition: none;
	padding-top: 2em;
}

.row + .row{
	justify-content: flex-end;
	
}

.gallary .row{
	animation: gallery 5s ease-in-out infinite alternate;
}

.gallary .row + .row {
	animation-name: galleryReverse;
}

/*@keyframes gallery {
	from {transform: translateX(0);}
	to {transform: translateX(-20vw)}
}
@keyframes galleryReverse {
	from {transform: translateX(0);}
	to {transform: translateX(20vw)}
}*/


.shirt img{
	width: 25em; 
	overflow: hidden;
}


 .shirt{
	 display: flex;
	 flex-direction: row;
	 justify-content: center;
}

.logos{
	 display: flex;
	 flex-direction: row;
	 justify-content: center;
	margin-top: 4em;
}

.logos img{
	height: 16em;
}
	 
	 
	 
                                                                 /* About Me */

.about {
	margin-top: 5em;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em; 
    align-items: start;
	padding: 0 4em
}
.about_content_1 h1{
	font-size: 4em;
	text-align: center;
}
.about_content_1 p {
  margin-top: 4em;
  font-size: 1.1em;
  line-height: 1.5em;
  text-align: left;
}

.about_content_2 img {
  max-width: 100%;
  border-radius: 1em;
  margin-top: 1em;
}
 

                                                                  /* Video Projects */

.Videos{
	display: flex;
	flex-direction: row;
	grid-gap: 3.5em;
	justify-content:center;
	margin: 3em;
	height: 15em;
}
                                                                  /* Websites */
.Web-Links img{
	height: 12em;
}
                                                                  /* Footer */
footer{
	background: #b5838d;
	padding: 3em
	
}	
.box {
  mask:
    radial-gradient(69.32px at 50% 93px,#000 99%,#0000 101%) calc(50% - 62px) 0/124px 100%,
    radial-gradient(69.32px at 50% -62px,#0000 99%,#000 101%) 50% 31px/124px 100% repeat-x;
}

.box, .social_div {
	margin-top: 2em;
	
}
.footer_text{
	text-align: center;
	color: #FFFFFF;
	margin-top: 1em;
}

.social_div {
	display: flex;
	justify-content: center;
	align-items: center;

}

.social img {
	width: 2.6em;
	height: auto;
}
.social2 img{
	width: 3em;
	height: auto;
}

.Resume{
	text-align: center;
	text-decoration: underline;
	text-decoration-color: #FFFFFF;
}