* {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  scroll-behavior: smooth;

}
body{
  background-color: #f7f9fc !important;
}

.footer-logo{

  transform: translateX(-10px);
  -webkit-transform: translateX(-10px);
  -moz-transform: translateX(-10px);
  -ms-transform: translateX(-10px);
  -o-transform: translateX(-10px);
}

.text-address{
  transform: translateY(10px) !important;
  -webkit-transform: translateY(10px) !important;
  -moz-transform: translateY(10px) !important;
  -ms-transform: translateY(10px) !important;
  -o-transform: translateY(10px) !important;
  font-weight: 400 !important;
}



.mb-2 a{
  font-size: .8vw;
}

.panorama-1{
  margin: 0 auto;
  cursor: all-scroll;

  width: 100%;
min-height: 75vh;
  /* padding-bottom: 30%; */

  background:  url('../images/contact/hero.png');
  background-size: cover;
  background-position: 50% 0;

  transition: background-position 1s linear;
}

iframe{
  width: 100%;
}



/* footer logo */
footer {
  background-color: #333535;
}

.text {
  color: #D3D3D3;
  font-weight: 500;
  text-decoration: none;
}

.company {
  color: white;
  margin-top: 1em;
  font-size: 1.2vw;
}

.active {
  color: #0084FF;
}

