/* ===========================================================================
   GENERAL & BASIC STYLES
  =========================================================================== */

* {
  /* font-family: 'Exo 2', sans-serif !important; */
  /* font-family: 'Oxygen', sans-serif !important; */
  /* font-family: 'Montserrat', sans-serif !important; */
  /* font-family: 'Raleway', sans-serif !important; */
  /* font-family: 'Julius Sans One', sans-serif; */
  /* font-family: 'Montserrat Alternates', sans-serif; */
  font-family: "Chakra Petch", sans-serif;
  font-weight: 200 !important;
}

html {
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
}

body {
  color: #333;
  font-weight: 300;
  margin: 0 !important;
  padding: 0 !important;
}

/*------------------------------------------------------------------*/
/*   IE10 in Windows 8 and Windows Phone 8 Bug fix
/*-----------------------------------------------------------------*/

@-webkit-viewport {
  width: device-width;
}
@-moz-viewport {
  width: device-width;
}
@-ms-viewport {
  width: device-width;
}
@-o-viewport {
  width: device-width;
}
@viewport {
  width: device-width;
}

/*------------------------------------------*/
/*  PAGE CONTENT
/*------------------------------------------*/

#page {
  overflow: hidden;
}

/*------------------------------------------*/
/*  SPACING & INDENTS
/*------------------------------------------*/

.wide-160 {
  padding-top: 160px;
  padding-bottom: 160px;
}
.wide-150 {
  padding-top: 150px;
  padding-bottom: 150px;
}
.wide-140 {
  padding-top: 140px;
  padding-bottom: 140px;
}
.wide-130 {
  padding-top: 130px;
  padding-bottom: 130px;
}
.wide-120 {
  padding-top: 120px;
  padding-bottom: 120px;
}
.wide-110 {
  padding-top: 110px;
  padding-bottom: 110px;
}
.wide-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}
.wide-90 {
  padding-top: 100px;
  padding-bottom: 90px;
}
.wide-80 {
  padding-top: 100px;
  padding-bottom: 80px;
}
.wide-70 {
  padding-top: 100px;
  padding-bottom: 70px;
}
.wide-60 {
  padding-top: 100px;
  padding-bottom: 60px;
}
.wide-50 {
  padding-top: 100px;
  padding-bottom: 50px;
}
.wide-40 {
  padding-top: 100px;
  padding-bottom: 40px;
}
.wide-30 {
  padding-top: 100px;
  padding-bottom: 30px;
}
.wide-20 {
  padding-top: 100px;
  padding-bottom: 20px;
}

.wide-10 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.wide-custom {
  padding-top: 100px;
  padding-bottom: 20px;
}

/*------------------------------------------*/
/*    Margin Top
/*------------------------------------------*/

.mt-100 {
  margin-top: 100px;
}
.mt-90 {
  margin-top: 90px;
}
.mt-80 {
  margin-top: 80px;
}
.mt-70 {
  margin-top: 70px;
}
.mt-60 {
  margin-top: 60px;
}
.mt-50 {
  margin-top: 50px;
}
.mt-45 {
  margin-top: 45px;
}
.mt-40 {
  margin-top: 40px;
}
.mt-35 {
  margin-top: 35px;
}
.mt-30 {
  margin-top: 30px;
}
.mt-25 {
  margin-top: 25px;
}
.mt-20 {
  margin-top: 20px;
}
.mt-15 {
  margin-top: 15px;
}
.mt-10 {
  margin-top: 10px;
}
.mt-5 {
  margin-top: 5px;
}

/*------------------------------------------*/
/*    Margin Bottom
/*------------------------------------------*/

.mb-100 {
  margin-bottom: 100px;
}
.mb-90 {
  margin-bottom: 90px;
}
.mb-80 {
  margin-bottom: 80px;
}
.mb-70 {
  margin-bottom: 70px;
}
.mb-60 {
  margin-bottom: 60px;
}
.mb-50 {
  margin-bottom: 50px;
}
.mb-45 {
  margin-bottom: 45px;
}
.mb-40 {
  margin-bottom: 40px;
}
.mb-35 {
  margin-bottom: 35px;
}
.mb-30 {
  margin-bottom: 30px;
}
.mb-25 {
  margin-bottom: 25px;
}
.mb-20 {
  margin-bottom: 20px;
}
.mb-15 {
  margin-bottom: 15px;
}
.mb-10 {
  margin-bottom: 10px;
}
.mb-5 {
  margin-bottom: 5px;
}
.mb-0 {
  margin-bottom: 0;
}

/*------------------------------------------*/
/*    Margin Left
/*------------------------------------------*/

.ml-70 {
  margin-left: 70px;
}
.ml-60 {
  margin-left: 60px;
}
.ml-50 {
  margin-left: 50px;
}
.ml-45 {
  margin-left: 45px;
}
.ml-40 {
  margin-left: 40px;
}
.ml-35 {
  margin-left: 35px;
}
.ml-30 {
  margin-left: 30px;
}
.ml-25 {
  margin-left: 25px;
}
.ml-20 {
  margin-left: 20px;
}
.ml-15 {
  margin-left: 15px;
}
.ml-10 {
  margin-left: 10px;
}
.ml-5 {
  margin-left: 5px;
}

/*------------------------------------------*/
/*    Margin Right
/*------------------------------------------*/

.mr-70 {
  margin-right: 70px;
}
.mr-60 {
  margin-right: 60px;
}
.mr-50 {
  margin-right: 50px;
}
.mr-45 {
  margin-right: 45px;
}
.mr-40 {
  margin-right: 40px;
}
.mr-35 {
  margin-right: 35px;
}
.mr-30 {
  margin-right: 30px;
}
.mr-25 {
  margin-right: 25px;
}
.mr-20 {
  margin-right: 20px;
}
.mr-15 {
  margin-right: 15px;
}
.mr-10 {
  margin-right: 10px;
}
.mr-5 {
  margin-right: 5px;
}

/*------------------------------------------*/
/*    Padding Top
/*------------------------------------------*/

.pt-100 {
  padding-top: 100px;
}
.pt-90 {
  padding-top: 90px;
}
.pt-80 {
  padding-top: 80px;
}
.pt-70 {
  padding-top: 70px;
}
.pt-60 {
  padding-top: 60px;
}
.pt-50 {
  padding-top: 50px;
}
.pt-45 {
  padding-top: 45px;
}
.pt-40 {
  padding-top: 40px;
}
.pt-35 {
  padding-top: 35px;
}
.pt-30 {
  padding-top: 30px;
}
.pt-25 {
  padding-top: 25px;
}
.pt-20 {
  padding-top: 20px;
}
.pt-15 {
  padding-top: 15px;
}
.pt-10 {
  padding-top: 10px;
}

/*------------------------------------------*/
/*    Padding Bottom
/*------------------------------------------*/

.pb-100 {
  padding-bottom: 100px;
}
.pb-90 {
  padding-bottom: 90px;
}
.pb-80 {
  padding-bottom: 80px;
}
.pb-70 {
  padding-bottom: 70px;
}
.pb-60 {
  padding-bottom: 60px;
}
.pb-50 {
  padding-bottom: 50px;
}
.pb-45 {
  padding-bottom: 45px;
}
.pb-40 {
  padding-bottom: 40px;
}
.pb-35 {
  padding-bottom: 35px;
}
.pb-30 {
  padding-bottom: 30px;
}
.pb-25 {
  padding-bottom: 25px;
}
.pb-20 {
  padding-bottom: 20px;
}
.pb-15 {
  padding-bottom: 15px;
}
.pb-10 {
  padding-bottom: 10px;
}
.pb-0 {
  padding-bottom: 0;
}

/*------------------------------------------*/
/*    Padding Left
/*------------------------------------------*/

