@font-face {
  font-family: Euclid-Circular;
  src: url(./fonts/Euclid-Circular.ttf);
}
* {
  box-sizing: border-box;
  margin: 0px;
  padding: 0px;
  font-family: Euclid-Circular;
}
#top-bar {
  padding: 0.8vw;
  background-color: #ffa300;
  text-align: right;
  color: white;
}
header {
  background-image: url(./images/header-back.jpg);
  background-size: cover;
  height: 600px;
}
#logo {
  width: 140px;
  height: fit-content;
  margin: 2vw 0px 0px 12vw;
}
#navbarNavDropdown{
  margin: 0px 0px 0px 15vw;
}
#nav-bar-toggler{
  border: none;
}
.menu-elements-anch {
  margin: 0px 10px;
  padding: 15px;
  border-radius: 5vw;
  color: #6e18d1;
  font-size: 14px;
}
.menu-elements-anch:hover{
  background-color: #6e18d1;
  color: white;
}
#free-menu {
  background-color: #ffa300;
  border-radius: 50px;
  color: #fff;
}
#free-menu:hover {
  background-color: #6e18d1;
  box-shadow: 0vw 0vw 1vw #6e18d1;
  color: white;
  transition: all 3s;
}
#blank {
  height: 10vw;
}
#content {
  margin-left: 4vw;
}
#header-h1 {
  color: #6e18d1;
  font-size: 42px;
  margin: 0px;
  padding: 0px;
  font-weight: bold;
}
#header-h2 {
  color: #6e18d1;
  font-size: 62px;
  margin: 0px;
  padding: 0px;
  font-weight: bold;
}
#header-p {
  color: #6e18d1;
  font-size: 23px;
}
#header-form {
  border: 1px solid #6e18d1;
  border-radius: 5px;
  width: 600px;
  display: flex;
  justify-content: space-between;
  padding: 3px;
}
#header-email {
  border: 0px;
  font-size: 16px;
  padding: 10px 20px;
}
#header-email:focus {
  outline: none;
}
#header-submit {
  background-color: #6e18d1;
  color: white;
  padding: 18px 35px;
  border-radius: 5px;
  font-size: 18px;
  border: none;
}
#header-submit:hover {
  background-color: black;
  transition: background-color 2s;
  cursor: pointer;
}
.companies-logo{
  width: 200px;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-right: .5vw;
  margin-left: .5vw;

}
#our-services-heading{
  font-weight: bolder;
  font-size: 40px;
  color: #7317CF;
}
.our-services-sub-headings{
  font-size: 18px;
  font-weight: bolder;
  color: #7317CF;
}
.our-services-text{
  line-height: 20px;
  color: #7317CF;
}
.card-top{
  max-width: 350px;
  min-height: 350px;
  box-shadow: 0px 0px 20px #bc8bed;
}
.card-img-top{
  width: auto;
  height: 110px;
  margin-top: 20px;
  padding: 15px;
}
.card-img-top:hover{
  cursor: pointer;
  transform: scale(1.2);
  transition: all 250ms linear;
}
.section{
  padding: 5vw 0px;
}
.sec-head{
  text-align: center;
  color: #6e18d1;
  font-weight: bold;
  font-size: 40px;
  margin: 0px 0px 50px 0px;
}
.sec-content{
  color: black;
  font-size: 18px;
}
.star,.check{
  font-size: 12px;
  color: white;
  background-color: #6e18d1;
  border-radius: 50%;
  padding: 4px;
}
.star:hover,.check:hover{
  background-color: white;
  color: #6e18d1;
}
.sec-list{
  margin: 10px;
}
.sec-img{
  max-width: 100%;
  height: auto;
}
.btn-qoute{
  background-color: #8919F9;
  color: white;
  font-size: 20px;
  padding: 15px 40px;
  border-radius: 50px;
  border: none;
  margin: 25px;
}

