@media (min-width: 1370px) 
{
	.service_section 
	{
		height: auto;
		padding: 3% 0px;
	}
	.service {
		width: 25%;
	}
	.service_image img {
		width: 25%;
	}
	.service_heading h1
	{
		font-size: 26px;
	}
	.service_section .heading,.services_container {
		margin-bottom: 6%;
	}
	.story_left_side h1 {
		font-size: 90px;
	}
}
@media (max-width: 1366px) 
{
	.service_section 
	{
		height: auto;
		padding: 3% 0px;
	}
	.service {
		width: 28%;
		height: 26rem;
	}
	.service_section .heading,.services_container {
		margin-bottom: 6%;
	}
	.service_heading h1
	{
		font-size: 26px;
	}
	.service_image img {
		width: 25%;
	}
	.service_detail ul li {
		display: block;
		margin-bottom: 15px;
		font-size: 16px;
	}
	.service_detail p {
		font-size: 16px;
	}
	.note p {
		font-size: 18px;
	}
	.story_left_side h1 {
		left: 10%;
		font-size: 90px;
	}
	.left_side h1 {
		font-size: 70px;
	}
	.left_side p {
		font-size: 18px;
	}
	.left_side button
	{
		font-size: 18px;
	}
	.service_section .heading h1 {
		font-size: 50px;
	}
}
@media (max-width: 1192px)
{
	.logo {
		font-size: 25px;
	}
	.logo a img {
		width: 120px;
	}
	.menu {
		width: 30rem;
	}
	.menu ul li a
	{
		font-size: 17px;
	}
	.left_side h1 {
		font-size: 60px;
	}
	.left_side p {
		font-size: 17px;
	}
	.left_side button {
		font-size: 17px;
	}
	.story_left_side h1 {
		left: 12%;
		font-size: 75px;
	}
	.story_right_side #heading
	{
		font-size: 20px;
	}
	.story_right_side #we
	{
		font-size: 15px;
	}
	.service {
		height: 24rem;
	}
	.service_section .heading h1 {
		font-size: 42px;
	}

	.service_heading h1 {
		font-size: 22px;
	}
	.note p {
		font-size: 16px;
		width: 60%;
		margin: 0px auto;
	}
	.container {
		width: 90%;
		padding: 30px 40px 40px 35px;
	}
}

@media (max-width:1024px)
{
	.logo {
		font-size: 22px;
	}
	.menu ul li a {
		font-size: 16px;
	}
	.left_side h1 {
		font-size: 52px;
	}
	.left_side p {
		font-size: 15px;
		line-height: 30px;
	}
	.left_side button {
		font-size: 15px;
	}
	.story_right_side
	{
		height: 65%;
	}
	.story_right_side #we {
		font-size: 12px;
		margin-left: 10%;
		width: 70%;
	}
	.story_left_side h1 {
		left: 12%;
		font-size: 60px;
	}
	.service
	{
		width: 28%;
	}
	.service_section .heading h1 {
		font-size: 36px;
	}
}
@media(max-width:920px)
{
	.left_side h1 {
		font-size: 45px;
	}
	.logo {
		font-size: 18px;
	}
	.menu {
		width: 24rem;
	}
	.menu ul li a {
		font-size: 14px;
	}
	.story_left_side h1 {
		left: 12%;
		font-size: 55px;
	}
	.story_right_side
	{
		height: 60%;
	}
	.service {
		height: 22rem;
	}
	.service_image img {
		width: 24%;
	}
	.service_heading h1 {
		font-size: 18px;
	}
	.service_detail ul li {
		font-size: 14px;
	}
	.note p {
		font-size: 14px;
	}
	.container .content .left-side
	{
		width: 30% !important;
	}
	.container .content .right-side {
		width: 65% !important;
		margin-left: 55px;
	}
	.content .left-side .details i {
		font-size: 22px;
	}
	.content .left-side .details .text-one, .content .left-side .details .text-two {
		width: 100%;
		word-break: break-word;
	}
}

@media(max-width: 820px)
{
	.service {
		width: 30%;
	}
	.story_right_side {
		height: 55%;
	}
	.story_right_side #we {
		font-size: 12px;
		margin-left: 20%;
		width: 80%;
	}
}

