* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

#progress {
  position: fixed;
  bottom: 20px;
  right: 10px;
  height: 70px;
  width: 70px;
  display: none;
  place-items: center;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  z-index: 101;
}
#progress-value {
  display: block;
  height: calc(100% - 15px);
  width: calc(100% - 15px);
  background-color: #ffffff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 35px;
  color: #001a2e;
}


/* Remove the navbar's default margin-bottom and rounded borders */
.navbar {
  margin-bottom: 0;
  border-radius: 0;
  background-color: #1c4d3b;
  color: white;
  /* align-items: ; */
  font-family: "Tajawal", sans-serif;
}

.nav {
  margin-bottom: 0px;
}
.nav > li > a {
  color: #d09b68;
}

.navbar-toggle .icon-bar {
  background-color: white;
}
.navbar-brand>img{
  width: 213px;
  height: 80px;
  margin-top: -15px;
}


@media (min-width: 768px) .navbar {
}
.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 0px;
  border: 1px solid transparent;
  border-radius: 0px;
}


.navbar-collapse{
  background-color: #1c4d3b;
}

.navbar-nav {
  margin: 0px 0px;
}


.carousel-caption {
  position: absolute;
  top: 30%;
}

.carousel-caption > h2 {
  font-family: "Tajawal", sans-serif;
  font-weight: 900;
  font-size: xxx-large;
}

.carousel-caption > p {
  font-family: "Tajawal", sans-serif;
  font-weight: 900;
  font-size: medium;
}

/* boutton */
/* CSS */
.button-48 {
  appearance: none;
  background-color: #ffffff00;
  border-width: 0;
  box-sizing: border-box;
  color: #000000;
  cursor: pointer;
  display: inline-block;
  font-family: "Tajawal", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1em;
  margin: 0;
  opacity: 1;
  outline: 0;
  padding: 1.5em 2.2em;
  position: relative;
  text-align: center;
  text-decoration: none;
  text-rendering: geometricprecision;
  text-transform: uppercase;
  transition: opacity 300ms cubic-bezier(0.694, 0, 0.335, 1),
    background-color 100ms cubic-bezier(0.694, 0, 0.335, 1),
    color 100ms cubic-bezier(0.694, 0, 0.335, 1);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: baseline;
  white-space: nowrap;
}

.button-48:before {
  animation: opacityFallbackOut 0.5s step-end forwards;
  backface-visibility: hidden;
  background-color: #ffffff;
  clip-path: polygon(-1% 0, 0 0, -25% 100%, -1% 100%);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: translateZ(0);
  transition: clip-path 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
    -webkit-clip-path 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  width: 100%;
  border-radius: 12px;
}

.button-48:hover:before {
  animation: opacityFallbackIn 0s step-start forwards;
  clip-path: polygon(0 0, 101% 0, 101% 101%, 0 101%);
}

.button-48:after {
  background-color: #ffffff04;
  color: #000000;
}

.button-48 span {
  z-index: 1;
  color: #000000;
  position: relative;
}
.button-48:hover span {
  z-index: 1;
  color: #1c4d3b;
  position: relative;
}
/* bottun */

/* CSS */
.ser_btn {
  text-align: center;
}
.button-81 {
  text-align: center;
  width: fit-content;
  height: 50px;
  border-radius: 20px;
  border: 1px solid #579675;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -20px;
  font-family: "Tajawal";
  font-weight: 900;
  font-size: 1.9rem;
  background-color: #579675;
  color: #fff;
}

.button-81:hover {
  background-color: #fff;
  color: #579675;
}

@media (min-width: 768px) {
  .button-81 {
    font-size: 1.125rem;
    padding: 1rem 2rem;
    margin-top: -5px;
  }
}

a {
  color: #ff0000;
  text-decoration: none;
}

.carousel-inner::after {
  content: "";
  background: url(/images/wave.svg) center no-repeat;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 65px;
  width: 100%;
  background-size: cover;
  z-index: 100;
}

.item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.filter-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(
    28 77 59 / 47%
  ); /* Change the color and opacity as desired */
}

.wrapper {
  font-family: "raleway";
  display: absolute;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  /* background: #fafafa; */
}
.container-warp {
  position: relative;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  top: 85%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: -webkit-center;
  z-index: 100;
}

