#loader {
  display: block;
}
#Welcoming_page{
  position: absolute;
  height: 100vh;
  width: 100vw;
  z-index: 1500;
  display: grid;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr ;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  align-items: center;
  background-color: #ffffff;
}
#hello_container{
  height: 10vmax;
  width: 50vmax;
  grid-row: 4;
  grid-column: 3/7;
  display: flex;
  justify-content: center;
  font-size: clamp(3vmin, calc(3vmax + 3vmax), 3vmax);
  font-family: google_sans;
}

#main {
  position: absolute;
  height: 100vh;
  width: 100vw;
  background-color: var(--theme-primary-color);
  overflow-y: auto;
  scrollbar-color: var(--theme-accent-color);
  display: block;
  justify-items: center;
  align-items: center;
  scroll-behavior: smooth;
  z-index: 900;
  display: none;
}


#hero_section_main {
  position: relative;
  width: 100%;
  height: 99%;
  max-width: 250vh;
  z-index: 1;
  background: var(--theme-primary-gradient);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 100%;
  box-shadow: 0 10px 10px -5px rgba(49, 49, 49, 0.308);
  align-items: center;
  justify-content: center;
  overflow-y: hidden;
  grid-template-rows: 1fr 3fr 3fr 3fr;
  overflow: hidden;
  min-height: fit-content;
  animation-duration: 1s;
  animation-timeline: view;
  animation-name: hero_section_entry_animation;
  animation-fill-mode: forwards;
  animation-range: entry 0% entry 100%;
}

#background_table_herosection {
  table-layout: fixed;
  grid-row: 1/5;
  grid-column: 1/6;
  height: 110%;
  width: 110%;
  justify-self: center;
  z-index: 0;
}

#background_table_herosection td {
  outline: 1px solid rgba(255, 255, 255, 0.308);
  outline-style: solid;
  z-index: 0;
}
#owners_image_hero_section {
  height: 100%;
  grid-column: 2/5;
  position: relative;
  transition: cubic-bezier();
  z-index: 150;
  grid-row: 2/6;
  align-self: last baseline;
  justify-self: center;
  animation-duration: 1s;
  animation-timeline: view;
  animation-name: owners_image_hero_section_animation;
  animation-fill-mode: forwards;
  animation-range: entry 0% entry 100%;
}
#owners_transparentname_hero_section {
  color: #fdcdcd10;
  -webkit-text-stroke: 1px #ffffff2f;
  grid-column: 1/6;
  z-index: 100;
  grid-row: 2;
  text-align: center;
  text-align-last: center;
  position: relative;
  font-size: clamp(12vmax, calc(12vmin + 12vmax), 30vmax);
  width: 100%;
  animation-duration: 1s;
  animation-timeline: view;
  animation-name: owners_transparentname_hero_section_animation;
  animation-fill-mode: forwards;
  animation-range: entry 0% entry 100%;
  font-family: valorant;
}
#owners_name_hero_section {
  color: white;
  font-family: monserrat;
  grid-row: 4;
  grid-column: 2/5;
  font-size: clamp(5vmax, calc(5vmin + 5vmax), 10vmax);
  z-index: 200;
  justify-self: left;
  margin-left: 2vmax;
  animation-duration: 1s;
  animation-timeline: view;
  animation-name: owners_name_hero_section_animation;
  animation-fill-mode: forwards;
  animation-range: entry 0% entry 100%;
  font-weight: 900;
}
#scroll_to_explore_text_hero_section {
  font-family: led_counter_7;
  grid-row: 2/4;
  align-self: last baseline;
  justify-self: right;
  word-wrap: normal;
  color: #ffffff;
  z-index: 10;
  grid-column: 1/3;
  padding: 10px;
  justify-self: center;
  border-radius: 20px;
  font-weight: 600;
  font-size: clamp(1vmax, calc(1vmin + 0.5vmax), 2vmax);
}
#owners_social_media_card_hero_section{
  display:grid;
  grid-template-rows: 1fr;
  grid-template-columns: 2fr 3fr 1fr;
  align-items: center;
  justify-content: center;
  height: 12vmin;
  width: 35vmin;
  padding: 1vmin;
  background-color: #161616;
  grid-row: 4/5;
  grid-column: 4/6;
  justify-self: center;
   animation-duration: 1s;
  animation-timeline: view;
  animation-name: right_to_left_entry_animation ;
  animation-fill-mode: forwards;
  animation-range: entry 0% entry 100%;
  z-index: 1000;
}
#owners_social_media_card_profile_pic_hero_section{
  background-color: transparent;
  height: 100%;
  width: 90%;
  
  grid-row: 1;
  grid-column: 1;
  background-image: url(../../../public/images/IInstagram_profile_pic.jpeg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
#owner_name_and_profession_container_owners_social_media_card_hero_section{
  display: grid;
  grid-template-rows: auto;
  font-family: google_sans;
  max-height: fit-content;
  align-self:last baseline;
  grid-column: 2;
  
}

