@import url("reset.css");

.orange{
    color:#DEAE37;
}

.blue{
    background-color: #072638;
}

.light-yellow{
    color: #e1d1b8;
}

.light-grey{
    color: #999999;
}

.text-color{
    color: #363636;
}

.head-color-yellow{
    color: #947349;
}

.navbar-expand-lg .navbar-collapse{
    justify-content : flex-end
}

#home a:hover{
    color:white
}

#navbarNavAltMarkup .navbar-nav .nav-item{
    letter-spacing:0.7px ;
    font-family: 'Montserrat-Medium';
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    position: relative;
    padding-right:0px;
    padding-left: 0px;
}

.navbar-brand{
    font-family: 'GlobalEnxa';
    font-size: 37px;
    text-wrap: wrap;
    line-height: normal;
    margin-left: 41px;
}

.nav-link-ltr:hover::before {
    width: 100%;
}

.nav-link-ltr::before {
    width: 0%;
    bottom: -3px;
}

.nav-link:hover{
    opacity: 1;
}

.nav-link::before    {
    transition: 300ms;
    height: 4px;
    content: "";
    position: absolute;
    background-color: #DEAE37;
}

/* About */
.about{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top:60px;
    margin-bottom: 60px;
}

.welcome{
    font-size: 18px;
}

.about-desc{
    flex-basis: 50%;
    padding: 20px;
}

.about-desc p{
    font-family: 'Montserrat-Medium';
    text-align: justify;
}

.about-desc h1{
    text-align: center;
    font-family: 'Alegreya-Bold';
}

.about-img{
    flex-basis: 50%;
    text-align: right;
}

.about-img img{
    width: 100%;
}

/* Our offering */
.ourOfferings{
    background-image: url('../assets/world-map.png');
    background-size: cover;
    background-color: #072638;
    padding-bottom: 60px;
}

.ourOfferings-services-container{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.ourOfferings .head{
    text-align: center;
    font-size: 2rem;
    font-family: 'Alegreya-Bold';
    letter-spacing: 1px;
}

.ourOfferings .ourOfferings-cards .head{
    font-family: 'Montserrat-Bold';
    font-size: 16px;
    text-align: left;
    color: white;
    letter-spacing: 0px;

}

.ourOfferings .desc{
    color: white;
    font-family: 'Montserrat-Medium';
    line-height: 1.5;
    font-size: 15px;
    text-align: justify;
}

.ourOfferings-card-container{
    display: flex;
    flex-wrap: wrap;
    flex-basis: 50%;
    border-right: 2px solid #DEAE37;
}

.ourOfferings .card-img-top{
    height: 202px;
}

.ourOfferings-cards{
    padding: 10px;
}

.ourOfferings-cards img{
    width: 43px;
    height: 41px;
    border-radius: 20px;
    margin-right: 15px;
    vertical-align: middle;
}

/* What we do */
.whatWeDo{
    padding-bottom: 60px;
    background: radial-gradient(circle, rgba(214,163,76,1) 38%, rgba(219,186,53,1) 58%, rgba(227,214,32,1) 95%);
}

.whatWeDo .head{
    text-align: center;
    font-size: 2rem;
    font-family: 'Bold';
    color: #072638 ;
}

.whatWeDo-accordion{
    flex-basis: 50%;
    padding-left: 48px;
}

.whatWeDo-accordion .card{
    background-color: transparent;
    border: none;
    width: 100%;
}

.whatWeDo-accordion .card .card-body{
    padding-left: 0px;
    line-height: normal;
    color: white;
    font-family:'Montserrat-Medium';
    line-height: 1.5;
    font-size: 15px;
    text-align: justify;
}

.whatWeDo-accordion .card-header{
    background-color: transparent;
    border-bottom:1px solid white ;
    padding-left: 0px;

}

.whatWeDo-accordion .card-header h2{
    margin-top: 0px;
}

.whatWeDo-accordion .card-header button{
    font-family: 'Montserrat-Bold';
    padding-left: 0px;
    color: white;
}

.whatWeDo-accordion .card-header img{
    vertical-align: middle;
    float: right;
}

.whatWeDo-accordion .card-header .btn:focus{
    box-shadow: none;
}

/* Products */
.products{
    padding-bottom: 60px;
}
.products .head{
    text-align: center;
    font-size: 2rem;
    font-family: 'Alegreya-Bold';
}
.products-cards img{
    aspect-ratio: 16 / 9;
}

.products-cards .carousel-head{
    text-align: center;
    font-family: 'Alegreya-Bold';
}

.products-cards .carousel-desc{
    font-family: 'Alegreya-Regular';
}



/* Why choose us */

.whyChooseUs{
    background-color: #072638;
    padding-bottom: 60px;
    background-image: url(../assets/world-map.png);
}

.whyChooseUs .head{
    text-align: center;
    font-size: 2rem;
    font-family: 'Alegreya-Bold';
    color: #DEAE37;
}

.whyChooseUs .card-title{
    text-align: center;
    font-family: 'Montserrat-Bold';
    font-size: 15px;
}

.whyChooseUs .card-text{
    font-family: 'Montserrat-Regular';
    font-size: 13px;
    line-height: 1.5;
}

.whyChooseUs .card-img-top{
    height: 200px;
}

.whyChooseUs .card-img-top.first-child{
    padding: 30px;
}

.whyChooseUs-cards-container .card {
    flex-basis: 18%;
    margin: 10px;
    border: none;
}

.whyChooseUs-cards-container .card .card-body{
    padding: 10px;
}

.whyChooseUs-cards-container{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

/*Contact Us */
.formbold-mb-3 {
  margin-bottom: 15px;
}
.formbold-relative {
  position: relative;
}
.formbold-opacity-0 {
  opacity: 0;
}
.formbold-stroke-current {
  stroke: currentColor;
}
#pinkLedCheckbox:checked ~ div span,#blackLedCheckbox:checked ~ div span, #riderBackpacks:checked ~ div span, #holographicAdvertiser:checked ~ div span  {
  opacity: 1;
}

.formbold-main-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px;
}

