/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

:root {
  --nav-fs: clamp(16px, 1.5vw + 1rem, 22px);
  --container-margin: 10%;
}

ul{
	margin:0px;
	list-style:none;
}

.text-center {
  text-align: center;
}

div#page {
  padding: 0;
  width: 100% !important;
  max-width: 100% !important;
}

.bg-transparent {
  background: transparent !important;
}

button,
.gb-button,
.btn-group-item {
  cursor: pointer !important;
}

a {
  text-decoration: none;
}

/**
3d animation styles*/

.heroBg {
  position: relative;
  width: 100%;
  min-height: 600px;

  overflow: hidden;
  background: black;
  display: flex;
  flex-wrap: wrap;
}

.scroll-arrow{
	display:none !important;	
}

/* contact arrow adjust */

.down-arrow{
  position:relative;
  top:-5px;
}




@media (max-height: 768px) {
  .heroBg {
    position: relative;
    height: 100%;
  }
}

#heroOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0), black);
}

.tile {
  position: relative;
  width: 100px;
  /* Adjust size as needed */
  height: 100px;
  /* Adjust size as needed */
  background: black;
}

.tile img {
  width: 100px;
  height: 100px;
  opacity: 0;
  transform: scale(0);
  transition: opacity 2s, transform 2s;
}

.tile:hover img {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s, transform 0.5s;
  /* Fast fade-in and grow */
}

.trail {
  position: absolute;
  width: 50px;
  /* Adjust size as needed */
  height: 50px;
  /* Adjust size as needed */
  pointer-events: none;
  /* Ensure the trail elements don't interfere with mouse events */
}

.trail img {
  width: 50px;
  height: 50px;
  opacity: 1;
  transform: scale(1);
  transition: opacity 2s, transform 2s;
}

.trail.fade-out img {
  opacity: 0;
  transform: scale(0);
}

#footer-section {
  max-height: 600px !important;
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
}

.footerbg {
  position: relative;
  width: 100%;
  min-height: 600px;
  height: calc(100vh - 120px);
  overflow: hidden;
  background: black;
  display: flex;
  flex-wrap: wrap;
}

@media (max-width: 992px) {
  #footer-section {
    max-height: 460px !important;
  }
}

@media (max-width: 760px) {
  #footer-section {
    max-height: 460px !important;
  }
}

#footerOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0), black);
  display: flex;
  align-items: end;
  justify-content: center;
}

.footer_posts_slider {
  margin-bottom: 160px;
}

.address-list,
ul.footer-menu-class {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 15px;
  text-decoration: none;
  color: #fff;
  list-style: none;
  margin: 0;
  margin-bottom: 20px;
}

ul.footer-menu-class a {
  display: block;
  text-decoration: none !important;
  color: var(--pink) !important;
  font-family: Oxygen, sans-serif !important;
}

ul.footer-menu-class li:hover a {
  color: #fff !important;
}

div#social-media .gb-icon:hover svg * {
  fill: var(--pink) !important;
}

.newsletter {
  display: flex;
  gap: 15px;
}


@media (max-width: 1290px) {
  .footer_posts_slider {
    margin-bottom: 120px;
  }
}

@media (max-width: 768px) {
  .newsletter {
    flex-direction: column;
    gap: 0;
    margin-bottom: 20px;
  }
	.newsletter .submit-btn {
    margin-top:20px;
}

  .footer_posts_slider {
    margin-bottom: 60px;
  }
}

#newsletter .newsletter span.wpcf7-form-control-wrap {
  margin-right: 18px;
  max-width: 320px;
  display: block;
  background: transparent;
  margin: 0;
}

#newsletter .newsletter span.wpcf7-form-control-wrap input {
  width: 100%;
  background: transparent;
  border-radius: 25px;
  overflow: hidden;
  border: 2px solid #fff;
  padding-inline: 40px;
  display: block;
  box-sizing: border-box;
  color: #fff;
}

#newsletter .newsletter .submit-btn * {
  color: var(--black);
  fill: #000;
}

#newsletter .newsletter .submit-btn {
  background: #fff;
  height: 50px;
  padding: 0px 40px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#newsletter .newsletter .submit-btn {
  position:relative;
  padding: 0px;
  height: 50px;

}

#newsletter .newsletter .submit-btn svg{
    position: absolute;
    right: 40px;
    border-radius:0px;
}


#newsletter .newsletter .submit-btn:hover,
#newsletter .newsletter .submit-btn:hover * {
  background-color: var(--pink);
}

#newsletter .newsletter .submit-btn:hover {
  border-radius: 30px;
}
#newsletter .newsletter .submit-btn:hover p {
  border-radius:30px;
  }


#newsletter span.wpcf7-form-control-wrap input::placeholder {
  font-size: 18px;
  font-weight: 300;
  /* Light */
  color: #fff;
}

#newsletter input.wpcf7-form-control.wpcf7-submit {
  padding: 0;
  background: transparent;
  font-size: 18px;
}

#newsletter input.wpcf7-form-control.wpcf7-submit {
  position: relative;
    padding: 0px 64px 0px 40px;
    height: 50px;
}

#newsletter
  .newsletter
  .submit-btn:hover
  input.wpcf7-form-control.wpcf7-submit {
  background: transparent !important;
  color: #fff !important;
}

#newsletter .newsletter .submit-btn:hover svg,
#newsletter .newsletter .submit-btn:hover svg * {
  fill: #fff;
}