.fa {
  padding: 10px;
  font-size: 20px;
  width: 40px;
  height: 40px;
  font-size: 20px !important;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  color: #fff;
  background-color: #0085FF;
}
.fa:hover {
  background: linear-gradient(132.14deg, #F8953A 0%, #EF3C69 88.51%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  animation: footerIcon .6s ease-in-out alternate forwards;
}
@keyframes footerIcon {
  from {
    transform: rotate(180deg);
  }

  to {
    transform: rotate(0deg);
  }
}

.fa:hover{
  text-decoration: none;
}

.fa-facebook {
  background: #0085FF;
  color: white;
}

.fa-twitter {
  background: #fff;
  color: #0085FF;
  font-size: 20px;
}

.fa-linkedin {
  background: #0085FF;
  color: white;
}

.fa-instagram {
  background-color: #0085FF;
  color: white;


}
.py-2 .row .white{
display: flex;
align-items: center;
justify-content: flex-start;
}
.py-2 .row .white2{
display: flex;
align-items: center;
justify-content: flex-end;
}

.py-2 .row .col-sm-12 a{
opacity: .7;
font-size: .8vw;
color: #fff;
}
.py-2 .row .col-sm-12 a:hover{
text-decoration: none;
}


.py-2 {
  background-color: #282828;
}

.center {
  margin-bottom: 5em;
}

h3 {
  color: black;
}

.cardName {
  line-height: 2.5em;
}

/* upper footer */

.sub-footer {
  background-color: #0084FF;
  min-height: 20vh;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.sub-left {
  color: linear-gradient(90deg, rgba(11, 166, 253, 1) 48%, rgba(24, 206, 249, 1) 99%);
  font-weight: 900;
}

.sub-left h2{
  color: #fff;
  font-size: 35px;
  font-weight: 500;
}

.talk a {
  position: relative;
  padding: 12px 82px;

  margin: 5px;
  border: 2px solid transparent;
  display: inline-block;
  font-size: 20px;
  border-radius: 30px;
  background: linear-gradient(to left, #0085FF 50%, #fFF 50%) right;
  /* background: linear-gradient(132.14deg, #F8953A 0%, #EF3C69 88.51%); */
  background-size: 200%;
  transition: .5s ease-out;
  border: 0px;
  color: #fff;
  font-weight: 500;
}

.talk a::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 30px;
  padding: 2px; /* control the border thickness */
  /* background:linear-gradient(132.14deg, #0085FF 0%, #18D0FA 88.51%); */
  background-color: #fff;
  /* background: linear-gradient(132.14deg, #F8953A 0%, #EF3C69 88.51%); */
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}
.talk a:hover{
  text-decoration: none;
  background-position: left;
  color: #007bff;
  border: none;
  text-decoration: none !important;
}
#star {
  color: orange;
}

.footer-logo p {
  font-size: 1em;
  color: #fff;
  font-weight: 200;
  align-items: flex-start;

  transform: translateY(7px);


}

.mb-4{
  font-size: .8vw;
}

.top-button{
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}


@media only screen and (min-width:300px) and (max-width: 600px) {
  html,body {
   overflow-x: hidden !important;
  }
  .py-2 .row .col-sm-12{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  a{
    font-size: 14px;
  }
  p{
    font-size: 18px !important;
  }
  .mb-2 a{
    font-size: 12px !important;
  }
  input,textarea{
    padding: 10px;
  }

}

/* .content-container{ */
  /* min-height: 100vh; */
/*  min-height:50vh!important;
  height:50vh!important;
} */

.content-row{

  min-height: 45vh;
transform: translateY(-200px);
  background: #F7F9FC;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-title{
  display: flex;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column;
margin-top: 5vw;
}
.contact-title h2{
  text-align: center !important;
  font-size: 48px;
  font-weight: 700;
}

.contact-title p{
  line-height: 1em;
  font-weight: 400;
}

.address-column{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-top: 5vw;
 /* margin-left: 3vw; */
}

.address-txt{
  width: 450px;
}

.address-txt h2{
  font-size: 20px;
  color: #6C6C6C;
  font-weight: 700;
}

.address-txt a{
  font-size: 16px;
  font-weight: 500;
  color: #6C6C6C;
}

textarea{
  width: 100%;
}

.mt-0{
  /* transform: translateY(-30px); */
}
.button {
  position: relative;
  padding: 12px 52px;

  margin: 5px;
  border: 2px solid transparent;
  display: inline-block;
  font-size: 20px;
  border-radius: 10px;
  background: linear-gradient(to left, #fff 50%, #0085FF 25%, #18D0FA 25%) right;
  /* background: linear-gradient(132.14deg, #F8953A 0%, #EF3C69 88.51%); */
  background-size: 200%;
  transition: .5s ease-out;
  border: 0px;
  color: #000;
  font-weight: 500;
}

.button::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 10px;
  padding: 2px;
  /* control the border thickness */
  background: linear-gradient(132.14deg, #0085FF 0%, #18D0FA 88.51%);
  /* background: linear-gradient(132.14deg, #F8953A 0%, #EF3C69 88.51%); */
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.button:hover {
  text-decoration: none;
  background-position: left;
  color: #fff;
  border: none;
  text-decoration: none !important;
}


.map h2{
  text-align: center;
  min-height: 10vh;
  font-size: 38px;
  font-weight: 700;
  z-index: 1000;
}

input,textarea{
  border: none !important;
  background-color: #fff !important;
  color: #000 !important;
  box-shadow: 0px 0px 10px rgba(211, 211, 211, 0.33);
border-radius: 10px;
}

input::placeholder,textarea::placeholder{
  color: #d0d0d0 !important;
}
input:focus,textarea:focus{
  color: #000 !important;
}

label.error{
  color: red;
  font-size: 14px;
  font-weight: 300;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.navbar-toggler{
  border: none !important;
}
.nav-colored .navbar-toggler{
  border: none !important;
}
.navbar-toggler-icon{
  color:#000 !important;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}
.nav-colored .navbar-toggler-icon{
  color:#000 !important;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}

@media only screen and (min-width:300px) and (max-width:600px){
  html,body{
    overflow-x:hidden !important;
    font-size:100%;
  }

  .contact-title{
    min-height: 30vh !important;
    margin-top: 2em !important;
    margin-bottom: 3em !important;
  }

  .contact-title h2{
    font-size: 30px !important;
  }
  .contact-title  p{
    padding: 20px;
  }

  a{
    font-size:14px !important;
  }
  p{
    font: size 16px !important;
    text-align:center !important;
  }
  .address-column{
    margin-top: 4em;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .address-txt{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
  }
  .mb-2 a{
    font-size: 12px !important;
  }

  .company{
    font-size: 18px;
  }
  .py-5 .row .col-sm-12{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .py-2 .container-fluid .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .footer p{
    text-align: center;
  }
  .white p{
    font-size: 10px;
    text-align: center;
  }
  .white2 p{
    font-size: 10px !important;
    text-align: center;
  }

  .list-unstyled{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .list-unstyled li a{
    text-align: center;
  }
  .gen-img {
    display: none !important;
  }
.gen-img .image-wrapper{
  display: none;
}
  
.py-2 .row .col-sm-12 p{
  font-size: 10px;
  text-align: center;
  color: #fff !important;
}
.responsive-img{
  display: block;
  width: 100%;
  max-width: 400px;
  height: 25vh;
}
.form-group{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.form-control{
  width: 350px !important;
  padding: 20px !important;
}
}