.pl-100 {
  padding-left: 100px;
}
.pl-90 {
  padding-left: 90px;
}
.pl-80 {
  padding-left: 80px;
}
.pl-70 {
  padding-left: 70px;
}
.pl-60 {
  padding-left: 60px;
}
.pl-50 {
  padding-left: 50px;
}
.pl-45 {
  padding-left: 45px;
}
.pl-40 {
  padding-left: 40px;
}
.pl-35 {
  padding-left: 35px;
}
.pl-30 {
  padding-left: 30px;
}
.pl-25 {
  padding-left: 25px;
}
.pl-20 {
  padding-left: 20px;
}
.pl-15 {
  padding-left: 15px;
}
.pl-10 {
  padding-left: 10px;
}
.pl-5 {
  padding-left: 5px;
}
.pl-0 {
  padding-left: 0px;
}

/*------------------------------------------*/
/*    Padding Right
/*------------------------------------------*/

.pr-100 {
  padding-right: 100px;
}
.pr-90 {
  padding-right: 90px;
}
.pr-80 {
  padding-right: 80px;
}
.pr-70 {
  padding-right: 70px;
}
.pr-60 {
  padding-right: 60px;
}
.pr-50 {
  padding-right: 50px;
}
.pr-45 {
  padding-right: 45px;
}
.pr-40 {
  padding-right: 40px;
}
.pr-35 {
  padding-right: 35px;
}
.pr-30 {
  padding-right: 30px;
}
.pr-25 {
  padding-right: 25px;
}
.pr-20 {
  padding-right: 20px;
}
.pr-15 {
  padding-right: 15px;
}
.pr-10 {
  padding-right: 10px;
}
.pr-5 {
  padding-right: 5px;
}
.pr-0 {
  padding-right: 0px;
}

/*------------------------------------------*/
/*   BACKGROUND SETTINGS
/*------------------------------------------*/