#newsletter .newsletter .submit-btn p {
  margin: 0 !important;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
#newsletter .wpcf7 form.invalid .wpcf7-response-output{
  border:2px solid #dc3232;
  color: #dc3232;
  border-radius: 40px;
  text-align: center;
  margin:0px;
}
#newsletter .wpcf7 form.sent .wpcf7-response-output{
  border:2px solid var(--pink);
  color:var(--pink);
  border-radius:40px;
  text-align:center;
  margin-top:30px;
}
.newsletter p{
	margin-bottom:0px;
}
#newsletter .newsletter span.wpcf7-spinner {
  display: none;
}

#newsletter .newsletter .submit-btn p {
  margin: 0 !important;
}

@media (max-width: 768px) {
  #newsletter .newsletter span.wpcf7-form-control-wrap {
    max-width: 100%;
  }

  #newsletter .newsletter span.wpcf7-form-control-wrap input {
    text-align: center;
  }

  #newsletter .newsletter .submit-btn {
    width: 200px;
  }
}

/* 
3d animation ends
*/

/* 
Header Styles 
*/

#site-header figure.gb-block-image {
  z-index: 99;
} 

div#modal_overlay[data-active="true"] {
  position: fixed;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: -1;
  overflow: hidden;
  z-index: 0;
  background-color: rgba(0, 0, 0, 0.2);
}

.PrimaryNavigation_icon {
  position: relative;
  top: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border: 2px solid var(--pink);
  border-radius: 100%;
  margin-right: 10px;
  margin-top: 5px;
  pointer-events: all;
  z-index: 100;
  background-color: transparent;
}

.PrimaryNavigation_icon:hover,
.PrimaryNavigation_icon:focus {
  background-color: transparent !important;
}

.PrimaryNavigation_line {
  position: absolute;
  width: 22px;
  height: 2px;
  background: var(--pink);
  will-change: transform;
  border-radius: 2px;
  transition: transform 0.3s cubic-bezier(0.75, 0, 0.25, 1);
}

.PrimaryNavigation_line:first-child {
  transform: translateY(-3px);
}

.PrimaryNavigation_line:last-child {
  transform: translateY(3px);
}

#header_menu_box[data-active="true"] .PrimaryNavigation_line:first-child {
  transform: translateY(0) rotate(45deg);
}

#header_menu_box[data-active="true"] .PrimaryNavigation_line:last-child {
  transform: translateY(0) rotate(-45deg);
}

.PrimaryNavigation_flyout {
  width: 380px;
  height: auto;
  background: #fff;
  position: absolute;
  right: 0;
  top: 30px;
  z-index: 99;
  padding: 70px 40px 50px;
  border-radius: 30px;
  transform: scale(0.4);
  /* Initial scale */
  opacity: 0;
  /* Initial opacity */
  transform-origin: top right;
  transition: transform 0.3s ease-out, opacity 0.4s ease-out;
  box-shadow: 0px 4px 34px 0px rgba(0, 0, 0, 0.65);
}

.PrimaryNavigation_flyout li.start_a_project.menu-item {
  margin-top: 20px;
}

.PrimaryNavigation_flyout li.start_a_project.menu-item > a {
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  overflow: hidden;
  border: 2px solid #000;
  position: relative;
}

.PrimaryNavigation_flyout li.start_a_project.menu-item > a::after {
  content: "";
  height: 14px;
  width: 14px;
  padding-left: 10px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M14 1C14 0.447716 13.5523 4.87118e-07 13 2.34237e-07L4 1.03503e-06C3.44771 6.97852e-07 3 0.447716 3 1C3 1.55229 3.44771 2 4 2L12 2L12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10L14 1ZM1.70711 13.7071L13.7071 1.70711L12.2929 0.292894L0.292893 12.2929L1.70711 13.7071Z" fill="%231E1E1E"/></svg>');
}

.PrimaryNavigation_flyout li.start_a_project.menu-item:hover > a {
  background-color: var(--pink, rgb(255, 0, 200));
  border-color: var(--pink, rgb(255, 0, 200));
  color: #fff;
}

.PrimaryNavigation_flyout li.start_a_project.menu-item:hover > a > span {
  color: #000 !important;
}

.PrimaryNavigation_flyout li.start_a_project.menu-item > a > span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  font-weight: 400;
  text-wrap: nowrap;
}

#header_menu_box[data-active="true"] .PrimaryNavigation_flyout {
  transform: scale(1);
  opacity: 1;
}

#header_menu_box[data-active="false"] .PrimaryNavigation_flyout {
  transform: scale(0.4);
  opacity: 0;
}

.PrimaryNavigation_flyout ul.sub-menu {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
li.start_a_project.menu-item.menu-item-type-custom.menu-item-object-custom {
  display: none;
}

/* @media(max-width:768px){
	.PrimaryNavigation_icon{
		margin-top:10px;
		margin-right:35px;
	}
} */

@media (max-width: 480px) {
  .PrimaryNavigation_flyout {
    width: calc(100% - 30px);
    padding: 40px 30px 40px;
    margin-right: 10px;
  }
}

ul#header_menu_ul {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

ul#header_menu_ul li a {
  display: flex;
  gap: 5px;
  align-items: center;
  text-decoration: none;
  color: var(--black);
  font-size: 1.125em;
  font-size: var(--nav-fs);
  cursor: pointer !important;
}

