/* clear styles */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* body bg style */
body {
    background: #051049;
    background-size: contain;
    background-repeat: no-repeat;
    overflow-x: hidden;
}


.global-wrap {
    overflow-x: hidden;
}

.wrap {
    width: 100%;
    //max-width: 1170px;
    margin: 0 auto;
    position: relative;
}

.wrap-details {
    max-width: 1170px;
}

.screen-item {
    transform-style: preserve-3d;
    transform: translateZ(0);
    position: relative;
    z-index: 2;
}

.bg-svg-arc {
    display: none;
    position: absolute;
    top: 0;
    transform: translate(0,-100%);
}


* {
    box-sizing: border-box;
}

.screen-item-inner {
    max-width: 1170px;
    margin: 0 auto;
    z-index: 2;
}

.curved_edge {
    position: absolute;
    left: -.5%;
    bottom: 99%;
    width: 101%;
    z-index: 1;
}

.curved_edge.edge_bottom {
    top: 100%;
    bottom: auto;
}

.screen-item-light {
    background: #f3f7fa;
}

.screen-item-white {
    background: #fff;
}


/* mobile */
@media ( max-width:1170px ) {
    .curved_edge {
        height: auto !important;
        max-height: 170px !important;
    }
    .curved_edge.edge_contetnt_bottom {
        bottom: -1px;
    }

    footer .wrap.screen-item-inner .row {
        margin: 0 20px;
    }
}


/* Hide Hubsport GDPR popup */
#hs-eu-cookie-confirmation#hs-eu-cookie-confirmation#hs-eu-cookie-confirmation {
    display: none!important;
}


/* additional margin for bottom cta-form form preventing GDPR links overlap */
.screen-item:last-of-type .form-lead {
    margin-bottom: 100px;
} /* VARIABLES */
:root {
    --blue-mid: #1c7ee7;
    --blue-light: #1EB6FF;
    --gray-mid: #9398A5;
    --bg-main: #021032;
    --bg-container-h2: #020D2A;
    --landing-gradient-1: linear-gradient(-45deg, #152554, #091842);
    --landing-gradient-2: linear-gradient(45deg, #1D63DC, #1EB6FF);
    --bg-editorial: #FAFBFC;
    --editorial-text-1: #213254;
    --editorial-text-2: #6B778C;
    --text-darkblue: #344563;
}



body {
    margin: 0;
    overflow-x: hidden;
}

.global-wrap {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    transition: margin-top 1s;
}

.logo__item {
    background-image: url("/icons/IO-Technologies_on_white.svg");
}





/* GRID */
.container {
    max-width: 1140px;
    margin: 30px auto;
    padding: 0 15px;
}

.row {
    margin: 0 -15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.subrow {
    flex-wrap: wrap;
}

div.row>div[class^="col"] {
    width: 100%;
    padding: 0 15px;
}

.col-12 {
    max-width: 100%;
}

.col-10 {
    max-width: 83.333333%;
}

.col-8 {
    max-width: 66.666667%;
}

.col-7 {
    max-width: 58.333333%;
}
.col-6 {
    max-width: 50%;
}
.col-5 {
    max-width: calc(100% - 58.333333%);
}
.col-4 {
    max-width: 33.333333%;
}
.col-3 {
    max-width: 24%;
}
.col-2 {
    max-width: 16.666666%;
}

.col-1 {
    max-width: 8.333333%;
}



.mw300 {
    max-width: 300px;
}

.mirrored {
    transform: scaleX(-1);
}

.tdn {
    text-decoration: none;
}

.link-arrow {
    padding-right: 10px;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--blue-light);
    color: #1EB6FF;
}
.link-arrow:after {
    content: '';
    position: absolute;
    margin-left: 10px;
    background: url("/icons/icon_next.svg") no-repeat center;
    background-size: 100%;
    width: 8px;
    height: 8px;
    min-height: 21px;
}

.tac {
    text-align: center;
}

.ofh {
    overflow: hidden;
}





/* particles style set */
div[class^="particles-"] {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
div[class^="particles-"] > svg {
    position: absolute;
    transition: all 20s linear;
}





/* media queries */
@media screen and (min-width: 1200px) {
    .-dn {
        display: none !important;
    }
}





@media screen and (max-width: 1199px) and (min-width: 576px) {
    .-dn {
        display: inherit;
    }

    .md-dn {
        display: none !important;
    }

    .col-md-flex {
        display: flex;
        justify-content: center;
    }

    div.row div.col-md-12 {
        width: 100%;
        max-width: 100%;
    }

    .col-md-6 {
        max-width: 50%;
        padding: 0 15px;
    }

    div[class^="col"] {
        margin: 10px auto;
    }
}





@media screen and (max-width: 575px) {
    .-dn {
        display: inherit;
    }

    .xs-dn {
        display: none !important;
    }

    .col-xs-12 {
        max-width: 100%;
        padding: 0 15px;
    }

    .col-xs-6 {
        max-width: 50%;
        padding: 0 15px;
    }

    .col-xs-2 {
        max-width: 16.666666%;
        padding: 0 15px;
    }

    .global-wrap>div[id^=page-] {
        margin-top: 70px;
    }
}
 /* styles for animations */
*[animate] { 
    opacity: 0;
    //visibility: hidden;
    transition:all 0.5s ease-in-out;  
}

*[animate].on { 
    opacity: 1; 
    //visibility: visible;  
}

/* slide animation */
*[animate="slide-left"] {
    transform: translate(20px,0);
}

*[animate="slide-right"] { 
    transform: translate(-20px,0); 
}

*[animate="slide-bottom"] { 
    transform: translate(0,-20px); 
}

*[animate="slide-top"] { 
    transform: translate(0,20px); 
}

*[animate="slide-left"].on, *[animate="slide-right"].on, *[animate="slide-bottom"].on, *[animate="slide-top"].on { 
    transform: translate(0,0); 
} 

/* pop animation */
*[animate="pop"] {
    transform: scale(0.6);
    transition:all 0.3s cubic-bezier(.6,1.22,.72,1.45); 
}

*[animate="pop"].on {
    transform: scale(1); 
}

/* fade animation */
*[animate="fade"] { 
    transition:all 0.9s ease-in-out;
}
 .arrows-sprite {
  background: url(https://i.onthe.io/smngoz4mb34qvhi73.272e71a5.png);
}

.ex-slide {
  text-align: center;
}

.ex-slide:before {
  content: "";
  height: 285px;
  display: inline-block;
  vertical-align: middle;
}

.ex-slide-item {
  width: 272.5px;
  height: 184px;
  overflow: hidden;
  border-radius: 6px;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
  box-shadow: 0 0 10px rgba(0, 0, 0, .2);
  -webkit-transition: all .6s ease-out;
  transition: all .6s ease-out;
  margin: 0 10px;
}

.ex-item-cover {
  text-align: center;
  font-size: 0;
  white-space: nowrap;
  overflow: hidden;
  height: 184px;
}

.ex-item-cover:before {
  content: "";
  height: 184px;
  display: inline-block;
  vertical-align: middle;
}

.ex-item-cover img {
  display: inline-block;
  vertical-align: middle;
  width: 110%;
  transform: translateX(-4.5%);
}

.ex-item-content {
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.ex-slide-item:hover {
  height: 285px;
}

.ex-slide-item:hover .ex-item-content {
  -webkit-transform: translateY(-178px);
  transform: translateY(-178px);
}

.ex-item-text {
  padding: 7px 30px;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 265px;
}
.ex-item-text p {
  margin: 0;
}

.ex-title {
  font-size: 20px;
  line-height: 27px;
  color: #494a59;
  font-weight: 400;
}

.ex-title-sm {
  font-size: 19px;
  line-height: 23px;
}

.ex-content {
  font-size: 16px;
  line-height: 26px;
  color: #85889b;
  font-weight: 300;
  margin: 20px 0;
  height: 78px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ex-link {
  font-size: 18px;
  line-height: 20px;
  color: #61adfc;
}

.ex-link:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(https://i.onthe.io/smngoz4mb34qvhi73.272e71a5.png) -20px -40px;
  background-size: 40px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 6px;
}

.ex-slider-dots {
  display: none;
  margin: 0 0 20px;
  text-align: center;
  font-size: 0;
}

.ex-dot {
  position: relative;
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  cursor: pointer;
  background: #d3dce5;
  margin: 5px;
}

.ex-dot:before {
  content: '';
  position: absolute;
  left: -5px;
  top: -5px;
  width: calc(100% + 10px);
  height: calc(100% + 10px);
}

.ex-dot.on {
  background: #55c4ff;
}

.ex-slider-buttons {
  display: none;
  text-align: center;
  margin: 0;
  padding: 5px 0;
}

.ex-button {
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 100%;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .3);
  margin: 3px;
  display: inline-block;
  position: relative;
  cursor: pointer;
}

.ex-button:before {
  content: "";
  width: 20px;
  height: 20px;
  background: url(https://i.onthe.io/smngoz4mb34qvhi73.272e71a5.png) 0 -100px;
  background-size: 40px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -10px 0 0 -10px;
}

.ex-button:hover:before {
  background-position-y: -120px;
}

.ex-button.ex-button-right:before {
  background-position-x: -20px;
}

/* add style to make movable */
.movable .ex-slider {
  overflow: hidden;
  width: calc(293px * 4);
  margin: 0 auto;
  position: relative;
  height: 290px;
}

.movable .ex-slide {
  white-space: nowrap;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: left .3s;
  transition: left .3s;
  font-size: 0;
}

.movable .ex-slide-item {
  white-space: normal;
}

.movable .ex-slider-dots,
.movable .ex-slider-buttons {
  display: block;
}



/* media queries */
@media screen and (max-width: 1199px) {
  .expertise-slider-container .ex-slider {
    width: 100%;
  }
}
 .row {
  font-size: 0;
  white-space: nowrap;
  letter-spacing: 0;
}

.row * {
  white-space: normal;
}

.col {
  white-space: normal;
  position: relative;
  font-size: 13px;
  letter-spacing: normal;
  display: inline-block;
  vertical-align: top;
  padding: 30px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -mebkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
}

.col.full_height, .row.full_height { height:100%; }

.col[data-align="left"] { text-align:left; }
.col[data-align="right"] { text-align:right; }
.col[data-align="center"] { text-align:center; }

.col.clear { padding:0; }
.col.clear_right { padding:0 30px 0 0; }
.col.clear_left { padding:0 0 0 30px; }
.col.clear_left_top { padding:30px 0 0 30px; }
.col.clear_top_bottom { padding:30px 0 30px; }


.col_0 { width:0; }
.col_1 { width:8.33333333333%; }
.col_2 { width:16.6666666667%; }
.col_3 { width:25%; }
.col_4 { width:33.3333333333%; }
.col_5 { width:41.6666666667%; }
.col_6 { width:50%; }
.col_7 { width:58.3333333333%; }
.col_8 { width:66.6666666667%; }
.col_9 { width:75%; }
.col_10 { width:83.3333333333%; }
.col_11 { width:91.6666666667%; }
.col_12 { width:100%; } button {
    font-size:12px; 
    font-weight:bold;
    text-transform: uppercase;
    padding: 12px 20px;  
    outline:none;
    background:#4eb7ff;
    border:solid #4eb7ff 1px; 
    color: white;
    border-radius:3px;  
    /*-webkit-box-shadow: 2px 2px 11px 0px rgba(0,0,0,0.19);*/
    /*-moz-box-shadow: 2px 2px 11px 0px rgba(0,0,0,0.19);*/
    /*box-shadow: 2px 2px 11px 0px rgba(0,0,0,0.19); */
    transition:all 0.3s ease;
}

.inner-form-lead button.close {
    margin-top: 20px;
    width: 100px;
}

button:hover, button:active, button:focus {  
    cursor: pointer;
    background:#3ea1e4;
    /*-webkit-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);*/
    /*-moz-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29); */
    /*box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);*/
}

button.btn-border {
    color: #fff;
    border: 1px solid #fff;
    background: none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none; 
    box-shadow:none;
}

button.btn-border:hover  {
   color: white;
   cursor: pointer;
    background:#3ea1e4;
    -webkit-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);
    -moz-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29); 
    box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);
}

button.bnt-arrow { 
    background-color: #4eb7ff; 
    position: relative;
    border:none;
    width: 45px;
    height: 45px;    
    padding: 0;
    border-radius: 50%;
    background-image: url('https://i.onthe.io/smngoz7ma4222p6b1.6af086cd.png');
    background-size: 16px; 
    background-repeat: no-repeat;
    background-position: 11px 12px;
    -webkit-box-shadow: none; 
    -moz-box-shadow: none; 
    box-shadow: none;  
    transform-origin: center center;
}

button.bnt-arrow:before {
    content: ''; 
    position: absolute;
    left:-8px;
    top:-8px;
    right:-8px;
    bottom:-8px;  
    background-color: #4eb7ff;
    border-radius: 50%;
    opacity: 0.3;
    transition:transform .15s cubic-bezier(.6,1.22,.72,1.45); 
}

button.bnt-arrow.bnt-arrow-right {
    background-position: 12px 11px;
}

button.bnt-arrow:hover {
    cursor: pointer;
}

button.bnt-arrow:hover:before {
    transform: scale(1.2); 
}

button.white {
    background-color: #fff;
    color: #050f49;
    border-color: #fff;
} .login__button_item {
    min-height: 40px;
    padding: 0 15px;
    border: 1px solid #fff;
    border-radius: 4px;
    background: none;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    outline: none;
    transition: background-color .3s, border-color .3s, color .3s;
}
.login__button_item:hover {
    background-color: var(--blue-mid);
    border-color: var(--blue-mid);
}
 .inputs-group {
    background: white;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.12);
    -moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.12);
    box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.12);  
    margin:25px 0;
    /*overflow: hidden;*/
    position: relative;
}

.inputs-group input {
    display: block;
    width: 100%;
    border:none;
    background: none;
    margin:0;
    padding:20px;
    font-size:15px;   
    outline:none;  
    border-bottom:solid rgba(0,0,0,0.05) 1px; 
    transition:all 0.3s ease; 
}

.inputs-group input:focus {
    -webkit-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.35);  
    -moz-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.35);
    box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.35); 
}

.inputs-group input:last-child { border:none; }


.inputs-group input[type=number]::-webkit-outer-spin-button,
.inputs-group input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
} #cliens-map { 
  height: 430px;
  position: relative;
  width: 100%;
}

.maps-frame {
  height: 430px;
  width: 100%;
} @media print {
    
    header { display: none; }   
    footer { display: none; }    
    
} .contet-slider {
    overflow: hidden;  
}

.contet-slider.contet-slider-vertical .contet-slider-nav {
    position: absolute;
    left:50px; 
    top:50%;
    text-align: left;
    transform:translate(0,-50%); 
}

.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item {
    font-size:15px; 
    padding: 15px 20px; 
    border-radius: 3px;
    margin:3px 0; 
    font-weight: normal;
    cursor: pointer;
}

.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item:hover {
    background-color: rgba(0,0,0,0.03);
    cursor: pointer;
} 

.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on {
    color:white;  
    -webkit-box-shadow: inset -1px -1px 5px 0px rgba(0,0,0,0.19);
    -moz-box-shadow: inset -1px -1px 5px 0px rgba(0,0,0,0.19);
    box-shadow: inset -1px -1px 5px 0px rgba(0,0,0,0.19);
}