#owner_name_owners_social_media_card_hero_section{
  color: #ffffff;
  font-size: clamp(0.3vmin, calc(0.5vmin + 1em ), 1vmax);
}
#owner_profession_owners_social_media_card_hero_section{
  color: #858585;
  font-size: clamp(0.2vmin, calc(0.5vmin + 1em ), 0.8vmax);
}
#redirect_button_owners_social_media_card_hero_section{
  grid-column: 3;
  height: 5vmin ;
  width: 5vmin;
    align-self:last baseline;
}
#redirect_button_owners_social_media_card_hero_section button{
  height: 100%;
  width: 100%;
  background-image: url("../icons/icons8-instagram-logo-96.svg");
  border: 0;
  background-color: #f1f1f1;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  
}
#owner_instagram_id_and_profession_container_owners_social_media_card_hero_section{
  color: var(--theme-accent-color);
}
#about_me_container_main {
  position: relative;
  padding-left: 10%;
  padding-right: 10%;
  padding-top: 5%;
  padding-bottom: 5%;
  display: grid;
  grid-template-columns: 3fr 2fr;
  grid-template-rows: 3fr 1fr 2fr;
  width: 65vw;

  height: 80vh;
  min-height: fit-content;
  grid-gap: 1vmax;
}
#about_me_container_main #largetext_about_owner_main {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  height: 100%;
  grid-column: 1;
  grid-row: 1/2;
  justify-content: first baseline;

  color: var(--theme-secondary-color);
}