.bg-scroll {
  width: 100%;
  background-attachment: fixed !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.bg-fixed {
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.bgcontact {
  background-color: #447f9b;
}

/*------------------------------------------*/
/*   Background Colors for Sections
/*------------------------------------------*/

.bg-theme {
  background-color: #389bf2;
}

.bg-white {
  background-color: #fff;
}
.bg-lightdark {
  background-color: #283034;
}
.bg-dark {
  background-color: #222 !important;
}
.bg-grey {
  background-color: #ede9e6;
}
.bg-lightgrey {
  background-color: #f5f5f5;
}

.bg-apricot {
  background-color: #feb75f;
}
.bg-blue {
  background-color: #389bf2;
}
.bg-bluestone {
  background-color: #517082;
}
.bg-coral {
  background-color: #fa5876;
}
.bg-curacao {
  background-color: #2abdc7;
}
.bg-green {
  background-color: #48af4b;
}
.bg-greenery {
  background-color: #80a63f;
}
.bg-magenta {
  background-color: #8e3178;
}
.bg-purple {
  background-color: #6b507d;
}
.bg-violet {
  background-color: #8a8cbd;
}

.blue-abstract {
  background-image: url(../images/blue-abstract.jpg);
  background-position: top center;
}

/*------------------------------------------*/
/*   BORDER SETTINGS FOR DEMOS
/*------------------------------------------*/

.b-top {
  border-top: 1px solid #ddd;
}
.b-bottom {
  border-bottom: 1px solid #ddd;
}
.b-left {
  border-left: 1px solid #ddd;
}
.b-right {
  border-right: 1px solid #ddd;
}

.grey-border .b-bottom {
  margin: 0 8%;
}

/* ==========================================================================
    TYPOGRAPHY
  =========================================================================== */

/*------------------------------------------*/
/*  HEADERS
/*------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #222;
  font-weight: 700;
  letter-spacing: 0;
}

/* Header H5 */
h5.h5-xs {
  font-size: 1.125rem;
} /* 18px */
h5.h5-sm {
  font-size: 1.1875rem;
} /* 19px */
h5.h5-md {
  font-size: 1.25rem;
} /* 20px */
h5.h5-lg {
  font-size: 1.375rem;
} /* 22px */
h5.h5-xl {
  font-size: 1.5rem;
} /* 24px */

/* Header H4 */
h4.h4-xs {
  font-size: 1.625rem;
} /* 26px */
h4.h4-sm {
  font-size: 1.75rem;
} /* 28px */
h4.h4-md {
  font-size: 1.875rem;
} /* 30px */
h4.h4-lg {
  font-size: 2rem;
} /* 32px */
h4.h4-xl {
  font-size: 2.125rem;
} /* 34px */

/* Header H3 */
h3.h3-xs {
  font-size: 2.375rem;
} /* 38px */
h3.h3-sm {
  font-size: 2.5rem;
} /* 40px */
h3.h3-md {
  font-size: 2.625rem;
} /* 42px */
h3.h3-lg {
  font-size: 2.75rem;
} /* 44px */
h3.h3-xl {
  font-size: 3rem;
} /* 48px */

/* Header H2 */
h2.h2-xs {
  font-size: 3.25rem;
} /* 52px */
h2.h2-sm {
  font-size: 3.375rem;
} /* 54px */
h2.h2-md {
  font-size: 3.5rem;
} /* 56px */
h2.h2-lg {
  font-size: 3.75rem;
} /* 60px */
h2.h2-xl {
  font-size: 4rem;
} /* 64px */
h2.h2-huge {
  font-size: 5rem;
} /* 80px */

/*------------------------------------------*/
/*   PARAGRAPHS
/*------------------------------------------*/

p.p-sm {
  font-size: 0.95rem;
} /* 15.2px */
p.p-md {
  font-size: 1.125rem;
} /* 18px */
p.p-lg {
  font-size: 1.25rem;
} /* 20px */
p.p-xl {
  font-size: 1.3175rem;
} /* 22px */

/*------------------------------------------*/
/*   LISTS
/*------------------------------------------*/

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

/*------------------------------------------*/
/*   LINK SETTINGS
/*------------------------------------------*/

a {
  color: #333;
  text-decoration: none;
  -webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  -ms-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
}

a:hover {
  color: #666;
  text-decoration: none;
}

a:focus {
  outline: none;
  text-decoration: none;
}

/*------------------------------------------*/
/*   BUTTON SETTINGS
/*------------------------------------------*/

.btn {
  background-color: transparent;
  color: #fff;
  font-size: 0.825rem;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.25px;
  text-transform: uppercase;
  padding: 1.05rem 1.65rem;
  border: 2px solid transparent;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: all 450ms ease-in-out;
  -moz-transition: all 450ms ease-in-out;
  -o-transition: all 450ms ease-in-out;
  -ms-transition: all 450ms ease-in-out;
  transition: all 450ms ease-in-out;
}

/*------------------------------------------*/
/*   Button Size
/*------------------------------------------*/
.btn.btn-sm {
  font-size: 0.775rem;
  padding: 10px 30px;
}
.btn.btn-sm {
  font-size: 0.775rem;
  padding: 10px 30px;
}

.btn.btn-md {
  font-size: 0.9rem;
  padding: 10px 30px;
}

.btn.btn-lg {
  font-size: 0.965rem;
  padding: 1.15rem 2rem;
}

/*------------------------------------------*/
/*   Button Color
/*------------------------------------------*/

.btn-theme {
  background-color: #fafcfa;
  border: 2px solid #fff;
  color: #173554 !important;
  font-weight: 700 !important;
  font-size: 0.9 em !important;
  letter-spacing: 1.5px;
}

.btn-theme:hover {
  background-color: transparent !important;
}

.btn-appointment {
  border: 1px solid rgb(49, 49, 49);
  color: #173554 !important;
  font-weight: 700 !important;
  font-size: 0.9 em !important;
  letter-spacing: 1.5px;
}

.btn-appointment:hover {
  /* background-image: linear-gradient(to right, rgba(108, 154, 180, 0), rgba(87, 127, 173, 0.5)); */
  background-color: #eceeee;
}

.btn-tra-black,
.white-color .btn-tra-black {
  color: #333;
  background-color: transparent;
  border-color: #333;
  padding: 5px 30px !important;
  letter-spacing: 2px;
  font-weight: 400;
  font-size: 0.9rem !important;
}

.btn-tra-white {
  color: #fff;
  background-color: transparent;
  border-color: #fff;
}

.btn-white,
.white-color .btn-white {
  color: #333;
  background-color: #fff;
  border-color: #fff;
}

.btn-blur {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.3);
  border-color: transparent;
}

.btn-black {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

.btn-apricot {
  color: #fff;
  background-color: #feb75f;
  border-color: #feb75f;
}

.btn-bluestone {
  color: #fff;
  background-color: #517082;
  border-color: #517082;
}

.btn-coral {
  color: #fff;
  background-color: #fa5876;
  border-color: #fa5876;
}

.btn-curacao {
  color: #fff;
  background-color: #2abdc7;
  border-color: #2abdc7;
}

.btn-green {
  color: #fff;
  background-color: #48af4b;
  border-color: #48af4b;
}

.btn-greenery {
  color: #fff;
  background-color: #80a63f;
  border-color: #80a63f;
}

.btn-magenta {
  color: #fff;
  background-color: #8e3178;
  border-color: #8e3178;
}

.btn-purple {
  color: #fff;
  background-color: #6b507d;
  border-color: #6b507d;
}

.btn-violet {
  color: #fff;
  background-color: #8a8cbd;
  border-color: #8a8cbd;
}

.btn-facebook {
  background-color: #3b5998;
}

/*------------------------------------------*/
/*   Button Hover
/*------------------------------------------*/

.tra-hover:hover {
  color: #fff !important;
  background-color: transparent;
  border-color: #fff;
}

.white-hover:hover {
  color: #333;
  background-color: transparent;
  border-color: #fff;
}

.black-hover:hover {
  color: #fff;
  background-color: #109e06;
  border-color: #109e06;
}

.apricot-hover:hover {
  color: #fff;
  background-color: #e3a456;
  border-color: #e3a456;
}

.theme-hover:hover {
  color: #fff;
  background-color: #0d9b3c;
  border-color: #0d9b3c;
}

.bluestone-hover:hover {
  color: #fff;
  background-color: #425c6b;
  border-color: #425c6b;
}

.coral-hover:hover {
  color: #fff;
  background-color: #e8526e;
  border-color: #e8526e;
}

.curacao-hover:hover {
  color: #fff;
  background-color: #25a4ad;
  border-color: #25a4ad;
}

.green-hover:hover {
  color: #fff;
  background-color: #3c903e;
  border-color: #3c903e;
}

.greenery-hover:hover {
  color: #fff;
  background-color: #709137;
  border-color: #709137;
}

.magenta-hover:hover {
  color: #fff;
  background-color: #792a66;
  border-color: #792a66;
}

.purple-hover:hover {
  color: #fff;
  background-color: #594268;
  border-color: #594268;
}

.violet-hover:hover {
  color: #fff;
  background-color: #797ba5;
  border-color: #797ba5;
}

/*------------------------------------------*/
/*   Button Focus
/*------------------------------------------*/

.btn:focus {
  color: #333;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn.btn-black:focus {
  color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
}

/*------------------------------------------*/
/*   Content List
/*------------------------------------------*/

ul.content-list {
  list-style: disc;
  margin-top: 20px;
  margin-left: 15px;
}

ul.content-list li {
  margin-bottom: 8px;
}

ul.content-list li p {
  margin-top: 0;
  margin-bottom: 0;
}

ul.content-list li:last-child {
  margin-bottom: 0;
}

/*------------------------------------------*/
/*  BOX ICONS
/*------------------------------------------*/

.box-icon [class^="flaticon-"]:before,
.box-icon [class*=" flaticon-"]:before,
.box-icon [class^="flaticon-"]:after,
.box-icon [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 4.25rem;
  line-height: 1 !important;
  font-style: normal;
  margin-left: 0;
}

.box-icon-xs [class^="flaticon-"]:before,
.box-icon-xs [class*=" flaticon-"]:before,
.box-icon-xs [class^="flaticon-"]:after,
.box-icon-xs [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 3.25rem;
  line-height: 1 !important;
  font-style: normal;
  margin-left: 0;
}

.box-icon-sm [class^="flaticon-"]:before,
.box-icon-sm [class*=" flaticon-"]:before,
.box-icon-sm [class^="flaticon-"]:after,
.box-icon-sm [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 3.75rem;
  line-height: 1 !important;
  font-style: normal;
  margin-left: 0;
}

.box-icon-md [class^="flaticon-"]:before,
.box-icon-md [class*=" flaticon-"]:before,
.box-icon-md [class^="flaticon-"]:after,
.box-icon-md [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 4.5rem;
  line-height: 1 !important;
  font-style: normal;
  margin-left: 0;
}

.box-icon-lg [class^="flaticon-"]:before,
.box-icon-lg [class*=" flaticon-"]:before,
.box-icon-lg [class^="flaticon-"]:after,
.box-icon-lg [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 5rem;
  line-height: 1 !important;
  font-style: normal;
  margin-left: 0;
}

/*------------------------------------------*/
/*   SECTION TITLE
/*------------------------------------------*/

.section-title {
  text-align: center;
  margin-bottom: 55px;
}

.section-title h3 {
  font-weight: 700;
  letter-spacing: -0.5px;
}

.section-title p {
  padding: 0 18%;
  margin-top: 15px;
  margin-bottom: 0;
}

#content-9 .section-title p,
#statistic-3 .section-title p {
  padding: 0 4%;
}

/*------------------------------------------*/
/*   TEXT SETTING
/*------------------------------------------*/

.txt-300 {
  font-weight: 300;
}
.txt-400 {
  font-weight: 400;
}
.txt-500 {
  font-weight: 500;
}
.txt-600 {
  font-weight: 600;
}
.txt-700 {
  font-weight: 700;
}
.txt-800 {
  font-weight: 800;
}
.txt-900 {
  font-weight: 900;
}

.txt-up {
  text-transform: uppercase;
}

/*------------------------------------------*/
/*   TEXT COLOR
/*------------------------------------------*/

.white-color,
.white-color h2,
.white-color h3,
.white-color h4,
.white-color h5,
.white-color h6,
.white-color p,
.white-color a,
.white-color li,
.white-color i,
.white-color span {
  color: #fff;
}

.grey-color,
.grey-color h2,
.grey-color h3,
.grey-color h4,
.grey-color h5,
.grey-color h6,
.grey-color p,
.grey-color a,
.grey-color li,
.white-color .grey-color,
.grey-color span {
  color: #666;
}

.lightgrey-color,
.lightgrey-color h2,
.lightgrey-color h3,
.lightgrey-color h4,
.lightgrey-color h5,
.lightgrey-color p,
.lightgrey-color a,
.lightgrey-color li,
.white-color .lightgrey-color,
.lightgrey-color span {
  color: #858585;
}

.apricot-color,
.apricot-color h2,
.apricot-color h3,
.apricot-color h4,
.apricot-color h5,
.apricot-color h6,
.apricot-color p,
.apricot-color a,
.apricot-color li,
.apricot-color i,
.white-color .apricot-color,
.apricot-color span {
  color: #feb75f;
}

.theme-color,
.theme-color h2,
.theme-color h3,
.theme-color h4,
.theme-color h5,
.theme-color h6,
.theme-color p,
.theme-color a,
.theme-color li,
.theme-color i,
.white-color .theme-color,
.theme-color span {
  color: #389bf2;
}
.flaticon-color {
  color: #093f4d;
}

.bluestone-color,
.bluestone-color h2,
.bluestone-color h3,
.bluestone-color h4,
.bluestone-color h5,
.bluestone-color h6,
.bluestone-color p,
.bluestone-color a,
.bluestone-color li,
.bluestone-color i,
.white-color .bluestone-color,
.bluestone-color span {
  color: #517082;
}

.coral-color,
.coral-color h2,
.coral-color h3,
.coral-color h4,
.coral-color h5,
.coral-color h6,
.coral-color p,
.coral-color a,
.coral-color li,
.coral-color i,
.white-color .coral-color,
.coral-color span {
  color: #fa5876;
}

.curacao-color,
.curacao-color h2,
.curacao-color h3,
.curacao-color h4,
.curacao-color h5,
.curacao-color h6,
.curacao-color p,
.curacao-color a,
.curacao-color li,
.curacao-color i,
.white-color .curacao-color,
.curacao-color span {
  color: #2abdc7;
}

.green-color,
.green-color h2,
.green-color h3,
.green-color h4,
.green-color h5,
.green-color h6,
.green-color p,
.green-color a,
.green-color li,
.green-color i,
.white-color .green-color,
.green-color span {
  color: #48af4b;
}

.greenery-color,
.greenery-color h2,
.greenery-color h3,
.greenery-color h4,
.greenery-color h5,
.greenery-color h6,
.greenery-color p,
.greenery-color a,
.greenery-color li,
.greenery-color i,
.white-color .greenery-color,
.greenery-color span {
  color: #80a63f;
}

.magenta-color,
.magenta-color h2,
.magenta-color h3,
.magenta-color h4,
.magenta-color h5,
.magenta-color h6,
.magenta-color p,
.magenta-color a,
.magenta-color li,
.magenta-color i,
.white-color .magenta-color,
.magenta-color span {
  color: #8e3178;
}

.purple-color,
.purple-color h2,
.purple-color h3,
.purple-color h4,
.purple-color h5,
.purple-color h6,
.purple-color p,
.purple-color a,
.purple-color li,
.purple-color i,
.white-color .purple-color,
.purple-color span {
  color: #6b507d;
}

.violet-color,
.violet-color h2,
.violet-color h3,
.violet-color h4,
.violet-color h5,
.violet-color h6,
.violet-color p,
.violet-color a,
.violet-color li,
.violet-color i,
.white-color .violet-color,
.violet-color span {
  color: #8a8cbd;
}

/* ==========================================================================
  03.  HEADER & NAVIGATION
  =========================================================================== */

/*------------------------------------------*/
/*   LOGO IMAGE
/*------------------------------------------*/

.navbar-brand {
  padding-top: 0;
  padding-bottom: 0;
  margin-right: 5rem;
}

/*------------------------------------------*/
/*   NAVIGATION BAR
/*------------------------------------------*/

.navbar {
  padding: 1.25rem 0;
  -webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  -ms-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
}

.navbar.bg-tra {
  padding: 1.5rem 0;
  background-color: transparent;
}

.navbar.bg-light {
  background-color: #fff !important;
  box-shadow: 0 0 2px rgba(50, 50, 50, 0.4);
}

.navbar.bg-dark {
  background-color: #333 !important;
}

.underline {
  text-decoration: none;
  background-image: linear-gradient(#fff, #fff);
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 2px;
  transition: background-size 0.3s;
}

.underline:hover,
.underline:focus {
  background-size: 100% 2px;
}
/*------------------------------------------*/
/*   NAVIGATION MENU
/*------------------------------------------*/

.nav-item {
  margin: 0 1.4rem;
}

.navbar-expand-lg .navbar-nav .nav-link {
  font-size: 0.79rem;
  text-transform: uppercase;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

.navbar-dark .navbar-nav .nav-link {
  color: #fff;
}

.navbar-a {
  color: #fff;
  letter-spacing: 1.5px;
  font-weight: 200;
}

.navbar-a:hover {
  color: rgb(250, 252, 252) !important;
}

.navbar-light .navbar-nav .nav-link {
  color: #3a3a3a;
}

.navbar-text {
  padding-top: 0;
  padding-bottom: 0;
  margin-left: 15px;
}

.navbar-light .navbar-text.white-color a {
  color: #fff !important;
}

/*------------------------------------------*/
/*   DROPDOWN MENU
/*------------------------------------------*/

.dropdown-menu {
  background-color: #fbfbfb;
  padding: 0.25rem 0;
  margin: 0 0 0 2px;
  border: 1px solid #ddd;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.dropdown-item {
  font-size: 1rem;
  font-weight: 500;
  padding: 0.5rem 1.25rem;
}

.dropdown-toggle::after {
  vertical-align: 0.275em;
}

.dropdown-item.dropdown-toggle {
  position: relative;
}

.dropdown-item.dropdown-toggle::after {
  vertical-align: 0.275em;
  position: absolute;
  right: 15px;
  top: 15px;
  border-left: 0.31em solid;
  border-top: 0.31em solid transparent;
  border-right: 0;
  border-bottom: 0.31em solid transparent;
}

.hover-menu li a:hover,
.hover-menu li a:focus,
.navbar > .show > a,
.navbar > .show > a:focus,
.navbar > .show > a:hover {
  color: #3a3a3a;
  background: transparent;
  outline: 0;
}

.hover-menu .collapse ul ul > li:hover > a,
.navbar .show .dropdown-menu > li > a:focus,
.navbar .show .dropdown-menu > li > a:hover,
.hover-menu .collapse ul ul ul > li:hover > a {
  background: #e3e3e3;
  color: #292929;
}

@media only screen and (max-width: 991px) {
  .hover-menu .show > .dropdown-toggle::after {
    transform: rotate(-90deg);
  }
}

@media only screen and (min-width: 991px) {
  .hover-menu .collapse ul li {
    position: relative;
  }
  .hover-menu .collapse ul li:hover > ul {
    display: block;
  }
  .hover-menu .collapse ul ul {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 180px;
    display: none;
  }

  .hover-menu .collapse ul ul li {
    position: relative;
  }
  .hover-menu .collapse ul ul li:hover > ul {
    display: block;
  }
  .hover-menu .collapse ul ul ul {
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 180px;
    display: none;
  }

  .hover-menu .collapse ul ul ul li {
    position: relative;
  }
  .hover-menu .collapse ul ul ul li:hover ul {
    display: block;
  }
  .hover-menu .collapse ul ul ul ul {
    position: absolute;
    top: 0;
    left: -100%;
    min-width: 180px;
    display: none;
    z-index: 1;
  }
}

/*------------------------------------------*/
/*   Navbar Social Icons
/*------------------------------------------*/

.header-socials {
  margin-top: 4px;
  margin-left: 8px;
  display: inline-block;
  text-align: center;
}

.header-socials span {
  float: left;
  width: auto !important;
  display: inline-block !important;
  vertical-align: top;
  clear: none !important;
  margin-left: 7px;
}

.header-socials a {
  width: 38px;
  height: 38px;
  background-color: transparent;
  display: block;
  color: #fff;
  font-size: 1rem;
  line-height: 33px !important;
  border: 2px solid #fff;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
}

.navbar-light .header-socials a {
  color: #444;
  border-color: #444;
}

.navbar-light .header-socials a:hover {
  color: #fff;
}

.header-socials a.ico-facebook:hover,
.navbar.scroll .header-socials a.ico-facebook:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.header-socials a.ico-twitter:hover,
.navbar.scroll .header-socials a.ico-twitter:hover {
  background-color: #00a9ed;
  border-color: #00a9ed;
}
.header-socials a.ico-behance:hover,
.navbar.scroll .header-socials a.ico-behance:hover {
  background-color: #2473f6;
  border-color: #2473f6;
}
.header-socials a.ico-google-plus:hover,
.navbar.scroll .header-socials a.ico-google-plus:hover {
  background-color: #cd1111;
  border-color: #cd1111;
}
.header-socials a.ico-linkedin:hover,
.navbar.scroll .header-socials a.ico-linkedin:hover {
  background-color: #015886;
  border-color: #015886;
}
.header-socials a.ico-dribbble:hover,
.navbar.scroll .header-socials a.ico-dribbble:hover {
  background-color: #d92d84;
  border-color: #d92d84;
}
.header-socials a.ico-instagram:hover,
.navbar.scroll .header-socials a.ico-instagram:hover {
  background-color: #beb3a8;
  border-color: #beb3a8;
}
.header-socials a.ico-pinterest:hover,
.navbar.scroll .header-socials a.ico-pinterest:hover {
  background-color: #ac281a;
  border-color: #ac281a;
}
.header-socials a.ico-youtube:hover,
.navbar.scroll .header-socials a.ico-youtube:hover {
  background-color: #cd1b20;
  border-color: #cd1b20;
}
.header-socials a.ico-tumblr:hover,
.navbar.scroll .header-socials a.ico-tumblr:hover {
  background-color: #3a5976;
  border-color: #3a5976;
}
.header-socials a.ico-vk:hover,
.navbar.scroll .header-socials a.ico-vk:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}

/*------------------------------------------*/
/*   Navbar Button
/*------------------------------------------*/

.navbar .btn {
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.8rem 1.5rem;
}

/*------------------------------------------*/
/*   Navigation Menu Hover
/*------------------------------------------*/

.navbar-light .nav-link:focus,
.navbar-dark .nav-link:focus {
  color: #fff;
  background-color: transparent;
}

.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
  color: #ccc;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: #060e08;
}

/*------------------------------------------*/
/*   Navbar Scroll
/*------------------------------------------*/

.navbar.scroll.bg-tra {
  padding: 16px 0;
  background-color: #fcfcfc;
  box-shadow: 0 0 2px rgba(50, 50, 50, 0.4);
}

.navbar.scroll.bg-tra.black-scroll {
  background-color: #333;
}

.navbar.scroll.bg-tra.theme-scroll {
  background-color: rgba(9, 10, 26, 0.9);
}

.navbar.scroll.navbar-dark.bg-tra .nav-link {
  color: #333;
}

.navbar.scroll.bg-tra.black-scroll .navbar-nav .nav-link,
.navbar.scroll.bg-tra.theme-scroll .navbar-nav .nav-link {
  color: #fff;
}

.navbar.scroll.bg-tra.black-scroll .navbar-nav .nav-link:hover,
.navbar.scroll.bg-tra.theme-scroll .navbar-nav .nav-link:hover {
  color: #ccc;
}

.navbar.scroll .header-socials a,
.navbar.scroll .btn.btn-tra-white {
  color: #222;
  border-color: #222;
}

.navbar.scroll.black-scroll .header-socials a,
.navbar.scroll.theme-scroll .header-socials a,
.navbar.scroll.theme-scroll .btn.btn-tra-white {
  color: #fff;
  border-color: #fff;
}

.navbar.scroll.theme-scroll,
.navbar.scroll.black-scroll .btn-tra-white,
.navbar.scroll.theme-scroll .btn-black.tra-hover:hover {
  color: #fff;
  background-color: transparent;
  border-color: #fff;
}

.navbar.scroll .btn.white-hover:hover,
.navbar.scroll .black-hover:hover,
.navbar.scroll.theme-scroll .black-hover:hover,
.navbar.scroll.theme-scroll .theme-hover:hover,
.navbar.scroll.theme-scroll .tra-hover:hover {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

.navbar.scroll.black-scroll .black-hover:hover {
  color: #333;
  background-color: #fff;
  border-color: #fff;
}

/*------------------------------------------*/
/*   Responsive Burger Menu
/*------------------------------------------*/

.navbar-light .navbar-toggler,
.navbar.bg-tra .navbar-toggler {
  color: #333;
  padding: 0 8px 0 0;
  font-size: 2rem;
  border: none;
}

.navbar-toggler:focus {
  outline: 0;
}

.logo-white,
.logo-black {
  display: block;
}

@media (max-width: 767px) {
  .logo-white {
    display: none !important;
  }
}

.navbar-light.bg-light .logo-white,
.navbar-dark.bg-tra .logo-black,
.navbar-light.bg-tra .logo-white,
.scroll.navbar-dark.bg-tra .logo-white,
.navbar-dark.bg-dark .logo-black,
.navbar-light.bg-light .logo-white,
.scroll.navbar-dark.bg-tra.black-scroll .logo-black,
.scroll.navbar-light.bg-tra.black-scroll .logo-black,
.scroll.navbar-dark.bg-tra.theme-scroll .logo-black,
.scroll.navbar-light.bg-tra.theme-scroll .logo-black {
  display: none;
}

.navbar-dark.bg-tra .logo-white,
.navbar-light.bg-tra .logo-black,
.scroll.navbar-dark.bg-tra .logo-black,
.navbar-dark.bg-dark .logo-white,
.navbar-light.bg-light .logo-black,
.scroll.navbar-dark.bg-tra.black-scroll .logo-white,
.scroll.navbar-light.bg-tra.black-scroll .logo-white,
.scroll.navbar-dark.bg-tra.theme-scroll .logo-white,
.scroll.navbar-light.bg-tra.theme-scroll .logo-white {
  display: block;
}

@media (min-width: 768px) and (max-width: 991.99px) {
  .navbar.bg-tra {
    background-color: #fff !important;
  }
  .navbar.bg-tra.theme-scroll {
    background-color: rgb(9, 17, 26) !important;
  }
}

@media (max-width: 767px) {
  .navbar.bg-tra {
    background-color: #fff !important;
  }
  .navbar.bg-tra.theme-scroll {
    background-color: rgba(9, 17, 26, 0.9) !important;
  }
}

.main-section .container {
  position: relative;
  z-index: 3;
}

.backgroundintro {
  background-image: url(../images/bg3.png);
  background-position: center bottom;
  height:100vh;
}

@media only screen and (max-width: 768px) {
  .backgroundintro {

    height:70vh;
  }
}

#maincontent {
  padding-top: 220px;
  padding-bottom: 450px;
}

span.os-version {
  display: block;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1;
  margin-top: 20px;
}

.introimage img {
  text-align: center;
  margin-top: -390px;
}

@media only screen and (max-width: 768px) {
  .introimage img {
    display: none;
  }
  #maincontent {
    padding-top: 220px;
    padding-bottom: 50px;
  }
}