.wrapper h1 {
  font-size: 3em;
  margin: 25px 0;
  text-align: center;
  font-weight: 500;
  color: rgb(255, 0, 82);
}

.content-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 1000px;
  margin-top: 30px;
}

.card {
  min-height: 220px;
  width: 320px;
  padding: 30px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: #fff;
  /* background: linear-gradient(
      45deg,
      rgba(28, 77, 59, 0.8) 8%,
      rgba(208, 155, 104, 0.8) 100%
    ),
    url("/images/map-saudi-arabia.jpg"); */
  background-size: cover;
  margin: 10px 4px;
  box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
  z-index: 99;
}

.card:hover {
  animation: card 1s linear 0s 1 normal none;
}

@keyframes card {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-17px);
  }
}

.card i {
  margin: 20px;
  color: #fff;
}

.card h2 {
  margin-bottom: 12px;
  font-size: 4rem;
  text-align: center;
  /* color: #0505051f; */
  color: #fff;
  font-family: "Tajawal", sans-serif;
}

.card p {
  color: #6c757d;
  text-align: center;
}

.card h2:hover {
}

/* .card i:hover,
.card:hover p { */
/* color: #05050588; */
/* color: #fff;
  font-size: 2.5em;
  text-align: center;
} */

/* .card:hover h2 {
  margin-bottom: 12px;
  font-size: 4.5rem;
  text-align: center;
  color: #fff;
} */

span.num {
  /* color: #ffffff; */
  display: grid;
  place-items: center;
  font-weight: 600;
  font-size: 2.5em;
  font-family: "Tajawal", sans-serif;
}
span.text {
  color: #e0e0e0;
  font-size: 1em;
  text-align: center;
  pad: 0.7em 0;
  font-weight: 400;
  line-height: 0;
}

.card {
  font-weight: 600;
  color: #f2f2f2;
}

.card:nth-child(1) {
  background: linear-gradient(
      45deg,
      rgba(28, 77, 59, 0.8) 8%,
      rgba(208, 155, 104, 0.8) 100%
    ),
    url("/images/clints-comp.jpg");
  background-size: cover;
}
/* 208, 155, 104 */
.card:nth-child(2) {
  background: linear-gradient(
      45deg,
      rgba(28, 77, 59, 0.8) 8%,
      rgba(208, 155, 104, 0.8) 100%
    ),
    url("/images/location-background-comp.jpg");
  background-size: cover;
}

.card:nth-child(3) {
  background: linear-gradient(
      45deg,
      rgba(28, 77, 59, 0.8) 8%,
      rgba(208, 155, 104, 0.8) 100%
    ),
    url("/images/network-comp.jpg");
  background-size: cover;
}

/* about us */
.content {
  text-align: right;
  padding: 50px;
}

.content h1 {
  font-family: "Tajawal";
  font-weight: 800;
  font-size: 4.3rem;
  color: #564d4d;
  position: relative;
  top: 30px;
}
.content h1 span {
  display: block;
  margin-bottom: 50px;
  color: #564d4d;
}

.content span {
  font-weight: 900;
  position: relative;
  top: 25px;
  font-size: 14px;
  white-space: pre-line;
  font-family: "Tajawal", sans-serif;
  color: #564d4d;
}

.btn-cont {
  background-color: white;
  border: none;
  font-family: "Tajawal", sans-serif;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  position: relative;
  top: 4.5em;
  color: #564d4d;
  font-weight: 500;
  border-radius: 20px;
}

.btn-cont:hover {
  animation: btn-cont 1s linear 0s 1 normal none;
}

@keyframes btn-cont {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-8px);
  }
}

.content-img {
  text-align: center;
  padding: 20px;
}

.content-img h1 {
  color: #e3eae8;
  font-family: "Tajawal", sans-serif;
  position: relative;
  top: 59px;
  font-size: 4rem;
}

.content-img img {
  display: block;
  margin: 0 auto;
}

.col-sm-4 {
  background-image: url(/images/13031912_1606.m00.i125.n007.S.c12.150566579\ Earth\ globe\ world\ map\ of\ dots\ vector\ illustration.png);
  background-size: 94%;
  background-repeat: no-repeat;
  background-attachment: unset;
  background-repeat-y: no-repeat;
  background-position: center;
}