#about_me_container_main #about_me_container_main #highlight_text {
  color: rgb(189, 189, 189);
}
#image_container_1_about_owner_main {
  grid-row: 1;
  grid-column: 2;
  height: 100%;
  justify-self: right;
  align-self: center;
  min-height: 20px;
  border-radius: 1vmax;
  animation-duration: 1s;

  animation-range: cover;
}
#image_container_1_about_owner_main img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
#greeting_by_owner_and_about_about_owner_main span {
  padding-right: 1vmax;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
  font-family: led_counter_7;
}
#greeting_by_owner_and_about_about_owner_main {
  font-size: clamp(1vmax, calc(1vmin + 1vmax), 4vmax);
  font-family: inter_semibold;
  text-transform: uppercase;
  line-height: 2vmax;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  height: 100%;

  grid-column: 2;
  grid-row: 2;
  justify-content: left;
  align-items: center;
}
#design_image_about_owner_main {
  display: flex;
  border: 5px solid;
  grid-row: 2/4;
  height: 100%;
  justify-self: center;
  align-self: first baseline;
  border-radius: 1vmin;
  transform: scale(1.2) translateX(-10vmax) translateY(6vmax);
  animation-timing-function: cubic-bezier(1, 0.73, 0.19, 0.78);
  animation-duration: 1s;
  animation-range: cover;
}
#stats_about_owner_main {
  grid-row: 3;
  grid-column: 2;
  border-radius: 0.2vmin;
  display: grid;
  grid-template-rows: 1fr 1fr;
  background-color: #ffffff;
  height: 10vmax;
  height: fit-content;
  width: 90%;
  padding: 1vmax;
  animation-duration: 1s;
  animation-range: cover;
  font-family: led_counter_7;
  justify-self: center;
  align-self: center;
  transform: translateX(5vmax) scale(1.2);

  opacity: 20%;
}
#_no_of_happy_customers_stats {
  grid-row: 1;
}
#_no_of_projects_stats {
  grid-row: 2;
}
#_no_of_happy_customers_stats,
#_no_of_projects_stats {
  display: grid;
  grid-template-columns: 4fr 1fr 10fr;
  align-items: center;
  height: 100%;
}
#stats_about_owner_main .no_stats_about_owner_main {
  font-size: clamp(2vmax, calc(1vmin + 1vmax), 5vmax);
  font-family: inter_semibold;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  border-right: 2px solid rgb(219, 219, 219);
}
#stats_about_owner_main .text_name {
  font-size: clamp(1vmin, calc(1vmin + 1vmax), 4vmax);
  font-family: inter_semibold;
  text-transform: uppercase;
  display: flex;
  justify-content: left;
  grid-column: 3;
}
#our_services_container_main {
  position: relative;
  height: 200vh;
  width: 70vw;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 2fr 8fr;
  justify-content: center;
  box-sizing: border-box;
  padding-bottom: 5%;
  overflow-y: visible;
  min-height: fit-content;
  
}

#our_services_container_main #largetext_our_services_container_main {
  /* display: flex; */
  display: grid;
  grid-template-columns: 1fr 4fr;
  width: 50%;
  flex-wrap: wrap;
  height: 100%;
  grid-column: 1;
  grid-row: 1;
  justify-content: first baseline;

  color: var(--theme-secondary-color);
}
#our_services_container_main ul {
  display: flex;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  flex-wrap: wrap;
  height: 100%;
  width: 100%;
  grid-row: 2;
  grid-column: 1;
}
#our_services_container_main li {
  display: grid;
  grid-template-columns: 5fr 2fr;
  grid-template-rows: 1fr;
}

#our_services_container_main li .our_services_service_img_main {
  grid-column: 2;
  object-fit: cover;
  justify-self: center;
  align-self: center;
  width: 1%;
  height: auto;
  border: 1px solid black;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-range: cover;
  transition-duration: 1s;
}
#our_services_container_main li .our_services_service_img_main:hover {
  transform: scale(1.2);
}
#our_services_container_main #largetext_our_services_container_main span {
  padding-right: 1vmax;
  grid-column: 2/3;
  transform: scale(1.2);
  opacity: 20%;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
  text-transform: uppercase;
}
#our_services_container_main #service1 {
  border-top: 1px solid black;
}
.our_services_service_info_main {
  display: grid;
  grid-template-rows: 1fr 1fr 3fr;
  grid-column: 1;
  grid-template-columns: 1fr 3fr;
  justify-content: left;

  width: 100%;
  padding-right: 10%;
  align-items: center;
}
.our_services_service_info_main .service_listing_number {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column: 1/2;
  background-color: rgb(235, 235, 235);
  box-shadow: 0px 0px 1px rgb(211, 211, 211);
  width: fit-content;
  border-radius: 1em;
  align-items: center;
}