ul#header_menu_ul,
ul#header_menu_ul * {
  list-style: none;
}

ul#header_menu_ul li:hover > a,
a.submenu-open * {
  color: var(--pink) !important;
}

ul#header_menu_ul .menu-item {
  opacity: 0;
  /* Initially hidden */
  transition: opacity 0.5s ease-in-out;
  /* Smooth transition for opacity */
}

#header_menu_box[data-active="true"] ul#header_menu_ul .menu-item {
  opacity: 1;
}

/* Rotate animation */
@keyframes rotate-360 {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(180deg);
  }
}

/* Apply rotation animation */
.submenu-open #animated-svg {
  animation: rotate-360 0.3s linear forwards;
}

/* Hide the minus icon after animation with delay */
.submenu-open #minus-icon {
  display: block;
  opacity: 1;
  animation: hide-icon 0.2s forwards;
  animation-delay: 0.25s;
}

@keyframes hide-icon {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    display: none;
  }
}

/* 
End Of Header Styles 
*/

/* Home Page Styles */

body.home .hide-from-home {
  display:none;
}

body.page-id-498 .hide-from-services-list,
body.single.single-service .hide-from-services-list {
  display:none;
}

.home-page-service-btns .btn-group-item p{
  color: #fff;
}

.logos-slider {
  background-color: #000 !important;
}

@media (max-width: 500px) {
  .btn-group {
    align-items: stretch !important;
  }
}

/* Home Work Section */

.work-grid-container .animated-box-home {
  width: 100%;
  height: 500px;
  /* background-color: #7a2dff; */
  border-radius: 45px;
  overflow: hidden;
  position: relative;
  transition: border-radius 0.5s ease, background-color 0.2s ease;
  display: flex;
  justify-content: center;
  align-items: center;
}

.work-grid-container .animated-box-home:hover {
  border-radius: 150px;
}

.work-grid-container .block-container-home {
  position: absolute;
  box-sizing: border-box;
  transform: rotate(45deg);
  transform-origin: center center;
  transition: transform 0.5s ease, filter 0.3s ease;
  filter: blur(10px); /* Initial blur applied */
}

/* Remove blur on hover */
.work-grid-container .animated-box-home:hover .block-container-home {
  filter: blur(0); 
  transform: rotate(0); 
}

.work-grid-container .block-home {
  background-color: #cccccc;
  border-radius: 15px;
  height: 400px;
  overflow: hidden;
  position: relative;
}

.work-grid-container .block-home img {
  width: 100%;
}

.work-grid-container .animated-box-home:hover .block-container-home {
  animation: move-up-diagonal 86s linear infinite;
}

.work-grid-container .loading-bar-container-home {
  position: absolute;
  width: 80%;
  height: 20px;
  background-color: #e0e0e0;
  border-radius: 10px;
  overflow: hidden;
}

.work-grid-container .center-bar-home {
  height: 100%;
  width: 0;
  background-color: #ff26f7;
  transition: width 0.3s ease;
}

.work-grid-container .loading-screen-home {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 10;
}

.work-grid-container .center-button-home {
  opacity: 0;
  position: absolute;
  bottom: 20px;
  background-color: #ff26f7;
  color: #fff !important;
  cursor: pointer;
  text-decoration: none;
  align-items: center;
  border-radius: 50px;
  border: 2px solid var(--pink);
  color: var(--black);
  display: flex;
  flex-grow: 1;
  flex-shrink: 0;
  font-family: Oxygen;
  font-size: 16px;
  font-weight: normal;
  justify-content: center;
  max-height: 50px;
  padding: 20px 40px;
  text-align: center;
}

.work-grid-container .center-button-home:hover {
  background-color: #fff !important;
  color: var(--pink) !important;
}

.work-grid-container .animated-box-home:hover .center-button-home {
  opacity: 1;
  transform: translateY(0);
}

.work-grid-container {
  display: flex;
  gap: 100px;
}

.work-grid-container .popup-image {
  position: absolute;
  top: 40px; /* Reduced top spacing to bring the image closer to the top */
  left: 40px; /* Reduced left spacing to increase the image width */
  right: 40px; /* Reduced right spacing to increase the image width */
  bottom: -50px; /* Increased bottom offset to allow the image to extend further */
  background-size: cover; /* Make the image cover the entire container width */
  background-repeat: no-repeat;
  background-position: top center; /* Ensure the top of the image is visible */
  border-radius: 30px 30px 0px 0px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  z-index: 5; /* Ensure the image is behind the button */
  transition: opacity 0.2s ease;
}

.animated-box-home:hover .popup-image {
  opacity: 0; /* Fade out the popup image on hover */
}


.card-heading{
  margin-top:80px;
	margin-bottom:40px;
}

@media (max-width: 768px) {
  .work-grid-container .popup-image {
    border-radius: 30px 30px 0 0; /* Remove the bottom left and right corners */
  }
}

.work-grid-container .popup-image {
  height: calc(100% - 40px);
}

.card-heading {
  margin-top: 60px;
}

@media (max-width: 800px) {
  .work-grid-container {
    gap: 0px;
  }
}

@media (max-width: 660px) {
  .work-grid-container {
    flex-direction: column;
  }

  .card-heading {
    margin-top: 80px;
    font-size: 22px;
  }

  .work-grid-column {
    gap: 15px;
  }
}

.work-grid-container .work-grid-column {
  display: flex;
  flex-direction: column;
  gap: 0px;
  width: 100%;
  
}