.col-sm-2 .about-logo {
  height: 150px;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: relative;
  /* animation: about-logo 1s linear 0s 1 normal none; */
}

/* @keyframes about-logo {
	0% {
		opacity: 0;
		transform: translateY(250px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
} */
/* about us */

/* <!-- About Section Start --> */
@media only screen and (min-width: 992px) and (max-width: 1199px) .section-padding {
  padding-top: 100px;
  padding-bottom: 100px;
}
.section-padding {
  padding-top: 100px;
  padding-bottom: 100px;
}
/* .section,
.main-wrapper {
  float: left;
  width: 100%;
} */
.learts-mb-n30 {
  margin-bottom: -30px;
}
.learts-mb-30 {
  margin-bottom: 30px;
}
.about-us3 .sub-title {
  font-size: 18px;
  font-weight: 500;
  display: block;
  margin-bottom: 20px;
  color: #333;
  font-family: "Futura", Arial, Helvetica, sans-serif;
}
.about-us3 .title {
  font-size: 40px;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 20px;
  font-family: "Tajawal", sans-serif;
}
/* h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Marcellus", Arial, Helvetica, sans-serif;
  font-weight: 600;
  line-height: 1.2;
  margin-top: 0;
  color: #333;
} */
.about-us3 .desc {
  margin-bottom: 35px;
  font-family: "Futura", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: 300;
  font-style: normal;
  line-height: 1.75;
  position: relative;
  visibility: visible;
  overflow-x: hidden;
  color: #696969;
}
.about-us3 .link {
  font-weight: 500;
  line-height: 1.25;
  position: relative;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  color: #333;
  font-size: 3.5rem;
  font-family: "Tajawal";
}
.about-us3 .link::before {
  width: 60px;
  height: 2px;
  margin-right: 10px;
  content: "";
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  background-color: #333;
}
.about-us3 .link:hover {
  color: #f8796c;
  text-decoration: none;
}
.about-us3 .link:hover::before {
  width: 70px;
}

.img-fluid {
  height: 620px;
  position: relative;
  bottom: 162px;
}

/* ekvivalent je bootstrap klasa img-fluid! */
/* .responsive-img {
max-width: 100%;
    height: auto;
} */

/* Responsive */
@media (max-width: 991px) {
  .wrapper {
    padding: 25px;
  }
  .wrapper h1 {
    font-size: 2.5em;
    font-weight: 600;
  }
  .content-box {
    flex-direction: column;
    width: 100%;
    margin-top: 500px;
    margin-bottom: -400px;
  }
  .card {
    min-height: 300px;
    margin: 10px auto;
  }

  .img-fluid {
    height: 410px;
    position: relative;
    bottom: 70px;
    left: 15px;
  }

  .content-img h1 {
    top: 0px;
  }

  .about-us .col-sm-2 {
    display: none;
  }

  .navbar-brand>img{
    width: 200px;
    height: 66px;
    margin-top: -10px;
  }
  .carousel {
    position: relative;
    z-index: -1;}

    .transfer-sec .image-block img {
      max-width: 350px;
  }

  .carousel-caption > p {
    font-family: "Tajawal", sans-serif;
    font-weight: 900;
    font-size: 1rem;
}


.carousel-caption > h2 {
    font-family: "Tajawal", sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
}

.carousel-caption {
    position: absolute;
    right: 15%;
    top: 0px;
    left: 15%;
    z-index: 10;
    padding-top: 0px;
    padding-bottom: -7px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
}

.carousel-caption button{
  display: none;
  }

  .carousel .left {
    display: none;
    }

    .carousel .right {
      display: none;
      }

.button-48{
  padding: 0.2em 2.2em;
  font-size: 10px;
  }

  .carousel-caption > h2 {
    margin-bottom: -4px;
    }

    .button-81 {
      font-size: 1.125rem;
      padding: 1rem 2rem;
      margin-top: -5px;
    }
}

/* Add a gray background color and some padding to the footer */
footer {
  background-color: #f2f2f2;
  padding: 25px;
}

.carousel-inner img {
  width: 100%; /* Set width to 100% */
  margin: auto;
  min-height: 200px;
}
a {
  color: #d09b68;
  text-decoration: none;
}