.our_services_service_info_main .service_feature {
  background-color: rgb(235, 235, 235);
  max-width: fit-content;
  padding: 0.5em;
  border-radius: 0.5em;
  font-size: clamp(1vmin, calc(1em + 1vmin), 1vmax);
  box-shadow: 0px 0px 1px rgb(211, 211, 211);
  font-family: google_sans;
  justify-self: flex-start;
  align-self: first baseline;
  margin: 1vmin;
  transition-duration: 0.5s;
  overflow: hidden;
}
.our_services_service_info_main .service_feature:hover {
  transform: scale(1.1);
}
.our_services_service_info_main .service_features {
  display: flex;
  flex-wrap: wrap;
  align-items: first baseline;
  max-height: 100%;
  grid-column: 2;
}
.our_services_service_info_main .service_description {
  font-family: google_sans;
  font-size: clamp(1vmin, calc(1em + 2vmin), 1vmax);
  color: grey;
  transition-duration: 0.15s;
  word-wrap: normal;
  max-height: 100%;
  grid-column: 2;
}
.our_services_service_info_main .service_name {
  font-family: inter_semibold;
  font-size: clamp(2vmax, calc(2vmin + 1vmax), 10vmax);
  text-transform: uppercase;
  transition-duration: 0.15s;
  max-height: 100%;
  grid-column: 2;
}
.our_services_service_info_main .service_name:hover {
  color: var(--theme-accent-color);
}
@keyframes micro_to_normal_image_for_our_services_animation {
  from {
    width: 1%;
  }
  to {
    width: 100%;
  }
}
.micro_to_normal_image_for_our_servies_animation_applied_elements {
  animation-name: micro_to_normal_image_for_our_services_animation;
  animation-fill-mode: forwards;
}
#our_projects_section_main {
  position: relative;
  height: 150vh;
  max-height: fit-content;
  width: 70vw;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 5fr 15fr 1fr;
  justify-content: center;
  box-sizing: border-box;
  padding-bottom: 5%;
  overflow-y: visible;
  min-height: fit-content;
}
#largetext_our_projects_container_main {
  display: grid;
  grid-template-columns: 1fr 4fr;
  width: 50%;
  flex-wrap: wrap;
  height: 100%;
  grid-column: 1;
  grid-row: 1;
  justify-content: first baseline;

  color: var(--theme-secondary-color);
}
#largetext_our_projects_container_main span {
  padding-right: 1vmax;
  grid-column: 2/3;
  transform: scale(1.2);
  opacity: 20%;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
  text-transform: uppercase;
  font-size: clamp(2vmax, calc(5vmin + 1vmax), 20vmax);
  font-family: inter_semibold;
}

.our_services_container_main_item {
  display: grid;
  grid-template-columns: 1fr 4fr;
  border-bottom: 1px solid black;
}

#project_1_container_our_projects_section_main {
  height: 50vh;
  width: 70vh;
}
#project_2_container_our_projects_section_main {
  height: 40vh;
  width: 60vh;
  justify-self: right;
}
@keyframes small_to_normal_image_animation_for_projects_containers {
  from {
    transform: scale(0.6);
  }
  to {
    transform: scale(1);
  }
}
.small_to_normal_image_animation_for_projects_containers_applied_elements {
  animation-name: small_to_normal_image_animation_for_projects_containers;
}
.project_container_our_projects_section_main {
  background-color: #ffffff;
  font-family: google_sans;
  box-shadow: 0px 0px 2px solid grey;
  font-size: clamp(1vmin, calc(1em + 2vmin), 1.1vmax);
  justify-content: center;
  align-items: center;
  display: grid;
  grid-template-rows: 9fr 1fr;
  grid-template-columns: 1fr 1fr;
  row-gap: 1vh;
  max-width: fit-content;
  max-height: fit-content;
  box-sizing: border-box;
  padding: 1vh;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
  transform: scale(0.6);
  transition-duration: 0.5s;
  border-bottom: 4px solid transparent;
  margin: 1vh;
}
.project_container_our_projects_section_main:hover {
  border-bottom: 4px solid var(--theme-accent-color);
}
.project_container_our_projects_section_main img {
  object-fit: cover;
  width: 100%;
  grid-row: 1;
  grid-column: 1/3;
}
.project_name_our_projects_section_main {
  width: 100%;
  border-top: 1px solid rgb(119, 119, 119);
  grid-column: 1;
  font-weight: 600;
}
.project_category {
  display: flex;
  grid-column: 2;
  justify-content: right;
  color: rgb(112, 112, 112);
  font-weight: 400;
  border-top: 1px solid rgb(119, 119, 119);
}
#our_development_process_container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 2fr 3fr;
  height: 40vh;
  min-height: fit-content;
  width: 90vw;
  position: relative;
  row-gap: 5vh;
  padding: 5vw;
}
#largetext_our_development_process_container_main {
  grid-column: 1/6;
  justify-content: center;
  align-items: center;
}
#section_development_process_marking {
  justify-self: center;
  grid-column: 1/6;
}
#our_development_process_container ul {
  list-style: none;
  display: flex;
  width: 100%;
  max-width: fit-content;
  grid-column: 1/6;
  gap: 1em;
  justify-content: center;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  justify-self: center;
  flex-wrap: wrap;
}
#our_development_process_container .process_boxes {
  min-width: 10em;
  min-height: 15em;
  width: 10vw;
  height: 13vw;
  padding: 2vw;
  background-color: rgb(0, 0, 0);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 2fr 5fr 4fr;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
  justify-content: center;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