.work-grid-container .work-grid-column.column_2 {
  margin-top: 20%;
}


.work-grid-container .work-grid-item img {
  min-width: 100%;
  background: gray;
  border-radius: 15px;
}

.work-grid-container .work-grid-item p {
  margin-top: 10px;
  font-size: 16px;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .work-grid-container .center-button-home {
    opacity: 1;
  }

  .work-grid-container .work-grid-column.column_2 {
    margin-top: 0px;
  }

  .work-grid-container .animated-box-home {
    width: 100%;
    height: 430px;
  }

  .work-grid-container .block-container-home {
    width: 3000px;
    height: 3000px;
    top: -1250px;
    left: -1250px;
  }

  .work-grid-container .block-home {
    height: 300px;
  }
}

@keyframes move-up-diagonal {
  0% {
    transform: translate(0, 0) rotate(45deg);
  }

  100% {
    transform: translate(-2000px, -2000px) rotate(45deg);
  }
}

/**
Services Page
*/

ul.content-ul {
  margin-left: 25px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.btn-group p {
  color: var(--black);
}

.btn-group-item p {
  margin-bottom: 0px;
}



.list_wrapper ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 1.5em;
}

.list_wrapper li {
  padding-left: 30px;
  position: relative;
  margin-left:12px;
  margin-bottom: 10px;
  font-size: 18px;
}
.list_wrapper li::marker {
  content: ''; /* Removes the marker */
}

.list_wrapper li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url('data:image/svg+xml,<svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" height="20px" width="20px" xmlns="http://www.w3.org/2000/svg"><path d="M7 7h10v10"></path><path d="M7 17 17 7"></path></svg>');
  background-size: contain;
  background-repeat: no-repeat;
}
.horizontal-section {
  scroll-behavior: smooth;
}
@media (max-width: 768px) {
  .list_wrapper li {
    font-size: 16px;
  }
}

@media (min-width: 1024px) and (max-width: 1120px) {
  .fractional-team {
    width: 48% !important;
  }
}

.gradient-number {
  font-size: 60px;
  font-weight: 500;
  background: linear-gradient(180deg, #f735f5 25%, #00b7e5 70%, #00b7e5 50%);
  width: fit-content;
  -webkit-background-clip: text;
  color: transparent;
}

@media (max-width: 768px) {
  .scroll-arrow {
    /* display: none !important; */
  }
  .webdesign-slider .scroll-arrow {
    display: block ;
    padding: 0px;
    top:70%;
  }
  .webdesign-slider .scroll-arrow svg{
    height:40px !important;

  }
  
}


@media (max-width: 330px) {
  .btn-group-item {
    font-size: 14px !important;
  }
}

/* Contact form style start */
.contact-main-form a {
  color: var(--pink);
}

.contact-main-form a:hover {
  color: var(--contrast);
}

.contact-main-form textarea {
  height: 151px;
}

.contact-main-form body,
.contact-main-form button,
.contact-main-form input,
.contact-main-form select,
.contact-main-form textarea {
  font-size: 20px;
}

.contact-interested-btn {
  margin-bottom: 110px;
}

.contact-btn-grp span.wpcf7-list-item {
  margin-right: 15px;
  margin-bottom: 15px;
  margin-left: 0px;
}

.contact-btn-grp .wpcf7-list-item label input[type="checkbox"] {
  visibility: hidden !important;
  width: 0px;
}

/* Pink border and background for label */
.contact-btn-grp .wpcf7-list-item:nth-child(odd) .wpcf7-list-item-label {
  display: inline-block;
  padding: 10px 30px;
  border: 2px solid var(--pink);
  border-radius: 40px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.contact-btn-grp .wpcf7-list-item:nth-child(odd) .wpcf7-list-item-label:hover {
  background-color: var(--pink);
  color: white;
}

.contact-btn-grp
  .wpcf7-list-item:nth-child(odd)
  input[type="checkbox"]:checked
  + .wpcf7-list-item-label {
  background-color: var(--pink);
  color: white;
}

/* Blue border and background for label */
.contact-btn-grp .wpcf7-list-item:nth-child(even) .wpcf7-list-item-label {
  display: inline-block;
  padding: 10px 30px;
  border: 2px solid var(--blue);
  border-radius: 40px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.contact-btn-grp .wpcf7-list-item:nth-child(even) .wpcf7-list-item-label:hover {
  background-color: var(--blue);
  color: white;
}

.contact-btn-grp
  .wpcf7-list-item:nth-child(even)
  input[type="checkbox"]:checked
  + .wpcf7-list-item-label {
  background-color: var(--blue);
  color: white;
}

.button-width input[type="submit"] {
  font-size: 18px;
}

.address-main a {
  color: var(--contrast);
  text-decoration: none;
}

.address-main a:hover {
  color: var(--pink);
}

.half-width-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  gap: 30px;
}

.contact-main-form .wpcf7-not-valid-tip {
  font-size: 15px;
  padding: 10px 15px;
}

.contact-main-form .check-width .wpcf7-not-valid-tip {
  padding: 10px 30px;
}

.half-width {
  width: 50%;
  display: inline-block;
  margin-bottom: 35px;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
  background-color: white;
  border-bottom: 1px solid black;
  width: 100%;
  border-top: none;
  border-right: none;
  border-left: none;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  background-color: var(--base-3);
  outline: 0;
}

.width-wrapper {
  display: flex;
  padding-top: 35px;
  gap: 20px;
}

.check-width {
  width: 80%;
  display: flex;
  align-items: center;
}

.half-width .budget-info {
  padding-top: 15px;
  margin-left: 15px;
}

.half-width .budget-info a {
  color: var(--pink);
}

.half-width .budget-info a:hover {
  color: var(--contrast);
}

.button-width {
  width: 20%;
  display: flex;
  height: 60px;
}

.button-width input.wpcf7-form-control.wpcf7-submit {
  color: #ffffff;
  background-color: var(--pink);
  border-radius: 40px;
  border: 2px solid;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"%3E%3Cpath d="M14 1C14 0.447716 13.5523 4.87118e-07 13 2.34237e-07L4 1.03503e-06C3.44771 6.97852e-07 3 0.447716 3 1C3 1.55229 3.44771 2 4 2L12 2L12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10L14 1ZM1.70711 13.7071L13.7071 1.70711L12.2929 0.292894L0.292893 12.2929L1.70711 13.7071Z" fill="%23ffffff"%3E%3C/path%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) center;
  background-size: 15px;
  /* Adjust the size as necessary */
  padding: 14px 62px 14px 40px;
  /* Adjust padding as necessary */
}

.button-width input[type="submit"]:hover {
  border-color: var(--pink);
  background-color: var(--white) !important;
  color: var(--pink) !important;
  border: 2px solid;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"%3E%3Cpath d="M14 1C14 0.447716 13.5523 4.87118e-07 13 2.34237e-07L4 1.03503e-06C3.44771 6.97852e-07 3 0.447716 3 1C3 1.55229 3.44771 2 4 2L12 2L12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10L14 1ZM1.70711 13.7071L13.7071 1.70711L12.2929 0.292894L0.292893 12.2929L1.70711 13.7071Z" fill="%23F735F5"%3E%3C/path%3E%3C/svg%3E') !important;
}

.check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"] {
  min-width: 20px;
  max-width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  outline: none;
  cursor: pointer;
  position: relative;
  background-color: white;
  display: inline-block;
  vertical-align: middle;
}

.check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"]:checked {
  background-color: var(--pink);
  border-color: var(--pink);
}