@media only screen and (max-width: 991px) {
  .introimage img {
    text-align: center;
    margin-top: -280px;
  }
}

.section-title {
  margin-bottom: 65px;
}

.sbox-2 {
  padding: 0 5%;
  margin-bottom: 40px;
}

.sbox-2 h5 {
  margin-top: 20px;
  margin-bottom: 12px;
}

.sbox-2 p {
  line-height: 1.5;
  margin-bottom: 0;
}

#content-9.content-section .container {
  overflow: hidden;
}

.content-txt {
  margin-bottom: 40px;
}

.bg-inner {
  position: relative;
  z-index: 1;
}

.content-txt h4.h4-xs,
.content-txt h4.h4-sm,
.content-txt h3.h3-xs,
.content-txt h3.h3-sm {
  letter-spacing: -0.5px;
  margin-bottom: 25px;
}

.content-txt h4.h4-xs {
  margin-bottom: 15px;
}

.content-txt h5.h5-sm {
  margin-top: 20px;
  margin-bottom: 15px;
}

.content-txt h3.h3-md {
  margin-bottom: 10px;
}

.content-txt p {
  padding: 0 15%;
}

.content-boxes {
  position: relative;
  z-index: 999;
  background-color: #fff;
  border: 1px solid #eee;
  padding: 50px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  margin: 0 5% -100px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}

