@charset "UTF-8";
/* CSS Document */


@media (max-width: 1098px){
	/*hero section*/ 
.hero-svg-index{ 
	grid-column: 10/21; 
	grid-row: 3/10; 
}

	.graphic-design-cards:hover{ 
	transform: scale(1,1);  
}


	/*website-section--------*/ 
.website-design-section{ 
	display: grid; 
	grid-template-columns: 1fr 1fr 1fr; 
	grid-template-rows: repeat(30px,10); 
}
.website-design-section>div:nth-child(1){ 
	grid-column: 1/4; 
	grid-row: 1/5; 
	width: 100%; 
	text-align: center; 
	padding-top: 30px; 
	
}
.website-design-section>div:nth-child(2){ 
	grid-column: 1/4; 
	grid-row: 3/10; 
	width: 100%; 
}
.website-design-section>div:nth-child(2) object{ 
	width: 100%; 
}
}

@media (max-width: 650px){
	/*review section---------------*/ 
#review-section{ 
	padding: 150px 0; 
} 

.reviews{ 
	margin: 0 auto;  
	text-align: center; 
	display: flex; 
	flex-direction: column; 
	align-items: center; 
	justify-content:space-between; 
	height: auto; 
}
.review-text{ 
	display: flex; 
	flex-direction: column; 
	padding-bottom: 50px; 
}

#review-paragraph{
	font-style: italic;
	font-size: 18pt; 
	color: rgba(242,242,242,1.00); 
	font-family: 'roboto', sans-serif; 
	font-weight: 300; 
	letter-spacing: 1px; 
	padding: 0 10px; 
}

#review-paragraph span{ 
	display: block; 
	text-align: right; 
	margin-top: 10px; 
	font-family: "Roboto Black", sans-serif; 
	font-weight: 900; 
	font-size: 18pt;
	letter-spacing: 2px; 
	font-style: normal; 
	
}	
}
@media (max-width: 500px){
	
	/*hero section*/ 
.hero-section-heading-index{ 
	font-family: warnock-pro-display, serif;
	font-weight:900;
	margin-bottom: -40px; 
	margin-top: -10px; 
	font-size: 50pt; 
	font-style: normal;
	letter-spacing: 2px; 
	text-align: center; 
	color: black; 
	
}

	/*process------*/ 

.vertical-line{ 
	grid-column: 1/2; 
	grid-row: 1/11; 
	}
.sphere{ 
	grid-column: 1/2; 
	grid-row: 5/8; 
}
.horizontal-line{ 
	grid-column: 1/2; 
	grid-row: 5/8; 
	
}
.day-one div:nth-child(4){ 
	grid-column: 3/11; 
	grid-row: 5/8; 
	max-width: 700px; 
}
.day-three div:nth-child(4){ 
	grid-column: 3/11; 
	grid-row: 5/8;  
	max-width: 700px; 
}

.day-nine div:nth-child(4){ 
	grid-column: 3/11; 
	grid-row: 5/8; 
	max-width: 700px; 
}

} 
@media (max-width: 900px){
/*hero sectio0n-----*/ 
	
.index-hero-section{ 
	width: 100%; 
	height: auto; 
	display: flex; 
	flex-wrap: wrap-reverse; 
	background-color: #F2F2F2; 
	position: relative; 
	z-index: 0; 
}
.index-hero-section-background{ 
	display: none;
}
.hero-svg-index{ 
	width: 100%; 
	height: 100%;
	position: relative; 
}
.hero-section-text-index{ 
	text-align: center; 
	padding: 100px 10px 50px 10px;
}
.hero-section-text-index p{ 
	font-weight: 500; 
}
.hero-section-text-index h1{ 
	font-weight: 600; 
}
	.hero-section-heading-index{ 
	text-align: center; 
}
/*about us*/ 
.about-us-flex div:nth-child(1){ 
	width: 100%;
}
.about-us-flex div:nth-child(2){ 
	width: 100%;
			}
}
@media (max-width: 700px){
   

	.playpause {
		background-image:url(motion-graphics-photos/play-button.svg);
		background-repeat:no-repeat;
		width:70px;
		height:70px;
		position:absolute;
		left:0%;
		right:0%;
		top:0%;
		bottom:0%;
		margin:auto;
		background-size:contain;
		background-position: center;
		z-index: 10;
	}
	.animation-section{ 
		display: flex; 
		flex-direction: column; 
		align-items: center; 
		justify-content: flex-start;
		height: auto;
	}
	
	}