.contact-main-form p {
  margin: 0px;
}

.contact-main-form span.wpcf7-list-item.first.last {
  margin: 0px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.contact-main-form .wpcf7 form.sent .wpcf7-response-output {
  color: var(--pink);
  border-radius: 40px;
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) center;
  background-size: 15px;
  text-align: center;
  border: 2px solid var(--pink);
  padding: 14px 20px 14px 20px;
}

.contact-main-form .wpcf7-response-output {
  display: block;
}

.contact-main-form .wpcf7 form.invalid .wpcf7-response-output {
  border: 2px solid #dc3232;
  color: #dc3232;
  border-radius: 40px;
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) center;
  background-size: 15px;
  text-align: center;
  padding: 14px 20px 14px 20px;
}

/* Hide all but the first .wpcf7-not-valid-tip for each input field */
.wpcf7-form .wpcf7-form-control-wrap {
  position: relative;
}

.wpcf7-form .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  display: none;
  /* Hide all by default */
}

.wpcf7-form .wpcf7-form-control-wrap .wpcf7-not-valid-tip:first-of-type {
  display: block;
  /* Display only the first error message */
}

@media (max-width: 768px) {
  .contact-main-form body,
  .contact-main-form button,
  .contact-main-form input,
  .contact-main-form select,
  .contact-main-form textarea {
    font-size: 18px;
  }

  .contact-main-form p {
    font-size: 14px;
  }

  .width-wrapper {
    flex-direction: column;
  }

  .check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"] {
    width: 25px;
  }

  .check-width {
    width: 100%;
  }

  .contact-main-form span.wpcf7-list-item.first.last {
    align-items: start;
  }

  .check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"] {
    margin-top: 5px;
  }
}

/* Contact form style start */
.contact-main-form a {
  color: var(--contrast);
}

.contact-main-form a:hover {
  color: var(--pink);
}

.contact-main-form textarea {
  height: 151px;
}

.contact-main-form body,
.contact-main-form button,
.contact-main-form input,
.contact-main-form select,
.contact-main-form textarea {
  font-size: 20px;
}

.contact-main-form p {
  font-size: 18px;
}

.contact-interested-btn {
  margin-bottom: 110px;
}

.contact-btn-grp span.wpcf7-list-item {
  margin-right: 15px;
  margin-bottom: 15px;
  margin-left: 0px;
}

.contact-btn-grp .wpcf7-list-item label input[type="checkbox"] {
  visibility: hidden !important;
  width: 0px;
}