.sec-head-partner-in-growth{
margin-bottom: 10px !important;
}
.bg-colored-sec{
  background-color: #F7EEFF;
}
.card-bot-sec{
  box-shadow: 0px 10px 5px #EEE1FC;
  border-radius: 20px;
  padding: 10px;
  margin: 15px 10px;
  /* width: ; */
}
.bot-card-img{
  width: 100px;
  margin: 10px 30px;
}
.bot-card-text-box{
  max-width: 350px;
}
#accordionFlushExample{
  padding-top: 50px;
}
.accordion-item{
  margin: 15px;
  border-radius: 20px !important;
}
.accordion-button{
  border-radius: 20px !important;
  padding: 20px;
  font-size: 18px;
}
.accordion-button:focus{
  background-color: #7317CF;
  color: white;
  box-shadow: none;
}
.accordion-button::after {
  background-image: initial;
}
.accordion-button:not(.collapsed)::after {
  background-image: initial;
}
#footer{
  color: white;
  background-color: #1D003A;
  padding: 10vw;
}
#footer-logo{
  width: 200px;
  margin-left: 40px;
  margin-bottom: 50px;
}
.footer-form-links{
  list-style-type: none;
  line-height: 200%;
}
.footer-headings{
  font-size: 24px;
}
.footer-anchor{
  color: inherit;
  text-decoration: none;
  opacity: .7;
}
.circular-border{
  border: 2px solid white;
  border-radius: 50%;
  padding: 10px;
  margin: 5px;
}
#fb-icon-span{
  background-color: transparent;
  background-image: url(images/facebook.png);
  background-repeat: repeat-x;
  background-position: 0 -100%;
}
#ig-icon-span{
  background-color: transparent;
  background-image: url(images/instagram.jpeg);
  background-repeat: repeat-x;
  background-position: 0 -100%;
}
#tw-icon-span{
  background-color: transparent;
  background-image: url(images/twitter.png);
  background-repeat: repeat-x;
  background-position: 0 -100%;
}
#fb-icon-span:hover, #ig-icon-span:hover, #tw-icon-span:hover{
  background-position: center;
  transition: all 700ms linear;
}
#fb-icon, #ig-icon, #tw-icon{
  font-size: 18px;
  color: white !important;
}
#fb-icon:hover, #ig-icon:hover, #tw-icon:hover{
  transform: rotateY(360deg);
  transition: all 1s;
}
#footer-form{
  background-image: linear-gradient(to right, #6D19C2,#4C0594);
  box-shadow: 0px 0px 30px #6D19C2;
  border-radius: 30px;
  padding: 50px 0px;
}
.footer-form-elements{
  display:block;
  width: 90%;
  border: none;
  border-radius: 10px;
  margin: 20px;
  padding: 15px;
}
#footer-form-button{
  background-color: #8919F9;
  color: inherit;
  border-radius: 20px;
  font-weight: bold   ;
}
#footer-form-button:hover{
  background-color: black;
  transition: all 1s;
}
#footer-col-1, #footer-col-2, #footer-col-3{
  margin: 20px 0px ;
}
/* Button Animation */
/* .text-box {
  margin-left: 44vw;
 margin-top: 42vh;
}

.btn:link,
.btn:visited {
  text-transform: uppercase;
  text-decoration: none;
  padding: 15px 40px;
  display: inline-block;
  border-radius: 100px;
  transition: all .2s;
  position: absolute;
}

.btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px #6e18d1 !important;
}

.btn:active {
  transform: translateY(-1px);
  box-shadow: 0 5px 10px #6e18d1 !important;
}

.btn-white {
  background-color: #6e18d1 !important;
  color: #fff !important;
}

.btn::after {
  content: "";
  display: inline-block;
  height: 100%;
  width: 100%;
  border-radius: 100px;
  position: absolute;
  bottom  : 0;
  left: 0;
  z-index: -1;
  transition: all .4s;
}

.btn-white::after {
  background-color: #6e18d1;
}

.btn:hover::after {
  transform: scaleX(1.4) scaleY(1.6);
  opacity: 0;
}
.btn-white:hover:after {
  opacity: 0;
}

.btn-animated {
  animation: moveInBottom 5s ease-out;
  animation-fill-mode: backwards;
}

@keyframes moveInBottom {
  0% {
      opacity: 0;
      transform: translateY(30px);
  }

  100% {
      opacity: 1;
      transform: translateY(0px);
  }
} */

@media (max-width: 768px) {
  #top-bar {
    display: none;
  }
  header {
    background-image: none;
    background-color: #68349c;
    height: 100vw;
  }
  #header-h1,
  #header-h2 {
    color: white;
    font-size: 6vw;
  }
  #header-p {
    color: white;
    font-size: 3.2vw;
  }
  #header-form {
    display: flex;
    border: 1px white solid;
    width: 80vw;
    padding: 5px 5px;
    outline: white;
    border-radius: 5px;
  }
  #header-email {
    border: 0px;
    width: 70vw;
    font-size: 2.5vw;
    padding: 0px 0px 0px 15px;
    background-color: white;
  }
  #header-submit {
    padding: 3vw;
    font-size: 2vw;
    margin: 0px;
  }
  #footer-logo{
    width: 25vw;
  }
}