.formbold-form-wrapper {
  margin: 0 auto;
  max-width: 570px;
  width: 100%;
  background: white;
  padding: 40px;
}

.formbold-img {
  margin-bottom: 45px;
}

.formbold-form-title {
  margin-bottom: 30px;
}
.formbold-form-title h2 {
  font-weight: 600;
  font-size: 28px;
  line-height: 34px;
  color: #07074d;
  font-family: 'Alegreya-Bold' ;
}
.formbold-form-title p {
  font-size: 20px;
  line-height: 24px;
  color: #536387;
  margin-top: 12px;
  font-family: 'Alegreya-Regular' ;
}

.formbold-input-flex {
  display: flex;
  gap: 20px;
  margin-bottom: 15px;
}
.formbold-input-flex > div {
  width: 50%;
}
.formbold-form-input {
  width: 100%;
  padding: 13px 22px;
  border-radius: 5px;
  border: 1px solid #dde3ec;
  background: #ffffff;
  font-weight: 500;
  font-size: 16px;
  color: #536387;
  outline: none;
  resize: none;
}
.formbold-form-input:focus {
  border-color: #072638;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);
}
.formbold-form-label {
  color: #536387;
  font-size: 14px;
  line-height: 24px;
  display: block;
  margin-bottom: 10px;
}

.formbold-checkbox-label {
  display: flex;
  cursor: pointer;
  user-select: none;
  font-size: 16px;
  line-height: 24px;
  color: #536387;
}
.formbold-checkbox-label a {
  margin-left: 5px;
  color: #072638;
}
.formbold-input-checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.formbold-checkbox-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-right: 16px;
  margin-top: 2px;
  border: 0.7px solid #dde3ec;
  border-radius: 3px;
}

.formbold-btn {
  font-size: 16px;
  border-radius: 5px;
  padding: 14px 25px;
  border: none;
  font-weight: 500;
  background-color: #072638;
  color: #DEAE37;
  cursor: pointer;
  margin-top: 25px;
  font-weight: bold;
}
.formbold-btn:hover {
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);
}


/* Footer */

.footer-head{
    font-family: 'Montserrat-Bold';
}

footer .nav-link{
    font-family: 'Montserrat-Regular';
    line-height: 1.8;
    color: white;
}

.footer-company:hover{
    color:white
}

.nav-item a:hover{
    color: white;
}

.carousel-item {
    height: 680px;
}
    
.carousel-item img {
    position: absolute;
    top: 0;
    left: 0;
    max-height: 100%;
    height: 680px;
    object-fit: cover;
}

  .carousel-item img.logo-video-gif{
    background-color: black;
    object-fit: contain;
}


/* Mobile CSS */
@media only screen and (max-width: 600px) {
    .about-desc {
      flex-basis: unset;
    }
    .about-img {
        flex-basis: unset;
      }
      .whatWeExport-cards-container .card{
        flex-basis: unset;
      }
      .products-cards img{
        height: 100%;
        width: 100%;
    }
}

/*Ipad CSS */
@media all and (min-width: 768px) and (max-height: 1024px) and (orientation:portrait) {
    .products-cards img{
        height: 100%;
        width: 100%;
    }
  }
  @media all and (min-width: 1024px) and (max-height: 768px) and (orientation:landscape) {
     /* your css rules for ipad landscape */
     .products-cards img{
        height: 100%;
        width: 100%;
    }
  }