.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.eic { background-color:#4eb7ff; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.me { background-color:#27b7a4; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.hm { background-color:#af7fc6; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.ceo { background-color:#dd7d8f; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.author { background-color:#3fccea; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.smm { background-color:#f34983; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.pe { background-color:#81be82; }
.contet-slider.contet-slider-vertical .contet-slider-nav .nav-item.on.se { background-color:#6989d7; }

.contet-slider.contet-slider-vertical .contet-slider-data {
    position: absolute;
    left:30%;
    top:50%; 
    transform:translate(0,-50%); 
}

.contet-slider.contet-slider-vertical .contet-slider-data .data-item {
    position: absolute;
    left: 50%;
    top:50%;
    transform:translate(-50%,-50%); 
    opacity: 0;
    visibility: hidden;
    transition:all 0.5s ease-in;  
    height: 600px;  
}


.contet-slider.contet-slider-vertical .contet-slider-data .data-item.on {
    opacity: 1;
    visibility: visible; 
} .row__table {
    margin: 50px -120px;
    box-shadow: 0 2px 23px 0 rgba(13, 15, 28, 0.14);
    overflow: hidden;
    transition: margin .5s;
}

.row__table .row_wrap {
    width: 100%;
}

.row__table .table {
    margin: 15px 30px;
    transition: margin .5s;
}

.row__table .table__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #BFC2DD;
    min-height: 50px;
    padding: 15px 0;
}
.row__table .table__row:last-of-type {
    border: none;
}
.row__table .table__row:nth-of-type(even) {
    background-color: #F8F8FB;
}

.row__table .table__col-a {
    width: 60%;
}

.row__table .table__col-b {
    /*display: flex;*/
    /*justify-content: center;*/
    width: 20%;
    text-align: center;
}

.row__table .table__p_header {
    margin: auto 10px;
    font-size: 17px;
    font-weight: 500;
}

.row__table .table__col-b .table__img_header {
    display: none;
    width: 50px;
}

.row__table .table__p {
    margin: auto 25% auto 10px;
    font-size: 15px;
    font-weight: 400;
}

.row__table .table__row > div[class^="table__col-"]:last-child > p:not(.table__p):not(.table__p_header) {
    margin: 0;
}





/*-------- media quaries --------*/
@media screen and (max-width: 1199px) {
    .row__table {
        margin: 50px 0;
    }

    .row__table .table__p_header,
    .row__table .table__p {
        margin: auto 15% auto 30px;
    }

    .row__table .table__col-b .table__p_header {
        display: none;
    }

    .row__table .table__col-b .table__img_header {
        display: initial;
    }
}



@media screen and (max-width: 575px) {
    div.row__table {
        width: calc(100% + 40px);
        margin: 50px -20px;
    }

    .row__table div.table {
        margin: 0;
    }

    .row__table .table__p_header,
    .row__table .table__p {
        margin: auto 15% auto 20px;
    }

    .row__table .table__row > div[class^="table__col-"]:last-child {
        justify-content: flex-end;
        width: fit-content;
        margin-right: 20px;
    }
}
 @font-face {
    font-family: 'Museo Sans Cyrl';
    src: url('/museosanscyrl_900.woff2') format('woff2'),
         url('/museosanscyrl_900.woff') format('woff');
    font-weight: 900;
    font-style: normal;
} .success-list {
    font-size: 16px;
    color: #85889b;
    font-weight: 300;
    max-width: 485px;
    line-height: 26px;
    text-align: left;
}

.success-list .success-item {
    padding: 20px 0 20px 50px;
    position: relative;
    height: 100px;
}

.success-list .success-item b {
    font-weight: 400;
}

.success-list .success-item:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    left: 0;
    top: 30px;
    background: #86ead9;
    box-shadow: 0 0 0 15px #e4f5f5, 0 0 0 16px #86ead9;
    border-radius: 100%;
}