.cbox-2 {
  margin-bottom: 40px;
}

.cbox-4 {
  margin-bottom: 20px;
}

.cbox-2-txt,
.cbox-3-txt,
.cbox-4-txt {
  overflow: hidden;
  padding-left: 25px;
}

.cbox-3-txt {
  padding-left: 22px;
}

.cbox-3-txt h5 {
  color: #333;
}

.cbox-4-txt {
  padding-left: 45px;
}

.cbox-1 p {
  padding-left: 20px;
}

.cbox-2 p,
.cbox-3 p,
.cbox-4 p {
  line-height: 1.5;
  margin-bottom: 0;
}

.option-list {
  position: relative;
}

.option-list::after {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  position: absolute;
  bottom: -15px;
  left: 7px;
  z-index: 3;
}

.option-list::before {
  content: "";
  display: block;
  position: absolute;
  height: 100%;
  top: 15px;
  left: 10px;
  width: 2px;
  z-index: 3;
}

.option-list.theme-list::after,
.option-list.theme-list::before {
  background-color: #389bf2;
}

.cbox-3 span,
.cbox-3 img {
  text-align: center;
  float: left;
}

.cbox-4 span {
  width: 22px;
  height: 22px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  position: absolute;
  font-size: 0.75rem;
  line-height: 22px;
  text-align: center;
  z-index: 999 !important;
}