@media (max-width:769px)
{
	.menu_opener,.menu_closer
	{
		display: block;
	}
	.menu_closer
	{
		position: absolute;
		top: 10px;
		left: 10px;
	}
	.menu_opener img
	{
		width: 40px;
		cursor: pointer;
	}
	.menu_closer img
	{
		width: 25px;
		cursor: pointer;
	}
	.menu
	{
		position: fixed;
		right: -300%;
		top: 0px;
		width: 45%;
		background: var(--main-color);
		height: 100vh;
		padding: 5%;
		transition: 0.4s all linear;
		z-index: 99;
	}
	.menu ul
	{
		display: block;
		margin-top: 45px;
	}
	.menu ul li 
	{
		margin-bottom: 25px;
	}
	.menu ul li a
	{
		width: fit-content;
		font-size: 22px;
	}
	.services_container
	{
		flex-direction: column;
	}
	.service
	{
		width: 50%;
		margin-bottom: 15px;
	}
}
@media (max-width: 650px)
{
	.hero_section {
		flex-direction: column-reverse;
		justify-content: center;
		gap: 10%;
		height: 100vh;
	}
	.left_side, .right_side {
		width: 80%;
	}
	.story_section_container
	{
		flex-direction: column;
		gap: 10%;
	}
	.story_left_side h1 br
	{
		display: none;
	}
	.story_left_side
	{
		width: 100%;
		justify-content: center;
	}
	.story_left_side h1 {
		left: 0%;
		font-size: 45px;
	}
	.story_right_side
	{
		width: 100%;
		margin-left: 10%;
	}
	.story_right_side #we {
		margin-left: 0%;
		width: 60%;
	}
	.form_container
	{
		height: auto;
		padding: 5% 0px;
	}

	.container .content {
		flex-direction: column-reverse;
	}
	.container .content .right-side {
		width: 85% !important;
		margin-left: 0px; 
	}
	.container .content .left-side::before {
		display: none; 
	}
	.container .content .left-side {
		width: 85% !important;
	}
	.content .left-side .details {
		margin: 14px auto;
		text-align: center;
		width: 40%;
	}
	.form_heading h2 {
		color: var(--fourth-color);
		text-align: center;
		font-size: 18px;
		width: 90%;
		margin: 0px auto;
	}
}
@media (max-width: 480px)
{


	.story_right_side #we 
	{
		line-height: 20px;
	}
	.story_left_side h1 {
		left: 0%;
		font-size: 40px;
	}
	.left_side h1 {
		font-size: 35px;
		margin-bottom: 12px;
	}
	.service_section {
		height: auto;
		padding: 5% 0px;
	}
	.service_section .heading h1 {
		font-size: 30px;
	}
	.service {
		width: 60%;
	}
	.container .content .right-side {
		width: 100% !important;
	}
	.container .content .left-side {
		width: 100% !important;
	}
	.left_side p {
		line-height: 25px;
	}
	.story_right_side {
		height: 45%;
	}
	.menu
	{
		width: 70%;
	}
	.black_screen
	{
		width: 30%;
	}
}

@media (max-width: 375px)
{
	.story_left_side h1 {
		font-size: 30px;
	}
	.story_right_side #heading {
		font-size: 18px;
	}
	.story_right_side #we {
		line-height: 16px;
	}
	.service {
		width: 70%;
	}
}

@media (max-width: 350px)
{
	.left_side h1 {
		font-size: 30px;
		margin-bottom: 12px;
	}
	.left_side p {
		line-height: 22px;
		font-size: 12px;
	}
	.left_side button {
		font-size: 11px;
	}
}

@media (max-width: 320px)
{
	.menu_opener img {
		width: 30px;
		cursor: pointer;
	}
	.logo {
		font-size: 14px;
	}
	.left_side h1 {
		font-size: 25px;
		margin-bottom: 12px;
		line-height: 36px;
	}
	.left_side p {
		line-height: 20px;
		font-size: 11px;
	}
	.left_side button {
		font-size: 11px;
	}
	.menu ul li a {
		width: fit-content;
		font-size: 17px;
	}
	.menu_closer img {
		width: 20px;
		cursor: pointer;
	}
	.story_left_side h1 {
		left: 0%;
		font-size: 26px;
	}
	.story_right_side {
		height: 40%;
	}
	.story_right_side #heading {
		font-size: 16px;
	}
	.story_right_side #we {
		line-height: 16px;
		font-size: 10px;
	}
	.service_section .heading h1 {
		font-size: 24px;
	}
	.service {
		width: 80%;
	}
	.note p {
		font-size: 12px;
		width: 85%;
	}
	.container {
		padding: 15px;
	}
	.content .right-side .topic-text {
		font-size: 18px;
		font-weight: 600;
		color: #3e2093;
	}
	.right-side .button input[type="submit"],.right-side .input-box input, .right-side .input-box textarea
	{
		font-size: 13px;
	}
	.content .left-side .details .text-one, .content .left-side .details .text-two {
		font-size: 11px;
		color: #afafb6;
	}
	.content .left-side .details i {
		font-size: 16px;
	}
	.content .left-side .details .topic {
		font-size: 13px;
		font-weight: 500;
	}
	.container .content .left-side {
		align-items: flex-start;
	}
}