.success-list .success-item:after {
    content: "";
    width: 1px;
    height: 50px;
    position: absolute;
    top: 58px;
    left: 3px;
    background-image: -moz-linear-gradient( 90deg, #55c4ff 0%, #86ead9 100%);
    background-image: -webkit-linear-gradient( 90deg, #55c4ff 0%, #86ead9 100%);
    background-image: -ms-linear-gradient( 90deg, #55c4ff 0%, #86ead9 100%);
}

.success-list .success-item:nth-child(2):before {
    background: #55c4ff;
    box-shadow: 0 0 0 15px #deeffa, 0 0 0 16px #55c4ff;
}

.success-list .success-item:nth-child(2):after {
    background-image: -moz-linear-gradient( 90deg, #7569e2 0%, #55c4ff 100%);
    background-image: -webkit-linear-gradient( 90deg, #7569e2 0%, #55c4ff 100%);
    background-image: -ms-linear-gradient( 90deg, #7569e2 0%, #55c4ff 100%);
}

.success-list .success-item:nth-child(3):before {
    background: #7569e2;
    box-shadow: 0 0 0 15px #e2e3f6, 0 0 0 16px #7569e2;
}

.success-list .success-item:nth-child(3):after {
    background-image: -moz-linear-gradient( 90deg, #dc87c8 0%, #7569e2 100%);
    background-image: -webkit-linear-gradient( 90deg, #dc87c8 0%, #7569e2 100%);
    background-image: -ms-linear-gradient( 90deg, #dc87c8 0%, #7569e2 100%);
}

.success-list .success-item:nth-child(4):before {
    background: #dc87c8;
    box-shadow: 0 0 0 15px #f0e7f3, 0 0 0 16px #dc87c8;
}

.success-list .success-item:nth-child(4):after {
    display: none;
} body {
    color:#112750;
    line-height: normal;   
    font-size: 15px;
    font-weight: 400;  
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    transition: opacity 1s;
}
body.loading {
    opacity: .3;
}

/* text color */ 
.text-color-gray      { color:#314c5e; } 
.text-color-white     { color:white; }
.text-color-blue      { color:#4eb7ff; }


/* text paragraph */
p { 
    margin:5px 0; 
    font-weight: normal;  
    font-size: 20px;
    line-height: 1.5;
} 

/* text opacity */
.text-opacity-fade      { opacity: 0.4; }


/* text weight */
h1,h2,h3,h4,h5,h6,.text-weight-bold, b { font-weight:bold; }   


/* text size */
h1 { font-size:40px; }
h2 { font-size:32px; } 
h3 { font-size:26px; }
h4 { font-size:24px; } 
h5 { font-size:18px; }
h6 { font-size:15px; } 
.text-size-xlarge { font-size:32px; } 
.text-size-large  { font-size:32px; }
.text-size-medium { font-size:24px; }
.text-size-small  { font-size:18px; }
.text-size-xsmall { font-size:15px; }
.text-size-xxsmall { font-size:12px; }

@media (max-width: 1170px) { 
    // h1 { font-size:30px; }
    // h2 { font-size:22px; } 
    // h3 { font-size:18px; }
    // h4 { font-size:15px; } 
    // h5 { font-size:13px; }
    // h6 { font-size:12px; } 
    // .text-size-xlarge { font-size:30px; } 
    // .text-size-large  { font-size:18px; }
    // .text-size-medium { font-size:15px; }
    // .text-size-small  { font-size:13px; }
    // .text-size-xsmall { font-size:12px; }
    // .text-size-xxsmall { font-size:11px; } 
}

/* text align */
.text-align-center { text-align:center; }
.text-align-left { text-align:left; }
.text-align-right { text-align:right; } 

/* text transform */
.text-transform-upper { text-transform:uppercase; }
.text-transform-cap { text-transform:capitalize; }

/* links */
a { color:inherit; text-decoration: none; }

.hgroup {
    position: relative;
    font-size: 16px;
    padding: 2.5em 0;
    z-index: 3;
}
.hgroup.no-padding {
    paddin: 0;
}

.hgroup.hgroup-big {
    font-size: 22px;
}
.hgroup.hgroup-big .h2 {
    font-weight: 500;
}
.hgroup.hgroup-big .h3 {
    opacity: .3;
}

.hgroup .h1 {
    color: #d8dbea;
    opacity: .22;
    font-size: 6em;
    line-height: 1;
    font-weight: 900;
    font-family: Museo Sans Cyrl, Helvetica Neue, Helvetica, Arial, sans-serif;
    letter-spacing: -.05em;
}

.hgroup .h2 {
    color: #494a59;
    font-size: 2.3262em;
    line-height: 1;
    margin-top: -1em;
    font-weight: bold;
    position: relative;
}

.hgroup .h3,
.hgroup .h3 p {
    color: #b0b3c1;
    font-size: 1em;
    margin: 1em auto 0;
    font-weight: 300;
    line-height: 1.3;
}

.hgroup .h3 p {
    max-width: 800px;
    margin: 2em auto;
    color: #7d8093;
    white-space: normal;
}

.hgroup .h3 p:first-child {
    margin-top: 3em;
}

.hgroup.dark-bg .h1 {
    opacity: .02;
}
.hgroup.dark-bg .h1,
.hgroup.dark-bg .h2,
.hgroup.dark-bg .h3,
.hgroup.dark-bg .h3 p {
    color: #fff;
}

.hgroup ul.text-list { 
    padding: 15px 20px;
}

.hgroup ul.text-list li {
    list-style-type: none;
    margin: 15px 0;
    position: relative;
    font-weight: 300;
    opacity: 0.4;
}

.hgroup ul.text-list li:before {
    content: '';
    position: absolute;
    left:-20px;
    width: 8px;
    height: 8px;
    background: #112750;
    border-radius: 50%;
    opacity: 0.5;
    top:50%;
    transform: translate(0,-50%);
}

.page-head .hgroup .h2 {
    font-size: 4em;
}

.page-head .hgroup .h3 {
    font-size: 1.3333em;
    line-height: 1.5;
    max-width: 750px;
}


.button__item {
    display: inline-block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    padding: 0 10px;
    font-size: 18px;
    min-width: 130px;
    max-width: 180px;
    border: none;
    background-color: #1eb6ff;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    outline: none;
    cursor: pointer;
    transition: color .3s, background-color .3s, opacity .3s;
    text-decoration: none;
}
.button__item:hover {
    background-color: #0295F6;
}

.button__item.white {
    background-color: #fff;
    color: #050f49;
}
.button__item.white:hover {
    background-color: #fff;
    color: #0295F6;
} .article-preview {
    width: 470px;
    margin:70px auto;
}

.article-preview__title {
    margin-bottom:15px;
}

.article-preview .article-preview__img img {
    width: 100%;
    border-radius: 3px;
}

.article-preview .article-preview__meta {
    margin:15px 0;
}

.article-preview .article-preview__meta * {
    display: inline-block;
    vertical-align: middle;
}

.article-preview .article-preview__meta img {
   height: 25px;
   margin-right:10px;
   margin-bottom:0; 
}

.article-preview .article-preview__desc {
    margin:15px 0 0 0;
}

.article-preview .article-preview__link {
    color:#61adfc;
    margin-top:15px;
    padding-right:30px;
    background-image: url('https://i.onthe.io/smngoz6p3sm6jed4l.a6831450.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 20px;
    transition:padding 0.15s ease-in-out;
    display: inline-block;
}
 
.article-preview .article-preview__link:hover {
    cursor: pointer;
    padding-right: 37px;
}


@media(max-width: 768px) {
    .case-content-landing.case-content-text .wrap {
        padding: 0;
        max-width:100%;
    }
    .article-preview {
        width: 100%;
        margin:70px auto;
    }
} .gradient-bg-bright {
    background-color: #4b31a6;
    background-image: -moz-linear-gradient( -38.66deg, rgb(246,230,185) 0%, rgb(182,145,179) 9%, rgb(118,59,173) 32%, rgb(58,50,164) 75%);
    background-image: -webkit-linear-gradient( -38.66deg, rgb(246,230,185) 0%, rgb(182,145,179) 9%, rgb(118,59,173) 32%, rgb(58,50,164) 75%);
    background-image: -ms-linear-gradient( -38.66deg, rgb(246,230,185) 0%, rgb(182,145,179) 9%, rgb(118,59,173) 32%, rgb(58,50,164) 75%);
    background-image: linear-gradient( -38.66deg, rgb(246,230,185) 0%, rgb(182,145,179) 9%, rgb(118,59,173) 32%, rgb(58,50,164) 75%);
}

.screen-request-general {
    padding: 10% 0 5%;
    z-index: 0;
    background-image: url('/background1.svg');
    background-color: #050f49;
    background-position: center;
    background-size: cover;
}

.main-roles-details-bg {
    position: absolute;
    top:100px; 
    left:0px;
    right:0px;
    height:530px;
    background: red;
    z-index: 9999; 
    border-radius:5px;  
    -webkit-box-shadow: 0px 0px 52px 1px rgba(0,0,0,0.59);   
    -moz-box-shadow: 0px 0px 52px 1px rgba(0,0,0,0.59);
    box-shadow: 0px 0px 52px 1px rgba(0,0,0,0.59); 
    transition:all 1.0s cubic-bezier(.37,.19,0,1);
    -webkit-transition:all 0.5s cubic-bezier(.37,.19,0,1);
    -ms-transition:all 0.5s cubic-bezier(.37,.19,0,1);
    -moz-transition:all 0.5s cubic-bezier(.37,.19,0,1);   
} 

.main-roles-details-bg:before {
    position: absolute;
    content: '';
    left:0;
    righT:0;
    bottom:0;
    top:0;
    border-radius:5px;  
} 

.main-roles-details-bg.on, .main-roles-details-bg.on:before, .main-roles-details-bg.on:after {
    border-radius: 10px; 
}

.main-roles-details .main-roles {
    position: absolute;
    top: 550px; 
    left: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transition:all 1s ease;
}

.details-slide .form-lead {
    position: absolute;
    padding: 10px;
    bottom: 50px;
}

.details-slide .form-lead button { 
    position: absolute;
    righT:20px;
    top:50%;
    transform: translate(0,-50%); 
}

.main-roles-details.on .main-roles {
    opacity: 1;
    visibility: visible; 
}

.main-roles-details[data-role="do"] .main-roles-details-bg {   
    background: rgba(145,78,172,1);
    background: -moz-linear-gradient(left, rgba(145,78,172,1) 0%, rgba(234,120,231,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(145,78,172,1)), color-stop(100%, rgba(234,120,231,1)));
    background: -webkit-linear-gradient(left, rgba(145,78,172,1) 0%, rgba(234,120,231,1) 100%);
    background: -o-linear-gradient(left, rgba(145,78,172,1) 0%, rgba(234,120,231,1) 100%);
    background: -ms-linear-gradient(left, rgba(145,78,172,1) 0%, rgba(234,120,231,1) 100%);
    background: linear-gradient(to right, rgba(145,78,172,1) 0%, rgba(234,120,231,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#914eac', endColorstr='#a360d2', GradientType=1 );
}

.main-roles-details[data-role="eic"] .main-roles-details-bg {
    background: rgba(63,169,235,1);
    background: -moz-linear-gradient(left, rgba(63,169,235,1) 0%, rgba(60,215,222,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(63,169,235,1)), color-stop(100%, rgba(60,215,222,1)));
    background: -webkit-linear-gradient(left, rgba(63,169,235,1) 0%, rgba(60,215,222,1) 100%);
    background: -o-linear-gradient(left, rgba(63,169,235,1) 0%, rgba(60,215,222,1) 100%);
    background: -ms-linear-gradient(left, rgba(63,169,235,1) 0%, rgba(60,215,222,1) 100%);
    background: linear-gradient(to right, rgba(63,169,235,1) 0%, rgba(60,215,222,1) 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3fa9eb', endColorstr='#3cbbde', GradientType=1 );
}

.main-roles-details[data-role="me"] .main-roles-details-bg {
    background: rgba(12,177,152,1); 
    background: -moz-linear-gradient(left, rgba(12,177,152,1) 0%, rgba(32,209,203,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(12,177,152,1)), color-stop(100%, rgba(32,209,203,1)));
    background: -webkit-linear-gradient(left, rgba(12,177,152,1) 0%, rgba(32,209,203,1) 100%);
    background: -o-linear-gradient(left, rgba(12,177,152,1) 0%, rgba(32,209,203,1) 100%);
    background: -ms-linear-gradient(left, rgba(12,177,152,1) 0%, rgba(32,209,203,1) 100%);
    background: linear-gradient(to right, rgba(12,177,152,1) 0%, rgba(32,209,203,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0cb198', endColorstr='#20d1cb', GradientType=1 );
}

.main-roles-details[data-role="ceo"] .main-roles-details-bg { 
    background: rgba(183,72,94,1);
    background: -moz-linear-gradient(left, rgba(183,72,94,1) 0%, rgba(216,96,146,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(183,72,94,1)), color-stop(100%, rgba(216,96,146,1)));
    background: -webkit-linear-gradient(left, rgba(183,72,94,1) 0%, rgba(216,96,146,1) 100%);
    background: -o-linear-gradient(left, rgba(183,72,94,1) 0%, rgba(216,96,146,1) 100%);
    background: -ms-linear-gradient(left, rgba(183,72,94,1) 0%, rgba(216,96,146,1) 100%);  
    background: linear-gradient(to right, rgba(183,72,94,1) 0%, rgba(216,96,146,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7485e', endColorstr='#b7485e', GradientType=1 );
}

.main-roles-details[data-role="pe"] .main-roles-details-bg { 
    background: rgb(96,158,98);
    background: -moz-linear-gradient(-45deg, rgba(96,158,98,1) 0%, rgba(189,222,136,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(96,158,98,1) 0%,rgba(189,222,136,1) 100%);
    background: linear-gradient(135deg, rgba(96,158,98,1) 0%,rgba(189,222,136,1) 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#609e62', endColorstr='#84d387',GradientType=1 );
}

.main-roles-details[data-role="smm"] .main-roles-details-bg { 
    background: rgb(181,63,104);
    background: -moz-linear-gradient(-45deg, rgba(181,63,104,1) 0%, rgba(229,90,178,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(181,63,104,1) 0%,rgba(229,90,178,1) 100%);
    background: linear-gradient(135deg, rgba(181,63,104,1) 0%,rgba(229,90,178,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b53f68', endColorstr='#e55ab2',GradientType=1 );
} 

.main-roles-details[data-role="se"] .main-roles-details-bg {  
    background: rgb(107,200,239);
    background: -moz-linear-gradient(-45deg, rgba(107,200,239,1) 0%, rgba(100,184,243,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(107,200,239,1) 0%,rgba(100,184,243,1) 100%);
    background: linear-gradient(135deg, rgba(107,200,239,1) 0%,rgba(100,184,243,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6bc8ef', endColorstr='#64b8f3',GradientType=1 );
}

.main-roles-details[data-role="author"] .main-roles-details-bg {  
    background: rgb(50,89,248); 
    background: -moz-linear-gradient(-45deg, rgba(50,89,248,1) 0%, rgba(67,106,183,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(50,89,248,1) 0%,rgba(67,106,183,1) 100%);
    background: linear-gradient(135deg, rgba(50,89,248,1) 0%,rgba(67,106,183,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3259f8', endColorstr='#436ab7',GradientType=1 );
}

.details-close {
    position: absolute;
    left:20px;
    top:20px;
    height: 25px;
    width: 25px;
    background-image: url('https://i.onthe.io/smngoz75iedsq9k5v.cc4e8ff9.png');
    background-size: 15px;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5;
    cursor: pointer;
}

.details-close:hover {
    opacity: 1;
    cursor: pointer;
}
 @media (max-width:1170px) {
    
    .blocks-container .block-hidden {
        display: none;
    } 
     
    .blocks-container .white-block, .blocks-container .text-block {
        width: 100%;   
    } 
} .white-block {
    background: #f5f9fa;
    border-radius: 8px;
    -webkit-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);
    -moz-box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);
    box-shadow: 4px 8px 20px 0px rgba(0,0,0,0.29);
}

.text-block {
    padding: 40px; 
    line-height: 140%!important;
    max-width: 780px;
    margin:  0 auto;
}

.text-block h1 {
    line-height: 140%!important;
    margin-bottom:40px;
    margin-top:40px;
}

.text-block h2 {
    line-height: 140%!important;
    margin-bottom:35px;
    margin-top:35px;
}

.text-block h3 {
    line-height: 140%!important;
    margin-bottom:30px;
    margin-top:30px;
}

.text-block h4 { 
    line-height: 140%!important;
    margin-bottom:25px;  
    margin-top:25px;
}

.text-block h5 {
    line-height: 140%!important;
    margin-bottom:20px;
    margin-top:20px;
}

.text-block h6 {
    line-height: 140%!important;
    margin-bottom:15px;
    margin-top:15px;
}

.text-block p {
    line-height: 140%!important;
    font-size:15px;
    margin-bottom:40px;  
}

.text-block ul {
    line-height: 140%!important;
    padding-left:20px;
    padding-top:0px; 
    padding-bottom:30px;     
    list-style-type:none; 
}

.text-block ul li {
    line-height: 140%!important;
    font-size:15px;
    font-weight: normal;
    margin-bottom:20px;   
} 



 .contact-us {
    // background: red;
    padding: 70px 0;
    position: relative;
    margin-top:150px;
    z-index: 9999;
    overflow: visible;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3a32a4+0,5b2dad+36,602faf+49,772eb0+71,9244b3+100 */
    background: #3a32a4; /* Old browsers */
    background: -moz-linear-gradient(left, #3a32a4 0%, #5b2dad 36%, #602faf 49%, #772eb0 71%, #9244b3 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #3a32a4 0%,#5b2dad 36%,#602faf 49%,#772eb0 71%,#9244b3 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #3a32a4 0%,#5b2dad 36%,#602faf 49%,#772eb0 71%,#9244b3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a32a4', endColorstr='#9244b3',GradientType=1 ); /* IE6-9 */
    
    color:white;
    white-space: normal;
    text-align: center;
}

.contact-us * {
    white-space: normal;
}

.contact-us .wrap {
    max-width: 900px;
}

.contact-us h3 {
    margin-bottom:15px;
}

.contact-us h5 {
    margin-bottom:25px;
    opacity: 0.3;
}

.contact-us mark {
    background: white;
    color:#5631a9;
}

.contact-us .contact-us__bgimg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 100px;
    width: 100%;
    transform:translate(0,-100%);
} .read-more-block {
    h4 {
        margin:50px 0 30px 0;
        opacity: 0.3;
    }
} .success-case__title {
    width: 100%;
    padding-bottom:70px;
}

.success-case__title  .screen-welcome {
    padding-bottom:50px;
    position: relative;
}

.success-case__title  .screen-welcome .screen-welcome__bg {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    opacity: 0.09;
    right: 0;
    z-index: -1;
    background-size: cover;
    background-position: center;
}

.success-case__title h4 {
    margin-top:25px;
    color:#3ea1e4;
}


.success-case__title h1 {
    margin-bottom:25px;
    font-size:36px!important;
}

.success-case__title tr td {
    vertical-align: middle;
    // padding-bottom:50px;
}


/* Success case header styles */
.success-case .success-case__header {
    max-width: 1170px;
    margin: 0px auto 0px auto;
    background-size: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 30px 40px 0px 40px;
    margin-bottom:100px;
}

.success-case .success-case__header___client .client-logo,
.success-case .success-case__header___center .client-logo,
.success-case .success-case__header___manager .client-logo {
    width: 80px;
    display: inline-block;
    height: 80px;
    border-radius:50%;
    margin-bottom:8px;

    -webkit-box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);
    -moz-box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);
    box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);

    background-size: 80%;
    background-position: center;
    background-repeat: no-repeat;
}

.success-case__header___icons .case-icon {
    text-align: center;
}

.success-case__header___icons .case-icon img {
    height: 90px;
    margin-top:0px;
    margin-bottom:5px;
}

.success-case .success-case__header___manager {
    text-align: right;
}

.success-case .success-case__header___center {
    text-align: center;
}

.succes-case-suctomer-logo {
    height: 20px;
    opacity: 0.3;
    margin-top:20px;
}


/* Success case messeges styles */
.success-case .success-case__body {
    max-width: 700px;
    margin:0 auto;
}
.success-case .success-case__body .manager-commet {
    text-align:right;
    opacity: 1;
    padding: 0;
    margin: 20px 0;
}

.success-case .success-case__body .manager-commet:before,
.success-case .success-case__body .client-commet:before {
    content:none;
}

.success-case .success-case__body .manager-commet p,
.success-case .success-case__body .client-commet .p,
.success-case .success-case__body .client-commet p {
    max-width: 90%;
    display: inline-block;
    padding: 30px;
}

.success-case .success-case__body .manager-commet.full-width p,
.success-case .success-case__body .client-commet.full-width p {
    max-width: 100%;
    width: 100%;
    border-radius: 20px;
}

.success-case .success-case__body .manager-commet p {

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#547fff+0,00a9fa+100 */
    background: #547fff; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #547fff 0%, #00a9fa 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #547fff 0%,#00a9fa 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #547fff 0%,#00a9fa 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#547fff', endColorstr='#00a9fa',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */


    -webkit-box-shadow: 10px 10px 45px -7px rgba(57,138,253,0.71);
    -moz-box-shadow: 10px 10px 45px -7px rgba(57,138,253,0.71);
    box-shadow: 10px 10px 45px -7px rgba(57,138,253,0.71);

    border-radius:20px 0 20px 20px;
    position: relative;
    color:white;
    text-align: left;
}

.success-case .success-case__body .client-commet {
    opacity: 1;
    padding: 0;
}

.success-case .success-case__body .client-commet p a {
    color: #547fff;
    text-decoration: underline;
}

.success-case .success-case__body .manager-commet p a {
    text-decoration: underline;
}
.success-case .success-case__body .client-commet .p ul {
    margin-top: 15px;
}
.success-case .success-case__body .client-commet .p,
.success-case .success-case__body .client-commet p {

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#547fff+0,00a9fa+100 */
    background: white;

    -webkit-box-shadow: 3px 3px 45px -7px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 3px 3px 45px -7px rgba(0, 0, 0, 0.1);
    box-shadow: 3px 3px 45px -7px rgba(0, 0, 0, 0.1);

    border-radius:0 20px 20px 20px;
    position: relative;
}

.success-case .success-case__body .manager-commet p span,
.success-case .success-case__body .client-commet p span {
    position: absolute;
    bottom:-40px;
    color:black;
    opacity: 0.2;
    font-size:12px;
}


.success-case .success-case__body .manager-commet p span {
    right: 20px;
}

.success-case .success-case__body .client-commet p span {
    left: 20px;
}

.commet__icon:after {
    display: none;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    -webkit-box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);
    -moz-box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);
    box-shadow: 6px 4px 53px -10px rgba(0,0,0,0.55);
}

.commet__icon.client_tim:after {
    display: block;
    left: -95px;
    background: url(https://i.onthe.io/smngoz2ds4hjgbmam.1b246bf2.jpg) #fff top center;
    background-size: 115%;
}

.commet__icon.client_leonie:after {
    display: block;
    left: -95px;
    background: url(https://i.onthe.io/smngoz3m9evs910pv.731e9cf0.jpg) #fff top center;
    background-size: 130%;
}

.commet__icon.client_osagie:after {
    display: block;
    left: -95px;
    background: url(https://i.onthe.io/smngoz62jgumia53r.9c8ed0a7.jpg) #fff;
    background-size: 180%;
    background-position: 54% 2%;
}

.commet__icon.manager_roxanna:after {
    display: block;
    left: auto;
    right: -95px;
    background: url(https://i.onthe.io/smngoz62lni3itd8b.3ae5ca8b.png) #fff center center;
    background-size: 180%;
}

.screen-request-general {
    width: 100%;
}
.screen-request-general>.row {
    max-width: 700px;
    margin: auto;
}





@media ( max-width: 1199px ) {
    .success-case__title .screen-welcome {
        margin-top: 80px;
        padding: 120px 15px 50px;
    }

    .case-content-landing.case-content-text {
        margin-top: 0;
    }

    .success-case__header___client,
    .success-case__header___manager {
        margin: 15px 0;
    }

    .success-case__header___icons {
        order: -1;
        max-width: 100%;
    }

    .success-case__header___icons > .row {
        max-width: 380px;
        margin: auto;
        align-items: initial;
    }

    .success-case__body article blockquote.commet__icon::after {
        transform: scale(.6) translate(80%, -70%);
        right: 0;
    }

    .success-case__body article blockquote.client-commet.commet__icon::after {
        transform: scale(.6) translate(-80%, -70%);
        left: 0;
    }
}





@media ( max-width: 575px ) {
    .success-case__title .screen-welcome {
        margin: 0;
        padding: 50px 15px;
    }

    .success-case__header___client {
        /*margin-top: 40px;*/
    }

    .success-case__title h1 {
        font-size: 30px !important;
    }

    .success-case__body article blockquote.commet__icon::after {
        right: 15%;
    }

    .success-case__body article blockquote.client-commet.commet__icon::after {
        left: 15%;
    }

    article small {
        margin-left: 40px;
    }
}
 .blue-light-block {
    position: relative;
    z-index: 1; 
}


/* bg styles */
.blue-light-bg {
    z-index: 0;
    position: absolute;
    width: 5000px;  
    left:50%;
    top:-150px;
    overflow: hidden;
    bottom:-150px; 
    -webkit-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.67);
    -moz-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.67);
    box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.67);
    transform: translate(-50%,0) rotate(-3deg);
    background: rgb(63,169,235);
    background: -moz-linear-gradient(-45deg, rgba(63,169,235,1) 0%, rgba(60,199,214,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(63,169,235,1) 0%,rgba(60,199,214,1) 100%);
    background: linear-gradient(135deg, rgba(63,169,235,1) 0%,rgba(60,199,214,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3fa9eb', endColorstr='#3cc7d6',GradientType=1 );
    
}

.blue-light-values {
    position: relative; 
    z-index: 1;  
}

.blue-light-bg:before {
    content: '';
    position: absolute;
    width: 100%;
    top:50%;
    left:50%;
    height: 250%;
    background-color:rgba(0,0,0,0.03);  
    transform:translate(-50%,0) rotate(-20deg);
} 


/* values styles */
.blue-light-block .blue-light-value {
    position: relative; 
    margin:60px 0 0 0;  
    white-space: nowrap; 
}

.blue-light-block .blue-light-value h1, .blue-light-block .blue-light-value p { 
    display: inline-block;  
}

.blue-light-block .blue-light-value h1 {
    font-size: 56px;
}

.blue-light-block .blue-light-value p {
    font-size: 18px; 
}


/* left value */
.blue-light-block .blue-light-value.blue-light-value-left p {
    margin-left: 10px;
}

.blue-light-block .blue-light-value.blue-light-value-left .value-mirror {
    position: absolute;
    font-size:150px;
    left:60px;
    opacity: 0.07; 
    z-index: -1;
    font-weight: bold;
    top:50%;
    transform:translate(0,-50%); 
}


/* right value */ 
.blue-light-block .blue-light-value.blue-light-value-right p {
    margin-right: 10px;
    text-align: right;
}

.blue-light-block .blue-light-value.blue-light-value-right .value-mirror { 
    position: absolute;
    font-size:150px;
    right:60px; 
    opacity: 0.07; 
    z-index: -1;
    font-weight: bold;
    top:50%;
    transform:translate(0,-50%);  
}

 @media (max-width:1170px) {
    .case-content-landing.case-content-text { 
        padding:0px!important;    
    }
    
    .case-content-landing.case-content-text .wrap {
        // max-width:550px; 
    }
    
    .case-content-container .case-block:first-child {
        padding: 0px!important; 
    }
    
    .case-content-landing img {
        max-width:100%;
        height: auto!important; 
        // transform: scale(1.2); 
    }
    
    .case-content-landing .form-lead button { 
        position: static!important;  
    }
    
    .case-content-landing .form-lead input { 
         width: 200px;  
    }
    
   
    
    /* table */   
    .case-content-landing .case-compare-table {
        max-width:100%;
        overflow: auto;
    }
    
    .case-content-landing .case-compare-table::-webkit-scrollbar {
        width: auto;
        height: 5px;
    }
     
    .case-content-landing .case-compare-table::-webkit-scrollbar-track {
      background-color: rgba(0,0,0,0.1);   
    }
     
    .case-content-landing .case-compare-table::-webkit-scrollbar-thumb {
      background-color: rgba(0,0,0,0.3);
      border-radius:5px; 
    }
    
    .case-content-landing .case-compare-table .table-header, .case-content-landing .case-compare-table .table-body { 
        min-width:500px;
    }
    
    .case-content-landing .case-compare-table   .col    { padding: 7px!important; text-align: left; vertical-align: middle;  }  
    .case-content-landing .case-compare-table   .col_0  { width:0;  } 
    .case-content-landing .case-compare-table   .col_1  { width:8.33333333333%; } 
    .case-content-landing .case-compare-table   .col_2  { width:16.6666666667%; }
    .case-content-landing .case-compare-table   .col_3  { width:25%; }
    .case-content-landing .case-compare-table   .col_4  { width:33.3333333333%; } 
    .case-content-landing .case-compare-table   .col_5  { width:41.6666666667%; }
    .case-content-landing .case-compare-table   .col_6  { width:50%; } 
    .case-content-landing .case-compare-table   .col_7  { width:58.3333333333%; } 
    .case-content-landing .case-compare-table   .col_8  { width:66.6666666667%; }  
    .case-content-landing .case-compare-table   .col_9  { width:75%; }
    .case-content-landing .case-compare-table   .col_10 { width:83.3333333333%; } 
    .case-content-landing .case-compare-table   .col_11 { width:91.6666666667%; }
    .case-content-landing .case-compare-table   .col_12 { width:100%; }  
    
    
    /* read more */
    .read-more-item {
        max-width:350px;  
        margin: 10px auto!important;   
    }
    
    #img1,  #img2,  #img3 {
        margin: 50px 0!important;
        transform: scale(1.8);  
    } 
} 



@media (max-width:480px) {
    
    .case-content-landing .wrap {
        padding: 0 30px;   
    }
    
    .case-content-landing .form-lead {  
        width:100%; 
        padding:0;
        margin-bottom:100px!important;  
    }
    
    .case-content-landing .form-lead input {
        width:100%; 
    }
    
    .case-content-landing .form-lead button {
        position: absolute!important; 
        width: 100%;
        top:170px;  
        left:50%;
        transform:translate(-50%,0); 
    }
    
} .case-content-landing {
    border-radius: 0;
    background: #f4f6f9;  
    padding:50px 0!important;  
}

.case-content-landing .divider {
    width: 30%;
    margin: 35px auto; 
    height: 1px;
    background: #23475d; 
    opacity: 0.1;   
}

.case-content-landing h3, .case-content-landing h5 { 
    margin-bottom:20px;  
}

.case-content-landing h5 { text-align:left;  }

.case-content-landing .case-img img { 
    height: 300px; 
}

.case-content-landing p { 
    font-size:18px; 
    line-height: 145%; 
    margin-bottom:25px; 
    font-weight:400;  
} 

.case-content-landing blockquote { 
    font-size:18px; 
    line-height: 145%; 
    margin-bottom:45px; 
    font-weight:400; 
    padding-lefT:40px;
    opacity: 0.3;
    position: relative;
}    

.case-content-landing blockquote:before {
    content:'';
    left:0;
    top:0px;
    bottom:0px;
    width: 3px;
    background: #112750;
    position: absolute;
    opacity: 0.5;
}


.case-content-container .case-content-landing ul {
    margin:20px; 0;
    list-style-type: none;
}

.case-content-container .case-content-landing ul li p { 
    font-size:18px; 
    margin:5px;
} 

.case-content-container .case-content-landing .case-block {
    margin:25px 0; 
    padding: 50px 0px;  
}




/*  Table */
.case-content-landing .case-compare-table {
    margin:30px 0; 
    font-weight: normal;
}

.case-content-landing .case-compare-table .compare-marker {
    display: inline-block;
    padding: 10px 15px;
    font-weight: bold;
    text-transform: uppercase;
}

.case-content-landing .case-compare-table .compare-marker.marker-bad {
    color:#f76565;
    background: #f2e9ec;
    border-radius:3px;
} 

.case-content-landing .case-compare-table .compare-marker.marker-good {
    color:#00b185;
    background: #d8f1ef;
    border-radius:3px; 
} 

.case-content-landing .case-compare-table .table-header {
    opacity: 0.5;
}


.case-content-landing .case-compare-table .table-body .row .col:first-child {
    opacity: 0.5;
}

.case-content-landing .case-compare-table .table-body .row .col {
    padding: 15px;
}



/* Read more */
.case-content-landing .read-more-item {
    margin: 5px;
    border-radius: 3px;
    overflow: hidden;  
    -webkit-box-shadow: 1px 1px 10px 0px rgba(0,0,0,0.12);
    -moz-box-shadow: 1px 1px 10px 0px rgba(0,0,0,0.12);
    box-shadow: 1px 1px 10px 0px rgba(0,0,0,0.12);
    z-index:1;
    position: relative;
    transition:all 0.3s ease;  
}

.case-content-landing .read-more-item:hover {
    -webkit-box-shadow: 2px 2px 30px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 2px 2px 30px 0px rgba(0,0,0,0.24);
    box-shadow: 2px 2px 30px 0px rgba(0,0,0,0.24); 
    cursor: pointer; 
    z-index:2;
}

.case-content-landing .read-more-item img {
    width: 100%;
}

.case-content-landing .read-more-item .text {
    padding:30px;
}

.case-content-landing .read-more-item .text h5 {
    font-size:18px;
    margin-bottom:10px; 
}

.case-content-landing .read-more-item .text p {
    font-size:15px;
    line-height: 120%;
} /* mobile */ 
@media (max-width:1170px) {
    .site-title { font-size:22px; } 
    .site-sub-title { font-size:1em; } 
    .site-sub-title br { display: none; }
    
    .case-content-container .row {
        white-space: normal;
    }
    
    .case-content-container .col {
        width: 100%; 
    }
    
    .case-content-container img { 
        display: block;
        margin:0 auto!important;
    }
    
    .case-nav {
        display: flex; 
        flex-direction: column-reverse;
        align-items: stretch;
    }
    
    .case-nav .col_2 { 
        display: none;
    }
       
    .case-nav .col_4 {
        text-align: center;   
        width: 100%;
    }
}  .case-content-container {
    position: relative;
    z-index: 9;
    // margin-bottom: 50;
}

.case-content-container .col {
    padding: 40px;
}

.case-content-container .col.clear {
    padding:0; 
}

.case-content-container .white-block {
    background: #f5f9fb;
}

.case-content-container .case-content-text {
    overflow: hidden;
}

.case-content-container .case-content-text h3 {
    font-weight: normal;
}

.case-content-container .case-content-text h5 {
    font-weight: normal;
    font-size: 22px;
}

.case-content-container .case-block { 
    position: relative;
    z-index: 1;
    padding: 15px 20px; 
}

.case-content-container .case-block:first-child {
    border-radius:10px 10px 0 0;
}

.case-content-container .case-number {
    color:white;
    width: 30px;
    height: 30px;
    background: #4eb7ff; 
    border-radius: 50%;
    display: inline-block;
    font-size:15px;  
    font-weight: bold;
    vertical-align: middle;
    padding: 6px 11px; 
    margin-bottom:20px; 
    box-shadow: 4px 3px 15px 0px rgba(0,0,0,0.29);
    -webkit-box-shadow: 4px 3px 15px 0px rgba(0,0,0,0.29);
    -moz-box-shadow: 4px 3px 15px 0px rgba(0,0,0,0.29); 
}

.case-content-container .case-illustration {
    height: 380px; 
    display: block;
    margin:30px auto 30px auto;  
}

.case-content-container .case-gray-bg {
    background: #e9f2f7;  
}

.case-content-container .case-blue-bg {
    background: rgb(63,169,235);
    background: -moz-linear-gradient(-45deg, rgba(63,169,235,1) 0%, rgba(60,199,214,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(63,169,235,1) 0%,rgba(60,199,214,1) 100%);
    background: linear-gradient(135deg, rgba(63,169,235,1) 0%,rgba(60,199,214,1) 100%);
}


/* text styles */ 
.case-content-container .case-problem-solution .marker {
    padding: 9px 15px;
    border-radius: 50px;
    background: red; 
    display: inline-block;
    margin-bottom: 15px; 
}

.case-content-container .case-problem-solution .case-problem .marker {
    background: rgb(242,97,158);
    background: -moz-linear-gradient(-45deg,  rgba(242,97,158,1) 0%, rgba(242,106,113,1) 100%);
    background: -webkit-linear-gradient(-45deg,  rgba(242,97,158,1) 0%,rgba(242,106,113,1) 100%);
    background: linear-gradient(135deg,  rgba(242,97,158,1) 0%,rgba(242,106,113,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2619e', endColorstr='#f26a71',GradientType=1 );
}

.case-content-container .case-problem-solution .case-solution .marker { 
    background: rgb(84,220,188); 
    background: -moz-linear-gradient(-45deg, rgba(84,220,188,1) 0%, rgba(86,201,156,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(84,220,188,1) 0%,rgba(86,201,156,1) 100%);
    background: linear-gradient(135deg, rgba(84,220,188,1) 0%,rgba(86,201,156,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#54dcbc', endColorstr='#56c99c',GradientType=1 );
}


/* case center block */
.case-content-container .case-block-center {
    text-align: center;
}


/* case left block */
.case-content-container .case-block-left {
    text-align: left; 
}

.case-content-container .case-block-left .case-number {
    margin:0; 
}

.case-content-container .case-block-left h3 {
    display: inline-block;
    margin:150px 0 150px 30px;    
    vertical-align: middle; 
}

.case-content-container .case-block-left .img {  
    position: absolute;
    // right:0; 
    top:50%;
    transform: translate(0,-50%);
    z-index: -1;
}


/* text style for cases */
.case-content-container .case-subtitle {
    opacity: 0.3;
    font-weight:normal;
    margin-bottom:5px;
}

.case-content-container .case-title {
    margin-bottom:15px;
}

.case-content-container ul li {
    padding: 5px 0 5px 35px;
    position: relative;
}

.case-content-container ul li p {
    font-size: 15px;
}

.case-content-container ul li:before {
    content: '';
    position: absolute;
    lefT:0;
    top:11px;  
    width:13px;
    height:13px;
    background: #4eb7ff; 
    border-radius:50%;
    -webkit-box-shadow: 2px 2px 11px 0px rgba(78,183,255,0.7);
    -moz-box-shadow: 2px 2px 11px 0px rgba(78,183,255,0.7);
    box-shadow: 2px 2px 11px 0px rgba(78,183,255,0.7); 
}


/* case nav */
.case-nav {  
    margin:40px 0;
    color:white;
    
}

.case-nav li {  
    padding: 7px 0;
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    color:#3ea1e4;
    opacity: 0.7;
}

.case-nav li:hover {
    opacity: 1;
    cursor: pointer;   
}

.case-nav p {
    font-size:18px;  
}


.case-content-container img {
    max-width: 100%; 
    margin-bottom:20px; 
}


 .why__container {
    text-align: center;
    margin: 0 auto 60px;
}

.why__container .h3 {
    margin: 10px auto 70px;
}

.why__container h4.h4__type-2 {
    font-size: 16px;
    margin: 25px auto 8px;
}

.why__container p {
    font-size: 15px;
    color: var(--editorial-text-2);
    color: #6B778C;
}





/*animation particles*/
.why__container .col.mw300:nth-child(1) .set-stroke-color {
    stroke: #ff9e97;
}
.why__container .col.mw300:nth-child(2) .set-stroke-color {
    stroke: #9ebdfb;
}
.why__container .col.mw300:nth-child(3) .set-stroke-color {
    stroke: #90e6b1;
}





/* media queries */
@media screen and (max-width: 1199px) {
    .why__container .h3 {
        margin: 10px auto 30px;
    }

    .why__container .row:nth-of-type(2)>div {
        margin: 30px auto;
    }
}



@media screen and (max-width: 575px) {
    .why__container .row:nth-of-type(2)>div {
        margin: 15px auto;
    }

    .why__container img[alt=line-01] {
        margin-top: 20px;
    }

    .why__container .h3 {
        font-size: 28px;
    }

    .why__container .h4__type-2 {
        margin: 10px auto;
    }

    .why__container p {
        line-height: 24px;
    }
}
 .bg-feedback__block {
    background-image: var(--landing-gradient-2);
    background-image: linear-gradient(45deg, #1D63DC, #1EB6FF);
    overflow: hidden;
}

.feedback__container {
    margin: 80px auto;
}

.feedback__container .row {
    /*align-items: initial;*/
}

.feedback__container .row>div:nth-of-type(2) {
    text-align: center;
}

.feedback__container .feedback-logo__container {
    height: 50px;
}

.feedback__container .feedback-logo__item {
    background: url("https://i.onthe.io/smngoz3a2fo1i2ig7g.2103f69d.png") no-repeat center center;
    background-size: contain;
    height: 50px;
}

.feedback__container .feedback__text {
    font-size: 36px;
    margin: 50px auto;
}
.feedback__container .feedback__text p:first-of-type {
    min-height: 90px;
}

.feedback__container .person {
    font-size: 14px;
    font-weight: bold;
    margin: 0 0 5px;
}

.feedback__container .position {
    font-size: 13px;
    font-weight: normal;
    margin: 0;
}

.feedback__container img[role=feedback-change__button] {
    cursor: pointer;
    /*margin-top: 150px;*/
    border-radius: 100%;
    background-color: transparent;
    border: 2px solid transparent;
    transition: background-color .5s, border-color .5s;
}
.feedback__container img[role=feedback-change__button]:hover {
    background-color: #ffffff44;
    border-color: #ffffff44;
}

.feedback__container p {
    color: #fff;
}

.feedback__container .pointer {
    cursor: pointer;
}

.feedback__container .feedback__text {
    font-size: 28px;
    line-height: 40px;
    position: relative;
}
.feedback__container .feedback__text:hover .feedback__hint {
    transform: translateY(90%);
    opacity: 1;
}

.feedback__container .feedback__hint {
    position: absolute;
    bottom: 0;
    right: 0;
    margin: 0;
    font-size: 12px !important;
    line-height: initial;
    padding: 5px;
    border-radius: 5px 0;
    border: 1px solid #fff;
    border-top: none;
    border-left: none;
    transform: translateY(-100%);
    opacity: 0;
    transition: transform .5s, opacity .5s;
}
.feedback__container .hint-hidden {
    display: none;
}

.feedback_xs__buttons {
    margin-top: 40px;
    text-align: center;
}



.feedback__container .feedback__fade {
    opacity: 0;
    min-height: 100%;
}
.feedback__container .feedback__transition {
    transition: min-height .5s, opacity .5s;
}





@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    .feedback__container .feedback-logo__item {
        background: url("https://i.onthe.io/smngoz1r360f6ntq1g.9fd55341.png") no-repeat center center;
        background-size: contain !important;
    }
}





/* media queries */
@media screen and (max-width: 1199px) {
    .feedback__container .feedback__text p {
        font-size: 28px;
    }
}



@media screen and (max-width: 575px) {
    .feedback__container {
        margin: 60px auto;
    }

    .feedback__container .feedback-logo__item {
        height: 40px;
    }

    .feedback__container .feedback__text {
        margin: 40px auto;
    }

    .feedback__container .feedback__text p {
        font-size: 20px;
        line-height: 30px;
    }

    .feedback__container img[role=feedback-change__button] {
        margin: 0 20px;
    }
}



/* submedia queries for feedback text element */
@media screen and (max-width: 1024px) and (min-width: 769px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 210px;
    }
}
@media screen and (max-width: 768px) and (min-width: 576px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 294px;
    }
}
@media screen and (max-width: 575px) and (min-width: 426px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 150px;
    }
}
@media screen and (max-width: 425px) and (min-width: 376px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 210px;
    }
}
@media screen and (max-width: 375px) and (min-width: 321px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 270px;
    }
}
@media screen and (max-width: 320px) {
    .feedback__container .feedback__text p:first-of-type {
        min-height: 300px;
    }
}
 .stats__container {
    margin: 70px auto;
}

.stats__container .row>div {
    text-align: center;
}

.stats__container .stats__logo {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    height: 25px;
    margin-bottom: 20px;
}

.stats__container .stats__numbers p {
    display: inline-block;
}
.stats__container .stats__numbers p:nth-of-type(1) {
    vertical-align: top;
    font-size: 33px;
    margin: 10px 0;
}

.stats__container .stats__numbers p:not(:nth-of-type(1)) {
    font-size: 78px;
    margin: 0;
    min-width: 90px;
    text-align: left;
}

.stats__container .stats__desc {
    color: #A6ABB4;
    font-size: 18px;
    margin: 15px auto;
}

.stats__container .stats__more {
    transition: .5s color;
}
.stats__container .stats__more:hover {
    color: var(--blue-mid);
    color: #1c7ee7;
}

.stats__container .stats__link-arrow {
    padding-right: 10px;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--blue-light);
    color: #1EB6FF;
    line-height: 21px;
}
.stats__container .stats__link-arrow:after {
    content: '';
    position: absolute;
    margin-left: 10px;
    background: url("/icons/icon_next.svg") no-repeat center;
    background-size: 100%;
    width: 8px;
    height: 8px;
    min-height: 21px;
}



/* Logos */
#ringier-logo {
    background-image: url("https://i.onthe.io/smngoz366ai5k1vpcg.773c2513.png");
}

#dmgmedia-logo {
    background-image: url("https://i.onthe.io/smngoz2p9nb8kn02h.c5539dc7.png");
}

#slobodnadalmacija-logo {
    background-image: url("https://i.onthe.io/smngoz2p699v34ohjg.4e81baa3.png");
}



@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #ringier-logo {
        background-image: url("https://i.onthe.io/smngozdnur3qbia1i.71b97638.png");
    }

    #dmgmedia-logo {
        background-image: url("https://i.onthe.io/smngoz9sn2vskbpsk.c2746943.png");
    }

    #slobodnadalmacija-logo {
        background-image: url("https://i.onthe.io/smngoz3defrbmifl5g.e6908fe5.png");
    }
}



/* media queries */
@media screen and (max-width: 1199px) {
    .stats__container {
        margin: 40px auto;
    }

    .stats__container .row>div {
        margin: 30px auto;
    }
}



@media screen and (max-width: 575px) {
    .stats__container .row>div {
        margin: 40px auto;
    }
}
 .bg-more-cta__block {
    background-image: var(--landing-gradient-2);
    background-image: linear-gradient(45deg, #1D63DC, #1EB6FF);
    overflow: hidden;
}

.more__container {
    margin-top: 85px;
}

.more__container .col {
    display: initial;
    padding: 0;
}

.more__container h2 {
    color: #fff;
    margin: 0 auto;
}

.more__container p {
    color: #fff;
    margin: 30px auto;
}

.more__container+.cta__container {
    margin-bottom: 100px;
}

.more__container+.cta__container .cta__info {
    display: none;
}

.more__container+.cta__container input[name=email] {
    color: #fff;
    background-color: #1875DC;
}
.more__container+.cta__container input[name=email]::placeholder {
    color: #B7D1F3;
}

.more__container+.cta__container form,
.more__container+.cta__container form:hover {
    box-shadow: none;
}
.more__container+.cta__container form:hover .has-error__input,
.more__container+.cta__container .has-error__input:focus {
    /*background-color: #844242;*/
}



@media screen and (max-width: 575px) {
    .more__container {
        margin-top: 60px;
    }

    .more__container .h2 {
        font-size: 30px;
        font-weight: bold;
        margin: 20px 0;
        line-height: 40px;
    }

    .more__container p {
        font-size: 20px;
    }

    .more__container+.cta__container {
        margin-bottom: 60px;
    }
}
 .cta__container {
    max-width: 410px;
    margin: 30px auto;
}

.cta__row {
    margin: 0 -15px;
    display: block;
}

.cta__container form {
    position: relative;
    height: 70px;
    border: none;
    border-radius: 5px;
    transition: box-shadow .3s;
}
.cta__container form:hover {
    box-shadow: 0 9px 24px 4px #c6cace;
}

.cta__container input[name=email] {
    padding: 0 20px;
    font-size: 16px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border-radius: 5px;
    color: #42526E;
    outline: none;
    border: 1px solid transparent;
    transition: border-color .3s, background-color .3s;
}
.cta__container input[name=email]::placeholder {
    color: #C1C7D0;
}
.cta__container input[name=email]:focus {
    border-color: var(--blue-light);
}

.cta__container .button__item {
    height: 50px;
    padding: 0 10px;
    margin-right: 10px;
    font-size: 18px;
    min-width: 130px;
    max-width: 180px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    border: none;
    background-color: var(--blue-light);
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    outline: none;
    cursor: pointer;
    transition: color .3s, background-color .3s, opacity .3s;
}
.cta__container .button__item:hover {
    background-color: #0295F6;
}

.cta__container .cta__info {
    margin: 20px auto;
    color: #3A445D;
    font-size: 12px;
    text-align: center;
}
.cta__container .cta__info a {
    color: #72788A;
    text-decoration: none;
    transition: color .3s;
}
.cta__container .cta__info a:hover {
    color: #fff;
}





/* tips */
.cta__container span.tip__form,
.cta__container span.tip__form::after {
    background-color: var(--editorial-text-1);
}

.cta__container input[type=email]:hover + .tip__form,
.cta__container input[type=email]:focus + .tip__form,
.cta__container form:hover .tip__form {
    opacity: 1;
}





/* errors */
.cta__container form:hover .has-error__input + .show-error__form,
.cta__container .has-error__input:focus + .show-error__form,
.inner-form-lead-container form:hover .has-error__input + .show-error__form {
    opacity: 1;
}

form.wait .button__item,
form.wait button {
    opacity: .3;
}
form.no .error__form {
    transform: translateY(20px);
}

.cta__container .error__form,
.inner-form-lead-container .error__form {
    cursor: default;
    color: #fff;
    background-color: #E10C00;
    border-radius: 2px;
    font-size: 12px;
    top: -50%;
    position: absolute;
    left: 0;
    margin-left: 20px;
    padding: 5px;
    opacity: 0;
    z-index: 21;
    transition: opacity .3s, background-color .5s, transform .5s;
}
.inner-form-lead-container .error__form {
    top: -17%;
}

.cta__container .error__form::after,
.inner-form-lead-container .error__form::after {
    content: '';
    height: 16px;
    transform: rotate(45deg) translate(-50%, 20%);
    width: 16px;
    bottom: -30%;
    background-color: #E10C00;
    left: 50%;
    position: absolute;
    transform-origin: 50% 50% 0;
    z-index: -1;
    transition: opacity .3s, background-color .5s;
}
.cta__container .disabled__cta-submit-button {
    cursor: default;
}
.cta__container .disabled__cta-submit-button:hover {
    color: #fff;
    background-color: var(--blue-light);
}





/* media queries */
@media screen and (max-width: 575px) {
    .cta__container {
        margin: 30px;
        max-width: initial;
    }

    .cta__container form {
        height: auto;
        box-shadow: none !important;
    }

    .cta__container input[name=email] {
        height: 50px;
        text-align: center;
    }

    .cta__container .button__item {
        position: unset;
        width: 100%;
        max-width: 100%;
        height: 50px;
        transform: none;
        margin: 15px auto 0;
        border: none;
    }

    .cta__container .cta__info {
        margin: 15px auto;
    }



    .cta__container .error__form {
        margin: auto;
        font-size: 12px;
        top: -27%;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
    }



    form.no .error__form {
        transform: translate(-50%, 20px);
    }
}
 .logo__item.logo__item-white {
    background-image: url("/icons/IO-Technologies.svg");
}

footer {
    color: #fff;
    background-color: var(--bg-main);
    background-color: #021032;
    overflow: hidden;
}

footer .container {
    margin-top: 90px;
}

footer .row {
    align-items: flex-start;
}

footer .h6 {
    font-size: 18px;
    font-weight: 500;
    margin: 10px 0 20px;
}

footer ul {
    list-style-type: none;
    padding-left: 0;
}

footer li {
    margin-bottom: 15px;
}

footer a {
    font-size: 15px;
    text-decoration: none;
    color: var(--gray-mid);
    color: #9398A5;
    transition: .5s color;
}
footer a:hover {
    color: #fff;
}

footer .copyright {
    color: #25314F;
    font-size: 14px;
}



@media screen and (max-width: 575px) {
    footer .container {
        margin: 40px auto;
    }

    footer .row:nth-of-type(1)>div {
        margin: 10px auto;
    }

    footer .row:nth-of-type(2)>div {
        padding: 0;
    }

    footer .logo__item {
        margin: 40px auto;
    }

    footer .copyright {
        text-align: center;
    }

    footer .row > div:last-child h6 {
        text-align: center;
    }
    footer .row > div:last-child ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
}
 @media (max-width:1170px) {
    .form-lead.form-lead {
        position: relative;
        padding: 0;
        margin-top: 0;
        margin-bottom: 60px;
        z-index: 10;
    }
    .form-lead.form-lead input {
        padding: 20px;
        text-align: center;
    }
    .form-lead button {
        position: absolute;
        top: 100%; 
        width: 100%;
        margin-top: 10px;
        left: 0;
        padding: 20px;
    }
}

@media (max-width:320px) {
    .form-lead.form-lead input {
        width: 300px;
    }
} /* outer container */
.form-lead {
    display: inline-block;
    padding: 15px 20px 15px 10px;
    background-color: rgba(0, 0, 0, .1);
    border-radius:3px;
    margin-top:30px;
    transition:all 1s ease;
    position: relative;
    z-index: 10;
}

footer .form-lead {
    margin-top: 0;
}

.form-lead_container {
    text-align: right;
}

.form-lead_container .form-info {
    text-align: left;
}

.form-lead .form-info {
    position: absolute;
    left: 0;
    transform: translate(0,10px);
    top: 100%;
    right: 0;
    font-size: 11px;
    color: white;
    opacity: 0.3;
}

.form-lead .form-info a {
    text-decoration: underline;
}

.form-lead input {
     background: none;
     border:none;
     outline:none;
     color: white;
     width: 350px;
     font-size:13px;
     padding: 15px 0 15px 20px;
     border-left:solid rgba(255,255,255,0.1) 1px;
}

.form-lead input::-webkit-input-placeholder {
  color: #fff;
}

.form-lead.focused {
    animation:none;
    -webkit-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.47);
    -moz-box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.47);
    box-shadow: 0px 0px 46px 0px rgba(60,183,224,0.47);
}


.form-lead input:first-child {
    border:none;
}


/* light form */
.form-lead.form-lead-light {
    background: rgba(0,0,0,0.1);
    animation:none;
    box-shadow:none;
}

.form-lead.form-lead-light input {
    color:black;
}

/* bright form */

.form-lead.form-lead-brigth {
    background: rgba(255,255,255,0.05);
    animation:none;
    box-shadow:none;
    border: 1px solid rgba(255,255,255,.15);
}

.form-lead.form-lead-brigth input::-webkit-input-placeholder {
  color: rgba(255,255,255,.45);
}

.form-lead.form-lead-light input {
    color:black;
}

/* inner container */
.inner-form-lead-container {
    position: fixed;
    left:0;
    top:0;
    bottom: 0;
    right: 0;
    z-index:99999;
}

.inner-form-lead-container .inner-form-lead-mask {
    position: absolute;
    left:0;
    right: 0;
    bottom: 0;
    top:0;
    background-color: rgba(0,0,0,0.5);
}

.inner-form-lead-container p {
    opacity: 0.4;
}

.inner-form-info {
    color: #757575;
    font-size: 10px;
    margin-bottom: 20px;
}

.inner-form-info a {
    color:#3ea1e4;
}

.inner-form-info a:hover {
    text-decoration: underline;
}

.inner-form-lead-container .inner-form-lead {
    position: absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    padding: 40px 60px;
    display: inline-block;
    width: 500px;
    text-align: center;
}

@keyframes pulse {
    0%  {
        -webkit-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
        -moz-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
        box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
    }
    20%  {
        -webkit-box-shadow: 0px 0px 26px 0px rgba(60,183,224,0.37);
        -moz-box-shadow: 0px 0px 26px 0px rgba(60,183,224,0.37);
        box-shadow: 0px 0px 26px 0px rgba(60,183,224,0.37);
    }
    60%  {
        -webkit-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.17);
        -moz-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.17);
        box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.17);
    }
    80%  {
        -webkit-box-shadow: 0px 0px 36px 0px rgba(60,183,224,0.47);
        -moz-box-shadow: 0px 0px 36px 0px rgba(60,183,224,0.47);
        box-shadow: 0px 0px 36px 0px rgba(60,183,224,0.47);
    }
    100%  {
        -webkit-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
        -moz-box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
        box-shadow: 0px 0px 16px 0px rgba(60,183,224,0.27);
    }
}

/* global GDPR popup */
.global-gdpr-popup {
    position: fixed;
    top: 0;
    z-index: 99999999;
    color: white;
    font-size: 10px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px;
    background: rgba(61, 161, 229, .95);
    width: 100%;
}

.global-gdpr-popup div {
    margin-left: 10px;
    display: flex;
}

.global-gdpr-popup a {
    text-decoration: underline;
    white-space: nowrap;
}

.global-gdpr-popup.on {
    opacity: 1;
    visibility: visible;
}

.global-gdpr-popup button.gdpr-popup {
    width: 70px;
    margin: 0 10px;
    padding: 12px 0;
    color: #285f8e;
    background-color: #ffffff;
    border: none;
    line-height: 0;
}
.global-gdpr-popup button.gdpr-popup:hover {
    color: #ffffff;
    background-color: #285f8e;
}

.global-gdpr-popup button.gdpr-popup_refuse {
    width: 30px;
    color: #ffffff;
    background-color: #2863bb;
    text-transform: lowercase;
}
.global-gdpr-popup button.gdpr-popup_refuse:hover {
    background-color: #285f8e;
}




@media screen and (max-width: 500px) {
    .global-gdpr-popup div {
        flex-direction: column;
    }

    .global-gdpr-popup button.gdpr-popup {
        margin: 10px;
        width: 70px;
    }
    .global-gdpr-popup button.gdpr-popup:first-of-type {
        height: 40px;
    }
}
 .bg_pic {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1000px;
    // max-height: 100%;
    z-index: -1;
    background-position: top bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg_pic.bg_grag_blue {
    background: rgb(0,6,46);
    background: -moz-linear-gradient(-45deg, rgba(0,6,46,1) 0%, rgba(7,115,181,1) 48%, rgba(80,226,249,1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(0,6,46,1) 0%,rgba(7,115,181,1) 48%,rgba(80,226,249,1) 100%);
    background: linear-gradient(135deg, rgba(0,6,46,1) 0%,rgba(7,115,181,1) 48%,rgba(80,226,249,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00062e', endColorstr='#50e2f9',GradientType=1 );
    opacity: 1;
}

body:before{
    content: "";
    background: url("https://i.onthe.io/smngoz4cemtfi4j7k.5b98392d.png");
    opacity: 0;
} header nav li.dropdown .dropdown-container .case-item {
    padding: 20px;
    padding-left:70px;  
    border-bottom:solid rgba(0,0,0,0.06) 1px;
    transition:all 0.2s ease;  
}

header nav li.dropdown .dropdown-container .case-item:hover {
    cursor: pointer;
    background-color:rgba(0,0,0,0.03); 
}


/* bg icons */
header nav li.dropdown .dropdown-container .case-item:before {
    content:'';
    display: block; 
    position: absolute;
    left:20px;  
    top:50%;
    height: 35px;
    width: 35px;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center;
    transform:translate(0,-50%);
}
 
header nav li.dropdown .dropdown-container .case-item#checkout-case:before { background-image:url('https://i.onthe.io/smngoz6cgbmsfab1k.bb876778.png'); }
header nav li.dropdown .dropdown-container .case-item#funnel-case:before { background-size: 25px; background-image:url('https://i.onthe.io/smngoz3o9ock88o32.213b3935.png'); } 
header nav li.dropdown .dropdown-container .case-item#roi-case:before { background-size: 25px; background-image:url('https://i.onthe.io/smngoz7ruqn3a3vis.ea659e8a.png'); }

.has-drop-down {
    position: relative;
    cursor: pointer;
}
.drop-down {
    position: absolute;
    background: #fff;
    box-shadow: 0 10px 20px rgba(4,19,59,0.35);
    border-radius: 4px;
    padding: 5px 20px;
    top: calc(100% + 5px);
    left: 50%;
    transform: translate(-50%, -10px);
    opacity: 0;
    transition: all ease-in-out .15s;
    z-index: -1;
    box-sizing: border-box;
    height: 0;
    overflow: hidden;
}
.has-drop-down:hover .drop-down{
    opacity: 1;
    transform: translate(-50%, 5px);
    z-index: 1;
    height: auto;
    overflow: visible;
}
.drop-down a {
    white-space: nowrap;
    display: block;
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
    padding-left: 45px;
    margin: 20px 0;
    color: #04133B !important;
    text-transform: none;
}
.drop-down a:hover,
.drop-down a.active {
    color: #2AABFF !important;
}
.business-dashboard {
    background: url('../icons/business-dash.svg') no-repeat left center;
}
.sales-dashboard {
    background: url('../icons/sales-dash.svg') no-repeat left center;
}
.customer-success-dashboard {
    background: url('../icons/customer-suc.svg') no-repeat left center;
}
.customer-support-dashboard {
    background: url('../icons/customer-sup.svg') no-repeat left center;
}
.marketing-dashboard {
    background: url('../icons/marketing-dash.svg') no-repeat left center;
}
.product-dashboard {
    background: url('../icons/product-dash.svg') no-repeat left center;
}
.financial-dashboard {
    background: url('../icons/finance-dash.svg') no-repeat left center;
}
.hr-dashboard {
    background: url('../icons/hr-dash.svg') no-repeat left center;
}
.project-management-dashboard {
    background: url('../icons/project-management-dashboard.svg') no-repeat left center;
}
.content-analysis-dashboard {
    background: url('../icons/content-analysis-dashboards.svg') no-repeat left center;
}
.new-tag {
    display: inline-block;
    width: 45px;
    line-height: 20px;
    text-align: center;
    color: #2AABFF;
    font-size: 12px;
    background: #E4F2FC;
    border-radius: 4px;
    text-transform: none;
    margin: -4px 0;
}
.drop-down::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -8px;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-bottom: 8px solid #fff;
    transform: translateX(-50%);
}
.drop-down::after {
    content: "";
    position: absolute;
    height: 20px;
    top: -20px;
    left: 0;
    right: 0;
}

@media screen and (max-width: 576px) {
    .drop-down {
        position: static;
        box-shadow: none;
        border-radius: 0;
        opacity: 1;
        overflow: hidden;
        z-index: 1;
        height: 0;
        transform: none;
        padding: 0;
    }
    .has-drop-down:hover .drop-down{
        height: auto;
        transform: none;
    }
    .has-drop-down {
        height: auto !important;
        background-color: #fff !important;
    }
} /*LIGHTER HEADER*/
header.light .logo__item {
    background-image: url(/icons/IO-Technologies.svg);
}

header.light .nav__item,
header.light a {
    color: #fff;
}

header.light .login__button_item {
    color: #fff;
    border-color: #fff;
}
header.light .login__button_item:hover {
    border-color: transparent;
}
header.light .user-email {
    color: #fff;
}





/* media queries */
@media screen and (max-width: 575px) {
    header.light .minimized__header,
    header.light .minimized-menu__header {
        background-color: var(--bg-main);
    }

    header.light .logo__item {
        background-image: url(/icons/IO-Technologies.svg);
    }

    header.light .minimized-menu__col .nav__item {
        border: none;
        border-bottom: 1px solid var(--bg-editorial);
    }
    header.light .minimized-menu__col:first-child .nav__item {
        border-top: 1px solid var(--bg-editorial);
    }

    header.light .minimized-menu__link .button__item {
        box-shadow: none;
    }

    header.light .menu-button__container .svg__path {
        fill: var(--blue-light);
    }
}





/*OVERLAPPED HEADER*/
header.overlap {
    width: 100%;
    position: absolute;
    z-index: 9999;
}





/* media queries */
@media screen and (max-width: 575px) {
    header.overlap
}
 /* nav dropdowns */
header,
header nav li {
    -webkit-transform: translateZ(0px);
}

header nav li.dropdown {
    position: relative;
    z-index: 0;
}

header nav li.dropdown .dropdown-container {
    text-transform: none;
    position: absolute;
    opacity: 0;
    overflow: hidden;
    transform: translateX(-50%);
    transition: opacity 0.1s ease-in;
    left: 50%;
    bottom: 200%;
    width: 1170px;
    box-shadow: 4px 8px 50px 0 rgba(0,0,0,0.2);
    z-index: -1;
}
header nav li.dropdown:hover,
header nav li.dropdown:hover .dropdown-container {
    z-index: 1;
}

header nav li.dropdown .dropdown-container.on {
    opacity: 1;
    bottom: auto;
    top: 50px;
}

header nav li.dropdown .dropdown-container:before {
    content: "";
    position: absolute;
    border: 10px solid transparent;
    border-bottom-color: #f5f9fa;
    bottom: 100%;
    left: 50%;
    margin-left: -144px;
}

header nav li.dropdown .dropdown-container .product-item {
    text-align: center;
    display: block;
}

header nav li.dropdown .dropdown-container .product-item:before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    box-shadow: 1px 1px 0 rgba(0,0,0,.05);
}

.product-item .icon{
    margin: 10px;
}

.product-item .icon img {
    filter: grayscale(.9);
    opacity: .5;
}

.product-item h6{
    margin-top: 10px;
    font-size: 16px;
}

.product-item p {
    font-size: 14px;
    color: #777d99;
    margin: 10px auto 0;
    max-width: 69%;
}

nav .col {
    height: 265px;
}

nav .col:hover .product-item h6,
nav .col:hover .product-item p {
    color: #fff;
}

nav .col:hover .product-item .icon img {
    filter: none;
    opacity: 1;
}

nav .col {
   transition: all 0.3s ease;
   position: relative;
}

nav .col:before {
   content:'';
   position: absolute;
   left:0;
   top:0;
   bottom: 0;
   right:0;
   transition: all 0.2s ease-in;
   opacity: 0;
   z-index: -1;
}
nav .col:hover:before {
   opacity: 1;
    cursor:pointer;
}

nav .col.editorial:before,
nav .col.ceo:before {
   cursor:pointer;
   background: -moz-linear-gradient( -60deg, #603ad6 10%, #a761f7 90%);
   background: -webkit-linear-gradient( -60deg, #603ad6 10%, #a761f7 90%);
   background: -ms-linear-gradient( -60deg, #603ad6 10%, #a761f7 90%);
}

nav .col.smm:before,
nav .col.finance:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #756eea 10%, #53a5e2 90%);
   background: -webkit-linear-gradient( -60deg, #756eea 10%, #53a5e2 90%);
   background: -ms-linear-gradient( -60deg, #756eea 10%, #53a5e2 90%);
}

nav .col.monetization:before,
nav .col.accountsreceivable:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #5ebb40 10%, #77e8ba 90%);
   background: -webkit-linear-gradient( -60deg, #5ebb40 10%, #77e8ba 90%);
   background: -ms-linear-gradient( -60deg, #5ebb40 10%, #77e8ba 90%);
}

nav .col.video:before,
nav .col.sales:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #ea5b5b 10%, #ffc89a 90%);
   background: -webkit-linear-gradient( -60deg, #ea5b5b 10%, #ffc89a 90%);
   background: -ms-linear-gradient( -60deg, #ea5b5b 10%, #ffc89a 90%);
}

nav .col.digital:before,
nav .col.stock:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #2084ea 10%, #6fd3fd 90%);
   background: -webkit-linear-gradient( -60deg, #2084ea 10%, #6fd3fd 90%);
   background: -ms-linear-gradient( -60deg, #2084ea 10%, #6fd3fd 90%);
}

nav .col.audience:before,
nav .col.retail-marketing:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #9d36a9 10%, #e63f6d 90%);
   background: -webkit-linear-gradient( -60deg, #9d36a9 10%, #e63f6d 90%);
   background: -ms-linear-gradient( -60deg, #9d36a9 10%, #e63f6d 90%);
}

nav .col.management:before,
nav .col.ecom:before {
    cursor:pointer;
   background: -moz-linear-gradient( -60deg, #c35c1f 10%, #f7bf3d 90%);
   background: -webkit-linear-gradient( -60deg, #c35c1f 10%, #f7bf3d 90%);
   background: -ms-linear-gradient( -60deg, #c35c1f 10%, #f7bf3d 90%);
}








 header {
    padding: 0;
    margin: 20px auto;
    z-index: 10000;
    position: relative;
}

header .container {
    margin: auto;
}

.minimized__header,
.minimized-menu__header {
    display: none;
}



div.row div.logo {
    width: 210px;
}

.logo__item {
    display: block;
    width: 180px;
    height: 40px;
    background-image: url("/icons/IO-Technologies_on_white.svg");
    background-repeat: no-repeat;
    background-position: left center;
}



nav.nav__row {
    display: flex;
    width: fit-content;
    padding: 0;
}

.nav__col {
    margin: 0 15px;
}

p.nav__item {
    cursor: default;
}
.nav__item {
    display: block;
    margin: 12px 0;
    text-decoration: none;
}
.nav__item {
    color: var(--gray-mid);
    color: #9398A5;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    transition: color .3s;
}
.nav__item a {
    color: inherit;
    text-decoration: none;
}
.subnav__col:hover .subnav {
    opacity: 1;
    transform: scaleY(1) translateX(40%);
}

.nav__item,
.login__button_item {
    color: var(--editorial-text-1);
    color: #213254;
    border-color: var(--editorial-text-1);
    border-color: #213254;
}
.login__button_item:hover {
    color: #fff;
}
header .nav__item:hover,
.subnav__col:hover .nav__item {
    color: var(--blue-mid);
    color: #1c7ee7;
}



.row div.login__button {
    width: 180px !important;
    text-align: right;
}



/* popup subnav */
.subnav {
    position: absolute;
    min-width: 300px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    transform-origin: top left;
    right: 0;
    opacity: 0;
    transform: scaleY(0) translateX(40%);
    transition: opacity .3s, transform .3s;
}

.subnav__col {
    position: relative;
}

.subnav__arrow {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate( -50%, -10px);
}

.subnav ul {
    padding-left: 0;
    margin: 10px 0;
    list-style-type: none;
}

.subnav a {
    text-decoration: none;
    display: block;
    padding: 10px 20px;
    background-color: transparent;
    transition: background-color .3s;
}
.subnav a:hover {
    background-color: #efefef;
}

.subnav img {
    vertical-align: top;
    margin-top: 2px;
}

.subnav .subnav__text {
    display: inline-block;
    margin-left: 5px;
}

.subnav .subnav__text p:first-of-type {
    white-space: nowrap;
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: var(--text-darkblue);
    color: #344563;
}

.subnav .subnav__text p:nth-of-type(2) {
    white-space: nowrap;
    color: var(--editorial-text-2);
    color: #6B778C;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 1px;
    margin: 5px 0;
}

.subnav .icon__container {
    width: 25px;
    display: inline-block;
    vertical-align: top;
}

.login__button_item-md {
    display: none;
}





.row div.login__button.logged-in-user,
.row div.minimized-menu__link .logged-in-user,
.row div.logo .logged-in-user {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    width: fit-content !important;
}
.row div.minimized-menu__link .logged-in-user {
    flex-direction: row;
}
.logged-in-user .user-logo {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    min-width: 35px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: #3ea1e4;
    line-height: 35px;
    text-align: center;
    color: #fff;
}
.logged-in-user .user-button {
    text-align: right;
}
.minimized-menu__link .logged-in-user .user-button {
    text-align: left;
}
.logged-in-user .user-button {
    margin-right: 10px;
}
.minimized-menu__link .logged-in-user .user-button {
    margin-left: 10px;
    margin-right: 0;
}
.logged-in-user .user-email {
    font-size: 18px;
    font-weight: bold;
}
.logged-in-user a {
    display: inline-block;
    opacity: .6;
    transition: opacity .5s;
}
.logged-in-user a:last-of-type {
    margin-left: 15px;
}
.logged-in-user a:hover {
    opacity: 1;
}





/* media queries */
@media screen and (max-width: 1199px)  {
    header div.row nav.col-md-12 {
        width: 100%;
        padding: 0;
    }
    nav[class^="col"] {
        margin: 10px auto;
    }



    header {
        margin: 20px 0 0;
        padding: 0;
    }

    header .row div.login__button {
        text-align: center;
    }

    header .logo__item {
        margin: 0;
    }

    header .login__button_item-md {
        display: block;
    }

    nav + .col {
        display: none;
    }

    .row.fullsize__header div.logo {
        display: flex;
        justify-content: space-around;
        width: 100%;
    }
}





@media screen and (max-width: 575px) {
    header {
        position: fixed !important;
        width: 100%;
        z-index: 10000000;
        margin: 0;
    }

    header .minimized__header {
        display: flex !important;
    }

    header .minimized-menu__header,
    header .fullsize__header {
        display: none;
    }

    header .minimized__header {
        overflow: hidden;
        position: fixed;
        width: 100vw;
        top: 0;
        z-index: 100000000;
    }

    header .container {
        position: relative;
        margin: 0;
        overflow-y: auto;
    }

    header .minimized-menu__header {
        display: flex;
        overflow-y: auto;
        max-height: calc(100vh - 50px);
        position: fixed;
        top: 50px;
        z-index: 1000;
        transform: translateY(-170%);
        transition: transform .3s;
    }

    .minimized-bg-closer__header {
        display: flex;
        height: 100vh;
        width: 100vw;
        opacity: 0;
        background-color: #6f6f6f;
        position: absolute;
        z-index: 100;
        top: -100%;
        transition: opacity .3s, top .3s;
    }

    header .container.minimized-menu__on {
        height: 100vh;
    }

    header .container.minimized-menu__on .minimized-menu__header {
        transform: none;
    }

    header .container.minimized-menu__on .minimized-bg-closer__header {
        opacity: .7;
        top: 0;
    }

    header .minimized__header {
        height: 50px;
        margin: 0 0 0 -15px;
        flex-wrap: nowrap;
        background-color: var(--bg-editorial);
        background-color: #FAFBFC;
    }

    header .minimized__header > div:nth-of-type(2) {
        text-align: right;
    }

    header .minimized-menu__header {
        background-color: #fff;
    }

    header .minimized-menu__header {
        width: 100vw;
        overflow-x: hidden;
    }

    header .minimized-menu__col {
        padding-right: 0;
    }

    header .minimized-menu__col .nav__item {
        border: 2px solid var(--bg-editorial);
        border: 2px solid #FAFBFC;
        border-left: none;
        border-right: none;
    }

    header .minimized-menu__col:not(:last-of-type) .nav__item {
        margin: 0 -15px;
        padding-left: 15px;
        height: 40px;
        line-height: 40px;
        transition: background-color .3s, color .3s;
    }

    header .minimized-menu__col:last-of-type .nav__item {
        border: none;
    }

    header .minimized-menu__col:not(:last-of-type) .nav__item:hover {
        background-color: var(--bg-editorial);
        background-color: #FAFBFC;
    }

    header .minimized-menu__link {
        min-height: 150px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
    }

    header .minimized-menu__link .nav__item {
        padding: 0;
        height: auto;
        font-size: 15px;
        line-height: 15px;
    }

    header .minimized-menu__link .button__item {
        width: 100%;
        max-width: 180px;
        height: 50px;
        box-shadow: 0 4px 7px 0 #e6e6e6;
        border: 1px solid var(--blue-light);
        border: 1px solid #1EB6FF;
        text-transform: uppercase;
        background-color: var(--blue-light);
        background-color: #1EB6FF;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        font-weight: bold;
        outline: none;
        cursor: pointer;
        transition: color .3s, background-color .3s;
    }

    header .minimized-menu__link .button__item:hover {
        color: var(--blue-light);
        color: #1EB6FF;
        background-color: #fff;
    }

    .submenu__on .subnav {
        max-height: calc(3 * 66px);
        opacity: 1;
        transform: scaleY(1);
    }

    .subnav {
        width: calc(100% + 15px);
        max-height: 0;
        position: initial;
        transform: scaleY(0);
        border: none;
        background-color: #F4F7FB;
        margin-left: -15px;
        transition: opacity .3s, transform .3s, max-height .3s;
    }

    .subnav__arrow {
        display: none;
    }

    .subnav ul {
        margin: 0;
    }

    header .menu-button__container {
        cursor: pointer;
        position: relative;
        display: inline-block;
        width: 25px;
        height: 25px;
        border-radius: 5px;
        border: 1px solid transparent;
        background-color: transparent;
        vertical-align: middle;
        margin-right: 10px;
        transition: border .3s, background-color .3s;
    }

    header .menu-button__container:hover {
        border: 1px solid #d2d2d2 !important;
        background-color: #f1f1f1 !important;
    }

    header .container.minimized-menu__on .menu-button__container {
        border: 1px solid #d2d2d2;
        background-color: transparent;
    }

    header .menu__button {
        height: 16px;
        width: 0;
        top: 50%;
        right: 50%;
        position: absolute;
        transform: scale(0) translate(50%, -50%);
        transition: transform .3s, width .3s;
    }

    header .menu__close,
    header .minimized-menu__on .menu__open {
        width: 0;
        transform: scale(0) translate(50%, -50%);
    }

    header .menu__open,
    header .minimized-menu__on .menu__close {
        width: 16px;
        transform: scale(1) translate(50%, -50%);
    }

    .submenu__on .nav__item,
    .nav__item:hover {
        color: var(--blue-mid);
        color: #1c7ee7;
        cursor: pointer;
    }

    header .with-submenu .nav__item::after {
        content: '';
        position: absolute;
        background: url(/icons/icon_next.svg) no-repeat center;
        background-size: 120%;
        width: 8px;
        height: 8px;
        min-height: 40px;
        right: 9.2%;
        transform: rotate(90deg);
        transition: transform .3s;
    }
    header .with-submenu.submenu__on .nav__item::after {
        transform: rotate(-90deg);
    }
}
 .loader {
    position: fixed;
    left:0;
    top:0;
    bottom:0;
    right: 0; 
    opacity: 0;
    visibility: hidden; 
    transition:all 0.7s ease;
    z-index:99999; 
}

.loader.on {
    opacity: 1;
    visibility: visible;
}

@-ms-keyframes title { 
    0% {
        opacity: 0; 
        right: 130px;
    }
    48% {
        opacity: 0;
        right: 130px;
    }
    52% {
        opacity: 1;
        right: 30px;
    }
    70% {
        opacity: 1;
        right: 30px;
    }
    100% {
        opacity: 0;
        right: 30px;
    }
}

@-webkit-keyframes title {
    0% {
        opacity: 0; 
        right: 130px;
    }
    48% {
        opacity: 0;
        right: 130px;
    }
    52% {
        opacity: 1;
        right: 30px;
    }
    70% {
        opacity: 1;
        right: 30px;
    }
    100% {
        opacity: 0;
        right: 30px;
    }
}
@-moz-keyframes title {
    0% {
        opacity: 0;
        right: 130px;
    }
    48% {
        opacity: 0;
        right: 130px;
    }
    52% {
        opacity: 1;
        right: 30px;
    }
    70% {
        opacity: 1;
        right: 30px;
    }
    100% {
        opacity: 0;
        right: 30px;
    }
}
@-ms-keyframes fade {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-webkit-keyframes fade {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-moz-keyframes fade {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-ms-keyframes bg {
    0% {
        background-color: #306f99;
    }
    50% {
        background-color: #4db399; 
    }
    90% {
        background-color: #bd4f71;
    }
}
@-webkit-keyframes bg {
    0% {
        background-color: #306f99;
    }
    50% {
        background-color: #4db399; 
    }
    90% {
        background-color: #bd4f71;
    }
}
@-moz-keyframes bg {
    0% {
        background-color: #306f99;
    }
    50% {
        background-color: #4db399;
    }
    90% {
        background-color: #bd4f71; 
    }
}
@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    10% {
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    35% {
        opacity: 1;
    }
    40% {
        opacity: 0;
        right: -21px;
    }
    45% {
        opacity: 1;
        right: 80px;
    }
    50% {
        opacity: 0;
        right: -21px;
    }
    51% {
        right: -21px;
    }
    55% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    65% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    75% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    90% {
        opacity: 0;
        right: -21px;
    }
    95% {
        opacity: 1;
        right: 80px;
    }
    96% {
        right: -21px;
    }
    100% {
        opacity: 0;
        right: -21px;
    }
}
@-moz-keyframes blink {
    0% {
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    10% {
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    35% {
        opacity: 1;
    }
    40% {
        opacity: 0;
        right: -21px;
    }
    45% {
        opacity: 1;
        right: 80px;
    }
    50% {
        opacity: 0;
        right: -21px;
    }
    51% {
        right: -21px;
    }
    55% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    65% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    75% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    90% {
        opacity: 0;
        right: -21px;
    }
    95% {
        opacity: 1;
        right: 80px;
    }
    96% {
        right: -21px;
    }
    100% {
        opacity: 0;
        right: -21px;
    }
}

@-ms-keyframes blink { 
    0% {
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    10% {
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    20% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    35% {
        opacity: 1;
    }
    40% {
        opacity: 0;
        right: -21px;
    }
    45% {
        opacity: 1;
        right: 80px;
    }
    50% {
        opacity: 0;
        right: -21px;
    }
    51% {
        right: -21px;
    }
    55% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    65% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    75% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    85% {
        opacity: 1;
    }
    90% {
        opacity: 0;
        right: -21px;
    }
    95% {
        opacity: 1;
        right: 80px;
    }
    96% {
        right: -21px;
    }
    100% {
        opacity: 0;
        right: -21px;
    }
}


.loader { 
    font-family: Purista, sans-serif, arial;
    background: #07202f;         
    color: #eaf7ff;
}

.loader .wrap {
    position: absolute;
    width: auto; 
    top: 50%;
    left: 50%;
    margin-left: -80px;
    margin-top: -40px;
}
.loader .bg {
    padding: 30px 30px 30px 0;
}

.loader .bg:before {
    content: '';
    position: absolute;
    left:20px;
    top:20px;
    bottom:20px; 
    right: 20px;
    background: #306f99;
    -moz-animation: bg 1.5s linear infinite;
    -webkit-animation: bg 1.5s linear infinite;
    animation: bg 1.5s linear infinite;
    filter: blur(30px);
    -moz-filter: blur(30px);
    -ms-filter: blur(30px);
    -webkit-filter: blur(30px); 
    filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='30'); 
    -ms-filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='30');  
}


.loader .loading {
    position: relative;
    text-align: right;
    text-shadow: 0 0 6px #bce4ff;
    height: 20px;
    width: 150px;
}
.loader .loading span {
    display: block;
    text-transform: uppercase;
    position: absolute;
    right: 30px;
    height: 20px;
    width: 400px; 
    line-height: 20px;
}
.loader .loading span:after {
    content: "";
    display: block;
    position: absolute;
    top: -2px;
    right: -21px;
    height: 20px;
    width: 16px;
    background: #eaf7ff;
    -moz-box-shadow: 0 0 15px #bce4ff;
    -webkit-box-shadow: 0 0 15px #bce4ff;
    box-shadow: 0 0 15px #bce4ff;
    -moz-animation: blink 3.4s infinite;
    -webkit-animation: blink 3.4s infinite; 
    animation: blink 3.4s infinite;
}
.loader .loading span.title {
    font-size: 24px;
    font-weight: bold;
    -moz-animation: title 5s linear infinite; 
    -webkit-animation: title 5s linear infinite;
    animation: title 5s linear infinite;
}
.loader .loading span.text {
    font-size: 24px;
    font-weight: bold;
    -moz-animation: title 5s linear 2.5s infinite;
    -webkit-animation: title 5s linear 2.5s infinite;
    animation: title 5s linear 2.5s infinite; 
    opacity: 0;
}    .page-head {
    padding-top: 120px;
    background: rgb(103,90,237);
    background-image: -moz-linear-gradient( -47.49deg, #573ccc 34%, #a062f7 100%);
    background-image: -webkit-linear-gradient( -47.49deg, #573ccc 34%, #a062f7 100%);
    background-image: -ms-linear-gradient( -47.49deg, #573ccc 34%, #a062f7 100%);
    padding-bottom: 200px;
}

.page-head .icon {
    display: inline-block;
    height: 62px;
    width: 62px;
    border-radius: 100%;
    background: #fff;
    position: relative;
}

.page-head .icon img {
    position: absolute;
    height: 30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.particles {
    position: absolute;
}

.wave_item {
    z-index: 10;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 20px 20px 0;
    transition: all 20s linear;
}

.wave_item.wave_circle {
    border: 2px solid #fff;
}
.wave_item.wave_disc {
    background: #fff;
} .qna-block {
    margin:100px auto; 
    width: 550px;
    position: relative;
}


.qna-block .qna-block-item {
    margin: 40px 0;
}

.qna-block .qna-block-item .qna-block-human, .qna-block .qna-block-item .qna-block-alien  {
    transition-duration: 1s; 
}

.qna-block .qna-block-item[data-color="purpure"] .human-ask {  
     background-color:#a67fcb; 
    -webkit-box-shadow: 0px 0px 46px 0px rgba(166,127,203,0.87); 
    -moz-box-shadow: 0px 0px 46px 0px rgba(166,127,203,0.87);
    box-shadow: 0px 0px 46px 0px rgba(166,127,203,0.87);
}

.qna-block .qna-block-item[data-color="green"] .human-ask {  
     background-color:#98b56f; 
    -webkit-box-shadow: 0px 0px 46px 0px rgba(152,181, 111,0.87);  
    -moz-box-shadow: 0px 0px 46px 0px rgba(152,181, 111,0.87); 
    box-shadow: 0px 0px 46px 0px rgba(152,181, 111,0.87); 
}

.qna-block .qna-block-item[data-color="yellow"] .human-ask {  
     background-color:#e0b554; 
    -webkit-box-shadow: 0px 0px 46px 0px rgba(224, 181, 84 ,0.87); 
    -moz-box-shadow: 0px 0px 46px 0px rgba(224, 181, 84 ,0.87);
    box-shadow: 0px 0px 46px 0px rgba(224, 181, 84 ,0.87); 
}

.qna-block .qna-block-item[data-color="red"] .human-ask {  
     background-color:#eb6069; 
    -webkit-box-shadow: 0px 0px 46px 0px rgba(235, 96, 105, 0.87);  
    -moz-box-shadow: 0px 0px 46px 0px rgba(235, 96, 105, 0.87);
    box-shadow: 0px 0px 46px 0px rgba(235, 96, 105, 0.87); 
}


/* human */
.qna-block .human-avatar {
    position: absolute;
    left:-20px;
    transform: translate(-100%,0);
}

.qna-block .human-ask {
    border-radius: 15px; 
    padding: 25px 40px;   
    display: inline-block;
    color: white;
    font-size:18px;
    font-weight:bold;
    background: white;
}

.qna-block .human-avatar img {
    height: 130px; 
}


/* alien */ 

.qna-block .qna-block-alien {
    margin:50px 0; 
}

.qna-block .alien-avatar {
    position: absolute;
    right:-20px; 
    transform: translate(100%,0);
}

.qna-block .alien-ask { 
    color:#314c5e; 
    border-radius: 15px; 
    padding: 20px 40px; 
    color: white;
    font-size:18px;
    font-weight:bold;
    background: white;
}

.qna-block .alien-ask ul {
    padding-left: 30px;
}

.qna-block .alien-ask ul li {
    margin:30px 0;  
    position: relative;
}

.qna-block .alien-ask ul li:before {
    content: '';
    position: absolute;
    left:-20px; 
    transform: translate(-100%,0);
    top:5px; 
    width: 10px;
    height: 10px;
    background: #314c5e;
    border-radius: 50%; 
}

.qna-block .alien-ask ul p {
    margin:5px 0;
}

.qna-block .alien-ask p {
    color:#314c5e; 
    margin:15px 0 25px 0; 
}

.qna-block .alien-avatar img { 
    height: 130px; 
} #survey {
     position: fixed;
     bottom: 0px;
     display: inline-block;
     background-color: #ffffff;
     z-index: 999;
     transition: all ease-in-out 0.4s;
     right: 30px;
     opacity: 0;
     padding: 10px;
     border-radius: 10px;
     min-heigh: 100px;
     -webkit-box-shadow: 0px 0px 154px 0px rgba(0,0,0,0.2); 
    -moz-box-shadow: 0px 0px 154px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 154px 0px rgba(0,0,0,0.2);
    }
#survey.show {
    bottom:  100px;
    opacity: 1;
}
.inner_survey{
    display: flex;
    padding: 10px;
}
.inner_survey .question_title {
    font-size: 12px;
    font-weight: 500;
}
.inner_survey img {
    height: 50px;
    width: auto;
    margin-right: 10px;
}
#survey .close {
    position: absolute;
    height: 10px;
    width: 10px;
    top: 5px;
    right: 5px;
    font-weight: 400;
    opacity: 0.3;
    cursor: pointer;
    display: block;
    transform: rotate(45deg)
}
#survey .byIO {
    display: block;
    opacity: 0.3;
    text-align: right;
    font-size: 10px;
}
#survey .input_wrapp input{
    opacity: 0;
}
#survey .input_wrapp input[type="radio"]:checked + label::after{
    content: '';
    position: absolute;
    left: -18px;
    top: 2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #4A90E2;
}
#survey .input_wrapp label{
    position: relative;
    font-size: 12px
}
#survey .input_wrapp label::before{
    content: '';
    position: absolute;
    display: block;
    height: 12px;
    width: 12px;
    top: 0;
    left: -20px;
    border-radius: 50%;
    border: 1px solid #4A90E2;
}
#question_succes {
    visibility: hidden;
    height: 0px;
    padding: 0;
}
#question_succes .succes_survey{
    display: flex;
    align-items: center;
}
#question_succes.succes_show {
    padding: 10px;
    height: auto;
    visibility: visible;
}




 /* Articles styles */

.blog-wrap {
    width:1170px;
} 


.blog-wrap .article-preview {
    margin: 0 auto; 
    width: 100%;
}

.blog-wrap .article-preview .article-preview__title {
    color:white; 
    font-size: 28px;
    position:absolute; 
    left:40px; 
    right:40px; 
    top:50%;
    transform: translate(0,-50%);
} 

.blog-wrap .article-preview .article-preview__img {
    position: relative;
    width: 100%;
    height: 330px;
    background-size: cover;
    background-position: center;
    transition:all 0.3s ease;
    background-repeat: no-repeat;
}

.blog-wrap .article-preview .article-preview__img:before { 
    content:'';
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background: #050f49;
    opacity: 0.7;
    transition:all 0.3s ease;
}

.blog-wrap .article-preview img {
    margin:0;
    transition:all 0.3s ease;
}


/* Hover */
.blog-wrap .article-preview:hover .article-preview__img:before {
     opacity: 0.85;
}

.blog-wrap .article-preview:hover {
    cursor: pointer;
}


 .bullet-comet {
    display: block;
    width: 1px;
    margin: 25px auto;
    position: relative;
    height: 115px;
}

.bullet-comet:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    left: 50%;
    bottom: 0;
    margin-left: -3.5px;
    background: #55c4ff;
    box-shadow: 0 0 0 15px #deeffa, 0 0 0 16px #55c4ff;
    border-radius: 100%;
}

.bullet-comet:after {
    content: "";
    width: 1px;
    height: 100px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    background-image: -moz-linear-gradient( 90deg, #55c4ff 0%, transparent 90%);
    background-image: -webkit-linear-gradient( 90deg, #55c4ff 0%, transparent 90%);
    background-image: -ms-linear-gradient( 90deg, #55c4ff 0%, transparent 90%);
} .dashboard-holder {
    position: relative;
    margin-top: 50px;
    position: relative;
}

.blur-dashboard {
    display: block;
    margin: 0 auto;
    border-radius: 6px;
}

.tooltip-item {
    position: absolute;
    top: 0;
    left: 50%;
}

.tooltip-box {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 0 50px rgba(0,0,0,.15);
    font-weight: 400;
    color: #7d8093;
    font-size:13px;
    max-width: 235px;
    padding: 10px 20px;
    text-align: left;
    line-height: 1.3;
}

.tooltip-box:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    width: 60px;
    height: 1px;
    margin-top: -1px;
    background: #55c4ff;
    background-image: -moz-linear-gradient( 0deg, #fff 0%, #55c4ff 100%);
    background-image: -webkit-linear-gradient( 0deg, #fff 0%, #55c4ff 100%);
    background-image: -ms-linear-gradient( 0deg, #fff 0%, #55c4ff 100%);
    border-radius: 100%;
    z-index: 1;
}

.tooltip-box:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-left: 60px;
    margin-top: -4px;
    width: 7px;
    height: 7px;
    background: #55c4ff;
    border-radius: 100%;
    z-index: 1;
}

.toolip-magnifier {
    overflow: hidden;
    border-radius: 100%;
    box-shadow: 0 0 0 1px #55c4ff; 
    position: absolute;
    left: 100%;
    margin-left: 50px;
    top: 50%;
    transform: translateY(-50%);
}

.toolip-magnifier:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: inset 0 -15px 20px rgba(0,0,0,.1),
                inset 0  15px 20px rgba(255,255,255,.1);
    border-radius: 100%;
}

.toolip-magnifier img {
    display: block;
}

.tooltip-item.right .toolip-magnifier {
    left: auto;
    margin-left: 0;
    right: 100%;
    margin-right: 50px;
}


.tooltip-item.right .tooltip-box:before {
    left: auto;
    right: 100%;
    background-image: -moz-linear-gradient( 180deg, #fff 0%, #55c4ff 100%);
    background-image: -webkit-linear-gradient( 180deg, #fff 0%, #55c4ff 100%);
    background-image: -ms-linear-gradient( 180deg, #fff 0%, #55c4ff 100%);
}
.tooltip-item.right .tooltip-box:after {
    left: auto;
    margin-left: 0;
    right: 100%;
    margin-right: 60px;
} .icon-circle {
    border-radius: 100%;
}

i.icon {
    position: relative;
    height: 50px;
    width: 50px;
    border-radius: 100%;
    background: #fff;
    display: inline-block;
    box-shadow: 0 3px 13px rgba(0, 0, 0, .1);
}

i.icon img,
i.icon svg {
    position: absolute;
    width: 30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.col.video object #a stop {
    stop-color: #ccc;
} @media all and (-ms-high-contrast:none)
{
    *::-ms-backdrop, .screen-welcome .curved_edge {
        height: 120px;
    }
    *::-ms-backdrop, .screen-tabs .curved_edge {
        height: 100px;
    }
    *::-ms-backdrop, .screen-solutions .curved_edge {
        height: 170px;
    }
    *::-ms-backdrop, .screen-values .curved_edge,
    *::-ms-backdrop, .screen-success .curved_edge {
        height: 80px;
    }
    *::-ms-backdrop, .particles+.curved_edge {
        height: 200px;
    }

    *::-ms-backdrop, .screen-sales-section-a .curved_edge {
        height: 90px;
    }
    *::-ms-backdrop, .screen-sales-section-e .curved_edge {
        height: 135px;
    }

} .shapes:before,
.shapes:after {
    content: "";
    position: absolute;
    background: url('https://i.onthe.io/smngoz4gs293360vo.7d54a291.png') no-repeat;
    background-size: 989px auto;
    z-index: 5;
}

.shapes-1:before {
    display: none;
    width: 170px;
    height: 230px;
    left: 60px;
    bottom: 100%;
    margin-bottom: -45px;
}

.shapes-2:after {
    display: none;
    width: 300px;
    height: 230px;
    right: 60px;
    bottom: 100%;
    margin-bottom: -53px;
    background-position: -222px 0;
}

.shapes-3:before {
    display: none;
    width: 193px;
    width: 193px;
    height: 230px;
    right: 60px;
    top: 100%;
    margin-top: -69px;
    background-position: -823px 0;
}

.shapes-5:before {
    display: none;
    width: 170px;
    height: 230px;
    left: 130px;
    top: 100%;
    margin-top: -133px;
}

.shapes-4:after {
    display: none;
    width: 144px;
    height: 230px;
    right: 144px;
    top: 100%;
    margin-top: 12px;
    background-position: -623px 0;
} .edge_contetnt_bottom {
    top: auto;
    bottom: -5px;
    z-index: 3;
}

.edge_contetnt_top {
    top: -5px;
    bottom: auto;
    z-index: 3;
}

.edge_contetnt_ghost:nth-child(2) {
    left: 15px;
    bottom: 10px;
    opacity: .2;
}
.edge_contetnt_ghost:nth-child(3) {
    left: 30px;
    bottom: 20px;
    opacity: .12;
}
.edge_contetnt_ghost:nth-child(4) {
    left: 45px;
    bottom: 30px;
    opacity: .04;
}

.edge_contetnt_ghost-top {
    opacity: .02;
}

.icon-bubble {
    display: inline-block;
    background: #fff;
    border-radius: 100%;
    width: 1em;
    height: 1em;
    box-shadow: 0 13px 20px rgba(0,0,0,.1);
    position: relative;
    vertical-align: middle;
    font-size: 77px;
}

.icon-bubble:before,
.icon-bubble:after {
    content: "";
    width: 8px;
    height: 8px;
    border: 1px solid #dadbf9;
    position: absolute;
    border-radius: 100%;
}
.icon-bubble:before {
    left: 115%;
    top: 25%;
    box-shadow: -30px -35px 0 -3px #dadbf9, -25px 60px 0 -3px #dadbf9;
}
.icon-bubble:after {
    right: 100%;
    top: 75%;
    box-shadow: 5px -35px 0 -1px #dadbf9;
    z-index: -1;
}

.bubble-home-w {
    box-shadow: 0 13px 20px rgba(105, 102, 231, 0.12)
}

.bubble-home-a {
    box-shadow: 0 13px 20px #cff7e3;
}

.bubble-home-t {
    box-shadow: 0 13px 20px #fbecc2;
}

.bubble-fb {
    box-shadow: 0 13px 16px #5971be85;
    background: #5971be;
}

.bubble-tw {
    box-shadow: 0 13px 16px #55acee85;
    background: #55acee;
}

.icon-bubble img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: .5194em;
}

.icon-bubble.bubble-home-t img,
.icon-bubble.bubble-home-a img {
    width: 33px;
}

.icon-bubble.bubble-home-a:before {
    border-color: #cff7e3;
    box-shadow: -30px -35px 0 -3px #cff7e3, -25px 60px 0 -3px #cff7e3;
}
.icon-bubble.bubble-home-a:after {
    border-color: #cff7e3;
    box-shadow: 5px -35px 0 -1px #cff7e3;
}

.icon-bubble.bubble-home-t:before {
    border-color: #fbecc2;
    box-shadow: -30px -35px 0 -3px #fbecc2, -25px 60px 0 -3px #fbecc2;
}
.icon-bubble.bubble-home-t:after {
    border-color: #fbecc2;
    box-shadow: 5px -35px 0 -1px #fbecc2;
}


/* white */
.icon-bubble.bubble-white:before,
.icon-bubble.bubble-white:after {
    border-color: rgba(255,255,255,.4);
}
.icon-bubble.bubble-white:before {
    box-shadow: -30px -35px 0 -3px rgba(255,255,255,.4), -25px 60px 0 -3px rgba(255,255,255,.4);
}
.icon-bubble.bubble-white:after {
    box-shadow: 5px -35px 0 -1px rgba(255,255,255,.4);
}
.icon-bubble.bubble-white img {
    width: auto;
    height: .5194em;
}

.icon-bubble.icon-bubble-clean:before,
.icon-bubble.icon-bubble-clean:after {
    display: none;
}

.icon-bubble.icon-bubble-bigger {
    font-size: 90px;
    box-shadow: 0 5px 20px rgba(0,0,0,.1);
}
.icon-bubble.icon-bubble-bigger.bubble-white img {
    width: .4444em;
    height: auto;
}

.button-theme {
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid transparent;
    padding: 15px 30px;
    color: #6dc5f7;
    border-radius: 4px;
    line-height: 1;
}

.retail-col {
    border-top: 1px solid rgba(0,0,0,.06);
    margin-top: 30px;
}

.button-theme svg {
    margin-left: 3px;
}

.button-theme span,
.button-theme svg {
    display: inline-block;
    vertical-align: middle;
}

.button-theme:hover {
    color: #fff !important;
    background: #6dc5f7;
    border-color: #6dc5f7;
}

.button-theme svg path {
    fill: #6dc5f7;
}

.button-theme:hover svg path {
    fill: #fff !important;
}

/*.digital .button-theme,
.stock .button-theme {
    color: #6dc5f7;
    background: #6dc5f726;
    border-color: #6dc5f799;
}
.digital .button-theme:hover,
.stock .button-theme:hover {
    background: #6dc5f7;
    border-color: #6dc5f7;
}
.digital .button-theme svg path,
.stock .button-theme svg path {
    fill: #6dc5f7;
}

.smm .button-theme,
.finance .button-theme {
    color: #7976f0;
    background: #7976f026;
    border-color: #7976f099;
}
.smm .button-theme:hover,
.finance .button-theme:hover {
    background: #7976f0;
    border-color: #7976f0;
}
.smm .button-theme svg path,
.finance .button-theme svg path {
    fill: #7976f0;
}

.audience .button-theme,
.retail-marketing .button-theme {
    color: #c1567d;
    background: #c1567d26;
    border-color: #c1567d99;
}
.audience .button-theme:hover,
.retail-marketing .button-theme:hover {
    background: #c1567d;
    border-color: #c1567d;
}
.audience .button-theme svg path,
.retail-marketing .button-theme svg path {
    fill: #c1567d;
}

.management .button-theme,
.ecom .button-theme {
    color: #c47c35;
    background: #c47c3526;
    border-color: #c47c3599;
}
.management .button-theme:hover,
.ecom .button-theme:hover {
    background: #c47c35;
    border-color: #c47c35;
}
.management .button-theme svg path,
.ecom .button-theme svg path {
    fill: #c47c35;
}

.monetization .button-theme,
.acc .button-theme {
    color: #78b666;
    background: #78b66626;
    border-color: #78b66699;
}
.monetization .button-theme:hover,
.acc .button-theme:hover {
    background: #78b666;
    border-color: #78b666;
}
.monetization .button-theme svg path,
.acc .button-theme svg path {
    fill: #78b666;
}

.video .button-theme,
.sales .button-theme {
    color: #d15469;
    background: #d1546926;
    border-color: #d1546999;
}
.video .button-theme:hover,
.sales .button-theme:hover {
    background: #d15469;
    border-color: #d15469;
}
.video .button-theme svg path,
.sales .button-theme svg path {
    fill: #d15469;
}*/

.switcher {
    text-align: center;
    position: relative;
    z-index: 1;
}

.switcher-item {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    padding: 10px 17px;
    border-radius: 100px;
    border: 1px solid transparent;
    text-transform: uppercase;
    margin: 10px 0;
    opacity: .5;
    cursor: pointer;
    transition: all .3s ease-in-out;
}

.switcher-item:hover,
.switcher-item.on {
    border-color: rgba(119, 125, 153, .5);
    opacity: 1;
}

.switcher.switcher-light .switcher-item {
    color: #fff;
}
.switcher.switcher-light .switcher-item:hover,
.switcher.switcher-light .switcher-item.on {
    border-color: rgba(255, 255, 255, .5);
}

[data-switch-content] {
    display: none;
}
[data-switch-content].on {
    display: block;
}

.ceo i.icon img,
.sales i.icon img {
    width: 24px;
}


 .ui-window {
    box-shadow: inset 0 0 0 1px #e7ebef;
    border-radius: 7em;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 0 100px rgba(0,0,0,.1);
    display: inline-block;
    font-size: 1px;
}

.ui-window .window-preview {
    width: 100%;
}

.ui-window .window-title {
    height: 25em;
    position: relative;
    background: #f9f7f9;
    background-image: linear-gradient(-180deg, #fdfcfd 0%, #eae8eb 100%);
    border-bottom: 1px solid #d9d9d9;
}

.ui-window .window-title:after {
    content: "";
    width: 8em;
    height: 8em;
    border-radius: 100%;
    background: #ff6248;
    position: absolute;
    top: 9em;
    left: 15em;
    box-shadow: 15em 0 0 #ffd156, 31em 0 0 #97ea59;
}

.ui-window.dark {
    box-shadow: inset 0 0 0 1px #1a2441;
}

.ui-window.dark .window-title {
    height: 37em;
    position: relative;
    background: #1a2441;
    border-bottom: 0;
}

.ui-window.dark .window-title:after {
    top: 14em;
} .screen-welcome { 
    padding-top: 120px;   
    text-align: center;
    background: url('/background1.svg?121234');
    background-position: center;
    background-size: cover;
}

.screen-welcome h1 {
    font-size: 60px;
}

.screen-welcome b {
    color:#3ea1e4;
}

.screen-welcome p {
    font-size: 20px;
    font-weight: 300;
}

.screen-welcome mark {
    background: none; 
    color:#4eb7ff; 
}

@media (max-width:1170px) {
    .screen-welcome br {
        display: none;
    }
} #page-gdpr .text-block {
    margin-top:50px;
}

.white-block {
    background: #f3f8f9; 
}

h1 {
    margin-top: 50px;
}





@media screen and (max-width: 575px) {
    .screen-item.screen-welcome {
        padding-top: 30px;
    }
}