@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900|Open+Sans:400,300,400italic,600,700,800&subset=latin,latin-ext);

html {
  box-sizing: border-box
}

*,
*::after,
*::before {
  box-sizing: inherit
}

@media only screen and (max-width: 1200px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 1024px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 1300px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 800px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 640px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 450px) {
  body {
    vivibility: visible
  }
}

@media only screen {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 451px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 641px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 801px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 1025px) {
  body {
    vivibility: visible
  }
}

@media only screen and (max-width: 450px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 451px) and (max-width: 640px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 641px) and (max-width: 800px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 801px) and (max-width: 1024px) {
  body {
    vivibility: visible
  }
}

@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  body {
    vivibility: visible
  }
}

.show-for-xsmall-up {
  display: none !important
}

@media only screen {
  .show-for-xsmall-up {
    display: inherit !important
  }
}

.show-for-xsmall-down {
  display: none !important
}

@media only screen and (max-width: 450px) {
  .show-for-xsmall-down {
    display: inherit !important
  }
}

.show-for-xsmall-only {
  display: none !important
}

@media only screen and (max-width: 450px) {
  .show-for-xsmall-only {
    display: inherit !important
  }
}

.show-for-small-up {
  display: none !important
}

@media only screen and (min-width: 451px) {
  .show-for-small-up {
    display: inherit !important
  }
}

.show-for-small-down {
  display: none !important
}

@media only screen and (max-width: 640px) {
  .show-for-small-down {
    display: inherit !important
  }
}

.show-for-small-only {
  display: none !important
}

@media only screen and (min-width: 451px) and (max-width: 640px) {
  .show-for-small-only {
    display: inherit !important
  }
}

.show-for-medium-up {
  display: none !important
}

@media only screen and (min-width: 641px) {
  .show-for-medium-up {
    display: inherit !important
  }
}

.show-for-medium-down {
  display: none !important
}

@media only screen and (max-width: 800px) {
  .show-for-medium-down {
    display: inherit !important
  }
}

.show-for-medium-only {
  display: none !important
}

@media only screen and (min-width: 641px) and (max-width: 800px) {
  .show-for-medium-only {
    display: inherit !important
  }
}

.show-for-large-up {
  display: none !important
}

@media only screen and (min-width: 801px) {
  .show-for-large-up {
    display: inherit !important
  }
}

.show-for-large-down {
  display: none !important
}

@media only screen and (max-width: 1024px) {
  .show-for-large-down {
    display: inherit !important
  }
}

.show-for-large-only {
  display: none !important
}

@media only screen and (min-width: 801px) and (max-width: 1024px) {
  .show-for-large-only {
    display: inherit !important
  }
}

.show-for-xlarge-up {
  display: none !important
}

@media only screen and (min-width: 1025px) {
  .show-for-xlarge-up {
    display: inherit !important
  }
}

.show-for-xlarge-down {
  display: none !important
}

@media only screen and (max-width: 1200px) {
  .show-for-xlarge-down {
    display: inherit !important
  }
}

.show-for-xlarge-only {
  display: none !important
}

@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  .show-for-xlarge-only {
    display: inherit !important
  }
}

@media only screen {
  .hide-for-xsmall-up {
    display: none !important
  }
}

@media only screen and (max-width: 450px) {
  .hide-for-xsmall-down {
    display: none !important
  }
}

@media only screen and (max-width: 450px) {
  .hide-for-xsmall-only {
    display: none !important
  }
}

@media only screen and (min-width: 451px) {
  .hide-for-small-up {
    display: none !important
  }
}

@media only screen and (max-width: 640px) {
  .hide-for-small-down {
    display: none !important
  }
}

@media only screen and (min-width: 451px) and (max-width: 640px) {
  .hide-for-small-only {
    display: none !important
  }
}

@media only screen and (min-width: 641px) {
  .hide-for-medium-up {
    display: none !important
  }
}

@media only screen and (max-width: 800px) {
  .hide-for-medium-down {
    display: none !important
  }
}

@media only screen and (min-width: 641px) and (max-width: 800px) {
  .hide-for-medium-only {
    display: none !important
  }
}

@media only screen and (min-width: 801px) {
  .hide-for-large-up {
    display: none !important
  }
}

@media only screen and (max-width: 1024px) {
  .hide-for-large-down {
    display: none !important
  }
}

@media only screen and (min-width: 801px) and (max-width: 1024px) {
  .hide-for-large-only {
    display: none !important
  }
}

@media only screen and (min-width: 1025px) {
  .hide-for-xlarge-up {
    display: none !important
  }
}

@media only screen and (max-width: 1200px) {
  .hide-for-xlarge-down {
    display: none !important
  }
}

@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  .hide-for-xlarge-only {
    display: none !important
  }
}

.relative {
  position: relative
}

.overflow {
  overflow: hidden
}

.left {
  float: left
}

.right {
  float: right
}

.clear {
  width: 100%;
  height: 0px;
  overflow: hidden;
  clear: both
}

.section {
  width: 100%;
  position: relative;
  z-index: 2
}

img.responsive {
  max-width: 100%;
  height: auto
}

.tableHelper {
  display: table;
  width: 100%;
  height: 100%
}

.cellHelper {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle
}

@font-face {
  font-family: "icons";
  src: url("../fonts/icons.eot?d4189c02d7f8ee6f169af4e83865d560");
  src: url("../fonts/icons.eot?#iefix") format("embedded-opentype"), url("../fonts/icons.woff?d4189c02d7f8ee6f169af4e83865d560") format("woff"), url("../fonts/icons.ttf?d4189c02d7f8ee6f169af4e83865d560") format("truetype"), url("../fonts/icons.svg?d4189c02d7f8ee6f169af4e83865d560#icons") format("svg");
  font-weight: normal;
  font-style: normal
}

.icon {
  font-family: "icons";
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
  font-weight: normal;
  font-style: normal;
  speak: none;
  text-decoration: inherit;
  text-transform: none;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

.icon_airplane105:before {
  content: "\f101"
}

.icon_arrow395:before {
  content: "\f102"
}

.icon_arrow3951:before,
form span.file-input label .file .pseudoInput:before {
  content: "\f103"
}

.icon_arrow39512:before,
.careers .accordion .card .head:before {
  content: "\f104"
}

.icon_arrow3952:before {
  content: "\f105"
}

.icon_delivery55:before {
  content: "\f106"
}

.icon_industry13:before {
  content: "\f107"
}

.icon_magnifying47:before {
  content: "\f108"
}

.icon_money401:before {
  content: "\f109"
}

.icon_pin71:before {
  content: "\f10a"
}

.icon_play128:before {
  content: "\f10b"
}

.icon_play1281:before {
  content: "\f10c"
}

.icon_play1282:before {
  content: "\f10d"
}

.icon_play1283:before {
  content: "\f10e"
}

.icon_right11:before {
  content: "\f10f"
}

.icon_right112:before {
  content: "\f110"
}

.icon_sea9:before {
  content: "\f111"
}

.icon_stars64:before {
  content: "\f112"
}

.icon_tick7:before,
.standardText ul.styled li:before,
.aboutUs .directors .cards .card .frame .function ul.styled li:before,
.departmentsList li .description ul.styled li:before,
.fancybox-popup .fancybox-skin .popText ul.styled li:before {
  content: "\f113"
}

.icon_untitled:before {
  content: "\f114"
}

.icon_untitled10:before {
  content: "\f115"
}

.icon_untitled11:before {
  content: "\f116"
}

.icon_untitled12:before {
  content: "\f117"
}

.icon_untitled13:before {
  content: "\f118"
}

.icon_untitled14:before {
  content: "\f119"
}

.icon_untitled15:before {
  content: "\f11a"
}

.icon_untitled16:before {
  content: "\f11b"
}

.icon_untitled17:before {
  content: "\f11c"
}

.icon_untitled18:before {
  content: "\f11d"
}

.icon_untitled19:before {
  content: "\f11e"
}

.icon_untitled2:before {
  content: "\f11f"
}

.icon_untitled20:before {
  content: "\f120"
}

.icon_untitled3:before {
  content: "\f121"
}

.icon_untitled4:before {
  content: "\f122"
}

.icon_untitled5:before {
  content: "\f123"
}

.icon_untitled6:before {
  content: "\f124"
}

.icon_untitled7:before {
  content: "\f125"
}

.icon_untitled8:before {
  content: "\f126"
}

.icon_untitled9:before {
  content: "\f127"
}

.aboutUs {
  overflow: hidden
}

@media only screen and (max-width: 640px) {
  .aboutUs #where {
    display: none
  }
}

.aboutUs .whoAreWe {
  padding: 1.875em 0
}

.aboutUs .whoAreWe .wrapper.first .wrapper {
  position: relative
}

.aboutUs .whoAreWe .text {
  overflow: hidden;
  margin-bottom: 3.125em
}

.aboutUs .whoAreWe .text .left.side,
.aboutUs .whoAreWe .text .right.side {
  width: 48%
}

@media only screen and (max-width: 640px) {

  .aboutUs .whoAreWe .text .left.side,
  .aboutUs .whoAreWe .text .right.side {
    width: 100%;
    float: none;
    overflow: hidden
  }
}

.aboutUs .whoAreWe .blocks {
  overflow: hidden;
  margin-bottom: 2.5em
}

.aboutUs .whoAreWe .blocks .block {
  width: 50%;
  float: left;
  background: #292873;
  color: #fff;
  padding: 2.5em 2.5em;
  position: relative
}

@media only screen and (max-width: 640px) {
  .aboutUs .whoAreWe .blocks .block {
    width: 100%;
    float: none;
    overflow: hidden
  }
}

.aboutUs .whoAreWe .blocks .block .decoration {
  font-size: 5.875em;
  font-weight: 100;
  font-family: "Roboto", Arial, sans-serif;
  opacity: 0.1;
  position: absolute;
  right: 0.2127659574em;
  top: 0
}

.aboutUs .whoAreWe .blocks .block .head {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 2.1875em;
  font-weight: 500;
  padding: 0.7142857143em 0
}

.aboutUs .whoAreWe .blocks .block .standardText,
.aboutUs .whoAreWe .blocks .block .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .whoAreWe .blocks .block .function,
.aboutUs .whoAreWe .blocks .block .departmentsList li .description,
.departmentsList li .aboutUs .whoAreWe .blocks .block .description,
.aboutUs .whoAreWe .blocks .block .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .aboutUs .whoAreWe .blocks .block .popText {
  color: inherit
}

.aboutUs .whoAreWe .blocks .block--iris-blue {
  background: #0EABE0
}

.aboutUs .whatWeDo .wrapper.first .wrapper {
  position: relative
}

.aboutUs .scopeOfServices {
  overflow: hidden;
  background: url(../img/pattern2.jpg);
  padding: 1.25em 0 3.125em
}

.aboutUs .scopeOfServices .steps {
  padding: 0 4.375em;
  margin: 1.875em 0 3.125em 0;
  position: relative
}

.aboutUs .scopeOfServices .steps::after {
  clear: both;
  content: "";
  display: table
}

@media only screen and (max-width: 640px) {
  .aboutUs .scopeOfServices .steps {
    padding: 0
  }
}

.aboutUs .scopeOfServices .steps:before {
  content: '';
  width: 25.625em;
  height: 14.375em;
  position: absolute;
  top: -1.875em;
  left: 50%;
  margin-left: -12.8125em;
  border: 0.375em solid #3b3b86;
  border-bottom: none
}

@media only screen and (max-width: 1024px) {
  .aboutUs .scopeOfServices .steps:before {
    height: 7.5em
  }
}

.aboutUs .scopeOfServices .steps .step {
  width: 33.33%;
  float: left;
  padding: 1.7857142857em 2.3214285714em;
  font-size: 1.75em;
  line-height: 1.2857142857em;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  color: #fff;
  background: #2cc1f3;
  position: relative;
  overflow: hidden
}

@media only screen and (max-width: 1024px) {
  .aboutUs .scopeOfServices .steps .step {
    font-size: 1.125em
  }
}

@media only screen and (max-width: 800px) {
  .aboutUs .scopeOfServices .steps .step {
    width: 100%;
    float: none;
    text-align: center;
    padding: 1.4285714286em 2.3214285714em !important
  }

  .aboutUs .scopeOfServices .steps .step br {
    display: none
  }
}

.aboutUs .scopeOfServices .steps .step:before {
  content: '';
  position: absolute;
  left: -33px;
  top: 0;
  height: 100%;
  border: 90px solid transparent;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-right-color: transparent;
  -webkit-transform: rotateY(50deg);
  -moz-transform: rotateY(50deg);
  -ms-transform: rotateY(50deg);
  -o-transform: rotateY(50deg);
  transform: rotateY(50deg)
}

@media only screen and (max-width: 1024px) {
  .aboutUs .scopeOfServices .steps .step:before {
    border-width: 0
  }
}

.aboutUs .scopeOfServices .steps .step-2 {
  background: #0eabe0;
  padding-left: 4.1071428571em
}

.aboutUs .scopeOfServices .steps .step-2:before {
  border-left-color: #2cc1f3
}

.aboutUs .scopeOfServices .steps .step-3 {
  background: #0084c2;
  padding-left: 4.1071428571em
}

.aboutUs .scopeOfServices .steps .step-3:before {
  border-left-color: #0eabe0
}

.aboutUs .scopeOfServices .standardText,
.aboutUs .scopeOfServices .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .scopeOfServices .function,
.aboutUs .scopeOfServices .departmentsList li .description,
.departmentsList li .aboutUs .scopeOfServices .description,
.aboutUs .scopeOfServices .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .aboutUs .scopeOfServices .popText {
  font-weight: 300;
  color: #a2a2c8;
  text-align: center
}

.aboutUs .productsCategories {
  background: url(../img/about/categories.jpg) center no-repeat;
  overflow: hidden;
  padding-bottom: 3.125em
}

.aboutUs .productsCategories .columns {
  overflow: hidden
}

.aboutUs .productsCategories .columns .column {
  width: 25%;
  float: left;
  border-left: 1px solid #e5e5e5;
  padding-left: 3.75em
}

.aboutUs .productsCategories .columns .column:first-child {
  padding-left: 0;
  border-left-color: transparent
}

@media only screen and (max-width: 1024px) {
  .aboutUs .productsCategories .columns .column {
    border-color: transparent;
    padding-left: 1.25em
  }
}

@media only screen and (max-width: 800px) {
  .aboutUs .productsCategories .columns .column {
    width: 50%;
    padding-left: 0;
    margin-bottom: 1.875em
  }
}

@media only screen and (max-width: 640px) {
  .aboutUs .productsCategories .columns .column {
    width: 100%
  }
}

.aboutUs .productsCategories .columns .column .standardText,
.aboutUs .productsCategories .columns .column .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .productsCategories .columns .column .function,
.aboutUs .productsCategories .columns .column .departmentsList li .description,
.departmentsList li .aboutUs .productsCategories .columns .column .description,
.aboutUs .productsCategories .columns .column .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .aboutUs .productsCategories .columns .column .popText {
  font-weight: 400
}

.aboutUs .productsCategories .columns .column .standardText ul.styled li,
.aboutUs .productsCategories .columns .column .directors .cards .card .frame .function ul.styled li,
.aboutUs .directors .cards .card .frame .productsCategories .columns .column .function ul.styled li,
.aboutUs .productsCategories .columns .column .departmentsList li .description ul.styled li,
.departmentsList li .aboutUs .productsCategories .columns .column .description ul.styled li,
.aboutUs .productsCategories .columns .column .fancybox-popup .fancybox-skin .popText ul.styled li,
.fancybox-popup .fancybox-skin .aboutUs .productsCategories .columns .column .popText ul.styled li {
  padding-top: 0.0625em;
  padding-bottom: 0.0625em
}

.aboutUs .map {
  background: #1E135E;
  overflow: hidden;
  padding-bottom: 3.4375em
}

.aboutUs .map .wrapper.first .wrapper {
  position: relative
}

.aboutUs .map .legend .head {
  font-size: 1.125em;
  font-weight: 600;
  color: #0eabe0;
  text-align: center;
  border-top: 1px solid #292972;
  padding: 1.6666666667em 0em
}

.aboutUs .map .legend .elements {
  overflow: hidden;
  text-align: center
}

.aboutUs .map .legend .elements .element {
  color: #fff;
  font-size: 0.9375em;
  text-align: left;
  display: inline-block;
  padding: 0.3333333333em 2.3333333333em
}

.aboutUs .map .legend .elements .element .icons {
  font-size: 1.3333333333em;
  margin: 0 -0.25em
}

.aboutUs .map .legend .elements .element .icons .icon {
  margin: 0.25em 0.25em
}

.aboutUs .map .legend .elements .element .icons .icon_sea9 {
  color: #ee6ba8
}

.aboutUs .map .legend .elements .element .icons .icon_airplane105 {
  color: #7edf27
}

.aboutUs .map .legend .elements .element .icons .icon_delivery55 {
  color: #ff8e20
}

.aboutUs .map .legend2 {
  background: #191966;
  float: left;
  color: #fff;
  font-size: 0.9375em;
  padding: 1em 2.3333333333em;
  box-shadow: 0 1px 46px rgba(0, 0, 0, 0.6)
}

@media only screen and (max-width: 640px) {
  .aboutUs .map .legend2 {
    display: none
  }
}

.aboutUs .map .legend2 .line {
  width: 1.6666666667em;
  height: 0.1333333333em;
  background: red;
  display: inline-block;
  margin-right: 1em;
  position: relative;
  top: 1px;
  height: 10px
}

.aboutUs .greatMap {
  height: 680px
}

@media only screen and (max-width: 640px) {
  .aboutUs .greatMap {
    display: none
  }
}

.aboutUs .greatMap .about-greatMap {
  max-width: 1024px;
  height: 100%;
  margin: 0 auto
}

.aboutUs .versholdPresent {
  background: url(../img/about/versholdPresent.jpg) top center no-repeat;
  background-size: cover;
  background-attachment: fixed;
  overflow: hidden;
  padding: 1.875em 0
}

.aboutUs .versholdPresent .left.side,
.aboutUs .versholdPresent .right.side {
  width: 49%
}

@media only screen and (max-width: 640px) {

  .aboutUs .versholdPresent .left.side,
  .aboutUs .versholdPresent .right.side {
    width: 100%;
    float: none;
    overflow: hidden
  }
}

.aboutUs .versholdPresent .standardText,
.aboutUs .versholdPresent .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .versholdPresent .function,
.aboutUs .versholdPresent .departmentsList li .description,
.departmentsList li .aboutUs .versholdPresent .description,
.aboutUs .versholdPresent .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .aboutUs .versholdPresent .popText {
  color: #fff
}