#our_development_process_container .process_boxes .process_icon {
  width: 2vmax;
  height: 2vmax;
  background-color: transparent;
  border-radius: 2vmax;
  font-family: valorant;
  font-weight: 500;
  font-size: clamp(1.5vmin, calc(1.5em + 1vmin), 1.5vmax);
  color: #ffffff;
  display: flex;
  justify-self: left;
  justify-content: center;
  align-items: center;
  align-content: center;
  filter: drop-shadow(10px 4px 4px var(--theme-accent-color));
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
#our_development_process_container .process_boxes .process_icon:hover {
  transform: scale(1.5);
}

#our_development_process_container .process_boxes .process_name {
  font-family: led_counter_7;
  font-weight: 500;
  font-size: clamp(1.5vmin, calc(1.5em + 1vmin), 1.5vmax);
  color: #ffffff;
}
#our_development_process_container .process_boxes .process_description {
  font-family: google_sans;
  font-size: clamp(1vmin, calc(1em + 1vmin), 1vmax);
  color: #858585;
}
.process_boxes_reveal_animation_applied {
  animation-name: process_boxes_reveal_animation;
  animation-fill-mode: forwards;
}
.animated_process_boxes {
  transform: translateY(20vh);
}
#why_choose_me_container {
    min-height: fit-content;
  justify-self: center;
  align-self: center;
   position: relative;
  display: grid;
  grid-template-rows: 3fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 2fr 3fr 2fr;
  padding: 7.5vw;
  height: 100vh;
  width: 65vw;
  gap: 1vmax;

  /* column-gap: 2vmax; */

}
#development_experience_container {
   justify-self: center;
  align-self: center;
  min-height: fit-content;
  min-width: fit-content;
  display: grid;
  grid-template-rows: 1fr 1fr  1fr 2fr 3fr;
  position: relative;
  grid-row: 2/4;
  grid-column: 1;
  height: 12vmax;
  padding: 2vmax;
  width: 12vmax;
  background-color: #ffffff;
  justify-self: center;
  align-self: center;
  transform: translateX(30vw);
  animation-duration: 1s;
  z-index: 100;
  animation-timing-function: cubic-bezier(1, 0.73, 0.19, 0.78);
}
#client_satisfaction_rate_container {
   min-height: fit-content;
  min-width: fit-content;
  display: grid;
  grid-template-rows: 1fr 1fr 1fr 2fr 3fr;
  grid-row: 4/6;
  grid-column: 1;
  height: 12vmax;
  padding: 2vmax;
  width: 12vmax;
  background-color: #ffffff;
  justify-self: center;
  align-self: center;
  transform: translateX(30vw);
  animation-duration: 1s;
  z-index: 100;
  animation-timing-function: cubic-bezier(0.57, 0.23, 0.18, 0.33);
  position: relative;
}
#client_rating_container {
  grid-row: 2/6;
  grid-column: 2;
  justify-self: center;
  align-self: center;
  height: 26vmax;
  width: 14vmax;
  padding: 4vmax;
  background-image: url(../../../public/images/blue_sky_background_image.jpg);
  background-size: cover;
  z-index: 250;
  animation-timing-function: cubic-bezier(0.57, 0.23, 0.18, 0.33);
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
}
#performance_presentation_container {
  min-height: fit-content;

  grid-row: 4/6;
  grid-column: 3;
  height: 12vmax;
  padding: 2vmax;
  width: 12vmax;
  background-color: #ffffff;
  justify-self: center;
  align-self: center;
  animation-duration: 1s;
  z-index: 100;
  animation-timing-function: cubic-bezier(0.57, 0.23, 0.18, 0.33);
  display: grid;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
  
}
#my_image_why_choose_me_container{
  background-image: url(../../../public/images/my\ image.jpeg);
  height: 100%;
  width: 100%;
  height: 12vmax;
  padding: 2vmax;
  width: 12vmax;
  grid-row: 2/4;
  grid-column: 3/4;
  background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   align-self: center;
   justify-self: center;
       animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
}
#developing_image_main {
  height: 30vw;
  width: 55vw;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  justify-self: center;
  align-self: center;
  background-image: url("../../../public/images/Coding_image.png");
  border-radius: 1px ;
  border-radius: 20px;
    animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-range: cover;
 
}
.why_choose_me_container_box_count_big_numbers {
  font-size: clamp(4vmin, calc(3em + 1.5vmin), 3vmax);
  font-family: google_sans;
  font-weight: 600;
  color: black;
  grid-row: 4;
}
.why_choose_me_container_box_name{
  font-family: led_counter_7;
  font-weight: 500;
  font-size: clamp(1.5vmin, calc(1em + 1vmin), 1vmax);
  color: #1d1d1d;
  grid-row: 3;
  font-weight: 500;
}
.why_choose_me_container_box_icon {
  grid-row: 1;
  width: 3vmax;
  height: 3vmax;
  background-color: transparent;
  border-radius: 2vmax;
  font-family: valorant;
  font-weight: 500;
  font-size: clamp(1.5vmin, calc(1.5em + 1vmin), 1.5vmax);
  color: #ffffff;
  display: flex;
  justify-self: left;
  justify-content: center;
  align-items: center;
  align-content: center;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.why_choose_me_container_box_description{
    font-family: google_sans;
  font-weight: 500;
  font-size: clamp(0.5vmin, calc(0.4em + 1vmin), 0.8vmax);
  color: #aaaaaa;
  grid-row: 5;
}

@media screen and (orientation: portrait) and (max-width: 100vh) {
  #hero_section_main {
    width: 100%;
  }
  #owners_social_media_card_hero_section{
    height: 10vmin;
    width: 10vmin;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
     border-radius: 1vmin;
  }
  #owner_name_and_profession_container_owners_social_media_card_hero_section{
    display: none;
  }
  #redirect_button_owners_social_media_card_hero_section{
    visibility: visible;
    grid-row: 1;
    grid-column: 1;
    align-self: center;
    justify-self: center;
    height: 100%;
    width: 100%;
  }
  #redirect_button_owners_social_media_card_hero_section button{
    border-radius: 1vmin;
  }
  #owners_social_media_card_profile_pic_hero_section{
    display: none;
    
  }
  #owners_image_hero_section {
    height: 60%;
  }
  #owners_transparentname_hero_section {
    grid-row: 2/5;
    grid-column: 3/4;
    width: 40vmax;
    align-self: baseline;
    word-wrap: break-word;
    text-align: center;
    text-align-last: center;
    font-size: 20vmax;
  }
  #design_image_about_owner_main {
    height: 80%;
  }
  #about_owner_hero_section {
    display: none;
  }
  #owners_name_hero_section {
    justify-self: center;
    grid-row: 4/6;
    align-self: last baseline;
    font-size: 10vmax;
  }
  #largetext_about_owner_main span {
    text-align: center;
    text-align-last: center;
  }
  #image_container_1_about_owner_main {
    height: 100%;
  }
  #our_services_container_main {
    height: fit-content;

    width: 80vw;
  }
  #our_services_container_main li {
    display: grid;
    grid-template-columns: 4fr 3fr;
    grid-template-rows: 1fr;
  }
  #our_projects_container_main {
    height: 100vh;
    min-height: fit-content;
    width: 80vw;
  }
  #project_1_container_our_projects_section_main {
    height: 35vh;
    width: 50vh;
  }
  #our_projects_section_main {
    height: 80vh;
    min-height: fit-content;
  }
  #why_choose_me_container {
    height: 60vh;
    grid-template-rows: 3fr 1fr 3fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  #development_experience_container{
    grid-row: 2;
    grid-column: 1;
  }
  #performance_presentation_container{
    grid-row: 4;
    grid-column: 2;
  }
  #client_satisfaction_rate_container {
    grid-row: 4;
    grid-column: 1;
  }#my_image_why_choose_me_container{
    grid-row: 2;
    grid-column: 2;
  }
  