/* Pink border and background for label */
.contact-btn-grp .wpcf7-list-item:nth-child(odd) .wpcf7-list-item-label {
  display: inline-block;
  padding: 10px 30px;
  border: 2px solid var(--pink);
  border-radius: 40px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.contact-btn-grp .wpcf7-list-item:nth-child(odd) .wpcf7-list-item-label:hover {
  background-color: var(--pink);
  color: white;
}

.contact-btn-grp
  .wpcf7-list-item:nth-child(odd)
  input[type="checkbox"]:checked
  + .wpcf7-list-item-label {
  background-color: var(--pink);
  color: white;
}

/* Blue border and background for label */
.contact-btn-grp .wpcf7-list-item:nth-child(even) .wpcf7-list-item-label {
  display: inline-block;
  padding: 10px 30px;
  border: 2px solid var(--blue);
  border-radius: 40px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.contact-btn-grp .wpcf7-list-item:nth-child(even) .wpcf7-list-item-label:hover {
  background-color: var(--blue);
  color: white;
}

.contact-btn-grp
  .wpcf7-list-item:nth-child(even)
  input[type="checkbox"]:checked
  + .wpcf7-list-item-label {
  background-color: var(--blue);
  color: white;
}

.button-width input[type="submit"] {
  font-size: 18px;
}

.address-main a {
  color: var(--contrast);
  text-decoration: none;
}

.address-main a:hover {
  color: var(--pink);
}

.half-width-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  gap: 30px;
}

.wpcf7-not-valid-tip {
  font-size: 15px;
  padding: 10px 15px;
}

.half-width {
  width: 50%;
  display: inline-block;
  margin-bottom: 35px;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
  background-color: white;
  border-bottom: 1px solid black;
  width: 100%;
  border-top: none;
  border-right: none;
  border-left: none;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  background-color: var(--base-3);
  outline: 0;
}

.width-wrapper {
  display: flex;
  padding-top: 35px;
  gap: 20px;
}

.check-width {
  width: 80%;
  display: flex;
  align-items: center;
}

.budget-info {
  padding-top: 15px;
}

.button-width {
  width: 20%;
  display: flex;
  height: 60px;
}

.button-width input.wpcf7-form-control.wpcf7-submit {
  color: #ffffff;
  background-color: var(--pink);
  border-radius: 40px;
  border: 2px solid;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"%3E%3Cpath d="M14 1C14 0.447716 13.5523 4.87118e-07 13 2.34237e-07L4 1.03503e-06C3.44771 6.97852e-07 3 0.447716 3 1C3 1.55229 3.44771 2 4 2L12 2L12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10L14 1ZM1.70711 13.7071L13.7071 1.70711L12.2929 0.292894L0.292893 12.2929L1.70711 13.7071Z" fill="%23ffffff"%3E%3C/path%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) center;
  background-size: 15px;
  /* Adjust the size as necessary */
  padding: 14px 62px 14px 40px;
  /* Adjust padding as necessary */
}

.button-width input[type="submit"]:hover {
  border-color: var(--pink);
  background-color: var(--white) !important;
  color: var(--pink) !important;
  border: 2px solid;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"%3E%3Cpath d="M14 1C14 0.447716 13.5523 4.87118e-07 13 2.34237e-07L4 1.03503e-06C3.44771 6.97852e-07 3 0.447716 3 1C3 1.55229 3.44771 2 4 2L12 2L12 10C12 10.5523 12.4477 11 13 11C13.5523 11 14 10.5523 14 10L14 1ZM1.70711 13.7071L13.7071 1.70711L12.2929 0.292894L0.292893 12.2929L1.70711 13.7071Z" fill="%23F735F5"%3E%3C/path%3E%3C/svg%3E') !important;
}

.check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"] {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid;
  appearance: none;
  /* Remove default appearance */
  -webkit-appearance: none;
  /* Remove default appearance for WebKit browsers */
  -moz-appearance: none;
  /* Remove default appearance for Mozilla browsers */
  outline: none;
  cursor: pointer;
  position: relative;
  background-color: white;
  display: inline-block;
  vertical-align: middle;
}

.check-width .wpcf7-form-control.wpcf7-checkbox input[type="checkbox"]:checked {
  background-color: var(--pink);
  /* Background color when checked */
  border-color: var(--pink);
  /* Border color when checked */
}

.contact-main-form p {
  margin: 0px;
}

.contact-main-form span.wpcf7-list-item.first.last {
  margin: 0px;
}

.contact-main-form .wpcf7-response-output {
  display: block;
}

@media (max-width: 768px) {
  .contact-main-form body,
  .contact-main-form button,
  .contact-main-form input,
  .contact-main-form select,
  .contact-main-form textarea {
    font-size: 18px;
  }

  .contact-main-form p {
    font-size: 16px;
  }

  .contact-interested-btn {
    margin-bottom: 60px;
  }

  .half-width-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: space-between;
    gap: 15px;
  }

  .half-width {
    width: 100%;
    display: inline-block;
    margin-bottom: 20px;
  }

  .budget-info {
    padding-top: 0px;
  }

  .width-wrapper {
    display: flex;
    flex-direction: column;
  }

  .button-width {
    justify-content: start;
  }

  .contact-main-form textarea {
    height: 100px;
  }

  .check-width {
    width: 100%;
  }
}

/* Contact form style end */

/* Portfolio detail style start */

.portfolio-arrow-img img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 40px;
}
.portfolio-single-img figure {
  height: 100%;
}
.portfolio-single-img img {
  height: 100%;
}
.Our-Role p:not(:last-child) {
  margin-bottom: 0px !important;
}


/* .visit-site-btn::before {
  content: "";
  position: absolute;
  right: 30px;

  top: 50%;
  width: 15px;
  height: 10px;
 
  background: url("https://stg-blueflamingo-dev.kinsta.cloud/wp-content/uploads/2024/07/Arrow-4.png")
    no-repeat center center;
  background-size: contain;
  transform: translateY(-50%) rotate(180deg);
} */

.visit-site-btn {
  white-space: nowrap;
}

/* Portfolio detail style end */

/**
News Page Styles
*/

div#single-post-content ul {
  margin-bottom: 30px;
}