/* Hide the carousel text when the screen is less than 600 pixels wide */
@media (max-width: 600px) {
  .carousel-caption {
    /* display: none; */
  }
}

/* services section */
.services {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-direction: column;
  background-image: url(<svgheight="64px"width="64px"version="1.1"id="Capa_1"xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink"viewBox="0 0 235.517 235.517"xml:space="preserve"fill="#08781e"stroke="#08781e"><gid="SVGRepo_bgCarrier"stroke-width="0"></gid=><gid="SVGRepo_tracerCarrier"stroke-linecap="round"stroke-linejoin="round"stroke="#CCCCCC"stroke-width="2.8262039999999997"></gid=><gid="SVGRepo_iconCarrier"><g><pathstyle="fill:#010002;"d="M118.1,235.517c7.898,0,14.31-6.032,14.31-13.483c0-7.441,0-13.473,0-13.473 c39.069-3.579,64.932-24.215,64.932-57.785v-0.549c0-34.119-22.012-49.8-65.758-59.977V58.334c6.298,1.539,12.82,3.72,19.194,6.549 c10.258,4.547,22.724,1.697,28.952-8.485c6.233-10.176,2.866-24.47-8.681-29.654c-11.498-5.156-24.117-8.708-38.095-10.236V8.251 c0-4.552-6.402-8.251-14.305-8.251c-7.903,0-14.31,3.514-14.31,7.832c0,4.335,0,7.843,0,7.843 c-42.104,3.03-65.764,25.591-65.764,58.057v0.555c0,34.114,22.561,49.256,66.862,59.427v33.021 c-10.628-1.713-21.033-5.243-31.623-10.65c-11.281-5.755-25.101-3.72-31.938,6.385c-6.842,10.1-4.079,24.449,7.294,30.029 c16.709,8.208,35.593,13.57,54.614,15.518v13.755C103.79,229.36,110.197,235.517,118.1,235.517z M131.301,138.12 c14.316,4.123,18.438,8.257,18.438,15.681v0.555c0,7.979-5.776,12.651-18.438,14.033V138.12z M86.999,70.153v-0.549 c0-7.152,5.232-12.657,18.71-13.755v29.719C90.856,81.439,86.999,77.305,86.999,70.153z"></pathstyle=></g></g></svg>);
}

.s-heading {
  text-align: center;
  padding: 160px 0px 0px 0px;
}

.s-heading h1 {
  font-family: "Tajawal", sans-serif;
  color: #579675;
  font-size: 5rem;
  font-weight: 700;
  letter-spacing: 1px;
  margin: 8px;
}

.s-heading p {
  color: rgba(87, 105, 117, 0.6);
  font-size: 1rem;
  margin: 5px;
  text-align: center;
}

.s-box-container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.s-box .bar-img {
  height: 75px;
}
.s-box .bar-img:hover {
  animation: bar-img 2s ease 0s 1 normal forwards;
}

@keyframes bar-img {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}
.s-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  width: 300px;
  height: 400px;
  padding: 20px 25px;
  box-sizing: border-box;
  margin: 30px;
  position: relative;
}
.s-box h1 {
  font-size: 2rem;
  margin-bottom: 8px;
  font-weight: 600;
}

.s-box p {
  color: rgba(87, 105, 117, 0.9);
  text-align: center;
  font-size: 1.5rem;
  font-weight: 700;
}

.s-btn {
  width: 140px;
  height: 40px;
  border-radius: 20px;
  border: 1px solid #579675;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #576975;
  margin-top: 10px;
}
.s-box:hover {
  box-shadow: 2px 2px 30px rgba(0, 0, 0, 0.08);
  transition: all ease 0.3s;
  animation: bar-img 2s ease 0s 1 normal forwards;
}

.s-btn:hover {
  background-color: #d09b68;
  border: 1px solid #d09b68;
  color: #ffffff;
  transition: all ease 0.3s;
}

.bar {
  width: 100px;
  height: 6px;
  position: absolute;
  left: 50%;
  top: 0px;
  transform: translateX(-50%);
  background-color: #d09b68;
  border-radius: 0px 0px 10px 10px;
  display: none;
  animation: bar 0.5s;
}