#client_rating_container{
  grid-row: 3;
  grid-column: 1/3;
}


}
@media screen and (orientation: portrait) and (max-width: 80vh) {
  #about_me_container_main {
    height: 80vh;
    justify-items: center;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 2fr 2fr 1fr 2fr;
  }
  #largetext_about_owner_main {
    grid-area: 1/1/2/2;
    text-align: center;
    text-align-last: center;
    justify-items: center;
    justify-content: center;
  }
  #image_container_1_about_owner_main {
    grid-area: 2/1/3/2;

    height: 100%;
    width: 100%;
    justify-self: center;
  }
  #greeting_by_owner_and_about_about_owner_main {
    grid-area: 3/1/4/2;
    justify-content: center;
  }
  #design_image_about_owner_main {
    display: none;
  }
  #stats_about_owner_main {
    grid-area: 4/1/5/2;
  }

  #our_services_container_main {
    height: 100vh;
    min-height: fit-content;
    width: 85vw;
  }
  #our_services_container_main #largetext_our_services_container_main {
    width: 100%;
  }
  #our_projects_section_main {
    min-height: fit-content;
    height: 85vh;
    width: 85vw;
  }

}
@media screen and (min-width: 250vh) {
  #hero_section_main {
    width: 250vh;
    padding-left: calc((100vw - 250vh) / 2);
    padding-right: calc((100vw - 250vh) / 2);
  }
  #about_me_container_main {
    padding-left: 5%;
  }
  #our_services_container_main {
    width: 85vw;
    padding-left: 15vw;
    padding-right: 15vw;
  }
}
@keyframes hero_section_entry_animation{
  from{
    filter: blur(10px);
  }
  to{
    filter: blur(0);
  }
}
@keyframes large_to_normal_slick_entry_bottom_left {
  from {
    transform: scale(1.2) translateX(-10vmax) translateY(6vmax);
  }
  to {
    transform: scale(1) translateX(0) translateY(0);
  }
}

@keyframes owners_image_hero_section_animation {
  from {
    transform: translateY(10vmax);
    filter: blur(20px);
    filter: opacity(0%);
  }
  to {
    transform: translateY(0);
  }
}
@keyframes owners_transparentname_hero_section_animation {
  from {
    transform: scale(0.8);
    filter: blur(20px);
    opacity: 0%;
  }
  to {
    transform: scale(1);
    opcity: 100%;
  }
}
@keyframes owners_name_hero_section_animation {
  from {
    opacity: 0%;
    filter: blur(10px);
    transform: scale(1.2);
  }
  to {
    opacity: 100%;
    transform: scale(1);
  }
}
@keyframes process_boxes_reveal_animation {
  from {
    transform: translateY(20vh);
  }
  to {
    transform: translateY(0);
  }
}