#single-news-hero a {
  pointer-events: none;
}

.tab-btn-wrapper:not(.single-post-page-btn) {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
}

.blog-btn {
  background: var(--pink);
  text-decoration: none;
  color: #fff;
  padding: 8px 25px;
  border: 2px solid var(--pink);
  display: inline-block;
  border-radius: 28px;
}

.blog-btn a {
  color: var(--base-3) !important;
}
.blog-single-btn {
  display: flex;
  flex-wrap: wrap;
}
.blog-single-btn a {
  background: var(--pink);
  text-decoration: none;
  color: #fff;
  padding: 8px 25px;
  border: 2px solid var(--pink);
  display: inline-block;
  border-radius: 28px;
}
.blog-single-btn.wp-block-post-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tab-btn-wrapper .taxonomy-post_tag.featured-btn.wp-block-post-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tab-btn-wrapper .taxonomy-category.featured-btn.wp-block-post-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.tab-btn-wrapper span {
  display:none;
}

@media (max-width: 1120px) {
  .column-sections {
    flex-direction: column;
  }

  .service-left-section {
    width: 100% !important;
  }
  
}

.blog_service_button p {
  color: var(--base-3) !important;
}

@media (max-width: 768px) {
  .blog_service_button p {
    color: 16 !important;
  }

  .blog-btn {
    padding: 2px 12px;
    font-size: 12px;
  }
 
}

@media (max-width: 330px) {
  .blog_service_button p {
    color: 12 !important;
  }
}

.featured-btn a {
  background: var(--pink);
  text-decoration: none;
  color: #fff;
  padding: 8px 25px;
  border: 2px solid var(--pink);
  display: inline-block;
  border-radius: 28px;
  pointer-events: none;
}

/* .featured-btn:hover a{
  background-color: var(--darkpink);
  color:var(--base-3)!important;
} */
.blog_service_button .btn-group {
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 20px;
  row-gap: 20px;
  padding-right: 0px;
  padding-left: 0px;
  max-width: 992px;
  margin: auto;
}

#featured-post h2.wp-block-post-title {
  width: 100%;
  cursor: pointer;
  color: #1e1e1e;
}

.taxonomy-category.blog-btn.post-cat-btn {
  position: absolute;
  top: 25px;
  left: 25px;
  z-index: 99;
}

.single-post-card {
  cursor: pointer;
}

.single-post-card a {
  text-decoration: none;
}

#single-post-content p {
  font-size: 18px;
}

#single-post-content h3 {
  font-size: 25px;
}

@media (max-width: 768px) {
  #single-post-content p {
    font-size: 16px;
  }

  #single-post-content h3 {
    font-size: 20px;
  }

  #featured-post h2.wp-block-post-title {
    font-size: 24px !important;
  }

  #featured-post .wp-block-post-featured-image img {
    display: block;
    min-height: 300px !important;
    object-fit: cover;
  }

  .featured-btn a {
    padding: 2px 12px;
    font-size: 12px;
  }
}

#featured-post h2.wp-block-post-title a {
  text-decoration: none;
  color: #1e1e1e;
}

/* @media (min-width: 1280px) {
  #featured-post h2.wp-block-post-title {
    max-width: 992px;
  }
} */

.blog-main-tabs .gb-button.gb-block-is-current {
  color: white;
}

.blog-main-tabs .gb-button.blog-news-btn.gb-block-is-current {
  background-color: var(--blue);
  border-color: var(--blue);
}

.blog-main-tabs .gb-button:not(.blog-news-btn).gb-block-is-current {
  background-color: var(--pink);
  border-color: var(--pink);
}

.blog-main-tabs .gb-button.blog-news-btn:hover {
  border-color: var(--blue);
}

.blog-main-tabs .gb-button.blog-insights-btn:hover {
  border-color: var(--pink);
}

.blog-main-tabs .gb-button.all-categories-btn:hover {
  border-color: var(--pink);
}

.blog-main-tabs button {
  background-color: white;
}

.blog-main-tabs .blog-arrow-img {
  width: 40px;
  height: 40px;
}

.blog-main-tabs .blog-arrow-img figure.gb-block-image {
  height: 40px;
}

.blog-main-tabs .blog-arrow-img img {
  border-radius: 0px !important;
}

.blog-main-tabs .blog-posts-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 25px;
}

.blog-main-tabs .gb-headline-text a {
  text-decoration: none;
  color: #333;
  font-size: 18px;
  display: block;
}

.taxonomy-category.our-news.blog-btn {
  background: var(--blue);
  border: 2px solid var(--blue);
}

.blog-main-tabs figure.gb-block-image {
  height: 300px;
  width: 100%;
}