.aboutUs .versholdPresent .standardText ul li,
.aboutUs .versholdPresent .directors .cards .card .frame .function ul li,
.aboutUs .directors .cards .card .frame .versholdPresent .function ul li,
.aboutUs .versholdPresent .departmentsList li .description ul li,
.departmentsList li .aboutUs .versholdPresent .description ul li,
.aboutUs .versholdPresent .fancybox-popup .fancybox-skin .popText ul li,
.fancybox-popup .fancybox-skin .aboutUs .versholdPresent .popText ul li {
  padding-bottom: 2.5em
}

.aboutUs .directors {
  overflow: hidden;
  background: url(../img/about/directors.jpg) no-repeat right center;
  background-size: cover;
  padding-bottom: 2.5em
}

.aboutUs .directors .wrapper.first .wrapper {
  position: relative
}

.aboutUs .directors .cards {
  overflow: hidden;
  padding: 0.5em 
}

.aboutUs .directors .cards-items-tree {
  width: 100%;
  float: left;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  padding-top: 1.4em;
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards-items-tree {
    display: block;
    padding-left: 1.5625em;
    max-width: 450px;
    width: 100%;
    float: none;
    display: block;
    margin: 0 auto;
    padding-top: 1.5625em;
  }
}

.aboutUs .directors .cards-items-tree-single {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  padding-bottom: 3em;
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards-items-tree-single {
    display: block;
    padding-bottom: 25px
  }
}

.aboutUs .directors .cards-items-tree+.lineHelper {
  float: left;
  width: 100%;
  position: relative;
  margin-top: 0.65em;
  margin-bottom: 0.65em
}

.aboutUs .directors .cards-items-tree+.lineHelper:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  height: 1px;
  background: #bababa;
  width: 88%
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards-items-tree+.lineHelper {
    display: none
  }
}

.aboutUs .directors .cards-items-tree:last-child {
  position: relative
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards-items-tree:last-child:before {
    content: "";
    position: absolute;
    height: 120%;
    width: 1px;
    background: #bababa;
    left: 130px;
  }
}

@media only screen and (max-width: 1300px) and (max-width: 450px) {
  .aboutUs .directors .cards-items-tree:last-child:before {
    left: 50px
  }
}


.aboutUs .directors .cards .card {
  float: left;
  width: 33.33%;
  text-align: center;
  padding: 1.5625em
}

.aboutUs .directors .cards .card:nth-child(3n+1) {
  clear: both
}

@media only screen and (max-width: 1024px) {
  .aboutUs .directors .cards .card {
    width: 50%
  }

  .aboutUs .directors .cards .card:nth-child(3n+1) {
    clear: none
  }

  .aboutUs .directors .cards .card:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {
  .aboutUs .directors .cards .card {
    width: 100%
  }
}

.aboutUs .directors .cards .card .frame {
  border: 1px solid #e5e5e5;
  padding: 3.75em 0.9375em 1.5625em
}

@media only screen and (max-width: 640px) {
  .aboutUs .directors .cards .card .frame {
    padding: 3.75em 1.875em 1.5625em
  }
}

.aboutUs .directors .cards .card .frame .image {
  position: relative;
  line-height: 0;
  display: inline-block;
  margin-bottom: 3.4375em
}

.aboutUs .directors .cards .card .frame .image img {
  display: inline-block
}

.aboutUs .directors .cards .card .frame .image:before {
  content: '';
  position: absolute;
  border: 3px solid #40cfff;
  border-bottom: none;
  top: -1.25em;
  left: -1.25em;
  right: -1.25em;
  height: 4.0625em
}

.aboutUs .directors .cards .card .frame .image:after {
  content: '';
  position: absolute;
  border: 3px solid #40cfff;
  border-top: none;
  bottom: -1.25em;
  left: -1.25em;
  right: -1.25em;
  height: 4.0625em
}

.aboutUs .directors .cards .card .frame .name {
  font-size: 1.3125em;
  font-weight: 400;
  color: #403e99
}

.aboutUs .directors .cards .card .frame .function {
  padding-top: 0.3125em
}

.aboutUs .directors .cards .card-tree-item-size-small {
  font-size: 13px
}

.aboutUs .directors .cards .card-tree-item {
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.aboutUs .directors .cards .card-tree-item-size-small {
  width: 12%;
  position: relative
}

.aboutUs .directors .cards .card-tree-item-size-small:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 10px;
  left: 0;
  right: 0;
  top: -20px;
  margin: auto;
  background: #bababa
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards .card-tree-item-size-small {
    float: left;
    width: 100%;
    max-width: 175px;
    clear: both;
    margin-left: 215px;
    text-align: left;
    margin-bottom: 1.5625em;
    text-align: center
  }

  .aboutUs .directors .cards .card-tree-item-size-small:before {
    left: -54px;
    right: auto;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    height: 60px;
    top: 0;
    bottom: 0
  }
}

@media only screen and (max-width: 1300px) and (max-width: 640px) {
  .aboutUs .directors .cards .card-tree-item-size-small {
    width: 48%
  }
}

@media only screen and (max-width: 1300px) and (max-width: 450px) {
  .aboutUs .directors .cards .card-tree-item-size-small {
    width: 100%;
    margin-left: 115px
  }

  .aboutUs .directors .cards .card-tree-item-size-small:before {
    left: -35px
  }
}

.aboutUs .directors .cards .card-tree-item-size-big {
  width: 19.85%
}

.aboutUs .directors .cards .card-tree-item-size-big:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 75px;
  background: #bababa;
  margin: auto;
  left: 0;
  right: 0;
  top: 111%
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards .card-tree-item-size-big:before {
    display: none
  }
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards .card-tree-item-size-big {
    max-width: 217px;
    width: 100%
  }
}

.aboutUs .directors .cards .card-tree-item:nth-child(3n+1) {
  clear: none
}

@media only screen and (max-width: 1300px) {
  .aboutUs .directors .cards .card-tree-item:nth-child(3n+1) {
    clear: both
  }
}

.aboutUs .directors .cards .card-tree-item .frame {
  border: none;
  position: relative;
  border: 0;
  padding: 0;
  height: 100%
}