.s-box:hover .bar {
  display: block;
}

@keyframes bar {
  0% {
    width: 0px;
  }
  100% {
    width: 100px;
  }
}

@media (max-width: 1050px) {
  .s-box-container {
    flex-wrap: wrap;
  }

  .services {
    height: auto;
  }

  .s-heading {
    margin: 15px;
  }

  .s-box {
    flex-grow: 1;
  }
}

/* services section */

/* .our-skills {
  background: linear-gradient(#131313e1, #181818e1),
    url(/images/person-paying-using-nfc-technology.jpg) center bottom no-repeat;
 background-attachment: fixed;
 background-size: cover;
 position: relative;
 text-align: center;
 min-height: 300px;
 padding: 30px 0;


}

.our-skills .our-skills-text h4 {
  font-weight: bold;
  font-style: italic;
  color: var(--danger);
  align-content: center;
  font-size: xx-large;
  
}

.our-skills .our-skills-text p {
  color: #dbdbdb;
  letter-spacing: 1px;
  line-height: 1.5;
  direction: rtl;
  font-family: "Cairo", sans-serif;
}

.our-skills .skills-prog {
  height: 400px;
  width: 400px;
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
}

.our-skills .counter-item-outer {
  flex-basis: 50%;
}

.our-skills .counter-item {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.our-skills h6 {
  color: #dbdbdb;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.our-skills h2 {
  height: 100px;
  width: 100px;
  border: 1px solid #fff;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  border-radius: 50%;
  color: var(--danger);
}

.our-skills .thumbnail {
  width: 200px;
} */

/* services section */

.transfer-sec {
  background: url(https://h8m3i2c6.stackpathcdn.com/wp-content/themes/alansari/assets/images/img-02.jpg?v=2.0)
    center bottom no-repeat;
  background-attachment: fixed;
  background-size: cover;
  position: relative;
  text-align: center;
  min-height: 300px;
  padding: 30px 0;
}
.transfer-sec:after {
  content: "";
  background: #022518;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  z-index: 5;
}
.transfer-sec .container {
  position: relative;
  z-index: 10;
}
.transfer-sec .content-block {
  display: table-cell;
  vertical-align: middle;
}
.transfer-sec .image-block {
  text-align: right;
}
.transfer-sec .image-block img {
  max-width: 350px;
}
.transfer-sec .block-wrap {
  width: 100%;
}
.transfer-sec .block-wrap .video-thumb {
  margin: 20px auto 0;
  max-width: max-content;
  border: 2px solid #7b7b7b;
  position: relative;
}
.transfer-sec .block-wrap .video-thumb img {
  height: 100%;
  width: 100%;
}
.transfer-sec .title-block {
  margin: 0 0 30px;
}
.transfer-sec .title-block h2 {
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  font-family: "Tajawal", sans-serif;
}
.transfer-sec .title-block h2 span {
  font-weight: 600;
  font-size: 16px;
}
.transfer-sec p {
  font-size: 16px;
  color: #fff;
}
.transfer-sec .video-intro {
  display: inline-block;
  width: 100%;
  font-size: 16px;
  color: #fff;
  font-weight: 400;
  line-height: 52px;
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
}
.transfer-sec .video-intro:focus,
.transfer-sec .video-intro:hover {
  color: #1c4d3b;
}
.transfer-sec .video-intro .icon {
  /* float: left;
  background: url("/images/play_button2.png");
  /* background-size: 314px auto; 
  width: 82px;
  height: 82px; */
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

/* .ripples:after {
  opacity: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: "";
  height: 100%;
  width: 100%;
  border: 1px solid #1c4d3b;
  border-radius: 100%;
  animation-name: ripple;
  animation-duration: 3s;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  z-index: -1;
}
.ripples:before {
  opacity: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: "";
  height: 100%;
  width: 100%;
  border: 1px solid #1c4d3b;
  border-radius: 100%;
  animation-name: ripple;
  animation-duration: 3s;
  animation-delay: 0.5s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  z-index: -1;
}
body {
  background: #444;
} */

.ripples {
  width: 100px;
  height: 100px;
  background: radial-gradient(
    rgba(28, 77, 59, 0.8) 60%,
    rgba(255, 255, 255, 1) 62%
  );
  border-radius: 50%;
  position: relative;
  display: block;
  margin: 100px auto;
  box-shadow: 0px 0px 25px 3px rgba(28, 77, 59, 0.8);
}

/* triangle */
.ripples::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-40%) translateY(-50%);
  transform: translateX(-40%) translateY(-50%);
  transform-origin: center center;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 25px solid #fff;
  z-index: 100;
  -webkit-transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
  transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

/* pulse wave */
.ripples:before {
  content: "";
  position: absolute;
  width: 150%;
  height: 150%;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation: pulsate1 2s;
  animation: pulsate1 2s;
  -webkit-animation-direction: forwards;
  animation-direction: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: steps;
  animation-timing-function: steps;
  opacity: 1;
  border-radius: 50%;
  border: 5px solid rgba(255, 255, 255, 0.75);
  top: -25%;
  left: -25%;
  background: rgba(198, 16, 0, 0);
}

@-webkit-keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75),
      0px 0px 25px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;
  }
}

@keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75),
      0px 0px 25px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;
  }
}

.transfer-sec .btn-wrap {
  margin-top: 0;
}
.transfer-sec .btn-wrap .btn {
  border: 0;
  box-shadow: none;
  max-width: 200px;
  width: 100%;
  height: 58px;
  font-weight: 600;
  font-size: 14px;
  background: #fff;
  color: #fff;
  padding: 5px 10px;
  line-height: 48px;
  text-align: center;
  font-style: normal;
  text-transform: uppercase;
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  display: inline-block;
  padding: 0 15px;
  margin: 0 10px;
}
.transfer-sec .btn-wrap .btn:active,
.transfer-sec .btn-wrap .btn:focus,
.transfer-sec .btn-wrap .btn:hover {
  box-shadow: none;
  border: 0;
  outline: 0 !important;
  background: #001f60;
  color: #fff;
}
.transfer-sec .btn-wrap .btn:focus,
.transfer-sec .btn-wrap .btn:hover {
  background: #1c4d3b;
}

.send-money-block {
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
}
.send-money-block.active {
  animation: 1.5s infinite heartbeat;
}
.transfer-btn {
  display: none;
}
.currency-convert {
  position: relative;
  width: auto;
  margin: 10px auto 0;
}
.currency-convert input::-webkit-input-placeholder,
.currency-convert textarea::-webkit-input-placeholder {
  color: #fff !important;
}
.currency-convert input:-moz-placeholder,
.currency-convert textarea:-moz-placeholder {
  color: #fff !important;
}
.currency-convert input::-moz-placeholder,
.currency-convert textarea::-moz-placeholder {
  color: #fff !important;
}
.currency-convert input:-ms-input-placeholder,
.currency-convert textarea:-ms-input-placeholder {
  color: #fff !important;
}
.currency-convert .btn-set {
  margin-top: 5px;
}
.currency-convert .btn-set .btn {
  border: 0;
  box-shadow: none;
  max-width: 240px;
  width: 100%;
  height: 48px;
  font-weight: 600;
  font-size: 18px;
  background: #fff;
  color: #082364;
  padding: 5px 10px;
  line-height: 38px;
  text-align: center;
  font-style: normal;
  text-transform: uppercase;
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  text-transform: none;
  height: 40px;
  line-height: 25px;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  max-width: 110px;
  padding: 5px;
  margin: 0 3px 5px;
}
.currency-convert .btn-set .btn:active,
.currency-convert .btn-set .btn:focus,
.currency-convert .btn-set .btn:hover {
  box-shadow: none;
  border: 0;
  outline: 0 !important;
  background: #001f60;
  color: #fff;
}
.currency-convert .btn-set .btn:focus,
.currency-convert .btn-set .btn:hover {
  background: #1c4d3b;
  color: #fff;
}
.currency-convert p {
  text-align: center;
  color: #fff;
  line-height: 16px;
  font-size: 16px;
}
.currency-convert p.msg-err {
  margin: 5px 0 -5px;
  font-size: 12px;
  color: #ffb81d;
  font-weight: 500;
}
.currency-convert .btn-wrap {
  padding: 0;
  text-align: center;
}
.currency-convert .btn-wrap .btn {
  border: 0;
  box-shadow: none;
  max-width: 125px;
  width: 100%;
  height: 38px;
  font-weight: 600;
  font-size: 14px;
  background: #fff;
  color: #001f60;
  padding: 5px 10px;
  line-height: 28px;
  text-align: center;
  font-style: normal;
  text-transform: uppercase;
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  background-color: transparent;
  display: inline-block;
  max-width: 80%;
  height: 45px;
  line-height: 32px;
  font-size: 18px;
  margin: 5px auto;
  color: #fff;
  border: 1px solid #fff;
  text-transform: none;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
}
.currency-convert .btn-wrap .btn:active,
.currency-convert .btn-wrap .btn:focus,
.currency-convert .btn-wrap .btn:hover {
  box-shadow: none;
  border: 0;
  outline: 0 !important;
  background: #001f60;
  color: #fff;
}
.currency-convert .btn-wrap .btn:focus,
.currency-convert .btn-wrap .btn:hover {
  border: 1px solid #ffb81d;
  background: #ffb81d;
}
.currency-convert .currency-country {
  display: block;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 22px;
  line-height: 1;
  margin-bottom: 10px;
  position: relative;
}
.currency-convert .currency-country:after {
  content: "";
  background: url("https://h8m3i2c6.stackpathcdn.com/wp-content/themes/alansari/assets/images/css_sprites_02.png") -254px -226px;
  background-size: 314px auto;
  width: 16px;
  height: 10px;
  position: absolute;
  top: 50%;
  right: 10px;
  -webkit-transform: translateY(-50%) rotate(0);
  -moz-transform: translateY(-50%) rotate(0);
  -ms-transform: translateY(-50%) rotate(0);
  -o-transform: translateY(-50%) rotate(0);
  transform: translateY(-50%) rotate(0);
  transition: 0.4s all ease;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
}
.currency-convert .currency-country.open:after {
  -webkit-transform: translateY(-50%) rotate(-180deg);
  -moz-transform: translateY(-50%) rotate(-180deg);
  -ms-transform: translateY(-50%) rotate(-180deg);
  -o-transform: translateY(-50%) rotate(-180deg);
  transform: translateY(-50%) rotate(-180deg);
}
.currency-convert .currency-country span {
  width: 25px;
  height: 25px;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  margin: 0 5px 0 0;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.currency-convert h3 {
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  margin: 0 0 10px;
  position: relative;
}

#news-slider {
  margin-top: 80px;
}
.post-slide {
  background: #fff;
  margin: 20px 15px 20px;
  border-radius: 15px;
  padding-top: 1px;
  box-shadow: 0px 14px 15px -9px #bbcbd8;
}
.post-slide .post-img {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  /* margin: -12px 15px 8px 15px;
  margin-left: -10px; */
}
.post-slide .post-img img {
  width: 100%;
  height: auto;
  transform: scale(1, 1);
  transition: transform 0.2s linear;
}
.post-slide:hover .post-img img {
  transform: scale(1.1, 1.1);
}
.post-slide .over-layer {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  background: linear-gradient(
    -45deg,
    rgba(28, 77, 59, 0.75) 0%,
    rgba(208, 155, 104, 0.6) 100%
  );
  transition: all 0.5s linear;
}
.post-slide:hover .over-layer {
  opacity: 1;
  text-decoration: none;
}
.post-slide .over-layer i {
  position: relative;
  top: 45%;
  text-align: center;
  display: block;
  color: #fff;
  font-size: 25px;
}
.post-slide .post-content {
  background: #fff;
  padding: 2px 20px 40px;
  border-radius: 15px;
  /* text-align: right; */
}
.post-slide .post-title a {
  font-size: 15px;
  font-weight: bold;
  color: #333;
  display: inline-block;
  text-transform: uppercase;
  transition: all 0.3s ease 0s;
  text-align: right;
}
.post-slide .post-title a:hover {
  text-decoration: none;
  color: #3498db;
}
.post-slide .post-description {
  line-height: 24px;
  color: #808080;
  margin-bottom: 25px;
  text-align: right;
}
.post-slide .post-date {
  color: #a9a9a9;
  font-size: 14px;
  text-align: left;
}
.post-slide .post-date i {
  font-size: 20px;
  margin-right: 8px;
  color: #cfdace;
}
.post-slide .read-more {
  padding: 7px 20px;
  float: right;
  font-size: 12px;
  background: #1c4d3b;
  color: #ffffff;
  box-shadow: 0px 10px 20px -10px #1c4d3b;
  border-radius: 25px;
  text-transform: uppercase;
}
.post-slide .read-more:hover {
  background: #d09b68;
  text-decoration: none;
  color: #fff;
}
.owl-controls .owl-buttons {
  text-align: center;
  margin-top: 20px;
}
.owl-controls .owl-buttons .owl-prev {
  background: #fff;
  position: absolute;
  top: -13%;
  left: 15px;
  padding: 0 18px 0 15px;
  border-radius: 50px;
  box-shadow: 3px 14px 25px -10px #92b4d0;
  transition: background 0.5s ease 0s;
}
.owl-controls .owl-buttons .owl-next {
  background: #fff;
  position: absolute;
  top: -13%;
  right: 15px;
  padding: 0 15px 0 18px;
  border-radius: 50px;
  box-shadow: -3px 14px 25px -10px #92b4d0;
  transition: background 0.5s ease 0s;
}
.owl-controls .owl-buttons .owl-prev:after,
.owl-controls .owl-buttons .owl-next:after {
  content: "\f104";
  font-family: FontAwesome;
  color: #333;
  font-size: 30px;
}
.owl-controls .owl-buttons .owl-next:after {
  content: "\f105";
}
@media only screen and (max-width: 1280px) {
  .post-slide .post-content {
    padding: 0px 15px 25px 15px;
  }
}