.blog-main-tabs figure.gb-block-image img {
  border-radius: 30px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-main-tabs .gb-container.single-post-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.blog-main-tabs .gb-container.single-post-card h3.gb-headline {
  flex-shrink: 0;
  margin-top: 25px;
  line-height: inherit;
}

.blog-main-tabs .taxonomy-category.blog-btn.post-cat-btn {
  flex-shrink: 0;
  margin-top: auto;
}

.blog-main-tabs .gb-grid-column {
  display: flex;
  flex-direction: column;
  position: relative;
}

.blog-main-tabs .gb-container.single-post-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.blog-main-tabs .load-more-container {
  display: flex;
  justify-content: center;
  margin-top: 75px;
}

.blog-main-tabs .load-more-btn {
  display: inline-block;
  padding: 10px 20px;
  background-color: var(--pink);
  color: white;
  border: none;
  cursor: pointer;
  text-align: center;
  max-width: 180px;
  border-radius: 30px;
  border: 2px solid var(--pink);
  font-size: 16px;
  transition: background-color 0.3s ease;
}

.blog-main-tabs .load-more-btn.d-none {
  display: none !important;
}

.blog-main-tabs .load-more-btn:hover {
  background-color: var(--base-3);
  border: 2px solid var(--pink);
  color: var(--pink, #000);
}

@media (max-width: 1360px) {
  .blog-main-tabs figure.gb-block-image {
    height: 250px;
  }
}

@media (max-width: 992px) {
  .blog-main-tabs .blog-posts-container {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 20px;
  }

  .blog-main-tabs .load-more-container {
    margin-top: 65px;
  }
}

@media (max-width: 768px) {
  .blog-main-tabs .blog-arrow-img {
    align-self: center;
  }

  .blog-main-tabs .load-more-container {
    margin-top: 55px;
  }
}

@media (max-width: 660px) {
  .blog-main-tabs .blog-posts-container {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px 10px;
  }

  .blog-main-tabs figure.gb-block-image img {
    border-radius: 15px;
  }
}

/**
News Page Styles Ends
*/

/**
Footer Slick Slider
*/

.site-footer {
  background-color: #000;
}

.footer_posts_slider .slick-slide {
  padding-right: 35px;
}

.footer_posts_slider .slick-slide img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 30px;
  max-height: 384px;
  min-height: 384px;
}

@media (max-width: 1200px) {
  .footer_posts_slider .slick-slide img {
    max-height: 245px;
    min-height: 245px;
  }
}

.footer_posts_slider a {
  text-decoration: none;
}

.footer_posts_slider .slick-slide h3 {
  font-size: 20px;
  margin: 30px 0;
  color: #fff;
}

.footer_posts_slider .slick-next {
  right: var(--container-margin);
}

.footer_posts_slider .slick-list {
  padding: 0 15% 0 0 !important;
}

.footer_posts_slider .slick-next:before {
  content: " ";
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 94 94" fill="none"><circle cx="47" cy="47" r="47" fill="white"/><path d="M69.2981 48.0721C69.8902 47.48 69.8902 46.52 69.2981 45.9279L59.6495 36.2793C59.0574 35.6873 58.0975 35.6873 57.5054 36.2793C56.9133 36.8714 56.9133 37.8314 57.5054 38.4235L66.0819 47L57.5054 55.5765C56.9133 56.1686 56.9133 57.1286 57.5054 57.7207C58.0975 58.3127 59.0574 58.3127 59.6495 57.7207L69.2981 48.0721ZM25.7744 48.5161L68.226 48.5161V45.4839L25.7744 45.4839V48.5161Z" fill="%231E1E1E"/></svg>');
  width: 56px;
  height: 56px;
  position: absolute;
  top: -45px;
  left: -50px;
  opacity: 1;
}

.footer_posts_slider .slick-prev:before {
  display: none;
  /* content: ' ';
  background: url('<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 94 94" fill="none"><circle cx="47" cy="47" r="47" fill="white"/><path d="M69.2981 48.0721C69.8902 47.48 69.8902 46.52 69.2981 45.9279L59.6495 36.2793C59.0574 35.6873 58.0975 35.6873 57.5054 36.2793C56.9133 36.8714 56.9133 37.8314 57.5054 38.4235L66.0819 47L57.5054 55.5765C56.9133 56.1686 56.9133 57.1286 57.5054 57.7207C58.0975 58.3127 59.0574 58.3127 59.6495 57.7207L69.2981 48.0721ZM25.7744 48.5161L68.226 48.5161V45.4839L25.7744 45.4839V48.5161Z" fill="#1E1E1E"/></svg>');
  width: 56px;
  height: 56px;
  position: absolute; 
  top: -45px;
  right: 0; */
}

.footer-email-heading a {
  color: #fff;
  text-decoration: none;
}

#footer-bottom-text {
  text-align: center;
  width: 100%;
  position: absolute;
  bottom: 0;
  margin-bottom: 50px;
}
span.wp-block-post-terms__separator {
  visibility: hidden;
}
.site-footer {
  overflow-x: hidden;
}
/* @media(max-width:1024px){

  .webdesign-slider {
    margin-left:auto !important;
}

} */


div#work-section {
  background: #000 !important;
}

div#work-section > div {
  background: #fff !important;
}

div#clients_logo {
  background: #000;
}

#heroOverlay .herooverlay-inner .secondary-heading-top {
  color: #00B7E5;
}

.web-design-in-richmond .scroll-item-inner{
  min-height:850px;
}
.web-design-in-twickenham .scroll-item-inner{
  min-height:850px;
}


@media(max-width:768px){
  
  .web-design-in-richmond .scroll-item-inner{
    min-height:850px;
  }
  .web-design-in-twickenham .scroll-item-inner{
    min-height:850px;
  }
}


/* .single-service .dynamic-entry-content h2.gb-headline {
  display: none;
} */

.single-service .btn-group-item p {
  margin-bottom: 0px;
  color: #000;
}

.single-service .btn-group-item:hover p {
  color: #fff !important;
}
.page-id-2796 .footer-article-wrapper-container{
    display:none;
}

#Hero-Section{
  position:relative;
}