.aboutUs .directors .cards .card-tree-item .frame:before,
.aboutUs .directors .cards .card-tree-item .frame:after {
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.aboutUs .directors .cards .card-tree-item .frame:before {
  content: '';
  position: absolute;
  border: 3px solid #40cfff;
  border-bottom: none;
  top: -1.5625em;
  left: -1.5625em;
  right: -1.5625em;
  height: 1.875em
}

.aboutUs .directors .cards .card-tree-item .frame:after {
  content: '';
  position: absolute;
  border: 3px solid #40cfff;
  border-top: none;
  bottom: -1.5625em;
  left: -1.5625em;
  right: -1.5625em;
  height: 1.875em
}

.aboutUs .directors .cards .card:hover {
  background: #40cfff none repeat scroll 0% 0%;
  color: #fff
}

.aboutUs .directors .cards .card:hover .frame:before {
  top: -1.875em;
  left: -1.875em;
  right: -1.875em
}

.aboutUs .directors .cards .card:hover .frame:after {
  bottom: -1.875em;
  left: -1.875em;
  right: -1.875em
}

.aboutUs .riskManagement {
  overflow: hidden;
  background: url(../img/about/riskManagement.jpg) center;
  background-attachment: fixed;
  background-size: cover;
  padding-bottom: 3.125em
}

.aboutUs .riskManagement .wrapper.first .wrapper {
  position: relative
}

.aboutUs .riskManagement .heading .desc {
  color: #fff
}

.aboutUs .riskManagement .cards {
  overflow: hidden
}

.aboutUs .riskManagement .cards .card {
  float: left;
  width: 20%;
  padding: 0 0.5em;
  padding-top: 0.625em
}

.aboutUs .riskManagement .cards .card:nth-child(5n+1) {
  clear: both
}

@media only screen and (max-width: 1024px) {
  .aboutUs .riskManagement .cards .card {
    width: 33.33%
  }

  .aboutUs .riskManagement .cards .card:nth-child(5n+1) {
    clear: none
  }

  .aboutUs .riskManagement .cards .card:nth-child(3n+1) {
    clear: both
  }
}

@media only screen and (max-width: 800px) {
  .aboutUs .riskManagement .cards .card {
    width: 50%
  }

  .aboutUs .riskManagement .cards .card:nth-child(3n+1) {
    clear: none
  }

  .aboutUs .riskManagement .cards .card:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {
  .aboutUs .riskManagement .cards .card {
    width: 100%
  }
}

.aboutUs .riskManagement .cards .card .image {
  line-height: 0;
  border-radius: 100%;
  width: 11.875em;
  height: 11.875em;
  position: relative;
  margin: 0 auto
}

.aboutUs .riskManagement .cards .card .image:before {
  content: '';
  position: absolute;
  left: -0.625em;
  right: -0.625em;
  top: -0.625em;
  bottom: -0.625em;
  border: 1px solid #466192;
  border-radius: 100%
}

.aboutUs .riskManagement .cards .card .image img {
  border-radius: 100%
}

.aboutUs .riskManagement .cards .card .image .number {
  position: absolute;
  width: 2.4em;
  height: 2.4em;
  border-radius: 100%;
  text-align: center;
  line-height: 1.7333333333em;
  color: #fff;
  font-size: 0.9375em;
  background: #26b7e8;
  left: 50%;
  margin-left: -1.2em;
  bottom: -1.2em;
  border: 5px solid transparent;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.aboutUs .riskManagement .cards .card .desc {
  color: #fff;
  font-size: 0.9375em;
  padding: 1.875em 0;
  text-align: center
}

.aboutUs .riskManagement .cards .card:hover .image .number {
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  margin-left: 0;
  font-size: 3.0625em;
  line-height: 100%;
  padding: 1.2244897959em 0;
  border-color: #fff
}

.aboutUs .ethicalCommitment {
  overflow: hidden;
  background: url(../img/pattern5.jpg);
  padding: 3.75em 0
}

.aboutUs .ethicalCommitment .wrapper.first .wrapper {
  position: relative
}

.aboutUs .ethicalCommitment .standardText,
.aboutUs .ethicalCommitment .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .ethicalCommitment .function,
.aboutUs .ethicalCommitment .departmentsList li .description,
.departmentsList li .aboutUs .ethicalCommitment .description,
.aboutUs .ethicalCommitment .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .aboutUs .ethicalCommitment .popText {
  font-weight: 400;
  color: #b1b1ef;
  text-align: center
}

.aboutUs .ethicalCommitment .image {
  text-align: center;
  padding: 3.125em 0;
  position: relative
}

.aboutUs .ethicalCommitment .image img {
  display: inline-block
}

@media only screen and (max-width: 800px) {
  .aboutUs .ethicalCommitment .image img {
    display: none
  }
}

.aboutUs .ethicalCommitment .image .texts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden
}

@media only screen and (max-width: 800px) {
  .aboutUs .ethicalCommitment .image .texts {
    position: relative
  }
}

.aboutUs .ethicalCommitment .image .texts .text {
  font-weight: 600;
  font-size: 1em;
  color: #fff;
  position: absolute;
  padding-left: 1.25em
}

@media only screen and (max-width: 1024px) {
  .aboutUs .ethicalCommitment .image .texts .text {
    font-size: 0.875em;
    max-width: 150px;
    text-align: left
  }
}

.aboutUs .ethicalCommitment .image .texts .text:before {
  content: "\00BB";
  color: #26b7e8;
  position: absolute;
  left: 0;
  top: -1px
}

@media only screen and (max-width: 800px) {
  .aboutUs .ethicalCommitment .image .texts .text {
    font-size: 1em;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 50%;
    max-width: 100%;
    float: left;
    padding-top: 0.3125em;
    padding-bottom: 0.3125em
  }

  .aboutUs .ethicalCommitment .image .texts .text:before {
    top: 4px
  }
}

@media only screen and (max-width: 640px) {
  .aboutUs .ethicalCommitment .image .texts .text {
    width: 100%
  }
}

.aboutUs .ethicalCommitment .image .texts .text-pos-1 {
  top: 24%;
  right: 85%
}

.aboutUs .ethicalCommitment .image .texts .text-pos-2 {
  top: 10.5%;
  left: 36%
}

.aboutUs .ethicalCommitment .image .texts .text-pos-3 {
  top: 10.5%;
  left: 66%
}

.aboutUs .ethicalCommitment .image .texts .text-pos-4 {
  top: 45%;
  left: 26%
}

.aboutUs .ethicalCommitment .image .texts .text-pos-5 {
  top: 28%;
  left: 53%
}

.aboutUs .ethicalCommitment .image .texts .text-pos-6 {
  top: 25.8%;
  left: 79%
}

.timeline {
  background: url(../img/about/timeline.jpg) center no-repeat;
  overflow: hidden;
  padding: 0em 0;
  position: relative;
  z-index: 2
}

.timeline .heading.size-35 {
  padding-bottom: 0
}

.timeline .slick-slider {
  margin: 0
}

.timeline .wrapper.first .wrapper {
  position: relative
}

.timeline .arrows {
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

@media only screen and (max-width: 1200px) {
  .timeline .arrows {
    display: none
  }
}

.timeline .arrows .wrapper {
  position: relative;
  height: 100%
}

.timeline .arrows .prev,
.timeline .arrows .next {
  font-size: 3.125em;
  color: #fff;
  text-shadow: 0.4em 0.4em 0.64em rgba(0, 0, 0, 0.35);
  position: absolute;
  z-index: 3;
  top: 50%;
  margin-top: -0.5em;
  cursor: pointer
}

.timeline .arrows .prev.slick-disabled,
.timeline .arrows .next.slick-disabled {
  display: none !important
}

.timeline .arrows .prev {
  left: -2em
}

@media only screen and (max-width: 1200px) {
  .timeline .arrows .prev {
    left: 1em
  }
}

.timeline .arrows .next {
  right: -2em
}

@media only screen and (max-width: 1200px) {
  .timeline .arrows .next {
    right: 1em
  }
}

.timeline .slides {
  position: relative;
  z-index: 2
}

.timeline .slides .slide {
  position: relative;
  overflow: hidden
}

.timeline .slides .slide .year {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0.3em;
  font-size: 12.5em;
  color: #26c7fd;
  font-weight: 600;
  text-shadow: 0.1em 0.1em 0.16em rgba(0, 0, 0, 0.35)
}

@media only screen and (max-width: 640px) {
  .timeline .slides .slide .year {
    font-size: 6.25em
  }
}

@media only screen and (max-width: 450px) {
  .timeline .slides .slide .year {
    font-size: 3.75em;
    width: 100%;
    text-align: center;
    left: 0
  }
}

.timeline .slides .slide .card {
  float: right;
  max-width: 50%;
  margin: 9.375em 9.375em 5em 0;
  position: relative
}

@media only screen and (max-width: 1024px) {
  .timeline .slides .slide .card {
    max-width: 70%;
    margin: 10em 3.125em 4.375em 0
  }
}

@media only screen and (max-width: 800px) {
  .timeline .slides .slide .card {
    max-width: 100%;
    margin: 14.375em 0em 1.25em 0
  }
}

@media only screen and (max-width: 640px) {
  .timeline .slides .slide .card {
    margin: 8.125em 0em 0.625em 0
  }
}

.timeline .slides .slide .card .frame {
  position: absolute;
  top: -1.5625em;
  right: -1.5625em;
  width: 95%;
  height: 75%;
  z-index: 1;
  border: 2px solid #27c4fa
}

@media only screen and (max-width: 640px) {
  .timeline .slides .slide .card .frame {
    display: none
  }
}

.timeline .slides .slide .card .helper {
  background: #fff;
  position: relative;
  z-index: 2;
  padding: 2.5em 7.5em 2.5em 7.5em
}

@media only screen and (max-width: 1300px) {
  .timeline .slides .slide .card .helper {
    padding: 2.5em 6.25em 2.5em 6.25em
  }
}

@media only screen and (max-width: 1024px) {
  .timeline .slides .slide .card .helper {
    padding: 2.5em 3.75em 2.5em 3.75em
  }
}

@media only screen and (max-width: 640px) {
  .timeline .slides .slide .card .helper {
    padding: 2.5em 2.5em 2.5em 2.5em
  }
}

.timeline .slides .slide .card .image {
  margin-bottom: 1.25em;
  position: relative;
  z-index: 2
}

.timeline .slides .slide .card .standardText,
.timeline .slides .slide .aboutUs .directors .cards .card .frame .function,
.aboutUs .directors .cards .timeline .slides .slide .card .frame .function,
.timeline .slides .slide .card .departmentsList li .description,
.departmentsList li .timeline .slides .slide .card .description,
.timeline .slides .slide .card .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .timeline .slides .slide .card .popText {
  position: relative;
  z-index: 2
}

.timeline .pager {
  position: relative;
  z-index: 5;
  overflow: hidden;
  margin-bottom: 1.875em
}

.timeline .pager .slick-slide {
  float: none;
  overflow: visible
}

.timeline .pager .slick-track {
  margin: 0 auto
}

.timeline .pager .elements {
  text-align: center;
  position: relative
}

.timeline .pager .elements:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 3px;
  background: #3c385c;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
  left: 0;
  top: 0.375em
}

.timeline .pager .elements .element {
  color: #fff;
  display: inline-block;
  position: relative;
  cursor: pointer;
  margin: 0 2.1875em 0.625em
}

@media only screen and (max-width: 1024px) {
  .timeline .pager .elements .element {
    margin: 0 1.25em 0.625em
  }
}

.timeline .pager .elements .element:before {
  content: '';
  position: absolute;
  width: 0.75em;
  height: 0.75em;
  top: 0.125em;
  left: 50%;
  margin-left: -0.375em;
  background: #fff;
  border-radius: 100%
}

.timeline .pager .elements .element:after {
  content: '';
  position: absolute;
  width: 1em;
  height: 1em;
  top: 0em;
  left: 50%;
  margin-left: -0.5em;
  border: 5px solid #0ca7db;
  border-radius: 100%;
  opacity: 0;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.timeline .pager .elements .element .name {
  font-size: 0.875em;
  font-weight: 300;
  padding-top: 1.7857142857em
}

.timeline .pager .elements .element.slick-current:after,
.timeline .pager .elements .element.active:after {
  opacity: 1
}

.banner {
  height: 15em;
  margin-top: 5.9375em;
  position: relative;
  z-index: 1;
  background: #18185d
}

@media only screen and (max-width: 1024px) {
  .banner {
    margin-top: 0
  }
}

@media only screen and (max-width: 800px) {
  .banner {
    overflow: hidden
  }
}

.banner .wrapper,
.banner .content,
.banner .frame {
  height: 100%
}

@media only screen and (max-width: 1024px) {
  .banner .content {
    height: auto
  }
}

@media only screen and (max-width: 800px) {
  .banner .content {
    height: 100%
  }
}

.banner .head {
  font-size: 3.5625em;
  text-transform: uppercase;
  font-weight: 100;
  font-family: "Roboto", Arial, sans-serif;
  text-align: center;
  padding-top: 0.350877193em;
  color: #fff
}

.banner .background {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1)
}

.banner .frame {
  position: absolute;
  width: 100%
}

.banner .frame:before {
  content: '';
  width: 25.75em;
  height: 3.125em;
  border: 0.375em solid #40cfff;
  border-bottom: none;
  position: absolute;
  left: 50%;
  margin-left: -12.875em;
  bottom: -1.5625em
}

@media only screen and (max-width: 640px) {
  .banner .frame:before {
    width: 80%;
    left: 10%;
    margin: 0 0
  }
}

html,
body {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

*,
*:before,
*:after {
  outline: none !important;
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit
}

body {
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #000
}

@media only screen and (max-width: 1300px) {
  body {
    font-size: 1.2307692308vw
  }
}

@media only screen and (max-width: 1024px) {
  body {
    font-size: 16px
  }
}

@media only screen and (max-width: 640px) {
  body {
    font-size: 16px
  }
}

.wrapper {
  width: 92%;
  margin: 0px auto
}

.wrapper.first {
  max-width: 1300px;
  width: 100%
}

a {
  color: inherit;
  text-decoration: inherit
}

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

ul.cleared li {
  margin: 0;
  padding: 0
}

.breadcrumb {
  overflow: hidden;
  margin: 2.8125em 0 1.875em 0
}

.breadcrumb ul {
  margin: 0 0em;
  padding: 0;
  list-style: none;
  overflow: hidden
}

.breadcrumb ul li {
  float: left;
  position: relative;
  font-size: 0.875em;
  color: #4b4b82;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300
}

.breadcrumb ul li:before {
  content: '-';
  margin: 0em 0.4285714286em;
  color: #8888b8
}

.breadcrumb ul li:first-child:before {
  display: none
}

.breadcrumb ul li:last-child a {
  color: #34c7f9
}

.breadcrumb ul li a {
  position: relative;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.breadcrumb ul li a:hover {
  color: #34c7f9
}

.btn-standard {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: 400;
  font-size: 0.9375em;
  border: 1px solid #cfd6e5;
  display: inline-block;
  background: transparent;
  text-transform: uppercase;
  color: #292873;
  padding: 0.6666666667em 1.3333333333em;
  line-height: 1.3333333333em;
  letter-spacing: 2px;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.btn-standard .icon {
  font-size: 1.2em;
  line-height: 1em;
  position: relative;
  top: -0.0555555556em;
  color: #29c0f3;
  margin-right: 0.8333333333em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.btn-standard.icon-right .icon {
  margin-right: 0;
  margin-left: 0.8333333333em
}

.btn-standard:hover {
  background: #292873;
  border-color: #292873;
  color: #fff
}

.btn-standard:hover .icon {
  color: #fff
}

.btn-standard.invert {
  color: #fff;
  border-color: #2d2d6e
}

.btn-standard.invert:hover {
  background: #fff;
  border-color: #fff;
  color: #2d2d6e
}

.btn-standard.invert:hover .icon {
  color: #2d2d6e
}

.btn-standard.color-blue {
  color: #2fc4f6;
  border-color: #2fc4f6
}

.btn-standard.color-blue .icon {
  color: #2fc4f6
}

.btn-standard.color-blue:hover {
  background: #2fc4f6;
  color: #fff
}

.btn-standard.color-blue:hover .icon {
  color: #fff
}

.btn-standard.color-blue.color-invert {
  background: #2fc4f6;
  color: #fff
}

.btn-standard.color-blue.color-invert .icon {
  color: #fff
}

.btn-standard.color-blue.color-invert:hover {
  background: transparent;
  color: #2fc4f6
}

.btn-standard.color-blue.color-invert:hover .icon {
  color: #2fc4f6
}

.btn-standard.color-grey {
  color: #b9c1d3;
  border-color: #b9c1d3
}

.btn-standard.color-grey .icon {
  color: #b9c1d3
}

.btn-standard.color-grey:hover {
  background: #b9c1d3;
  color: #fff
}

.btn-standard.color-grey:hover .icon {
  color: #fff
}

.btn-standard.color-grey.color-invert {
  background: #b9c1d3;
  color: #fff
}

.btn-standard.color-grey.color-invert .icon {
  color: #fff
}

.btn-standard.color-grey.color-invert:hover {
  background: transparent;
  color: #b9c1d3
}

.btn-standard.color-grey.color-invert:hover .icon {
  color: #b9c1d3
}

.btn-standard.color-white {
  color: #fff;
  border-color: #fff
}

.btn-standard.color-white .icon {
  color: #27bef2
}

.btn-standard.color-white:hover {
  background: #fff;
  color: #292972
}

.btn-standard.color-white:hover .icon {
  color: #292972
}

.btn-standard.color-white.color-invert {
  background: #fff;
  color: #292972
}

.btn-standard.color-white.color-invert .icon {
  color: #27bef2
}

.btn-standard.color-white.color-invert:hover {
  background: #292972;
  color: #fff;
  border-color: #292972
}

.btn-standard.color-white.color-invert:hover .icon {
  color: #2fc4f6
}

.careers {
  background: url(../img/pattern3.jpg);
  overflow: hidden
}

.careers .wrapper.first .wrapper {
  position: relative
}

.careers.step-2 {
  padding-top: 5.9375em
}

.careers .buttons.align-center {
  text-align: center
}

.careers .tabs {
  margin-bottom: 5.3125em
}

.careers .tabs ul.navigationBar {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden
}

.careers .tabs ul.navigationBar li {
  float: left;
  width: 33.33%;
  margin: 0 0 0.9375em 0
}

@media only screen and (max-width: 450px) {
  .careers .tabs ul.navigationBar li {
    width: 100%;
    float: none;
    margin-bottom: 0
  }
}

.careers .tabs ul.navigationBar li.ui-tabs-active a,
.careers .tabs ul.navigationBar li.active a {
  background: #18185d
}

.careers .tabs ul.navigationBar li a {
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-size: 0.9375em;
  background: #34c7f9;
  color: #fff;
  padding: 1em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.careers .tabs ul.navigationBar li a:hover {
  background: #18185d
}

.careers .tabs .whiteCard {
  background: #fff;
  padding: 3.125em 4.0625em;
  margin-bottom: 1.25em
}

@media only screen and (max-width: 800px) {
  .careers .tabs .whiteCard {
    padding: 3.125em 1.875em
  }
}

.careers .application {
  overflow: hidden;
  background: #fff;
  padding-bottom: 5em
}

.careers .application.border-bottom {
  border: 1px solid #e5e5e5
}

@media only screen and (max-width: 800px) {

  .careers .application table,
  .careers .application tbody,
  .careers .application tr,
  .careers .application td {
    display: block;
    width: 100%
  }
}

@media only screen and (max-width: 450px) {
  .careers .application .file-input .value {
    display: block;
    width: 100%;
    float: none
  }
}

.careers .employees {
  overflow: hidden;
  padding: 6.25em 0;
  background: #10aee3 url(../img/pattern4.jpg);
  position: relative;
  z-index: 1
}

@media only screen and (max-width: 1024px) {
  .careers .employees {
    padding-bottom: 3.125em
  }
}

.careers .employees .employeesList {
  margin: 0;
  padding: 0;
  list-style: none
}

.careers .employees .employeesList li {
  float: left;
  width: 20%;
  position: relative
}

.careers .employees .employeesList li:nth-child(5n+1) {
  clear: both
}

@media only screen and (max-width: 1024px) {
  .careers .employees .employeesList li {
    width: 33.33%;
    margin-bottom: 3.125em
  }

  .careers .employees .employeesList li:nth-child(5n+1) {
    clear: none
  }

  .careers .employees .employeesList li:nth-child(3n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {
  .careers .employees .employeesList li {
    width: 50%;
    margin-bottom: 3.125em
  }

  .careers .employees .employeesList li:nth-child(3n+1) {
    clear: none
  }

  .careers .employees .employeesList li:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 450px) {
  .careers .employees .employeesList li {
    width: 100%;
    margin-bottom: 3.125em
  }

  .careers .employees .employeesList li:nth-child(2n+1) {
    clear: none
  }

  .careers .employees .employeesList li:nth-child(1n+1) {
    clear: both
  }
}

.careers .employees .employeesList li .img {
  line-height: 0;
  display: block;
  position: relative;
  text-align: center;
  z-index: 2;
  overflow: hidden;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 800px) {
  .careers .employees .employeesList li .img {
    padding-left: 1.5625em;
    padding-right: 1.5625em
  }
}

.careers .employees .employeesList li .img:before {
  content: '';
  position: absolute;
  z-index: 2;
  top: -0.125em;
  left: -0.125em;
  right: -0.125em;
  bottom: -0.125em;
  background: rgba(41, 40, 115, 0.8);
  opacity: 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.careers .employees .employeesList li .card {
  overflow: hidden;
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  top: 100%;
  text-align: left;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 1024px) {
  .careers .employees .employeesList li .card {
    position: relative;
    display: block
  }
}

.careers .employees .employeesList li .card .title {
  text-align: left;
  font-size: 1.1875em;
  display: block;
  padding: 0.4736842105em 1.3157894737em;
  font-weight: 600;
  color: #fff;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 1024px) {
  .careers .employees .employeesList li .card .title {
    padding-top: 1.0526315789em
  }
}

.careers .employees .employeesList li .card .description {
  display: block;
  font-size: 0.875em;
  font-weight: 300;
  line-height: 1.7142857143em;
  color: #acace1;
  opacity: 0;
  padding: 0 1.7857142857em;
  padding-top: 1.7857142857em;
  -webkit-transform: translateY(10px);
  -moz-transform: translateY(10px);
  -ms-transform: translateY(10px);
  -o-transform: translateY(10px);
  transform: translateY(10px);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 1024px) {
  .careers .employees .employeesList li .card .description {
    opacity: 1;
    font-size: 0.9375em;
    color: #fff;
    padding-top: 0em;
    padding-bottom: 2em
  }
}

.careers .employees .employeesList li .card .icons {
  display: block;
  font-size: 2em;
  opacity: 0;
  line-height: 1em;
  -webkit-transform: translateY(0.78125em);
  -moz-transform: translateY(0.78125em);
  -ms-transform: translateY(0.78125em);
  -o-transform: translateY(0.78125em);
  transform: translateY(0.78125em);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.careers .employees .employeesList li:hover {
  z-index: 4
}

@media only screen and (min-width: 1025px) {
  .careers .employees .employeesList li:hover .img:before {
    opacity: 1
  }

  .careers .employees .employeesList li:hover .card {
    top: 0;
    margin-top: 0
  }

  .careers .employees .employeesList li:hover .card .title {
    background: transparent;
    font-size: 1.1875em;
    padding-top: 0em;
    padding-bottom: 0em
  }

  .careers .employees .employeesList li:hover .card .description {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
  }

  .careers .employees .employeesList li:hover .card .icons {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
  }
}

.careers .accordion {
  margin: 0.9375em 0;
  overflow: hidden
}

.careers .accordion .card {
  border: 1px solid #cfd6e5;
  margin: 0.9375em 0;
  padding: 0 1.5625em
}

.careers .accordion .card .head {
  font-size: 0.9375em;
  text-transform: uppercase;
  color: #292873;
  font-weight: 400;
  letter-spacing: 0.1333333333em;
  padding: 0.8666666667em 4em 0.8666666667em 0;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.careers .accordion .card .head:before {
  font-family: 'icons';
  font-size: 1.2em;
  color: #19bbf2;
  position: absolute;
  right: 0.2777777778em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.careers .accordion .card .head.ui-state-active {
  padding: 1.6666666667em 4em 1.6666666667em 0
}

.careers .accordion .card .head.ui-state-active:before {
  -webkit-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  transform: rotate(-180deg)
}

.careers .accordion .card .details {
  font-size: 0.875em;
  padding-bottom: 1.7857142857em
}

.careers .buttons.align-right {
  text-align: right
}

.careers .buttons.align-right a {
  margin-left: 0.9375em;
  margin-bottom: 0.9375em
}

@media only screen and (max-width: 640px) {
  .careers .buttons.align-right a {
    width: 100%;
    display: block;
    text-align: center;
    margin-left: 0
  }
}

.careers .departmentSection {
  background: #fff;
  border-bottom: 0.0625em solid #e5e5e5;
  padding-top: 3.125em
}

.careers .departmentSection .heading {
  margin-bottom: 3.125em
}

.contact {
  padding: 6.25em 0;
  border-bottom: 1px solid #e5e5e5
}

@media only screen and (max-width: 800px) {
  .contact {
    padding: 3.125em 0
  }
}

.contact .businessCards {
  margin-top: 4.6875em
}

.contact .businessCard {
  overflow: hidden;
  margin-bottom: 1.5625em
}

.contact .businessCard .heading {
  text-align: left
}

.contact .businessCard .left.side {
  width: 25%
}

@media only screen and (max-width: 1024px) {
  .contact .businessCard .left.side {
    width: 100%;
    float: left;
    overflow: hidden;
    text-align: center;
    clear: both
  }

  .contact .businessCard .left.side .heading {
    text-align: center
  }
}

.contact .businessCard .right.side {
  position: relative;
  width: 72%;
  height: 17.1875em
}

@media only screen and (max-width: 1024px) {
  .contact .businessCard .right.side {
    width: 100%;
    float: none;
    overflow: hidden;
    margin-top: 1.5625em
  }
}

.contact .businessCard .right.side .contactMap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%
}

@media only screen and (max-width: 800px) {

  .contact form table,
  .contact form tbody,
  .contact form tr,
  .contact form td {
    display: block;
    width: 100%
  }
}

.customers .greatMap {
  background: #1a195e;
  height: 680px
}

@media only screen and (max-width: 640px) {
  .customers .greatMap {
    display: none
  }
}

.customers .greatMap .customers-greatMap {
  max-width: 1024px;
  height: 100%;
  margin: 0 auto
}

.customers .greatMap .customers-greatMap .gm-style-iw {
  width: 96px !important;
  height: 96px !important;
  border-radius: 100% !important;
  top: auto !important;
  bottom: -9px;
  left: 26px !important
}

.customers .greatMap .customers-greatMap .gm-style-iw .logotype {
  border: 1px solid #52d4ff;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  padding: 9px;
  cursor: pointer
}

.customers .greatMap .customers-greatMap .gm-style-iw>div {
  max-width: 100% !important;
  max-height: 100% !important;
  overflow: visible !important;
  display: block !important;
  position: relative;
  width: 100%;
  height: 100%
}

.customers .greatMap .customers-greatMap .gm-style-iw>div>div {
  background: #fff;
  padding: 6px;
  width: 100%;
  height: 100%
}

.customers .customersList {
  overflow: hidden
}

.customers .customersList .customer {
  overflow: hidden
}

.customers .customersList .customer .head {
  padding: 2.5em 0;
  height: 14.375em;
  position: relative;
  background-color: #b6ebef;
  -webkit-transition: 0.15s;
  -moz-transition: 0.15s;
  transition: 0.15s;
  -webkit-transition-delay: 0.15s;
  -moz-transition-delay: 0.15s;
  transition-delay: 0.15s
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .head {
    height: 18.75em;
    text-align: center
  }
}

.customers .customersList .customer .head.ui-state-active {
  margin-top: -14.375em
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .head.ui-state-active {
    margin-top: -18.75em
  }
}

.customers .customersList .customer .head .background {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.4;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.customers .customersList .customer .head .wrapper {
  position: relative;
  z-index: 2;
  height: 100%
}

.customers .customersList .customer .head .logotype {
  width: 14.6875em;
  height: 100%;
  background: #fff;
  padding: 1.875em;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 1px rgba(2, 2, 2, 0.24);
  float: left
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .head .logotype {
    float: none;
    height: 9.375em;
    width: 100%
  }
}

.customers .customersList .customer .head .logotype .image {
  position: absolute;
  top: 1.875em;
  left: 1.875em;
  bottom: 1.875em;
  right: 1.875em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.customers .customersList .customer .head .buttons {
  height: 100%;
  float: left;
  margin: 0 3.125em
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .head .buttons {
    float: none;
    overflow: hidden;
    height: auto;
    width: 100%;
    margin: 2.1875em 0
  }
}

.customers .customersList .customer .head:hover .background {
  opacity: 0.7
}

.customers .customersList .customer .body {
  background: #fff;
  padding: 5.625em 0;
  overflow: hidden;
  -webkit-transition: 0.15s;
  -moz-transition: 0.15s;
  transition: 0.15s;
  -webkit-transition-property: margin-top;
  -moz-transition-property: margin-top;
  transition-property: margin-top
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .body {
    padding: 2.8125em 0
  }
}

.customers .customersList .customer .body .wrapper {
  position: relative
}

.customers .customersList .customer .body .close {
  position: absolute;
  width: 0.6875em;
  height: 0.6875em;
  top: 0;
  right: -1.5625em;
  cursor: pointer;
  background: url(../img/customers/close.png) no-repeat
}

@media only screen and (max-width: 800px) {
  .customers .customersList .customer .body .close {
    right: 0
  }
}

.customers .customersList .customer .body .left.side {
  width: 32%
}

@media only screen and (max-width: 800px) {
  .customers .customersList .customer .body .left.side {
    width: 100%;
    float: none;
    overflow: hidden;
    margin-bottom: 2.5em;
    text-align: center
  }
}

.customers .customersList .customer .body .right.side {
  width: 65%
}

@media only screen and (max-width: 800px) {
  .customers .customersList .customer .body .right.side {
    width: 100%;
    float: none;
    overflow: hidden;
    margin-top: 2.5em
  }
}

.customers .customersList .customer .body .heading {
  text-align: left
}

@media only screen and (max-width: 800px) {
  .customers .customersList .customer .body .heading {
    text-align: center
  }
}

.customers .customersList .customer .body .logotype {
  width: 14.6875em;
  height: 9.375em;
  background: #fff;
  padding: 1.875em;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 1px rgba(2, 2, 2, 0.24);
  margin-bottom: 2.5em
}

@media only screen and (max-width: 800px) {
  .customers .customersList .customer .body .logotype {
    margin-left: auto;
    margin-right: auto
  }
}

@media only screen and (max-width: 640px) {
  .customers .customersList .customer .body .logotype {
    margin-bottom: 0.625em
  }
}

.customers .customersList .customer .body .logotype .image {
  position: absolute;
  top: 1.875em;
  left: 1.875em;
  bottom: 1.875em;
  right: 1.875em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain
}

.departmentsList {
  margin: -2.5em -2.1875em 0 -2.1875em;
  padding: 0;
  list-style: none;
  overflow: hidden
}

.departmentsList li {
  float: left;
  width: 33.33%;
  overflow: hidden;
  margin: 2.5em 0;
  padding: 0 2.1875em
}

.departmentsList li:nth-child(3n+1) {
  clear: both
}

@media only screen and (max-width: 640px) {
  .departmentsList li {
    width: 50%
  }

  .departmentsList li:nth-child(3n+1) {
    clear: none
  }

  .departmentsList li:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 450px) {
  .departmentsList li {
    width: 100%;
    float: none;
    overflow: hidden
  }

  .departmentsList li:nth-child(2n+1) {
    clear: none
  }
}

.departmentsList li a {
  display: block;
  overflow: hidden
}

.departmentsList li .top {
  display: block;
  position: relative
}

.departmentsList li .top::after {
  clear: both;
  content: "";
  display: table
}

@media only screen and (max-width: 800px) {
  .departmentsList li .top {
    text-align: center
  }
}

.departmentsList li .top .image {
  width: 1.8181818182em;
  height: 1.8181818182em;
  line-height: 1.8181818182em;
  font-size: 3.4375em;
  display: block;
  text-align: center;
  float: left;
  color: #403e99;
  position: relative;
  margin-right: 0.6363636364em
}

@media only screen and (max-width: 800px) {
  .departmentsList li .top .image {
    margin: 0 auto;
    margin-bottom: 0.3636363636em;
    float: none
  }
}

.departmentsList li .top .image .number {
  font-size: 11px;
  position: absolute;
  width: 25px;
  height: 25px;
  border-radius: 100%;
  background: #26b7e8;
  line-height: 25px;
  color: #fff;
  font-weight: 600;
  top: -13px;
  left: -13px
}

.departmentsList li .top .image .icon {
  position: relative;
  top: -0.1090909091em
}

.departmentsList li .top .image:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.1818181818em;
  border: 2px solid #dfe5f1;
  border-bottom: none
}

.departmentsList li .top .image:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.1818181818em;
  border: 2px solid #dfe5f1;
  border-top: none
}

.departmentsList li .top .title {
  width: 100%;
  display: block;
  color: #525f70;
  font-weight: 600;
  font-size: 1.0625em;
  line-height: 1.4705882353em;
  position: absolute;
  left: 7.6470588235em;
  height: 100%
}

@media only screen and (max-width: 800px) {
  .departmentsList li .top .title {
    position: relative;
    left: 0
  }
}

.departmentsList li .description {
  display: block;
  margin-top: 1.875em;
  text-align: justify
}

.departmentsList-columns-helper li {
  width: 25%
}

.departmentsList-columns-helper li:nth-child(3n+1) {
  clear: none
}

@media only screen and (max-width: 1024px) {
  .departmentsList-columns-helper li {
    width: 50%
  }
}

@media only screen and (max-width: 450px) {
  .departmentsList-columns-helper li {
    width: 100%
  }
}

.departmentsList.color-scheme-2 li .top .image {
  color: #0eabe0
}

.departmentsList.color-scheme-2 li .top .image:before,
.departmentsList.color-scheme-2 li .top .image:after {
  border-color: #4846a8
}

.departmentsList.color-scheme-2 li .top .title {
  color: #fff
}

.departmentsList.color-scheme-2 li .description {
  color: #9c9cd1
}

.floatingLinks {
  position: fixed;
  z-index: 999;
  top: 43%;
  right: 0;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-transform-origin: right bottom;
  -moz-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  -o-transform-origin: right bottom;
  transform-origin: right bottom
}

@media only screen and (max-width: 1200px) {
  .floatingLinks {
    display: none
  }
}

.floatingLinks a {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1em;
  text-transform: uppercase;
  font-weight: 500;
  color: #fff;
  background: #31c5f7;
  display: inline-block;
  padding: 0.625em 0.9375em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
}

.floatingLinks a:hover {
  background: #292873
}

.floatingSectionMenu {
  position: fixed;
  z-index: 2;
  top: 0;
  bottom: 0;
  right: 0;
  width: 2.8125em;
  background: #fff;
  box-shadow: 0 5px 5px rgba(3, 3, 3, 0.26);
}

@media only screen and (max-width: 1200px) {
  .floatingSectionMenu {
    display: none
  }
}

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

.floatingSectionMenu ul li {
  text-align: center;
  line-height: 0
}

.floatingSectionMenu ul li a {
  display: inline-block;
  width: 0.625em;
  height: 0.625em;
  background: #dde3f0;
  border-radius: 100%;
  margin: 0.625em 0;
  position: relative;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.floatingSectionMenu ul li a span {
  position: absolute;
  right: 0.7692307692em;
  top: 50%;
  margin-top: -1.0769230769em;
  white-space: nowrap;
  background: #fff;
  font-size: 0.8125em;
  line-height: 1.2307692308em;
  display: block;
  text-transform: uppercase;
  padding: 0.3846153846em 0.7692307692em;
  border-radius: 3px;
  border: 1px solid #34c7f9;
  color: #292873;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.floatingSectionMenu ul li a span:before {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-left-color: #34c7f9;
  border-width: 7px;
  margin-top: -7px
}

.floatingSectionMenu ul li.active a {
  background: #34c7f9
}

.floatingSectionMenu ul li a:hover span {
  right: 1.5384615385em;
  visibility: visible;
  opacity: 1
}

.footer {
  overflow: hidden;
  padding: 1.875em 0;
  color: #707d8f;
  background: #fff
}

.footer .left.side {
  font-size: 0.875em;
  line-height: 2.3571428571em
}

.footer .left.side a {
  color: #0eabe0
}

.footer .left.side .madeBy {
  margin-top: 1em
}

.footer .left.side .madeBy a {
  margin-left: 0.625em
}

@media only screen and (max-width: 640px) {
  .footer .left.side {
    float: none;
    overflow: hidden;
    width: 100%;
    text-align: center
  }
}

@media only screen and (max-width: 640px) {
  .footer .right.side {
    float: none;
    overflow: hidden;
    width: 100%;
    text-align: center;
    margin-top: 1em
  }
}

.footer .right.side a.goTop {
  background: #fff;
  color: #707d8f;
  text-transform: uppercase;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  border: 1px solid #cfd6e7;
  border-radius: 100px;
  display: block;
  font-size: 0.8125em;
  padding: 0.6153846154em 3.4615384615em 0.6153846154em 1.5384615385em;
  position: relative;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {
  .footer .right.side a.goTop {
    border-color: transparent
  }
}

@media only screen and (max-width: 640px) {
  .footer .right.side a.goTop {
    display: inline-block
  }
}

.footer .right.side a.goTop:hover {
  background: #0eabe0;
  border-color: #0eabe0;
  color: #fff
}

.footer .right.side a.goTop .icon {
  position: absolute;
  background: #0eabe0;
  font-size: 0.4615384615em;
  width: 4em;
  height: 4em;
  line-height: 4em;
  border-radius: 100%;
  color: #fff;
  text-align: center;
  right: 1.1666666667em;
  top: 50%;
  margin-top: -2em
}

form {
  position: relative
}

form.border {
  border: 1px solid #232365;
  padding: 3.125em 1.5625em 3.125em
}

form.border.color-set-2 {
  border-color: #e5e5e5
}

form input:not([type="file"]),
form textarea {
  margin: 0;
  padding: 0;
  border: none;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1.25em;
  color: #a6a6cc;
  font-weight: 300;
  background: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none
}

form textarea {
  overflow: hidden;
  resize: none
}

form table.fixed {
  width: 100%;
  table-layout: fixed
}

form table.fixed td {
  padding: 0 1.5625em
}

form table.fixed td.align-center {
  text-align: center
}

form table.fixed .buttons {
  text-align: center
}

form span.file-input {
  display: block;
  width: 100%;
  margin-bottom: 2.5em
}

form span.file-input.smaller {
  font-size: 0.875em
}

form span.file-input label {
  display: block;
  width: 100%;
  overflow: hidden
}

form span.file-input label .value {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1.25em;
  color: #a6a6cc;
  font-weight: 300;
  padding: 0 1em;
  height: 2.5em;
  line-height: 2.5em;
  display: block;
  float: left;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

form span.file-input label .file {
  line-height: 3.125em;
  display: block;
  overflow: hidden
}

form span.file-input label .file input[type=file] {
  width: 100%
}

form span.file-input label .file .pseudoInput {
  border: 2px solid #dbdbdb;
  width: 100%;
  position: relative;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1.25em;
  color: #a6a6cc;
  font-weight: 300;
  padding: 0 2.75em 0 1em;
  height: 2.5em;
  line-height: 2.5em;
  display: block;
  float: left;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

form span.file-input label .file .pseudoInput:hover {
  border-color: #0eabe0
}

form span.file-input label .file .pseudoInput:before {
  font-family: 'icons';
  position: absolute;
  font-size: 1em;
  color: #29c0f3;
  right: 1em
}

form span.file-input.color-set-2 label .value {
  color: #697587
}

form span.file-input.color-set-2 label .file .pseudoInput {
  color: #697587
}

form span.file-input.color-set-2 label .file .pseudoInput:hover {
  border-color: #0eabe0
}

form span.input {
  display: inline-block;
  width: 100%;
  position: relative
}

form span.input.smaller {
  font-size: 0.875em
}

form span.input label {
  display: block;
  position: relative
}

form span.input label input,
form span.input label textarea {
  display: block;
  width: 100%;
  padding: 0 1em;
  height: 2.5em;
  line-height: 2.5em;
  margin-bottom: 2.5em;
  border-bottom: 2px solid #3d3d8b;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

form span.input label textarea {
  height: auto;
  max-height: 2.5em;
  line-height: normal;
  padding-top: 0.6em;
  padding-bottom: 0.6em
}

form span.input label .label {
  position: absolute;
  top: 0;
  width: 100%
}

form span.input label .label .value {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1.25em;
  color: #a6a6cc;
  font-weight: 300;
  padding: 0 1em;
  height: 2.5em;
  line-height: 2.5em;
  display: block;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

form span.input label .label:before {
  content: '';
  position: absolute;
  top: 15%;
  height: 20%;
  left: 0;
  width: 100%;
  border: 2px solid #3d3d8b;
  border-bottom: none;
  opacity: 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

form span.input label .label:after {
  content: '';
  position: absolute;
  bottom: 15%;
  height: 20%;
  left: 0;
  width: 100%;
  border: 2px solid #3d3d8b;
  border-top: none;
  opacity: 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

form span.input.input--filled label input,
form span.input.input--filled label textarea {
  border-color: transparent
}

form span.input.input--filled label .label {
  height: 3.125em
}

form span.input.input--filled label .label .value {
  color: #fff;
  font-size: 1.0625em;
  height: 2.9411764706em;
  line-height: 2.9411764706em;
  -webkit-transform: translate(-2px, -75%);
  -moz-transform: translate(-2px, -75%);
  -ms-transform: translate(-2px, -75%);
  -o-transform: translate(-2px, -75%);
  transform: translate(-2px, -75%)
}

form span.input.input--filled label .label:before,
form span.input.input--filled label .label:after {
  border-color: #0eabe0;
  opacity: 1
}

form span.input.input--filled label .label:before {
  top: 0
}

form span.input.input--filled label .label:after {
  bottom: 0
}

form span.input.color-set-2 input,
form span.input.color-set-2 textarea {
  border-color: #0eabe0
}

form span.input.color-set-2 label .label .value {
  color: #697587
}

form span.input.color-set-2 label .label:before {
  border-color: #0eabe0
}

form .buttons.form-on-line {
  position: absolute;
  left: 0;
  right: 0;
  margin-top: 1.75em
}

form .buttons.form-on-line .btn-standard {
  position: relative;
  background-color: #fff
}

form .buttons.form-on-line .btn-standard:hover {
  background-color: #292873
}

form .buttons.form-on-line .btn-standard:before {
  content: '';
  position: absolute;
  background: #fff;
  left: 0;
  margin-left: -2.25em;
  width: 2.1875em;
  top: 0;
  bottom: 0
}

form .buttons.form-on-line .btn-standard:after {
  content: '';
  position: absolute;
  background: #fff;
  right: 0;
  margin-right: -2.25em;
  width: 2.1875em;
  top: 0;
  bottom: 0
}

.header {
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.8);
  background: #fff;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 5.9375em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {
  .header {
    position: relative
  }
}

@media only screen and (max-width: 800px) {
  .header .hamburger {
    overflow: hidden;
    right: 0;
    padding: 0.875em 0.5em;
    background: #191851;
    cursor: pointer;
    position: absolute;
    display: block;
    top: 1.5625em;
    right: 0
  }

  .header .hamburger .burger {
    position: relative;
    margin-top: 0.375em;
    margin-bottom: 0.375em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
  }

  .header .hamburger .burger,
  .header .hamburger .burger::before,
  .header .hamburger .burger::after {
    display: block;
    width: 1.875em;
    height: 0.1875em;
    background-color: #fff;
    -webkit-transition-property: background-color, -webkit-transform;
    -moz-transition-property: background-color, -moz-transform;
    -o-transition-property: background-color, -o-transform;
    transition-property: background-color, transform;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s
  }

  .header .hamburger .burger::before,
  .header .hamburger .burger::after {
    position: absolute;
    content: ""
  }

  .header .hamburger .burger::before {
    top: -0.375em
  }

  .header .hamburger .burger::after {
    top: 0.375em
  }

  .menuOpened .header .hamburger .burger {
    background-color: transparent
  }

  .menuOpened .header .hamburger .burger::before {
    -webkit-transform: translateY(0.375em) rotate(45deg);
    -moz-transform: translateY(0.375em) rotate(45deg);
    -ms-transform: translateY(0.375em) rotate(45deg);
    -o-transform: translateY(0.375em) rotate(45deg);
    transform: translateY(0.375em) rotate(45deg)
  }

  .menuOpened .header .hamburger .burger::after {
    -webkit-transform: translateY(-0.375em) rotate(-45deg);
    -moz-transform: translateY(-0.375em) rotate(-45deg);
    -ms-transform: translateY(-0.375em) rotate(-45deg);
    -o-transform: translateY(-0.375em) rotate(-45deg);
    transform: translateY(-0.375em) rotate(-45deg)
  }
}

.header .left.side,
.header .right.side {
  overflow: hidden;
  position: relative
}

@media only screen and (max-width: 800px) {
  .header .left.side {
    position: absolute;
    z-index: 2
  }
}

@media only screen and (max-width: 800px) {
  .header .right.side {
    background: red;
    width: 100%;
    float: none;
    overflow: visible
  }
}

.header a.logotype {
  line-height: 0;
  display: block;
  overflow: hidden
}

.header a.logotype img {
  width: 5.625em;
  float: left;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.header .menu {
  float: left;
  margin: 0 1.25em
}

@media only screen and (max-width: 1024px) {
  .header .menu {
    margin: 3em 0 0 0;
    float: none
  }
}

@media only screen and (max-width: 800px) {
  .header .menu {
    background: #191851;
    display: none
  }
}

.header .menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden
}

@media only screen and (max-width: 800px) {
  .header .menu ul {
    padding: 1.25em 0
  }
}

.header .menu ul li {
  float: left;
  position: relative
}

@media only screen and (max-width: 800px) {
  .header .menu ul li {
    float: none
  }
}

.header .menu ul li:before {
  content: '';
  position: absolute;
  left: -1px;
  top: 50%;
  margin-top: -0.3125em;
  width: 1px;
  height: 0.625em;
  background: #0eabe0
}

@media only screen and (max-width: 1024px) {
  .header .menu ul li:before {
    display: none
  }
}

.header .menu ul li:first-child:before {
  background: transparent
}

.header .menu ul li a {
  display: block;
  text-transform: uppercase;
  font-family: "Roboto", Arial, sans-serif;
  color: #707d8f;
  font-weight: 300;
  font-size: 0.875em;
  line-height: 6.7857142857em;
  padding: 0 2.1428571429em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {
  .header .menu ul li a {
    padding: 1.0714285714em 0.9285714286em;
    line-height: normal
  }
}

@media only screen and (max-width: 800px) {
  .header .menu ul li a {
    text-align: center;
    color: #fff
  }
}

.header .langs {
  float: left;
  margin: 0 0 0 1.25em;
  padding: 1.8125em 0;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {
  .header .langs {
    margin: 0;
    padding: 0.375em 0;
    position: absolute;
    top: 0;
    right: 0
  }
}

@media only screen and (max-width: 800px) {
  .header .langs {
    top: 1.5em;
    right: 5em
  }
}

.header .langs select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  margin: 0;
  float: left;
  font-size: 0.8125em;
  background: #fff url(../img/langBackground.png) no-repeat right 0.6153846154em center;
  font-weight: 300;
  font-family: "Roboto", Arial, sans-serif;
  text-transform: uppercase;
  color: #707d8f;
  border: 1px solid #d0d7e8;
  padding: 0.6153846154em 3.4615384615em 0.6153846154em 1.5384615385em;
  border-radius: 100px;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {
  .header .langs select {
    border-color: transparent !important
  }
}

.header .langs select:hover {
  background: #0eabe0;
  border-color: #0eabe0;
  color: #fff;
}

.header .langs select:focus {
  background-color: #0eabe0;
  border-color: #0eabe0;
  color: #fff
}

.header.fixed {
  height: 3.4375em
}

.header.fixed a.logotype img {
  width: 3.3125em
}

.header.fixed .menu ul li a {
  line-height: 3.9285714286em
}

.header.fixed .langs {
  padding: 0.625em 0
}

.heading {
  text-align: center;
  padding: 5em 0
}

@media only screen and (max-width: 1024px) {
  .heading {
    padding: 3.75em 0
  }
}

.heading .head,
.heading .head2 {
  font-family: "Roboto", Arial, sans-serif;
  text-transform: uppercase;
  font-weight: 300;
  letter-spacing: 0.1875em
}

.heading .head b,
.heading .head2 b {
  font-weight: 500
}

.heading .desc {
  padding-top: 1.25em;
  padding-bottom: 1.25em
}

.heading .desc span {
  font-weight: 300;
  line-height: 1.6875em
}

.heading.size-55 .head,
.heading.size-55 .head2 {
  font-size: 3.4375em;
  letter-spacing: 0.0545454545em
}

@media only screen and (max-width: 1024px) {

  .heading.size-55 .head,
  .heading.size-55 .head2 {
    font-size: 2.5em;
    letter-spacing: 0.1em
  }
}

.heading.size-55 .desc {
  font-size: 1em;
  line-height: 1.6875em
}

@media only screen and (max-width: 1024px) {
  .heading.size-55 .desc {
    font-size: 0.9375em;
    line-height: 1.6666666667em
  }
}

.heading.size-35 {
  padding: 3.125em 0
}

.heading.size-35 .head,
.heading.size-35 .head2 {
  font-size: 2.1875em;
  letter-spacing: 0.0285714286em;
  text-transform: none
}

.heading.size-35 .desc {
  font-size: 0.9375em;
  line-height: 1.7333333333em
}

.heading.size-40 {
  padding: 3.125em 0
}

.heading.size-40 .head,
.heading.size-40 .head2 {
  font-size: 2.5em;
  letter-spacing: 0.025em;
  text-transform: none
}

.heading.size-40 .desc {
  font-size: 0.9375em;
  line-height: 1.7333333333em
}

.heading.size-30 {
  padding: 1.875em 0
}

.heading.size-30 .head,
.heading.size-30 .head2 {
  font-size: 1.875em;
  letter-spacing: 0.0333333333em;
  text-transform: none
}

.heading.size-30 .desc {
  font-size: 0.9375em;
  line-height: 1.7333333333em
}

.heading.iris-blue .head,
.heading.iris-blue .head2 {
  color: #0EABE0
}

.heading.iris-blue .desc {
  color: #707d8f
}

.heading.blue-gem .head,
.heading.blue-gem .head2 {
  color: #403E99
}

.heading.blue-gem .desc {
  color: #707d8f
}

.heading.white .head,
.heading.white .head2 {
  color: #fff
}

.heading.white .desc {
  color: #BAF9FF
}

.heading.white-variant-2 .head,
.heading.white-variant-2 .head2 {
  color: #fff
}

.heading.white-variant-2 .desc {
  color: #7373b8
}

.heading.padding-top-0 {
  padding-top: 0
}

.heading.padding-bottom-0 {
  padding-bottom: 0
}

.homepage .aboutUsHome,
.homepage .productsHome {
  padding-bottom: 6.25em;
  overflow: hidden
}

@media only screen and (max-width: 1024px) {

  .homepage .aboutUsHome,
  .homepage .productsHome {
    padding-bottom: 0
  }
}

.homepage .aboutUsHome .aboutHomeList ul,
.homepage .aboutUsHome .productsHomeList ul,
.homepage .productsHome .aboutHomeList ul,
.homepage .productsHome .productsHomeList ul {
  margin: 0 -0.1875em;
  padding: 0;
  list-style: none
}

.homepage .aboutUsHome .aboutHomeList ul li,
.homepage .aboutUsHome .productsHomeList ul li,
.homepage .productsHome .aboutHomeList ul li,
.homepage .productsHome .productsHomeList ul li {
  width: 33.33%;
  float: left;
  padding: 0.1875em
}

.homepage .aboutUsHome .aboutHomeList ul li:nth-child(3n+1),
.homepage .aboutUsHome .productsHomeList ul li:nth-child(3n+1),
.homepage .productsHome .aboutHomeList ul li:nth-child(3n+1),
.homepage .productsHome .productsHomeList ul li:nth-child(3n+1) {
  clear: both
}

@media only screen and (max-width: 1024px) {

  .homepage .aboutUsHome .aboutHomeList ul li,
  .homepage .aboutUsHome .productsHomeList ul li,
  .homepage .productsHome .aboutHomeList ul li,
  .homepage .productsHome .productsHomeList ul li {
    width: 50%
  }

  .homepage .aboutUsHome .aboutHomeList ul li:nth-child(3n+1),
  .homepage .aboutUsHome .productsHomeList ul li:nth-child(3n+1),
  .homepage .productsHome .aboutHomeList ul li:nth-child(3n+1),
  .homepage .productsHome .productsHomeList ul li:nth-child(3n+1) {
    clear: none
  }

  .homepage .aboutUsHome .aboutHomeList ul li:nth-child(2n+1),
  .homepage .aboutUsHome .productsHomeList ul li:nth-child(2n+1),
  .homepage .productsHome .aboutHomeList ul li:nth-child(2n+1),
  .homepage .productsHome .productsHomeList ul li:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {

  .homepage .aboutUsHome .aboutHomeList ul li,
  .homepage .aboutUsHome .productsHomeList ul li,
  .homepage .productsHome .aboutHomeList ul li,
  .homepage .productsHome .productsHomeList ul li {
    width: 100%
  }
}

.homepage .aboutUsHome .aboutHomeList ul li a,
.homepage .aboutUsHome .productsHomeList ul li a,
.homepage .productsHome .aboutHomeList ul li a,
.homepage .productsHome .productsHomeList ul li a {
  position: relative;
  display: block;
  color: #fff
}

.homepage .aboutUsHome .aboutHomeList ul li a .img,
.homepage .aboutUsHome .productsHomeList ul li a .img,
.homepage .productsHome .aboutHomeList ul li a .img,
.homepage .productsHome .productsHomeList ul li a .img {
  line-height: 0;
  display: block;
  position: relative;
  text-align: center;
  z-index: 2;
  overflow: hidden;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a .img:before,
.homepage .aboutUsHome .productsHomeList ul li a .img:before,
.homepage .productsHome .aboutHomeList ul li a .img:before,
.homepage .productsHome .productsHomeList ul li a .img:before {
  content: '';
  position: absolute;
  z-index: 2;
  top: -0.125em;
  left: -0.125em;
  right: -0.125em;
  bottom: -0.125em;
  background: rgba(41, 40, 115, 0.9);
  opacity: 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a .frame,
.homepage .aboutUsHome .productsHomeList ul li a .frame,
.homepage .productsHome .aboutHomeList ul li a .frame,
.homepage .productsHome .productsHomeList ul li a .frame {
  display: block;
  position: relative
}

.homepage .aboutUsHome .aboutHomeList ul li a .frame:before,
.homepage .aboutUsHome .productsHomeList ul li a .frame:before,
.homepage .productsHome .aboutHomeList ul li a .frame:before,
.homepage .productsHome .productsHomeList ul li a .frame:before {
  content: '';
  position: absolute;
  top: -1.875em;
  bottom: 80%;
  left: 0.5em;
  right: 0.5em;
  border: 0.1875em solid #3fbee9;
  border-bottom: none;
  opacity: 0;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  transition: 0.4s;
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  transition-delay: 0.1s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a .frame:after,
.homepage .aboutUsHome .productsHomeList ul li a .frame:after,
.homepage .productsHome .aboutHomeList ul li a .frame:after,
.homepage .productsHome .productsHomeList ul li a .frame:after {
  content: '';
  position: absolute;
  bottom: -1.875em;
  top: 80%;
  left: 0.5em;
  right: 0.5em;
  border: 0.1875em solid #3fbee9;
  border-top: none;
  opacity: 0;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  transition: 0.4s;
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  transition-delay: 0.1s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a .card,
.homepage .aboutUsHome .productsHomeList ul li a .card,
.homepage .productsHome .aboutHomeList ul li a .card,
.homepage .productsHome .productsHomeList ul li a .card {
  overflow: hidden;
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  top: 100%;
  margin-top: -2.5em;
  text-align: center;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 1024px) {

  .homepage .aboutUsHome .aboutHomeList ul li a .card,
  .homepage .aboutUsHome .productsHomeList ul li a .card,
  .homepage .productsHome .aboutHomeList ul li a .card,
  .homepage .productsHome .productsHomeList ul li a .card {
    position: relative;
    display: block
  }
}

.homepage .aboutUsHome .aboutHomeList ul li a .card .title,
.homepage .aboutUsHome .productsHomeList ul li a .card .title,
.homepage .productsHome .aboutHomeList ul li a .card .title,
.homepage .productsHome .productsHomeList ul li a .card .title {
  text-align: center;
  font-size: 1.0625em;
  display: block;
  padding: 0.5294117647em 0;
  font-weight: 300;
  background: rgba(41, 40, 115, 0.85);
  color: #fff;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a .card .description,
.homepage .aboutUsHome .productsHomeList ul li a .card .description,
.homepage .productsHome .aboutHomeList ul li a .card .description,
.homepage .productsHome .productsHomeList ul li a .card .description {
  display: block;
  font-size: 0.875em;
  font-weight: 300;
  line-height: 1.7142857143em;
  color: #a0a3eb;
  opacity: 0;
  padding: 1.0714285714em 2.1428571429em;
  -webkit-transform: translateY(10px);
  -moz-transform: translateY(10px);
  -ms-transform: translateY(10px);
  -o-transform: translateY(10px);
  transform: translateY(10px);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

@media only screen and (max-width: 1024px) {

  .homepage .aboutUsHome .aboutHomeList ul li a .card .description,
  .homepage .aboutUsHome .productsHomeList ul li a .card .description,
  .homepage .productsHome .aboutHomeList ul li a .card .description,
  .homepage .productsHome .productsHomeList ul li a .card .description {
    opacity: 1;
    font-size: 0.9375em;
    color: #707d8f;
    padding-top: 0.6666666667em;
    padding-bottom: 2em
  }
}

.homepage .aboutUsHome .aboutHomeList ul li a .card .icons,
.homepage .aboutUsHome .productsHomeList ul li a .card .icons,
.homepage .productsHome .aboutHomeList ul li a .card .icons,
.homepage .productsHome .productsHomeList ul li a .card .icons {
  display: block;
  font-size: 2em;
  opacity: 0;
  line-height: 1em;
  -webkit-transform: translateY(0.78125em);
  -moz-transform: translateY(0.78125em);
  -ms-transform: translateY(0.78125em);
  -o-transform: translateY(0.78125em);
  transform: translateY(0.78125em);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .aboutUsHome .aboutHomeList ul li a:hover,
.homepage .aboutUsHome .productsHomeList ul li a:hover,
.homepage .productsHome .aboutHomeList ul li a:hover,
.homepage .productsHome .productsHomeList ul li a:hover {
  z-index: 4
}

@media only screen and (min-width: 1025px) {

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .frame:before,
  .homepage .aboutUsHome .aboutHomeList ul li a:hover .frame:after,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .frame:before,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .frame:after,
  .homepage .productsHome .aboutHomeList ul li a:hover .frame:before,
  .homepage .productsHome .aboutHomeList ul li a:hover .frame:after,
  .homepage .productsHome .productsHomeList ul li a:hover .frame:before,
  .homepage .productsHome .productsHomeList ul li a:hover .frame:after {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .img,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .img,
  .homepage .productsHome .aboutHomeList ul li a:hover .img,
  .homepage .productsHome .productsHomeList ul li a:hover .img {
    box-shadow: 11px 13px 43px rgba(0, 0, 0, 0.57);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1)
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .img:before,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .img:before,
  .homepage .productsHome .aboutHomeList ul li a:hover .img:before,
  .homepage .productsHome .productsHomeList ul li a:hover .img:before {
    opacity: 1
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .card,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .card,
  .homepage .productsHome .aboutHomeList ul li a:hover .card,
  .homepage .productsHome .productsHomeList ul li a:hover .card {
    top: 0;
    margin-top: 0
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .card .title,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .card .title,
  .homepage .productsHome .aboutHomeList ul li a:hover .card .title,
  .homepage .productsHome .productsHomeList ul li a:hover .card .title {
    background: transparent;
    font-size: 1.1875em;
    padding: 0em 0
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .card .description,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .card .description,
  .homepage .productsHome .aboutHomeList ul li a:hover .card .description,
  .homepage .productsHome .productsHomeList ul li a:hover .card .description {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
  }

  .homepage .aboutUsHome .aboutHomeList ul li a:hover .card .icons,
  .homepage .aboutUsHome .productsHomeList ul li a:hover .card .icons,
  .homepage .productsHome .aboutHomeList ul li a:hover .card .icons,
  .homepage .productsHome .productsHomeList ul li a:hover .card .icons {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
  }
}

.homepage .aboutUsHome .aboutHomeList ul li a:focus,
.homepage .aboutUsHome .productsHomeList ul li a:focus,
.homepage .productsHome .aboutHomeList ul li a:focus,
.homepage .productsHome .productsHomeList ul li a:focus {
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95)
}

.homepage .aboutUsHome .aboutHomeList ul li:nth-child(n+4) a .card .title,
.homepage .aboutUsHome .productsHomeList ul li:nth-child(n+4) a .card .title,
.homepage .productsHome .aboutHomeList ul li:nth-child(n+4) a .card .title,
.homepage .productsHome .productsHomeList ul li:nth-child(n+4) a .card .title {
  background: rgba(14, 171, 224, 0.85)
}

@media only screen and (min-width: 1025px) {

  .homepage .aboutUsHome .aboutHomeList ul li:nth-child(n+4) a:hover .card .title,
  .homepage .aboutUsHome .productsHomeList ul li:nth-child(n+4) a:hover .card .title,
  .homepage .productsHome .aboutHomeList ul li:nth-child(n+4) a:hover .card .title,
  .homepage .productsHome .productsHomeList ul li:nth-child(n+4) a:hover .card .title {
    background: transparent
  }
}

.homepage .servicesHome {
  background: url(../img/pattern.jpg) top center repeat;
  overflow: hidden;
  padding-bottom: 6.25em
}

.homepage .servicesHome .servicesSlider {
  margin: 0 0 2.5em 0;
  position: relative
}

.homepage .servicesHome .servicesSlider .prev,
.homepage .servicesHome .servicesSlider .next {
  display: none !important
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider {
    margin: 0
  }

  .homepage .servicesHome .servicesSlider .prev,
  .homepage .servicesHome .servicesSlider .next {
    display: block !important
  }

  .homepage .servicesHome .servicesSlider .prev {
    position: absolute;
    z-index: 9999;
    left: 7%;
    color: #00a7e1;
    top: 50%;
    margin-top: -0.5em;
    font-size: 1.5em;
    cursor: pointer
  }

  .homepage .servicesHome .servicesSlider .next {
    position: absolute;
    z-index: 9999;
    right: 7%;
    color: #00a7e1;
    top: 50%;
    margin-top: -0.5em;
    font-size: 1.5em;
    cursor: pointer
  }
}

@media only screen and (max-width: 640px) {

  .homepage .servicesHome .servicesSlider .prev,
  .homepage .servicesHome .servicesSlider .next {
    top: auto;
    bottom: 2.0833333333em
  }

  .homepage .servicesHome .servicesSlider .prev {
    left: 2.0833333333em
  }

  .homepage .servicesHome .servicesSlider .next {
    right: 2.0833333333em
  }
}

.homepage .servicesHome .servicesSlider .card {
  padding: 3.125em;
  background: #fff;
  overflow: hidden
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider .card {
    padding: 3.125em 5em
  }
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card {
    padding: 3.125em 2.5em 7.5em;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column
  }
}

.homepage .servicesHome .servicesSlider .card .left.side {
  width: 57.5%
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider .card .left.side {
    width: 46%
  }
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card .left.side {
    -webkit-box-ordinal-group: 2;
    -moz-box-ordinal-group: 2;
    box-ordinal-group: 2;
    -webkit-order: 2;
    -moz-order: 2;
    order: 2;
    -ms-flex-order: 2;
    width: 100%;
    float: none
  }
}

.homepage .servicesHome .servicesSlider .card .right.side {
  width: 37%
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider .card .right.side {
    width: 45%
  }
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card .right.side {
    -webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    box-ordinal-group: 1;
    -webkit-order: 1;
    -moz-order: 1;
    order: 1;
    -ms-flex-order: 1;
    width: 100%;
    float: none;
    margin-bottom: 0.9375em
  }
}

.homepage .servicesHome .servicesSlider .card .head {
  font-size: 2.875em;
  color: #0d5871;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  position: relative;
  padding-bottom: 0.2173913043em
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider .card .head {
    font-size: 1.875em
  }
}

.homepage .servicesHome .servicesSlider .card .head:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 4px;
  bottom: 0;
  left: 0;
  background: url(../img/linePattern.png)
}

.homepage .servicesHome .servicesSlider .card .head .icon {
  font-size: 1.6739130435em;
  color: #0eabe0;
  margin-right: 0.3896103896em
}

.homepage .servicesHome .servicesSlider .card .description {
  font-weight: 300;
  font-size: 1.125em;
  line-height: 1.5555555556em;
  color: #707d8f;
  overflow: hidden;
  text-align: justify;
  padding: 1.3888888889em 0
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .servicesSlider .card .description {
    font-size: 0.9375em
  }
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card .buttons {
    text-align: center
  }
}

.homepage .servicesHome .servicesSlider .card .image {
  display: inline-block;
  position: relative;
  float: right;
  line-height: 0;
  max-width: 100%
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card .image {
    float: none;
    overflow: hidden;
    display: block;
    text-align: center
  }

  .homepage .servicesHome .servicesSlider .card .image img {
    display: inline-block
  }
}

.homepage .servicesHome .servicesSlider .card .image .zoom {
  position: absolute;
  right: 0;
  bottom: 0;
  background: #16154e;
  color: #fff;
  width: 2.5em;
  height: 2.5em;
  line-height: 2.5em;
  text-align: center
}

@media only screen and (max-width: 640px) {
  .homepage .servicesHome .servicesSlider .card .image .zoom {
    display: none
  }
}

.homepage .servicesHome .servicesSlider .card .image .zoom:before {
  content: '';
  position: absolute;
  top: 6px;
  left: 6px;
  right: 6px;
  height: 6px;
  border: 1px solid #0f92c7;
  border-bottom: none
}

.homepage .servicesHome .servicesSlider .card .image .zoom:after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 6px;
  right: 6px;
  height: 6px;
  border: 1px solid #0f92c7;
  border-top: none
}

.homepage .servicesHome .servicesSlider .card .image .zoom .icon {
  font-size: 0.9375em;
  position: relative;
  top: -1px
}

.homepage .servicesHome .paginationSlider {
  text-align: center;
  margin: -1.875em 4.375em 0 4.375em;
  padding: 1.25em 0;
  height: 5.625em;
  position: relative
}

@media only screen and (max-width: 1024px) {
  .homepage .servicesHome .paginationSlider {
    display: none
  }
}

.homepage .servicesHome .paginationSlider .prev {
  position: absolute;
  left: -1.4583333333em;
  color: #fff;
  top: 1.4583333333em;
  font-size: 1.5em;
  cursor: pointer
}

.homepage .servicesHome .paginationSlider .next {
  position: absolute;
  right: -1.4583333333em;
  color: #fff;
  top: 1.4583333333em;
  font-size: 1.5em;
  cursor: pointer
}

.homepage .servicesHome .paginationSlider .slide {
  position: relative;
  display: inline-block;
  cursor: pointer;
  color: #86e1ff;
  font-size: 1.0625em;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  margin: 2.0588235294em 1.1764705882em 0 1.1764705882em;
  padding: 0.8823529412em 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .servicesHome .paginationSlider .slide:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  border-top: 2px solid #52d4ff;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.homepage .servicesHome .paginationSlider .slide.active,
.homepage .servicesHome .paginationSlider .slide.slick-current {
  color: #fff;
  font-size: 1.375em;
  margin: 0 0.9090909091em;
  padding: 0.6818181818em 0
}

.homepage .servicesHome .paginationSlider .slide.active:before,
.homepage .servicesHome .paginationSlider .slide.slick-current:before {
  top: 100%;
  margin-top: -2px;
  border-color: #fff
}

.homepage .productsHome {
  padding: 0
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome {
    padding-bottom: 12.5em
  }
}

.homepage .productsHome .productsHomeList {
  position: relative
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome .productsHomeList {
    width: 92%;
    margin: 0 auto
  }
}

.homepage .productsHome .productsHomeList .prev,
.homepage .productsHome .productsHomeList .next {
  position: absolute;
  background: rgba(23, 24, 57, 0.83);
  z-index: 99;
  color: #fff;
  font-size: 1.6875em;
  line-height: 1.9259259259em;
  width: 1.9259259259em;
  height: 1.9259259259em;
  text-align: center;
  cursor: pointer;
  top: 50%;
  left: 0.3703703704em;
  margin-top: -0.962962963em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

@media only screen and (max-width: 1024px) {

  .homepage .productsHome .productsHomeList .prev,
  .homepage .productsHome .productsHomeList .next {
    top: 100%;
    margin-top: 0.9302325581em;
    font-size: 2.6875em;
    color: #626285;
    background: transparent;
    width: auto
  }
}

@media only screen and (min-width: 1025px) {

  .homepage .productsHome .productsHomeList .prev:hover,
  .homepage .productsHome .productsHomeList .next:hover {
    background: #171839;
    left: 0
  }
}

.homepage .productsHome .productsHomeList .next {
  left: auto;
  right: 0.3703703704em
}

@media only screen and (min-width: 1025px) {
  .homepage .productsHome .productsHomeList .next:hover {
    left: auto;
    right: 0
  }
}

.homepage .productsHome .productsHomeList ul {
  margin: 0 -0.0625em
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome .productsHomeList ul {
    margin: 0 0.3125em
  }
}

.homepage .productsHome .productsHomeList ul li {
  width: 25%;
  padding: 0.0625em
}

.homepage .productsHome .productsHomeList ul li:nth-child(3n+1) {
  clear: none
}

.homepage .productsHome .productsHomeList ul li:nth-child(4n+1) {
  clear: both
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome .productsHomeList ul li {
    width: 50%;
    padding: 0.3125em
  }

  .homepage .productsHome .productsHomeList ul li:nth-child(4n+1) {
    clear: none
  }

  .homepage .productsHome .productsHomeList ul li:nth-child(2n+1) {
    clear: both
  }
}

.homepage .productsHome .productsHomeList ul li a .img img {
  display: inline-block
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome .productsHomeList ul li a .card {
    position: absolute
  }
}

@media only screen and (max-width: 1024px) {
  .homepage .productsHome .productsHomeList ul li a .card .description {
    display: none
  }
}

@media only screen and (min-width: 1025px) {
  .homepage .productsHome .productsHomeList ul li a:hover {
    z-index: 4
  }

  .homepage .productsHome .productsHomeList ul li a:hover .card {
    left: 1.25em;
    right: 1.25em
  }

  .homepage .productsHome .productsHomeList ul li a:hover .frame:before,
  .homepage .productsHome .productsHomeList ul li a:hover .frame:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
  }

  .homepage .productsHome .productsHomeList ul li a:hover .img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
  }
}

.homepage .productsHome .productsHomeList ul li a:focus {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1)
}

.homepage .productsHome .productsHomeList ul li:nth-child(n+4) a .card .title {
  background: rgba(41, 40, 115, 0.85)
}

.homepage .productsHome .productsHomeList ul li:nth-child(n+5) a .card .title {
  background: rgba(14, 171, 224, 0.85)
}

.homepage .productsHome .productsHomeList ul li:nth-child(n+5) a:hover .card .title {
  background: transparent
}

.homepage .customersHome {
  background: #ebeef5;
  overflow: hidden;
  padding-bottom: 6.25em;
  margin: 0
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome {
    padding-bottom: 9.375em
  }
}

.homepage .customersHome .customersHomeList {
  position: relative
}

.homepage .customersHome .customersHomeList .prev,
.homepage .customersHome .customersHomeList .next {
  font-size: 3.25em;
  position: absolute;
  z-index: 99;
  top: 50%;
  left: 5%;
  margin-top: -0.5em;
  color: #0eabe0;
  cursor: pointer;
  line-height: 1em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.homepage .customersHome .customersHomeList .prev:hover,
.homepage .customersHome .customersHomeList .next:hover {
  opacity: 0.5
}

@media only screen and (max-width: 1024px) {

  .homepage .customersHome .customersHomeList .prev,
  .homepage .customersHome .customersHomeList .next {
    top: 100%;
    font-size: 2.6875em;
    width: auto;
    margin-top: 1.1627906977em
  }
}

.homepage .customersHome .customersHomeList .next {
  left: auto;
  right: 5%
}

.homepage .customersHome .customersHomeList .element {
  overflow: hidden
}

.homepage .customersHome .customersHomeList .element img {
  display: inline-block
}

.homepage .customersHome .customersHomeList .element .card {
  overflow: hidden
}

@media only screen and (max-width: 640px) {
  .homepage .customersHome .customersHomeList .element .card {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column
  }
}

.homepage .customersHome .customersHomeList .element .left.side {
  background: #fff;
  width: 30%
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome .customersHomeList .element .left.side {
    width: 43%
  }
}

@media only screen and (max-width: 640px) {
  .homepage .customersHome .customersHomeList .element .left.side {
    width: 100%;
    overflow: hidden;
    float: none;
    -webkit-box-ordinal-group: 2;
    -moz-box-ordinal-group: 2;
    box-ordinal-group: 2;
    -webkit-order: 2;
    -moz-order: 2;
    order: 2;
    -ms-flex-order: 2
  }
}

.homepage .customersHome .customersHomeList .element .right.side {
  width: 68%
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome .customersHomeList .element .right.side {
    width: 55%
  }
}

@media only screen and (max-width: 640px) {
  .homepage .customersHome .customersHomeList .element .right.side {
    width: 100%;
    overflow: hidden;
    float: none;
    -webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    box-ordinal-group: 1;
    -webkit-order: 1;
    -moz-order: 1;
    order: 1;
    -ms-flex-order: 1;
    margin-bottom: 1.25em
  }
}

.homepage .customersHome .customersHomeList .element .content {
  padding: 3.125em
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome .customersHomeList .element .content {
    padding: 3.125em 1.5625em
  }
}

@media only screen and (max-width: 640px) {
  .homepage .customersHome .customersHomeList .element .content {
    text-align: center
  }
}

.homepage .customersHome .customersHomeList .element .content .text {
  font-size: 1.0625em;
  font-weight: 300;
  color: #707d8f;
  line-height: 1.4117647059em
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome .customersHomeList .element .content .text {
    font-size: 0.9375em
  }
}

.homepage .customersHome .customersHomeList .element .content .text ul {
  margin: 0;
  padding: 2.0588235294em 0;
  list-style: none
}

.homepage .customersHome .customersHomeList .element .content .text ul li {
  position: relative;
  padding-left: 1.4705882353em;
  padding-top: 0.4705882353em;
  padding-bottom: 0.4705882353em
}

.homepage .customersHome .customersHomeList .element .content .text ul li:before {
  content: '-';
  position: absolute;
  left: 0
}

@media only screen and (max-width: 1024px) {
  .homepage .customersHome .customersHomeList .element .content .buttons {
    display: none
  }
}

.homepage .customersHome .customersHomeList .element .img {
  line-height: 0
}

.homepage .customersHome .customersHomeList .element .img a {
  display: block;
  overflow: hidden;
  position: relative
}

.homepage .customersHome .customersHomeList .element .img a .zoom {
  position: absolute;
  right: 1em;
  bottom: 1em;
  background: #16154e;
  color: #fff;
  width: 2.5em;
  height: 2.5em;
  line-height: 2.5em;
  text-align: center
}

@media only screen and (max-width: 640px) {
  .homepage .customersHome .customersHomeList .element .img a .zoom {
    display: none
  }
}

.homepage .customersHome .customersHomeList .element .img a .zoom:before {
  content: '';
  position: absolute;
  top: 6px;
  left: 6px;
  right: 6px;
  height: 6px;
  border: 1px solid #0f92c7;
  border-bottom: none
}

.homepage .customersHome .customersHomeList .element .img a .zoom:after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 6px;
  right: 6px;
  height: 6px;
  border: 1px solid #0f92c7;
  border-top: none
}

.homepage .customersHome .customersHomeList .element .img a .zoom .icon {
  font-size: 0.9375em;
  position: relative;
  top: -1px
}

.homepage .contactHome {
  background: #16154e url(../img/pattern6.jpg);
  overflow: hidden
}

.homepage .contactHome a.mailto {
  display: block;
  border: 1px solid #2f2e62;
  text-transform: uppercase;
  text-align: center;
  font-size: 1.25em;
  font-family: "Roboto", Arial, sans-serif;
  padding: 1.5em 0;
  font-weight: 300;
  color: #fff;
  margin-bottom: 2.5em
}

.homepage .contactHome a.mailto span {
  font-weight: 700;
  color: #00a9e3
}

.homepage .contactHome .buttons {
  margin-bottom: -1.5625em;
  position: relative;
  top: 3.75em;
  background: #1D1350;
  display: inline-block
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome form {
    display: none
  }
}

.homepage .contactHome .right.side {
  width: 28%;
  background: #16154e;
  overflow: hidden;
  position: relative;
  z-index: 2
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .right.side {
    width: 100%;
    overflow: hidden;
    float: none
  }
}

.homepage .contactHome .content {
  padding: 2em;
  background: #16154e;
  color: #fff;
  font-size: 0.9375em;
  overflow: hidden
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content {
    text-align: center
  }
}

.homepage .contactHome .content .head {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 2.1875em;
  font-weight: 100;
  margin-bottom: 0.7142857143em;
  color: #8988ce;
  text-transform: uppercase
}

.homepage .contactHome .content .head b {
  color: #fff;
  font-weight: 500
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content .head {
    margin-bottom: 0
  }

  .homepage .contactHome .content .head br {
    display: none
  }
}

.homepage .contactHome .content .frame {
  padding: 2em 1.3333333333em 3.3333333333em;
  font-weight: 300;
  color: #a0a0e0;
  line-height: 1.8em;
  position: relative
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content .frame {
    padding: 1em 1.3333333333em 1em
  }

  .homepage .contactHome .content .frame br {
    display: none
  }
}

.homepage .contactHome .content .frame a {
  color: #fff
}

.homepage .contactHome .content .frame:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2.6666666667em;
  border: 2px solid #0eabe0;
  border-bottom: none
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content .frame:before {
    display: none
  }
}

.homepage .contactHome .content .frame:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.6666666667em;
  border: 2px solid #0eabe0;
  border-top: none
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content .frame:after {
    display: none
  }
}

.homepage .contactHome .content .button {
  margin-top: 3.6666666667em;
  overflow: hidden
}

.homepage .contactHome .content .button a.btn-standard {
  display: block;
  float: left
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .content .button a.btn-standard {
    display: inline-block;
    float: none;
    overflow: hidden
  }
}

.homepage .contactHome .content .button a.btn-standard:hover {
  color: #16154e
}

.homepage .contactHome .mapContainer {
  margin-top: 6.25em;
  overflow: hidden;
  position: relative;
  padding: 7.1875em 0 4.375em 0;
  min-height: 40.625em
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .mapContainer {
    margin: 0;
    padding: 0;
    min-height: 0
  }
}

.homepage .contactHome .mapContainer .homepageMap {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

@media only screen and (max-width: 1024px) {
  .homepage .contactHome .mapContainer .homepageMap {
    display: none
  }
}

.mobileMenu {
  display: none;
  float: left;
  width: 100%;
  background: #18185E;
  overflow: hidden;
  position: relative;
  z-index: 2
}

@media only screen and (max-width: 800px) {
  .menuOpened .mobileMenu {
    display: block
  }
}

.mobileMenu .menu ul {
  margin: 0;
  padding: 1.25em 0;
  list-style: none
}

@media only screen and (max-width: 450px) {
  .mobileMenu .menu ul {
    padding: 4.375em 0 1.25em 0
  }
}

.mobileMenu .menu ul li a {
  display: block;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  padding: 0.5555555556em 0;
  font-size: 1.125em;
  font-weight: 300
}

.pageContent {
  margin-top: 100vh;
  position: relative;
  z-index: 2;
  background: #fff;
  opacity: 1;
  overflow: hidden
}

@media only screen and (max-width: 1024px) {
  .pageContent {
    margin-top: 0
  }
}

.pageContent.subpage {
  margin-top: 0;
  overflow: visible;
  padding: 0 0;
  position: static
}

.pinIt_debug_element {
  position: absolute;
  z-index: 99999999999;
  left: 0;
  width: 100%;
  height: 1px;
  background: red;
  box-shadow: 0px 0px 2px #000
}

.pinIt_debug_element:before {
  content: 'element';
  font-size: 15px;
  line-height: 15px;
  height: 15px;
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  background: red;
  padding: 0 5px;
  box-shadow: 0px 0px 2px #000
}

.pinIt_debug_element.end:before {
  content: 'end element';
  right: 0;
  left: auto
}

.pinIt_debug_trigger {
  position: fixed;
  z-index: 99999999999;
  left: 0;
  width: 100%;
  height: 1px;
  background: green;
  box-shadow: 0px 0px 2px #000
}

.pinIt_debug_trigger:before {
  content: 'trigger';
  font-size: 15px;
  line-height: 15px;
  height: 15px;
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  background: green;
  padding: 0 5px;
  box-shadow: 0px 0px 2px #000
}

.pinIt_debug_trigger.bottom:before {
  top: -16px
}

.fancybox-popup .fancybox-skin {
  box-shadow: none;
  border-radius: 0px
}

.fancybox-popup .fancybox-skin .heading {
  margin-bottom: 1.25em
}

.fancybox-popup .fancybox-skin .popText {
  text-align: center
}

.products {
  padding: 1.875em 0;
  overflow: hidden
}

.products .slick-list {
  overflow: visible
}

.products .slick-slider .slick-track {
  margin: 0px auto
}

.products.catsOpen .categoriesTrigger span span {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg)
}

.products .categoriesTrigger {
  color: #0EABE0;
  font-size: 1.875em;
  position: relative;
  float: left;
  width: 100%;
  margin-bottom: 25px;
  font-weight: 300;
  display: none;
  cursor: pointer;
  text-align: center
}

@media only screen and (max-width: 1024px) {
  .products .categoriesTrigger {
    display: block
  }
}

.products .categoriesTrigger span span {
  position: relative;
  background: #0EABE0;
  width: 10px;
  height: 10px;
  padding: 15px;
  display: inline-block;
  border-radius: 100%;
  top: 8px;
  margin-left: 10px;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.products .categoriesTrigger span span:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 14px;
  width: 12px;
  height: 6px;
  margin: auto;
  height: 0;
  width: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #fff
}

@media only screen and (max-width: 1024px) {
  .products.catsOpen .productsCategories {
    display: block
  }
}

.products .productsCategories {
  float: left;
  width: 100%;
  text-align: center;
  font-size: 0.875em
}

@media only screen and (max-width: 1024px) {
  .products .productsCategories {
    display: none
  }
}

.products .productsCategories span {
  max-width: 140px;
  width: 100%;
  display: inline-block;
  position: relative;
  margin: 0 6px;
  padding: 12px;
  border: 1px solid #e2e2e2;
  color: #707d8f;
  cursor: pointer;
  font-weight: 300;
  margin-bottom: 15px;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.products .productsCategories span:hover,
.products .productsCategories span.active {
  background: #34c7f9;
  border-color: #34c7f9;
  color: #ffffff
}

.products .productsCategories span:hover:before,
.products .productsCategories span.active:before {
  opacity: 1;
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  -o-transform: scaleY(1);
  transform: scaleY(1)
}

.products .productsCategories span.active {
  font-weight: 600
}

.products .productsCategories span:before {
  content: "";
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  margin: auto;
  height: 0;
  width: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 7px solid #34c7f9;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
  -webkit-transform: scaleY(0);
  -moz-transform: scaleY(0);
  -ms-transform: scaleY(0);
  -o-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: top;
  -moz-transform-origin: top;
  -ms-transform-origin: top;
  -o-transform-origin: top;
  transform-origin: top;
  opacity: 0
}

.products .productsSubCategories {
  float: left;
  width: 100%;
  padding: 2.1875em 0em
}

.products .productsSubCategories.slick-slider {
  margin-bottom: 0
}

.products .productsSubCategories a {
  display: inline-block;
  width: 10%;
  text-align: center;
  border-right: 1px solid #e5e5e5;
  border-left: 1px solid transparent;
  position: relative;
  cursor: pointer
}

.products .productsSubCategories a .imgs {
  width: 100%;
  display: block;
  height: 166px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
  opacity: 0.2
}

.products .productsSubCategories a .desc {
  position: absolute;
  top: 105%;
  width: 100%;
  left: 0;
  text-align: center;
  font-weight: 300;
  font-size: 0.875em;
  color: #707d8f;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
  -webkit-transform: translateY(-25%);
  -moz-transform: translateY(-25%);
  -ms-transform: translateY(-25%);
  -o-transform: translateY(-25%);
  transform: translateY(-25%);
  opacity: 0
}

.products .productsSubCategories a.active-category .imgs {
  opacity: 1
}

.products .productsSubCategories a:hover .imgs,
.products .productsSubCategories a.active-products .imgs {
  opacity: 1
}

.products .productsSubCategories a:hover .desc,
.products .productsSubCategories a.active-products .desc {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
  opacity: 1
}

.products .productsGrid {
  float: left;
  width: 100%;
  padding-top: 1.875em
}

.products .productsGrid+.productsGrid {
  padding-top: 0
}

.products .productsGrid a {
  float: left;
  text-align: center;
  color: #fff;
  font-size: 22px;
  position: relative
}

.products .productsGrid a>span {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0;
  bottom: 0;
  top: 0;
  background: rgba(41, 40, 115, 0.85);
  display: table;
  height: 100%;
  width: 100%;
  opacity: 0;
  -webkit-transform: scale(0.97);
  -moz-transform: scale(0.97);
  -ms-transform: scale(0.97);
  -o-transform: scale(0.97);
  transform: scale(0.97);
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.products .productsGrid a>span span {
  display: table-cell;
  height: 100%;
  vertical-align: middle
}

.products .productsGrid .wideBox {
  width: 50.5%;
  float: left
}

@media only screen and (max-width: 1024px) {
  .products .productsGrid .wideBox {
    width: 100%;
    float: right
  }
}

.products .productsGrid .wideBox .large {
  height: 277px;
  width: 100%
}

@media only screen and (max-width: 640px) {
  .products .productsGrid .wideBox .large {
    height: 170px
  }
}

.products .productsGrid .wideBox .small {
  width: 50%
}

@media only screen and (max-width: 640px) {
  .products .productsGrid .wideBox .small {
    width: 100%;
    height: 225px
  }
}

.products .productsGrid .small,
.products .productsGrid .large,
.products .productsGrid .high {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover
}

.products .productsGrid .small:hover span,
.products .productsGrid .large:hover span,
.products .productsGrid .high:hover span {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  opacity: 1
}

.products .productsGrid .small {
  width: 24.75%;
  height: 278px
}

@media only screen and (max-width: 640px) {
  .products .productsGrid .small {
    width: 50%;
    height: 200px
  }
}

@media only screen and (max-width: 450px) {
  .products .productsGrid .small {
    width: 100%
  }
}

.products .productsGrid .large {
  width: 50.5%;
  height: 277px
}

@media only screen and (max-width: 640px) {
  .products .productsGrid .large {
    height: 170px
  }
}

@media only screen and (max-width: 640px) {
  .products .productsGrid .large {
    width: 100%
  }
}

.products .productsGrid .high {
  width: 24.75%;
  height: 555px
}

.products .productsGrid .high:nth-child(2) {
  float: right
}

@media only screen and (max-width: 1024px) {
  .products .productsGrid .high {
    width: 50%;
    height: 375px
  }

  .products .productsGrid .high:nth-child(2) {
    float: left
  }
}

@media only screen and (max-width: 1024px) and (max-width: 640px) {
  .products .productsGrid .high {
    width: 100%
  }
}

.effectSpyTrigger {
  position: fixed;
  z-index: 999;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: red;
  font-size: 10px;
  line-height: 12px
}

.effectSpyTrigger:before {
  content: 'trigger';
  position: absolute;
  top: -12px;
  right: 0;
  background: red;
  color: #fff
}

.effectSpyPosition {
  position: absolute;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: green;
  font-size: 10px;
  line-height: 12px
}

.effectSpyPosition:before {
  content: 'element';
  position: absolute;
  top: -12px;
  right: 0;
  background: green;
  color: #fff
}

.services {
  overflow: hidden
}

.services .servicesSlider {
  position: relative
}

.services .servicesSlider .pager {
  position: absolute;
  bottom: 2.5em;
  left: 0;
  width: 100%
}

.services .servicesSlider .pager .paginationSlider {
  text-align: center;
  margin: -1.875em 4.375em 0 4.375em;
  padding: 1.25em 0;
  height: 5.625em;
  position: relative
}

.services .servicesSlider .pager .paginationSlider .prev {
  position: absolute;
  left: -1.4583333333em;
  color: #fff;
  top: 1.4583333333em;
  font-size: 1.5em;
  cursor: pointer
}

.services .servicesSlider .pager .paginationSlider .next {
  position: absolute;
  right: -1.4583333333em;
  color: #fff;
  top: 1.4583333333em;
  font-size: 1.5em;
  cursor: pointer
}

.services .servicesSlider .pager .paginationSlider .slide {
  position: relative;
  display: inline-block;
  cursor: pointer;
  color: #86e1ff;
  color: #fff;
  text-transform: uppercase;
  font-size: 1.0625em;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  margin: 2.0588235294em 1.1764705882em 0 1.1764705882em;
  padding: 0.8823529412em 0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.services .servicesSlider .pager .paginationSlider .slide:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  border-top: 2px solid #52d4ff;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86)
}

.services .servicesSlider .pager .paginationSlider .slide.active,
.services .servicesSlider .pager .paginationSlider .slide.slick-current {
  color: #fff;
  font-size: 1.375em;
  margin: 0 0.9090909091em;
  padding: 0.6818181818em 0
}

.services .servicesSlider .pager .paginationSlider .slide.active:before,
.services .servicesSlider .pager .paginationSlider .slide.slick-current:before {
  top: 100%;
  margin-top: -2px;
  border-color: #fff
}

.services .servicesSlider.style-1 .regularSlider {
  margin-bottom: 0
}

.services .servicesSlider.style-1 .regularSlider .slide {
  overflow: hidden;
  padding: 3.75em 0 6.25em 0;
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover
}

@media only screen and (max-width: 800px) {
  .services .servicesSlider.style-1 .regularSlider .slide {
    padding-bottom: 9.375em
  }
}

@media only screen and (max-width: 450px) {
  .services .servicesSlider.style-1 .regularSlider .slide {
    padding-top: 3.125em
  }
}

.services .servicesSlider.style-1 .regularSlider .slide .scrollDown {
  cursor: pointer
}

.services .servicesSlider.style-1 .regularSlider .slide .left.side,
.services .servicesSlider.style-1 .regularSlider .slide .right.side {
  width: 50%
}

@media only screen and (max-width: 1024px) {
  .services .servicesSlider.style-1 .regularSlider .slide .left.side {
    width: 40%
  }
}

@media only screen and (max-width: 450px) {
  .services .servicesSlider.style-1 .regularSlider .slide .left.side {
    width: 100%;
    text-align: center;
    clear: both
  }

  .services .servicesSlider.style-1 .regularSlider .slide .left.side img {
    display: inline-block;
    max-width: 70%
  }
}

.services .servicesSlider.style-1 .regularSlider .slide .right.side {
  padding-left: 3.4375em;
  padding-top: 2.8125em
}

@media only screen and (max-width: 1024px) {
  .services .servicesSlider.style-1 .regularSlider .slide .right.side {
    width: 60%;
    padding-top: 5em;
    font-size: 0.6875em
  }
}

@media only screen and (max-width: 800px) {
  .services .servicesSlider.style-1 .regularSlider .slide .right.side {
    padding-top: 1.25em;
    font-size: 0.6875em
  }
}

@media only screen and (max-width: 450px) {
  .services .servicesSlider.style-1 .regularSlider .slide .right.side {
    width: 100%;
    font-size: 0.5em;
    text-align: center;
    padding-left: 0
  }
}

.services .servicesSlider.style-1 .regularSlider .slide .img {
  text-align: center;
  line-height: 0
}

.services .servicesSlider.style-1 .regularSlider .slide .head {
  font-size: 2.5em;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 300;
  color: #fff;
  background: rgba(7, 7, 34, 0.9);
  padding: 0.375em 0.625em;
  display: inline-block
}

.services .servicesSlider.style-1 .regularSlider .slide .subhead {
  margin-top: 0.1333333333em;
  display: inline-block;
  font-size: 4.6875em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(82, 212, 255, 0.9);
  padding: 0.0666666667em 0.3333333333em;
  font-weight: 500;
  font-family: "Roboto", Arial, sans-serif
}

.services .servicesSlider.style-2 .regularSlider {
  height: 50em;
  margin: 0
}

@media only screen and (max-width: 1024px) {
  .services .servicesSlider.style-2 .regularSlider {
    height: 40.625em
  }
}

@media only screen and (max-width: 640px) {
  .services .servicesSlider.style-2 .regularSlider {
    font-size: 0.875em
  }
}

@media only screen and (max-width: 450px) {
  .services .servicesSlider.style-2 .regularSlider {
    height: 31.25em
  }
}

.services .servicesSlider.style-2 .regularSlider .slick-list,
.services .servicesSlider.style-2 .regularSlider .slick-track {
  height: 100%
}

.services .servicesSlider.style-2 .regularSlider .slide {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

@media only screen and (max-width: 450px) {
  .services .servicesSlider.style-2 .regularSlider .slide {
    padding-bottom: 9.375em
  }
}

.services .servicesSlider.style-2 .regularSlider .slide .wrapper {
  height: 100%
}

.services .servicesSlider.style-2 .regularSlider .slide .head {
  height: 100%;
  text-align: center;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 4.6875em;
  font-weight: 500;
  color: #fff;
  position: relative
}

@media only screen and (max-width: 640px) {
  .services .servicesSlider.style-2 .regularSlider .slide .head {
    font-size: 3.125em
  }
}

.services .servicesSlider.style-2 .regularSlider .slide .head span {
  position: relative;
  display: block
}

.services .servicesSlider.style-2 .regularSlider .slide .head span:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -0.4em;
  width: 6.2666666667em;
  height: 0.0533333333em;
  background: #52d4ff;
  margin-left: -3.1333333333em
}

@media only screen and (max-width: 640px) {
  .services .servicesSlider.style-2 .regularSlider .slide .head span:before {
    width: 4em;
    margin-left: -2em
  }
}

.services .servicesSlider.style-2 .pager .paginationSlider {
  bottom: 1.25em
}

.services .servicesSlider.style-2 .pager .paginationSlider .slide {
  text-transform: none
}

.services .servicesSlider.style-2 .pager .paginationSlider .slide.active,
.services .servicesSlider.style-2 .pager .paginationSlider .slide.slick-current {
  color: #fff;
  font-size: 1.3125em;
  margin: 0 0.9523809524em;
  padding: 0.7142857143em 0
}

.services .servicesSlider.style-2 .pager .paginationSlider .slide.active:before,
.services .servicesSlider.style-2 .pager .paginationSlider .slide.slick-current:before {
  top: 100%;
  margin-top: -2px;
  border-color: #fff
}

.services .sourcingNumbers {
  padding-bottom: 5em
}

.services .sourcingNumbers .numbers {
  overflow: hidden
}

.services .sourcingNumbers .numbers .number {
  width: 25%;
  float: left;
  text-align: center;
  padding: 0 1.875em
}

@media only screen and (max-width: 1024px) {
  .services .sourcingNumbers .numbers .number {
    width: 50%;
    margin-bottom: 3.125em
  }

  .services .sourcingNumbers .numbers .number:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {
  .services .sourcingNumbers .numbers .number {
    width: 100%
  }
}

.services .sourcingNumbers .numbers .number .circle {
  border: 0.125em solid #dde3f0;
  background: #fff;
  width: 12.5em;
  height: 12.5em;
  border-radius: 100%;
  margin: 0 auto 1.25em auto;
  padding: 0.5em
}

.services .sourcingNumbers .numbers .number .circle .circleHelper {
  width: 100%;
  height: 100%;
  background: #15165c;
  border-radius: 100%;
  position: relative;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.services .sourcingNumbers .numbers .number .circle .circleHelper:before {
  content: '';
  position: absolute;
  top: 0.4375em;
  left: 0.4375em;
  right: 0.4375em;
  bottom: 0.4375em;
  border-radius: 100%;
  border: 0.125em solid #0eabe0;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.services .sourcingNumbers .numbers .number .circle .circleHelper .value {
  position: relative;
  z-index: 3;
  font-size: 3.125em;
  color: #fff;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 100;
  line-height: 3.6em
}

.services .sourcingNumbers .numbers .number .circle:hover .circleHelper {
  background: #a5e0f4
}

.services .sourcingNumbers .numbers .number .circle:hover .circleHelper:before {
  background: #0eabe0
}

.services .sourcingEasy {
  background: url(../img/services/sourcingEasy.jpg) no-repeat center;
  background-size: cover;
  background-attachment: fixed;
  padding-bottom: 3.75em;
  padding-right: 4em;
  padding-left: 1em;
}

@media (max-width: 1200px) {
  .services .sourcingEasy {
    padding-right: 0;
    padding-left: 0;
  }
}

.services .sourcingEasy .card {
  background: #fff;
  margin-top: 1.25em;
  margin: 1.25em -2.5em;
  padding: 1.875em 3.125em 0.625em;
  position: relative
}

.services .sourcingEasy .card::after {
  clear: both;
  content: "";
  display: table
}

@media only screen and (max-width: 1024px) {
  .services .sourcingEasy .card {
    margin-left: 0;
    margin-right: 0
  }
}

.services .sourcingEasy .card .departmentsList .top {
  padding-top: 1.25em
}

.services .sourcingEasy .card:before {
  content: '';
  width: 3.75em;
  height: 3.75em;
  border: 0.375em solid #40cfff;
  border-bottom: none;
  border-right: none;
  position: absolute;
  left: -1.5625em;
  top: -1.5625em
}

.services .sourcingEasy .card:after {
  content: '';
  width: 3.75em;
  height: 3.75em;
  border: 0.375em solid #40cfff;
  border-top: none;
  border-left: none;
  position: absolute;
  right: -1.5625em;
  bottom: -1.5625em
}

.services .qualityLabel {
  background: #0064b1;
  overflow: hidden;
  padding-bottom: 2.8125em
}

.services .qualityLabel .cards .card {
  width: 48%;
  float: left;
  margin-bottom: 3.125em;
  clear: both;
  position: relative
}

.services .qualityLabel .cards .card::after {
  clear: both;
  content: "";
  display: table
}

@media only screen and (max-width: 800px) {
  .services .qualityLabel .cards .card {
    width: 100%
  }
}

.services .qualityLabel .cards .card .image {
  position: absolute;
  left: -9.6875em;
  bottom: -1.5625em;
  z-index: 1
}

.services .qualityLabel .cards .card:nth-child(2n+2) {
  float: right;
  clear: none
}

.services .qualityLabel .cards .card:nth-child(2n+2) .image {
  left: auto;
  right: -9.6875em;
  bottom: -1.5625em
}

.services .qualityLabel .cards .card .whiteCard {
  position: relative;
  z-index: 2;
  background: #fff;
  width: 100%;
  padding: 1.875em 2.5em
}

.services .qualityLabel .cards .card table {
  position: relative
}

.services .qualityLabel .cards .card table td {
  vertical-align: top
}

.services .qualityLabel .cards .card table td img {
  margin-right: 1.5625em
}

@media only screen and (max-width: 450px) {
  .services .qualityLabel .cards .card table td img {
    margin-right: 0
  }
}

@media only screen and (max-width: 450px) {
  .services .qualityLabel .cards .card table {
    display: block
  }

  .services .qualityLabel .cards .card table tbody,
  .services .qualityLabel .cards .card table tr,
  .services .qualityLabel .cards .card table td {
    display: block
  }

  .services .qualityLabel .cards .card table .img {
    display: block;
    text-align: center
  }
}

.services .testingSteps {
  overflow: hidden;
  background: url(../img/pattern2.jpg);
  background-attachment: fixed;
  padding-bottom: 1.25em;
  padding-right: 3.75em;
}

@media (max-width: 1200px) {
  .services .testingSteps {
    padding-right: 0;
  }
}

.services .concepts {
  padding-bottom: 3.125em;
  overflow: hidden;
  position: relative
}

.services .concepts .wrapper.first {
  position: relative;
  z-index: 2
}

.services .concepts .wrapper.first .wrapper {
  position: relative
}

.services .concepts .background {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f5f6f6
}

.services .concepts .image {
  line-height: 0;
  padding: 0.9375em;
  background: #fff;
  box-shadow: 0 0 21px rgba(2, 2, 2, 0.19);
  position: relative;
  z-index: 2
}

.services .concepts .description {
  text-align: center;
  margin-top: 3.75em;
  position: relative;
  z-index: 2
}

.services .branding {
  background: #0280dd;
  overflow: hidden
}

.services .branding .productsSlider {
  background: #fff;
  position: relative;
  z-index: 1
}

.services .branding .productsSlider>.wrapper.first {
  position: relative
}

.services .branding .productsSlider>.wrapper.first .wrapper {
  position: relative
}

.services .branding .productsSlider>.wrapper.first .wrapper:before {
  content: '';
  position: absolute;
  width: 200%;
  top: 0;
  bottom: 0;
  right: 100%;
  background: #fff;
  z-index: 99
}

.services .branding .productsSlider>.wrapper.first .wrapper:after {
  content: '';
  position: absolute;
  width: 200%;
  top: 0;
  bottom: 0;
  left: 100%;
  background: #fff;
  z-index: 99
}

.services .branding .productsSlider .slides {
  text-align: center;
  margin: 0;
  position: relative;
  z-index: 9
}

.services .branding .productsSlider .slides .prev,
.services .branding .productsSlider .slides .next {
  position: absolute;
  font-size: 1.75em;
  color: #131c49;
  margin-top: -0.5em;
  top: 50%;
  cursor: pointer;
  z-index: 999
}

.services .branding .productsSlider .slides .prev {
  left: 0
}

.services .branding .productsSlider .slides .next {
  right: 0
}

.services .branding .productsSlider .slides .slick-list {
  overflow: visible
}

.services .branding .productsSlider .slides .slide {
  display: inline-block;
  text-align: center;
  margin: 0 3.125em;
  padding: 1.875em 0;
  float: none;
  position: relative;
  cursor: pointer
}

.services .branding .productsSlider .slides .slide:before {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-top-color: #fff;
  border-width: 16px;
  margin-left: -16px;
  margin-top: -16px;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s
}

.services .branding .productsSlider .slides .slide.slick-current:before {
  margin-top: 0;
  opacity: 1
}

.services .branding .productsSlider .slides .slide .image {
  line-height: 0
}

.services .branding .productsSlider .slides .slide .image img {
  display: inline-block
}

.services .branding .productsSlider .slides .slide .name {
  font-weight: 300;
  padding-top: 1.875em
}

.services .branding .productsSlider .slides2 {
  margin: 0
}

.services .branding .productsSlider .slides2 .slide {
  padding: 4.375em 0;
  background-position: bottom center;
  background-repeat: no-repeat
}

.services .branding .productsSlider .slides2 .slide img {
  display: inline-block
}

.services .branding .productsSlider .slides2 .slide .left.side {
  width: 55%;
  text-align: center
}

@media only screen and (max-width: 1024px) {
  .services .branding .productsSlider .slides2 .slide .left.side {
    width: 50%
  }
}

@media only screen and (max-width: 640px) {
  .services .branding .productsSlider .slides2 .slide .left.side {
    width: 100%;
    max-width: 80%;
    margin: 0 auto 1.875em auto;
    float: none;
    overflow: hidden
  }
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider {
  margin: 0
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider .prev,
.services .branding .productsSlider .slides2 .slide .left.side .subslider .next {
  font-size: 1.75em;
  color: #fff;
  position: absolute;
  z-index: 3;
  margin-top: -0.875em;
  top: 50%;
  cursor: pointer
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider .prev {
  left: 0
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider .next {
  right: 0
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider .image {
  line-height: 0
}

@media only screen and (max-width: 1024px) {
  .services .branding .productsSlider .slides2 .slide .left.side .subslider .image {
    padding: 0 3.125em
  }
}

.services .branding .productsSlider .slides2 .slide .left.side .subslider img {
  display: inline-block
}

.services .branding .productsSlider .slides2 .slide .right.side {
  width: 40%
}

@media only screen and (max-width: 1024px) {
  .services .branding .productsSlider .slides2 .slide .right.side {
    width: 45%
  }
}

@media only screen and (max-width: 640px) {
  .services .branding .productsSlider .slides2 .slide .right.side {
    width: 100%;
    float: none;
    overflow: hidden;
    text-align: center
  }
}

.services .branding .productsSlider .slides2 .slide .name {
  margin-top: 3.4375em;
  margin-bottom: 3.4375em
}

@media only screen and (max-width: 1024px) {
  .services .branding .productsSlider .slides2 .slide .name {
    margin-top: 0
  }
}

.services .branding .productsSlider .slides2 .slide .description .standardText,
.services .branding .productsSlider .slides2 .slide .description .aboutUs .directors .cards .card .frame .function,
.aboutUs .directors .cards .card .frame .services .branding .productsSlider .slides2 .slide .description .function,
.services .branding .productsSlider .slides2 .slide .description .departmentsList li .description,
.departmentsList li .services .branding .productsSlider .slides2 .slide .description .description,
.services .branding .productsSlider .slides2 .slide .description .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .services .branding .productsSlider .slides2 .slide .description .popText {
  color: #fff
}

.services .logistics .wrapper.first .wrapper {
  position: relative
}

.services .logistics .section {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.services .logistics .details {
  padding: 7.5em 0;
  overflow: hidden
}

@media only screen and (max-width: 800px) {
  .services .logistics .details {
    padding: 3.75em 0
  }
}

.services .logistics .details .card {
  background: #fff;
  padding: 2.5em
}

.services .logistics .details .card .standardText,
.services .logistics .details .aboutUs .directors .cards .card .frame .function,
.aboutUs .directors .cards .services .logistics .details .card .frame .function,
.services .logistics .details .card .departmentsList li .description,
.departmentsList li .services .logistics .details .card .description,
.services .logistics .details .card .fancybox-popup .fancybox-skin .popText,
.fancybox-popup .fancybox-skin .services .logistics .details .card .popText {
  text-align: justify
}

.services .logistics .schema-1 .card {
  width: 55%;
  position: relative;
  float: left
}

@media only screen and (max-width: 1024px) {
  .services .logistics .schema-1 .card {
    width: 65%
  }
}

.services .logistics .schema-1 .card:before {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-left-color: #fff;
  border-width: 18px;
  margin-top: -18px
}

@media only screen and (max-width: 800px) {
  .services .logistics .schema-1 .card {
    width: 100%
  }

  .services .logistics .schema-1 .card:before {
    display: none
  }
}

.services .logistics .schema-2 .card {
  width: 55%;
  float: right;
  position: relative
}

@media only screen and (max-width: 1024px) {
  .services .logistics .schema-2 .card {
    width: 65%
  }
}

.services .logistics .schema-2 .card:before {
  right: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-right-color: #fff;
  border-width: 18px;
  margin-top: -18px
}

@media only screen and (max-width: 800px) {
  .services .logistics .schema-2 .card {
    width: 100%
  }

  .services .logistics .schema-2 .card:before {
    display: none
  }
}

.services .consulting {
  overflow: hidden
}

.services .consulting .wrapper.first .wrapper {
  position: relative
}

.services .consulting .heading {
  position: absolute;
  z-index: 2;
  width: 100%;
  left: 0
}

.services .consulting .heading .desc {
  color: #fff
}

@media only screen and (max-width: 450px) {
  .services .consulting .heading {
    position: relative
  }

  .services .consulting .heading .desc {
    color: inherit
  }
}

.pillars {
  overflow: hidden;
  padding-bottom: 2.1875em
}

.pillars .elements {
  overflow: hidden;
  margin: 0 -3.4375em
}

.pillars .elements .element {
  width: 20%;
  float: left;
  text-align: center;
  padding: 0.625em 3.4375em;
  position: relative;
  margin-bottom: 3.4375em
}

@media only screen and (max-width: 1024px) {
  .pillars .elements .element {
    width: 33.33%
  }
}

@media only screen and (max-width: 640px) {
  .pillars .elements .element {
    width: 50%
  }
}

@media only screen and (max-width: 450px) {
  .pillars .elements .element {
    width: 100%
  }
}

.pillars .elements .element:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: #ebebeb
}

.pillars .elements .element:nth-child(5n+1):before {
  background: transparent
}

.pillars .elements .element .top {
  position: relative
}

.pillars .elements .element .top:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.9375em;
  border: 2px solid #dce2f0;
  border-bottom: none;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.pillars .elements .element .top:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.9375em;
  border: 2px solid #dce2f0;
  border-top: none;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.pillars .elements .element .top .icon {
  font-size: 4.0625em;
  color: #403e99;
  line-height: 2.3076923077em
}

.pillars .elements .element .name {
  font-size: 1.0625em;
  color: #525f70;
  padding-top: 1.4705882353em;
  margin: 0em -1.1764705882em
}

.pillars .elements .element--iris-blue .top:before,
.pillars .elements .element--iris-blue .top:after,
.pillars .elements .element:hover .top:before,
.pillars .elements .element:hover .top:after {
  border-color: #26b7e8
}

.trustedProducts {
  padding-bottom: 5.625em
}

@media only screen and (max-width: 800px) {
  .trustedProducts {
    padding-bottom: 3.125em
  }
}

.trustedProducts .wrapper.first .wrapper {
  position: relative
}

.trustedProducts .card {
  padding: 4.375em 0;
  position: relative
}

@media only screen and (max-width: 1400px) {
  .trustedProducts .card {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9)
  }

  .trustedProducts .card img {
    height: 31.25em
  }
}

@media only screen and (max-width: 800px) {
  .trustedProducts .card {
    padding: 0;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
  }
}

.trustedProducts .card .image {
  text-align: center;
  line-height: 0
}

@media only screen and (max-width: 800px) {
  .trustedProducts .card .image {
    display: none
  }
}

.trustedProducts .card .texts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

@media only screen and (max-width: 800px) {
  .trustedProducts .card .texts {
    position: relative;
    overflow: hidden
  }
}

.trustedProducts .card .texts .text {
  font-weight: 600;
  font-size: 1em;
  color: #373773;
  position: absolute;
  background: transparent;
  width: 12.5em;
  padding-left: 1.25em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s;
  -webkit-transition-property: color;
  -moz-transition-property: color;
  transition-property: color
}

.trustedProducts .card .texts .text:hover {
  color: #31c5f7
}

@media only screen and (max-width: 800px) {
  .trustedProducts .card .texts .text {
    position: relative;
    text-align: left;
    margin: 0 auto;
    float: left;
    width: 50%;
    margin: 1.875em 0 !important;
    top: auto !important;
    left: auto !important;
    position: relative
  }

  .trustedProducts .card .texts .text:nth-child(2n+1) {
    clear: both
  }
}

@media only screen and (max-width: 640px) {
  .trustedProducts .card .texts .text {
    float: none;
    width: 100%;
    text-align: center;
    padding: 0
  }

  .trustedProducts .card .texts .text:before {
    display: none
  }
}

.trustedProducts .card .texts .text:before {
  content: "\00BB";
  color: #26b7e8;
  position: absolute;
  left: 0;
  top: -1px
}

.trustedProducts .card .texts .text.pos-1 {
  top: 2%;
  left: 50%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-1-new {
  top: 7%;
  left: 52%
}

.trustedProducts .card .texts .text.pos-2 {
  left: 80%;
  top: 14%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-2-new {
  top: 22%;
  left: 80%
}

.trustedProducts .card .texts .text.pos-3 {
  top: 48.5%;
  left: 89%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-3-new {
  top: 58.5%;
  left: 84%
}

.trustedProducts .card .texts .text.pos-4 {
  top: 85%;
  left: 80%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-4-new {
  top: 84%;
  left: 74%
}

.trustedProducts .card .texts .text.pos-5 {
  top: 92%;
  left: 52%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-5-new {
  top: 84%;
  left: 37%
}

.trustedProducts .card .texts .text.pos-6 {
  top: 85%;
  left: 23%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-6-new {
  top: 60%;
  left: 24%
}

.trustedProducts .card .texts .text.pos-7 {
  top: 48.5%;
  left: 12%;
  margin-left: -6.25em
}

.trustedProducts .card .texts .text.pos-7-new {
  top: 22.5%;
  left: 26%
}

.trustedProducts .card .texts .text.pos-8 {
  top: 12%;
  left: 22%;
  margin-left: -6.25em
}

.slider {
  position: fixed;
  z-index: 2;
  left: 0;
  top: 5.9375em;
  width: 100%;
  bottom: 0;
  background: #1b1a5e;
  color: #fff
}

@media only screen and (max-width: 1024px) {
  .slider {
    position: relative;
    height: 37.5em;
    float: left;
    margin-top: -3.8125em;
    top: 0
  }
}

@media only screen and (max-width: 800px) {
  .slider {
    height: 28.125em;
    margin-top: 0
  }
}

@media only screen and (max-width: 450px) {
  .slider {
    font-size: 3.5555555556vw
  }
}

.slider .wrapper,
.slider .content,
.slider .elements,
.slider .element,
.slider .slick-list,
.slider .slick-track {
  height: 100%
}

.slider .slick-slider {
  margin: 0
}

.slider .prev,
.slider .next {
  position: absolute;
  margin-top: -0.5em;
  z-index: 99;
  opacity: 0.5;
  cursor: pointer;
  top: 50%;
  color: #fff;
  font-size: 3.25em;
  -webkit-transition: all 0.15s ease-out 0s;
  -moz-transition: all 0.15s ease-out 0s;
  transition: all 0.15s ease-out 0s
}

.slider .prev:hover,
.slider .next:hover {
  opacity: 1
}

.slider .prev {
  left: 2.6923076923em;
  left: 7%
}

@media only screen and (max-width: 1300px) {
  .slider .prev {
    left: 1%
  }
}

.slider .next {
  right: 2.6923076923em;
  right: 7%
}

@media only screen and (max-width: 1300px) {
  .slider .next {
    right: 1%
  }
}

.slider .background {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1)
}

.slider .content {
  text-align: center;
  position: relative
}

.slider .content .head {
  font-size: 5em;
  color: #b1b0fe;
  font-weight: 100;
  font-family: "Roboto", Arial, sans-serif
}

@media only screen and (max-width: 1024px) {
  .slider .content .head {
    font-size: 3.125em
  }
}

@media only screen and (max-width: 800px) {
  .slider .content .head {
    font-size: 2.6875em;
    padding: 0 0.4651162791em
  }
}

.slider .content .desc {
  color: #fff;
  font-size: 1.8125em;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 500
}

@media only screen and (max-width: 1024px) {
  .slider .content .desc {
    font-size: 1.25em
  }
}

@media only screen and (max-width: 800px) {
  .slider .content .desc {
    font-size: 1.0625em;
    padding: 0 1.1764705882em
  }
}

.slider .frameHelper {
  position: relative;
  z-index: 2
}

.slider .frameHelper>.box {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0
}

.slider .frameHelper>.box:before {
  content: '';
  position: absolute;
  bottom: 120%;
  left: 50%;
  margin-left: -12.8125em;
  width: 25.625em;
  height: 7.1875em;
  border: 0.375em solid #2ac1f4;
  border-bottom: none
}

@media only screen and (max-width: 1024px) {
  .slider .frameHelper>.box:before {
    border-width: 0.25em
  }
}

@media only screen and (max-width: 800px) {
  .slider .frameHelper>.box:before {
    display: none
  }
}

.slider .frameHelper>.box:after {
  content: '';
  position: absolute;
  top: 120%;
  left: 50%;
  margin-left: -12.8125em;
  width: 25.625em;
  height: 7.1875em;
  border: 0.375em solid #2ac1f4;
  border-top: none
}

@media only screen and (max-width: 1024px) {
  .slider .frameHelper>.box:after {
    border-width: 0.25em
  }
}

@media only screen and (max-width: 800px) {
  .slider .frameHelper>.box:after {
    display: none
  }
}

.slider .frame {
  position: relative;
  z-index: 1
}

.slider .frame>.box1 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0
}

.slider .frame>.box1:before {
  content: '';
  position: absolute;
  bottom: 120%;
  left: 50%;
  margin-left: -14.6875em;
  width: 29.375em;
  height: 9.0625em;
  border: 0.0625em solid rgba(58, 57, 124, 0.7);
  border-bottom: none
}

@media only screen and (max-width: 800px) {
  .slider .frame>.box1:before {
    display: none
  }
}

.slider .frame>.box1:after {
  content: '';
  position: absolute;
  top: 120%;
  left: 50%;
  margin-left: -14.6875em;
  width: 8.75em;
  height: 9.0625em;
  border: 0.0625em solid rgba(58, 57, 124, 0.7);
  border-top: none;
  border-right: none
}

@media only screen and (max-width: 800px) {
  .slider .frame>.box1:after {
    display: none
  }
}

.slider .frame .box2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0
}

.slider .frame .box2:after {
  content: '';
  position: absolute;
  top: 120%;
  right: 50%;
  margin-right: -14.6875em;
  width: 29.375em;
  width: 8.75em;
  height: 9.0625em;
  border: 0.0625em solid rgba(58, 57, 124, 0.7);
  border-top: none;
  border-left: none
}

@media only screen and (max-width: 800px) {
  .slider .frame .box2:after {
    display: none
  }
}

.slider .frame .link {
  position: absolute;
  bottom: -140%;
  text-align: center;
  width: 100%;
  left: 0
}

@media only screen and (max-width: 1024px) {
  .slider .frame .link {
    bottom: -205%
  }
}

@media only screen and (max-width: 640px) {
  .slider .frame .link {
    bottom: -45%;
    font-size: 0.875em
  }
}

.slider .frame .link a {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 100;
  text-transform: uppercase;
  letter-spacing: 0.4375em;
  color: #fff;
  display: inline-block
}

.slider .frame .link a span {
  display: block
}

.slider .frame .link a .icon,
.slider .frame .link a .icon-clone {
  position: absolute;
  font-size: 1.125em;
  left: 50%;
  top: 100%;
  margin-left: -0.5em;
  padding-top: 0.5555555556em;
  color: #0cade4
}

.slider .frame .link a .icon-clone {
  font-size: 0.5625em;
  opacity: 1;
  margin-top: 1.2222222222em
}

.standardText,
.aboutUs .directors .cards .card .frame .function,
.departmentsList li .description,
.fancybox-popup .fancybox-skin .popText {
  font-size: 1em;
  color: #697587;
  font-weight: 300;
  line-height: 1.625em
}

.standardText ul.styled,
.aboutUs .directors .cards .card .frame .function ul.styled,
.departmentsList li .description ul.styled,
.fancybox-popup .fancybox-skin .popText ul.styled {
  margin: 0;
  padding: 0;
  list-style: none
}

.standardText ul.styled li,
.aboutUs .directors .cards .card .frame .function ul.styled li,
.departmentsList li .description ul.styled li,
.fancybox-popup .fancybox-skin .popText ul.styled li {
  position: relative;
  padding: 0.3125em 0 0.3125em 2.8125em
}

.standardText ul.styled li:before,
.aboutUs .directors .cards .card .frame .function ul.styled li:before,
.departmentsList li .description ul.styled li:before,
.fancybox-popup .fancybox-skin .popText ul.styled li:before {
  font-family: 'icons';
  position: absolute;
  left: 0.625em;
  top: 0.25em;
  color: #403e99
}

.standardText a,
.aboutUs .directors .cards .card .frame .function a,
.departmentsList li .description a,
.fancybox-popup .fancybox-skin .popText a {
  color: #403e99;
  display: inline;
  position: relative
}

.standardText a:hover,
.aboutUs .directors .cards .card .frame .function a:hover,
.departmentsList li .description a:hover,
.fancybox-popup .fancybox-skin .popText a:hover {
  color: inherit
}

.standardText a.skype img,
.aboutUs .directors .cards .card .frame .function a.skype img,
.departmentsList li .description a.skype img,
.fancybox-popup .fancybox-skin .popText a.skype img {
  margin-right: 20px;
  position: relative;
  top: 3px
}

.tabsEngine>div {
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  transition: 0.2s;
  position: relative;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0)
}

.tabsEngine>div.before-hide {
  opacity: 0;
  -webkit-transform: translateX(3.125em);
  -moz-transform: translateX(3.125em);
  -ms-transform: translateX(3.125em);
  -o-transform: translateX(3.125em);
  transform: translateX(3.125em)
}

.tabsEngine>div.hide {
  opacity: 0
}

.tabsEngine>div.before-show {
  opacity: 0;
  -webkit-transform: translateX(-3.125em);
  -moz-transform: translateX(-3.125em);
  -ms-transform: translateX(-3.125em);
  -o-transform: translateX(-3.125em);
  transform: translateX(-3.125em)
}

.tabsEngine>div.show {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  opacity: 1
}

.formError .formErrorContent {
  background: #3d3d8b;
  border-color: #0eabe0;
  box-shadow: none;
  border-radius: 0;
  position: relative;
  white-space: nowrap
}

.formError .formErrorContent:before {
  top: 100%;
  left: 8px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-top-color: #0eabe0;
  border-width: 10px;
  margin-left: -10px
}

.formError .formErrorArrow {
  display: none
}

.verticalText {
  position: absolute;
  z-index: 2;
  top: 0px;
  left: 0;
  padding: 4.0625em 0;
  margin-left: -11.5625em
}

@media only screen and (max-width: 1300px) {
  .verticalText {
    margin-left: -2.1875em
  }
}

@media only screen and (max-width: 800px) {
  .verticalText {
    display: none
  }
}

.verticalText .position {
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%)
}

.verticalText .position>div {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-transform-origin: right top;
  -moz-transform-origin: right top;
  -ms-transform-origin: right top;
  -o-transform-origin: right top;
  transform-origin: right top;
  text-transform: uppercase;
  color: #292873;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 1.25em;
  font-weight: 300;
  letter-spacing: 3px
}

.verticalText .position>div>span {
  display: block
}

.verticalText.onBottom {
  top: auto;
  bottom: 0;
  margin-left: -10em
}

.verticalText.onBottom .position>div {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg)
}

.verticalText.onBottom .position>div>span {
  -webkit-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  transform: rotate(-180deg)
}

.verticalText.white .position>div {
  color: #fff
}

.verticalText.hidden {
  display: none
}

form .agreement input {
  -webkit-appearance: checkbox;
  appearance: auto;
  -moz-appearance: checkbox;
  -ms-appearance: checkbox;
  -o-appearance: checkbox;
}

form .agreement {
  color: #697587;
  position: relative;
}

.aboutUs .map .legend2 .line.sea {
  background: #0eabe0;
}

.aboutUs .map .legend2 .line.air {
  background: #ce86f0;
}

.aboutUs .map .legend2 .line.land {
  background: #ffbd3e;
}

.departmentsList li .top .title {
  width: auto;
}

.departmentsList li {
  padding: 0px 1.05em 0px 1.05em;
}

@media (max-width: 640px) {
  .departmentsList li {
    padding: 0px 2.1875em 0px 2.1875em;
  }
}

#gdpr-cookie-message {
  position: fixed;
  right: 30px;
  bottom: 30px;
  max-width: 375px;
  background-color: #16154e;
  padding: 20px;
  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.25);
  margin-left: 30px;
  z-index: 2;
  color: white;
}

#gdpr-cookie-advanced {
  display: none;
}

#gdpr-cookie-accept {
  float: right;
}

#gdpr-cookie-message button, button#ihavecookiesBtn {
  border: 1px solid #cfd6e5;
  background: transparent;
  color: white;
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: 400;
  padding: 7px;
  border-radius: 3px;
  margin-left: 15px;
  cursor: pointer;
  transition: all 0.3s ease-in;

}

#gdpr-cookie-message button:hover {
  background: #fff;
  border-color: #fff;
  color: #2d2d6e;
  transition: all 0.3s ease-in;
}

#gdpr-cookie-message p a {
  font-weight: bold;
}