.theme-list .cbox-4 span {
  background-color: #389bf2;
}

/*------------------------------------------*/
/*   CONTENT IMAGE
/*------------------------------------------*/

.content-img {
  text-align: center;
  margin-bottom: 40px;
}

.content-7-img {
  position: relative;
  text-align: center;
  margin-bottom: 40px;
}

.content-7-img img {
  position: relative;
  max-width: none;
  display: inline-block;
}

/* ==========================================================================
  08. skills TABLES
  =========================================================================== */

#skills-page {
  padding-top: 180px;
}

.skills-row {
  margin-right: 30px;
  margin-left: 30px;
}

/*------------------------------------------*/
/*   OFFER TABLE
/*------------------------------------------*/

.skills-table {
  transition: box-shadow 0.3s;
  text-align: center;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 2px 2px 2px;
  margin-bottom: 40px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 10px;
}

.skills-table:hover {
  box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
}

.skills-title h4 {
  color: #292929;
  font-weight: 700;
  letter-spacing: -0.5px;
  margin-bottom: 20px;
}

.skills-table span.price {
  font-size: 70px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

/*------------------------------------------*/
/*    skills Table Body
/*------------------------------------------*/

.skills-table ul.features {
  padding: 0px 0 30px;
}

.skills-table ul.features li {
  font-size: 1rem;
  line-height: 1;
  font-weight: 300;
  padding: 8px 0;
}

.skills-table ul.features li:last-child {
  border-bottom: none;
}

/* ==========================================================================
  10.  STATISTIC
  =========================================================================== */

#statistic-1,
#statistic-2 {
  padding-top: 80px;
  padding-bottom: 40px;
}

#statistic-2.bg-image {
  background-image: url(../images/statistic-2.jpg);
}

.statistic-block {
  text-align: center;
  margin-bottom: 40px;
}

.statistic-block h5 {
  color: #060e08;
}

.staistic-3-boxes {
  margin: 0 40px;
}

/*------------------------------------------*/
/*    Statistic Block Number
/*------------------------------------------*/

.statistic-block h5 {
  font-size: 2.75rem;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}

#statistic-2 .statistic-block h5,
#statistic-3 .statistic-block h5 {
  margin-top: 20px;
}

.statistic-block p {
  font-size: 0.825rem;
  letter-spacing: 0;
  text-transform: uppercase;
  margin-bottom: 0;
}

/* ==========================================================================
  BRANDS
  =========================================================================== */

#brands-1,
#brands-2 {
  padding-top: 80px;
  padding-bottom: 50px;
}

#brands-2.bg-lightgrey {
  padding-top: 60px;
  padding-bottom: 30px;
}

/*------------------------------------------*/
/*    BRANDS LOGO HOLDER
/*------------------------------------------*/

#brands-2 .brand-logo {
  margin-bottom: 30px;
}

#brands-2 .brand-logo img {
  padding: 0 15px;
}

#cta-4 {
  padding-top: 60px;
  padding-bottom: 60px;
}

.cta-txt h4 {
  letter-spacing: -0.75px;
  margin-bottom: 10px;
}

#cta-4 .cta-txt p {
  padding: 0 15% 0 0;
  margin-bottom: 0;
}

/* ==========================================================================
FOOTER
  =========================================================================== */

.footer-box,
#footer-1 .footer-links {
  font-size: 0.8em !important;
}



/*------------------------------------------*/
/*   FOOTER TYPOGRAPHY
/*------------------------------------------*/

.footer h5 {
  margin-top: 3px;
  margin-bottom: 20px;
}

.footer-info p {
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .footer-info {
    display: none;
  }
}

.footer-box p,
.footer-links p {
  margin-bottom: 3px;
}

.footer-copyright p {
  margin-bottom: 0;
}

.footer-copyright p span {
  font-weight: 700;
}

/*------------------------------------------*/
/*   FOOTER LINKS
/*------------------------------------------*/

.footer-links li {
  width: auto !important;
  display: block !important;
  vertical-align: top;
  clear: none !important;
  margin: 0 0 10px 0;
  padding: 0;
}

#footer-4 .footer-links li {
  width: auto !important;
  display: inline-block !important;
  vertical-align: top;
  clear: none !important;
  margin: 0 25px;
}

.footer-links li a:hover {
  color: rgb(252, 249, 249);
  text-decoration: none;
}

/*------------------------------------------*/
/*   BOTTOM FOOTER
/*------------------------------------------*/

.bottom-footer {
  text-align: center;
  margin-top: 20px;
  padding-top: 35px;
  padding-bottom: 35px;
}

.bg-lightgrey {
  border-top: 1px solid #ddd;
}

nav a#pull {
  display: none;
}

.offer {
  text-align: center;
  color: rgb(62, 146, 185);
  margin-bottom: 30px;
  text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);
}

.besoin {
  text-align: center;
  color: rgb(16, 61, 82);
  text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);
}

.plus:hover {
  color: #109e06 !important;
}

.mapstyle {
  height: 60vh;
  margin-top: 5%;
  opacity: 0.7;
  transition: all 0.4s ease-in-out;
}

.mapstyle:hover {
  opacity: 1;
  transform: scale(1.09);
}

.solution-card-link {
  padding: 18px 25px;
  position: relative;
}

.solution-card-link:hover {
  background-color: #eaf3f7;
}

.solution-card,
.solution-card-video {
  background-color: #fff;
  border: 1px solid #f0f0f0;
  padding: 35px 0 0;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
  box-shadow: 0 0 15px rgba(30, 30, 30, 0.1);
  margin-bottom: 40px;
}

#blog-page .solution-card,
#blog-page .solution-card-video {
  box-shadow: 0 0 10px rgba(80, 80, 80, 0.1);
}

.posts-holder .solution-card,
.posts-holder .solution-card-video {
  margin-bottom: 60px;
}

.solution-card-txt {
  padding: 0 25px 20px;
}

.solution-card-txt span,
.ssolution-card-txt p.post-meta {
  font-size: 0.875rem;
  font-weight: 600;
  display: block;
  margin-bottom: 8px;
}

.mapbg {
  background: url(../images/maptransparent.png) no-repeat;
  background-position: center;
  background-size: cover;
  padding-top: 20px;
}

.brands-section {
  padding-top: 20px;
  background-color: #e6f4fc;
}