.slick-slide {
  margin: 0 20px;
}
.slick-slide img {
  width: 100%;
}
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
}
.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}
.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}
.slick-slide img {
  display: block;
}
.slick-initialized .slick-slide {
  display: block;
}
.copy {
  padding-top: 250px;
}

.site-footer {
  background-color: rgb(39, 43, 38);
  padding: 45px 0 20px;
  margin-top: 135px;
  font-size: 15px;
  line-height: 24px;
  color: #737373;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
}
.site-footer hr {
  border-top-color: #bbb;
  opacity: 0.5;
}
.site-footer hr.small {
  margin: 20px 0;
}
.site-footer h6 {
  color: #fff;
  font-size: 16px;
  text-transform: uppercase;
  margin-top: 5px;
  /* letter-spacing: 2px; */
}
.site-footer a {
  color: #737373;
}
.site-footer a:hover {
  color: #fff;
  text-decoration: none;
}
.footer-links {
  padding-left: 0;
  list-style: none;
}
.footer-links li {
  display: block;
}
.footer-links a {
  color: #737373;
}
.footer-links a:active,
.footer-links a:focus,
.footer-links a:hover {
  color: #fff;
  text-decoration: none;
}
.site-footer .social-icons {
  text-align: right;
}
.site-footer .social-icons a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin-left: 6px;
  margin-right: 0;
  border-radius: 100%;
  background-color: #33353d;
}
.copyright-text {
  margin: 0;
}
@media (max-width: 991px) {
  .site-footer [class^="col-"] {
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .site-footer {
    padding-bottom: 0;
  }
  .site-footer .copyright-text,
  .site-footer .social-icons {
    text-align: center;
  }
}
.social-icons {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.social-icons li {
  display: inline-block;
  margin-bottom: 4px;
}
.social-icons a {
  background-color: #eceeef;
  color: #818a91;
  font-size: 16px;
  display: inline-block;
  line-height: 44px;
  width: 44px;
  height: 44px;
  text-align: center;
  margin-right: 8px;
  border-radius: 100%;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
.logo {
  color: #d09b68;
}
.social-icons a:active,
.social-icons a:focus,
.social-icons a:hover {
  color: #fff;
  background-color: #29aafe;
}
.social-icons a.facebook:hover {
  background-color: #3b5998;
}
.social-icons a.twitter:hover {
  background-color: #00aced;
}
.social-icons a.linkedin:hover {
  background-color: #007bb6;
}
.social-icons a.instagram:hover {
  background: linear-gradient(
    45deg,
    #405de6,
    #5851db,
    #833ab4,
    #c13584,
    #e1306c,
    #fd1d1d
  );
}