.footerdark {
  background-image: linear-gradient(135deg, #8d8f94 0%, #425985 100%);
  color: #fff;
}

.footerdark a {
  color: #fff;
}

.footerimgcontainer {
  position: relative;
}

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

.footerbrand {
  max-width: 120px !important;
  max-height: auto !important;
}

.headerbrand {
  max-width: 90px !important;
  max-height: auto !important;
}


.contacts {
  max-width: 350px !important;
  max-height: 250px !important;
}

/* @media only screen and (max-width: 1200px) {
  .footerbrandwrapper { display: none; }
} */

/* .footerbrandsmallscreen{
  display:none;
}

@media only screen and (max-width: 768px) {
  .footerbrandsmallscreen { display: block; }
} */

.solution-card-txt p {
  margin-top: 10px;
  margin-bottom: 0;
}

a {
  cursor: pointer !important;
}
.solution-card-link {
  padding: 18px 25px;
  position: relative;
}

.solution-card-link h5 {
  font-size: 0.975rem;
  line-height: 1;
  margin-bottom: 0;
}

.solution-card-link span {
  position: absolute;
  right: 25px;
  top: 12px;
}

.contactcolor {
  color: #000;
}

/* .input01 {
    border-bottom: blue;
  }

  .input01 > input {
border:none;
  } */

.team-member {
  background: rgb(255, 255, 255);
}

.team-member figure {
  margin: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.team-member .social {
  position: absolute;
  margin: 0;
  padding: 0;
  bottom: 0;
  padding: 10px;
  -webkit-transform: translateX(-101%);
  -ms-transform: translateX(-101%);
  transform: translateX(-101%);
  -webkit-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  transition: 0.3s all ease;
  background: #398a83;
  border-radius: 0px 10px 10px 0px;
}

.team-member .social li {
  list-style: none;
}

.team-member .social li a {
  display: inline-block;
  padding: 5px;
  color: #fff;
}

.team-member h3 {
  color: #000;
  margin: 0;
  bottom: 0;
  font-size: 1.2rem;
}

.team-member .position {
  color: gray;
}

.team-member:hover .social {
  -webkit-transform: translateX(0%);
  -ms-transform: translateX(0%);
  transform: translateX(0%);
}

.contact-form {
  display: block;
  width: 100%;
}

.contact-form input {
  background-color: transparent;
  padding-left: 25px;
  height: 60px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #cacaca;
  margin-bottom: 30px;
  font-size: 13px;
}

.contact-form textarea {
  padding-left: 25px;
  height: 200px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #cacaca;
  margin-bottom: 30px;
  font-size: 13px;
  background-color: transparent;
}

.contact-form ::-webkit-input-placeholder {
  font-style: italic;
}

.contact-form :-ms-input-placeholder {
  font-style: italic;
}

.contact-form ::-ms-input-placeholder {
  font-style: italic;
}

.contact-form ::placeholder {
  font-style: italic;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
  outline: none;
}

.site-btn {
  display: inline-block;
  text-transform: uppercase;
  font-size: 12px;
  min-width: 213px;
  min-height: 20px;
  text-align: center;
  padding: 20px 10px 15px;
  background-color: #fff;
  margin-left: 10px;
  border: 2px solid #40424a;
  color: #40424a;
  font-weight: 700;
  cursor: pointer;
}

.site-btn:hover {
  color: #10232c;
  border: 2px solid #10232c;
}

.footer-subscribe .btn {
  height: 43px;
}

.footer-heading {
  font-size: 16px;
  color: #fff;
}

.site-block-subscribe .btn {
  padding-left: 20px;
  padding-right: 20px;
}

.site-block-subscribe .form-control {
  font-weight: 300;
  border-color: #fff !important;
  height: 80px;
  font-size: 22px;
  color: #fff;
  padding-left: 30px;
  padding-right: 30px;
}
.site-block-subscribe .form-control::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(255, 255, 255, 0.5);
  font-weight: 200;
  font-style: italic;
}
.site-block-subscribe .form-control::-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(255, 255, 255, 0.5);
  font-weight: 200;
  font-style: italic;
}
.site-block-subscribe .form-control:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(255, 255, 255, 0.5);
  font-weight: 200;
  font-style: italic;
}
.site-block-subscribe .form-control:-moz-placeholder {
  /* Firefox 18- */
  color: rgba(255, 255, 255, 0.5);
  font-weight: 200;
  font-style: italic;
}

.news .btn {
  font-size: 16px;
  border-radius: 30px;
  padding: 10px 30px;
  font-weight: 100;
}

.news .btn:hover,
.btn:active,
.btn:focus {
  outline: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.news .btn.btn-primary {
  background: #46ddb0;
  border-color: #46ddb0;
  color: #fff;
}

.news .btn.btn-primary:hover {
  background: #fff;
  border-color: #fff;
  color: #46ddb0;
}

.news .btn.btn-primary.btn-black--hover:hover {
  background: #666666;
  color: #fff;
}

.news input {
  background-color: #f5f6fa;
}

.position-title {
  text-transform: uppercase;
}

.upperdiv {
  background-image: linear-gradient(
    to right,
    rgba(0, 255, 13, 0),
    rgb(49, 92, 141)
  );
  background-color: rgb(69, 192, 192);
  height: 70px;
}
.downdiv {
  background-image: linear-gradient(
    to right,
    rgba(0, 255, 13, 0),
    rgb(49, 92, 141)
  );
  background-color: rgb(69, 192, 192);
}
@media only screen and (max-width: 768px) {
  .hover-menu .show > .dropdown-toggle::after {
    transform: rotate(-90deg);
  }
  .upperdiv {
    display: none;
  }
}

.flex-container {
  display: flex;
  flex-wrap: wrap;
}

.careerheader {
  position: relative;
  background-image: linear-gradient(
      to bottom,
      rgba(12, 12, 12, 0.2),
      rgba(250, 245, 245, 0.1)
    ),
    url(../images/careerimg.png);
  background-size: cover;
  width: 100%;
  height: 100vh;
}

.aboutheader {
  position: relative;
  background-image: linear-gradient(
      to bottom,
      rgba(12, 12, 12, 0.2),
      rgba(250, 245, 245, 0.1)
    ),
    url(../images/upbg2.png);
  background-size: cover;
  width: 100%;
  height: 50vh;
}

.loading {
  position: relative;
  background-image: linear-gradient(
      to bottom,
      rgba(12, 12, 12, 0.2),
      rgba(250, 245, 245, 0.1)
    ),
    url(../images/loading.jpeg);
  background-size: cover;
  width: 100%;
  height: 100vh;
}

.careerwraper {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.careerintro {
  position: absolute;
  top: 20%;
  right: 20px;
  height: auto;
  width: auto;
  color: rgb(240, 227, 227);
  font-size: 3rem;
  text-transform: uppercase;
  line-height: 50px;
  background-color: rgba(0, 0, 0, 0.15);
  padding: 30px;
  padding-bottom: 30px;
  border-radius: 10px;
}

@media screen and (max-width: 768px) {
  .careerintro {
    font-size: 2rem;
    line-height: 40px;
    padding: 20px;
  }
}

.careerbtn {
  color: rgb(124, 140, 141);
  background-color: rgba(9, 48, 51, 0.7);
  border: none;
  text-align: center;
  text-decoration: none;
  display: block;
  font-size: 16px;
  color: rgb(240, 227, 227);
  width: auto;
  margin: 20px;
  padding: 0 20px;
  border-radius: 10px;
}

.careerbtn:hover {
  background-color: rgba(8, 8, 8, 0.9);
  color: white;
}

.career-text {
  font-size: 1.5em;
  line-height: 20px;
  color: #94adb8;
}

.description-text {
  font-size: 1.2em;
  line-height: 20px;
  color: #161818;
}

.apllydiv {
  position: relative;
}

.apply-job {
  font-size: 20px;
  transition: 0.5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  background-color: rgb(8, 8, 8);
  width: 100%;
  color: rgb(231, 228, 228);
  padding-top: 30px;
  padding-bottom: 30px;
  text-transform: uppercase;
  transition: ease 1s;
}

.apllydiv:hover .apply-job {
  opacity: 1;
  color: #fff;
}

.apply-link {
  color: rgb(236, 234, 234);
}

.apply-link:hover {
  color: #fff;
}

.flexfooter {
  display: flex;
  flex-wrap: wrap;
}

.flexfooter p,
h5,
h6,
h2 {
  font-size: 0.8rem;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .flexfooter p,
  h5,
  h6,
  h2 {
    font-size: 1rem;
    color: #fff;
  }
}

.footerdiv {
  flex: 1;
  min-width: 150px;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  /* margin: 30px; */
}

.footerdivbottom {
  /* border-bottom: 1px solid rgb(181, 213, 223); */
  text-transform: uppercase;
  color: #95d5e0;
  font-weight: 500 !important;
}

.mazecubebottom {
  border-bottom: 1px solid rgb(181, 213, 223);
}

/* Social Networking */

.social-menu {
  display: flex;
  margin-top: 20px;
  width: 100%;
  text-align: center;
}

.social-menu li {
  color: #fff;
  width: 30px;
  height: auto;
  font-size: 20px;
}

.social-menu i {
  color: #fff;
}

.social-menu a {
  text-decoration: none;
}


.flexyrdv {
  flex-direction: column;
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .flexyrdv {
   margin-left:10px;
   margin-right:10px;
  }
}


.flexyitemrdv {
  flex: 1;
}

.timeimg {
  width: 100%;
  height: auto;
}

.fieldsimg {
  width: 90%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.formone input:focus {
  border: solid 1px #222;
  box-shadow: none;
}

.formone select:focus {
  border: solid 1px #222;
  box-shadow: none;
}

.formone textarea:focus {
  border: solid 1px #222;
  box-shadow: none;
}

#available {
  height: 52%;
}

.successimg {
  max-width: 150px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 30px;
}

@media screen and (max-width: 500px) {
  .successimg {
    width: 100px;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }
}

.solutionimg {
  max-width: 800px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 30px;
}

@media screen and (max-width: 500px) {
  .solutionimg {
    width: 350px;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }
}

.upfile {
  background-color: #2abdc7;
  padding: 10px 20px;
  border-radius: 5px;
  cursor: pointer;
  color: #ffffff;
  font-weight: 700;
}

.upfile:hover {
  background-color: #139ac4;
}

.alldivs {
  margin-top: 20px;
  margin-bottom: 20px;
}

.recap {
  text-decoration: none;
}

.recap-item {
  font-size: 1.4em;
}

.recap-check {
  color: lightgreen;
  font-size: 1em;
  margin-right: 20px;
}

.join-arrow {
  color:rgb(62, 146, 185);
  font-size: 1em;
  margin-right: 20px;
}

.join-item {
  font-size: 1.5em;
}

.recap-left {
  padding-left: 50px;
}



.recap-cloud-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-strategy-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-bigdata-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-crm-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-erp-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-portfolio-text {
  font-size: 2em !important;
  margin-top:70px;
}

.recap-webs-text {
  font-size: 2em !important;
  margin-top:70px;
}

@media screen and (max-width: 990px) {
  .recap-web-text {
    order: 2;
    text-align: center;
    padding: 20px;
  }

  .recap-web-img {
    order: 1;
    text-align: center;
    padding: 0;
  }


  .recap-mob-text {
    order: 2;
    text-align: center;
    padding: 20px;
  }

  .recap-mob-img {
    order: 1;
    text-align: center;
    padding: 0;
  }


  .recap-payment-text {
    order: 2;
    text-align: center;
    padding: 20px;
  }

  .recap-payment-img {
    order: 1;
    text-align: center;
    padding: 0;
  }


  .recap-marketing-text {
    order: 2;
    text-align: center;
    padding: 20px;
  }

  .recap-marketing-img {
    order: 1;
    text-align: center;
    padding: 0;
  }


  .recap-seo-text {
    order: 2;
    text-align: center;
    padding: 20px;
  }

  .recap-seo-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-strategy-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size:1.5em !important;
    margin-top:10px;
  }

  .recap-strategy-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-cloud-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-cloud-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-bigdata-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-bigdata-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-crm-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-crm-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-erp-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-erp-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-portfolio-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-portfolio-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

  .recap-webs-text {
    order: 2;
    text-align: center;
    padding: 20px;
    font-size: 1.5em !important;;
    margin-top:10px;
  }

  .recap-webs-img {
    order: 1;
    text-align: center;
    padding: 0;
  }

}



.recap-img {
  width: 90%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.year-img {
  width: 65%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}


.recap-portfolios-img {
  width: 70%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
  /* filter: drop-shadow(5px 5px 5px #222); */
}

@media screen and (max-width: 990px) {
  .recap-img {
    width: 70%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }

  .recap-item {
    font-size:1.3em;
  }
}

/* @media screen and (max-width: 991px) {
  .recap-img {
    display: none;
  }
} */

.bounce-frame {
  display: flex;
  height: auto;
  width: 100%;
}
.bounce-item {
  align-self: flex-end;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  transform-origin: bottom;
  z-index:-1;
}
.bounce-action {
  animation-name: bounce-effect;
  animation-timing-function: linear;
}
@keyframes bounce-effect {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-20px); }
  100% { transform: translateY(0); }
}


.join-ecommerce {
  background-color: rgba(124, 140, 141, .1);
  height:auto;
  width:100%;
}

@media screen and (max-width:992px) {
  .join-ecommerce {
    padding-bottom:50px;
  }
}

.join-ecommerce-title{
  font-size:3em;
  padding-top:50px;
  padding-left:30px;
  color:rgb(8, 8, 8);
  line-height:60px;
}

.join-quote{
  font-size:1em;
  color:rgb(62, 146, 185);
  top:20px;
}

.join-question {
  font-size:1.5em;
  color:rgb(62, 146, 185);
  font-weight:700;
}

.newicon {
    font-family: 'Montserrat Alternates', sans-serif !important;
}


.disclaimer-dark{
  color:darkslategrey; 
  background-color:rgba(235,241,241,.4);
  display:flex !important;
  flex-direction:row;
  padding:20px;
}

.disclaimer-light{
  color:darkslategrey; 
  background-color:rgba(235,241,241,.1);
  display:flex !important;
  padding:20px;

}

.disclaimer-title{
  font-size:1.5em; 
}

.skew-section {
  background:#00a9ed !important;
  color: white;
  clip-path: polygon(0 20%, 100% 0, 100% 100%, 0 100%);
  padding: 10rem;
  /* box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; */
}



.vacancy a {
color:#0a6a91;
text-transform:uppercase;
font-size:.9em;
}


#upbtn {
  text-transform:uppercase;
  background-color: rgb(14, 53, 68);
  color: white;
  padding: 0.5rem;
  font-family: sans-serif;
  font-size:.8em;
  font-weight:900;
  border-radius: 0.2rem;
  cursor: pointer;
  margin-top: 1rem;
}

#otherbtn {
  text-transform:uppercase;
  background-color: rgb(14, 53, 68);
  color: white;
  padding: 0.5rem;
  font-family: sans-serif;
  font-size:.8em;
  font-weight:900;
  border-radius: 0.2rem;
  cursor: pointer;
  margin-top: 1rem;
}

#file-chosen{
  margin-left: 0.3rem;
  font-family: sans-serif;
}

#other-file-chosen{
  margin-left: 0.3rem;
  font-family: sans-serif;
}

input[type=file]::file-selector-button {
  color:#495155;
  font-size:.9em;
  font-weight:400;
  border: 1px solid #10cc74;
  padding: .7em 2em;
  border-radius: .2em;
  background-color: #10cc74;
  transition: .3s;
  width: 200px;
  text-transform:uppercase;
  cursor:pointer;
}

input[type=file]::file-selector-button:hover {
  background-color: #12ee87;
  border: 1px solid #12ee87;
}

.submit-btn {
  color:#fff;
  font-size:.9em;
  border: 1px solid #135472;
  padding: 1em 2em;
  border-radius: .2em;
  background-color: #135472;
  transition: .6s;
  text-transform:uppercase;
  cursor:pointer;
}

.submit-btn:hover {
  background-color: #052330;
  border: 1px solid #050505;
}


.tablehome{
  position:relative;
}

.homeitem{
  position:absolute;
  top:5px;
}


.managerprofile{
  border-radius: 15px 50px 30px 5px;
  max-width:100%; 
  height:auto;
}

.specialhref{
  cursor:pointer !important;
color:#0d9b3c;
}

.twolevels {
  width:70%; 
  margin:auto; 
  margin-bottom:20px;
}

@media screen and (max-width:768px){
  .twolevels {
    width:90%; 

  }
  
}

.descriptionhr {
  border:none;
  height: 20px;
 	width: 100%;
	height: 50px;
	margin-top: 0;
	border-bottom: 1px solid #095f64;
	box-shadow: 0 20px 20px -20px #095f64;
  margin: -50px auto 10px; 
}

.textsize{
  font-size:.8em;
}