.header .open-m-menu {
    display: none !important;
}

.btn-raq {
    display: none !important;

}

a, blockquote, body, button, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, html, iframe, img, input, legend, li, object, ol, p, pre, select, textarea, ul {
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

span {
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
    display: block
}

audio, canvas, video {
    display: inline-block
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden] {
    display: none
}

svg:not(:root) {
    overflow: hidden
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

button, html, input, select, textarea {
    : sans-serif
}

blockquote, q {
    quotes: none
}

blockquote:after, blockquote:before, q:after, q:before {
    content: '';
    content: none
}

a {
    text-decoration: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

ol, ul {
    list-style: none
}

a:active, a:hover, label:active, label:focus {
    outline: 0
}

img {
    border: 0;
    vertical-align: middle
}

fieldset {
    border: none
}

button, input, select, textarea {
    font-size: 100%;
    vertical-align: baseline
}

textarea {
    overflow: auto;
    min-height: 30px;
    max-height: 400px;
    resize: vertical
}

input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0;
    vertical-align: middle
}

button, html input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

input[type=search] {
    -webkit-appearance: textfield
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

button[disabled], input[disabled] {
    cursor: default
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input:-webkit-autofill, input:-webkit-aut.header .open-m-menu {
    display: none;
}

ofill:focus, input:-webkit-autofill:hover {
    -webkit-box-shadow: 0 0 0 1000px #f6f6f6 inset;
    border-radius: 50%
}

small {
    font-size: 85%
}

strong, th {
    font-weight: 700
}

td, td img {
    vertical-align: top
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    margin: 0
}

html {
    height: 100%
}

body {
    
    background: #000;
    height: 100%;
    width: 100%
}

input, select, textarea {
    color: #444;
    font-size: 12px;
    
}

a:link {
    -webkit-tap-highlight-color: #478FB2
}

a {
    color: #4aa6bd
}


    


::-webkit-input-placeholder {
    color: #878a8c
}

::-moz-placeholder {
    color: #878a8c;
    opacity: 1
}

::-moz-selection {
    color: #fff;
    background: #0078AE
}

::selection {
    color: #fff;
    background: #0078AE
}

:focus::-webkit-input-placeholder {
    color: transparent
}

:focus::-moz-placeholder {
    color: transparent
}

.aside a, .das-item .das-content h3 a, .foot-area a:not(.btn-simple), .header a, .job-section .js-item h3 a, .mce-content a, .oms-item a h2 .whitepaper-subtext p a, .site-map a, .soc-column .socc-text a, .text-lnk {
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out;
    cursor: pointer
}

.clearfix:after, .clearfix:before, .container:after, .container:before, .f-row:after, .f-row:before, .nav:after, .nav:before {
    content: "";
    display: table
}

.clearfix:after, .container:after, .f-row:after, .nav:after {
    clear: both
}

.debug {
    border: 1px dotted red !important
}

.hidden {
    display: none;
    visibility: hidden
}

.no-marg {
    margin: 0 !important
}

.no-marg-b {
    margin-bottom: 0 !important
}

.no-pad {
    padding: 0 !important
}

.no-pad-b {
    padding-bottom: 0 !important
}

.no-pad-t {
    padding-top: 0 !important
}

.no-bg {
    background: none !important
}

.no-bd {
    border: none !important
}

.fl-l {
    float: left !important
}

.fl-r {
    float: right !important
}

.fl-none {
    float: none !important
}

.a-center {
    text-align: center !important
}

.a-left {
    text-align: left
}

.a-right {
    text-align: right
}

.clear {
    clear: both
}

.d-block {
    display: block !important
}

.d-none {
    display: none
}

.rel-holder {
    position: relative
}

.error-messages, .warning_mess {
    color: red
}

.error-messages li, .ul_message_box li {
    padding: 0 0 6px
}

.form-login-box .error-messages {
    margin-left: 25px
}

.text-alt {
    color: #0078ae
}

.show-in-desktop, .show-in-mobile, .show-in-tablet {
    display: none
}

.d-block-mobile, .d-block-tablet {
    display: inline
}

.t-holder {
    display: table;
    width: 100%
}

.t-cell {
    display: table-cell;
    vertical-align: middle
}

.ir {
    border: 0;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
    background-color: transparent
}


    


.frame {
    max-width: 980px;
    margin: 0 auto;
    min-width: 268px
}

.frame-narrow {
    max-width: 724px
}

.frame-wide {
    max-width: 1144px
}

@font-face {
    : roboto-regular-webfont;
    font-weight: 700;
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: local("roboto-regular-webfont Regular"), local("century-gothic"), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format("woff"), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format("truetype")
}

@font-face {
    : roboto-black-webfont;
    font-weight: 700;
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: local("roboto-black-webfont Regular"), local("century-gothic"), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format("woff"), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format("truetype")
}

@font-face {
    : roboto-bold-webfont;
    font-weight: 700;
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: local("roboto-bold-webfont Regular"), local("century-gothic"), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format("woff"), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format("truetype")
}

@font-face {
    : roboto-light-webfont;
    font-weight: 700;
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: local("roboto-light-webfont Regular"), local("century-gothic"), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format("woff"), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format("truetype")
}

@font-face {
    : roboto-medium-webfont;
    font-weight: 700;
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: local("roboto-medium-webfont Regular"), local("century-gothic"), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format("woff"), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format("truetype")
}

@font-face {
    : 'Roboto Bold Condensed';
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot");
    src: url("../font/COPYFONTS.COM_NETTO-OT.eot#iefix") format('embedded-opentype'), url("../font/COPYFONTS.COM_NETTO-OT.woff2") format('woff2'), url("../font/COPYFONTS.COM_NETTO-OT1.woff") format('woff'), url("../font/COPYFONTS.COM_NETTO-OT.ttf") format('truetype'), url("../font/COPYFONTS.COM_NETTO-OT.svg#roboto_condensedbold") format('svg');
    font-weight: 400;
    font-style: normal
}

.header {
    padding: 23px 0 21px;
    border-top: 5px solid #0078ae;
    position: relative;
    background: #000;
    box-shadow: 0 3px 3px rgba(132, 136, 138, .1)
}

.header .frame {
    position: relative
}


    
    
    
    



    
    
    
    
    
    



    


.head-r-side {
    float: right
}

.head-top {
    float: right;
    text-align: right
}

.ht-nav {
    float: right;
    font: 0/0 Arial
}

.additional-nav {
    display: inline-block;
    vertical-align: middle
}

.ht-nav li {
    display: inline-block;
    padding: 0 2px 0 5px
}

.ht-nav li a {
    color: #878a8c
}

.ht-nav li:first-child {
    border: none
}

.head-mid {
    clear: both;
    padding: 0 0 14px;
    float: right
}

.head-bot {
    clear: both
}

.ht-simplemenu li:first-child em.arrow {
    background: 0 0
}

.ht-simplemenu em.arrow {
    width: 4px;
    height: 21px;
    float: left;
    margin: 9px 8px 0 0;
    background: url("../image/tzz_ion-1.png") -44px 0 no-repeat
}

.ht-simplemenu .phone em {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 21px;
    height: 21px;
    margin: 0 5px 0 0;
    display: inline-block;
    font-size: 0;
    line-height: 0;
    vertical-align: top
}

.ht-simplemenu .phone {
    font: 700 16px/20px roboto-bold-webfont, arial, sans-serif;
    color: #5a6063;
    display: inline-block;
    vertical-align: middle;
    margin: -5px 0 0 9px;
    padding: 2px 0 3px 15px;
    border-left: 1px solid #dadada
}

.ht-simplemenu .phone:hover {
    color: #5a6063
}

.search-line {
    display: inline-block;
    vertical-align: middle;
    padding: 0 0 0 9px;
    border-left: 1px solid #dadada;
    margin: -5px 0 0 12px
}

.ht-simplemenu .search {
    background: url("../image/tzz_ion-1.png") -23px 0 no-repeat;
    width: 21px;
    height: 21px;
    margin: 2px 5px 0;
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    line-height: 0;
    color: transparent;
    overflow: hidden;
    text-align: left
}

.ht-simplemenu .search:hover {
    background: url("../image/tzz_ion-1.png") -300px 0 no-repeat
}

.separate-border {
    background: url("../image/tzz_ion-1.png") -50px 0 no-repeat;
    width: 1px;
    height: 25px;
    margin: 0 0 0 10px;
    padding: 0 0 0 10px;
    display: inline-block;
    vertical-align: bottom
}

.additional-nav li a, .additional-nav li span {
    float: left;
    font: 13px/25px Arial
}

.btn-raq {
    border-left: 1px solid #DADADA;
    color: #90c404 !important;
    padding-right: 2px !important;
    : roboto-black-webfont, Arial, sans-serif !important
}

.btn-raq:after {
    content: "Â»";
    font: 26px/14px roboto-black-webfont, Arial, sans-serif;
    padding-left: 6px;
    vertical-align: -2px;
    position: relative;
    left: 0;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.btn-raq:hover:after {
    left: 2px
}

.menu-frame {
    background: url("../image/tzz_ion-1.png") -62px 0 no-repeat;
    width: 34px;
    height: 29px;
    float: left;
    font-size: 0;
    line-height: 0;
    margin: 10px 21px 0 26px;
    cursor: pointer
}

.separate-border.top-indent {
    margin: 10px 0 0
}

.hm-advancedmenu {
    float: right;
    padding: 30px 0 0
}

.header .hm-advancedmenu .active a, .header .hm-advancedmenu a:hover {
    color: #0078ae !important
}

.header .nav {
    clear: both;
    text-align: left;
    font: 14px/35px Roboto-m, Arial, sans-serif;
    float: right
}

.header .nav > li {
    float: left;
    position: relative
}

.header .nav > li > a {
    display: block;
    font: 14px/25px roboto-medium-webfont, Arial, sans-serif;
    padding: 0 13px;
    text-transform: uppercase
}

.header .nav > li.no-link > a {
    cursor: default
}

.header .nav > li > a:not(.link-arrow) {
    color: #ffffff;
}

.header .nav > li > a.link-arrow:hover:after {
    border-color: #0078ae
}

.header .nav > li.active a {
    color: #389fd8 !important;
    position: relative
}

.header .nav > li.active:not(.not-tr):before {
    background: url("../image/tzz_ion-1.png") -250px 0 no-repeat;
    position: absolute;
    bottom: -11px;
    left: 50%;
    width: 13px;
    margin-left: -6px;
    height: 7px;
    content: ''
}

.h-animated .nav > li.active:before {
    display: none
}

.header .nav > li:first-child {
    border-left: medium none
}

.header .nav li:nth-child(1) {
    max-width: 99px
}

.header .nav li:nth-child(2) {
    max-width: 91px
}

.header .nav li:nth-child(3) {
    max-width: 82px
}

.header .nav li:nth-child(4) {
    max-width: 94px
}

.header .nav li:nth-child(5) {
    max-width: 87px
}

.link-more {
    font: 14px/25px roboto-black-webfont, Arial, sans-serif;
    color: #90c404 !important;
    text-transform: uppercase;
    padding-right: 0 !important;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.link-more:hover {
    color: #036 !important
}

.link-more:after {
    font: 24px/14px roboto-black-webfont, Arial, sans-serif;
    padding-left: 5px;
    vertical-align: -2px;
    content: "\bb"
}

.header .nav li .btn-h-request {
    height: 30px;
    border-radius: 15px;
    padding: 0 14px;
    margin: -3px 0 0;
    font: 13px/30px roboto-bold-webfont, sans-serif;
    color: #fff;
    text-transform: uppercase;
    text-shadow: 0 -1px 0 #739b5f;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwOWNkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwODljMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDc5YjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(0, 156, 219, 1) 0, rgba(0, 137, 195, 1) 50%, rgba(0, 121, 176, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 156, 219, 1)), color-stop(50%, rgba(0, 137, 195, 1)), color-stop(100%, rgba(0, 121, 176, 1)));
    background: -webkit-linear-gradient(top, rgba(0, 156, 219, 1) 0, rgba(0, 137, 195, 1) 50%, rgba(0, 121, 176, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 156, 219, 1) 0, rgba(0, 137, 195, 1) 50%, rgba(0, 121, 176, 1) 100%)
}

.header .nav li .btn-h-request:hover {
    color: #fff !important;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNzliMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwODljMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDljZGIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #00b6fe, #00a9ed, #009edd);
    background: -webkit-linear-gradient(top, #00b6fe, #00a9ed, #009edd);
    background: linear-gradient(to bottom, #00b6fe, #00a9ed, #009edd)
}

.header .nav li ul {
    display: none;
    position: absolute;
    background: #f5f4f4;
    border: 1px solid #ccc;
    white-space: nowrap;
    z-index: 10
}

.header .nav li:hover > ul {
    display: block
}

.header .nav li ul a {
    display: block;
    padding: 10px
}

.mobnav-sublevel {
    margin: 10px 0 25px;
    font-size: 16px;
    background: rgba(255, 255, 255, .1);
    display: none
}

.sub .drop-open .mobnav-sublevel {
    display: block
}

.mobnav-sublevel a {
    color: #fff;
    display: block;
    padding: 7px 15px;
    border-top: 1px solid #0ae;
    transition: all .1s linear
}

.mobnav-sublevel li:last-child a {
    border-bottom: 1px solid #0ae
}

.mobnav-sublevel li:hover a {
    border-color: #fff;
    background: rgba(255, 255, 255, .08)
}

.mobnav-sublevel li:hover + li a {
    border-top-color: #fff
}

.nav li ul li {
    border-top: 1px solid #ccc
}

.nav li ul li:first-child {
    border-top: none
}

.header .active a, .header a:hover {
    color: #009ddc !important
}

.nav .p-box {
    width: 0;
    overflow: hidden;
    visibility: hidden;
    white-space: nowrap;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.header .open-m-menu, .mm-opening .header .open-m-menu {
    visibility: hidden
}

.menu-title .open-m-menu {
    float: right;
    margin: 9px 0 0
}

.open-m-menu {
    float: left;
    margin: -3px 17px 0 0;
    position: relative;
    overflow: hidden;
    width: 54px;
    height: 36px;
    cursor: pointer;
    border-right: 1px solid #dadada
}

.open-m-menu span {
    display: block;
    position: absolute;
    top: 15px;
    left: 12px;
    right: 12px;
    height: 5px;
    border-radius: 3px;
    background: #0078ae;
    transition: transform .3s
}

.open-m-menu span:after, .open-m-menu span:before {
    position: absolute;
    display: block;
    left: 0;
    width: 100%;
    height: 5px;
    background-color: #0078ae;
    border-radius: 3px;
    content: ""
}

.open-m-menu span:before {
    top: -9px;
    -webkit-transform-origin: top right;
    transform-origin: top right;
    transition: transform .3s, width .3s, top .3s
}

.open-m-menu span:after {
    bottom: -9px;
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    transition: transform .3s, width .3s, bottom .3s
}

.open-m-menu:focus {
    outline: 0
}

.menu-title {
    border-top: 5px solid #0078ae;
    width: 205px;
    height: 62px;
    background: #fff;
    font: 17px/59px roboto-medium-webfont, sans-serif;
    color: #0078ae;
    text-transform: uppercase;
    padding: 0 0 0 26px
}

.search-field {
    float: left;
    width: 0;
    overflow: hidden;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear
}

.search-field input[type=text] {
    width: 110px;
    padding: 5px 5px 4px;
    font: 12px/15px Arial, Helvetica, sans-serif;
    color: #5a6063;
    border: 1px solid #ccc;
    margin: 0 4px 0 0;
    border-radius: 0
}

.search-active .search-field {
    width: 110px
}

.head-top {
    max-width: 615px;
    padding-top: 10px
}

.foot-area .tag {
    font: 400 12px/11px Arial, sans-serif;
    color: #9a9a9a;
    text-transform: uppercase;
    margin: 0 0 8px;
    padding: 0 0 0 8px;
    border-left: solid 2px #0087bd
}

.foot-area .btn-raq {
    font-size: 17px;
    border-left: 0;
    transition: color .3s ease-out
}

.foot-area .btn-raq:after {
    font-size: 28px
}

.foot-area .btn-raq:hover, .foot-area .btn-raq:hover:after {
    color: #0078ae !important
}

.foot-area .ttl {
    display: block;
    color: #0477ae;
    margin-bottom: 20px;
    font: 36px/1.3 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    letter-spacing: -1px
}

.subscribe-form {
    background: #f4f4f4;
    border-radius: 4px;
    position: relative;
    max-width: 664px;
    margin: 0 auto
}

.subscribe-form input[type=text] {
    background: 0 0;
    border-radius: 4px;
    border: 0;
    padding: 0 174px 0 29px;
    color: #767676;
    font: italic 18px/53px roboto-regular-webfont, sans-serif;
    width: 100%;
    height: 53px
}

.subscribe-form input[type=text]::-webkit-input-placeholder {
    color: #777
}

.subscribe-form input[type=text]::-moz-placeholder {
    color: #777
}

.subscribe-form .btn-simple {
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 4px;
    white-space: nowrap;
    min-width: 158px;
    margin: 0;
    text-shadow: none;
    color: #fff !important;
    font-size: 17px;
    padding: 14px 40px 17px;
    cursor: pointer;
    height: 53px
}

.subscribe-form .btn-simple:after {
    border-color: #fff
}

.subscribe .message {
    font-weight: 700;
    padding: 10px 0;
    color: #D02525
}

.subscribe .thank-you-message {
    font-weight: 700;
    font-size: 20px;
    padding: 10px 0;
    color: #aad15a
}

.subscribe {
    max-width: 1500px;
    margin: 0 auto;
    position: relative;
    padding: 40px 20px 0;
    text-align: center;
    min-height: 210px;
    overflow: hidden
}

.foot-area .f-post-mob {
    display: none
}

.f-post {
    position: relative;
    background: #f6f6f6;
    padding: 60px 0 20px;
    border-top: 3px solid #e8e8e8
}

.f-post .frame {
    max-width: 1586px
}

.f-post .t-holder {
    table-layout: fixed
}

.f-post .divider {
    display: table-cell;
    width: 2.5%
}

.f-post .t-cell {
    display: table-cell;
    width: 48.75%;
    vertical-align: top;
    text-align: center;
    padding-bottom: 23px
}

.f-post .info {
    margin-bottom: 20px
}

.f-post-item {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    background: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    padding: 23px;
    position: relative
}

.whitepaper-post:after {
    content: "";
    position: absolute;
    top: -4px;
    right: -5px;
    background: url("../image/tzz_ion-1.jpg") no-repeat;
    width: 299px;
    height: 87px
}

.foot-area {
    background: #000
}

.foot-area .f-post .tag {
    color: #009ddc
}

.f-post .txt {
    padding-left: 35px;
    position: relative;
    z-index: 2
}

.f-post .whitepaper-post .visual {
    text-align: center
}

.f-post .whitepaper-post .txt {
    padding: 0 35px 0 0
}

.f-post a {
    color: #0078ae
}

.f-post h6 {
    color: #0078ae;
    font: 28px/1.15 roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.whitepaper-post h6 {
    border-bottom: 1px solid #d8d9d9;
    padding-bottom: 20px;
    margin-bottom: 20px
}

.f-post .txt, .f-post .visual {
    display: inline-block;
    width: 49.7%;
    vertical-align: middle
}

.download-lnk {
    color: #90c404 !important;
    text-transform: uppercase;
    font: 17px/1.15 roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.download-lnk .icon {
    top: -5px;
    position: relative;
    display: inline-block;
    width: 6px;
    height: 9px;
    background: #90c404;
    margin-left: 9px;
    transition: all .2s linear
}

.download-lnk .icon:after, .download-lnk .icon:before {
    content: "";
    position: absolute;
    transition: border-color .2s linear
}

.download-lnk .icon:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 5px solid #90c404;
    bottom: -4px;
    left: 50%;
    margin-left: -6px
}

.download-lnk .icon:before {
    bottom: -8px;
    left: -4px;
    width: 12px;
    height: 2px;
    border: solid #90c404;
    border-width: 0 1px 2px
}

.download-lnk:hover {
    color: #0078ae !important
}

.download-lnk:hover .icon {
    background-color: #0078ae;
    top: -2px
}

.download-lnk:hover .icon:before {
    border-color: #0078ae
}

.download-lnk:hover .icon:after {
    border-top-color: #0078ae
}

.socials-box {
    position: relative
}

.socials-box:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 50%;
    background: #0f1217
}

.socials-box .frame {
    position: relative;
    z-index: 2;
    max-width: 1578px;
    background: #00a3de;
    border-radius: 5px;
    text-align: center;
    padding: 50px 20px;
    margin: 0 auto
}

.socials-box .ttl {
    color: #fff
}

.socials {
    display: table;
    width: 100%;
    table-layout: fixed;
    border: 1px solid #5cc2e9;
    max-width: 1444px;
    margin: 0 auto
}

.socials .item {
    background: rgba(37, 37, 37, .1);
    border-left: 1px solid #5cc2e9;
    display: table-cell;
    height: 73px;
    color: #fff;
    vertical-align: middle;
    text-align: center;
    font: 25px/1.2 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    transition: background .2s ease-out
}

.socials .item:first-child {
    border-left: none
}

.socials .icn {
    display: inline-block;
    vertical-align: top;
    margin-right: 15px;
    background-image: url("../image/tzz_ion-1.png")
}

.socials .soc-gp .icn {
    width: 27px;
    height: 29px;
    background-position: 0 2px
}

.socials .soc-in .icn {
    width: 28px;
    height: 25px;
    background-position: -29px 0
}

.socials .soc-fb .icn {
    width: 15px;
    height: 30px;
    background-position: -59px 0
}

.socials .soc-inst .icn {
    width: 27px;
    height: 28px;
    background-position: -76px 1px
}

.socials .soc-tw .icn {
    width: 31px;
    height: 27px;
    background-position: -105px 1px
}

.socials .soc-subscr .icn {
    width: 24px;
    height: 26px;
    background-position: -138px 2px
}

.socials .soc-gp:hover {
    background-color: #dd4b39
}

.socials .soc-in:hover {
    background-color: #007bb5
}

.socials .soc-fb:hover {
    background-color: #3b5998
}

.socials .soc-inst:hover {
    background-color: #e95950
}

.socials .soc-tw:hover {
    background-color: #55acee
}

.socials .soc-subscr:hover {
    background-color: #fbb345
}

.location-area {
    position: relative;
    width: 100%;
    background-color: #05679c;
    padding: 87px 20px 166px;
    margin-bottom: -121px;
    color: #fff;
    line-height: 1.4
}

.location-area .frame {
    max-width: 1578px;
    border-radius: 5px;
    padding: 25px;
    border: 1px solid rgba(86, 207, 255, .3);
    border-top: none;
    position: relative;
    z-index: 2
}

.location-ttl {
    display: block;
    position: relative;
    text-align: center;
    font: 36px roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin-top: -80px
}

.location-ttl svg {
    display: inline-block;
    width: 50px;
    height: 60px;
    fill: #fff;
    opacity: .2;
    position: relative;
    top: 17px;
    margin-right: 3px
}

.location-ttl span {
    display: inline-block
}

.location-ttl span:after, .location-ttl span:before {
    content: "";
    height: 26px;
    width: 41%;
    position: absolute;
    top: 76%;
    border: rgba(86, 207, 255, .3) solid;
    border-width: 1px 0 0
}

.location-ttl span:after {
    left: -25px;
    border-radius: 5px 0 0
}

.location-ttl span:before {
    right: -25px;
    border-radius: 0 5px 0 0
}

.location-subttl {
    display: block;
    font-size: 28px
}

.location-area .t-holder {
    border-top: 13px solid transparent
}

.location-cell {
    vertical-align: top;
    width: 25%;
    position: relative;
    transition: width .5s linear;
    overflow: hidden
}

.location-cell:not(:first-child):not(.loc-active):before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: rgba(86, 207, 255, .3)
}

.location-cell.loc-active {
    width: 50%
}

.location-cell.loc-active:before {
    background: 0 0
}

.loc-visual {
    transition: all .5s linear;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 390px;
    width: 0;
    overflow: hidden;
    text-align: right
}

.loc-visual img {
    max-width: 999px
}

.loc-txt {
    padding: 23px 35px 23px 0;
    float: right;
    width: 345px
}

.loc-ny .loc-txt {
    width: 355px
}

.loc-active .loc-visual {
    width: 363px
}

.loc-contact {
    display: inline-block
}

.loc-ny .loc-contact {
    margin-top: -4px
}

.loc-contact, .loc-contact .link-more {
    font: 17px roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.loc-contact .link-more:after {
    transition: padding-left .2s linear;
    font-size: 30px
}

.loc-contact .link-more, .loc-phone, .loc-phone > a {
    color: #fff !important
}

.loc-contact .link-more:hover:after {
    padding-left: 7px
}

.loc-phone:after {
    content: "";
    display: inline-block;
    height: 21px;
    width: 1px;
    background: rgba(255, 255, 255, .24);
    margin-right: 20px;
    position: relative;
    top: 5px;
    right: -11px
}

.loc-phone svg {
    display: inline-block;
    width: 23px;
    height: 23px;
    fill: #fff;
    position: relative;
    top: 6px
}

.loc-address {
    padding: 8px 0 13px;
    font-style: normal;
    display: block;
    font-size: 17px
}

.PT-awards {
    background: #fff;
    text-align: center;
    padding: 55px 0 40px;
    max-width: 1103px;
    margin: 0 auto
}

.foot-area .PT-awards {
    border-bottom: 3px solid #e8e8e8
}

.continue-section .PT-awards {
    background: 0 0
}

.PT-awards .ttl {
    text-align: center;
    font: 400 27px/36px roboto-light-webfont, sans-serif;
    color: #5a6063;
    margin: 0 0 40px;
    display: block
}

.PT-awards .ttl span {
    display: block;
    font: 400 50px/45px roboto-bold-webfont, sans-serif;
    color: #0078ae;
    padding-bottom: 9px
}

.PT-awards .ttl strong {
    : roboto-bold-webfont, sans-serif
}

.PT-awards .ttl em.mobile-wrap {
    font-style: normal
}

.PT-awards-list {
    display: table;
    width: 100%;
    padding: 0 0 27px
}

.PT-awards-list .item {
    display: table-cell;
    width: 33.3%;
    text-align: center;
    font: 400 15px roboto-regular-webfont, sans-serif;
    color: #5a6063
}

.PT-awards-list .item strong {
    : roboto-bold-webfont, sans-serif
}

.PT-awards-list img {
    display: block;
    margin: 20px auto 0
}

.PT-awards .txt {
    font: 38px 'Roboto Bold Condensed', sans-serif;
    color: #0078ae;
    padding: 0 0 20px
}

.PT-awards .txt span {
    font: italic normal 28px Georgia, serif;
    color: #5a6063
}

.PT-awards .btn-green {
    float: none;
    display: inline-block;
    font-size: 21px;
    padding: 12px 40px 14px;
    border-radius: 22px
}

.rd-holder {
    overflow: hidden;
    background: #f6f6f6;
    position: relative;
    padding: 50px 0
}

.rd-holder:before {
    content: "";
    position: absolute;
    top: -18px;
    left: 50%;
    margin-left: -800px;
    width: 1600px;
    height: 10px;
    border-radius: 50%;
    box-shadow: 0 0 2px 10px rgba(0, 0, 0, .05)
}

.rd-holder .ready-discuss {
    text-align: center
}

.f-menu-wrapper {
    color: #798185;
    font: 16px roboto-light-webfont, sans-serif
}

.f-menu-wrapper .t-cell {
    vertical-align: top;
    white-space: nowrap;
    display: none;
}

.f-menu-content {
    background: #101417;
    padding: 32px 0 36px
}

.f-menu-content .fmc-list li {
    display: inline-block;
    margin: 4px 22px 0 0
}

.f-menu-content .fmc-list a {
    color: #798185;
    font: 14px/14px roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    text-transform: uppercase;
    transition: color .2s linear
}

.f-menu-content .fmc-list .active a, .f-menu-content .fmc-list a:hover {
    color: #fff
}

.fmc-contact .loc-phone svg {
    fill: #798185
}

.fmc-contact .loc-phone, .fmc-contact .loc-phone > a {
    color: #798185 !important
}

.fmc-contact .loc-phone:hover svg {
    fill: #fff
}

.fmc-contact .loc-phone:hover > a {
    color: #fff !important
}

.fmc-contact .loc-phone:after {
    display: none
}

.fmc-contact {
    text-align: right
}

.fmc-contact li {
    display: inline-block
}

.fmc-contact {
    width: 40%
}

.fmc-list {
    width: 60%
}

.fmc-contact li:not(:first-child):before {
    content: "";
    display: inline-block;
    height: 12px;
    width: 1px;
    background: #646b6e;
    margin: 0 15px 0 10px;
    position: relative;
    top: 1px
}

.fmc-copyright {
    color: #798185;
    background: #161b20;
    font: 14px/14px roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    text-align: center;
    padding: 20px 0 60px
}

.fmc-copyright a {
    color: #798185;
    position: relative;
    display: inline-block
}

.fmc-copyright a:after {
    content: "";
    height: 1px;
    margin: 2px auto 0;
    width: 100%;
    display: block;
    background-color: #798185;
    transition: width .3s linear
}

.fmc-copyright a:hover {
    color: #fff
}

.fmc-copyright a:hover:after {
    width: 0;
    background: #fff
}

.phone_request {
    width: 336px
}

.phone_request .request a {
    width: 184px;
    background: url("https://www.prismaxel.com/css/%25%25IMAGES_URL%25%25/sprite/sprite-nav-v2.png") 0 -59px no-repeat
}

.phone_request .request a:hover {
    background-position: -210px -11px !important
}

.btn_request span, .btn_request span:hover, .btn_request:hover span {
    background: url("https://www.prismaxel.com/css/%25%25IMAGES_URL%25%25/btn/btn_request.png") no-repeat !important
}

#bottom_request_btn {
    background: url("https://www.prismaxel.com/css/%25%25IMAGES_URL%25%25/sprite/sprite-nav-v2.png") 0 -11px no-repeat;
    width: 184px
}

.foot-anim {
    opacity: 0
}

.foot-area.animated + .foot-anim {
    opacity: 1
}

.next-step {
    width: 115px;
    height: 115px;
    position: absolute;
    top: -55px;
    left: 50%;
    margin-left: -58px;
    border-radius: 50%;
    padding-top: 45px;
    display: block;
    padding-left: 22px;
    text-align: left;
    -webkit-transition: box-shadow .4s ease-out;
    -moz-transition: box-shadow .4s ease-out;
    transition: box-shadow .4s ease-out
}

.next-step:before {
    position: absolute;
    top: 42px;
    left: 22px;
    width: 56px;
    height: 24px;
    content: "";
    z-index: 10;
    background: url("../image/tzz_ion-1.png") -26px -174px no-repeat;
    -webkit-transition: top .4s ease-out;
    -moz-transition: top .4s ease-out;
    transition: top .4s ease-out
}

.next-step:hover:before {
    background-position: -26px -200px;
    top: 48px
}

.next-step:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 99px;
    height: 99px;
    content: "";
    border-radius: 50%;
    z-index: 1;
    background: #000
}

.next-step:hover:after {
    background: #009ddc !important
}

.home-wide-button {
    border-radius: 3px;
    display: block;
    font: 16px/16px roboto-bold-webfont, Arial, sans-serif;
    padding: 14px 0;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    -webkit-transition: all .3s ease-out, all .3s ease-out;
    -moz-transition: all .3s ease-out, all .3s ease-out;
    transition: all .3s ease-out, all .3s ease-out
}

.home-wide-button:after {
    font: 26px/14px roboto-black-webfont, Arial, sans-serif;
    padding-left: 8px;
    vertical-align: -1px;
    content: "\bb"
}

.home-slider-wrapper .home-slider-content {
    position: relative;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.home-slider-content .hs-left {
    width: 52%;
    padding-top: 41px;
    padding-bottom: 10px;
    background: url("../image/tzz_ion-1.png") 0 100% no-repeat
}

.home-slider-content .hs-right {
    width: 50%;
    padding-top: 40px;
    position: absolute;
    right: 0;
    top: 0
}

.hs-left .hsl-header, .hs-left .hsl-header h1 {
    font: 28px/32px roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    color: #0078AE
}

.hs-left .hsl-header h2 {
    : inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit
}

.hs-left .hsl-header h1, .hs-left .hsl-header h2 {
    display: inline
}

.hs-left .hsl-header strong {
    font: 57px/63px roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.hs-left .hsl-header .sep-line {
    display: block;
    height: 0
}

.hs-left .hsl-subcaption {
    font: 20px/28px roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    padding: 20px 36px 0 0;
    color: #5a6063
}

.hs-left .hsl-subcaption strong {
    font: 20px/28px roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.hs-left .see-our-work-btn, .hs-sub-row .see-our-work-btn {
    display: inline-block;
    font: 18px/18px roboto-black-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    padding: 9px 40px;
    text-shadow: 0 -1px 0 #447523;
    box-shadow: 0 -1px 0 #c9e973, 0 1px 0 #5e8900;
    border-radius: 18px;
    background: 0 0/100% 100% #95c906;
    background: -moz-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a2d90c), color-stop(100%, #89bb00)) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -ms-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    transition: all .4s linear;
    position: relative;
    z-index: 3
}

.hs-left .see-our-work-btn:hover, .hs-sub-row .see-our-work-btn:hover {
    background-position: 0 -200%;
    background-size: 100% 200%
}

.hs-left .see-our-work-btn {
    margin: 30px 0 40px
}

.hs-left .simple-sep {
    height: 0;
    border: 1px solid #3d95b8;
    border-width: 0 0 1px;
    margin: 20px 26px 30px 0
}

.hs-left .shadow-sep {
    height: 10px;
    background: url("../image/tzz_ion-1.png") center top no-repeat;
    border-style: none;
    width: 100%;
    margin: 0 auto 30px
}

.hs-sub-item {
    display: inline-block;
    vertical-align: middle;
    margin: 0 57px 0 0
}

.home-nutshell-wrapper {
    background: url("../image/tzz_ion-1.png");
    padding-top: 40px;
    border-bottom: 1px solid #0d1013
}

.home-nutshell-content div.h3 {
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    color: #fff;
    text-align: center
}

.before-and-after-wrapper .section-title h2, .before-and-after-wrapper h3, .before-and-after-wrapper h6, .case-studies-content h3, .case-studies-content h6 {
    font: 57px/1 roboto-light-webfont, Arial, sans-serif;
    color: #0078ae;
    text-align: center
}

.before-and-after-wrapper h2 span, .before-and-after-wrapper h3 span, .before-and-after-wrapper h6 span, .case-studies-content h3 span, .case-studies-content h6 span, .home-nutshell-content .h3 span, .home-nutshell-content h3 span, .home-nutshell-content h6 span {
    : roboto-black-webfont, Arial, sans-serif
}

.before-and-after-wrapper .section-title p, .case-studies-content .section-title p, .home-nutshell-content .section-title p, .our-clients-content .section-title p {
    color: #5A6063;
    font-size: 17px;
    line-height: 26px;
    margin: 10px 0
}

.before-and-after-wrapper .section-title p, .case-studies-content .section-title p, .our-clients-content .section-title p {
    text-shadow: none
}

.hnc-simple-list {
    margin-top: 18px;
    text-align: center
}

.hnc-simple-list li {
    display: inline-block;
    color: #5a6063;
    font-size: 17px;
    padding: 5px 0;
    margin-right: 15px;
    vertical-align: top
}

.hnc-simple-list li br {
    display: none
}

.hnc-simple-list li strong {
    color: #0078ae
}

.hnc-simple-list .arrow-item {
    background: url("../image/tzz_ion-1.png") 0 4px no-repeat;
    padding-left: 35px
}

.hnc-subcaption {
    color: #758288;
    text-align: center;
    font-size: 17px;
    margin-top: 20px
}

.hnc-subcaption-fs {
    font-size: 24px
}

.hnc-subcaption-short {
    letter-spacing: 10px
}

.hnc-features-list {
    margin: 55px 0 80px
}

.hnc-features-list.alt {
    text-align: center
}

.hnc-features-list > li {
    width: 25%;
    float: left;
    text-align: center;
    overflow: hidden
}

.hnc-features-list.alt > li {
    width: auto;
    max-width: 220px;
    float: none;
    display: inline-block;
    vertical-align: top;
    margin: 0 2% 10px
}

.hnc-features-list .sc-bubble {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 218px;
    min-height: 90px;
    margin: 25px auto 0;
    font-size: 18px;
    padding-top: 35px
}

.hnc-features-list .sc-bubble .h3, .hnc-features-list .sc-bubble h2 {
    font-size: 18px
}

.hnc-features-list .sc-img {
    text-align: center
}

.hnc-features-list .sc-img a {
    width: 200px;
    height: 200px;
    display: inline-block;
    position: relative;
    text-align: center
}

.hnc-features-list .sc-link-1 {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.hnc-features-list .sc-link-2 {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.hnc-features-list .sc-link-3 {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.hnc-features-list .sc-link-4 {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.hnc-features-list .sc-link-5 {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.hnc-features-list .sc-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 180px;
    margin: 10px;
    display: block;
    max-width: none !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out
}

.hnc-features-list .sc-img-2 {
    opacity: 0
}

.hnc-features-list .sc-img a.active .sc-img-2, .hnc-features-list .sc-img a:hover .sc-img-2 {
    -webkit-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
    opacity: 1
}

.ie .hnc-features-list .sc-img a.active .sc-img-2, .ie .hnc-features-list .sc-img a:hover .sc-img-2 {
    opacity: 0
}

.hnc-features-list .sc-img a.active .sc-img-1, .hnc-features-list .sc-img a:hover .sc-img-1 {
    -webkit-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
    opacity: 0
}

.ie .hnc-features-list .sc-img a.active .sc-img-1, .ie .hnc-features-list .sc-img a:hover .sc-img-1 {
    opacity: 1
}

.desktop-mode .hnc-features-list .sc-bubble:hover, .desktop-mode .hnc-features-list > li:hover .sc-bubble, .hnc-features-list .activated {
    background-position: 0 -169px
}

.desktop-mode .sc-bubble ul {
    opacity: 0;
    visibility: hidden;
    display: block
}

.sc-bubble ul {
    display: none;
    position: absolute;
    border-radius: 0 0 3px 3px;
    width: 218px;
    padding: 20px 0 15px;
    background: #1a2023;
    margin-top: -20px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    z-index: 11
}

.sc-bubble li:last-child a {
    border-style: none
}

.sc-bubble ul h3 a {
    font-size: 12px;
    color: #777e84;
    border-bottom: 1px solid #252a30;
    display: block;
    padding: 10px 0;
    : Arial, Helvetica, sans-serif;
    line-height: 1.3
}

.sc-bubble ul h3 a:hover {
    background: #000
}

.desktop-mode .sc-bubble ul.active, .desktop-mode .sc-bubble:hover ul {
    opacity: 1;
    visibility: visible;
    margin: 0
}

.sc-bubble .h3 > a, .sc-bubble h2 > a, .sc-bubble > span {
    position: relative;
    z-index: 2;
    display: table-cell;
    vertical-align: middle;
    height: 43px;
    width: 218px
}

.strategy-consulting .sc-bubble .h3 > a, .strategy-consulting .sc-bubble h2 > a, .strategy-consulting .sc-bubble ul h3 a:hover, .strategy-consulting .sc-bubble > span {
    color: #71980d
}

.creative-design .sc-bubble .h3 > a, .creative-design .sc-bubble h2 > a, .creative-design .sc-bubble ul h3 a:hover {
    color: #d57e0e
}

.web-mobile-development .sc-bubble .h3 > a, .web-mobile-development .sc-bubble h2 > a, .web-mobile-development .sc-bubble ul h3 a:hover {
    color: #9b3bb5
}

.web-online-marketing .sc-bubble .h3 > a, .web-online-marketing .sc-bubble h2 > a, .web-online-marketing .sc-bubble ul h3 a:hover {
    color: #0c95cd
}

.mobile-apps .sc-bubble .h3 > a, .mobile-apps .sc-bubble h2 > a, .mobile-apps .sc-bubble ul h3 a:hover {
    color: #98130d
}

.full-services-lnk-wrapper {
    border-top: 1px solid #22292f;
    background: url("../image/tzz_ion-1.png");
    padding-bottom: 90px
}

.full-services-lnk-wrapper .see-all-large {
    margin-top: -23px
}

.full-services-lnk-content .fslc-lnk {
    margin-top: -23px;
    background: #1e2227;
    color: #758288;
    border: 1px solid #2d353c;
    box-shadow: inset 0 -1px 0 #000;
    text-shadow: 0 -1px 0 #000
}

.full-services-lnk-content .fslc-lnk:hover {
    color: #389FD8;
    background: #23272c
}

.our-latest-projects-wrapper {
    background: url("../image/tzz_ion-1.png");
    border-top: 1px solid #0079aa;
    position: relative;
    text-align: center;
    padding: 90px 0
}

.our-latest-projects-wrapper .next-step {
    border: 8px solid #12171c;
    box-shadow: 0 1px 0 #0079AA
}

.our-latest-projects-wrapper .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.our-latest-projects-wrapper .next-step:hover:after {
    background: #009ddc
}

.our-latest-projects-wrapper .next-step:hover:before {
    background-position: -26px -200px
}

.our-latest-projects-content h3 {
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    color: #fff;
    text-align: center;
    text-shadow: 0 -1px 0 #000
}

.our-latest-projects-content h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.our-latest-projects-content .olpc-subcaption {
    font-size: 17px;
    color: #74c9ef;
    margin-top: 10px;
    text-shadow: 0 -1px 0 #000
}

.olpc-board {
    margin-top: 40px
}

.olpc-board img {
    font-size: 0;
    line-height: 0
}

.olpc-board .olp-item {
    position: relative;
    padding-bottom: 5px
}

.olpcb-left-column, .olpcb-right-column {
    width: 50%;
    float: left
}

.olpcb-left-column {
    padding-right: 3px
}

.olpcb-right-column {
    padding-left: 2px
}

.olpcb-two-items {
    width: 100%
}

.olpcb-two-items .olp-item {
    width: 50%
}

.olpcb-two-items .olp-item:first-child {
    float: left;
    padding-right: 2px
}

.olpcb-two-items .olp-item:last-child {
    float: right;
    padding-left: 2px
}

.olp-item .hs-sticky-label, .olp-item .item-lnk {
    display: inline-block;
    background: #009ddc;
    border-radius: 0 3px 3px 0;
    font-size: 14px;
    line-height: 14px;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    top: 16px;
    padding: 10px;
    text-shadow: 0 -1px 0 #000;
    max-width: 90%
}

.olpcb-two-items .olp-item:last-child .hs-sticky-label, .olpcb-two-items .olp-item:last-child .item-lnk {
    left: 2px
}

.olp-item:hover {
    cursor: pointer
}

.olp-item:hover .item-lnk {
    padding-left: 25px;
    -webkit-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s
}

.our-latest-projects-content .our-latest-projects-lnk {
    background: #0078ae;
    border: 1px solid #008ece;
    box-shadow: inset 0 -1px 0 #004463;
    color: #fff;
    margin-top: 25px;
    text-shadow: 0 -1px 0 #004c6e
}

.our-latest-projects-content .our-latest-projects-lnk:hover {
    color: #FFC45C;
    background: #007eb6
}

.olp-ecommerce .olpi-hover-stare {
    display: none;
    position: absolute;
    width: 100%;
    height: 99%;
    background: rgba(19, 24, 29, .9);
    left: 0;
    top: 0;
    padding: 25% 40px 0;
    -webkit-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s
}

.desktop-mode .olp-ecommerce .olpi-hover-stare {
    visibility: hidden;
    opacity: 0;
    display: block
}

.olpi-hover-stare .hs-content {
    border-top: 1px solid #454549;
    margin-top: 30px;
    font-size: 17px;
    line-height: 25px;
    color: #fff;
    text-align: center;
    padding-top: 30px
}

.olpi-hover-stare .hs-lnk {
    margin-top: 50px;
    display: inline-block;
    color: #90c404;
    font: 16px/16px roboto-black-webfont, Arial, sans-serif;
    text-transform: uppercase
}

.olpi-hover-stare .hs-lnk .raquo {
    font-size: 28px;
    vertical-align: -2px
}

.desktop-mode .olpi-hover-stare .hs-lnk:hover {
    color: #FFC45C
}

.desktop-mode .olp-ecommerce:hover .olpi-hover-stare {
    opacity: 1;
    visibility: visible
}

.serve-all-industries-wrapper {
    background: url("../image/tzz_ion-1.png");
    padding: 90px 0;
    border-bottom: 1px solid #dce2e3;
    position: relative
}

.serve-all-industries-wrapper .next-step {
    border: 8px solid #005f8b;
    box-shadow: 0 1px 0 #fff
}

.serve-all-industries-wrapper .next-step:after {
    background: url("../image/tzz_ion-1.png") !important
}

.serve-all-industries-wrapper .next-step:hover:after {
    background: #009DDC !important
}

.serve-all-industries-content h3 {
    color: #0078ae;
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    text-align: center
}

.serve-all-industries-content h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.serve-all-industries-content .saic-main-list {
    background: #009ddc;
    width: 660px;
    margin: 15px auto 0;
    text-align: center;
    padding: 5px 0
}

.serve-all-industries-content .saic-main-list li {
    display: inline;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700
}

.serve-all-industries-content .saic-main-list li a {
    color: #fff
}

.serve-all-industries-content .saic-main-list .sep {
    margin: 0 10px;
    font-size: 20px;
    color: #66c4ea
}

.serve-all-industries-content .saic-main-list a:hover {
    color: #FFC45C
}

.serve-all-industries-content .saic-subcaption {
    padding-top: 30px;
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    color: #5a6063
}

.our-work-section-grey {
    padding-bottom: 100px
}

.our-work-section-grey .section-title h2 {
    color: #0078ae;
    font: 50px/50px roboto-light-webfont, Arial, sans-serif;
    text-align: center
}

.our-work-section-grey .section-title p {
    color: #5a6063;
    text-shadow: none
}

.saic-columns {
    margin-top: 30px
}

.saic-columns .saic-column-list {
    float: left;
    width: 31%;
    margin-right: 3.5%;
    overflow: hidden
}

.saic-column-list:last-child {
    float: right;
    margin-right: 0
}

.saic-column-list ul {
    border-top: 4px solid #0079aa;
    padding-top: 10px
}

.saic-column-list li {
    border-bottom: 1px solid #dde1e3;
    white-space: nowrap
}

.saic-column-list a {
    padding: 13px 0 13px 18px;
    color: #5a6063;
    font-size: 15px;
    position: relative;
    display: block;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.saic-column-list a:hover {
    background: #009ddc;
    color: #fff
}

.saic-column-list a:before {
    content: "";
    background: url("../image/tzz_ion-1.png") 0 -256px no-repeat;
    width: 9px;
    height: 9px;
    color: #11a4de;
    position: absolute;
    left: 6px;
    top: 17px
}

.saic-column-list a:hover:before {
    background-position: 0 -421px
}

.home-resources-img-wrapper {
    background: url("../image/tzz_ion-1.png");
    border-top: 1px solid #fff;
    padding-bottom: 120px;
    position: relative
}

.home-resources-img-content .hric-img {
    margin-top: 70px
}

.home-resources-img-content .hric-img .mobile-img, .home-resources-img-content .hric-img .tablet-img {
    display: none
}

.before-and-after-wide-section, .our-clients-wrapper {
    background: url("../image/tzz_ion-1.png");
    padding: 90px 0;
    position: relative;
    border-top: 1px solid #fff
}

.our-clients-wrapper .next-step {
    border: 8px solid #dfe4e5;
    box-shadow: 0 1px 0 #fff
}

.our-clients-wrapper .next-step-alt-v1 {
    border: 8px solid #f8f8f8
}

.before-and-after-wide-section .next-step {
    border: 8px solid #01608b;
    box-shadow: 0 1px 0 #fff
}

.before-and-after-wide-section .next-step:after, .our-clients-wrapper .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.our-clients-wide-section {
    background: #eaedee
}

.our-clients-wide-section .testimonials-items {
    margin-bottom: 60px
}

.our-clients-wide-section .next-step {
    border: 8px solid #f7f7f7;
    box-shadow: 0 1px 0 #fff
}

.our-clients-wide-section .next-step-l-grey {
    border: 8px solid #eef2f3
}

.our-clients-wrapper .next-step:after {
    background: #eaedee
}

.our-clients-content h2, .our-clients-content h3 {
    color: #0078ae;
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    text-align: center;
    text-shadow: 0 1px 0 #fff
}

.our-clients-content h2 span, .our-clients-content h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.our-clients-content .occ-subcaption {
    font-size: 17px;
    color: #5a6063;
    text-align: center;
    margin-top: 20px;
    text-shadow: 0 1px 0 #fff
}

.our-clients-content .occ-columns {
    margin-top: 50px
}

.occ-columns .occc-column {
    width: 33%;
    float: left;
    text-align: center;
    overflow: hidden;
    position: relative;
    padding-bottom: 20px
}

.our-clients-wide-section .occ-columns {
    text-align: center
}

.our-clients-wide-section .occ-columns .occc-column {
    margin: 0 7%;
    display: inline-block;
    float: none
}

.occc-thumb-link {
    display: block;
    position: relative;
    text-align: center
}

.occc-thumb-link:after {
    width: 80px;
    height: 80px;
    display: block;
    position: absolute;
    z-index: 10;
    left: 6px;
    top: 7px;
    content: "";
    border-radius: 50%;
    background: url("../image/tzz_ion-1.png") -437px -181px no-repeat #009ddc;
    box-shadow: inset 0 0 0 2px #0079b0;
    border: 4px solid #fff;
    -webkit-transition: background-color .4s linear;
    -moz-transition: background-color .4s linear;
    transition: background-color .4s linear
}

.occc-thumb-link:hover:after {
    background-position: -517px -181px;
    background-color: #fff;
    box-shadow: 0 3px 7px rgba(0, 0, 0, .5)
}

.occc-column .client-photo {
    position: relative;
    z-index: 1;
    padding: 4px 0 0;
    margin: 0 0 -68px
}

.occc-thumb-link .client-photo img {
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    border-radius: 50%;
    border: 8px solid transparent
}

.occc-thumb-link:hover .client-photo img {
    border: 8px solid #fff;
    box-shadow: 0 -2px 4px rgba(0, 0, 0, .1)
}

.occc-column .client-name {
    position: relative;
    z-index: 2;
    padding: 0 4px
}

.occc-column .client-name .c {
    min-height: 83px;
    width: 100%;
    max-width: 293px;
    margin: 0 auto;
    padding: 8px 10px;
    border: 1px solid rgba(223, 227, 228, .7);
    border-radius: 3px;
    background: #fff;
    position: relative
}

.occc-column .client-name .c:after {
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 100%;
    height: 8px;
    content: "";
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat
}

.occc-thumb-link .text-lnk {
    font-size: 18px;
    color: #0078ae
}

.occc-thumb-link:hover .text-lnk {
    color: #90C404
}

.occc-column .client-name .cn-title {
    font-size: 13px;
    margin-top: 3px;
    color: #3e3e3e
}

.occc-column:last-child {
    float: right
}

.occc-column .client-logo {
    margin: 30px 0 60px
}

.our-clients-content .occ-lnk {
    background: #e1e6e8;
    border: 1px solid #d2d2d2;
    color: #009ddc;
    text-shadow: 0 1px 0 #fff;
    box-shadow: inset 0 -1px 0 #d9dfe1
}

.our-clients-content .occ-lnk:hover {
    color: #009ddc;
    box-shadow: 0 0 4px #d9dfe1;
    background: #fff
}

.our-clients-wide-section .home-wide-button {
    line-height: 22px
}

.succeeding-online {
    padding: 90px 0;
    position: relative
}

.succeeding-online .next-step {
    border: 8px solid #eef2f3;
    box-shadow: 0 1px 0 #fff
}

.succeeding-online .next-step:after {
    background: #fff
}

.succeeding-online > h2, .succeeding-online > h3 {
    color: #0078ae;
    font: 45px/45px roboto-light-webfont, Arial, sans-serif;
    text-align: center;
    text-shadow: 0 1px 0 #bbdbe9
}

.succeeding-online h3 span, .succeeding-online > h2 span {
    : roboto-black-webfont, Arial, sans-serif
}

.so-columns .soc-column {
    width: 31%;
    float: left;
    padding-top: 100px
}

.soc-column:first-child {
    margin-right: 3.5%
}

.soc-column:last-child {
    float: right
}

.soc-column h2, .soc-column h3, .soc-column h5 {
    position: relative;
    background: url("../image/tzz_ion-1.png");
    border-bottom: 1px solid #fff;
    border-radius: 5px;
    box-shadow: 0 1px 0 #888;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    padding: 60px 0 25px
}

.soc-column h2 .step-number, .soc-column h3 .step-number, .soc-column h5 .step-number {
    : Arial, Helvetica, Sans-Serif;
    position: absolute;
    border: 3px solid #fff;
    left: 50%;
    top: -45px;
    background: #88ba00;
    width: 90px;
    height: 90px;
    margin-left: -45px;
    border-radius: 50%;
    font-size: 57px;
    color: #fff;
    font-weight: 700;
    padding-top: 10px
}

.soc-column h2:after, .soc-column h3:after, .soc-column h5:after {
    background: url("../image/tzz_ion-1.png") 0 -387px no-repeat;
    bottom: -14px;
    content: "";
    height: 14px;
    left: 50%;
    margin-left: -15px;
    position: absolute;
    width: 31px
}

.soc-column h2 .step-arrow, .soc-column h3 .step-arrow, .soc-column h5 .step-arrow {
    width: 95px;
    height: 22px;
    background: url("../image/tzz_ion-1.png") 0 -315px no-repeat;
    position: absolute;
    right: -60px;
    top: -45px
}

.soc-column .socc-text {
    padding-top: 40px
}

.soc-column .socc-text p, .soc-column .socc-text ul {
    color: #5a6063;
    font-size: 15px;
    padding-bottom: 15px;
    text-align: justify;
    line-height: 24px;
    word-spacing: -1px
}

.site-map a, .soc-column .socc-text a {
    color: #0078AE
}

.site-map a:hover, .soc-column .socc-text a:hover {
    color: #90C404
}

.our-blog-wrapper {
    padding: 90px 0;
    background: url("../image/tzz_ion-1.png");
    position: relative
}

.our-blog-wrapper-alt {
    background: url("../image/tzz_ion-1.png")
}

.our-blog-wrapper .next-step {
    border: 8px solid #fff;
    box-shadow: 0 1px 0 #fff
}

.our-blog-wrapper .next-step:after {
    background: #12171c
}

.our-blog-content h3 {
    color: #fff;
    font: 45px/45px roboto-light-webfont, Arial, sans-serif;
    text-align: center
}

.our-blog-content h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.obc-subcaption {
    color: #fff;
    font-size: 17px;
    margin-top: 20px;
    text-align: center
}

.obc-columns {
    padding: 80px 0 60px
}

.obc-columns .obcc-column {
    background-color: rgba(1, 2, 3, .3);
    border-radius: 2px;
    padding: 10px 10px 50px;
    position: relative;
    width: 45%
}

.obcc-column:first-child {
    float: left
}

.obcc-column:last-child {
    float: right
}

.obcc-column .blog-date {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #009ddc;
    display: block;
    border: 3px solid #fff;
    left: -23px;
    top: -45px;
    position: absolute;
    font: 21px/21px roboto-light-webfont, Arial, sans-serif;
    text-align: center;
    color: #fff;
    padding-top: 13px;
    text-transform: uppercase;
    z-index: 1
}

.obcc-column .blog-author-comment {
    background: #0078ae;
    display: inline-block;
    position: absolute;
    overflow: hidden;
    padding: 15px 5px;
    bottom: 28px;
    white-space: nowrap;
    width: 85%;
    left: 50%;
    margin-left: -42%
}

.obcc-column .blog-author-comment ul {
    text-align: center
}

.obcc-column .blog-author-comment li {
    display: inline
}

.obcc-column .blog-date strong {
    display: block;
    font: 33px/33px roboto-black-webfont, Arial, sans-serif
}

.obcc-column .blog-img {
    position: relative;
    text-align: center
}

.blog-shadow-corner {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 17px;
    left: 0;
    background: url("../image/tzz_ion-1.png") center -72px no-repeat
}

.obcc-column .blog-text {
    background: #fff;
    border-radius: 0 0 2px 2px;
    padding: 35px 30px 70px
}

.obcc-column .blog-text h5 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px
}

.obcc-column .blog-text h5 a {
    color: #0078ae
}

.obcc-column .blog-text h5 a:hover {
    color: #90C404
}

.obcc-column .blog-text p {
    color: #5a6063;
    line-height: 24px;
    font-size: 15px
}

.obcc-column .blog-author-comment, .obcc-column .blog-author-comment a {
    color: #fff;
    font-size: 13px
}

.obcc-column .blog-author-comment a {
    text-decoration: underline;
    font-weight: 700
}

.obcc-column .blog-author-comment a:hover {
    text-decoration: none
}

.obcc-column .blog-author-comment .sep {
    padding: 0 15px;
    color: #37c6ff
}

.obc-lnk {
    background: #1e2227;
    border: 1px solid #293139;
    color: #758288;
    text-shadow: 0 1px 0 #000;
    box-shadow: inset 0 -1px 0 #0f1318
}

.full-services-lnk-wrapper .obc-lnk {
    margin-top: -23px
}

.obc-lnk:hover {
    color: #fff;
    background: #34373b
}

.in-the-news-wide-section, .in-the-news-wrapper {
    padding: 90px 0;
    background: url("../image/tzz_ion-1.png");
    position: relative
}

.in-the-news-wide-section-alt {
    background: 0 0
}

.in-the-news-wrapper .next-step {
    border: 8px solid #14191e;
    box-shadow: 0 1px 0 #fff
}

.in-the-news-wrapper .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.in-the-news-wide-section .next-step {
    border: 8px solid #f7f7f7
}

.in-the-news-wide-section .next-step-gray {
    border-color: #eaedee
}

.in-the-news-wide-section-alt .next-step {
    border: 8px solid #eef2f3
}

.in-the-news-wide-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.in-the-news-content h2, .in-the-news-content h3 {
    color: #0078ae;
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    text-align: center;
    text-shadow: 0 1px 0 #bbdbe9
}

.in-the-news-content h2 span, .in-the-news-content h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.in-the-news-content .itnc-sep {
    border-bottom: 1px solid #FFF;
    border-top: 1px solid #E2E3E3;
    height: 0;
    margin: 50px 0
}

.in-the-news-content .mobile-img, .in-the-news-content .tablet-img {
    display: none
}

.top-page-panel {
    position: relative;
    margin-top: -12px;
    padding: 42px 0 12px;
    background: url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABQAAD/4QMraHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjMtYzAxMSA2Ni4xNDU2NjEsIDIwMTIvMDIvMDYtMTQ6NTY6MjcgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzYgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjFBNTgwNDIxOTYwMDExRTY4M0IwREQyNUYyN0NCRTg0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjFBNTgwNDIyOTYwMDExRTY4M0IwREQyNUYyN0NCRTg0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MUE1ODA0MUY5NjAwMTFFNjgzQjBERDI1RjI3Q0JFODQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MUE1ODA0MjA5NjAwMTFFNjgzQjBERDI1RjI3Q0JFODQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAACAgICAgICAgICAwICAgMEAwICAwQFBAQEBAQFBgUFBQUFBQYGBwcIBwcGCQkKCgkJDAwMDAwMDAwMDAwMDAwMAQMDAwUEBQkGBgkNCwkLDQ8ODg4ODw8MDAwMDA8PDAwMDAwMDwwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABLAEsDAREAAhEBAxEB/8QAeQABAQEBAQAAAAAAAAAAAAAAAQACAwgBAQEBAQEAAAAAAAAAAAAAAAABAgcIEAACAAQEBQMFAQEBAAAAAAABEQAhMQLwQWESUXGBIjKRsUKhwdHhUvGSExEBAAICAQQCAwAAAAAAAAAAAPABEUExIVGh4YGxkcHR/9oADAMBAAIRAxEAPwDzaaEghXWjcRrdHeXlFopsBEG6Qylj/IJJPICMw07SqsfiC2gkUR41/kA8cesEa2kEgFl3J1MiOcXBlmW4IFO13S5ARDSraAA+1gEcTP2wIG1dQotm4bnUrXSFlFG261IFgkDIAZQ4ORts20+OtN1eGKuHRc2nISLXaKiuP8ggzdQTdq5awVoE7gRKds/5l1xrBMdBIABoC1KhKuxhwVFs6m4XIBSCUoIrQk7QEbSBXLMyriUKLR2ok3bhtmQy5uAqFeJBuKIp9cc4ACkJyNsphyzIhS2kNtLWnQU3UrT6e8Dcn7FbOLtndx7nE0bdJkkAUN3QSPMRpkH4oVNu0Zyr4+n7iKyymi9o3EMuehGOsRVytfkrdEC8e0Uatlt3FAm13ZvrCktmoDu+Mqy7qY94K1cAiDQG7szPPrhwtKQrMfw9JYpAthnb4S2v4tbvWvTpEa3JO7REkQAbbacEXFZJqCKd4AWYED0mTcA2TtDHLJY94AXiM9khzM646QUIO4vcrrmSW5RBA3Eo5G3RS9ccYpikZDgAG9Rcogbp3EN91wvlxolFtKaSS8u3rLH+QMsbZLt8NtdXup9YYXJmQQKKQRnP6QEZ3XWufcLspgJSgmsoA3G2VTYQOhGPxDk48yfbJaJNDbI8S8YlEV0R3XIEWjcbhNDPH5jSZYmxcKA2q3iVWWpiKSQhkTb3HhNQRbmbtTchWSU6Y0hlcST5Xa69putF1zmZTAJgdS79q2/Dhnuah1TFZ+WaidNszwmgAILwQRkWAbyBWRH3WBBJJ5SMn8ja7jImTNYKLbpNI7fQbsf7Eqy6JbDZtF1yOq9ccYqUnPXs7npkBA9iakMmLQnMj3xKIsk8tXmd5ed5JE3nJ49otpVfozFwkASbenvjWKMy2+Mk6H+vSuX3iG5J2ClSdoYEqOpx9ILmSfLoWWavcW651xrFZcw+2c+2ZksGI0pICYG1hc0MfeAbm7mJO9HISUl6QSv4bZFkSJtlzH6wIUWz8CHS2b5tTx7Q0uyZ3kzCNwIDkEMzjrDaVwW0qA2IZtHh9veB7Z7dtMqS/rGkF2AULiCRJm5ubayiK3MFkTG7kEIrKfdaNbEBJwNCe2ZNo2zIp5KkF3OxJmURcDvHqP1gQT1J9gC1htA2g3dJrH4h0M2chRkN1XdABtFWWDcgf3PHGGFypMCbBsZzAASCgntIKh/qoo6/unSAAApSIt4ICcFPaCRbQm7bbxxicE6oEAolztJIeQMgoLdIgFBBG3ttlQ549oEk8lM3A03XsOsg6wT0yznI9sy5Smc8awVqWxgdu2Ws+uNYaTYuHlaCETfNUCpKFlfxb1kx2kZha8cZQyYYY2/Dwaee72xSI01Yv/OTSmmvLWdKfmLXCXzJOynvmmz4p0HCGzSFRT4+VHtz0f2ygA0vTW2X/Qq545RB0HkOd9eEsc40l8fhnMOm6378M4ii2lnKar0xTrCi9umefleuD2iKywXvv5htPLyx9Im106fH5v6LdjV6xU3qU//Z)
}

.top-page-panel:before {
    content: ""
}

.top-page-panel .ttl, .top-page-panel h1, .top-page-panel h5 {
    : roboto-medium-webfont, Arial, sans-serif;
    font-size: 47px;
    line-height: 47px;
    color: #fff;
    float: left;
    margin: 1px 0 0
}

.top-page-panel .tpp-nav {
    float: right;
    margin: 1px 2px 0 0
}

.top-page-panel .tpp-nav li {
    float: left;
    margin-left: 5px;
    min-width: 146px;
    position: relative
}

.top-page-panel .tpp-nav li a {
    display: block;
    text-shadow: 0 -1px 0 #004c6e;
    border: 1px solid #00618a;
    border-color: #005b81 #006f9c #00618a #00648d;
    -webkit-box-shadow: 1px 1px 0 0 #008fcd;
    box-shadow: 1px 1px 0 0 #008fcd;
    border-radius: 4px;
    padding: 12px 19px 11px;
    color: #fff;
    font: 15px/1 roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwODdiZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwODdiZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwYWFlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMGFhZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 0/200% 100%;
    background: -moz-linear-gradient(left, rgba(0, 135, 189, 1) 0, rgba(0, 135, 189, 1) 50%, rgba(0, 170, 238, 1) 50%, rgba(0, 170, 238, 1) 100%) 0 0/200% 100%;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 135, 189, 1)), color-stop(50%, rgba(0, 135, 189, 1)), color-stop(50%, rgba(0, 170, 238, 1)), color-stop(100%, rgba(0, 170, 238, 1))) 0 0/200% 100%;
    background: -webkit-linear-gradient(left, rgba(0, 135, 189, 1) 0, rgba(0, 135, 189, 1) 50%, rgba(0, 170, 238, 1) 50%, rgba(0, 170, 238, 1) 100%) 0 0/200% 100%;
    background: linear-gradient(to right, rgba(0, 135, 189, 1) 0, rgba(0, 135, 189, 1) 50%, rgba(0, 170, 238, 1) 50%, rgba(0, 170, 238, 1) 100%) 0 0/200% 100%;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear;
    min-height: 55px
}

.top-page-panel .tpp-nav li a:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
    background: #0ae;
    content: "";
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear
}

.top-page-panel .tpp-nav .hover > a, .top-page-panel .tpp-nav a:hover {
    color: #fff;
    background-position: -100% 0
}

.top-page-panel .tpp-nav .active > a {
    color: #0078ae;
    background: #fff;
    text-shadow: none
}

.top-page-panel .tpp-nav li .sublevel, .top-page-panel .tpp-nav li > ul {
    opacity: 0;
    visibility: hidden;
    width: 144px;
    background: #fff;
    position: absolute;
    border: none;
    white-space: nowrap;
    right: 1px;
    top: 52px;
    border-radius: 0 0 3px 3px;
    padding: 8px 15px 8px 13px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    z-index: 21;
    box-shadow: 0 2px 4px #5a6063
}

.top-page-panel .tpp-nav li ul.nav-drop-wide {
    width: 99%
}

.top-page-panel .tpp-nav li:hover .sublevel, .top-page-panel .tpp-nav li:hover > ul {
    display: block;
    opacity: 1;
    visibility: visible
}

.top-page-panel .tpp-nav li ul a {
    display: block;
    background: 0 0;
    border: none;
    padding: 10px 20px;
    color: #009ddc;
    text-shadow: none;
    text-transform: none;
    box-shadow: none;
    -webkit-transition: color .3s ease-in-out;
    -moz-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
    font: 13px/1.3 Arial, sans-serif;
    position: relative
}

.top-page-panel .tpp-nav li ul a:before {
    position: absolute;
    top: 50%;
    left: 0;
    content: "Â»";
    margin-top: -13px;
    font: 700 20px/1 Arial, sans-serif;
    color: #009ddc;
    width: auto;
    height: auto;
    background: 0 0;
    -webkit-transition: color .3s ease-in-out;
    -moz-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out
}

.top-page-panel .tpp-nav li ul li:hover a, .top-page-panel .tpp-nav li ul li:hover a:before {
    color: #90c404
}

.top-page-panel .tpp-nav li ul a.level3 {
    margin-left: 10px
}

.top-page-panel .tpp-nav li ul li {
    display: block;
    float: none;
    clear: both;
    border-top: 1px solid #f8f8f8;
    white-space: normal;
    min-width: 100%
}

.top-page-panel .tpp-nav li ul li:first-child {
    border-top: none
}

.page-title {
    padding: 28px 0 0
}

.page-title h1, .page-title h2 {
    background: url("../image/tzz_ion-1.png") 0 100% repeat-x;
    font-size: 50px;
    text-align: center;
    color: #0078ae;
    padding: 0 0 32px;
    : roboto-light-webfont, Arial, sans-serif
}

.page-title h1 span, .page-title h2 span {
    : roboto-bold-webfont, Arial, sans-serif
}

.btn-green {
    float: right;
    font: 18px/18px roboto-black-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    padding: 9px 40px 11px;
    text-shadow: 0 -1px 0 #447523;
    box-shadow: 0 -1px 0 #c9e973, 0 1px 0 #5e8900;
    border-radius: 18px;
    background: 0 0/100% 100% #95c906;
    background: -moz-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a2d90c), color-stop(100%, #89bb00)) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -ms-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    transition: all .4s linear
}

.btn-green:hover {
    color: #fff;
    background-position: 0 -200%;
    background-size: 100% 200%
}

.case-studies-section {
    padding: 0 0 102px
}

.case-studies-wide-section .case-studies-section {
    padding: 0
}

.cs-block {
    padding: 34px 0 36px;
    position: relative;
    border-bottom: 1px solid #fff
}

.cs-block:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    content: "";
    border-bottom: 1px solid #e3e4e4
}

.cs-thumb {
    float: left;
    margin: 5px 35px 0 0;
    position: relative
}

.cs-thumb-right {
    float: right;
    margin-right: 0;
    margin-left: 35px
}

.cs-site-screen {
    display: block;
    max-width: 440px;
    -webkit-box-shadow: 1px 1px 0 0 #a5a5a5;
    box-shadow: 1px 1px 0 0 #a5a5a5
}

.website-tag {
    position: absolute;
    top: 19px;
    left: 0;
    z-index: 2;
    float: left;
    height: 33px;
    padding: 0 13px;
    background: #009ddc;
    border-radius: 0 2px 2px 0;
    font-size: 14px;
    line-height: 33px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 -1px 0 #007bad;
    text-transform: uppercase
}

.our-work-section .website-tag {
    top: 42px
}

.preview-after-additional .website-tag, .preview-after-frame .website-tag, .preview-aside .website-tag {
    top: 36px
}

.cs-thumb a:hover .website-tag {
    -webkit-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
    padding-left: 25px
}

span.website-tag:hover {
    cursor: default;
    color: #fff
}

.cs-description {
    overflow: hidden;
    font-size: 15px;
    line-height: 1.5;
    color: #5a6063
}

.cs-block .ttl, .cs-block h1, .cs-block h2, .cs-block h6 {
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 12px;
    : Arial, Helvetica, Sans-Serif;
    text-align: left
}

.cs-block .ttl a, .cs-block h2 a, .cs-block h6 a {
    color: #0078ae
}

.cs-block .ttl a:hover, .cs-block h2 a:hover, .cs-block h6 a:hover {
    color: #009DDC
}

.cs-block p {
    margin: 0 0 16px
}

.custom-list {
    font-size: 15px;
    color: #5a6063;
    margin: 0 0 14px
}

.custom-list-first {
    float: left
}

.custom-list-second {
    padding-left: 50px
}

.custom-list li {
    padding: 0 0 8px 23px;
    position: relative
}

.custom-list li:before {
    position: absolute;
    top: 2px;
    left: 0;
    content: "Â»";
    font: 700 19px/1 Arial, sans-serif;
    color: #009ddc
}

.custom-list a, .custom-list span, .st-column a {
    color: #0f70b8;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.custom-list a:hover, .st-column a:hover {
    color: #009DDC
}

.re-collapse a, .view-more {
    display: inline-block;
    vertical-align: top;
    font: 16px/1 roboto-bold-webfont, sans-serif;
    color: #90c404;
    text-transform: uppercase
}

.re-collapse a:after, .view-more:after {
    display: inline-block;
    vertical-align: top;
    margin: -9px 0 0 6px;
    content: "Â»";
    font: 28px/1 roboto-bold-webfont, sans-serif;
    position: relative;
    left: 0;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear
}

.re-collapse a:hover:after, .view-more:hover:after {
    left: 3px
}

.cs-block a {
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.page-navigation {
    padding: 22px 0;
    position: relative;
    border-bottom: 1px solid #fff;
    margin: 0 0 46px
}

.page-navigation:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    content: "";
    border-bottom: 1px solid #e3e4e4
}

.paging-basic .page-navigation {
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 0
}

.paging-basic .page-navigation:before {
    display: none
}

.page-navigation a, .prev-link {
    font: 14px/1 roboto-bold-webfont, sans-serif;
    color: #009ddc;
    cursor: pointer;
    text-transform: uppercase;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.page-navigation a:hover, .prev-link:hover {
    color: #009DDC
}

.page-navigation .prev-page {
    float: left
}

.page-navigation .next-page {
    float: right
}

.page-navigation .next-page:after, .page-navigation .prev-page:before, .prev-link:before {
    display: inline-block;
    vertical-align: top;
    content: "Â«";
    margin: -7px 3px 0 0;
    font: 22px/1 roboto-bold-webfont, sans-serif;
    position: relative;
    left: 0;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out
}

.page-navigation .next-page:hover:after {
    left: 3px
}

.page-navigation .prev-page:hover:before {
    left: -3px
}

.page-navigation .next-page:after {
    margin-right: 0;
    margin-left: 3px;
    content: "Â»"
}

.page-navigation-left .page-navigation {
    float: left
}

.cs-block-single {
    padding: 60px 0 115px;
    border-bottom: 0
}

.cs-block-single .cs-thumb {
    margin-top: -55px
}

.cs-block-single:after {
    border-bottom: 0
}

.cs-block h1 {
    font-size: 36px;
    margin-bottom: 20px;
    padding-right: 53%
}

.cs-wide-section {
    position: relative
}

.cs-preview-design {
    border-top: 1px solid #0079aa;
    padding: 100px 0 116px;
    background: url("../image/tzz_ion-1.png")
}

.cs-preview-design .next-step {
    border: 8px solid #fff
}

.cs-preview-design .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.section-title {
    text-align: center;
    margin: 0 0 36px
}

.c-section-title {
    padding: 0 10px
}

.frame-section-title h2, .h-h2, .section-title h2 {
    font: 57px/1 roboto-light-webfont, sans-serif;
    color: #fff;
    margin: 0 0 10px
}

.wide-featexp-section .section-title h2 {
    : roboto-medium-webfont, sans-serif
}

.section-title h2.text-alt {
    color: #0078AE
}

.frame-section-title h2 span, .h-h2 span, .section-title h2 span {
    : roboto-black-webfont, sans-serif
}

.section-title p {
    font-size: 17px;
    line-height: 1.4;
    color: #74c9ef;
    text-shadow: 0 -1px 0 #00374f
}

.section-title.in-light h2 {
    color: #0078ae;
    margin-bottom: 20px
}

.section-title .txt-frame {
    max-width: 870px;
    margin: 0 auto
}

.preview-preview-aside {
    display: table;
    width: 100%
}

.preview-aside {
    display: table-cell;
    vertical-align: top;
    width: 290px;
    padding: 0 6px 0 0;
    font-size: 15px;
    line-height: 1.4;
    color: #74c9ef
}

.preview-before {
    position: relative;
    margin: 0 0 22px
}

.cs-before-img {
    display: block;
    width: 100%;
    -webkit-box-shadow: 1px 1px 0 0 #013c57;
    box-shadow: 1px 1px 0 0 #013c57
}

.arrow-from-to {
    position: absolute;
    top: 88px;
    right: -38px;
    width: 87px;
    height: 45px;
    z-index: 999;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.preview-aside h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 5px;
    color: #fff
}

.preview-aside p {
    margin: 0 0 20px
}

.preview-list {
    border-top: 1px solid #004b6d;
    border-bottom: 1px solid #007cb3;
    margin: 0 0 30px
}

.preview-list li {
    display: block;
    border-top: 1px solid #007cb3;
    border-bottom: 1px solid #004b6d
}

.preview-list a {
    display: block;
    font: 16px/1 roboto-bold-webfont, sans-serif;
    color: #74c9ef;
    text-transform: uppercase;
    text-shadow: 1px -1px 0 #003045;
    padding: 14px 0 10px;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.preview-list a:hover {
    color: #fff
}

.preview-list a:after {
    display: inline-block;
    vertical-align: top;
    font: 28px/1 roboto-bold-webfont, sans-serif;
    content: "Â»";
    margin: -8px 0 0 6px
}

.btn-simple, .cs-block .btn-simple, .sw-description .btn-simple-blue {
    display: inline-block;
    font: 18px/18px roboto-black-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    padding: 9px 40px;
    text-shadow: 0 -1px 0 #447523;
    border-radius: 18px;
    background: 0 0/100% 100% #95c906;
    background: -moz-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -ms-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    transition: all .4s linear
}

.btn-simple:hover {
    color: #fff;
    background-position: 0 -200%;
    background-size: 100% 200%
}

.preview-after {
    display: table-cell;
    vertical-align: top
}

.cs-after-img {
    width: 100%
}

.preview-after-additional, .preview-after-frame {
    position: relative
}

.preview-after-additional {
    display: none
}

.preview-after-additional img {
    width: 100%;
    margin-bottom: 20px
}

.cs-results .next-step {
    border: 8px solid #005F8B
}

.cs-results {
    padding: 100px 0 112px;
    background: url("../image/tzz_ion-1.png")
}

.cs-results .section-title p {
    color: #758288
}

.cs-graphs {
    text-align: center
}

.cs-graphs img {
    margin: 26px 0 0;
    border: 1px solid #5b5d5f
}

.cs-details .next-step {
    border: 8px solid #14191e
}

.cs-details .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.cs-details {
    padding: 100px 0 70px;
    font-size: 15px;
    line-height: 1.5;
    color: #5a6063;
    background: url("../image/tzz_ion-1.png")
}

.cs-details .section-title h2, .cs-services .section-title h2 {
    color: #0078ae
}

.cs-detail-description {
    display: table;
    width: 100%
}

.cs-detail-col {
    display: table-cell;
    width: 54%;
    padding: 0 0 0 60px
}

.cs-detail-col:first-child {
    padding-left: 0;
    width: 46%
}

.cs-detail-description h3 {
    color: #0078ae;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 5px
}

.cs-detail-description p {
    margin: 0 0 30px
}

.cs-services .next-step {
    border: 8px solid #f7f7f7;
    -webkit-box-shadow: 0 1px 0 #fff;
    box-shadow: 0 1px 0 #fff
}

.cs-services .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.cs-services {
    border-top: 1px solid #f9f9f9;
    padding: 100px 0 90px;
    text-align: center;
    background: url("../image/tzz_ion-1.png")
}

.cs-service-columns {
    display: table;
    width: 100%;
    padding: 0 0 18px
}

.cs-service-column {
    display: table-cell;
    vertical-align: top;
    width: 25%;
    text-align: center
}

.nofound.cs {
    max-width: 1103px;
    margin: 0 auto;
    padding-top: 40px
}

.nofound {
    display: flex;
    width: auto;
    justify-content: space-between
}

.nofound .cs-service-column {
    flex-grow: 1;
    display: block;
    width: auto
}

.nofound .service-logo {
    width: auto
}

.service-logo {
    margin: 0 0 28px
}

.cs-service-column h3, .cs-service-column h3 a {
    font-size: 18px;
    font-weight: 700;
    color: #0c95cd;
    margin: 0 0 10px
}

h3.color-red, h3.color-red a {
    color: #aa4141
}

h3.color-green, h3.color-green a {
    color: #71980d
}

h3.color-orange, h3.color-orange a {
    color: #d57e0e
}

h3.color-purple, h3.color-purple a {
    color: #872f9f
}

.cs-simple-list {
    font-size: 15px;
    color: #5a6063
}

.cs-simple-list li {
    padding: 0 0 10px
}

.cs-simple-list a {
    color: #5a6063;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.cs-simple-list a:hover {
    color: #4AA6BD
}

.page-intro-block {
    padding: 30px 0 10px;
    margin-bottom: 40px;
    border-bottom: 1px solid #fff;
    position: relative
}

.page-intro-block:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    content: "";
    border-bottom: 1px solid #d9d9d9
}

.intro-block-industries-served, .intro-block-industries-served:after {
    border: none
}

.page-intro-text {
    display: table-cell;
    vertical-align: top;
    width: 50%;
    padding: 40px 30px 0 0;
    font: 28px roboto-light-webfont, sans-serif;
    color: #0078ae
}

.short-services-intro {
    letter-spacing: -1px
}

.page-intro-text strong {
    : roboto-bold-webfont, sans-serif
}

.page-intro-image {
    display: table-cell;
    vertical-align: top;
    width: 50%;
    padding: 0 16px 0 0
}

.services-wide-section {
    position: relative;
    background-color: #fff;
    padding: 35px 0 0;
    box-shadow: inset 0 -3px 5px rgba(213, 213, 213, .46)
}

.services-wide-section-fullscreen {
    position: relative
}

.service-wide-item {
    position: relative;
    padding: 49px 0
}

.service-dt-columns {
    display: table;
    width: 100%
}

.sw-logo {
    display: table-cell;
    vertical-align: middle;
    width: 240px
}

.sw-logo-hold {
    display: block;
    width: 240px;
    height: 240px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    border: 6px solid #fff;
    line-height: 229px;
    text-align: center;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZjZmNmY1IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTUlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
    background: -moz-linear-gradient(-45deg, rgba(246, 246, 245, 1) 0, rgba(255, 255, 255, 1) 55%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(246, 246, 245, 1)), color-stop(55%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(-45deg, rgba(246, 246, 245, 1) 0, rgba(255, 255, 255, 1) 55%);
    background: -o-linear-gradient(-45deg, rgba(246, 246, 245, 1) 0, rgba(255, 255, 255, 1) 55%);
    background: -ms-linear-gradient(-45deg, rgba(246, 246, 245, 1) 0, rgba(255, 255, 255, 1) 55%);
    background: linear-gradient(135deg, rgba(246, 246, 245, 1) 0, rgba(255, 255, 255, 1) 55%);
    box-shadow: -7px -7px 10px rgba(95, 128, 7, .15)
}

.sw-logo-hold-cd {
    box-shadow: -7px -7px 10px rgba(160, 96, 13, .15)
}

.sw-logo-hold-wmd {
    box-shadow: -7px -7px 10px rgba(101, 27, 121, .15)
}

.sw-logo-hold-om {
    box-shadow: -7px -7px 10px rgba(1, 118, 165, .15)
}

.sw-logo-hold-wma {
    box-shadow: -7px -7px 10px rgba(151, 19, 13, .15)
}

.sw-logo-hold svg {
    width: 100%;
    height: 100%;
    vertical-align: middle
}

.sw-logo-hold-wma svg {
    width: 70%
}

.sw-description {
    display: table-cell;
    vertical-align: middle;
    padding: 0 10px;
    font: 17px/1.5 roboto-regular-webfont, Arial, sans-serif;
    color: #5a6063;
    width: 415px
}

.wma-anim {
    width: 53px;
    height: 70px;
    overflow: hidden;
    position: absolute;
    top: 76px;
    left: 86px
}

.wma-anim .sq {
    position: absolute;
    background-color: #AA4141;
    width: 18px;
    height: 18px
}

.wma-anim .sq:nth-child(odd) {
    left: 6px
}

.wma-anim .sq:nth-child(even) {
    left: 29px
}

.wma-anim .sq01, .wma-anim .sq02 {
    top: 6px
}

.wma-anim .sq03, .wma-anim .sq04 {
    top: 29px
}

.wma-anim .sq05, .wma-anim .sq06 {
    top: 51px
}

.sw-logo-hold-wma:hover .sq01 {
    animation: sq01Move 2.4s ease infinite
}

.sw-logo-hold-wma:hover .sq02 {
    animation: sq02Move 2.4s ease infinite
}

.sw-logo-hold-wma:hover .sq03 {
    animation: sq05Move 2.4s ease infinite
}

.sw-logo-hold-wma:hover .sq04 {
    animation: sq06Move 2.4s ease infinite
}

.sw-logo-hold-wma:hover .sq05 {
    animation: sq07Move 2.4s ease infinite
}

.sw-logo-hold-wma:hover .sq06 {
    animation: sq08Move 2.4s infinite ease
}

@keyframes sq01Move {
    0%, 13% {
        left: 6px
    }
    33% {
        left: 59px;
        transform: translateY(0)
    }
    33.2% {
        left: -29px;
        transform: translateY(-100px)
    }
    46% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 54% {
        left: 6px
    }
}

@keyframes sq02Move {
    0% {
        left: 29px
    }
    5% {
        left: 59px;
        transform: translateY(0)
    }
    5.5% {
        left: -29px;
        transform: translateY(-100px)
    }
    27% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 33% {
        left: 29px
    }
}

@keyframes sq05Move {
    0%, 17% {
        left: 6px
    }
    37% {
        left: 59px;
        transform: translateY(0)
    }
    37.5% {
        left: -29px;
        transform: translateY(-100px)
    }
    50% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 58% {
        left: 6px
    }
}

@keyframes sq06Move {
    0%, 8% {
        left: 29px
    }
    14% {
        left: 59px;
        transform: translateY(0)
    }
    14.5% {
        left: -29px;
        transform: translateY(-100px)
    }
    33% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 42% {
        left: 29px
    }
}

@keyframes sq07Move {
    0%, 13% {
        left: 6px
    }
    37% {
        left: 59px;
        transform: translateY(0)
    }
    37.5% {
        left: -29px;
        transform: translateY(-100px)
    }
    53% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 63% {
        left: 6px
    }
}

@keyframes sq08Move {
    0% {
        left: 29px
    }
    7% {
        left: 59px;
        transform: translateY(0)
    }
    7.5% {
        left: -29px;
        transform: translateY(-100px)
    }
    37% {
        left: -29px;
        transform: translateY(0)
    }
    100%, 46% {
        left: 29px
    }
}

.sw-list-col {
    display: table-cell;
    vertical-align: middle;
    width: 325px
}

.sw-description .btn-simple-blue:after {
    display: none
}

.service-wide-item h2 {
    font: 32px/1.2 roboto-bold-webfont, sans-serif;
    color: #71980d;
    margin: 0 0 16px
}

.service-wide-item h2 a {
    color: #71980d
}

.creative-serv-item h2, .creative-serv-item h2 a {
    color: #d57e0e
}

.mobiledev-serv-item h2, .mobiledev-serv-item h2 a {
    color: #872f9f
}

.marketing-serv-item h2, .marketing-serv-item h2 a {
    color: #009ddc
}

.mobileapps-serv-item h2, .mobileapps-serv-item h2 a {
    color: #aa4141
}

.sw-description p {
    margin: 0 0 25px
}

.bullet-service-list {
    position: relative;
    padding-left: 43px;
    font: 17px roboto-medium-webfont, Arial, sans-serif
}

.bullet-service-list:after {
    content: "";
    background: url("../image/tzz_ion-1.png") no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -28px 0 0 -286px;
    width: 286px;
    height: 43px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.strategy-serv-item .bullet-service-list:after {
    background-position: 0 0
}

.creative-serv-item .bullet-service-list:after {
    background-position: 0 -45px
}

.mobiledev-serv-item .bullet-service-list:after {
    background-position: 0 -91px
}

.marketing-serv-item .bullet-service-list:after {
    background-position: 0 -137px
}

.mobileapps-serv-item .bullet-service-list:after {
    background-position: 0 -183px
}

.bullet-service-list li {
    padding: 0 0 12px 32px;
    position: relative;
    color: #5a6063;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    line-height: 1.2
}

.bullet-service-list li a {
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    position: relative;
    z-index: 3
}

.bullet-service-list li:before {
    content: "Â»";
    font: 28px/.5 roboto-bold-webfont, Arial, sans-serif;
    display: inline-block;
    vertical-align: top;
    text-indent: -22px;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.creative-serv-item .bullet-service-list a, .creative-serv-item .bullet-service-list li:before {
    color: #d57e0e
}

.mobiledev-serv-item .bullet-service-list a, .mobiledev-serv-item .bullet-service-list li:before {
    color: #872f9f
}

.marketing-serv-item .bullet-service-list a, .marketing-serv-item .bullet-service-list li:before {
    color: #009ddc
}

.strategy-serv-item .bullet-service-list a, .strategy-serv-item .bullet-service-list li:before {
    color: #71980D
}

.mobileapps-serv-item .bullet-service-list a, .mobileapps-serv-item .bullet-service-list li:before {
    color: #aa4141
}

.strategy-serv-item .bullet-service-list li:hover a, .strategy-serv-item .bullet-service-list li:hover:before {
    color: #4c6609
}

.creative-serv-item .bullet-service-list li:hover a, .creative-serv-item .bullet-service-list li:hover:before {
    color: #ab660d
}

.marketing-serv-item .bullet-service-list li:hover a, .marketing-serv-item .bullet-service-list li:hover:before {
    color: #0177a6
}

.mobiledev-serv-item .bullet-service-list li:hover a, .mobiledev-serv-item .bullet-service-list li:hover:before {
    color: #4f1e5c
}

.mobileapps-serv-item .bullet-service-list li:hover a, .mobileapps-serv-item .bullet-service-list li:hover:before {
    color: #850101
}

.btn-simple-orange {
    box-shadow: 0 1px 0 #9e5c07;
    text-shadow: 0 -1px 0 #9e5c07;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzOTAwZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iI2UwODQwZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjZjdiMGYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 0/100% 100%;
    background: -moz-linear-gradient(top, rgba(243, 144, 15, 1) 0, rgba(224, 132, 15, 1) 47%, rgba(207, 123, 15, 1) 100%) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, rgba(243, 144, 15, 1) 0, rgba(224, 132, 15, 1) 47%, rgba(207, 123, 15, 1) 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, rgba(243, 144, 15, 1) 0, rgba(224, 132, 15, 1) 47%, rgba(207, 123, 15, 1) 100%) 0 0/100% 100%
}

.btn-simple-red {
    box-shadow: 0 1px 0 #830b0c;
    text-shadow: 0 -1px 0 #830b0c;
    background: 0 0/100% 100% #f45d5d;
    background: -moz-linear-gradient(top, #f45d5d 0, #aa4141 100%) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, #f45d5d 0, #aa4141 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, #f45d5d 0, #aa4141 100%) 0 0/100% 100%
}

.btn-simple-purple {
    box-shadow: 0 1px 0 #582151;
    text-shadow: 0 -1px 0 #75614e;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2FiNGJjNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iIzk4M2NiMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4ODMwYTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 0/100% 100%;
    background: -moz-linear-gradient(top, rgba(171, 75, 197, 1) 0, rgba(152, 60, 177, 1) 47%, rgba(136, 48, 160, 1) 100%) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, rgba(171, 75, 197, 1) 0, rgba(152, 60, 177, 1) 47%, rgba(136, 48, 160, 1) 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, rgba(171, 75, 197, 1) 0, rgba(152, 60, 177, 1) 47%, rgba(136, 48, 160, 1) 100%) 0 0/100% 100%
}

.btn-simple-blue, .sw-description .btn-simple-blue {
    box-shadow: 0 1px 0 #016e6f;
    text-shadow: 0 -1px 0 #438f62;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM2YmRmNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iIzE5YWNlNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMjllZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 0/100% 100%;
    background: -moz-linear-gradient(top, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 0/100% 100%
}

.sw-description .btn-simple-blue:hover {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM2YmRmNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iIzE5YWNlNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMjllZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 -200%/100% 200%;
    background: -moz-linear-gradient(top, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 -200%/100% 200%;
    background: -webkit-linear-gradient(top, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 -200%/100% 200%;
    background: linear-gradient(to bottom, rgba(54, 189, 244, 1) 0, rgba(25, 172, 231, 1) 47%, rgba(2, 158, 221, 1) 100%) 0 -200%/100% 200%
}

.service-wide-item .next-step {
    border: 8px solid #F7F7F7;
    box-shadow: 0 1px 0 #fff
}

.service-wide-item .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.mobiledev-serv-item .next-step {
    border: 8px solid #EEF2F3;
    box-shadow: 0 1px 0 #fff
}

.mobiledev-serv-item .next-step:after {
    background: #fff
}

.whitepapers-section .next-step {
    border: 8px solid #eef2f3;
    box-shadow: 0 1px 0 #fff
}

.whitepapers-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.certify-section .next-step {
    border: 8px solid #dce2e3;
    box-shadow: 0 1px 0 #fff
}

.certify-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.blue-middle-box {
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: 0 0 30px;
    margin-top: -53px;
    margin-bottom: 50px;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden
}

.sub-title-box.alt {
    margin: -53px 0 0
}

.sub-title-box.alt + .infoboxes {
    padding-top: 0
}

.blue-middle-box:after {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 0;
    width: 180%;
    height: 30px;
    left: -40%;
    right: -40%;
    background: -webkit-radial-gradient(50% -3%, ellipse cover, rgba(00, 00, 00, .3), rgba(137, 141, 144, 0) 40%);
    background: radial-gradient(ellipse at 50% -3%, rgba(00, 00, 00, .3), rgba(137, 141, 144, 0) 40%)
}

.blue-box-inner {
    padding: 31px;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwODNiYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iIzAwNzhhZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDc4YWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(0, 131, 188, 1) 0, rgba(0, 120, 174, 1) 47%, rgba(0, 120, 174, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 131, 188, 1)), color-stop(47%, rgba(0, 120, 174, 1)), color-stop(100%, rgba(0, 120, 174, 1)));
    background: -webkit-linear-gradient(top, rgba(0, 131, 188, 1) 0, rgba(0, 120, 174, 1) 47%, rgba(0, 120, 174, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 131, 188, 1) 0, rgba(0, 120, 174, 1) 47%, rgba(0, 120, 174, 1) 100%)
}

.blue-box-inner .ttl, .blue-box-inner h4, .text-section .blue-box-inner h4 {
    display: inline-block;
    vertical-align: middle;
    margin: -10px 36px 0 0;
    color: #fff;
    font: 45px/1 roboto-light-webfont, sans-serif
}

.blue-box-inner .ttl {
    white-space: nowrap
}

.blue-box-inner .ttl span, .blue-box-inner h4 span {
    : roboto-bold-webfont, sans-serif
}

.blue-box-inner .ttl br, .blue-box-inner h4 br {
    display: none
}

.work-section {
    padding: 0 0 140px
}

.ws-columns {
    display: table;
    width: 100%
}

.ws-column {
    display: table-cell;
    width: 50%;
    padding-left: 55px;
    font-size: 17px;
    line-height: 1.5;
    color: #5a6063
}

.ws-column:first-child {
    padding-left: 0;
    padding-right: 55px
}

.ws-column h3 {
    font-size: 36px;
    line-height: 1.2;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 16px
}

.ws-columns p {
    margin: 0 0 12px
}

.more-link {
    font: 14px/1 roboto-bold-webfont, sans-serif;
    color: #009ddc;
    text-transform: uppercase;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.see-all-large .more-link {
    font-size: 16px;
    text-shadow: 0 1px 0 #fff
}

.more-link:after {
    display: inline-block;
    vertical-align: top;
    content: "Â»";
    font-size: 25px;
    line-height: 25px;
    margin: -1px 0 0 7px;
    position: relative;
    left: 0;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear
}

.more-link:hover:after {
    left: 3px
}

.more-link:hover {
    color: #009DDC
}

.see-all-large .more-link:after {
    font-size: 28px;
    margin-top: -7px
}

.whitepapers-section h2 {
    text-shadow: 0 1px 0 #fff
}

.whitepaper-subtext:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    content: "";
    border-top: 1px solid #eff2f2
}

.whitepaper-subtext h5 {
    margin: 0 0 2px
}

.whitepaper-subtext p {
    line-height: 1.3
}

.whitepaper-subtext p a {
    color: #0078ae
}

.whitepaper-subtext p a:hover {
    color: #90C404
}

.whitepaper-subtext .btn-simple:last-child {
    margin-top: 20px
}

.see-all-large {
    display: block;
    border-radius: 3px;
    border: 1px solid #d0d7da;
    border-width: 1px 0;
    padding: 16px 0 14px;
    text-align: center;
    margin: 74px 0 0;
    font: 16px/1 roboto-bold-webfont, sans-serif;
    color: #009ddc;
    text-shadow: 0 1px 0 #fff;
    text-transform: uppercase;
    box-shadow: 0 1px 0 #fff;
    background: url("../image/tzz_ion-1.png");
    -webkit-transition: all .3s ease-out, all .3s ease-out;
    -moz-transition: all .3s ease-out, all .3s ease-out;
    transition: all .3s ease-out, all .3s ease-out
}

.see-all-large-top {
    margin-top: 30px
}

.see-all-large:hover {
    background: #fff;
    color: #009ddc
}

.see-all-large:after {
    display: inline-block;
    vertical-align: top;
    content: "Â»";
    font-size: 28px;
    line-height: 28px;
    margin: -9px 0 0 7px
}

.certify-section {
    padding: 124px 0 134px;
    border-top: 1px solid #fff
}

.certify-section .section-title h2, .frame-section-title h2 {
    color: #0078ae;
    margin-bottom: 0
}

.frame-section-title {
    text-align: center
}

.certify-section .section-title, .frame-section-title {
    position: relative;
    padding-bottom: 44px;
    margin-bottom: 56px;
    border-bottom: 1px solid #fff
}

.certify-section .section-title:after, .frame-section-title:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    content: "";
    border-bottom: 1px solid #cfd4d5
}

.certify-items {
    display: table;
    width: 100%;
    color: #5a6063;
    font: 14px roboto-bold-webfont, sans-serif;
    margin: 0 0 72px
}

.certify-item {
    display: table-cell;
    width: 50%;
    padding-left: 58px
}

.certify-item:first-child {
    padding-left: 0;
    padding-right: 10px
}

.certify-item img {
    float: left;
    margin: 0 12px 0 0
}

.certify-item p {
    overflow: hidden
}

.trusted-icons {
    text-align: center;
    display: table;
    width: 100%
}

.ti-item {
    display: table-cell;
    text-align: center
}

.wrapper-textured {
    background: url("../image/tzz_ion-1.jpg")
}

.ie9 .ie9-team-bkg {
    background: #f1f1f1
}

.before-and-after-wrapper {
    margin: 30px 0 0;
    overflow: hidden;
    width: 100%
}

.before-and-after-wrapper .text-lnk {
    background: #e0e5e7;
    border-width: 1px
}

.before-and-after-wrapper .text-lnk:hover {
    background: #f5f5f5
}

.baac-row {
    margin: 0 0 34px
}

.baac-row .ttl, .baac-row h3, .baac-row h6 {
    font-size: 20px;
    color: #0078ae;
    text-align: center;
    font-weight: 700;
    margin: 0 0 9px;
    display: block
}

.baac-row .ttl span, .baac-row h3 span, .baac-row h6 span {
    cursor: pointer
}

.baac-row .baac-frame .frame {
    position: relative
}

.baac-row .baac-arrow {
    background: url("../image/tzz_ion-1.png") -566px -13px no-repeat;
    width: 87px;
    height: 45px;
    position: absolute;
    overflow: hidden;
    text-indent: -9999px;
    left: 50%;
    margin-left: -45px;
    top: 41.09005628517824%;
    z-index: 2;
    -webkit-transition: left .4s ease-out;
    -moz-transition: left .4s ease-out;
    transition: left .4s ease-out
}

.baac-frame .frame:hover .baac-arrow {
    left: 50.5%
}

.baac-row .baac-visible-row .alignleft {
    float: left
}

.baac-row .baac-visible-row .alignright {
    float: right
}

.baac-row .baac-item {
    width: 49.69387755102041%;
    -webkit-box-shadow: 1px 1px 0 0 rgba(163, 163, 163, 1);
    box-shadow: 1px 1px 0 0 rgba(163, 163, 163, 1)
}

.baac-row .baac-item .baac-img img {
    display: block;
    max-width: 100%
}

.baac-more-top {
    display: none
}

.baac-row .baac-more a {
    position: relative;
    display: block;
    font-size: 17px;
    font-weight: 700;
    background: #fff;
    padding: 11px 0 13px;
    text-align: center;
    color: #0078ae;
    text-shadow: none;
    -webkit-transition: background-color .3s ease-out, background-color .3s ease-out;
    -moz-transition: background-color .3s ease-out, background-color .3s ease-out;
    transition: background-color .3s ease-out, background-color .3s ease-out
}

.baac-row .baac-more a span {
    display: inline-block;
    background: url("../image/tzz_ion-1.png") -593px -77px no-repeat;
    width: 20px;
    height: 19px;
    overflow: hidden;
    text-indent: -9999px;
    margin: 0 0 0 7px;
    position: relative;
    top: 3px
}

.baac-item-active .baac-more a, .baac-row .baac-item:hover .baac-more a, .baac-row .baac-more a:hover {
    background: #0078ae;
    color: #fff
}

.baac-item-active .baac-more a span, .baac-row .baac-item:hover .baac-more a span, .baac-row .baac-more a:hover span {
    background-position: -552px -77px
}

.baac-row .baac-item .baac-img {
    position: relative;
    cursor: pointer
}

.baac-visible-row-hover .faded .baac-img:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .6);
    content: ''
}

.baac-item-active .baac-more a:after {
    background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
    width: 21px;
    height: 11px;
    position: absolute;
    bottom: -19px;
    left: 50%;
    content: "";
    margin-left: -13px
}

.baac-row .baac-hidden-row {
    display: none;
    overflow: hidden;
    height: 0
}

.baac-row .baac-hidden-item {
    padding: 19px 0 0
}

.baac-row .baac-hidden-item-frame {
    color: #fff;
    position: relative;
    padding: 52px 0 59px;
    background: url("../image/tzz_ion-1.png")
}

.baac-row .baac-hidden-item-content h4, .demo-video-box h4, .expanded-mode h3, .expanded-mode h4 {
    font-size: 49px;
    padding: 0 80px 18px 0;
    : roboto-light-webfont, Arial, sans-serif
}

div:not(.brand-frame) .video-frame {
    padding: 0 20px
}

.baac-row .baac-hidden-item-content h4 {
    padding-left: 10px
}

.baac-row .baac-link-close, .btn-close-it, .expand-close {
    background: url("../image/tzz_ion-1.png") -680px 0 no-repeat;
    width: 61px;
    height: 79px;
    text-indent: -9999px;
    overflow: hidden;
    position: absolute;
    right: 2px;
    top: -52px
}

.baac-row .baac-link-close:before, .btn-close-it:before, .expand-close:before {
    background: url("../image/tzz_ion-1.png") -757px 0 no-repeat;
    width: 61px;
    height: 79px;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    transition: opacity .3s
}

.baac-row .baac-link-close:hover:before, .btn-close-it:hover:before, .expand-close:hover:before {
    opacity: 1
}

.baac-row .baac-image-holder {
    border-left: 1px solid #000;
    border-top: 1px solid #000;
    border-right: 1px solid #1d2429;
    border-bottom: 1px solid #2b323a;
    border-radius: 3px
}

.baac-row .baac-image-frame {
    border-left: 1px solid #262b32;
    border-top: 1px solid #262b32;
    border-right: 1px solid #161a1e;
    border-bottom: 1px solid #0f1318;
    border-radius: 3px;
    background: #1e2227;
    padding: 12px 12px 20px
}

.baac-row .baac-slider-bottom {
    padding: 13px 0 0;
    position: relative
}

.baac-slider-bottom .btn-green {
    margin: 24px 5px 0 0
}

.baac-slider-bottom .btn-launch {
    position: absolute;
    top: 45px;
    left: 50%;
    font-size: 16px;
    color: #758288;
    padding-right: 18px;
    margin-left: -7.755102040816327%;
    text-transform: uppercase;
    : roboto-bold-webfont, Arial, sans-serif;
    text-shadow: 0 -1px 0 #14171a;
    -webkit-transition: color .3s ease-out;
    transition: color .3s ease-out
}

.baac-slider-bottom .btn-launch:after {
    display: inline-block;
    vertical-align: -2px;
    margin: 0 0 0 6px
}

.baac-slider-bottom .btn-launch:hover {
    color: #009DDC;
    background-position: 100% -24px
}

.baac-slider-bottom .btn-launch:after {
    position: absolute;
    top: -7px;
    right: 0;
    font: 28px/1 roboto-bold-webfont, sans-serif;
    content: "Â»"
}

.baac-row .baac-slider-tn {
    float: left
}

.baac-row .baac-slider-tn ul li {
    float: left;
    margin-right: 12px
}

.baac-row .baac-slider-tn ul span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    padding: 6px 0 0;
    color: #758288
}

.baac-row .baac-slider-tn ul img {
    display: block;
    border: 2px solid #1e2227;
    opacity: .5
}

.baac-row .baac-slider-tn ul .active img {
    opacity: 1;
    border: 2px solid #90c404
}

.baac-row .baac-slider-tn ul .active span {
    color: #90c404
}

.baac-row .baac-slider-frame {
    position: relative;
    cursor: pointer
}

.demo-reel-block {
    font-size: 17px;
    line-height: 26px;
    color: #5a6063;
    padding: 47px 0 0
}

.demo-reel-block.video-production-custom-nopadding {
    padding-top: 0
}

.demo-reel-block .frame {
    padding: 0 0 44px;
    background: url("../image/tzz_ion-1.png") 0 100% repeat-x
}

.demo-reel-block.video-production-custom-nopadding .drb-main-content {
    margin-bottom: 0
}

.demo-reel-block.video-production-custom-nopadding .frame {
    padding-bottom: 0;
    background: 0 0
}

.demo-reel-block .drb-content {
    overflow: hidden
}

.demo-reel-block .drb-content h3 {
    font-size: 36px;
    line-height: 41px;
    color: #0078ae;
    font-weight: 700;
    margin: 0 0 18px;
    position: relative;
    padding-right: 99px;
    width: 94%
}

.demo-reel-block .drb-content h3 .arrow {
    right: -31px;
    top: 22px;
    position: absolute;
    width: 99px;
    overflow: hidden;
    height: 37px;
    background: url("../image/tzz_ion-1.png") -732px -134px no-repeat
}

.demo-reel-block .drb-video-holder {
    float: right;
    padding: 7px 1px 0 0;
    position: relative;
    width: 380px;
    margin-left: 30px;
    margin-right: -1px
}

.demo-reel-block .drb-video-holder .play {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -48px;
    margin-top: -48px;
    width: 97px;
    height: 97px
}

.demo-reel-block .drb-video-holder .play:before {
    position: absolute;
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 97px;
    height: 97px;
    top: 0;
    left: 0;
    content: "";
    z-index: 1;
    webkit-transition: opacity .4s;
    -moz-transition: opacity .4s;
    transition: opacity .4s
}

.demo-reel-block .drb-video-holder:hover .play:before {
    opacity: 0
}

.demo-reel-block .drb-video-holder .play:after {
    position: absolute;
    background: url("../image/tzz_ion-1.png") left bottom no-repeat;
    width: 97px;
    height: 97px;
    left: 0;
    top: 0;
    content: "";
    z-index: 2;
    opacity: 0;
    webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    transition: opacity .3s
}

.demo-reel-block .drb-video-holder:hover .play:after {
    opacity: 1
}

.demo-reel-block .drb-video-holder img {
    display: block;
    max-width: 100%
}

.featured-work-block {
    padding: 34px 0 40px
}

.featured-work-fullscreen {
    padding-top: 4px
}

.fwb-row .fwb-items {
    width: 100%
}

.fwb-row .fwb-item {
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    width: 32.04081632653061%;
    margin-right: 1.53265306122449%;
    margin-bottom: 28px
}

.fwb-row .fwb-item > a img {
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-backface-visibility: hidden
}

.fwb-row .fwb-item > a:hover img {
    opacity: .75
}

.fwb-row .fwb-item-3 {
    margin-right: 0
}

.fwb-row .fwb-items img {
    display: block;
    max-width: 100%;
    vertical-align: bottom
}

.page-nutshell-wrapper {
    position: relative;
    padding-bottom: 30px;
    padding-top: 90px
}

.page-nutshell-wrapper .next-step {
    border: 8px solid #fff;
    box-shadow: 0 1px 0 #fff
}

.page-nutshell-wrapper .next-step:after {
    background: #12171c
}

.page-nutshell-wrapper .next-step-blue-bd {
    border: 8px solid #01608b
}

.page-cs-wide-section {
    padding-bottom: 105px
}

.page-cs-wide-section .next-step {
    border: 8px solid #15181D
}

.page-cs-wide-section .next-step-light-bd {
    border: 8px solid #eef2f3
}

.industry-recognition-wide-section {
    padding: 0 0 118px;
    background: url("../image/tzz_ion-1.png")
}

.industry-recognition-logos .mobile-img, .industry-recognition-logos .tablet-img {
    display: none
}

.case-studies-wide-section, .testimonials-wide-section, .text-wide-section {
    background: url("../image/tzz_ion-1.png");
    padding: 113px 0 130px;
    border-top: 1px solid #fff;
    position: relative
}

.text-wide-section-alt-bg {
    background: #fff
}

.text-wide-section {
    padding: 113px 0 87px
}

.case-studies-wide-section .next-step, .testimonials-wide-section .next-step, .text-wide-section .next-step {
    border: 8px solid #F7F7F7;
    box-shadow: 0 1px 0 #FFF
}

.case-studies-wide-section .next-step {
    border-color: #eef2f3
}

.case-studies-wide-section .next-step-blue-border, .in-the-news-wide-section .next-step-blue-border {
    border-color: #01608b
}

.text-wide-section .next-step {
    border-color: #eaedee
}

.case-studies-wide-section .next-step:after, .testimonials-wide-section .next-step:after, .text-wide-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.cs-wide-section .next-step-blue-bd {
    border: 8px solid #01608b
}

.testimonials-wide-section .frame-section-title, .testimonials-wide-section .frame-section-title:after, .text-wide-section .frame-section-title, .text-wide-section .frame-section-title:after {
    border: 0
}

.testimonials-wide-section .frame-section-title, .text-wide-section .frame-section-title {
    margin-bottom: 38px;
    padding-bottom: 30px
}

.testimonial, .text-column {
    float: left;
    width: 44.38775510204082%;
    font-size: 15px;
    color: #5a6063;
    line-height: 24px
}

.testimonial:last-child, .text-column:last-child {
    float: right;
    margin-right: 1px
}

.single-text-section {
    font-size: 17px;
    line-height: 26px;
    color: #5A6063;
    padding: 40px 0
}

.text-column {
    width: 48%;
    font-size: 17px;
    line-height: 26px
}

.text-column h4 {
    font-size: 24px;
    color: #0078ae;
    margin-bottom: 15px
}

.text-column p {
    margin-bottom: 40px
}

.testimonial .ti-content {
    background: #fff;
    padding: 36px 40px 39px;
    border-right: 1px solid #b6b6b6;
    border-bottom: 1px solid #b6b6b6;
    border-radius: 3px;
    position: relative
}

.testimonial .ti-content .title {
    font-size: 20px;
    color: #0078ae;
    display: block;
    margin: 0 0 8px
}

.testimonial .ti-content:before {
    background: url("../image/tzz_ion-1.png") -891px -217px no-repeat;
    position: absolute;
    width: 64px;
    height: 64px;
    left: -25px;
    top: -25px;
    content: ''
}

.testimonial .ti-content:after {
    background: url("../image/tzz_ion-1.png") -820px -235px no-repeat;
    position: absolute;
    width: 46px;
    height: 28px;
    right: 17.24137931034483%;
    bottom: -28px;
    content: '';
    margin-right: -1px
}

.testimonial .ti-author {
    padding: 36px 0 0;
    text-align: right;
    font-size: 13px;
    line-height: 18px;
    color: #5a6063
}

.testimonial .ti-photo {
    float: right;
    border: 1px solid #fff;
    margin: 0 1px 0 20px;
    -webkit-box-shadow: 1px 1px 0 0 rgba(163, 163, 163, 1);
    box-shadow: 1px 1px 0 0 rgba(163, 163, 163, 1)
}

.testimonial .ti-author-content {
    padding: 9px 0 0
}

.ti-author-content .tiac {
    overflow: hidden
}

.testimonial .ti-author-content .title {
    display: block;
    color: #0078ae
}

.page-intro-title {
    font: 50px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 14px 0 15px;
    padding-right: 45%
}

.page-intro-title-wider {
    padding-right: 35%
}

.page-intro-title-narrow {
    padding-right: 54%
}

.page-intro-title span {
    : roboto-bold-webfont, sans-serif
}

.page-intro-block {
    color: #5a6063;
    line-height: 1.4;
    overflow: hidden
}

.intro-block-no-bd {
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 24px
}

.intro-block-no-bd:after, .intro-block-no-bd:before {
    display: none
}

.page-intro-block .btn-simple {
    margin-bottom: 30px
}

.page-intro-block .video-production-custom-nopadding .btn-simple {
    margin-bottom: 22px
}

.case-study-intro, .page-intro-block p {
    font: 20px roboto-light-webfont, sans-serif;
    margin: 0 0 16px
}

.page-intro-block p strong {
    : roboto-bold-webfont, sans-serif
}

.page-intro-block .custom-list {
    margin-bottom: 20px;
    overflow: hidden
}

.intro-fl-image {
    float: right;
    margin: -30px 0 0 26px
}

.fl-image-null-top-marg {
    margin-top: 0
}

.intro-fl-image-landing-services {
    margin: -130px 0 0 26px
}

.intro-fl1-image {
    float: right;
    margin: -11px 0 0 26px
}

.up-intro-fl1-image {
    margin: -70px 0 0 26px
}

.up-slightly-intro-fl1-image {
    margin: -30px 0 0 26px
}

.intro-fl-image-holder {
    float: right;
    margin: -61px 0 0 30px;
    width: 45.91836734693878%
}

.intro-fl-image-holder .prev-link-holder a {
    float: right
}

.intro-fl-image-holder .prev-link-holder {
    margin: 0 0 27px
}

.intro-fl-main-img img {
    float: right
}

.strategy-consult-list .next-step {
    border: 8px solid #F7F7F7;
    box-shadow: 0 1px 0 #fff
}

.strategy-consult-list .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.strategy-consult-item {
    background: url("../image/tzz_ion-1.png");
    border-top: 1px solid #fff;
    border-bottom: 1px solid #e2e2e2;
    padding: 25px 0;
    overflow: hidden
}

.strategy-consult-item:first-child {
    border-top: 0;
    padding-top: 106px
}

.planning-strategy-item {
    background: url("../image/tzz_ion-1.png")
}

.marketing-strategy-item {
    border-bottom: 0;
    padding-bottom: 108px
}

.sc-logo {
    float: left;
    margin: 0 70px 0 0
}

.sc-descript {
    overflow: hidden;
    font-size: 15px;
    line-height: 1.5;
    color: #5a6063
}

.sc-descript h2 {
    font: 28px roboto-bold-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 9px
}

.sc-descript h2 a {
    color: #0078ae;
    text-decoration: none;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.sc-descript h2 a:hover {
    color: #009DDC
}

.video-wide-section {
    padding-bottom: 124px;
    border-top: 1px solid #13181d;
    background: url("../image/tzz_ion-1.png")
}

.our-work-section .blue-middle-box, .video-wide-section .blue-middle-box {
    margin-bottom: 30px
}

.our-work-section .blue-middle-box:after, .video-wide-section .blue-middle-box:after {
    display: none
}

.video-wide-section .section-title p {
    color: #758288;
    padding-top: 5px
}

.single-video-box {
    margin: 0 auto;
    width: 100%;
    max-width: 674px
}

.flexible-frame, .video-box-inner {
    position: relative;
    padding-top: 1px;
    padding-bottom: 56.25%;
    height: 0
}

.flexible-frame object, .single-video-box embed, .single-video-box iframe, .single-video-box object {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.succeeding-online-inner-page {
    background: #fff
}

.certify-section-grey .next-step {
    border: 8px solid #ebeff0
}

.our-clients-wrapper-serv-page .next-step {
    border: 8px solid #15181D
}

.creative-design-chapters {
    padding-top: 104px;
    padding-bottom: 50px;
    background: url("../image/tzz_ion-1.png")
}

.creative-design-chapters .next-step {
    border: 8px solid #F7F7F7;
    box-shadow: 0 1px 0 #fff
}

.creative-design-chapters .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.cd-chapter {
    display: inline-block;
    vertical-align: top;
    width: 49%;
    padding: 0 0 62px 34px;
    overflow: hidden
}

.cd-chapter.pad-r-64 {
    padding-right: 64px;
    padding-left: 0
}

.cd-logo {
    width: 100px;
    float: left;
    margin: 0 28px 0 0
}

.cd-descript {
    overflow: hidden;
    color: #5a6063;
    font-size: 15px;
    line-height: 1.6
}

.cd-chapter .ttl, .cd-chapter h3, .cd-chapter h6 {
    font-weight: 700;
    font-size: 20px;
    line-height: 1.1;
    color: #0078ae;
    margin: 0 0 8px
}

.cd-chapter .ttl a, .cd-chapter h3 a, .cd-chapter h6 a {
    color: #0078ae;
    webkit-transition: color .4s ease;
    -moz-transition: color .4s ease;
    transition: color .4s ease
}

.cd-chapter .ttl a:hover, .cd-chapter h3 a:hover, .cd-chapter h6 a:hover {
    color: #036
}

.cd-descript p {
    margin: 0 0 10px
}

.cd-descript .more-link:after {
    margin-top: -3px
}

.offers {
    background: #fff;
    position: relative;
    padding: 100px 0 20px
}

.offers .frame {
    max-width: 1576px
}

.offers .t-holder {
    margin-bottom: 40px
}

.offers .t-cell {
    position: relative;
    vertical-align: top;
    width: 49%;
    border: solid #d9dadb;
    border-width: 0 1px 1px;
    transition: all .2s linear
}

.offers .t-sep {
    display: table-cell;
    width: 2%
}

.offers .img-holder {
    height: 305px;
    position: relative;
    margin: 0 -1px;
    background: #fff;
    display: block
}

.offers .img-holder img {
    position: absolute;
    bottom: 0;
    left: 50%;
    webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.offers .txt-holder {
    padding: 4% 25% 80px 8%;
    font: 17px/1.4 roboto-regular-webfont, Arial, sans-serif;
    color: #5a6063
}

.offers h2 {
    font: 40px/1.1 roboto-bold-webfont, Arial, sans-serif;
    color: #0078ae;
    margin-bottom: 12px
}

.offers .link-arrow {
    position: absolute;
    bottom: 40px;
    white-space: nowrap
}

.offers .more-link {
    color: #90c404;
    font-size: 16px;
    line-height: 27px;
    position: absolute;
    bottom: 5%;
    white-space: nowrap
}

.offers .more-link:after {
    color: #90c404
}

.offers h2 a {
    color: #0078ae
}

.offers .t-cell:after {
    content: "";
    position: absolute;
    bottom: -1px;
    width: 100%;
    background: #009ddc;
    height: 4px;
    transition: all .2s linear
}

.our-team-section, .our-work-section {
    padding-bottom: 115px;
    border-top: 1px solid #0079aa;
    background: url("../image/tzz_ion-1.png")
}

.ow-items {
    width: 996px
}

.ow-item {
    display: inline-block;
    vertical-align: bottom;
    position: relative;
    margin: 0 15px 50px 0
}

.ie9 .ow-item {
    margin-right: 14px
}

.see-all-large-blue {
    background: #0078ae;
    border: 1px solid #018bcc;
    box-shadow: inset 0 -1px 0 #004664, -1px -1px 0 #004664;
    color: #fff;
    text-shadow: 0 -1px 0 #004c6e;
    margin-top: 20px;
    -webkit-transition: all .3s ease-out, all .3s ease-out;
    -moz-transition: all .3s ease-out, all .3s ease-out;
    transition: all .3s ease-out, all .3s ease-out
}

.see-all-large-blue:hover {
    color: #fff;
    background: #009ddc;
    box-shadow: inset 0 -1px 0 #004664, -1px -1px 0 #004664
}

.our-latest-projects-content .see-all-large-blue {
    margin-top: 25px
}

.services-before-after-section {
    padding-top: 102px;
    padding-bottom: 112px;
    background: url("../image/tzz_ion-1.png")
}

.services-before-after-section .next-step {
    border: 8px solid #005f8b;
    box-shadow: 0 1px 0 #fff
}

.services-before-after-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.services-before-after-section .section-title {
    margin-bottom: 58px
}

#main .c-section-title h2, .case-studies-part-section .section-title h2, .clients-list-section .section-title h2, .cms-wide-section .section-title h2, .newsletter-section .section-title h2, .no-pad-t-section .section-title h2, .obtained-section h2, .sample-text-section .section-title h2, .services-before-after-section .section-title h2, .services-dev-section .section-title h2, .video-landing-section .section-title h2, .video-presentation-section .section-title h2, .video-section .section-title h2, .wh-section-4 .section-title h2 {
    color: #0078ae
}

#main .c-section-title p, .case-studies-part-section .section-title p, .clients-list-section .section-title p, .cms-wide-section .section-title p, .newsletter-section .section-title p, .no-pad-t-section .section-title p, .obtained-section p, .sample-text-section .section-title p, .services-before-after-section .section-title p, .services-dev-section .section-title p, .video-landing-section .section-title p, .video-presentation-section .section-title p, .video-section .section-title p {
    color: #5a6063;
    text-shadow: 0 1px 0 #fff
}

.sample-text-section .section-title p {
    padding-top: 20px
}

.services-before-after-section .before-and-after-wrapper {
    padding-bottom: 0
}

.services-before-after-section .see-all-large {
    margin-top: 0;
    background: #E9EFF1;
    border-color: #D2D2D2;
    box-shadow: inset 0 -1px 0 #d9dfe1
}

.services-before-after-section .see-all-large:hover {
    background: #fff;
    border-color: #fff;
    box-shadow: 0 0 4px #d9dfe1
}

.our-team-section {
    padding-top: 105px
}

.our-team-section .next-step {
    border: 8px solid #fff
}

.our-team-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.our-team-section .next-step-dark {
    border-color: #15181D
}

.our-team-section .see-all-large-blue {
    margin-top: 24px
}

.team-slider {
    padding-top: 30px;
    padding-bottom: 14px;
    margin: 0 auto;
    max-width: 912px;
    position: relative
}

.team-slider .slides {
    padding-bottom: 14px;
    overflow: hidden
}

.team-slider .slides li {
    text-align: center;
    padding-bottom: 7px;
    float: none !important;
    display: inline-block;
    vertical-align: bottom
}

.slide-post {
    position: absolute;
    bottom: 0;
    z-index: 2;
    background: #fff;
    border-radius: 2px;
    width: 290px;
    height: 58px;
    padding: 10px;
    font-size: 13px;
    line-height: 1.1;
    color: #3e3e3e;
    margin-left: 7px
}

.slide-post:after {
    position: absolute;
    left: 50%;
    bottom: -14px;
    margin-left: -144px;
    width: 288px;
    height: 15px;
    content: "";
    background: url("../image/tzz_ion-1.png") -90px -42px no-repeat
}

.slide-post strong {
    display: block;
    font-size: 18px;
    color: #0078ae;
    margin: 0 0 5px
}

.slide-post span {
    display: block
}

.case-studies-part-section {
    padding-top: 100px;
    padding-bottom: 100px
}

.case-studies-part-section .next-step {
    border: 8px solid #005F8B
}

.case-studies-part-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.case-studies-part-section .next-step-light {
    border-color: #fff
}

.case-studies-part-section .next-step-light:after {
    background: url("../image/tzz_ion-1.jpg")
}

.services-dev-section {
    background: #fff;
    padding: 102px 0 50px
}

.services-dev-section .next-step {
    border: 8px solid #f8f8f8
}

.services-dev-section .next-step:after {
    background: #fff
}

.services-dev-section .next-step-blue-bd, .services-wide-section .next-step-blue-bd {
    border-color: #005F8B
}

.services-dev-section .soc-column {
    padding-top: 46px;
    padding-bottom: 20px
}

.services-dev-section .soc-column h2, .services-dev-section .soc-column h3, .services-dev-section .soc-column h5 {
    height: 134px
}

.services-dev-section .soc-column p {
    padding-left: 20px;
    padding-right: 20px
}

.certify-section2 {
    padding-top: 140px;
    padding-bottom: 130px
}

.certify-section2 .next-step {
    border-color: #fff
}

.certify-section3 .next-step {
    border-color: #f2f2f2
}

.certify-section3 .next-step:after, .in-the-news-wide-section-alt .next-step:after {
    background: url("../image/tzz_ion-1.jpg")
}

.certify-section2 .next-step-black-bd {
    border: 8px solid #005F8B;
    box-shadow: 0 1px 0 #fff
}

.certify-section2 .next-step-black-bd:after {
    background: #fff
}

.page-intro-block .fancy-list {
    overflow: hidden
}

.fancy-list {
    font-size: 15px;
    color: #5a6063;
    padding: 10px 0 28px
}

.fancy-list li {
    position: relative;
    margin: 0 1px 9px 0
}

.fancy-list li:before {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 21px;
    height: 17px;
    content: "";
    top: 8px;
    left: 8px;
    position: absolute
}

.fancy-list-grey li:before {
    background-image: url("../image/tzz_ion-1.png")
}

.fancy-list a {
    color: #0078ae;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.fancy-list a:hover {
    color: #009DDC
}

.fancy-list .fl-item {
    float: left;
    background: #fdfdfd;
    padding: 6px 25px 5px 45px;
    border-radius: 16px;
    -webkit-box-shadow: 1px 1px 0 0 rgba(180, 180, 180, .68);
    box-shadow: 1px 1px 0 0 rgba(180, 180, 180, .68)
}

.our-work-section-with-link {
    padding: 111px 0 97px
}

.our-work-section-with-link .see-all-large {
    margin-top: -10px
}

.page-intro-block-pad {
    padding-bottom: 82px
}

.in-the-news-sub-wrapper {
    padding-bottom: 113px
}

.sub-title-box .blue-middle-box {
    margin-top: 0
}

.sub-title-box {
    position: relative;
    margin-top: -155px
}

.text-section {
    border-top: 1px solid #fff;
    position: relative;
    padding: 86px 0 80px;
    font-size: 17px;
    line-height: 25px;
    color: #5a6063;
    text-align: center
}

.text-section h3 {
    color: #0078AE;
    font: 57px/57px roboto-light-webfont, Arial, sans-serif;
    text-align: center;
    text-shadow: 0 1px 0 #BBDBE9;
    margin: 0 0 30px
}

.text-section.a-left, .text-section.a-left h3 {
    text-align: left
}

.text-section h3 span {
    : roboto-black-webfont, Arial, sans-serif
}

.text-section h4 {
    font-weight: 700;
    font-size: 36px;
    line-height: 1.1;
    color: #0078ae;
    margin: 0 0 30px
}

.text-section p a {
    color: #009ddc;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.text-section p a:hover {
    color: #009DDC
}

.text-section p {
    margin: 0 0 30px
}

.page-intro-block .mobile {
    display: none
}

.page-intro-form p {
    padding-right: 45%
}

.page-navigation-float {
    float: right;
    padding-bottom: 0;
    margin-bottom: 0;
    border: 0
}

.page-navigation-float:before {
    display: none
}

.aside-form-box {
    float: right;
    width: 335px;
    margin: -101px 0 50px 120px;
    padding: 24px 22px 13px;
    border: 1px solid #1face5;
    border-radius: 6px;
    font-size: 15px;
    line-height: 1.5;
    color: #fff;
    text-shadow: 0 -1px 0 #01547a;
    text-align: center;
    position: relative;
    background: url("../image/tzz_ion-1.png")
}

.aside-form-box.afb__1 {
    margin-top: -140px
}

.pit__1 {
    padding-right: 45%
}

.aside-form-box:after {
    position: absolute;
    left: 0;
    bottom: -14px;
    width: 100%;
    height: 13px;
    content: "";
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat
}

.page-intro-block .aside-form-box p {
    font-size: 15px;
    line-height: 15px;
    padding-right: 0;
    margin-bottom: 12px
}

.aside-form-box h3 {
    font-size: 20px;
    line-height: 1;
    margin: 0 0 5px
}

.aside-form-box .f-row {
    padding-bottom: 11px;
    position: relative
}

.aside-form-box input[type=text], .aside-form-box textarea {
    width: 100%;
    background: #fff;
    border: 0;
    border-radius: 8px;
    padding: 11px 21px 8px 14px;
    font: italic 12px/17px Arial, Helvetica, sans-serif;
    color: #878a8c;
    box-shadow: inset 1px 1px 3px #858585
}

.aside-form-box textarea {
    resize: none;
    height: 60px
}

input.btn-simple {
    border: 0;
    padding: 0 20px;
    height: 36px
}

.aside-form-box input.btn-simple {
    border-radius: 8px;
    width: 248px;
    height: 42px;
    margin: 10px auto 0;
    padding-left: 0;
    padding-right: 0;
    box-shadow: 1px 1px #5e8900;
    : roboto-bold-webfont, sans-serif
}

.ppc-results-section {
    padding-top: 112px;
    padding-bottom: 100px;
    background: url("../image/tzz_ion-1.png")
}

.newsletter-section .next-step, .ppc-results-section .next-step {
    border: 8px solid #f7f7f7
}

.newsletter-section .next-step:after, .ppc-results-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.ppc-results-section .see-all-large {
    border-bottom: 1px solid #dcdfe1
}

.cs-block-no-bd {
    border-bottom: 0
}

.cs-block-no-bd:before {
    display: none
}

.our-blog-ppc-wrapper .next-step {
    border-color: #ecf0f1
}

.our-blog-ppc-wrapper .obcc-column .blog-text {
    min-height: 252px;
    padding-top: 30px;
    padding-bottom: 58px
}

.whitepapers-ppc-section .next-step {
    border-color: #14191E
}

.our-ppc-team-section .next-step {
    border-color: #dce2e3
}

.whitepapers-ppc-section .next-step-light-border {
    border-color: #F2F2F2
}

.sample-text-section {
    padding-top: 100px;
    padding-bottom: 86px
}

.sample-text-columns {
    width: 100%
}

.st-column {
    display: table-cell;
    vertical-align: top;
    width: 50%;
    padding-left: 30px;
    font-size: 15px;
    line-height: 1.6;
    color: #5a6063
}

.st-column:first-child {
    padding-left: 0;
    padding-right: 30px
}

.single-text-section h1 {
    font-size: 36px;
    line-height: 1.1;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 35px;
    : Arial, Helvetica, sans-serif
}

.single-text-section h2, .single-text-section h3, .st-column h3 {
    font-size: 20px;
    line-height: 1.1;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 5px;
    : Arial, Helvetica, sans-serif
}

.single-text-section h3 {
    font-size: 17px
}

.st-column h4 {
    font-size: 15px;
    font-weight: 700;
    color: #009ddc;
    padding-top: 15px;
    margin-bottom: 5px
}

.single-text-section p, .st-column p {
    margin: 0 0 30px;
    text-align: justify
}

.st-column .custom-list {
    margin-bottom: 50px
}

.sample-text-section .next-step {
    border: 8px solid #005F8B
}

.sample-text-section .next-step:after {
    background: #e9eeef
}

.sample-text-section, .sample-text-section4 {
    background: url("../image/tzz_ion-1.png")
}

.sample-text-section2, .sample-text-section3, .sample-text-section5 {
    background: 0 0
}

.sample-text-section2 .next-step {
    border: 8px solid #f2f2f2
}

.sample-text-section2 .next-step:after {
    background: url("../image/tzz_ion-1.jpg")
}

.sample-text-section4 .next-step, .sample-text-section5 .next-step {
    border-color: #F8F8F8
}

.sample-text-section4 .next-step:after, .sample-text-section5 .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.custom-text-field {
    padding-left: 25px;
    position: relative
}

.custom-text-field:before {
    position: absolute;
    top: 2px;
    left: 0;
    content: "Â»";
    color: #009ddc;
    font-size: 19px;
    line-height: 1;
    font-weight: 700
}

.custom-text-field strong {
    color: #0078ae
}

.our-clients-ppc-wrapper .next-step {
    border-color: #f8f8f8
}

.certify-section-pr .next-step {
    border-color: #005F8B
}

.certify-section-pr {
    background: url("../image/tzz_ion-1.png")
}

.news-pr-wrapper {
    background: 0 0
}

.news-pr-wrapper .next-step {
    border-color: #efefef
}

.news-pr-wrapper .next-step:after {
    background: #f7f7f7
}

.page-intro-email .intro-fl-image {
    margin-top: -10px
}

.newsletter-section {
    padding-top: 80px;
    padding-bottom: 40px
}

.certify-section-grey {
    background: url("../image/tzz_ion-1.png")
}

.whitepapers-cro-section .next-step {
    border-color: #f3f3f3
}

.wrapper .next-step-v1 {
    border: 8px solid #fff
}

.wrapper .next-step-v1:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v2 {
    border: 8px solid #F7F7F7;
    box-shadow: 0 1px 0 #FFF
}

.wrapper .next-step-v2:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v3 {
    border: 8px solid #eef2f3;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1)
}

.wrapper .next-step-v3:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v4, .wrapper .next-step-v4-bd {
    border: 8px solid #edf0f1
}

.wrapper .next-step-v4:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v5, .wrapper .next-step-v5-bd {
    border: 8px solid #fdfdfd
}

.wrapper .next-step-v5:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v6, .wrapper .next-step-v6-bd {
    border: 8px solid #f2f2f2
}

.wrapper .next-step-v6:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v7 {
    border: 8px solid #f7f7f7;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1)
}

.wrapper .next-step-v7:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v8 {
    border: 8px solid #005F8B;
    box-shadow: 0 1px 0 #FFF
}

.wrapper .next-step-v8:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v8-bd {
    border: 8px solid #005F8B;
    box-shadow: 0 1px 0 #FFF
}

.wrapper .next-step-v9 {
    border-color: #d8ddde
}

.wrapper .next-step-v10 {
    border-color: #eee
}

.wrapper .next-step-v11 {
    border-color: #fff;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1)
}

.wrapper .next-step-v11:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v12 {
    border: 8px solid #f6f6f6
}

.wrapper .next-step-v12:after {
    background: url("../image/tzz_ion-1.png")
}

.next-step-v13 {
    border: 8px solid #14191e
}

.next-step-v13:after {
    background: url("../image/tzz_ion-1.jpg")
}

.wrapper .next-step-v14-bg:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v15-bd, .wrapper .next-step-v16 {
    border: 8px solid #f7f7f7
}

.wrapper .next-step-v16:after {
    background: #fff
}

.wrapper .next-step-v17 {
    border: 8px solid #f7f7f7;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1)
}

.wrapper .next-step-v17:after {
    background: #EAEDEE
}

.wrapper .next-step-v18 {
    border: 8px solid #fdfdfd;
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1)
}

.wrapper .next-step-v18:after {
    background: #EAEDEE
}

.wrapper .next-step-v20 {
    border: 8px solid #005F8B;
    box-shadow: none
}

.wrapper .next-step-v21 {
    border: 8px solid #EAEDEE;
    box-shadow: none
}

.wrapper .next-step-v22 {
    border: 8px solid #005f8b;
    box-shadow: none
}

.wrapper .next-step-v23 {
    border: 8px solid #fff;
    box-shadow: none
}

.wrapper .next-step-v24 {
    border: 8px solid #e4e4e4;
    box-shadow: none
}

.wrapper .next-step-v25 {
    border: 8px solid #f0f0f0;
    box-shadow: none
}

.wrapper .next-step-v25:after {
    background: url("../image/tzz_ion-1.png")
}

.wrapper .next-step-v26:after {
    background: url("../image/tzz_ion-1.png")
}

.section-bg-1 {
    background: url("../image/tzz_ion-1.png") !important;
    border-top: 1px solid #fff
}

.section-bg-2 {
    background: url("../image/tzz_ion-1.png") !important
}

.section-bg-3 {
    background: url("../image/tzz_ion-1.png") !important
}

.section-bg-4 {
    background: url("../image/tzz_ion-1.png") !important
}

.section-bg-6 {
    background: url("../image/tzz_ion-1.png") !important
}

.section-bg-7 {
    background: #EAEDEE !important
}

.see-all-large-v2 {
    background: url("../image/tzz_ion-1.png");
    border: 1px solid #e4e7e9
}

.tpp-heading {
    text-align: center;
    color: #fff;
    line-height: 35px;
    font-size: 28px;
    padding: 0 0 26px;
    : roboto-light-webfont, sans-serif
}

.tpp-heading h1 {
    : roboto-light-webfont, sans-serif;
    float: none;
    font-size: 50px;
    margin: 0 0 9px
}

.tpp-heading h1 span {
    : roboto-bold-webfont, sans-serif
}

.contact-holder {
    background: url("../image/tzz_ion-1.png");
    padding: 55px 0 60px
}

.contact-holder .ch-form {
    float: left;
    width: 45.51020408163265%
}

.seminars .ch-contacts-details {
    margin-right: 0
}

.seminars .ch-form {
    width: 43%
}

.seminars .ch-form .heading-green {
    color: #90c404 !important
}

.ch-form .f-row {
    padding: 0 11px 11px 42px;
    position: relative
}

.ch-form .ff-input, .ch-form .ff-textarea {
    float: left;
    width: 100%
}

.ch-form .ff-input input, .ch-form .ff-textarea textarea, .page-search-box input[type=text] {
    float: left;
    width: 100%;
    height: 46px;
    font-size: 14px;
    color: #878a8c;
    font-style: italic;
    : Arial, sans-serif;
    padding: 0 24px 0 18px;
    box-shadow: inset 1px 1px 3px #858585;
    border: 1px solid #c1c1c1;
    background: #fff;
    background: -webkit-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: -moz-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: -o-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: linear-gradient(to top, #fbfbfb, #fff) #fff;
    border-radius: 8px
}

.ch-form .ff-textarea textarea {
    height: 199px;
    padding: 16px 24px 16px 18px;
    resize: none
}

.form-ttl {
    color: #0078ae;
    font: 38px roboto-bold-webfont, sans-serif;
    display: block;
    margin-bottom: 7px
}

.ch-form .ff-input .required, .fancy-form .f-add-field span.required, .wh-fancy-form label.required:before {
    position: absolute;
    background: url("../image/tzz_ion-1.png") -10px -273px no-repeat;
    width: 8px;
    height: 8px;
    text-indent: -9999px;
    overflow: hidden;
    right: 0;
    top: 3px
}

.wh-fancy-form label.required:before {
    content: "";
    right: -10px
}

.ch-form .ff-input input:focus, .ch-form .ff-textarea textarea:focus {
    box-shadow: inset 1px 1px 3px #858585;
    border: 2px solid #aad15a;
    background-image: -webkit-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: -moz-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: -o-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: linear-gradient(to top, #fbfbfb, #fff)
}

.ch-form .ff-input input:focus {
    padding: 0 23px
}

.ch-form .ff-textarea textarea:focus {
    padding: 15px 23px
}

.page-search-box input[type=text] {
    padding: 0 24px !important;
    border: 1px solid #c1c1c1 !important;
    color: #0f70b8;
    text-transform: uppercase;
    font-weight: 700;
    font-style: normal;
    font-size: 17px;
    display: inline-block;
    float: none
}

.ch-form.page-search-box .ff-btn-submit {
    position: absolute;
    top: 0;
    right: 0;
    left: auto
}

.page-search-box {
    width: 100%;
    position: relative;
    padding-right: 222px;
    margin: 0 0 10px
}

.ch-form .ff-checkbox {
    overflow: hidden;
    font-size: 14px;
    line-height: 17px;
    color: #5a6063;
    font-style: italic;
    padding: 8px 0 0
}

.ch-form .ff-checkbox label {
    float: left;
    cursor: pointer;
    padding-right: 90px
}

.ch-form .ff-checkbox input {
    float: left
}

.ch-form .ff-checkbox span {
    display: block;
    overflow: hidden
}

.ch-form .ez-checkbox {
    background: url("../image/tzz_ion-1.png") -63px -267px no-repeat;
    width: 20px;
    height: 20px;
    float: left;
    margin: 0 10px 0 2px
}

.ch-form .ez-checked {
    background-position: -31px -267px
}

.ch-form .ez-checkbox input {
    width: 20px;
    height: 20px;
    cursor: pointer
}

.ez-hide {
    opacity: 0;
    filter: alpha(opacity=0)
}

.ch-form .check-wrap {
    display: table-cell;
    vertical-align: middle;
    margin: 0 10px 0 0
}

.ch-form .f-row .check-wrap + .label {
    vertical-align: middle;
    display: table-cell;
    margin: 0;
    padding-left: 12px
}

.check-wrap {
    width: 25px;
    height: 25px;
    position: relative
}

.check-wrap input[type=checkbox] {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    opacity: 0;
    width: 32px;
    height: 30px;
    vertical-align: middle;
    display: block
}

.check-inp {
    width: 32px;
    height: 30px;
    border: 1px solid #a8abac;
    background: #fff;
    border-radius: 5px;
    display: inline-block
}

.check-inp:after, .check-inp:before {
    display: none;
    content: "";
    height: 5px;
    width: 19px;
    background: #a3c167;
    border-radius: 4px;
    position: absolute;
    bottom: 42%;
    left: 24%;
    -webkit-transform: rotate(-49deg);
    transform: rotate(-49deg)
}

.check-inp:before {
    left: 4px;
    bottom: 9px;
    width: 11px;
    -webkit-transform: rotate(49deg);
    transform: rotate(49deg);
    box-shadow: none
}

.check-wrap input:checked + .check-inp:after, .check-wrap input:checked + .check-inp:before {
    display: block
}

.ch-form .ff-submit {
    text-align: center;
    padding: 12px 0 0
}

.ch-form .ff-btn-submit {
    position: relative;
    left: -6px;
    font-size: 26px;
    color: #fff;
    : roboto-bold-webfont, sans-serif;
    text-align: center;
    padding: 0;
    border: 0;
    width: 181px;
    height: 60px;
    border-radius: 8px;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #fff;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzg3YjkwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ExZDkwYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+);
    background-image: -moz-linear-gradient(bottom, #87b900 0, #a1d90b 100%);
    background-image: -o-linear-gradient(bottom, #87b900 0, #a1d90b 100%);
    background-image: -webkit-linear-gradient(bottom, #87b900 0, #a1d90b 100%);
    background-image: linear-gradient(bottom, #87b900 0, #a1d90b 100%);
    box-shadow: 1px 1px #628e00;
    background-repeat: repeat;
    background-size: 100% 100%;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    transition: all .4s linear
}

.ie9 .ch-form .ff-btn-submit:hover {
    background: #87b900
}

#cse-search-box .ff-btn-submit {
    height: 46px
}

.ch-form .ff-btn-submit:hover {
    background-position: 0 -200%;
    background-size: 100% 200%
}

.ch-form .ff-info {
    text-align: center;
    font-size: 14px;
    color: #5a6063;
    padding: 15px 0 0
}

.ch-form .raq-note {
    font-size: 16px;
    : roboto-bold-webfont, sans-serif;
    color: #0a4f82;
    text-transform: none
}

.ch-contacts-details {
    float: right;
    width: 42.24489795918367%;
    margin-right: 11px
}

.contact-list {
    font-size: 17px;
    line-height: 24px;
    color: #5a6063;
    margin-bottom: 59px
}

.contact-list li {
    padding: 2px 60px 0 95px;
    position: relative;
    margin-bottom: 42px;
    min-height: 55px
}

.contact-list .phone {
    margin-bottom: 61px
}

.contact-list .addr:after {
    content: "";
    position: absolute;
    width: 83px;
    height: 82px;
    background: url("../image/tzz_ion-1.png") -137px -273px no-repeat;
    left: 0;
    top: 1px
}

.contact-list .phone:after {
    content: "";
    position: absolute;
    width: 83px;
    height: 83px;
    background: url("../image/tzz_ion-1.png") -230px -272px no-repeat;
    left: 0;
    top: -10px
}

.contact-list .fax:after {
    content: "";
    position: absolute;
    width: 83px;
    height: 82px;
    background: url("../image/tzz_ion-1.png") -321px -273px no-repeat;
    left: 0;
    top: -13px
}

.contact-list .title, .hiring-box .title {
    font-size: 28px;
    font-weight: 400;
    color: #0078ae;
    display: block;
    margin: 0 0 8px;
    : roboto-medium-webfont, sans-serif
}

.contact-list p {
    margin: 0 0 5px
}

.hiring-box {
    font-size: 17px;
    line-height: 24px;
    color: #5a6063;
    border-radius: 3px;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #fff;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .13);
    margin: 0 2px 0 4px;
    padding: 25px 33px 17px
}

.hiring-box .title {
    font-size: 21px;
    margin: 0 0 10px
}

.hiring-box p {
    line-height: 21px;
    margin: 0 0 10px
}

.arrow-link {
    font-size: 14px;
    color: #009ddc;
    display: inline-block;
    : roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    padding: 0 20px 0 0;
    position: relative;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.arrow-link:hover {
    color: #009DDC
}

.arrow-link:after {
    content: "Â»";
    position: absolute;
    right: 0;
    top: -6px;
    width: 12px;
    height: 10px;
    font: 26px/26px roboto-bold-webfont, sans-serif;
    -webkit-transition: right .2s linear;
    -moz-transition: right .2s linear;
    transition: right .2s linear
}

.arrow-link:hover:after {
    right: -3px
}

.map-holder {
    position: relative;
    height: 405px;
    overflow: hidden;
    width: 100% !important
}

.mc-data {
    position: relative;
    z-index: 100;
    text-align: center;
    width: 100%;
    height: 130px;
    font-size: 15px;
    color: #5a6063;
    line-height: 20px
}

.mc-data .title {
    font-size: 20px;
    font-weight: 400;
    color: #0078ae;
    display: block;
    margin: 0 0 8px
}

.mc-data p {
    margin: 0 0 15px
}

.mc-data .mc-arrow-link {
    font-size: 14px;
    color: #1ea7de;
    display: inline-block;
    vertical-align: top;
    : roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    position: relative;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.mc-data .mc-arrow-link:after {
    display: inline-block;
    vertical-align: top;
    content: "Â»";
    font: 25px/1 roboto-bold-webfont, sans-serif;
    margin: -5px 0 0 4px
}

.mc-data .mc-arrow-link:hover {
    color: #009DDC
}

#map img {
    max-width: none
}

.map-section {
    position: relative
}

.map-section .next-step {
    z-index: 2
}

.contact-holder .frame {
    background: url("../image/tzz_ion-1.png") 59.8% 0 no-repeat
}

.top-page-panel-visible {
    display: block !important
}

.what-you-get-section {
    background: #000;
    padding: 25px 0 10px;
    border-bottom: 1px solid #000
}

.what-you-get-section .frame {
    position: relative
}

.rq-logos-box {
    float: right;
    width: 32.44897959183673%;
    margin-right: 132px;
    padding: 20px 0 30px
}

.rq-logos-box img:not(:last-child) {
    display: block;
    margin: 0 0 42px
}

.tpp-arrow-text {
    font-size: 15px;
    padding: 4px 0 34px
}

.tpp-arrow-down {
    position: relative;
    display: inline-block;
    padding-right: 60px
}

.tpp-arrow-down:before {
    content: "";
    position: absolute;
    background: url("../image/tzz_ion-1.png") -688px -188px no-repeat;
    width: 59px;
    height: 26px;
    bottom: -1px;
    left: -71px
}

.rank-section {
    border-top: 1px solid #000;
    padding: 20px 0 100px;
    background: #000;
}

.rank-section .rs-box {
    margin-right: 104px;
    float: right;
    font-size: 17px;
    line-height: 21px;
    color: #5a6063;
    width: 35.69387755102041%
}

.rank-section .rs-box img {
    float: left;
    margin: 0 24px 0 0
}

.rank-section .rs-box p {
    overflow: hidden;
    padding: 42px 0 0
}

.rank-section .rs-box p span {
    font-weight: 700;
    color: #0078ae
}

.rank-section .rsb-phone {
    margin-top: 45px;
    font: 28px/48px roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #5a6063;
    position: relative;
    padding-left: 70px
}

.rank-section .rsb-phone:before {
    background: url("../image/tzz_ion-1.png") -414px -273px no-repeat;
    content: "";
    width: 52px;
    height: 51px;
    position: absolute;
    left: 0;
    top: 0
}

.wyg-form-box {
    border: 1px solid #dcd8d8;
    background: url("../image/tzz_ion-1.png");
    position: absolute;
    left: 13px;
    top: -55px;
    width: 48.87755102040816%;
    border-radius: 5px;
    padding: 39px 0 34px
}

.wyg-form-box .f-row {
    padding-left: 40px;
    margin-right: 33px
}

.wyg-form-box .ff-submit {
    position: absolute;
    bottom: -58px;
    left: 0;
    width: 100%;
    z-index: 2
}

.wyg-form-box .ff-submit input {
    left: 8px
}

.ds-row {
    margin: 0 0 60px
}

.mobile-samples, .responsive-samples {
    padding-bottom: 55px;
    z-index: 1
}

.mobile-samples .ds-row {
    margin: 0 0 5px
}

.responsive-samples .ds-row {
    margin: 0 0 30px
}

.ds-row .ds-col {
    margin-left: 2.653061224489796%;
    float: left;
    width: 48.46938775510204%
}

.ds-row .ds-col:first-child {
    margin-left: 0
}

.ds-row .ds-col img {
    max-width: 100%
}

.sp-block {
    display: block
}

.mobile-development-blog {
    padding-top: 0
}

.fancy-line {
    margin: 50px 0 45px;
    border-color: #d1d2d4;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 1)
}

.whitepapers-holder .wh-section-1 {
    border-bottom: 1px solid #dcdddd;
    padding: 22px 0 107px;
    background: url("../image/tzz_ion-1.png")
}

.whitepapers-holder .wh-section-3 {
    background: url("../image/tzz_ion-1.png");
    min-height: 171px;
    border-top: 1px solid #dcdddd
}

.webinar-section {
    min-height: 312px
}

.whitepapers-holder .wh-section-4 {
    border-top: 1px solid #dcdddd;
    padding: 50px 0 60px;
    background: url("../image/tzz_ion-1.png")
}

.wh-infobox {
    float: left;
    width: 47.44897959183673%
}

.whi-content {
    position: relative;
    float: left;
    color: #5a6063;
    font-size: 17px;
    line-height: 24px;
    width: 100%;
    margin-top: -77px
}

.wh-add .whi-content {
    margin-top: -124px
}

.whf-content p, .whi-content p {
    margin: 0 0 20px
}

.whf-content a, .whi-content a {
    color: #0078ae;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.whf-content a:hover, .whi-content a:hover {
    color: #009DDC
}

.wh-section-2 .wh-img {
    max-width: 100%;
    display: block;
    margin-bottom: 39px
}

.whf-content ul li, .whi-content ul li {
    padding: 0 0 19px 36px;
    position: relative
}

.whf-content ul li:before, .whi-content ul li:before {
    background: url("../image/tzz_ion-1.png") -23px -115px no-repeat;
    content: "";
    height: 17px;
    left: 1px;
    position: absolute;
    top: 4px;
    width: 21px
}

.wh-section-2 .frame {
    position: relative
}

.wh-form-holder {
    float: right;
    margin-right: 3px;
    width: 48.77551020408163%
}

.wh-add ::-webkit-input-placeholder {
    color: transparent
}

.wh-add ::-moz-placeholder {
    color: transparent;
    opacity: 0
}

.wh-form {
    width: 100%;
    float: right;
    margin-top: -69px
}

.wh-form-holder .ch-form {
    padding: 34px 33px 0 43px;
    background: url("../image/tzz_ion-1.png");
    position: relative;
    border-radius: 6px;
    box-shadow: 1px 1px 0 0 rgba(0, 0, 0, .18)
}

.wh-form-holder .ch-form .ff-submit {
    padding-top: 14px;
    padding-bottom: 17px
}

.wh-form-holder .ch-form .ff-submit input {
    width: 250px;
    left: 0
}

.wh-form-holder .whf-title {
    margin-bottom: 40px;
    text-align: center;
    color: #0078ae;
    text-shadow: 0 1px #fff;
    font-size: 20px;
    : roboto-bold-webfont, sans-serif
}

.wh-form-holder .whf-title span {
    display: block
}

.wh-form-holder .whf-title strong {
    font-size: 28px;
    display: block
}

.wh-form-holder .ch-form .f-row {
    padding-left: 0;
    padding-bottom: 20px
}

.whf-content {
    font-size: 17px;
    color: #5a6063;
    line-height: 24px;
    padding: 70px 0 0
}

.wh-presses {
    padding: 23px 0 10px 16px
}

.wh-press {
    background: url("../image/tzz_ion-1.png");
    float: left;
    border: 4px solid #fff;
    border-radius: 3px;
    width: 46.93877551020408%
}

.wh-press:last-child {
    float: right
}

.wh-press:first-child {
    float: left
}

.wh-press img {
    float: left;
    margin: 22px 21px 30px -31px;
    max-width: 49.55752212389381%
}

.wh-press .whp-content {
    overflow: hidden;
    color: #5a6063;
    font-size: 17px;
    line-height: 24px;
    padding: 25px 15px 12px 0
}

.whp-content h2 {
    color: #0078ae;
    font-size: 22px;
    line-height: 27px;
    margin: 0 0 23px;
    text-shadow: 0 1px #fff;
    : roboto-bold-webfont, sans-serif
}

.whp-content h2 a {
    color: #0078ae;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.whp-content h2 a:hover {
    color: #009DDC
}

.whp-content p {
    margin: 0 0 17px
}

.whp-content .link-download {
    display: inline-block;
    color: #009ddc;
    font-size: 16px;
    text-shadow: 0 1px #fff;
    text-transform: uppercase;
    : roboto-bold-webfont, sans-serif;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.whp-content .link-download:after {
    display: inline-block;
    vertical-align: top;
    content: "Â»";
    margin: -5px 3px 0 7px;
    font: 28px/1 roboto-bold-webfont, sans-serif;
    text-shadow: 0 1px #fff;
    position: relative;
    left: 0;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out
}

.whp-content .link-download:hover:after {
    left: 3px
}

.whp-content .link-download:hover {
    color: #009DDC
}

.wh-top {
    padding: 3px 0 0;
    float: left;
    width: 47.44897959183673%
}

.wh-top .page-intro-title {
    padding: 0;
    line-height: 45px;
    margin-bottom: 20px
}

.wh-date {
    font-size: 28px;
    color: #5a6063;
    display: block;
    : roboto-light-webfont, sans-serif
}

.wh-time {
    font-size: 17px;
    color: #009ddc;
    display: block;
    : roboto-bold-webfont, sans-serif
}

.webinars-holder .wh-section-2 {
    padding-bottom: 105px;
    background: #fff
}

.webinars-holder .wh-form {
    margin-top: -266px
}

.webinars-holder .wh-form .ch-form {
    box-shadow: none;
    position: relative;
    background: url("../image/tzz_ion-1.png");
    padding-bottom: 1px
}

.webinars-holder .wh-form .f-row {
    padding-bottom: 26px
}

.webinars-holder .whf-title {
    color: #fff;
    padding: 6px 0 0
}

.webinars-holder .whf-title span {
    font-size: 35px;
    : roboto-light-webfont, sans-serif;
    text-shadow: none
}

.webinars-holder .whf-title strong {
    font-size: 50px;
    margin-top: -12px;
    font-weight: 400;
    : roboto-bold-webfont, sans-serif
}

.webinars-holder .ch-form .ff-input .required, .webinars-holder .fancy-form .f-add-field span.required {
    background-position: -32px -297px
}

.webinars-holder .wh-form-holder .whi-content {
    margin: 0;
    display: none;
    padding: 30px 26px 0
}

.whf-content .visible-for-mobile {
    display: none
}

.add-mobile-navigation {
    display: none;
    text-align: center
}

.archive-block .section-title h2 {
    font-size: 46px
}

.upcoming-webinars {
    padding-top: 30px;
    border-top: 1px solid #DCDDDD
}

.webinar-list {
    width: 100%
}

.webinar-archive-item {
    display: inline-block;
    vertical-align: top;
    width: 33%;
    padding: 0 10px 30px;
    text-align: center
}

.webinar-archive-thumb {
    position: relative;
    display: block;
    margin: 0 auto 10px;
    width: 228px;
    height: 120px;
    border: 3px solid #0078ae;
    border-radius: 3px;
    background: #fff
}

.webinar-archive-thumb:before {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -32px;
    margin-left: -32px;
    width: 64px;
    height: 64px;
    content: "";
    z-index: 10;
    background: url("../image/tzz_ion-1.png") no-repeat;
    opacity: 1;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.webinar-archive-thumb:hover:before {
    opacity: 0
}

.webinar-archive-thumb:after {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -32px;
    margin-left: -32px;
    width: 64px;
    height: 64px;
    content: "";
    z-index: 20;
    background: url("../image/tzz_ion-1.png") 0 -64px no-repeat;
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.webinar-archive-thumb:hover:after {
    opacity: 1
}

.webinar-archive-thumb img {
    display: block;
    margin: 0 auto
}

.webinar-archive-item h3 {
    color: #0078ae;
    font: 18px/1.1 roboto-bold-webfont, sans-serif;
    margin: 0 0 8px
}

.webinar-archive-item h3 a {
    color: #0078ae
}

.webinar-archive-item h3 a:hover {
    color: #009DDC
}

.webinar-archive-item .sample-date {
    display: block;
    margin: 0 0 5px;
    color: #5a6063;
    font-style: italic
}

.whitepapers-holder .webinar-details {
    color: #5A6063;
    padding-bottom: 50px
}

.wh-breadcrumbs {
    padding: 0 0 35px
}

.wh-breadcrumbs li {
    display: inline-block;
    vertical-align: top;
    font-size: 13px;
    margin: 0 10px 0 0
}

.wh-breadcrumbs a {
    font-weight: 700
}

.wh-breadcrumbs li:before {
    display: inline-block;
    content: "Â»";
    font-size: 15px;
    line-height: 1.1;
    margin: 0 10px 0 0
}

.wh-breadcrumbs li:first-child:before {
    display: none
}

.title-detail {
    text-align: center
}

.webinar-details .page-intro-title {
    padding-right: 0
}

.web-full-post {
    padding: 25px 0 0
}

.web-description {
    font-size: 15px;
    line-height: 1.6
}

.web-description p, .web-description ul {
    margin: 0 0 20px
}

.top-page-panel .tpp-narrow-nav li {
    min-width: 142px
}

.page-intro-about {
    text-align: center;
    color: #0078ae;
    padding: 38px 0 18px;
    margin-bottom: 10px
}

.about-wide-section {
    position: relative;
    padding: 42px 0 112px
}

.about-first-section {
    padding-top: 0
}

.about-wide-section .next-step {
    border: 8px solid #f0f0f0
}

.about-wide-section .next-step:after {
    background: url("../image/tzz_ion-1.jpg")
}

.about-marked-section {
    background: url("../image/tzz_ion-1.png")
}

.about-marked-section .next-step {
    border-color: #F7F7F7
}

.about-marked-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.branches-items {
    display: table;
    width: 100%
}

.branch-item {
    display: table-cell;
    vertical-align: top;
    width: 50%;
    padding: 0 30px;
    text-align: center;
    font-size: 17px;
    line-height: 1.5;
    color: #5a6063
}

.branch-img {
    position: relative;
    margin: 0 0 32px;
    font-size: 0;
    line-height: 0
}

.branch-img:after {
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -190px;
    width: 380px;
    height: 14px;
    z-index: 10;
    content: "";
    background: url("../image/tzz_ion-1.png") no-repeat
}

.branch-item-dif .branch-img:after {
    display: none
}

.branch-item h2 {
    font: 57px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 26px
}

.branch-item-dif h2 {
    font-size: 46px
}

.branch-item h2 span {
    : roboto-black-webfont, sans-serif
}

.branch-item h2 a {
    color: #0078ae;
    -webkit-transition: color .3s linear;
    -moz-transition: color .3s linear;
    transition: color .3s linear
}

.branch-item h2 a:hover {
    color: #009DDC
}

.branch-item p {
    margin: 0 0 22px
}

.btn-simple-blue2 {
    box-shadow: 0 -1px 0 #6cc7eb, 0 1px 0 #005964;
    text-shadow: 0 -1px 0 #328156;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwOWNkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDc5YWYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 0 0/100% 100%;
    background: -moz-linear-gradient(top, rgba(0, 156, 219, 1) 0, rgba(0, 121, 175, 1) 100%) 0 0/100% 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 156, 219, 1)), color-stop(100%, rgba(0, 121, 175, 1))) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, rgba(0, 156, 219, 1) 0, rgba(0, 121, 175, 1) 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, rgba(0, 156, 219, 1) 0, rgba(0, 121, 175, 1) 100%) 0 0/100% 100%
}

.ie9 .btn-simple-blue2:hover {
    background: rgba(0, 156, 219, 1)
}

.certify-section4 {
    padding-top: 107px
}

.certify-section4 .next-step {
    border-color: #F7F7F7
}

.certify-section4 .next-step-v8-bd {
    border: 8px solid #005F8B;
    box-shadow: 0 1px 0 #FFF
}

.page-intro-center {
    text-align: center;
    padding: 36px 34px 25px;
    font-size: 15px;
    line-height: 1.5;
    color: #5a6063
}

.page-intro-center-alt {
    padding-left: 0;
    padding-right: 0;
    font-size: 17px
}

.da-section .page-intro-center h3.pic-title, .page-intro-center h2, .page-intro-center-holder h1, .page-intro-center-holder h2.main-title {
    font: 50px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 20px
}

.page-intro-center-holder.top-digital h2.main-title {
    font-size: 60px;
    line-height: 1;
    padding-bottom: 30px
}

.page-intro-center-alt h2.main-title {
    color: #5a6063
}

.da-section .page-intro-center h3.pic-title span, .page-intro-center .pic-sub-title span, .page-intro-center h2 span, .page-intro-center-holder h1 span, .page-intro-center-holder h2.main-title span {
    : roboto-bold-webfont, sans-serif
}

.page-intro-center .pic-sub-title, .page-intro-center h3, .page-intro-center-holder h2 {
    font: 24px/1.3 roboto-light-webfont, sans-serif;
    color: #5a6063;
    margin: 0 0 20px
}

.page-intro-center-alt h2.main-title span {
    color: #009ddc
}

.paging-basic {
    background: #fff;
    padding: 18px 0;
    text-align: center;
    position: relative
}

.paging-basic:before {
    position: absolute;
    width: 100%;
    height: 6px;
    top: -6px;
    left: 0;
    content: "";
    background: url("../image/tzz_ion-1.png") repeat-x
}

.paging-inline a {
    display: inline-block;
    vertical-align: middle;
    width: 37px;
    height: 37px;
    font: 16px/37px roboto-medium-webfont, sans-serif;
    color: #0078ae;
    margin: 0 3px 3px;
    background: url("../image/tzz_ion-1.png") -90px -64px no-repeat
}

.paging-inline .active, .paging-inline a:hover {
    color: #fff;
    background-position: -127px -64px
}

.paging-inline .pag-next-link, .paging-inline .pag-prev-link {
    height: auto;
    width: auto;
    font-size: 14px;
    color: #009ddc;
    background: 0 0;
    text-transform: uppercase;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.paging-inline .pag-prev-link {
    float: left
}

.paging-inline .pag-next-link {
    float: right
}

.paging-inline .pag-next-link:after, .paging-inline .pag-prev-link:before {
    font: 25px/25px roboto-black-webfont, sans-serif;
    display: inline-block;
    vertical-align: middle;
    margin: -9px 4px 0 0;
    content: "Â«";
    position: relative;
    left: 0;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out
}

.paging-inline .pag-next-link:after {
    margin-left: 4px;
    margin-right: 0;
    content: "Â»"
}

.paging-inline .pag-prev-link:hover:before {
    left: -3px
}

.paging-inline .pag-next-link:hover:after {
    left: 3px
}

.paging-inline .pag-next-link:hover, .paging-inline .pag-prev-link:hover {
    color: #009DDC
}

.page-intro-details {
    padding-top: 0
}

.page-intro-center p a {
    font-weight: 700;
    color: #0078ae;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.page-intro-center p a:hover {
    color: #009DDC
}

.details-columns {
    display: table;
    width: 100%
}

.detail-column {
    display: table-cell;
    vertical-align: top;
    width: 50%;
    padding: 0 0 0 13px;
    font-size: 17px;
    line-height: 1.6;
    color: #5a6063
}

.detail-column:first-child {
    padding-left: 0;
    padding-right: 13px
}

.detail-column p {
    margin: 0 0 34px
}

.details-sub-panel {
    text-align: center;
    padding: 0 0 50px
}

.about-main-logo {
    box-shadow: 1px 1px 2px 0 #a5a5a5
}

.wide-logos-section {
    margin-top: 84px;
    padding-top: 118px
}

.dif-logos-list li {
    display: inline-block;
    vertical-align: top;
    width: 23.5%;
    height: 238px;
    line-height: 238px;
    margin: 0 4px 10px;
    background: #fff;
    box-shadow: 1px 1px 1px 0 #c4c4c4;
    border-radius: 3px;
    text-align: center;
    position: relative
}

.dif-logos-list img {
    vertical-align: middle;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.in-the-news-parent {
    padding-top: 76px
}

.pi-left-col {
    float: left;
    width: 60%;
    text-align: left
}

.rounded-box {
    float: right;
    width: 280px;
    height: 280px;
    padding: 82px 13px 10px;
    background: #fff;
    border-radius: 138px;
    box-shadow: 0 2px 9px rgba(0, 0, 0, .06)
}

.rounded-box h3 {
    font: 700 20px/1.1 Arial, Helvetica, sans-serif;
    color: #0078ae;
    margin: 0 0 3px
}

.rounded-box p {
    margin: 0 0 12px
}

.rounded-box .view-more {
    color: #009ddc;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.rounded-box .view-more:hover {
    color: #009DDC
}

.employ-wide-section {
    background: -moz-linear-gradient(top, rgba(241, 241, 241, 0) 0, rgba(241, 241, 241, .8) 1%, rgba(241, 241, 241, 1) 2%, rgba(241, 241, 241, 1) 50%, rgba(241, 241, 241, 1) 98%, rgba(241, 241, 241, .8) 99%, rgba(241, 241, 241, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(241, 241, 241, 0)), color-stop(1%, rgba(241, 241, 241, .8)), color-stop(2%, rgba(241, 241, 241, 1)), color-stop(50%, rgba(241, 241, 241, 1)), color-stop(98%, rgba(241, 241, 241, 1)), color-stop(99%, rgba(241, 241, 241, .8)), color-stop(100%, rgba(241, 241, 241, 0)));
    background: -webkit-linear-gradient(top, rgba(241, 241, 241, 0) 0, rgba(241, 241, 241, .8) 1%, rgba(241, 241, 241, 1) 2%, rgba(241, 241, 241, 1) 50%, rgba(241, 241, 241, 1) 98%, rgba(241, 241, 241, .8) 99%, rgba(241, 241, 241, 0) 100%);
    background: -o-linear-gradient(top, rgba(241, 241, 241, 0) 0, rgba(241, 241, 241, .8) 1%, rgba(241, 241, 241, 1) 2%, rgba(241, 241, 241, 1) 50%, rgba(241, 241, 241, 1) 98%, rgba(241, 241, 241, .8) 99%, rgba(241, 241, 241, 0) 100%);
    background: -ms-linear-gradient(top, rgba(241, 241, 241, 0) 0, rgba(241, 241, 241, .8) 1%, rgba(241, 241, 241, 1) 2%, rgba(241, 241, 241, 1) 50%, rgba(241, 241, 241, 1) 98%, rgba(241, 241, 241, .8) 99%, rgba(241, 241, 241, 0) 100%);
    background: linear-gradient(to bottom, rgba(241, 241, 241, 0) 0, rgba(241, 241, 241, .8) 1%, rgba(241, 241, 241, 1) 2%, rgba(241, 241, 241, 1) 50%, rgba(241, 241, 241, 1) 98%, rgba(241, 241, 241, .8) 99%, rgba(241, 241, 241, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00f1f1f1', endColorstr='#00f1f1f1', GradientType=0)
}

.employ-block {
    padding: 24px 0 0;
    position: relative
}

.employ-bar {
    margin: 0 0 15px
}

.employ-bar.fix {
    background: #fff;
    box-shadow: 1px 1px 2px 0 #afafaf;
    padding: 0 0 20px;
    z-index: 9999
}

.employ-nav {
    text-align: center;
    padding: 0 0 15px
}

.employ-nav li {
    display: inline-block;
    vertical-align: top;
    box-shadow: 1px 1px 0 0 #afafaf;
    margin: 0 0 10px 1px
}

.employ-nav li:first-child {
    margin-left: 0
}

.employ-nav a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    height: 52px;
    padding: 0 10px;
    background: #fff;
    color: #0076ae;
    font: 700 14px/1.1 Arial, Helvetica, sans-serif;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.employ-nav .active a, .employ-nav a:hover {
    background: #009ddc;
    color: #fff
}

.switch-section {
    text-align: center
}

.switch-section li {
    display: inline-block;
    vertical-align: top;
    margin: 0 28px 0 0
}

.switch-section strong {
    float: left;
    font: 700 14px/1.1 Arial, Helvetica, sans-serif;
    color: #0076ae;
    margin: 7px 15px 0 0
}

.switch-section .btns {
    float: left
}

.switch-section a {
    float: left;
    width: 58px;
    height: 33px;
    font-size: 0;
    line-height: 0;
    color: transparent;
    position: relative;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.switch-section a:after, .switch-section a:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 58px;
    height: 33px;
    font: 14px/33px roboto-black-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    text-shadow: 0 -1px 0 #016898;
    text-align: center;
    opacity: 1
}

.switch-section a:hover:after, .switch-section a:hover:before {
    webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    transition: opacity .3s
}

.switch-section a:after {
    opacity: 0;
    z-index: 2
}

.switch-section a:hover:after {
    opacity: 1
}

a.switch-on:before {
    background: url("../image/tzz_ion-1.png") no-repeat
}

a.switch-on:after {
    background: url("../image/tzz_ion-1.png") 0 -34px no-repeat
}

a.switch-off:before {
    background: url("../image/tzz_ion-1.png") -58px -34px no-repeat
}

a.switch-off:hover {
    cursor: default
}

.party-on .party-btns a.switch-on:after, .title-mode-on .title-btns a.switch-on:after {
    opacity: 1;
    cursor: default
}

.party-on .party-btns a.switch-off:before, .title-mode-on .title-btns a.switch-off:before {
    background: url("../image/tzz_ion-1.png") -58px 0 no-repeat
}

.party-on .party-btns a.switch-off:after, .title-mode-on .title-btns a.switch-off:after {
    background: url("../image/tzz_ion-1.png") -58px -34px no-repeat
}

.party-on .party-btns a.switch-off:hover, .title-mode-on .title-btns a.switch-off:hover {
    cursor: pointer
}

.member-item {
    display: inline-block;
    vertical-align: top;
    margin: 0 0 20px;
    padding: 0 22px 13px;
    width: 33%;
    height: 397px;
    text-align: center;
    overflow: hidden;
    position: relative;
    -webkit-transition: border-color .3s ease-out, border-color .3s ease-out;
    -moz-transition: border-color .3s ease-out, border-color .3s ease-out;
    transition: border-color .3s ease-out, border-color .3s ease-out
}

.member-item:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -146px;
    width: 292px;
    height: 13px;
    content: "";
    background: url("../image/tzz_ion-1.png") no-repeat
}

.member-photo {
    height: 384px;
    line-height: 384px
}

.member-photo .photo {
    vertical-align: bottom
}

.member-descript {
    position: absolute;
    left: 22px;
    bottom: 13px;
    width: 100%;
    max-width: 290px;
    background: #fff;
    border: 1px solid #d9dadc;
    border-radius: 2px;
    padding: 9px 8px 11px;
    text-align: center;
    font: 13px/1.1 roboto-medium-webfont, sans-serif;
    color: #3e3e3e;
    opacity: 0;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out
}

.member-item:hover .member-descript, .title-mode-on .member-descript {
    opacity: 1
}

.member-descript strong {
    display: block;
    margin: 0 0 3px;
    font: 18px/1.1 roboto-bold-webfont, sans-serif;
    color: #0078ae
}

.photo-party-mode {
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -webkit-transition: opacity .5s ease-in-out
}

.party-on .photo-basic-mode {
    display: none
}

.party-on .photo-party-mode {
    visibility: visible;
    position: static;
    opacity: 1
}

.float-panel {
    position: fixed;
    top: 300px;
    width: 70px;
    padding: 34px 0 0;
    background: #fff;
    border-radius: 0 3px 3px 0;
    box-shadow: 1px 0 3px rgba(0, 0, 0, .18);
    z-index: 5
}

.fp-socials {
    padding: 0 0 9px
}

.fp-socials li {
    padding: 0 5px 17px
}

.fp-socials img {
    font-size: 0;
    line-height: 0
}

.go-top {
    display: block;
    width: 70px;
    height: 92px;
    padding: 58px 5px 5px;
    background: #0087bd;
    box-shadow: 1px 0 1px #6cc5ee;
    border: 1px solid #006f9c;
    border-width: 0 1px 1px;
    border-radius: 0 3px 3px 0;
    text-align: center;
    color: #fff;
    text-shadow: 0 -1px 0 #005c83;
    text-transform: uppercase;
    font: 15px/1.1 roboto-bold-webfont, sans-serif;
    position: relative;
    -webkit-transition: all .3s ease-out, all .3s ease-out;
    -moz-transition: all .3s ease-out, all .3s ease-out;
    transition: all .3s ease-out, all .3s ease-out
}

.go-top:hover {
    color: #fff;
    background: #08668c
}

.go-top:before {
    position: absolute;
    top: 16px;
    left: 16px;
    width: 36px;
    height: 34px;
    content: "";
    background: url("../image/tzz_ion-1.png") -164px -64px no-repeat
}

.intro-sample-image {
    float: right;
    margin: 0 0 70px 38px
}

.pi-left-text {
    padding-top: 38px;
    text-align: left;
    font-size: 17px;
    line-height: 1.8
}

.pi-left-text p {
    margin: 0 0 30px
}

.ts-subtext {
    font: 28px/1.2 roboto-light-webfont, sans-serif;
    color: #5a5f62
}

.text-section-narrow p {
    padding-left: 13%;
    padding-right: 13%
}

.languages-box {
    text-align: center;
    padding: 26px 15px 16px;
    margin: 0 0 30px
}

.hobbies-box h3, .languages-box h3 {
    font-size: 36px;
    line-height: 1.1
}

.hobbies-box {
    margin: 0 0 15px
}

.icons-special-list {
    text-align: center
}

.icons-special-list li {
    display: inline-block;
    vertical-align: bottom;
    margin: 0 7px 12px
}

.icons-special-list img {
    margin: 0 0 10px
}

.hobbies-box .icons-special-list img {
    margin-bottom: 2px
}

.icons-special-list span {
    display: block;
    clear: both;
    font: 17px/1 roboto-medium-webfont, sans-serif;
    color: #5a6063
}

.sample-sec-text {
    font-size: 17px;
    line-height: 1.6;
    color: #5a6063
}

.sample-sec-text p {
    margin: 0 0 34px
}

.sample-right-img {
    float: right;
    margin: 0 0 30px 34px
}

.certify-section-5 {
    padding-top: 90px;
    border-top: 1px solid #fff;
    background: url("../image/tzz_ion-1.png")
}

.certify-section-5 .next-step {
    border-color: #f3f3f3
}

.certify-section-5 .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.page-intro-narrow {
    padding-left: 8%;
    padding-right: 8%
}

.clients-list-section {
    padding-top: 105px;
    margin-top: 70px
}

.all-testimonials {
    padding-top: 50px;
    padding-bottom: 50px
}

.all-testimonials .frame {
    max-width: 930px
}

.at-item {
    display: inline-block;
    vertical-align: top;
    width: 47%;
    margin: 0;
    position: relative
}

.at-item:nth-child(2n) {
    margin-left: 50px
}

.at-item .occc-column {
    width: 100%;
    max-width: 322px;
    float: none;
    margin: 0 auto
}

.at-item .occc-column .client-logo {
    margin-top: 16px;
    margin-bottom: 20px
}

.at-item .testimonial {
    width: 100%;
    max-width: 435px;
    float: none
}

.at-item .ti-content {
    min-height: 252px
}

.at-item .view-more, .re-collapse a {
    font-size: 15px;
    vertical-align: bottom;
    text-transform: none;
    color: #009ddc;
    margin-left: 4px
}

.at-item .view-more:hover, .re-collapse a:hover {
    color: #009DDC
}

.industries-intro-block {
    border: 0
}

.industries-intro-block:after {
    display: none
}

.industries-intro-block h3 {
    font: 28px roboto-light-webfont, sans-serif;
    margin: 0 0 24px;
    padding-right: 52%
}

.industries-intro-block p {
    font: 15px/1.5 Arial, Helvetica, sans-serif
}

.industries-intro-block .intro-fl-image {
    margin-top: -130px
}

.industries-inner-wrapper {
    background: 0 0;
    padding-top: 0;
    padding-bottom: 130px
}

.testimonial-row {
    padding: 30px 0
}

.testimonial-row:first-child {
    padding-top: 0
}

.testimonial-hidden-row {
    overflow: hidden;
    height: 0;
    display: none
}

.testimonial-hidden-row-frame {
    position: relative;
    color: #fff;
    padding: 52px 0 62px;
    background: url("../image/tzz_ion-1.png");
    box-shadow: inset 0 0 8px #0a0b0d, inset 0 -2px 8px #0a0b0d
}

.testimonial-hidden-row .tr-item, .testimonial-row .tr-item {
    display: none
}

.testimonial-active-row {
    display: block
}

.demo-video-box .ec-video-box, .expanded-mode .ec-video-box, .testimonial-hidden-row .frame {
    max-width: 980px;
    padding-left: 20px;
    padding-right: 20px;
    position: relative
}

.testimonial-hidden-row h4 {
    color: #fff;
    font: 57px/1 roboto-light-webfont, sans-serif;
    margin: 0 0 28px
}

.testim-video-holder {
    max-width: 940px;
    padding: 12px;
    background: #1E2227;
    border: 1px solid #262b31;
    box-shadow: inset -1px -1px 0 #0f1418, -1px -1px 0 #0f1418;
    border-radius: 3px
}

.testim-video-holder .single-video-box {
    max-width: 940px
}

.at-item-active {
    padding-bottom: 20px
}

.at-item-active:after, .occc-column-active:after {
    background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
    width: 21px;
    height: 11px;
    position: absolute;
    bottom: 0;
    left: 50%;
    content: "";
    margin-left: -13px
}

.intro-fl-image2 {
    margin-top: -15px
}

.fancy-list-two li {
    display: inline-block;
    vertical-align: top;
    width: 48%
}

.fancy-list-two .fl-item {
    width: 100%;
    padding-right: 5px
}

.ow-items-diff-sizes {
    text-align: center
}

.ow-items-diff-sizes .ow-item {
    position: relative;
    height: 240px;
    width: 314px;
    margin-bottom: 60px
}

.ow-items-diff-sizes .ow-item > a {
    display: block;
    height: 240px
}

.ow-items-diff-sizes .ow-item img {
    position: absolute;
    right: 0;
    bottom: 0;
    max-width: 334px
}

.ow-items-diff-sizes .ow-item:first-child img {
    bottom: -14px
}

.ow-items-diff-sizes .ow-item:nth-child(8) img {
    bottom: -12px
}

.text-section-pd {
    padding-top: 0
}

.text-section-pd p {
    padding-left: 5%;
    padding-right: 5%
}

.text-section-pd .blue-middle-box {
    margin-bottom: 30px
}

.simple-header {
    padding-bottom: 31px
}

.simple-header .sh-hide {
    display: none
}

.simple-header .head-r-side {
    padding-top: 25px
}

.simple-header .separate-border {
    margin-top: 1px
}

.simple-header .addr {
    color: #5A6063;
    display: inline-block;
    vertical-align: middle;
    margin: -4px 0 0;
    padding-right: 4px;
    font: bold 16px/22px roboto-bold-webfont, arial, sans-serif
}

.simple-header .addr span {
    color: #a1a1a1;
    font-size: 14px;
    : roboto-light-webfont, sans-serif
}

.center-text-section {
    font-size: 15px;
    line-height: 24px;
    padding-bottom: 100px
}

.sample-text-section .st-add-section .st-column {
    font-size: 18px;
    line-height: 24px
}

.sample-text-section .st-add-section h3 {
    font-size: 36px;
    margin-bottom: 12px
}

.two-col-list {
    margin: 0 0 30px
}

.two-col-list ul {
    margin: 0 0 25px;
    font-size: 17px
}

.two-col-list ul li {
    display: inline-block;
    vertical-align: top;
    text-align: right;
    margin-bottom: 2px;
    width: 49%
}

.two-col-list ul li:nth-child(odd) {
    text-align: left
}

.two-col-list ul a {
    color: #0078AE
}

.two-col-list .link-apply {
    font-size: 14px;
    color: #009ddc;
    display: inline-block;
    font-weight: 700
}

.two-col-list .link-apply:after {
    content: "Â»";
    font: 24px/14px roboto-black-webfont, Arial, sans-serif;
    padding-left: 5px;
    vertical-align: -2px;
    position: relative;
    left: 0;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out
}

.two-col-list .link-apply:hover:after {
    left: 3px
}

.jufh-box {
    margin: 0 auto;
    width: 80.10204081632653%;
    position: relative
}

.join-us-form-holder {
    padding: 80px 0 100px;
    position: relative
}

.join-us-form-holder .jb-1 {
    background: #fefefe;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .28);
    padding: 40px 65px 27px 80px;
    position: relative
}

.join-us-form-holder .jb-2 {
    background: #fefefe;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .28);
    padding: 40px 65px 45px 80px
}

.join-us-form-holder .ac {
    text-align: center
}

.join-us-form-holder .jb-1 .fl {
    float: left;
    width: 47.03125%
}

.join-us-form-holder .jb-1 .fr {
    float: right;
    width: 47.03125%
}

.join-us-form-holder h2 {
    font-size: 24px;
    color: #0078ae;
    margin: 0 0 20px;
    : roboto-medium-webfont, sans-serif
}

.join-us-form-holder .ff-checkbox label {
    float: none;
    width: auto
}

.join-us-form-holder .ff-checkbox label span {
    padding-top: 4px;
    font-size: 12px;
    color: #878a8c
}

.join-us-form-holder .ch-form .f-row, .join-us-form-holder .ff-checkbox label {
    padding-left: 0;
    padding-right: 0
}

.join-us-form-holder .ch-form .ff-input {
    border-radius: 18px;
    box-shadow: inset 1px 1px 3px rgba(145, 145, 145, .46);
    border: 1px solid #d9d9d9;
    background: #fff;
    background: -webkit-linear-gradient(bottom, #f6f6f6, #fff) #fff;
    background: -moz-linear-gradient(bottom, #f6f6f6, #fff) #fff;
    background: -o-linear-gradient(bottom, #f6f6f6, #fff) #fff;
    background: linear-gradient(to top, #f6f6f6, #fff) #fff
}

.join-us-form-holder .form-alt-shape .ff-input {
    border-radius: 9px;
    border-color: transparent
}

.join-us-form-holder .ch-form .ff-input input {
    height: 37px;
    font-size: 14px;
    color: #878a8c;
    font-style: italic;
    : Arial, sans-serif;
    padding: 0 24px;
    box-shadow: inset 1px 1px 3px #858585;
    border: 1px solid #c1c1c1;
    background: #fff;
    background: -webkit-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: -moz-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: -o-linear-gradient(bottom, #fbfbfb, #fff) #fff;
    background: linear-gradient(to top, #fbfbfb, #fff) #fff;
    border-radius: 20px
}

.join-us-form-holder .form-alt-shape .ff-input input {
    border-radius: 7px
}

.join-us-form-holder .form-alt-shape .field-error .ff-input {
    border: 2px solid transparent
}

.join-us-form-holder .ch-form .ff-input.focused, .join-us-form-holder .ch-form .ff-input:hover, .join-us-form-holder .form-alt-shape .field-error .ff-input.focused, .join-us-form-holder .form-alt-shape .field-error .ff-input:hover {
    box-shadow: inset 1px 1px 3px #858585;
    border: 2px solid #aad15a;
    background-image: -webkit-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: -moz-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: -o-linear-gradient(bottom, #fbfbfb, #fff);
    background-image: linear-gradient(to top, #fbfbfb, #fff)
}

.join-us-form-holder .ch-form .ff-input.focused input, .join-us-form-holder .ch-form .ff-input:hover input {
    height: 35px;
    padding: 0 23px
}

.join-us-form-holder .form-alt-shape .field-error .ff-input.focused input, .join-us-form-holder .form-alt-shape .field-error .ff-input:hover input {
    height: 37px
}

.join-us-form-holder .form-bold-text {
    padding: 19px 0 12px;
    display: block;
    font-size: 16px;
    color: #73787a;
    font-weight: 400;
    : roboto-bold-webfont, sans-serif
}

.join-us-form-holder .form-bold-text span {
    font-size: 14px;
    : roboto-medium-webfont, sans-serif
}

.developer-container {
    clear: both;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px;
    width: 100%;
    overflow: hidden
}

.developer-container h3 {
    font: 20px roboto-light-webfont, sans-serif;
    margin: 0 0 15px
}

.developer-container pre {
    margin-bottom: 15px
}

.developer-container textarea {
    width: 100%;
    height: 200px;
    padding: 16px 24px 16px 18px;
    border-radius: 10px;
    border: 1px solid #ccc
}

.upload-row {
    height: 39px;
    border-radius: 18px;
    box-shadow: inset 1px 1px 3px rgba(145, 145, 145, .46);
    border: 1px solid #d9d9d9;
    background: #fff;
    background: -moz-linear-gradient(bottom, #f6f6f6, #fff) #fff;
    background: -o-linear-gradient(bottom, #f6f6f6, #fff) #fff;
    background: linear-gradient(to top, #f6f6f6, #fff) #fff;
    margin-bottom: 12px
}

.form-alt-shape .upload-row {
    border-radius: 7px
}

.upload-row .citf-active {
    background: none !important;
    height: 39px
}

.upload-row .citf-active .citfValOutput {
    height: 39px !important;
    line-height: 39px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    font-size: 14px;
    font-style: italic;
    color: #878a8c
}

.upload-row .citfButton {
    width: 83px !important;
    height: 30px !important;
    line-height: 30px !important;
    right: 6px !important;
    top: 4px !important
}

.upload-row .citf-active .citfBtnOutput {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwOWRkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzMzYzVmZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+);
    background-image: -moz-linear-gradient(bottom, #009ddd 0, #33c5fd 100%);
    background-image: -o-linear-gradient(bottom, #009ddd 0, #33c5fd 100%);
    background-image: -webkit-linear-gradient(bottom, #009ddd 0, #33c5fd 100%);
    background-image: linear-gradient(bottom, #009ddd 0, #33c5fd 100%);
    width: 83px !important;
    height: 30px !important;
    line-height: 30px !important;
    right: 6px !important;
    top: 4px !important;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
    color: #fff
}

.form-alt-shape .upload-row .citf-active .citfBtnOutput {
    border-radius: 7px;
    top: 0 !important;
    right: 0 !important;
    width: 90px !important;
    height: 37px !important;
    font: 14px/37px roboto-bold-webfont, sans-serif !important;
    text-shadow: 0 -1px 0 #1288b6
}

.join-us-form-holder .ff-btn-submit {
    position: absolute;
    left: 50%;
    margin-left: -104px;
    bottom: -23px
}

.link-add-files {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    color: #0078ae;
    padding: 3px 0 3px 26px;
    background: url("../image/tzz_ion-1.png") no-repeat;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.link-add-files:hover {
    color: #009DDC
}

.upload-row-hidden {
    display: none
}

.video-production-section .ow-item {
    margin-right: 14px
}

.ie9 .video-production-section .ow-item {
    margin-right: 12px
}

.video-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 97px;
    height: 97px
}

.wide-video-holder .video-overlay {
    z-index: 6;
    width: 154px;
    height: 154px
}

.video-overlay:before {
    position: absolute;
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 97px;
    height: 97px;
    top: 0;
    left: 0;
    content: "";
    z-index: 1;
    webkit-transition: opacity .4s;
    -moz-transition: opacity .4s;
    transition: opacity .4s
}

.wide-video-holder .video-overlay:before {
    width: 154px;
    height: 154px;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.wide-video-holder:hover .video-overlay:before, a:hover .video-overlay:before {
    opacity: 0
}

.video-overlay:after {
    position: absolute;
    background: url("../image/tzz_ion-1.png") left bottom no-repeat;
    width: 97px;
    height: 97px;
    left: 0;
    top: 0;
    content: "";
    z-index: 2;
    opacity: 0;
    webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    transition: opacity .3s
}

.wide-video-holder .video-overlay:after {
    width: 154px;
    height: 154px;
    background: url("../image/tzz_ion-1.png") 0 -154px no-repeat
}

.wide-video-holder:hover .video-overlay:after, a:hover .video-overlay:after {
    opacity: 1
}

.no-padding-section {
    padding-top: 0 !important
}

.no-margin-section {
    margin-top: 0 !important
}

.st-column .fancy-list {
    line-height: 21px
}

.video-section {
    padding: 45px 0 0
}

.vs-holder {
    padding: 10px 0 0
}

.vs-holder-ib {
    font-size: 0
}

.vs-holder .vsh-box {
    position: relative;
    width: 32%;
    display: inline-block;
    vertical-align: top;
    margin-right: 2%;
    margin-bottom: 20px
}

.vs-holder-ib .vsh-box:nth-child(3n) {
    margin-right: 0
}

.vs-holder-square .vsh-box {
    width: 49%
}

.vs-holder-square .vsh-box:nth-child(3n) {
    margin-right: 2%
}

.vs-holder-square .vsh-box:nth-child(2n) {
    margin-right: 0
}

.vsh-link-hold {
    display: block;
    background: #fff;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden
}

.vsh-link-hold:hover {
    box-shadow: 0 0 10px 0 rgba(165, 165, 165, .8)
}

.vs-holder .vsh-video {
    position: relative
}

.vsh-video {
    overflow: hidden
}

.home-video-box .fwbi-caption {
    display: block
}

.home-video-box .js-fwbi-lnk {
    display: block;
    position: relative
}

.home-video-box .fwbi-caption, .vs-holder .vsh-description {
    background: #fff;
    padding: 24px;
    color: #0078ae;
    font-size: 17px;
    line-height: 17px;
    box-shadow: 1px 1px #a8a8a8;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.vs-holder .vsh-link-hold:hover .vsh-description {
    box-shadow: 0 1px #fff
}

.vs-holder .vsh-description a {
    color: #0078ae;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.vs-holder .vsh-description a:hover {
    color: #009DDC
}

.video-presentation-section {
    position: relative;
    padding: 90px 0 20px
}

.video-presentation-section.section-bg-1 {
    padding-bottom: 70px
}

.video-presentation-section .see-all-large {
    border-width: 1px;
    margin-top: 30px;
    padding-bottom: 11px
}

.video-presentation-section .see-all-large:after {
    margin-left: 9px;
    line-height: 27px
}

.vsh-video img {
    min-width: 100%;
    max-width: 100%;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden
}

.wide-video-holder {
    position: relative;
    padding-top: 1px;
    padding-bottom: 56.25%;
    height: 0;
    margin-bottom: 40px
}

.wide-video-holder embed, .wide-video-holder iframe, .wide-video-holder object {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.pp-row {
    width: 100%;
    border-top: 1px solid #e0e1e1;
    position: relative;
    padding: 45px 0
}

.pp-row:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    border-top: 1px solid #fff;
    content: ""
}

.pp-row:first-child {
    border-top: 0;
    padding-top: 20px
}

.pp-row:first-child:before {
    display: none
}

.pp-nb-col {
    width: 134px;
    display: table-cell;
    vertical-align: middle
}

.pp-nb {
    display: inline-block;
    height: 86px;
    width: 86px;
    background: #88ba00;
    border: 3px solid #fff;
    border-radius: 44px;
    text-align: center;
    font: 700 57px/80px Arial, Helvetica, sans-serif;
    color: #fff
}

.pp-icon {
    display: table-cell;
    vertical-align: middle;
    width: 260px;
    text-align: center
}

.pp-descript {
    display: table-cell;
    vertical-align: middle;
    padding: 0 0 0 100px;
    font: 700 20px/1.5 Arial, Helvetica, sans-serif;
    color: #0078ae
}

.inline-btns-holder .btn-simple {
    margin-right: 10px;
    margin-bottom: 12px
}

.cms-wide-section {
    padding-top: 90px;
    padding-bottom: 40px;
    background: url("../image/tzz_ion-1.png")
}

.cms-single-section .next-step, .cms-wide-section .next-step {
    border: 8px solid #f7f7f7
}

.cms-single-section .next-step:after, .cms-wide-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.cms-wide-section .frame {
    max-width: 880px
}

.cms-features {
    font-size: 0;
    line-height: 0;
    width: 100%;
    text-align: center
}

.cf-item {
    display: inline-block;
    vertical-align: top;
    margin: 0 12px 12px 0;
    width: 18.5%;
    height: 162px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 1px 1px 0 0 #b9b9b9;
    text-align: center;
    padding: 26px 2px 4px
}

.cf-item:nth-child(5n) {
    margin-right: 0
}

.cf-item span {
    display: block;
    clear: both;
    font: 17px/1.2 Arial, Helvetica, sans-serif;
    color: #5a6063;
    padding-top: 10px
}

.cms-spec-item {
    position: relative;
    border-top: 1px solid #dbdcdc;
    padding: 48px 0
}

.cms-spec-item:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    border-top: 1px solid #fff;
    content: ""
}

.cms-spec-item:nth-child(2n) {
    background: url("../image/tzz_ion-1.png")
}

.cms-spec-item .frame {
    max-width: 760px;
    position: relative;
    padding-left: 324px
}

.cms-spec-item:nth-child(2n) .frame {
    padding-left: 0;
    padding-right: 324px
}

.cms-spec-logo {
    position: absolute;
    top: 0;
    left: 0
}

.cms-spec-item:nth-child(2n) .cms-spec-logo {
    right: 0;
    left: auto
}

.cms-spec-item h3 {
    font: 700 36px/1 Arial, Helvetica, sans-serif;
    color: #0078ae;
    margin: 0 0 20px
}

.cms-single-section {
    padding-top: 50px;
    padding-bottom: 34px;
    background: url("../image/tzz_ion-1.png")
}

.cms-single-section:nth-child(2n) {
    background: 0 0
}

.st-column .text-custom-title, .text-custom-title {
    color: #0078ae;
    margin: 0 0 10px;
    font: 36px roboto-light-webfont, sans-serif
}

.st-column .text-custom-title span, .text-custom-title span {
    : roboto-bold-webfont, sans-serif
}

.cms-single-section .st-column h4 {
    font-size: 16px
}

.cms-single-section ol {
    counter-reset: item
}

.cms-single-section ol li {
    display: block;
    padding-bottom: 14px
}

.cms-single-section ol li:before {
    content: counter(item) ". ";
    counter-increment: item;
    font-size: 20px;
    font-weight: 700
}

.sample-text-section-white {
    background: #fff
}

.sample-text-section-white .next-step {
    border: 8px solid #f7f7f7
}

.sample-text-section-white .next-step:after {
    background: #fff
}

.certify-section-white-bd .next-step {
    border: 8px solid #fff
}

.seo-traffic-section {
    padding: 0 0 150px;
    color: #758288;
    background: url("../image/tzz_ion-1.png")
}

.seo-traffic-section .blue-middle-box {
    margin-bottom: 35px
}

.seo-traffic-section .section-title {
    padding: 0 90px
}

.seo-traffic-section .section-title h2 {
    font-size: 50px
}

.seo-traffic-section .section-title p {
    color: #758288
}

.seotr-section {
    height: 446px;
    position: relative;
    padding-top: 67px;
    margin: 0 0 4px
}

.seotr-section .frame {
    width: 1000px;
    text-align: center
}

.seotr-section h3 {
    color: #009ddc;
    font: 22px/1.2 roboto-bold-webfont, Arial, sans-serif;
    margin-bottom: 4px
}

.seotr-section p {
    font: 17px/1.3 roboto-regular-webfont, Arial, sans-serif
}

.seotr-section strong {
    color: #5a6063;
    : roboto-medium-webfont, Arial, sans-serif
}

.seotr-graph {
    position: absolute;
    height: 400px;
    width: 1000px;
    bottom: 15px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 1;
    transition: all .2s
}

.seotr-txt {
    background: #fff;
    border-radius: 5px 5px 0 0;
    padding: 23px 25px 0;
    width: 90%;
    margin: 0 auto;
    min-height: 290px;
    transition: all .2s
}

.obtained-section {
    position: relative;
    padding: 120px 0 100px
}

.obtained-section .os-section {
    padding: 20px 0 0
}

.obtained-section .os-item {
    font-size: 15px;
    color: #5a6063;
    line-height: 25px;
    margin: 0 0 49px;
    padding: 0 0 37px;
    position: relative;
    border-bottom: 1px solid #dfdfdf
}

.obtained-section .os-item:before {
    position: absolute;
    width: 100%;
    height: 1px;
    background: #fff;
    content: ' ';
    left: 0;
    bottom: -2px
}

.obtained-section .os-item:last-child:before {
    display: none
}

.obtained-section .os-item:last-child {
    border: 0
}

.obtained-section .os-item h5 {
    font-size: 20px;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 10px
}

.obtained-section .os-item p {
    margin: 0 0 20px
}

.obtained-section .os-item .alignleft {
    float: left;
    margin-right: 30px;
    max-width: 66.35416666666667%
}

.obtained-section .os-item .alignright {
    float: right;
    margin-left: 30px;
    max-width: 66.35416666666667%
}

.os-text {
    overflow: hidden;
    max-width: 31.77083333333333%
}

.demo-video-box, .expanded-mode {
    color: #fff;
    background: url("../image/tzz_ion-1.png")
}

.expanded-mode #wistia_grid_119_below {
    display: none
}

.demo-video-box {
    width: 100%
}

.expanded-mode .ec-frame {
    background: url("../image/tzz_ion-1.png");
    color: #FFF;
    padding: 52px 0 59px;
    position: relative
}

.demo-video-box .fwbi-text, .expanded-mode .fwbi-text {
    position: relative;
    padding: 60px 0
}

.expanded-mode .ec-gallery {
    float: left;
    width: 70%;
    border-left: 1px solid #000;
    border-top: 1px solid #000;
    border-right: 1px solid #1d2429;
    border-bottom: 1px solid #2b323a;
    border-radius: 3px
}

.expanded-mode .ecg-image-box {
    border-left: 1px solid #262b32;
    border-top: 1px solid #262b32;
    border-right: 1px solid #161a1e;
    border-bottom: 1px solid #0f1318;
    border-radius: 3px;
    background: #1e2227;
    padding: 12px 12px 2px
}

.featured-work-fullscreen .expanded-mode {
    background: #fff;
    box-shadow: 0 0 5px rgba(23, 23, 23, .18);
    margin-bottom: 40px
}

.featured-work-fullscreen .expand-close {
    top: -34px;
    right: 14px;
    width: 60px;
    height: 68px;
    background-position: -636px -280px
}

.featured-work-fullscreen .expand-close:hover {
    background-position: -636px -276px
}

.featured-work-fullscreen .expand-close:before {
    width: 60px;
    height: 68px;
    background-position: -697px -280px
}

.featured-work-fullscreen .expanded-mode .ec-gallery {
    border: 0;
    border-radius: 0;
    position: relative;
    width: auto
}

.ec-gallery-desk {
    display: none
}

.featured-work-fullscreen .expanded-mode .ecg-image-box {
    float: left;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: 0 0;
    position: relative
}

.featured-work-fullscreen .ecg-image-box img {
    width: 100%
}

.featured-work-fullscreen .ec-gallery-control {
    display: none
}

.featured-work-fullscreen .ec-fs-descr {
    float: left;
    width: 562px;
    font-size: 15px;
    line-height: 1.6;
    color: #878a8c;
    padding: 5px 40px 15px
}

.ec-fs-logo {
    text-align: center;
    margin: 0 0 18px
}

.fwb-items .ec-fs-logo img {
    display: inline
}

.ec-fs-intro {
    color: #323232;
    font: 22px/1.4 roboto-light-webfont, sans-serif;
    margin: 0 0 18px
}

.ec-fs-btn-holder {
    padding-top: 20px
}

.ec-fs-btn-holder .btn-green {
    float: none;
    display: inline-block
}

.expanded-mode .ec-text {
    font-size: 15px;
    line-height: 22px;
    color: #a6aeb2;
    float: right;
    width: 27.4468085106383%
}

.ec-fs-aside-img {
    position: absolute;
    top: 30px;
    right: 0;
    height: calc(100% - 60px);
    background-repeat: no-repeat;
    background-size: cover
}

.expanded-mode .ec-text .ttl, .expanded-mode .ec-text h5 {
    color: #0c95cd;
    font-size: 20px;
    font-weight: 700;
    margin: 2px 0 10px;
    display: block
}

.expanded-mode .ec-text p {
    margin: 0 0 20px
}

.expanded-mode .ec-text ul li {
    margin-bottom: 15px;
    line-height: 1.5
}

.expanded-mode .ec-text ul li:before {
    content: "Â»";
    display: inline-block;
    margin: 0 9px 0 0;
    font-size: 19px;
    color: #009ddc;
    vertical-align: -1px
}

.expanded-mode .main-image {
    z-index: 1
}

.fwb-items .expanded-mode .main-image img {
    opacity: 0;
    display: none
}

.fwb-items .expanded-mode .main-image img.active-image {
    opacity: 1;
    display: inline
}

.featured-work-fullscreen .fwb-items .expanded-mode .main-image img {
    display: block;
    opacity: 1;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: auto;
    max-width: none;
    height: 100%
}

.featured-work-fullscreen .fwb-items .expanded-mode .main-image img.active-slide-img {
    z-index: 10;
    -webkit-animation: slideActiveAnim .7s forwards;
    -ms-animation: slideActiveAnim .7s forwards;
    animation: slideActiveAnim .7s forwards
}

@-webkit-keyframes slideActiveAnim {
    0% {
        -webkit-transform: translateX(100%)
    }
    100% {
        -webkit-transform: translateX(0)
    }
}

@-ms-keyframes slideActiveAnim {
    0% {
        -ms-transform: translateX(100%)
    }
    100% {
        -ms-transform: translateX(0)
    }
}

@keyframes slideActiveAnim {
    0% {
        transform: translateX(100%)
    }
    100% {
        transform: translateX(0)
    }
}

.featured-work-fullscreen .fwb-items .expanded-mode .main-image img.past-slide {
    z-index: 1;
    -webkit-animation: slidePastAnim .7s forwards;
    -ms-animation: slidePastAnim .7s forwards;
    animation: slidePastAnim .7s forwards
}

@-webkit-keyframes slidePastAnim {
    0% {
        -webkit-transform: translateX(0)
    }
    100% {
        -webkit-transform: translateX(-100%)
    }
}

@-ms-keyframes slidePastAnim {
    0% {
        -ms-transform: translateX(0)
    }
    100% {
        -ms-transform: translateX(-100%)
    }
}

@keyframes slidePastAnim {
    0% {
        transform: translateX(0)
    }
    100% {
        transform: translateX(-100%)
    }
}

.expanded-mode .thumbnails img {
    display: inline;
    max-height: 74px;
    max-width: 101px
}

.expanded-mode .thumbnails a {
    position: relative;
    display: inline-block;
    margin-left: 3px;
    margin-bottom: 10px;
    cursor: pointer
}

.featured-work-fullscreen .expanded-mode .thumbnails {
    font-size: 0;
    line-height: 0;
    text-align: center
}

.featured-work-fullscreen .expanded-mode .thumb-holder {
    max-width: 980px;
    display: inline-block;
    vertical-align: top;
    margin-top: -1px
}

.featured-work-fullscreen .expanded-mode .thumbnails-mobile {
    display: none
}

.featured-work-fullscreen .expanded-mode .thumbnails a {
    width: 25%;
    margin: 0;
    overflow: hidden;
    opacity: 1;
    -moz-transition: opacity .2s ease;
    transition: opacity .2s ease
}

.featured-work-fullscreen .expanded-mode .thumbnails:hover a {
    opacity: .7
}

.featured-work-fullscreen .expanded-mode .thumbnails:hover a:hover {
    opacity: 1
}

.expanded-mode .thumbnails a:after {
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear;
    content: " ";
    position: absolute;
    width: 94.05940594059406%;
    height: 91.89189189189189%;
    border: 3px solid #90c404;
    left: 0;
    top: 0;
    opacity: 0
}

.expanded-mode .thumbnails a.active:after, .expanded-mode .thumbnails a:hover:after {
    opacity: 1
}

.featured-work-fullscreen .expanded-mode .thumbnails a:after {
    display: none
}

.js-thumbnails {
    margin-left: -5px
}

.ec-gallery-control {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -50px;
    width: 53px;
    height: 98px;
    font-size: 0;
    line-height: 0;
    color: transparent;
    background: url("../image/tzz_ion-1.png") no-repeat;
    opacity: .6;
    -webkit-transition: opacity .3s ease-out;
    transition: opacity .3s ease-out
}

.ec-control-next {
    left: auto;
    right: 0;
    background-position: -53px 0
}

.ec-gallery-control:hover {
    opacity: 1
}

.ec-text .btn-launch {
    display: inline-block;
    color: #758288;
    text-transform: uppercase;
    font: 16px/0 roboto-bold-webfont, Arial, sans-serif;
    text-shadow: 0 -1px 0 #14171a;
    -webkit-transition: color .3s ease-out;
    transition: color .3s ease-out
}

.ec-text .btn-launch:after {
    display: inline-block;
    vertical-align: -2px;
    margin: 0 0 0 6px;
    content: "Â»";
    font: 28px/22px roboto-bold-webfont, sans-serif
}

.ec-text .btn-launch:hover {
    color: #009DDC;
    background-position: 100% -24px
}

.ec-text .btn-launch-holder {
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
    padding: 10px 0;
    margin-bottom: 23px;
    position: relative
}

.ec-text .btn-launch-holder:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #20272e;
    content: " "
}

.ec-text .btn-launch-holder:before {
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #20272e;
    content: " "
}

.ec-text .btn-green {
    float: left;
    padding: 9px 18px 11px;
    min-width: 80%;
    text-align: center
}

.expand-close {
    top: 0
}

.fwb-item .active-lnk:after {
    background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
    bottom: -28px;
    content: "";
    height: 11px;
    left: 50%;
    margin-left: -13px;
    position: absolute;
    width: 21px
}

.featured-work-fullscreen .fwb-item .active-lnk::after {
    width: 32px;
    height: 15px;
    background-position: 0 -346px
}

.demo-reel-block .drb-content .hide-from-mobile {
    display: none
}

.demo-reel-block .aligncenter {
    text-align: center
}

.br-tablet {
    display: none
}

.mdt-holder {
    padding: 30px 0 0
}

.mdt-holder .visible-for-mobile {
    display: none
}

.mobile-date-table {
    padding: 3px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, .41)
}

.mobile-date-table table {
    width: 100%;
    font-size: 12px;
    line-height: 14px
}

.mobile-date-table table th {
    background: #0078ae;
    color: #fff;
    padding: 16px 22px;
    vertical-align: middle;
    font-size: 13px;
    text-align: center;
    border-left: 1px solid #dadedf
}

.mobile-date-table table th:first-child {
    border-left: 0;
    text-align: left;
    background: #0087bd
}

.mobile-date-table table td {
    padding: 16px 22px;
    vertical-align: middle;
    background: #f9fafa;
    text-align: center;
    border-top: 1px solid #dadedf;
    border-left: 1px solid #dadedf
}

.mobile-date-table table tr:nth-child(2n) td {
    background: #fff
}

.mobile-date-table table tr td:first-child {
    background: #dff1f8;
    text-align: left;
    border-left: 0;
    width: 32.91492329149233%
}

.mobile-date-table table tr:nth-child(2n) td:first-child {
    background: #f2fafd
}

.mobile-date-table table tr:nth-child(2) td {
    border-top: 0
}

.mobile-date-table table tr td:nth-child(2) {
    border-left: 0
}

.data-table {
    border-radius: 6px;
    padding: 10px;
    background: #fff;
    margin-bottom: 30px
}

.data-table table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate
}

.data-table tr {
    height: 75px
}

.data-table th {
    color: #fff;
    font: 400 24px roboto-bold-webfont, sans-serif;
    background: #0087bd;
    position: relative;
    padding: 3px 10px 7px;
    border-left: 5px solid #fff
}

.data-table tr:nth-child(odd) td {
    background: #f5fafc
}

.data-table td {
    width: 16.75%;
    text-align: center;
    font: 17px/1.2 roboto-regular-webfont, sans-serif;
    color: #6c6c72;
    padding: 3px 10px 7px;
    position: relative;
    vertical-align: middle;
    border-left: 5px solid #fff
}

.data-table .first {
    width: 33%;
    text-align: left;
    color: #0087bd;
    : roboto-bold-webfont, sans-serif;
    padding: 3px 35px 7px;
    border-left: none
}

.data-table .notes td {
    text-align: left;
    vertical-align: top;
    padding: 25px 5px 25px 25px
}

.data-table .notes td.first {
    padding-left: 35px
}

.data-table th.first {
    color: #fff
}

.data-table .checkmark {
    background: url("../image/tzz_ion-1.svg") no-repeat;
    width: 27px;
    height: 25px;
    display: inline-block;
    text-indent: -9999px;
    overflow: hidden
}

.data-list {
    color: #6c6c72
}

.data-list .unit {
    padding: 10px 10px 20px
}

.data-list ul {
    padding: 10px 10px 10px 30px;
    font: 15px roboto-light-webfont, sans-serif
}

.data-list li {
    padding: 3px 0
}

.data-list li:before {
    content: '';
    background: url("../image/tzz_ion-1.svg") no-repeat;
    width: 16px;
    height: 15px;
    display: inline-block;
    margin: 0 10px 0 -26px;
    position: relative;
    top: 2px
}

.data-list h3 {
    color: #fff;
    font: 400 20px roboto-medium-webfont, sans-serif;
    background: #0087bd;
    padding: 10px
}

.data-list .notes {
    display: block;
    font: 14px roboto-light-webfont, sans-serif;
    padding: 0 10px 0 30px
}

.data-list .notes strong {
    color: #0087bd;
    : roboto-medium-webfont, sans-serif
}

.design-samples .see-all-large {
    margin-bottom: 45px
}

.our-clients-content .testimonial-hidden-row-frame {
    margin-bottom: 30px
}

#menu {
    visibility: hidden
}

body .mm-menu {
    visibility: visible !important
}

.mobile-panel-menu {
    display: none
}

.js-testimonials-area .testimonial-row {
    padding-bottom: 0
}

.js-testimonials-area .testimonial-row .at-item {
    padding-bottom: 30px
}

.occ-all .testimonial-hidden-row {
    clear: both;
    width: 100%
}

.fancy-form .f-row {
    padding-right: 0
}

.fancy-form .f-add-field {
    padding-right: 11px;
    position: relative
}

.fancy-form label.required span {
    color: #000 !important;
    display: block;
    font-size: 13px;
    font-weight: 700;
    padding: 1px 15px 5px
}

.error label span, .fancy-form .error label.required span {
    color: red
}

.demo-video-box .ec-video-box, .expanded-mode .ec-video-box {
    padding: 52px 20px 62px
}

.demo-video-box .ec-video-box {
    margin: 0 auto 25px;
    max-width: 980px
}

.demo-video-box h4, .expanded-mode .ec-video-box h4 {
    padding-bottom: 28px
}

.demo-video-box h4 {
    line-height: 1.2
}

.expanded-mode .fwbi-text-pad {
    padding-left: 20px;
    padding-right: 20px;
    text-align: left
}

.featured-work-fullscreen .expanded-mode .fwbi-text-pad {
    padding: 30px 0
}

.expanded-mode .fwbi-text-pad .thumbnails img {
    max-width: 98px
}

.featured-work-fullscreen .expanded-mode .fwbi-text-pad .thumbnails img {
    max-width: 100%;
    height: auto;
    max-height: 100%;
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    -webkit-transition: -webkit-transform .5s ease;
    -ms-transition: -ms-transform .5s ease;
    transition: transform .5s ease
}

.featured-work-fullscreen .expanded-mode .fwbi-text-pad .thumbnails a.active img, .featured-work-fullscreen .expanded-mode .fwbi-text-pad .thumbnails a:hover img {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.search-results-holder {
    padding: 40px 20px 100px;
    background: #fff
}

.search-results-iframe iframe {
    width: 100% !important
}

.flexible-frame {
    clear: both;
    margin: 0 0 40px
}

.login-container {
    padding: 40px 0 100px
}

.form-login-box {
    border: 1px solid #dcd8d8;
    background: url("../image/tzz_ion-1.png");
    max-width: 480px;
    margin: 0 auto;
    border-radius: 5px;
    padding: 39px 0 34px
}

.form-login-box .f-row {
    margin-right: 33px;
    padding-left: 40px
}

.form-login-box label {
    display: block;
    color: #0078AE;
    padding: 0 0 9px 10px;
    font: 21px/1 roboto-medium-webfont, sans-serif
}

.form-login-box label .validator {
    color: red
}

.form-login-box .ch-form .ff-checkbox label {
    float: none;
    padding-right: 0;
    padding-bottom: 0;
    font-size: 15px
}

.form-login-box .ch-form .ff-checkbox label span {
    padding-top: 3px
}

.help-link {
    text-align: center
}

.services-wide-section-request {
    padding-top: 0;
    position: static
}

.service-wide-item:last-child {
    padding-bottom: 140px
}

.nopad-b {
    padding-bottom: 0 !important
}

.mr-b-105 {
    margin-bottom: 105px
}

.re-collapse a:after, .ti-content .view-more:after {
    vertical-align: 1px;
    margin-top: 0;
    position: relative;
    top: 4px
}

.re-collapse, .view-more-container {
    display: block
}

.detail-column a {
    color: #009DDC
}

.detail-column h3 {
    font: 700 30px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 20px
}

.detail-column h2 {
    font: 700 28px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 20px
}

.detail-column strong {
    font: 700 17px/1.1 Arial, sans-serif;
    color: #5a6063;
    margin: 0 0 20px
}

.ti-content .view-more:after {
    font-size: 28px
}

.field-title {
    padding: 0 0 0 2px
}

.field-title .label {
    float: left;
    margin: 0 4px 5px 0
}

.field-title .req {
    float: left;
    margin-right: 5px;
    font-size: 22px;
    color: #0a4f82;
    : Arial, Helvetica, sans-serif
}

.field-title .validation {
    float: left;
    : roboto-bold-webfont, sans-serif;
    font-size: 13px;
    margin: 3px 0 0;
    color: #D02525
}

.field-error input, .field-error textarea {
    border: 2px solid #ef0708 !important;
    background-image: url("../image/tzz_ion-1.png") !important;
    background-repeat: no-repeat !important
}

.field-success input, .field-success textarea {
    border: 2px solid #aad15a !important;
    background-image: url("../image/tzz_ion-1.png") !important;
    background-repeat: no-repeat !important
}

.ch-form .field-error input, .ch-form .field-error textarea {
    background-position: 99% -265px !important;
    padding-right: 40px !important;
    padding-left: 17px !important;
    color: #ef0708
}

.form-alt-shape .field-error input, .form-alt-shape .field-error textarea {
    background-position: 99% -270px !important
}

.ch-form .field-success input, .ch-form .field-success textarea {
    background-position: 99% 8px !important;
    padding-right: 40px !important;
    padding-left: 17px !important
}

.aside-form-box .field-success input {
    background-position: 257px -567px !important;
    padding: 9px 40px 6px 12px !important
}

.aside-form-box .field-error input {
    background-position: 257px -811px !important;
    padding: 9px 40px 6px 12px !important
}

.aside-form-box .req {
    font-size: 18px !important;
    color: #fff !important;
    line-height: 1 !important
}

.ch-form .f-row .label {
    display: block;
    font-size: 16px;
    color: #0a4f82;
    margin: 0 3px 5px 0;
    : roboto-bold-webfont, sans-serif
}

.ch-form .f-row .is-subscribed {
    font-size: 14px;
    color: #5a6063;
    : roboto-light-webfont, sans-serif
}

.aside-form-box form .label {
    display: block;
    font-size: 14px;
    color: #fff;
    margin: 0 3px 1px 0;
    : roboto-bold-webfont, sans-serif;
    text-align: left
}

.aside-form-box form .validation {
    color: #000;
    font-size: 12px;
    margin-top: 2px
}

.webinars-holder .ch-form .label, .webinars-holder .ch-form .req {
    color: #fff
}

.webinars-holder .ch-form .validation {
    color: #000
}

.webinars-holder .ch-form .field-error input {
    background-position: 352px -265px !important
}

.webinars-holder .ch-form .field-success input {
    background-position: 352px 8px !important
}

.work-loader {
    position: absolute;
    left: 50%;
    z-index: 999;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-animation: preloader 3s infinite linear;
    -ms-animation: preloader 3s infinite linear;
    animation: preloader 3s infinite linear
}

.loader-item {
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 50%;
    background: #0078AE
}

.loader-item-1 {
    top: -14px;
    left: -26px;
    background: #009DDC;
    -webkit-animation: preloader-1 5s infinite linear;
    -ms-animation: preloader-1 5s infinite linear;
    animation: preloader-1 5s infinite linear
}

.loader-item-2 {
    top: -25px;
    left: -5px;
    -webkit-animation: preloader-2 5s infinite linear;
    -ms-animation: preloader-2 5s infinite linear;
    animation: preloader-2 5s infinite linear
}

.loader-item-3 {
    top: -5px;
    left: 7px;
    -webkit-animation: preloader-3 5s infinite linear;
    -ms-animation: preloader-3 5s infinite linear;
    animation: preloader-3 5s infinite linear
}

.loader-item-4 {
    top: 6px;
    left: -13px;
    -webkit-animation: preloader-4 5s infinite linear;
    -ms-animation: preloader-4 5s infinite linear;
    animation: preloader-4 5s infinite linear
}

.occ-2-items-columns .occc-column:nth-child(2) {
    float: right
}

.occ-2-items-columns .occc-column-1 {
    margin-left: 100px
}

.occ-2-items-columns .occc-column-2 {
    margin-right: 100px
}

.no-pad-t-section {
    padding-top: 0
}

.demo-video-box {
    overflow: hidden;
    height: 0
}

.drb-video-holder .opened:after {
    background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
    bottom: -20px;
    content: "";
    height: 11px;
    left: 50%;
    margin-left: -13px;
    position: absolute;
    width: 21px
}

.drb-main-content {
    margin-bottom: 20px
}

.team-fixed-switcher {
    z-index: 10001;
    position: fixed;
    bottom: -200px;
    left: 0;
    width: 100%;
    padding: 15px 0 5px;
    background: rgba(255, 255, 255, .85);
    box-shadow: 0 -3px 2px rgba(0, 0, 0, .07);
    -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    transition: all .8s ease
}

.team-fixed-switcher-active {
    bottom: 0
}

.team-fixed-switcher .switch-section {
    margin-bottom: 15px
}

.team-fixed-switcher .employ-nav {
    padding: 0
}

#barScroll_2 {
    margin: 0
}

.btn-top {
    display: none;
    position: fixed;
    left: -100px;
    top: 25%;
    width: 65px;
    height: 94px;
    background: #0087bd;
    z-index: 100;
    cursor: pointer;
    opacity: 0;
    padding: 20px 0 0 14px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 2px -2px rgba(0, 59, 85, .5);
    background-clip: border-box;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease
}

.btn-top:hover {
    background: #02abee
}

.btn-top span {
    display: block;
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 36px;
    height: 34px;
    margin-bottom: 11px
}

.btn-top em {
    : roboto-bold-webfont, sans-serif;
    display: block;
    font-style: normal;
    color: #fff;
    font-size: 15px;
    padding-left: 5px;
    text-transform: uppercase;
    text-shadow: 0 -1px rgba(0, 76, 110, 1)
}

.btn-top-active {
    opacity: 0;
    left: 0
}

.home-expanded-mode {
    text-align: left;
    width: 100%;
    overflow: hidden
}

.home-expanded-mode .expanded-mode {
    background: 0 0
}

.home-expanded-mode .ec-frame {
    padding-top: 0;
    padding-bottom: 0
}

.home-expanded-mode .fwbi-content {
    padding-bottom: 10px
}

.olpc-board .link-opener img {
    display: block
}

.olpc-board .link-opener.active:after {
    background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
    bottom: 0;
    content: "";
    height: 11px;
    left: 50%;
    margin-left: -13px;
    position: absolute;
    width: 21px
}

.rank-section .rs-addr {
    padding: 5px 0 3px 96px;
    margin: 20px 0 0;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.rank-section .rs-phone {
    padding: 11px 0 6px 96px;
    margin: 8px 0 0;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.rank-section .rs-addr h3, .rank-section .rs-phone h3 {
    font-size: 28px;
    color: #0078ae;
    margin: 0 0 10px;
    : roboto-medium-webfont, Arial, sans-serif
}

.rank-section .rs-addr p, .rank-section .rs-phone p {
    padding: 0;
    margin: 0 0 10px;
    font-size: 17px;
    line-height: 24px;
    color: #5a6063
}

.testimonials-wide-section .occ-2-items-columns .occc-column {
    padding-bottom: 20px
}

@-webkit-keyframes preloader {
    0% {
        -webkit-transform: translateX(-50%) rotate(0)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(360deg)
    }
}

@-ms-keyframes preloader {
    0% {
        transform: translateX(-50%) rotate(0)
    }
    100% {
        transform: translateX(-50%) rotate(360deg)
    }
}

@keyframes preloader {
    0% {
        transform: translateX(-50%) rotate(0)
    }
    100% {
        transform: translateX(-50%) rotate(360deg)
    }
}

@-webkit-keyframes preloader-1 {
    0% {
        -webkit-transform: translate(0)
    }
    10% {
        -webkit-transform: translate(-10px, -5px)
    }
    20% {
        -webkit-transform: translate(0)
    }
}

@-ms-keyframes preloader-1 {
    0% {
        -ms-transform: translate(0)
    }
    10% {
        -ms-transform: translate(-10px, -5px)
    }
    20% {
        -ms-transform: translate(0)
    }
}

@keyframes preloader-1 {
    0% {
        transform: translate(0)
    }
    10% {
        transform: translate(-10px, -5px)
    }
    20% {
        transform: translate(0)
    }
}

@-webkit-keyframes preloader-2 {
    20% {
        -webkit-transform: translate(0)
    }
    30% {
        -webkit-transform: translate(3px, -10px)
    }
    40% {
        -webkit-transform: translate(0)
    }
}

@-ms-keyframes preloader-2 {
    20% {
        -ms-transform: translate(0)
    }
    30% {
        -ms-transform: translate(3px, -10px)
    }
    40% {
        -ms-transform: translate(0)
    }
}

@keyframes preloader-2 {
    20% {
        transform: translate(0)
    }
    30% {
        transform: translate(3px, -10px)
    }
    40% {
        transform: translate(0)
    }
}

@-webkit-keyframes preloader-3 {
    40% {
        -webkit-transform: translate(0)
    }
    50% {
        -webkit-transform: translate(10px, 3px)
    }
    60% {
        -webkit-transform: translate(0)
    }
}

@-ms-keyframes preloader-3 {
    40% {
        -ms-transform: translate(0)
    }
    50% {
        -ms-transform: translate(10px, 3px)
    }
    60% {
        -ms-transform: translate(0)
    }
}

@keyframes preloader-3 {
    40% {
        transform: translate(0)
    }
    50% {
        transform: translate(10px, 3px)
    }
    60% {
        transform: translate(0)
    }
}

@-webkit-keyframes preloader-4 {
    60% {
        -webkit-transform: translate(0)
    }
    70% {
        -webkit-transform: translate(-3px, 10px)
    }
    80% {
        -webkit-transform: translate(0)
    }
}

@-ms-keyframes preloader-4 {
    60% {
        -ms-transform: translate(0)
    }
    70% {
        -ms-transform: translate(-3px, 10px)
    }
    80% {
        -ms-transform: translate(0)
    }
}

@keyframes preloader-4 {
    60% {
        transform: translate(0)
    }
    70% {
        transform: translate(-3px, 10px)
    }
    80% {
        transform: translate(0)
    }
}

.img-loader {
    width: 100%;
    height: 470px;
    position: relative;
    -webkit-transition: .5s;
    -ms-transition: .5s;
    transition: .5s;
    z-index: 1
}

@media only screen and (max-width: 980px) {
    .img-loader {
        height: 390px
    }
}

@media only screen and (max-width: 880px) {
    .img-loader {
        height: 330px
    }
}

@media only screen and (max-width: 880px) {
    .img-loader {
        height: 330px
    }
}

@media only screen and (max-width: 755px) {
    .img-loader {
        height: 470px
    }

    .show-in-mobile {
        display: inline
    }
}

@media only screen and (max-width: 670px) {
    .img-loader {
        height: 270px
    }
}

.thumbnails .img-loader {
    width: 50px;
    height: 50px;
    display: none
}

.baac-slider-tn .img-loader {
    width: 120px;
    height: 100px
}

.first-loaded > .img-loader {
    position: absolute;
    opacity: .5
}

.loaded > .img-loader {
    position: absolute;
    opacity: 0;
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
}

.img-loader:after {
    content: "";
    width: 100px;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation: loaderAnim 1.5s steps(28) infinite;
    animation: loaderAnim 1.5s steps(28) infinite;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.thumbnails .img-loader:after {
    -webkit-transform: translate(-50%, -50%) scale(0.5);
    transform: translate(-50%, -50%) scale(0.5)
}

@-webkit-keyframes loaderAnim {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -2800px
    }
}

@keyframes loaderAnim {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -2800px
    }
}

.ie9 .img-loader:after {
    width: 80px;
    height: 80px;
    line-height: 80px;
    color: #fff;
    content: "Loading...";
    font-size: 14px;
    text-align: center
}

.cs-wide-section .js-featured-work-block-bottom {
    padding-bottom: 60px
}

.text-lead {
    font: 28px roboto-light-webfont, sans-serif;
    margin: 0 0 16px
}

.text-lead strong {
    : roboto-bold-webfont, sans-serif
}

.demo-reel-block-flex {
    padding-top: 0;
    margin-bottom: 30px
}

.demo-reel-block-flex .frame {
    background: 0 0
}

@-webkit-keyframes rotateplane {
    0% {
        -webkit-transform: perspective(120px)
    }
    50% {
        -webkit-transform: perspective(120px) rotateY(180deg)
    }
    100% {
        -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg)
    }
}

@-ms-keyframes rotateplane {
    0% {
        -ms-transform: perspective(120px)
    }
    50% {
        -ms-transform: perspective(120px) rotateY(180deg)
    }
    100% {
        -ms-transform: perspective(120px) rotateY(180deg) rotateX(180deg)
    }
}

@keyframes rotateplane {
    0% {
        transform: perspective(120px)
    }
    50% {
        transform: perspective(120px) rotateY(180deg)
    }
    100% {
        transform: perspective(120px) rotateY(180deg) rotateX(180deg)
    }
}

.load-start img {
    opacity: 0 !important;
    position: absolute;
    transition: .3s
}

.first-loaded:not(.main-image) > img:first-child, .loaded:not(.main-image) img:not(.mobile) {
    opacity: 1 !important;
    position: static
}

.expanded-mode .main-image {
    cursor: pointer;
    margin-bottom: 7px;
    position: relative
}

.gallery-space-hold img {
    width: 100%;
    height: auto
}

.featured-work-fullscreen .expanded-mode .main-image {
    margin-bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 10
}

.featured-work-fullscreen .expanded-mode .main-image.no-action {
    pointer-events: none
}

.site-map {
    padding: 40px 0 80px
}

.site-map ul {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.site-map ul li {
    list-style-type: none;
    font-weight: 400;
    font-size: 16px;
    padding: 5px 0 5px 40px;
    background: url("../image/tzz_ion-1.gif") 30px 12px no-repeat
}

.site-map ul li li {
    margin: 5px 0 0;
    font-weight: 700;
    font-size: 14px;
    background: url("../image/tzz_ion-1.gif") 26px 10px no-repeat
}

.site-map ul li li li {
    font-size: 12px;
    font-weight: 400
}

.ch-form .field-success input, .jq-join-us-form.ch-form .field-success textarea {
    background-position: 99% 8px !important
}

.jq-join-us-form.ch-form .field-success .ff-input:hover input {
    background-position: 99.2% 3px !important;
    padding-left: 16px !important;
    padding-right: 40px !important
}

.jq-contact-form fieldset, .jq-join-us-form fieldset {
    position: relative
}

.jq-contact-form .img-loader, .jq-dl-request-form .img-loader, .jq-join-us-form .img-loader, .jq-ppc-raq-form .img-loader, .jq-raq-form .img-loader, .jq-webinar-form .img-loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .35);
    z-index: 3;
    box-shadow: 0 0 5px 0 rgba(50, 50, 50, .75)
}

.jq-contact-form input[type=submit]:disabled, .jq-dl-request-form input[type=submit]:disabled, .jq-join-us-form input[type=submit]:disabled, .jq-ppc-raq-form input[type=submit]:disabled, .jq-raq-form input[type=submit]:disabled, .jq-webinar-form input[type=submit]:disabled {
    box-shadow: none;
    background: #eee;
    color: #D0D0D0;
    cursor: default
}

.jq-contact-form .img-loader {
    left: 20px;
    top: -37px
}

@media screen and (max-width: 800px) {
    .jq-contact-form .img-loader {
        width: 112%;
        left: -20px;
        top: -37px
    }
}

@media screen and (max-width: 646px) {
    .jq-contact-form .img-loader {
        width: 115%;
        height: 96%;
        top: auto;
        bottom: 36px
    }

    .wyg-form-box-frame {
        position: relative
    }
}

.webinars-holder-single {
    margin-top: -10px
}

.careers-single .join-us-form-holder {
    background: url("../image/tzz_ion-1.png")
}

.careers-single .page-intro-center {
    text-align: left;
    font-size: 18px;
    line-height: 24px
}

.careers-single .page-intro-center p {
    margin: 0 0 20px
}

.careers-single .page-intro-center h3 {
    color: #0078AE;
    font: 30px/1.1 roboto-light-webfont, sans-serif;
    margin: 60px 0 20px
}

.careers-single .page-intro-center ol, .careers-single .page-intro-center ul {
    margin: 0 0 20px;
    padding: 0 0 0 20px
}

.careers-single .page-intro-center ul li {
    padding: 0 0 5px;
    list-style: disc
}

.careers-single .page-intro-center ol li {
    list-style: decimal;
    padding: 0 0 5px
}

.careers-single .page-intro-center ol ol, .careers-single .page-intro-center ol ul, .careers-single .page-intro-center ul ol, .careers-single .page-intro-center ul ul {
    margin: 0 0 0 20px
}

.video-landing-section-pad {
    padding-bottom: 80px
}

.btn-simple-blue {
    position: relative;
    : roboto-bold-webfont, sans-serif;
    font-size: 18px;
    color: #fff;
    background: #0078ae;
    border-radius: 4px;
    padding: 15px 45px;
    display: inline-block;
    -webkit-transition: background .2s ease-out;
    -moz-transition: background .2s ease-out;
    transition: background .2s ease-out;
    text-shadow: 1px 1px rgba(1, 1, 1, .4)
}

.btn-simple-blue:after {
    content: "Â»";
    font: 26px/14px roboto-black-webfont, Arial, sans-serif;
    padding-left: 13px;
    vertical-align: -1px;
    text-shadow: 1px 1px rgba(1, 1, 1, .4)
}

.btn-simple-blue:hover {
    color: #fff;
    background: #035f88
}

.process-steps-section {
    background: url("../image/tzz_ion-1.png");
    position: relative
}

.process-steps-section .frame {
    padding: 80px 0
}

.steps-controls {
    padding: 0 0 0 50px
}

.steps-controls li {
    float: left;
    text-align: center;
    position: relative;
    padding-bottom: 66px
}

.steps-controls li a {
    display: block
}

.steps-controls li.sep {
    margin: 0 4px;
    padding: 0
}

.steps-controls li.sep span {
    display: block;
    height: 3px;
    width: 122px;
    background: #009ddc;
    margin-top: 34px
}

.steps-controls .num {
    display: inline-block;
    width: 67px;
    height: 67px;
    line-height: 67px;
    background: #009ddc;
    text-align: center;
    color: #fff;
    : roboto-bold-webfont, sans-serif;
    font-size: 35px;
    border-radius: 50%;
    margin-bottom: 15px;
    position: relative
}

.steps-controls .text {
    position: absolute;
    bottom: 35px;
    : roboto-bold-webfont, sans-serif;
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    text-shadow: 1px 1px rgba(1, 1, 1, .4);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.steps-controls .active {
    background: url("../image/tzz_ion-1.png") 50% 100% no-repeat
}

.steps-controls .active .num, .steps-controls a:hover .num {
    background: #fff;
    color: #0078ae
}

.steps-contents {
    background: #fff;
    overflow: hidden;
    width: 100%;
    min-height: 350px
}

.steps-contents .sc-frame {
    overflow: hidden
}

.step-content {
    padding: 50px;
    font-size: 17px;
    color: #5a6063;
    line-height: 26px;
    float: left;
    display: none
}

.step-content-active {
    display: block
}

.step-content .img-right {
    float: right;
    margin-left: 40px
}

.step-content h3 {
    : roboto-light-webfont, sans-serif;
    font-size: 40px;
    line-height: 1;
    color: #0078ae;
    margin: 0 0 20px
}

.step-content p {
    margin: 0 0 30px
}

.step-content .btn-simple {
    padding: 15px 65px
}

.process-steps-section .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.process-steps-videos {
    position: relative;
    padding-top: 80px
}

.process-steps-videos .next-step {
    border-color: #0178b1;
    box-shadow: none
}

.jq-verisign-container {
    display: none
}

.extra-text-slider-section {
    position: relative;
    margin: 70px 0 0;
    padding: 105px 0;
    background: url("../image/tzz_ion-1.png")
}

#slider_full-width {
    background: #fff;
    width: 100%;
    margin-top: 10px;
    padding: 0 110px
}

#slider_full-width .bx-wrapper {
    padding: 30px 0
}

#slider_full-width ul, #slider_list_full, #slider_list_full > li {
    overflow: hidden
}

#slider_full-width ul li {
    float: left;
    width: 100%
}

.sfw-slide-frame {
    padding: 0;
    display: block
}

.sfw-slide-frame h3 {
    position: relative
}

.sfw-slide-frame h3 span {
    position: absolute;
    left: -60px;
    width: 50px;
    text-align: right;
    letter-spacing: -3px;
    : roboto-bold-webfont, sans-serif
}

#slider_full-width .bx-prev {
    left: -95px;
    top: 50%;
    margin-top: -50px
}

#slider_full-width .bx-next {
    right: -85px;
    top: 50%;
    margin-top: -50px
}

#slider_full-width .bx-next, #slider_full-width .bx-prev {
    width: 80px;
    height: 100px;
    border-radius: 0
}

#slider_full-width .bx-prev:before {
    overflow: hidden;
    width: 42px;
    height: 100px;
    background: url("../image/tzz_ion-1.png") no-repeat;
    background-position: 0 0 !important;
    margin-top: 0
}

#slider_full-width .bx-next.disabled, #slider_full-width .bx-prev.disabled {
    display: block
}

#slider_full-width .bx-prev.disabled:before {
    background: url("../image/tzz_ion-1.png") 0 -100px no-repeat !important
}

#slider_full-width .bx-next.disabled:before {
    background: url("../image/tzz_ion-1.png") -58px -100px no-repeat !important
}

#slider_full-width .bx-next:before {
    overflow: hidden;
    width: 42px;
    height: 100px;
    background: url("../image/tzz_ion-1.png") no-repeat;
    background-position: -58px 0 !important;
    margin-top: 0
}

#slider_full-width .custom-list li:before {
    top: 3px
}

#slider_full-width .sfw-slide-frame {
    position: relative;
    padding-left: 60px;
    padding-right: 60px
}

#slider_full-width .bx-pager {
    display: none
}

.process-steps-section #button_container {
    text-align: center;
    padding-bottom: 30px
}

.process-steps-section #button_container a {
    cursor: pointer
}

.top-page-raq {
    padding-top: 30px
}

.top-page-raq .tpp-heading {
    padding-bottom: 30px
}

.top-page-raq .tpp-arrow-text {
    padding-bottom: 20px
}

.what-you-get-section .ff-textarea textarea {
    height: 151px
}

.extra-text-section {
    padding: 0 0 20px
}

#slider_full-width #pdf {
    position: relative;
    padding: 8px 10px 9px 46px
}

#slider_full-width #share {
    position: relative;
    padding: 8px 10px 9px 60px
}

#slider_full-width #print {
    position: relative;
    padding: 8px 10px 9px 50px
}

#slider_full-width #pdf:before {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 30px;
    height: 32px;
    position: absolute;
    top: -5px;
    left: 7px;
    content: ""
}

#slider_full-width #share:before {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 45px;
    height: 32px;
    position: absolute;
    top: -5px;
    left: 7px;
    content: ""
}

#slider_full-width #print:before {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 34px;
    height: 32px;
    position: absolute;
    top: -5px;
    left: 7px;
    content: ""
}

.questions-to-ask-intro {
    padding-top: 90px
}

.home-video-box {
    background: url("../image/tzz_ion-1.png");
    border-top: 1px solid #0079aa;
    position: relative;
    padding: 90px 0
}

.cms-intro {
    background: url("../image/tzz_ion-1.png")
}

.fwbi-img {
    display: block;
    position: relative
}

.itnc-heading {
    text-align: center;
    margin: 0 0 20px;
    font-size: 32px;
    color: #121315;
    : roboto-light-webfont, Arial, sans-serif
}

.itnc-box {
    margin-bottom: 50px
}

.itnc-box:last-child {
    margin-bottom: 0
}

.questions-to-ask-intro h3 {
    font-size: 20px
}

.top-page-panel .tpp-nav-table li a {
    padding-top: 21px;
    padding-bottom: 17px
}

.bg-section-1 {
    background: url("../image/tzz_ion-1.png")
}

.bg-section-2 {
    background: url("../image/tzz_ion-1.png")
}

.bg-section-3 {
    background: url("../image/tzz_ion-1.png")
}

.bg-section-4 {
    background: url("../image/tzz_ion-1.png")
}

.phase-section {
    position: relative;
    padding: 110px 0 140px
}

.ps-nav {
    padding: 0 5px 0 12px
}

.ps-nav .psn-item {
    float: left;
    width: 20.37238493723849%;
    margin-right: -.6276150627615063%;
    height: 150px;
    position: relative
}

.four-phases-slider .ps-nav .psn-item {
    width: 25.3654811715481125%
}

.ps-nav .psn-item a {
    text-align: center;
    display: block;
    font-size: 35px;
    text-decoration: none;
    color: #fff;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    border-radius: 5px;
    height: 100%;
    padding-top: 25px;
    position: relative
}

.ps-nav .psn-item a em {
    font-style: normal
}

.ps-nav .psn-item a.active:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 19px 26px 0;
    content: "";
    position: absolute;
    left: 50%;
    bottom: -19px;
    margin-left: -26px
}

.ps-nav .psn-item-1 a.active:after {
    border-color: #009ddc transparent transparent
}

.ps-nav .psn-item-2 a.active:after {
    border-color: #0078ae transparent transparent
}

.ps-nav .psn-item-3 a.active:after {
    border-color: #006b9b transparent transparent
}

.ps-nav .psn-item-4 a.active:after {
    border-color: #005981 transparent transparent
}

.ps-nav .psn-item-5 a.active:after {
    border-color: #003b55 transparent transparent
}

.ps-nav .psn-item a span {
    display: block;
    font-size: 24px;
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif
}

.ps-nav.ps-nav__2 .psn-item a span {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.ps-nav .psn-item-1 {
    z-index: 5
}

.ps-nav .psn-item-2 {
    z-index: 4
}

.ps-nav .psn-item-3 {
    z-index: 3
}

.ps-nav .psn-item-4 {
    z-index: 2
}

.ps-nav .psn-item-5 {
    z-index: 1
}

.ps-nav .psn-item-1 a {
    background: #009ddc
}

.ps-nav .psn-item-2 a {
    background: #0078ae
}

.ps-nav .psn-item-3 a {
    background: #006b9b
}

.ps-nav .psn-item-4 a {
    background: #005981
}

.ps-nav .psn-item-5 a {
    background: #003b55
}

.ps-nav__1 .psn-item a b {
    display: none
}

.ps-nav__1 .psn-item a {
    font-size: 32px
}

.ps-nav__2 .psn-item a {
    padding-top: 0 !important;
    display: table;
    width: 100%
}

.ps-nav__2 .psn-item a span {
    display: table-cell;
    vertical-align: middle
}

.ps-content {
    background: #fff;
    padding: 142px 49px 40px;
    margin-top: -70px;
    font-size: 17px;
    line-height: 24px;
    color: #5a6063;
    text-align: center;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .3);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .3)
}

.psc-lead {
    border-bottom: 1px solid #bfbfbf;
    padding: 0 200px 35px;
    position: relative
}

.psc-lead h3 {
    font-size: 50px;
    line-height: 1;
    color: #0078ae;
    margin: 0 0 20px;
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif
}

.psc-text {
    font-size: 15px;
    line-height: 30px;
    padding: 40px 120px
}

.psc-item .last {
    padding: 40px 120px 0
}

.ps-content .bx-wrapper .bx-controls-direction a.disabled {
    display: block;
    pointer-events: none
}

.ps-content .bx-controls-direction a {
    height: 80px;
    top: 0;
    z-index: 10;
    border-radius: 0
}

.ps-content .bx-controls-direction a:before, .ps-content .bx-controls-direction a:hover:before {
    width: 32px;
    height: 73px;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.ps-content .bx-controls-direction a.bx-prev {
    left: -19px
}

.ps-content .bx-controls-direction a.bx-next {
    right: -11px
}

.ps-content .bx-controls-direction a.bx-prev:before {
    background: url("../image/tzz_ion-1.png") 0 -226px no-repeat #fff
}

.ps-content .bx-controls-direction a.bx-next:before {
    background: url("../image/tzz_ion-1.png") 0 -151px no-repeat #fff
}

.ps-content .bx-controls-direction a.bx-prev.disabled:before {
    background: url("../image/tzz_ion-1.png") no-repeat #fff
}

.ps-content .bx-controls-direction a.bx-next.disabled:before {
    background: url("../image/tzz_ion-1.png") 0 -74px no-repeat #fff
}

.ps-content .btn-simple {
    padding: 15px 50px;
    border-radius: 25px
}

.ps-content .btn-simple:after {
    content: "Â»";
    display: inline-block;
    font: 28px/1 roboto-bold-webfont, sans-serif;
    left: 0;
    margin: -9px 0 0 6px;
    position: relative;
    vertical-align: top;
    top: 2px
}

.psc-text .two-cols .col {
    float: left;
    width: 50%;
    text-align: left;
    font-size: 15px;
    line-height: 18px
}

.psc-text .two-cols .col:nth-child(2) {
    float: right;
    width: 47%
}

.ps-content .psc-text-full {
    padding-left: 0;
    padding-right: 0
}

.psc-text .two-cols .col h4 {
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
    color: #0078ae;
    margin: 0 0 10px
}

.psc-text .two-cols .col p {
    margin: 0 0 20px
}

.psc-holder {
    width: 100%
}

.ps-content .bx-controls {
    position: absolute;
    top: 0;
    z-index: 50;
    width: 100%
}

.ps-nav-over .psn-item a {
    padding-top: 15px
}

.ps-nav-over .psn-item a span {
    font-size: 20px
}

.wrapper .nsb-1 {
    border-color: #f7f7f7
}

.wrapper .nsb-2 {
    border-color: #e6e6e6
}

.wrapper .nsb-3 {
    border-color: #dfe4e5
}

.wrapper .nsb-4 {
    border-color: #f0f0f0
}

.wrapper .nsb-5 {
    border-color: #03354c
}

.wrapper .nsb-6 {
    border-color: #13171c
}

.box-shadow-holder {
    font-size: 18px;
    line-height: 28px;
    color: #5a6063;
    padding-bottom: 50px;
    margin-bottom: 40px
}

.box-shadow-holder h3 {
    font-size: 28px;
    color: #0078ae;
    display: inline;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.box-shadow-holder h3 span {
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif
}

.box-shadow-holder p {
    display: inline
}

.box-shadow-holder.left img {
    float: left;
    margin-right: 40px
}

.box-shadow-holder.left .bsh-text {
    padding-right: 50px
}

.box-shadow-holder.right img {
    float: right;
    margin-left: 60px
}

.box-shadow-holder .bsh-text {
    padding-top: 30px;
    overflow: hidden
}

.box-shadow-holder {
    background: url("../image/tzz_ion-1.png") 0 100% no-repeat
}

.box-shadow-holder2 {
    background: url("../image/tzz_ion-1.png") -40px 100% no-repeat
}

.bsh__1 {
    padding-bottom: 32px
}

.bsh__1:nth-child(odd) {
    background: url("../image/tzz_ion-1.png") -40px 100% no-repeat
}

.bsh__1 .bsh-text {
    font-size: 15px
}

.bsh__1 .bsh-text strong {
    color: #0078ae
}

.box-shadow-holder:last-child {
    background: 0 0;
    margin-bottom: 0;
    padding-bottom: 0
}

.seo-section {
    position: relative;
    padding: 110px 0 140px
}

.seo-intro-block .intro-fl-image {
    margin-top: -30px
}

.num-list li {
    margin-bottom: 10px
}

.num-list li > span {
    display: inline-block;
    background: #ededed;
    color: #0078ae;
    padding: 0 8px;
    line-height: 22px;
    border-radius: 50%;
    font-weight: 700;
    margin-right: 8px
}

.st-icon-box img {
    float: left;
    margin-right: 12px
}

.st-icon-box .stib-content {
    overflow: hidden;
    padding-top: 20px
}

.st-icon-box .fancy-line {
    margin: 0
}

.st-list-box {
    background: url("../image/tzz_ion-1.png") 33px 0 no-repeat;
    padding: 3px 0 0 76px
}

.smm-section .box-shadow-holder .bsh-text {
    padding-top: 0
}

.smm-section .box-shadow-holder:nth-child(odd), .smm-section .shadow-right {
    background: url("../image/tzz_ion-1.png") 0 100% no-repeat
}

.smm-section .shadow-right:last-child {
    background: 0 0
}

.smm-section .leverage-smm {
    padding-bottom: 60px
}

.icons-list h4 {
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 17px;
    color: #0078ae;
    padding-top: 4px
}

.icons-list .st-icon-box .stib-content {
    padding-top: 0
}

.icons-list .st-icon-box {
    margin-bottom: 20px
}

.icons-list .st-column .st-icon-box:last-child {
    margin-bottom: 0
}

.smm-section2 .fancy-line {
    margin: 20px 0
}

.st-column-boxed h3 {
    font-size: 20px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    color: #0078ae;
    margin: 0 0 20px
}

.st-column-boxed h3 span {
    color: #8fc33e
}

.rounded-content-box {
    background: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 20px;
    position: relative
}

.rounded-content-box h4 {
    padding-top: 0;
    color: #009ddc;
    font-size: 17px
}

.rounded-content-box ul li {
    background: url("../image/tzz_ion-1.png") 9px 4px no-repeat;
    padding: 0 0 0 44px;
    margin-bottom: 10px
}

.rounded-content-box ul li:last-child {
    margin-bottom: 0
}

.d-table {
    display: table
}

.rounded-content-box p:last-child {
    margin-bottom: 0 !important
}

.box-shadow-holder img.num {
    float: left;
    margin-right: 25px;
    margin-left: 0
}

.testimonials-line {
    margin: 0 0 40px;
    border-color: #d1d2d4;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 1)
}

.online-marketing-section {
    position: relative
}

.oms-sub-section {
    padding: 70px 0 40px
}

.oms-sub-section:last-child {
    padding-bottom: 100px
}

.oms-item {
    float: left;
    width: 50%;
    text-align: center;
    padding: 0 20px
}

.oms-item > img {
    display: block;
    margin: 0 auto 20px
}

.oms-item h2, .oms-item h2 a {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 30px;
    color: #0078ae
}

.oms-item a:hover h2 {
    color: #90C43E
}

.oms-item h2 {
    margin: 0 0 10px
}

.oms-item p {
    font-size: 15px;
    line-height: 24px;
    color: #5a6063;
    margin: 0 0 16px
}

.oms-item .more-link {
    color: #90c43e;
    line-height: 25px
}

.oms-item .more-link:hover {
    color: #0078ae
}

.oms-item .more-link:after {
    vertical-align: text-bottom
}

.three-phase-section {
    padding-top: 0;
    position: static
}

.three-phase-section .blue-middle-box {
    margin-bottom: 20px
}

.three-phase-section .section-title h2 {
    color: #fff !important
}

.three-phases-slider .ps-nav .psn-item {
    width: 33.37238493723849%
}

.three-phase-section .ps-nav .psn-item {
    height: 245px;
    width: 33.37238493723849%
}

.three-phase-section .ps-nav .psn-item a {
    padding-top: 40px;
    font-size: 35px;
    padding-left: 20px;
    padding-right: 20px
}

.three-phase-section .ps-nav .psn-item a span {
    font-size: 35px
}

.three-phase-section .ps-content {
    margin-top: -195px;
    padding-top: 240px
}

.three-phase-section .psc-lead {
    padding-left: 100px;
    padding-right: 100px;
    border-bottom: 0
}

.pscl__1 {
    border-bottom: 0;
    padding-left: 130px;
    padding-right: 130px
}

.tps__1 .psn-item a {
    font-size: 35px
}

.tps__1 .psn-item a span {
    font-size: 22px
}

.three-phase-section .bx-controls {
    display: none
}

.three-phase-section .ps-nav .psn-item a em {
    position: absolute;
    width: 68px;
    height: 68px;
    line-height: 68px;
    border: 3px solid #fff;
    color: #fff;
    text-align: center;
    background: #88ba00;
    border-radius: 50%;
    top: -40px;
    left: 50%;
    margin-left: -34px;
    font-style: normal;
    font-size: 48px
}

.three-phase-section .phase-slider-holder {
    padding-top: 60px;
    position: relative
}

.three-phase-section .phase-slider-holder .step-arrow {
    position: absolute;
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 95px;
    height: 25px;
    top: 10px;
    left: 29%
}

.three-phase-section .phase-slider-holder .step2 {
    left: 62%
}

.static-section {
    position: static !important;
    padding-top: 0
}

.bsh__1 .bsh-text h3 {
    display: block;
    margin-bottom: 20px
}

.bshm__1 .bsh-text, .psclm__1 .bsh-text {
    padding-top: 28px
}

.pt-section {
    padding-top: 110px
}

body > iframe {
    display: none
}

.page-team-bg {
    background: url("../image/tzz_ion-1.jpg") 0 0/cover no-repeat;
    color: #fff
}

.page-team-bg h2, .page-team-bg h3 {
    color: #fff
}

.page-team-bg h3 {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 35px;
    line-height: 41px
}

.page-team-bg h3 span {
    font-size: 20px;
    display: block;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

.benefits-section {
    position: relative;
    padding: 110px 0 50px;
    color: #fff;
    background: url("../image/tzz_ion-1.png")
}

.benefits-section .bs-item {
    display: inline-block;
    width: 25%;
    margin: 0 -4px 60px 0;
    vertical-align: top
}

.benefits-section .bsi-content {
    font-size: 15px;
    line-height: 24px;
    color: #fff;
    text-align: center;
    padding: 0 10px
}

.benefits-section .bsi-content img {
    display: block;
    margin: 0 auto 25px
}

.benefits-section .bsi-content h3 {
    font-size: 25px;
    line-height: 32px;
    font-weight: 700;
    margin: 0 0 10px
}

.raq-logos-section {
    padding: 65px 0 55px;
    background: url("../image/tzz_ion-1.jpg");
    border-top: 1px solid #FFF
}

.raq-logos {
    font-size: 0
}

.raq-logos-section .raq-logo-item {
    display: inline-block;
    vertical-align: top;
    width: 25%;
    text-align: center
}

.raq-logos-section .raq-logo-item span {
    display: block;
    font-size: 14px;
    margin-bottom: 25px;
    color: #5a6063
}

.raq-logos-section .raq-logo-item em {
    font-style: normal;
    color: #0078ae;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.raq-logos-section .raq-logo-item img {
    margin: 0 auto;
    display: block;
    max-width: 100%;
    height: auto
}

.job-section {
    background: #fff;
    padding: 110px 0 60px;
    position: relative
}

.job-section .js-items {
    font-size: 0
}

.job-section .js-item {
    display: inline-block;
    vertical-align: top;
    width: 33.33%;
    font-size: 15px;
    line-height: 20px;
    color: #5a6063;
    margin: 0 0 40px
}

.job-section .js-item:nth-child(3n+1) {
    padding-right: 17px
}

.job-section .js-item:nth-child(3n-1) {
    padding: 0 17px
}

.job-section .js-item:nth-child(3n) {
    padding: 0 0 0 17px
}

.job-section .js-item h3 {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 35px;
    color: #0078ae;
    margin: 0 0 15px
}

.job-section .js-item h3 a {
    text-decoration: none;
    color: #0078ae
}

.job-section .js-item h3 a:hover {
    color: #90C404
}

.job-section .js-item p {
    margin: 0 0 20px
}

.job-section .jsi-position {
    display: block;
    color: #5a6063;
    font-weight: 700;
    font-size: 22px;
    background: #f5f5f5;
    padding: 25px 17px;
    margin-bottom: 20px
}

.job-section .jsi-more {
    display: inline-block;
    font: 16px/1 roboto-bold-webfont, sans-serif;
    color: #90c404;
    text-transform: uppercase;
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.job-section .jsi-more:after {
    display: inline-block;
    vertical-align: top;
    content: "Â»";
    font-size: 25px;
    line-height: 25px;
    margin: -7px 0 0 7px;
    position: relative;
    left: 0;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear
}

.job-section .jsi-more:hover:after {
    left: 3px
}

.job-section .js-title {
    padding: 15px 22px;
    font-size: 15px;
    color: #5a6063;
    position: relative;
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -webkit-linear-gradient(bottom, #dbdbdb, #ededed 55%, #fafafa);
    background-image: -moz-linear-gradient(bottom, #dbdbdb, #ededed 55%, #fafafa);
    background-image: linear-gradient(to top, #dbdbdb, #ededed 55%, #fafafa)
}

.job-section .js-title:hover {
    background: #f5f5f5
}

.job-section .js-title:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 22px;
    width: 34px;
    height: 34px;
    margin-top: -17px;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.job-section .js-title.opened {
    color: #fff;
    background-color: #f5f5f5;
    background-image: -webkit-linear-gradient(bottom, #0078ae, #009ddc);
    background-image: -moz-linear-gradient(bottom, #0078ae, #009ddc);
    background-image: linear-gradient(to top, #0078ae, #009ddc)
}

.job-section .js-title.opened:after {
    background: url("../image/tzz_ion-1.png") 0 -34px no-repeat
}

.job-section .js-title strong {
    display: block;
    font-size: 18px;
    margin: 0 0 10px;
    color: #0078ae
}

.job-section .js-title.opened strong {
    color: #fff
}

.job-section .js-nav {
    display: none
}

.job-section .js-nav > strong {
    display: block;
    text-align: center;
    font-size: 25px;
    margin-bottom: 20px;
    color: #0078ae
}

.job-section .js-nav .js-item h3 {
    margin-top: 0 !important
}

.text-section.ts__2 .next-step {
    border: 8px solid #f7f7f7
}

.text-section.ts__2 .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.text-section.ts__1 .next-step {
    border: 8px solid #005f8b
}

.text-section.ts__1 .next-step:after {
    background: url("../image/tzz_ion-1.png")
}

.text-section.ts__1 .section-title {
    max-width: 708px;
    margin: 0 auto
}

.text-section.ts__1 .section-title h2 {
    color: #0078ae;
    margin: 0 0 45px
}

.text-section.ts__1 p {
    font-size: 22px;
    line-height: 40px;
    : roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #5a6063;
    text-shadow: none;
    margin: 0 0 60px
}

.text-section.ts__1 p:last-child {
    margin-bottom: 0
}

.text-section.ts__1 .preview-columns {
    margin-bottom: 60px
}

.text-section.ts__1 .preview-aside {
    width: 294px;
    padding-right: 1px
}

.text-section.ts__1 .preview-aside img {
    box-shadow: none
}

.text-section.ts__1 .preview-columns span.website-tag {
    top: 17px;
    padding-right: 18px
}

.text-section.ts__1 .preview-columns .arrow-from-to {
    top: 95px;
    right: -50px
}

.text-section.ts__2 {
    background: url("../image/tzz_ion-1.png")
}

.text-section.ts__2 h2 {
    margin: 0 0 30px
}

.text-section.ts__2 p {
    font-size: 22px;
    line-height: 40px;
    : roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    text-shadow: none;
    margin: 0 0 60px
}

.text-section.ts__2 p strong {
    : roboto-bold-webfont, Arial, Helvetica, sans-serif
}

.text-section.ts__2 p:last-child {
    margin: 0
}

.btn-separator-holder {
    position: relative;
    border-top: 1px solid #000;
    padding: 25px 0;
    overflow: hidden
}

.btn-separator-holder:after {
    background: #20272e;
    content: " ";
    height: 1px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.result-section {
    position: relative;
    padding: 90px 0;
    background: url("../image/tzz_ion-1.png")
}

.result-section .rs-items {
    padding: 130px 0 0
}

.result-section .rs-item {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 324px;
    height: 211px;
    position: relative;
    float: left;
    margin-right: 4px
}

.result-section .rs-item-diff {
    height: 268px;
    background-position: -324px 0
}

.result-section .rs-item:last-child {
    margin-right: 0
}

.result-section .rectangles, .result-section .rs-item .shapes {
    position: absolute;
    width: 100%;
    left: 0;
    top: 119px
}

.result-section .rectangles-diff {
    top: 80px
}

.result-section .rs-item .shape-1 {
    color: #fff;
    text-align: center;
    font-size: 25px;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    position: absolute;
    top: -146px;
    left: 0;
    width: 100%
}

.result-section .rs-item .shape-1:before {
    position: absolute;
    left: 56px;
    top: -84px;
    width: 207px;
    height: 207px;
    background: rgba(0, 120, 174, .7);
    content: '';
    border-radius: 50%;
    z-index: 3
}

.result-section .rs-item .shape-1-btm:before {
    top: -68px
}

.result-section .rs-item .shape-1-btm i {
    top: 94px
}

.result-section .rs-item i {
    font-style: normal;
    z-index: 10;
    position: relative
}

.result-section .rs-item .shape-2 {
    color: #fff;
    text-align: center;
    font-size: 22px;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    position: absolute;
    top: -53px;
    left: 0;
    width: 100%
}

.result-section .rs-item .shape-2:before {
    position: absolute;
    left: 121px;
    top: -25px;
    width: 78px;
    height: 78px;
    background: rgba(144, 196, 4, 1);
    content: '';
    border-radius: 50%;
    z-index: 4
}

.result-section .rs-item .shape-2:after {
    position: absolute;
    left: 95px;
    top: -138px;
    width: 130px;
    height: 130px;
    background: rgba(255, 255, 255, .16);
    content: '';
    border-radius: 50%;
    z-index: 4
}

.result-section .rs-item .shape-2-center {
    color: #fff;
    text-align: center;
    font-size: 22px;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    position: absolute;
    top: -116px;
    left: 0;
    width: 100%
}

.result-section .rs-item .shape-2-center:before {
    position: absolute;
    left: 118px;
    top: -37px;
    width: 88px;
    height: 88px;
    background: rgba(144, 196, 4, 1);
    content: '';
    border-radius: 50%;
    z-index: 4
}

.result-section .shape-2-center i {
    top: -5px
}

.result-section .rs-item .text {
    position: absolute;
    top: 151px;
    left: 0;
    width: 100%;
    color: #fff;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

.result-section-alt .rs-item .text {
    top: 140px
}

.result-section-alt .rs-item .text-vam {
    top: 153px
}

.result-section .rs-item .text-diff {
    text-transform: none;
    top: 108px;
    line-height: 1.4
}

.result-section .shapes .arrow {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 17px;
    height: 30px;
    position: absolute;
    top: -112px;
    left: 152px;
    z-index: 10
}

.result-section .rectangle-1 {
    position: absolute;
    left: 66px;
    bottom: 0;
    width: 92px;
    background: rgba(0, 120, 174, .7)
}

.result-section .rectangle-2 {
    position: absolute;
    left: 158px;
    bottom: 0;
    width: 100px;
    background: rgba(144, 196, 4, 1)
}

.result-section .rectangle-3 {
    position: absolute;
    left: 112px;
    bottom: 0;
    width: 100px;
    background: rgba(255, 255, 255, .13)
}

.result-section .arrow-rectangle {
    position: absolute;
    left: 52px;
    bottom: 0;
    width: 40px;
    background: #055a82
}

.result-section .arrow-rectangle:before {
    position: absolute;
    top: -27px;
    left: 50%;
    margin-left: -28px;
    width: 0;
    height: 0;
    border-left: 28px solid transparent;
    border-right: 28px solid transparent;
    border-bottom: 28px solid #055a82;
    content: ""
}

.result-section .arrow-rectangle:nth-child(2) {
    left: 109px;
    background: #057e82
}

.result-section .arrow-rectangle:nth-child(2):before {
    border-bottom-color: #057e82
}

.result-section .arrow-rectangle:nth-child(3) {
    left: 167px;
    background: #298c55
}

.result-section .arrow-rectangle:nth-child(3):before {
    border-bottom-color: #298c55
}

.result-section .arrow-rectangle:nth-child(4) {
    left: 228px;
    background: #90c404
}

.result-section .arrow-rectangle:nth-child(4):before {
    border-bottom-color: #90c404
}

.result-section .rectangles .arrow {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 42px;
    height: 40px;
    position: absolute;
    left: 141px;
    z-index: 10
}

.result-section .rectangles i {
    position: absolute;
    left: 0;
    width: 100%;
    color: #fff;
    text-align: center;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 25px;
    font-style: normal
}

.result-section .rectangle, .result-section .rectangles .arrow, .result-section .rectangles i {
    opacity: 0
}

.result-graph {
    position: absolute;
    top: -118px;
    left: 32px;
    width: 260px;
    height: 198px;
    text-align: center
}

.rg-point {
    position: absolute;
    left: 0;
    bottom: -4px;
    font: 25px/1 roboto-medium-webfont, sans-serif;
    color: #fff
}

.rg-point2 {
    left: auto;
    right: 0
}

.rs-blocks {
    padding: 70px 0 30px
}

.rs-blocks-alt {
    padding-top: 10px;
    padding-bottom: 50px
}

.rs-blocks .rs-block {
    float: left;
    width: 25%;
    : roboto-regular-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 17px;
    line-height: 24px;
    text-align: center;
    color: #fff;
    min-height: 120px;
    border-right: 1px solid rgba(255, 255, 255, .3);
    padding: 0 17px
}

.rs-blocks .rs-block p strong {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.rs-blocks .rs-block:last-child {
    border-right: 0
}

.rs-blocks-alt .rs-block {
    width: 32%
}

.rs-blocks-alt .rs-block:first-child, .rs-blocks-alt .rs-block:last-child {
    width: 18%
}

.rs-blocks-diff .rs-block {
    width: 24%
}

.rs-blocks-diff .rs-block:first-child {
    width: 28%
}

.rs-blocks-three .rs-block {
    width: 33.3%
}

.rs-blocks-two .rs-block {
    width: 50%
}

.rs-blocks .rs-block span {
    display: block;
    font-size: 72px;
    line-height: 1;
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif
}

.rs-title {
    text-align: center;
    color: #fff;
    font: 24px robotoregular, sans-serif;
    margin: 0 0 24px
}

.page-intro-center-holder .page-intro-center {
    padding-bottom: 60px
}

.page-intro-center-holder h3 span {
    : roboto-bold-webfont, Arial, Helvetica, sans-serif
}

.da-section {
    position: relative;
    background: url("../image/tzz_ion-1.png");
    padding: 120px 22px 85px
}

.da-section .frame {
    background: #fff;
    border-radius: 5px;
    padding-bottom: 35px
}

.da-section .page-intro-center {
    font-size: 17px;
    line-height: 24px
}

.das-item {
    padding: 35px 31px;
    font-size: 15px;
    line-height: 24px;
    color: #5a6063;
    position: relative;
    border-bottom: 1px solid #ebebeb
}

.das-items .das-item:nth-child(odd) {
    background: #f5f5f5
}

.das-items .das-item:nth-child(1) {
    border-top: 1px solid #ebebeb
}

.ddas-items .das-item:last-child {
    border-bottom: 1px solid #f3f3f3
}

.das-item .tn {
    float: left;
    margin-right: 47px
}

.das-item .das-content {
    overflow: hidden;
    padding-bottom: 40px
}

.das-item .das-content .das-title, .das-item .das-content h3 {
    margin: 0 0 15px;
    color: #0078ae;
    font-size: 28px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.das-item .das-content .das-title a, .das-item .das-content h3 a {
    color: #0078ae;
    text-decoration: none
}

.das-item .das-content .das-title a:hover, .das-item .das-content h3 a:hover {
    color: #90c404
}

.das-item .das-content .das-title span, .das-item .das-content h3 span {
    color: #009ddc;
    display: inline-block;
    padding: 0 0 0 21px;
    font-size: 15px;
    : Arial, Helvetica, Sans-Serif
}

.das-item .das-content .das-title span em, .das-item .das-content .das-title span i, .das-item .das-content h3 span em, .das-item .das-content h3 span i {
    font-style: normal;
    color: #90c404
}

.das-item .btn-green {
    position: absolute;
    left: 325px;
    bottom: 35px;
    padding: 8px 43px 7px 24px;
    border-radius: 16px
}

.das-item .btn-green:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    position: absolute;
    right: 7px;
    top: 4px;
    width: 24px;
    height: 24px;
    content: ""
}

.da-section .page-intro-center .pic-subtext, .da-section .page-intro-center h3 {
    margin: 0;
    font-size: 17px;
    line-height: 24px;
    : Arial, Helvetica, Sans-Serif
}

.stats-section {
    padding: 80px 22px 40px;
    position: relative
}

.stats-section:nth-child(2n+1) {
    padding: 40px 22px
}

.stats-section:last-child {
    padding-bottom: 100px;
    padding-top: 40px
}

.stats-section-item {
    text-align: center;
    font-size: 20px;
    color: #5a6063;
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif
}

.stats-section-item .ssi-title, .stats-section-item h2 {
    font-size: 28px;
    color: #0078ae;
    margin: 0 0 10px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.stats-section-item strong {
    font-size: 20px;
    color: #009ddc;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.stats-section-item p strong {
    color: #5a6063
}

.stats-section-item img {
    margin: 30px 0 0;
    display: block;
    max-width: 100%;
    height: auto
}

.tpp-cut-nav .tpp-nav li {
    min-width: 0 !important
}

.tpp-cut-nav .tpp-nav li a {
    font-size: 12px
}

.tpp--resources .ttl, .tpp--resources h5 {
    font-size: 38px
}

.tpp-heading--resources {
    padding: 20px 0 10px
}

.chart-note {
    background: #fff;
    padding: 22px 22px 32px;
    text-align: center;
    position: relative;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 0 0 7px 7px;
    font-size: 15px
}

.chart-note:after {
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 99%;
    height: 16px;
    content: "";
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    background: url("../image/tzz_ion-1.png") 50% 0/100% 100% no-repeat
}

.chart-note strong {
    font-size: 15px
}

.stat-box {
    margin: 30px 0 0;
    padding: 40px 0;
    border-radius: 7px 7px 0 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .12);
    border-bottom: 0
}

.stat-box .st-item {
    padding: 24px 82px 0
}

.stat-box .st-item:first-child {
    padding-top: 40px
}

.stat-box .st-item strong {
    text-align: left;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 15px;
    display: block;
    margin-bottom: 10px;
    color: #45B3E7
}

.stat-box .sti-line span {
    float: left;
    color: #fff;
    font-size: 12px;
    height: 34px;
    line-height: 34px;
    text-align: right;
    padding: 0 10px 0 4px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.stat-box .sti-line span em {
    font-style: normal
}

.stat-box .sti-line .blue {
    background: #0075aa
}

.stat-box .sti-line .orange {
    background: #f7941d
}

.stat-box .sti-line .green {
    background: #8fc205
}

.stat-box .sti-line .gray {
    background: #3e3e3e
}

.chart-description {
    background: #fff;
    padding: 0 82px 26px;
    border-left: 1px solid rgba(0, 0, 0, .12);
    border-right: 1px solid rgba(0, 0, 0, .12)
}

.chart-description span {
    position: relative;
    margin-left: 30px;
    float: left
}

.chart-description span:before {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 8px;
    content: '';
    vertical-align: -2px
}

.chart-description .fr {
    float: right;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 12px
}

.chart-description .more {
    color: #006a9a
}

.chart-description .more:before {
    background: #006a9a
}

.chart-description .same {
    color: #f7941d
}

.chart-description .same:before {
    background: #f7941d
}

.chart-description .less {
    color: #8fc205
}

.chart-description .less:before {
    background: #8fc205
}

.chart-description .dont-use {
    color: #3e3e3e
}

.chart-description .dont-use:before {
    background: #3e3e3e
}

.stat-box.st_block .sti-line span {
    float: none;
    display: block
}

.stat-box.st_img img {
    display: block;
    margin: 0 auto
}

.stat-box.st_img .img-mobile, html.no-flash .holder-404, html.no-flash .tpp-heading strong {
    display: none
}

html.no-flash .cs-wide-section {
    padding-top: 20px
}

.search-container .top-page-panel {
    padding: 30px 0 34px;
    text-align: center
}

.search-container .top-page-panel h5 {
    float: none;
    font-size: 47px
}

.search-container .sc-top {
    background: #fff;
    padding: 20px 0 0
}

.search-container .sc-panel {
    border-top: 1px solid #e4e5e5;
    padding: 13px 0 14px
}

.search-container .page-search-box {
    margin-bottom: 15px
}

.search-container #cse-search-box input[type=text] {
    height: 62px;
    background: #fff;
    : Arial, Helvetica, Sans-Serif;
    font-size: 17px;
    font-weight: 400;
    color: #5a6063;
    text-transform: none;
    width: 731px;
    padding-left: 31px !important;
    padding-right: 60px !important
}

.search-container #cse-search-box .ff-btn-submit {
    width: 224px;
    height: 60px;
    border-radius: 7px;
    background-color: #0a4f82;
    background-image: -webkit-linear-gradient(bottom, #88ba00, #a2d90c);
    background-image: -moz-linear-gradient(bottom, #88ba00, #a2d90c);
    background-image: -o-linear-gradient(bottom, #88ba00, #a2d90c);
    background-image: linear-gradient(to top, #88ba00, #a2d90c);
    text-shadow: -1px 0 rgba(85, 116, 0, .8)
}

.search-container .sc-nav {
    float: left;
    padding: 4px 0 0;
    text-transform: uppercase;
    font: 700 14px/25px roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

.search-container .sc-nav li {
    float: left;
    padding: 0 17px 0 15px;
    border-left: 1px solid #dadada
}

.search-container .sc-nav li:first-child {
    padding-left: 0;
    border-left: 0
}

.search-container .sc-nav a {
    text-decoration: none;
    color: #009ddc
}

.search-container .sc-filter-result {
    float: right
}

.search-container .sc-filter {
    float: left;
    padding: 0 36px 0 0
}

.search-container .sc-filter .sc-filter-text {
    float: left;
    font-size: 16px;
    color: #5a6063;
    padding: 8px 0 0;
    margin-right: 16px
}

.search-container .select2-container {
    width: 155px;
    height: 34px
}

.search-container .select2-choice {
    width: 155px;
    height: 32px;
    line-height: 32px;
    font-size: 15px;
    color: #5a6063;
    padding-left: 16px;
    border: 1px solid rgba(193, 193, 193, .6);
    border-radius: 7px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #fff;
    -moz-box-shadow: inset 0 1px 3px rgba(133, 133, 133, .41);
    -webkit-box-shadow: inset 0 1px 3px rgba(133, 133, 133, .41);
    box-shadow: inset 0 1px 3px rgba(133, 133, 133, .41);
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDE1MyAzMiIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+PGxpbmVhckdyYWRpZW50IGlkPSJoYXQwIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjUwJSIgeTE9Ijk3JSIgeDI9IjUwJSIgeTI9IjIuOTk5OTk5OTk5OTk5OTklIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTUzIiBoZWlnaHQ9IjMyIiBmaWxsPSJ1cmwoI2hhdDApIiAvPgo8L3N2Zz4=);
    background-image: -moz-linear-gradient(bottom, #fff 3%, #fff 97%);
    background-image: -o-linear-gradient(bottom, #fff 3%, #fff 97%);
    background-image: -webkit-linear-gradient(bottom, #fff 3%, #fff 97%);
    background-image: linear-gradient(bottom, #fff 3%, #fff 97%)
}

.search-container .select2-choice .select2-arrow {
    background: 0 0;
    border: 0
}

.search-container .sc-result {
    float: left;
    font-size: 14px;
    color: #5a6063;
    padding: 40px 0 0
}

.search-container .sc-middle {
    padding: 28px 0;
    background: url("../image/tzz_ion-1.png")
}

.search-container .sc-aside {
    float: left;
    width: 224px;
    margin-right: 31px;
    background: #fff
}

.search-container .sc-aside .sc-title {
    border-top: 4px solid #0079aa;
    font: 700 17px/1 Arial, Helvetica, Sans-Serif;
    color: #0078ae;
    padding: 19px 0 12px 18px
}

.search-container .sc-aside ul, .search-container .sc-related {
    font-size: 15px;
    margin: 0 0 23px
}

.search-container .sc-aside ul li, .search-container .sc-related ul li {
    border-bottom: 1px solid #dde1e3;
    position: relative
}

.search-container .sc-aside ul li:before, .search-container .sc-related ul li:before {
    content: "";
    background: url("../image/tzz_ion-1.png") 0 -256px no-repeat;
    width: 9px;
    height: 9px;
    color: #11a4de;
    position: absolute;
    left: 18px;
    top: 17px
}

.search-container .sc-related ul li:before {
    left: 9px
}

.search-container .sc-aside ul a, .search-container .sc-related ul a {
    display: block;
    position: relative;
    padding: 12px 0 12px 37px;
    text-decoration: none;
    color: #5a6063
}

.search-container .sc-content {
    overflow: hidden
}

.search-container .search-item {
    position: relative;
    padding: 27px 0
}

.search-container .search-item:first-child {
    padding-top: 0
}

.search-container .search-item:after, .search-container .search-item:before {
    position: absolute;
    left: 0;
    height: 1px;
    width: 100%;
    content: ""
}

.search-container .search-item:before {
    background: #fff;
    bottom: 0
}

.search-container .search-item:after {
    background: #e3e4e4;
    bottom: 1px
}

.search-container .search-item .si-tn {
    margin-right: 23px;
    width: 124px;
    float: left;
    background: #fff;
    border: 1px solid #ddd
}

.search-container .search-item img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto
}

.search-container .si-content {
    overflow: hidden;
    font-size: 17px;
    color: #5a6063
}

.search-container .si-content .title {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 4px
}

.search-container .si-content .title a {
    color: #0078a9
}

.search-container .si-content p {
    margin: 0 0 7px
}

.search-container .si-content .link {
    font-size: 15px
}

.search-container .si-content .link a {
    color: #878a8c;
    text-decoration: none
}

.search-container .sc-related {
    padding: 80px 0 0
}

.search-container .sc-related .title {
    font-size: 30px;
    color: #0078ae;
    border-bottom: 4px solid #0079aa;
    padding: 0 0 5px;
    margin: 0 0 20px;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

.search-container .sc-related ul {
    float: left;
    width: 33.33%;
    padding-left: 40px
}

.search-container .sc-related ul:first-child {
    padding-left: 0
}

.search-container .sc-related ul li {
    border-bottom: 1px solid rgba(206, 212, 215, .7)
}

.search-container .sc-aside ul a, .search-container .sc-nav a, .search-container .sc-related ul a, .search-container .si-content .link a, .search-container .si-content .title a {
    -webkit-transition: color .3s ease-out, background-color .3s ease-out;
    -moz-transition: color .3s ease-out, background-color .3s ease-out;
    transition: color .3s ease-out, background-color .3s ease-out
}

.search-container .sc-aside ul a:hover, .search-container .sc-nav a:hover, .search-container .sc-related ul a:hover, .search-container .si-content .link a:hover, .search-container .si-content .title a:hover {
    color: #009ddc
}

.search-container .ch-input-field {
    position: relative
}

.search-container .clear-search {
    position: absolute;
    right: 18px;
    top: 16px;
    background: #eee;
    color: #8c2727;
    text-decoration: none;
    border-radius: 50%;
    font-size: 16px;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.search-container .clear-search:hover {
    background: #8c2727;
    color: #fff
}

.search-container .select2-choice .select2-arrow {
    width: 28px
}

.search-container .select2-choice .select2-arrow b {
    background: url("../image/tzz_ion-1.jpg") 0 50% no-repeat;
    width: 13px
}

.search-container .select2-dropdown-open .select2-arrow b {
    background: url("../image/tzz_ion-1.jpg") -13px 50% no-repeat
}

.search-container .search-message {
    font: 700 22px/1.2 Arial, Helvetica, sans-serif;
    color: #0078AE
}

::-ms-clear {
    display: none
}

::-ms-reveal {
    display: none
}

.google-search-container {
    display: inline-block;
    border: 1px solid #c1c1c1 !important;
    border-radius: 8px;
    padding: 0 60px 0 31px !important;
    height: 62px;
    background: #fff;
    width: 731px;
    box-shadow: inset 1px 1px 3px #858585;
    position: relative
}

#cse-search-box .google-search-container input[type=text] {
    background: none !important;
    box-shadow: none !important;
    border: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important
}

.fvs-container {
    margin: 0 0 20px
}

.full-video-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 36px 0 70px
}

.full-video-section .section-title h2 {
    color: #0078ae;
    text-align: center
}

.fvs-item {
    display: none
}

.fvs-item.show {
    display: block
}

.fvs-title {
    padding: 30px 10px;
    margin-bottom: -1px;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .6);
    font: 48px/1 roboto-black-webfont, sans-serif;
    background: url("../image/tzz_ion-1.png");
    position: relative;
    z-index: 2
}

.full-video-section .wide-video-holder {
    margin: 0
}

.fvs-thumbs {
    margin: 0 -.2%
}

.fvs-box {
    display: inline-block;
    vertical-align: top;
    margin: 0 .4% 20px;
    width: 32.2%;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.fvs-box.active {
    display: none
}

.fvs-video-thumb {
    position: relative
}

.fvs-video-thumb img {
    display: block;
    width: 100%;
    box-shadow: 1px 1px #a8a8a8
}

.fvs-thumb-descr {
    background: #fff;
    padding: 0;
    color: #0078ae;
    font-size: 17px;
    line-height: 1.4;
    box-shadow: 1px 1px #a8a8a8;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.thumb-descr-frame {
    padding: 24px 36px
}

.fvs-thumb-descr a {
    color: #0078ae;
    -webkit-transition: color .3s;
    transition: color .3s
}

.fvs-thumb-descr a:hover {
    color: #D57E0E
}

.fvs-box h4 {
    font: 50px/1.2 roboto-bold-webfont, sans-serif
}

.fvs-box p {
    color: #5A6063
}

.video-overlay-mob {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 99.7%;
    z-index: 4;
    background: #5A6063;
    opacity: 1;
    display: none;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.video-overlay-mob img {
    width: 100%
}

.full-video-section .fvs-player {
    opacity: 0;
    z-index: 10;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.full-video-section .video-plays .fvs-player, .mobile-mode .full-video-section .fvs-player {
    opacity: 1
}

.video-overlay-large, .video-overlay-pause {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 6;
    cursor: pointer;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.video-plays .video-overlay-large {
    opacity: 0;
    z-index: 2
}

.mobile-mode .video-overlay-large, .mobile-mode .video-plays .video-overlay-large, .video-overlay-pause {
    display: none
}

.video-plays .video-overlay-pause {
    display: block
}

.video-overlay-large:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    width: 145px;
    height: 145px;
    z-index: 20;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.wide-video-holder:hover .video-overlay-large:before {
    opacity: .6
}

.sub-video-boxes {
    position: relative;
    z-index: 20;
    padding: 0 0 30px;
    margin-top: -86px;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden
}

.sub-video-boxes:after {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 0;
    width: 180%;
    height: 30px;
    left: -40%;
    right: -40%;
    background: -webkit-radial-gradient(50% -3%, ellipse cover, rgba(00, 00, 00, .1), rgba(137, 141, 144, 0) 40%);
    background: radial-gradient(ellipse at 50% -3%, rgba(00, 00, 00, .1), rgba(137, 141, 144, 0) 40%)
}

.svb-frame {
    background: #fff;
    border-bottom: 1px solid #e1e2e2;
    border-radius: 0 0 3px 3px;
    display: table;
    width: 100%
}

.sv-box {
    display: table-cell;
    width: 33.33%;
    padding: 44px 20px;
    vertical-align: top;
    border-left: 1px solid #e3e3e3;
    font-size: 17px;
    line-height: 1.3;
    text-align: center;
    color: #5a6063
}

.sv-box:first-child {
    border-left: 0
}

.sv-box h3 {
    font: 33px/1.2 roboto-bold-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 8px
}

.sv-box p {
    margin: 0 0 16px
}

.sv-box .more-link {
    color: #90c404;
    font-size: 16px
}

.sv-box .more-link:after {
    margin-top: -7px
}

.fvs-container .wistia_embed {
    position: absolute;
    z-index: 7;
    opacity: 0;
    cursor: pointer;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.start-video .fvs-container .wistia_embed {
    opacity: 1
}

.fvs-container .wistia_embed.video-embed-overlay {
    opacity: 1;
    z-index: 5;
    width: 100% !important;
    height: 100% !important
}

.start-video .fvs-container .wistia_embed.video-embed-overlay {
    opacity: 0
}

.mm-is-menu.mm-horizontal .mm-inner > ul, html.mm-opened #mm-blocker, html.mm-opened .mm-page {
    -webkit-transition: none .4s ease;
    -moz-transition: none .4s ease;
    -o-transition: none .4s ease;
    transition: none .4s ease
}

html.mm-opened.mm-dragging .mm-page, html.mm-opened.mm-dragging.mm-front .mm-menu, html.mm-opened.mm-dragging.mm-next .mm-menu {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s
}

html.mm-opened #mm-blocker, html.mm-opened .mm-page {
    -webkit-transition-property: top, right, bottom, left, margin, border, -webkit-transform;
    -moz-transition-property: top, right, bottom, left, margin, border, -moz-transform;
    -o-transition-property: top, right, bottom, left, margin, border, -o-transform;
    transition-property: top, right, bottom, left, margin, border, transform;
    border: none solid transparent
}

html.mm-opening #mm-blocker, html.mm-opening .mm-page {
    border: none solid rgba(1, 1, 1, 0)
}

.mm-is-menu.mm-horizontal .mm-inner > ul {
    -webkit-transition-property: margin-left;
    -moz-transition-property: margin-left;
    -o-transition-property: margin-left;
    transition-property: margin-left
}

html.mm-accelerated .mm-is-menu.mm-horizontal .mm-inner > ul.mm-subopening, html.mm-accelerated.mm-opening #mm-blocker, html.mm-accelerated.mm-opening .mm-page {
    -webkit-transform: translate3d(0, 0, 1px);
    -moz-transform: translate3d(0, 0, 1px);
    -o-transform: translate3d(0, 0, 1px);
    transform: translate3d(0, 0, 1px)
}

html.mm-opened #mm-blocker, html.mm-opened .mm-page {
    margin: 0;
    left: 0;
    top: 0
}

html.mm-opening #mm-blocker, html.mm-opening .mm-page {
    margin: 0 0 0 -65px
}

.mm-is-menu ul, .mm-menu, .mm-menu .mm-inner, .mm-menu div.mm-search, .mm-menu div.mm-search input, html.mm-opened .mm-page {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box
}

html.mm-opened, html.mm-opened body {
    width: 100%;
    height: 100%;
    overflow: hidden
}

html.mm-opened body {
    position: relative
}

.mm-menu {
    display: none;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    overflow: hidden;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAABBAMAAADk0HnAAAAAD1BMVEXS1NTs7e3y8/P4+Pj8/Px+wEtqAAAADElEQVR42mNwVmQAAAEPAGUt8fqkAAAAAElFTkSuQmCC) 200px 0 repeat-y
}

.mm-menu.mm-opened {
    display: block;
    overflow: scroll;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch
}

.mm-menu.mm-opened ~ .mm-menu.mm-opened {
    display: none
}

.mm-inner {
    width: 100%;
    padding: 0 65px 0 0
}

.mm-is-menu li, .mm-is-menu ul {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0
}

.mm-is-menu li {
    position: relative
}

.mm-is-menu li:after {
    content: '';
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0
}

.mm-menu ul {
    width: 100%
}

.mob-menus > ul > li {
    border-bottom: 1px solid #f6f6f6
}

.mob-menus > ul > li > a {
    display: block;
    color: #5a6063;
    font: 17px/1.2 roboto-medium-webfont, sans-serif;
    text-transform: uppercase;
    padding: 18px 10px 16px 26px
}

.mob-menus > ul > li > a:hover {
    color: #0078ae
}

.mob-menus .secondary-menu li a {
    color: #878a8c;
    font: 16px/1.2 Arial, Helvetica, sans-serif;
    text-transform: none
}

.mm-menu a.mm-subopen {
    width: 40px;
    height: 40px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
}

.mm-menu a.mm-subopen:before {
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    left: 0
}

.mm-menu a.mm-subopen.mm-fullsubopen {
    border-left: none;
    width: 100%
}

.mm-menu a.mm-subopen.mm-fullsubopen:before {
    border-left: none
}

.mm-menu a.mm-subclose {
    text-indent: 40px;
    padding-top: 20px;
    margin-top: -20px
}

.mm-menu a.mm-subopen + a, .mm-menu a.mm-subopen + span {
    padding-right: 45px
}

html.mm-opened .mm-page {
    height: 100%;
    position: absolute
}

html.mm-background .mm-page {
    background: inherit
}

#mm-blocker {
    background: #fff;
    opacity: 0;
    display: none;
    width: 100%;
    height: 100%
}

html.mm-blocking #mm-blocker, html.mm-opened #mm-blocker {
    display: block
}

.mm-menu.mm-vertical ul ul {
    display: none;
    padding: 10px 0 10px 10px
}

.mm-menu.mm-vertical li.mm-opened > ul {
    display: block
}

.mm-menu.mm-vertical ul ul li:last-child, .mm-menu.mm-vertical ul ul li:last-child:after {
    border-bottom-width: 0
}

.mm-menu.mm-vertical li.mm-opened.mm-selected > a.mm-subopen + a, .mm-menu.mm-vertical li.mm-opened.mm-selected > a.mm-subopen + span {
    padding-right: 5px;
    margin-right: 40px
}

.mm-menu.mm-vertical li.mm-opened.mm-selected > em.mm-counter + a.mm-subopen + a, .mm-menu.mm-vertical li.mm-opened.mm-selected > em.mm-counter + a.mm-subopen + span {
    margin-right: 75px
}

.mm-menu.mm-horizontal .mm-inner {
    white-space: nowrap
}

.mm-menu.mm-horizontal ul {
    vertical-align: top;
    margin-left: 0
}

.mm-menu.mm-horizontal ul.mm-submenu {
    display: none
}

.mm-menu.mm-horizontal ul, .mm-menu.mm-horizontal ul.mm-submenu.mm-opened {
    display: inline-block
}

.mm-menu.mm-horizontal ul.mm-subopening {
    margin-left: -100%;
    max-height: 100%;
    overflow: hidden
}

.mm-is-menu {
    background: #333
}

.mm-is-menu * {
    -webkit-text-size-adjust: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    : Arial, Helvetica, sans-serif;
    font-size: 14px
}

.mm-is-menu li {
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.mm-is-menu li:after {
    border-bottom: 1px solid rgba(0, 0, 0, .4)
}

.mm-is-menu li, .mm-is-menu li > a, .mm-is-menu li > span {
    color: rgba(255, 255, 255, .5);
    text-decoration: none
}

.mm-menu li.mm-selected > a, .mm-menu li.mm-selected > span {
    background: rgba(0, 0, 0, .2)
}

.mm-menu li.mm-selected > a.mm-subopen {
    background: 0 0
}

.mm-menu a.mm-subopen {
    border-left: 1px solid rgba(255, 255, 255, .1)
}

.mm-menu a.mm-subopen:before {
    border-left: 1px solid rgba(0, 0, 0, .4)
}

.mm-menu a.mm-subclose {
    background: rgba(0, 0, 0, .2)
}

.mm-menu.mm-vertical li.mm-opened > a.mm-subopen, .mm-menu.mm-vertical li.mm-opened > ul {
    background: rgba(255, 255, 255, .06)
}

.mm-menu li.mm-label {
    text-transform: uppercase;
    text-indent: 20px;
    line-height: 25px;
    background: rgba(255, 255, 255, .1);
    font-size: 11px;
    color: rgba(255, 255, 255, .5)
}

.mm-menu em.mm-counter {
    text-indent: 0;
    text-align: center;
    text-shadow: none;
    line-height: 22px;
    display: block;
    min-width: 16px;
    height: 20px;
    padding: 0 2px;
    position: absolute;
    right: 40px;
    top: 10px
}

.mm-menu em.mm-counter + a.mm-subopen {
    padding-left: 35px
}

.mm-menu em.mm-counter + a.mm-subopen + a, .mm-menu em.mm-counter + a.mm-subopen + span {
    padding-right: 80px
}

.mm-menu em.mm-counter {
    border-radius: 5px;
    background: rgba(255, 255, 255, .1);
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    font-size: 11px;
    font-style: normal;
    color: rgba(255, 255, 255, .4)
}

.mm-menu a.mm-subclose:before, .mm-menu a.mm-subopen:after {
    content: '';
    border-width: 4px;
    border-style: solid;
    display: block;
    width: 6px;
    height: 6px;
    position: absolute;
    top: 50%;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.mm-menu a.mm-subopen:after {
    border-top: none;
    border-left: none;
    margin-top: -4px;
    right: 16px
}

.mm-menu a.mm-subclose:before {
    border-right: none;
    border-bottom: none;
    margin-top: 4px;
    left: 20px
}

.mm-menu.mm-vertical li.mm-opened > a.mm-subopen:after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg)
}

.mm-menu a.mm-subclose:before, .mm-menu a.mm-subopen:after {
    border-color: rgba(255, 255, 255, .3)
}

.mm-menu div.mm-search {
    width: 100%;
    height: 50px;
    padding: 10px;
    position: relative;
    z-index: 1
}

.mm-menu div.mm-search input {
    border: none;
    border-radius: 15px;
    line-height: 30px;
    outline: 0;
    display: block;
    width: 100%;
    height: 30px;
    margin: 0;
    padding: 0 0 0 10px
}

.mm-menu li.mm-noresults {
    border: none;
    display: none;
    padding-top: 30px
}

.mm-menu li.mm-noresults:after {
    border: none
}

.mm-menu.mm-noresults li.mm-noresults {
    display: block
}

.mm-menu .mm-noresult, .mm-menu .mm-nosubresult > a.mm-subopen, .mm-menu .mm-nosubresult > em.mm-counter {
    display: none
}

.mm-menu .mm-nosubresult > a.mm-subopen + a, .mm-menu .mm-nosubresult > a.mm-subopen + span {
    padding-right: 5px
}

.mm-menu div.mm-search {
    background: rgba(0, 0, 0, .2);
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.mm-menu div.mm-search input {
    background: rgba(255, 255, 255, .3);
    color: rgba(255, 255, 255, .9)
}

.mm-menu li.mm-noresults {
    color: rgba(255, 255, 255, .4);
    text-align: center
}

html.mm-no-overflowscrolling.mm-opened body {
    overflow: visible;
    overflow-x: hidden
}

html.mm-no-overflowscrolling.mm-opened .mm-page {
    min-height: 200%;
    position: fixed;
    top: 0;
    z-index: 3
}

html.mm-no-overflowscrolling .mm-menu {
    height: auto;
    min-height: 100%;
    overflow: default;
    overflow-x: default;
    overflow-y: default;
    position: relative;
    left: auto;
    top: auto
}

html.mm-no-overflowscrolling.mm-right .mm-menu {
    position: absolute
}

html.mm-iphone-addressbar body {
    padding-bottom: 60px
}

.mm-menu {
    width: 270px
}

.mob-menus {
    width: 205px;
    box-shadow: inset 0 2px 1px 0 #f3f3f3
}

.mob-menus .sub {
    position: relative;
    padding: 10px 10px 0;
    display: none;
    background: url("../image/tzz_ion-1.png")
}

.mob-menus .drop-open .sub {
    display: block
}

.mob-menus .sub:after {
    position: absolute;
    top: -7px;
    left: 60px;
    width: 13px;
    height: 7px;
    content: "";
    background: url("../image/tzz_ion-1.png") -250px 0 no-repeat
}

.mob-menus .sub > li {
    border: 0;
    padding: 0 0 9px
}

.mob-menus .sub > li > a {
    display: block;
    background: #0087bd;
    text-shadow: 0 -1px 0 #004c6e;
    border: 1px solid #00618a;
    border-color: #005b81 #006f9c #00618a #00648d;
    box-shadow: 1px 1px 0 0 #008fcd;
    border-radius: 4px;
    padding: 8px 15px;
    color: #fff;
    font: 17px/1 roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    position: relative;
    overflow: hidden
}

.mob-menus .sub > li > a:hover {
    color: #fff;
    background: #0ae
}

.mob-menus .sub > li > a:before {
    position: absolute;
    top: 1px;
    left: 1px;
    width: 5px;
    height: 100%;
    background: #0ae;
    content: "";
    border-radius: 0 0 3px 3px
}

.citf {
    position: relative;
    overflow: hidden
}

.citf input[type=file] {
    position: relative;
    cursor: pointer;
    outline: 0;
    padding: 0;
    margin: 0;
    font-size: 100%;
    height: 100%;
    width: 300px
}

.citf-active .citfButton {
    position: relative;
    overflow: hidden
}

.citf-active input[type=file] {
    position: absolute;
    left: 0;
    top: 0;
    filter: alpha(opacity=0);
    opacity: 0
}

.citf-active input[type=file]:active, .citf-active input[type=file]:focus, .citf-active input[type=file]:hover {
    outline: 0
}

.citf-skin-metro .citf-active {
    font-size: 16px;
    color: #fff;
    border-radius: 5px
}

.citf-skin-metro .citf-active .citfValOutput {
    overflow: hidden;
    display: block;
    height: 24px;
    line-height: 24px;
    padding: 10px
}

.citf-skin-metro .citf-active .citfBtnOutput {
    width: 120px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    text-align: center;
    right: 0;
    top: 0
}

.citf-skin-metro .citf-active .citfButton {
    position: absolute;
    width: 120px;
    height: 44px;
    right: 0;
    top: 0;
    z-index: 2
}

.citf-skin-metro.dark-green .citf-active {
    background: #166549
}

.citf-skin-metro.dark-green .citf-active .citfBtnOutput {
    background: #1b7e5a;
    border-left: 1px solid #fff
}

.citf-skin-metro.dark-green .citf-focused .citfValOutput {
    background: #1f4738
}

.citf-skin-metro.dark-blue .citf-active {
    background: #14b9d5
}

.citf-skin-metro.dark-blue .citf-active .citfValOutput {
    color: #fff
}

.citf-skin-metro.dark-blue .citf-active .citfBtnOutput {
    background: #0e778a;
    color: #fff;
    border-left: 1px solid #fff
}

.citf-skin-metro.dark-blue .citf-focused .citfValOutput {
    background: #119DB5
}

.citf-skin-metro.dark-red .citf-active {
    background: #f5696c
}

.citf-skin-metro.dark-red .citf-active .citfValOutput {
    color: #fff
}

.citf-skin-metro.dark-red .citf-active .citfBtnOutput {
    background: #af4454;
    color: #fff;
    border-left: 1px solid #fff
}

.citf-skin-metro.dark-red .citf-focused .citfValOutput {
    background: #C55256
}

.citf-skin-metro.dark-gray .citf-active {
    background: #eaedf2
}

.citf-skin-metro.dark-gray .citf-active .citfValOutput {
    color: #5e6d82
}

.citf-skin-metro.dark-gray .citf-active .citfBtnOutput {
    background: #eaedf2;
    color: #5e6d82;
    border-left: 1px solid #fff
}

.citf-skin-metro.dark-gray .citf-focused .citfValOutput {
    background: #D6D7D7
}

.row .column, .row .columns {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.container {
    margin: 0 auto;
    padding: 0 15px;
    max-width: 1008px
}


    
    
    


.row .row {
    width: auto;
    max-width: none;
    min-width: 0;
    margin: 0 -15px
}

.column, .columns {
    float: left;
    min-height: 1px;
    padding: 0 15px;
    position: relative;
    margin-bottom: 30px
}

.column.wrapper, .columns.wrapper {
    padding: 0
}

.row .one {
    width: 8.333%
}

.row .two {
    width: 16.667%
}

.row .three {
    width: 25%
}

.row .four {
    width: 33.333%
}

.row .five {
    width: 41.667%
}

.row .six {
    width: 50%
}

.row .seven {
    width: 58.333%
}

.row .eight {
    width: 66.667%
}

.row .nine {
    width: 75%
}

.row .ten {
    width: 83.333%
}

.row .eleven {
    width: 91.667%
}

.row .twelve {
    width: 100%
}


    
    
    


embed, object {
    max-width: 100%
}

.dig-agency-title {
    : roboto-light-webfont, sans-serif;
    color: #5a6063;
    text-align: center;
    padding: 80px 15px 0
}

.dig-agency-title h2 {
    font-size: 50px;
    margin: 0 0 12px
}

.dig-agency-title h2 strong {
    : roboto-bold-webfont, sans-serif;
    color: #009ddc
}

.dig-agency-title h3 {
    font: 400 28px/40px roboto-bold-webfont, sans-serif;
    position: relative;
    padding: 0
}

.dig-agency-title .subtitle {
    font-size: 28px;
    line-height: 40px;
    position: relative;
    padding: 0 0 25px
}

.dig-agency-title .subtitle:after {
    content: "";
    width: 143px;
    height: 1px;
    background: #5a6063;
    opacity: .4;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -71px
}

.employees-testim .note {
    padding: 23px 30px 30px;
    text-align: center;
    font: 700 17px Arial, sans-serif;
    color: #0078ae
}

.employees-testim .note span {
    position: relative
}

.employees-testim .note span:after {
    content: "";
    position: absolute;
    top: 8px;
    right: -51px;
    width: 48px;
    height: 29px;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.employees-testim + .infoboxes {
    padding-bottom: 0
}

.categories-testim {
    background: #fff;
    padding-bottom: 130px
}

.categories-testim > li {
    padding: 143px 0 0
}

.categories-testim > li:first-child {
    padding-top: 0
}

.categories-testim > li:nth-child(odd) {
    background: url("../image/tzz_ion-1.jpg")
}

.categories-testim .item {
    background: url("../image/tzz_ion-1.png") 140px 100% no-repeat;
    min-height: 138px;
    padding: 0 0 43px 387px;
    position: relative;
    bottom: -81px;
    font: 400 16px/22px Arial, sans-serif
}

.categories-testim .ico-category {
    position: absolute;
    left: 0;
    bottom: -25px
}

.categories-testim .title-category {
    position: absolute;
    left: 0;
    bottom: 0;
    margin-left: 175px;
    width: 200px;
    height: 136px;
    text-transform: uppercase
}

.categories-testim li:nth-child(1) .title-category {
    color: #89bb00
}

.categories-testim li:nth-child(2) .title-category {
    color: #dcc500
}

.categories-testim li:nth-child(3) .title-category {
    color: #8830a0
}

.categories-testim li:nth-child(4) .title-category {
    color: #ad2964
}

.categories-testim li:nth-child(5) .title-category {
    color: #029edd
}

.categories-testim li:nth-child(6) .title-category {
    color: #cb810b
}

.categories-testim li:nth-child(7) .title-category {
    color: #d2a781
}

.categories-testim .title-category span {
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    transform: translate(0, -50%);
    font: 35px/35px 'Roboto Bold Condensed', sans-serif
}

.categories-testim .person-txt {
    background: #fff;
    border: 1px solid #cbcbcb;
    border-radius: 10px 10px 10px 0;
    box-shadow: 0 0 1px #ccc;
    position: relative
}

.categories-testim .person-txt:before {
    content: "";
    position: absolute;
    top: 30px;
    left: 28px;
    width: 41px;
    height: 38px;
    background: url("../image/tzz_ion-1.png") -1px -1px no-repeat
}

.categories-testim li:nth-child(1) .person-txt:before {
    background-color: #89bb00
}

.categories-testim li:nth-child(2) .person-txt:before {
    background-color: #dcc500
}

.categories-testim li:nth-child(3) .person-txt:before {
    background-color: #8830a0
}

.categories-testim li:nth-child(4) .person-txt:before {
    background-color: #ad2964
}

.categories-testim li:nth-child(5) .person-txt:before {
    background-color: #029edd
}

.categories-testim li:nth-child(6) .person-txt:before {
    background-color: #cb810b
}

.categories-testim li:nth-child(7) .person-txt:before {
    background-color: #d2a781
}

.categories-testim .person-txt .person-txt-item {
    position: absolute;
    visibility: hidden;
    opacity: 0;
    width: 100%;
    min-height: 124px;
    padding: 25px 45px 25px 88px;
    -webkit-transition: opacity 1s;
    transition: opacity 1s
}

.categories-testim .person-txt .person-txt-item.active {
    position: static;
    visibility: visible;
    opacity: 1
}

.categories-testim .person-txt .person-txt-item:after {
    content: "";
    display: inline-block;
    width: 26px;
    height: 23px;
    background: url("../image/tzz_ion-1.png") -44px -1px no-repeat;
    position: absolute;
    margin: 5px 0 0 8px
}

.categories-testim li:nth-child(1) .person-txt-item:after {
    background-color: #89bb00
}

.categories-testim li:nth-child(2) .person-txt-item:after {
    background-color: #dcc500
}

.categories-testim li:nth-child(3) .person-txt-item:after {
    background-color: #8830a0
}

.categories-testim li:nth-child(4) .person-txt-item:after {
    background-color: #ad2964
}

.categories-testim li:nth-child(5) .person-txt-item:after {
    background-color: #029edd
}

.categories-testim li:nth-child(6) .person-txt-item:after {
    background-color: #cb810b
}

.categories-testim li:nth-child(7) .person-txt-item:after {
    background-color: #d2a781
}

.categories-testim .person-info {
    margin: 12px 0 0 89px;
    position: absolute;
    max-width: 235px
}

.categories-testim .person-info-item {
    display: none;
    font-size: 15px
}

.categories-testim .person-info-item.active {
    display: block
}

.categories-testim .person-info-item strong {
    display: block;
    font-size: 16px
}

.categories-testim .person-photo {
    position: absolute;
    right: 0;
    bottom: -20px;
    font: 0/0 a
}

.categories-testim .person-photo-item {
    width: 58px;
    height: 73px;
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    margin: 0 19px 0 0;
    -webkit-transition: all .4s;
    transition: all .4s
}

.categories-testim .person-photo-item.active:before {
    content: "";
    position: absolute;
    left: -18px;
    top: -6px;
    width: 33px;
    height: 37px;
    background: url("../image/tzz_ion-1.png") -71px 0 no-repeat;
    z-index: 1
}

.categories-testim .person-photo-item img {
    position: absolute;
    width: 100%;
    height: auto;
    bottom: 0;
    left: 0;
    -webkit-transition: all .4s;
    transition: all .4s
}

.categories-testim .person-photo-item.active {
    width: 74px
}

.categories-testim .person-photo-item.active img:last-child {
    opacity: 0
}

.choose-agency {
    padding: 80px 0 20px
}

.choose-agency h2 {
    font: 400 50px/55px roboto-light-webfont, sans-serif;
    text-align: center;
    color: #5a6063;
    margin: 0
}

.choose-agency h2 strong {
    display: block;
    color: #009ddc;
    : roboto-bold-webfont, sans-serif
}

.choose-agency-cont h3 {
    border-bottom: solid 4px #c5ccb2;
    border-right: solid 1px #c5ccb2;
    font: 22px/22px 'Roboto Bold Condensed', sans-serif;
    width: 20%;
    height: 83px;
    text-align: center;
    background: #f5f5f5;
    padding: 20px 15px 15px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .4s;
    position: absolute;
    top: -130px
}

.choose-agency-cont li:nth-child(1) h3 {
    color: #89bb00;
    border-bottom-color: #89bb00;
    left: 0
}

.choose-agency-cont li:nth-child(2) h3 {
    color: #dcc500;
    border-bottom-color: #dcc500;
    left: 20%
}

.choose-agency-cont li:nth-child(3) h3 {
    color: #882fa0;
    border-bottom-color: #882fa0;
    left: 40%
}

.choose-agency-cont li:nth-child(4) h3 {
    color: #019edc;
    border-bottom-color: #019edc;
    left: 60%
}

.choose-agency-cont li:nth-child(5) h3 {
    color: #cb810b;
    border-bottom-color: #cb810b;
    left: 80%
}

.choose-agency-cont h3:hover {
    background: #eee
}

.choose-agency-cont h3 span {
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 15px
}

.choose-agency-cont {
    position: relative;
    margin-top: 185px
}

.choose-agency-cont li {
    position: absolute;
    top: 0;
    left: 0
}

.choose-agency-cont li.active {
    position: static
}

.choose-agency-cont .tabs-cont {
    background: #fff;
    border-radius: 10px;
    margin-right: 125px;
    opacity: 0;
    transition: opacity .4s
}

.choose-agency-cont li.active .tabs-cont {
    opacity: 1
}

.choose-agency-cont .left {
    float: left;
    margin: -12px 36px 67px 0
}

.choose-agency-cont .left-sub {
    width: 323px;
    background: #89bb00;
    border-radius: 10px 10px 0 0;
    color: #fff;
    padding: 44px 20px 0 31px;
    font: 400 24px/32px roboto-bold-webfont, sans-serif;
    position: relative;
    z-index: 1
}

.choose-agency-cont > li:nth-child(1) .left-sub {
    background: #89bb00
}

.choose-agency-cont > li:nth-child(2) .left-sub {
    background: #dcc500
}

.choose-agency-cont > li:nth-child(3) .left-sub {
    background: #882fa0
}

.choose-agency-cont > li:nth-child(4) .left-sub {
    background: #019edc
}

.choose-agency-cont > li:nth-child(5) .left-sub {
    background: #cb810b
}

.choose-agency-cont .left:after {
    content: "";
    width: 100%;
    margin-top: -93px;
    height: 100px;
    display: block;
    background: rgba(255, 0, 0, .5);
    border-radius: 0 0 7px 7px;
    -webkit-transform: skewY(-11.4deg);
    transform: skewY(-11.4deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.choose-agency-cont > li:nth-child(1) .left:after {
    background: #89bb00
}

.choose-agency-cont > li:nth-child(2) .left:after {
    background: #dcc500
}

.choose-agency-cont > li:nth-child(3) .left:after {
    background: #882fa0
}

.choose-agency-cont > li:nth-child(4) .left:after {
    background: #019edc
}

.choose-agency-cont > li:nth-child(5) .left:after {
    background: #cb810b
}

.choose-agency-cont .right {
    position: absolute;
    right: 0;
    top: 10px
}

.choose-agency-cont .cont {
    overflow: hidden;
    padding: 38px 150px 45px 0;
    color: #5a6063;
    font: 400 16px/26px Arial, sans-serif
}

.shadow:before {
    content: "";
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABDwAAAAICAQAAAC/xyfAAAAJlklEQVR42u1bTY8kORF9z5nV3bN8roTEhQMHrvz/38GNIwcuCAkWEDPTXWk/DumPsNPOzKr+YHe1NdKoq8qODIfDES9euAiiej3g9/gdfoZnBFxxxRUBwoJAYYEH4DHhE77BBcACD4/AACFAIGZcMAHmMw9ixgQCBAQhIAAIICe4qIDiP4AkHABFjbR+SwKovwEAUXHU+h3A8n1cW8iSmJdLI4GVTJkRjLOaKdW48tfCdRghTpjLiiCmUWUFoqJGrFZB0CHOBMh1RXFVZLX23noVNVdX62TtuB1ZfzaDhM6LPYntkGy/kZS+CCrPZn5/4sW+TB0pWu1zsuWpBx1+2K67P1O7Tzm5+p9eY7OfsCfv3b0Uso4VwOD8WdkaL4d78nXiaUpy1A8Iu4vg9sO9ZwYrhDYkNXJYrU8lJKXYqBxJZd+tXwmAi6tbYyzjgWLOQ9UhE0AEeKPqrPHOFh0FgNLQI9idqjxX3Rkyh1/GmdIo13yZYmowVmWzSyE+j6J5XvpGQsw0ycYBHpID4OCMbT0WCBMIB8LBCfC4YokZdv1swoQZwBWf8QUeE4AJMwinGYTDBRdc4PCI/+Kv+AteOudgY70HfIvf4td4AhDg8YIrPBau6gZ4eDg84AnzChwYECLICFFBR5eTbN5yAsSUjanibXHpCXp0ExqtQ29TnHVmGZBxlFLUPI8N6CHYnrehxCvtpk8VvAHTyZyiKYL1rfWYxVNitE/asftsbpI+T0U+KJpZxpLNgeJxKBaPbXLy++o5rgJR2gjQUCo7oOr+PMbTmr/2xbOWegNtvm+ghu+qoCpH1YeZa3BmTuNpbd+p9wDuqqBO8rtzjRodPe3pI1XnSaa4kA1HGmqjVHqFvJM5UsokMQFCsPqpFI/BoiLM2oJSwog8hIB7UE3VeG4XdFjlUAWMmGIsxUO1PpIBibraq86vJSElCd74VyIDVuIgKGX0FYw4OEBCwIKveEHAhAkuzpo14YIHTHAAvuI7/A3/3ICOg8RxibzGN/glLnCYsHIeAR4LV/gRAEwgJky4pBqfZaPT4lbGouIPCncRE3Iaa10yZBSi9N5wBqmm1k4gEwA3LCzUcQ6y3syR+3Q9kIn3QOY3LM5cQUVJr84UJhk6kZGFKZhEbSgyDMqIkalWx900ypPVNse20FFG5DEH8TYJlsOdGdd63GMk9AqdOrHtbFX7fnjnVsn6nsm/FW+01Jvey7qtp4i7hAJvFaw30W1wYnUXQDoYpy3L02MHUsqnlLOENjsXgYsqbZXygnIVnaREHl2hOlOXbMywz140nAzP8EsNfmKDvrh7vtMnQYMyq+XiZdkOh6r8lqv0z4X+mnPyTKupImNix7poUYJYcIWHh+ABuAg5Zq3AYwbhEXDFv/E5ciHXob/wXNxweMKv8IQZD5jxiMcoITEgAZ5pMxMls/41IaxK0hBpUSYzgbQmR9r0Gz91th5nMZ01dntwXIXtXIQSgm1noNGm5z7OjCCYGYtxgi6me2E9aorQyll9a86BLfCxqNayOlXQYDmm2CNDzMFsIfpmNl8Zpqk3DOyKntF1Tu7DzjsASpeB0N3ybqXhf2qxvB/YurUR0jYKdLcPqKpbb4JcVXpWV6+b4Ixu87QN56izc1IrZAB2ZEdlkJDbxKWyZ5cvKHq5XOuXBkdp3FdMvmzaCzsxsxfhdVBVOACSDDAIQ89jNds0UOIKQx5XYFWrXynCU9merJ0aTrC8+WpHKc9K0AtVXvBa87WPedxmdACY5DLDsc56xjMWvGDBV/wLXytmaWw83hNRHR5wwRyT6SM+4RMuCCAuUUEX2y7BtNlU9bMKSGFemiA4zAB9NNtkgEnqfAWocAXGvKE52owMQ0nukyGXti3aBEhoWMUet+maIDBqwhTg88yty2UsaZsdDUBa/3dm7nobpDRlWGleeCJ2wKWxGdtAMOIvtI9lRuxvduyRkwk7lRCOWj3j6NfS2zR3f86yCTr6pmoOvh3d8HaQg+/NJnwQULh7DXeEOZ292TFGx8P0z6F0dZ8Yun660ujHWrIDGcYAi4eMh4ZnC8NVrKmPOdyMYJGaBkfMCLLJ2EZAI191+RhyM6Vuqzxpj1vYvmeUNajAugBFTUFaW8jCIQ5suHqItwyLWEEuGa7f7ltAaHJjGmdyqBaETaZlzkA0+hQw6GJ7JcQVXiE4XPEFX/AMAfBYcMVLD2ocHtn5tWTa36ukOoOYcMHjetEEQNCEGRNmOAQoXkpZzfyATybNFuKLupjGQ7miyZiIPQRlOZYdmSINhIz5ymWkdPyDmVMvbzJ8RNxGKs+rIQ1jIlcVugpWLWOd0TRh9c90GXIkScw9UEToturEhqAjthc3LRhB5JvqHqDLBFodBG1SFuvkXB/5Nni6fJjsxV4akJn7k9yGLWH/6qlemTLrGz9tBNmT7W7IbbfK0Q2I5P71/xhYE71q33vvwivYqrMzN3sumjOnQ1p//Bewrf7ZsKLYKQXaOrtmfFl5tE3qtlCs2AxxY1k2TwlNgnUNpAom5sWCVdsVE9eqRAkR1ChDhDLn56IBAnaFrrN6mluJ9X2+LRtiW+al8R8atlmm3KFqwGQvt7KO5uZnEQGoyknmLOBz3HJ55gLBpTuDmS8iCOpiwOdcWWEd8wUv8RbieoWCcAhY4LHA567Cgmdc4SEslU1+88ogM39UhPhz56xNuMRNmqq6fsJUUqaIRzxhzs7kAcyD9EDMDXgoiczHjZija/UQ+wY2aGUnZkzN9aRxuujfJHnAxWDxp47+qZ7+R9VMnAydaNCpEHUqsKIOe/NGW0Ugsb12oOoQ8LjmN6CqBmWuaxh268txy0sbPkE3pwGeqJ975On2d1N769hLWNOrD9Z41eFH2hBxbyrtFk6KN8ndI+lbX2OMWTV7wDu8uPYqVkntuCHK3LpobcTq9x4jriQ04IEDT0+QYmv9ZaOTz4nQY6nvwhk7e2P3gG9lC5/T8FMje4bMBxNXXCtueN+TpmblDi7+KmTL5dZRvAY0MHPYiQDE0qR9uyuL2QGHBV/xXP0Ew6ero3G8j2Dp2uz6+vrDB1Ut84fFlA8rw/7Eo+DmBtXH+LaA68CZ2wLqEz5V0EX35JvhMZsbwEV8Rw0SqwZkbwEPOr2qxwERa3BU5xhbhslWMu/lPFPD3PyQmAGdbCv98F98U1n8v2lfsyz+3Z7nDHvgO9X0eVaIeK5OX+jefyggZxQ5Clzoz/6Fbl1hG6kDFvznTT2/jvFfRncUTkvbi/G9TFO3dkavP/7orn79Dy3WumKe8M0UAAAAAElFTkSuQmCC) 50% 0/auto 100% no-repeat;
    width: 100%;
    height: 12px;
    position: absolute;
    top: 0;
    left: 0;
    opacity: .6
}

.v-shadow:before {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAQ8CAYAAACvq98jAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6REQ3NzMyNEJCODU4MTFFNThFMkJFQTc5OTA5MzlDQUYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6REQ3NzMyNENCODU4MTFFNThFMkJFQTc5OTA5MzlDQUYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpERDc3MzI0OUI4NTgxMUU1OEUyQkVBNzk5MDkzOUNBRiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpERDc3MzI0QUI4NTgxMUU1OEUyQkVBNzk5MDkzOUNBRiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Ptu1hsgAAA6hSURBVHja7F3JbhQ9EG4bJ4EgsQmJCwcOXHn/B+HCKwAHtiSEBPCfarpMufyVl54eAvon0pAwXWO79sWe8jRNk5sqP3757VoA0yYAbv9TYIDj4+M6wIsXL6baQv3z58+n2ij+/v370+PHj22Ab9++Tc+ePbMBfv78OT169Gg6OjrCANfX19Pdu3ene/fu2QD0c3p6agPQNOYU9PDHjx9yhIwWPsY4XV1dTQ8ePMAjfP/+faJpaArvPZzC0RT0kLApAGiKm1HcnTt3pocPH+IpCIhecAQanjAhwBACFhgCohfiahqBXmiEQIvjEU5OTgpUAzHp7OxsxuRGNqKeJhCJLy4u5inoR/Mk0Bv0KZqCUNXrmP9H+J+fn89v0JoKQtGnGJMCC+YD08M5N71//55YHhMd6E0amkYgVAtukpAQEAFr2fQ8N49QABBqDHAzgtN0SCPwA42JZ1lgAtFa5Cvw4hiQRpLUDPQfBqDhiSb0oYwXi9i5SP8sNMnkgT/BvyUm82Q0LE1Bv+klqRmIkvTmze95eM3ywAtj2WTeJAD6BL8hMckoyajRS1NyHoExWNBztJ5MYHga+jT9ndFBPhDkLUlNgLy4gpLLCLMJIHLTh968eTPLpZdkZkJlaC5Gy2laVP1FtmBGUb4pF+kZ74z+Ak0v52OxK6Razy+BvJQktEjPZGZpor+JspIXSViZL2RQGJOwkDdRk/4m/WTB9QtZ0yIYKNMsfiYFl0cNevWMNn8wAfAD/mRapOQFYrmXD2jkRYlyZmmBgQZErj7jrFyYFrdEanqWCCNMUdKLhZLxNzFdZDSZ1Gka5iQB0CsgYZGk9pqTWoAKsdfS5SUvtIUrYjmxYJcssCY1y2jBbo0Fm8Kgac+A7OgJgOaOvMg09ELysOA/k5etjLR2mg6uIBT/RxuyBMDqpuUiExg5pLTdGbNM5QVzZi4haCpK51IYkKSP0kbxA6fpjQRGyydj4TQNNAA0XtrKOSS8fUKLrGsGIIVEu4JM9eRCC/XXP9L6Z/ZBTsXk9ojCHHy9fv3aZUZMrifJiUXBgpuWTBbygEidiQJ0SZY7ygDEA4cW6ViiCm4mJfVEM+cgFl1rQMJbADAdMgAtzdrRF9zUWmYC8G+PzCDnGrNJqA5vAVTXIMV/thPo4RCpQ02z+xJzdh5IaGe+LDrhrLV4yy5AE1RdJFIaqP7SNUJKFhLVFXDKYMt0zd3q36UXhZ2scTNI9Nh4yHjOa4uyrMOZqoccymQpDzTm2l6bpM40S4WMyaAzgAx4Ez8KxdEYwAAD5d3jFS3toryOXTQ2TZGDANkIWg5QnlXqY0vsm3QYs/bd2r0tQJOSBQDrAgtUcwQZfAbLulWtfWFpd7PVKO8etvbjpDalWua+pmvmICPzF6av0I5VGlNKiikJyVRPmgACoOzZpEOqySAbzRYmAVgyYepFs3rQtA+SmiiWSzYSej09RUA2AYq99peygNnev2CgdV6P/7i+vt5xe2KZu1iLl2n01dWVg+kkSkIyxdEAiyy4jN2mZCdIlcYV+UUzGeTnl5eXDsZytTWYAU4Rw5gAKEMzSz0yvdZBjpPFATMZLAzK8imnq63VGObs7MxBLBBn2VY7lBCiYM+hEWDckGGhzQ/McVDGrC2tQ2FKkLqQwjNB7oJQVeWVdTleT9AVbllJgFlzEcOg+aWj86ImmBJSGuHDhw9ujilRtZmBGACil+STFyXXIkuRoctv1iIAWD3ICCXVnklMDi3VJ7XX01VGOYKr1oIQHWZGKnl00G+ihDjF+BYnYZ22lpg7nb4kAJR8mHYS5RlykU6E7nOpHhoxM+e1yk1B6KSTa4HcRDGEjqOcrg3B3L9gN7KREAu5yBSBoFzPyi9c06HokK0/Ih3WLC1y7RKoFtgCTb0Gtnxfvnxx7RrIcI4Da4PVSi+Y3yGX5JrOncWtuki0TVNws3DurcJdsAoUPJKvhQYJAFna5OxXFTA1gDmKXOS+T/VofyVjy7/hXFBA9gkRqq9gNbSGZj2KI9Og8LfLTV1rMC2MqmplDGtXD2rF7HWZe7XCWY3tt5dqxKzkP6sCo8N4iw4p1/BT55G8doCxm15YnGyOINEs4gcKMObjULUayEwsxGIZ9JolDjN+MEXOiqe8lfysI/Vw/WFG05JqC832jlh3ATOlMzptKtZg7eeNFw93CrSc9jhV7980g80Nr3W7MNvophVH7HENVc3qstW8M2bqJhkPE6AIk5r73UNoFuEikuZaHGUnpKZ297rmjQQGlee9ZpBlQNzUu/kod20L5a3mONtY2p7NBdclD2N7KDsng+MWpkhh9m+C1mnW9lO4PWNRK3+aOyAbW1p00m2dc2+df+hLBjVNqoEWBGjWYaQZgMcC5QNdsKoa8+4ExGl0M5ekDYkM3dtRUNM+9CpO3F7kqvEDlEnrnNhYNNhtH2qLdH/Ayg2rnrslI1bVzfWx3O4Ae3Lum1l71x0erC6zbBjLrT/E9Yd4sYoOoRUFNQG2Ud5tA859knr3CGS3rYEhp7aNfeBMMUm1VQ+DKUzPyeRBNLvZTcUUFM9ta6tdM9/sBdjAsW7vN6cDwAHgFgFuofT3NyXm7hawMA83Dk2xYY205zDbQXEOAP9HgO1rYgeAA8C/D3DwFweAA0CZVh/8xSFDmf7Y1uEBYO8A5nG4rhGKb5ntvMh44MW+mFVsNlk752PnSHdjd9f3/bc51LfOFG9zeOm2K/9VgB52x79QcWJzBOvkQHtTfmeRc02p3j+h1p09gH1ymo3XhiXq3wLYz07xHwKIvXqRUC26YA0He/s/7Rb3rDirTyb3AexkYeKUN6EbHKHp1Lp2intcUhxSnOZ5GFMmdcPKdmMla+gNj9zILeQ9hQd/0KGg78ml71ZvayebvZu6LUxa5HaJ+Sax3JBrjuZJdemW50Z0iJKF766dLhrv1bPudJP15coNs0XdxXTIDK47vHSLwd56jxNHSB1vC4shof1rg73udLIZHsht7czKyZYL66bYJjwYyQ6iNuZRvLC1162Zm6rX7C83lsLUjhXsNoU8qb4u7+5CE7rF7TTL9FnyBCD0WV1YZAUr1ItkKJ78pw551vViONCiht9dX4UzAeR3xsyGpdVAS3fz6Bd71XIjQitX9ApGqWS1xUSXc+/6Fur4+aiWREXdotrU7q5Aq6v/pKlZ+tYGjwJe5gldprLOgMB61OoaaejxensqgUpK6iArrm/O0PTduwc523wxQetnN5rRVL3afQswyEFeL2qr0kwnZTPd3csLUCalIrVN8VBbJPjdSWGbY/eXCmvhYpS9q/sikGZneCvYzTSr1np1/Os2fClBFy9mNJmKkpLZPRjWCLBfcfUODulpsv4wllO3SqDRtDAjQU7c3ZCa7T5QYmjWo1L3J+MyiGm5uitWS+JQs2Rzyr74QRMH2qjaKAHpZCZyiAeyyXVAxosB6Joksy9KupXLumolSXWtDyiSqGjVYQoMZNejiCKQdEkHkiL6mzAw02rr5ogoTWJ/0azLyilPE7W/iJY8FmjCxs6tzvDZGli0YFSM2tjpqDiaUXH89QNvlvF805HkBd/QtlGmpntewqap2uvAIqpZyL355E9t6TOXJMQsMsr03pMnT6KZX2Q5DvLXVrtys8wiaR+L2F6HBqgPZ7Ta55vyYAFAwYXdZaGlNW/5YRe4zBuLngMLF6P2uGa4yA2+k4NF1u309DSmDrdcn7dU0EtnDjuzSUpmG13Sues26bJDnbfy7VRu0sEuP6R7IL9+/ZqncqyPDHB5efnbFCM+ZL1h+ffJyUmE6aS0D5nA6DQaBv+1kNFL3wAB+GJKrQ8JQH76+Pg4oiniTlsDQdz0FLtrYrLLzCxyR0dHMuDM1V8P3ZVObrytP3xQpKs+uX6RSLpgu9GhiwjbPfaljTRvfbLC9nE0YZd+s3gqLEzM8rgJdFVF6sdXXZp0II1L9gH5zKyrSbUDdq0MDB2K9uNel5lkf/mxmHZ93t0sDggyx66As6kXzes1uV5fZO5m/8lu7a5GpKgcLEMUswv42HdIu3uaNZnVdXBIStVY7yYtfoVmyb6wmWZZuzBwkXqaoMlbXFxbSyeH6w+Y1GyLlj0LXKBgbUYRIUoG4zC7Y/XOBU092OTKEtqu3D8LciQFzR0x+uEreV+9ehWDZhIvkpNieOSG1T8LWWv7OHkjRn29Re2qk/60GmWM0ARB7WZhscwxvAUMMsvatoKd4ZnMReGOeSA5G2AsvWh35g7kArPrmGXqhO5s9uzpqn5TB5nNPTV0O17KinR9MqWTOkvK0ET6SckHNEH8oo0m7TcnlDFlpR5BzViYYnTda5/QImE1D9zq/bQZQLJZXgjBawkg4I9ysV7GDfRiEmet2+S8RcAps3WUuQeNmrm5wEvR18AEOS+8OEYXb6VrgpTU9ybJO1kicxSROurENI1Ac9GNHVJpKFumpJinyOwTTXN1dfWbF/JmY3Rnszd2gn4TqnnbkbpdB/NCWndtozy6B0WKflfAWex+VC9s1WIXRM0h3vwd6WYbWuTLly/nTwb6D70pTWF2HTPTXw6bmWK+JFbmNfo29iwaZsHJSM2Rh3XJeOEWsyiI3+DKDd/vni4SYiPKqEq/ncSeJYmlik1goqSOAFlgZwD6D2dGvOCMDjQfE0uinJGaAbhIlC1SejtY2WP8eWEwfuDruG+mihKDbAS+o5n0MuMFUZLnpsVqAM+05xEkFZPAyEveCfjp06dRlll+baaA2+ESs8iBaSOe8YIMBt1KqFk9A1xcXEzSeGo6BEJrvn0+hEgY0GgZAM15fHw8AxFAYe3Ttaoi6ii8Hl9yr4fPRmB6FABsRKVDL9hNGNBiP336hMpfPnKQC0egKUhpiEDmbWhEh8+fP09Ghe2XPhLJYfpAw0uhLUYgAPoRI5QAtHoti9kaPn78aE9BVze8ffvWjqvPz8/p5jMT4M7NGty7d+/stPmGSNylD8bv+sGtHRu25t9mimlqNMH7T4ABABeHhdXrZzYWAAAAAElFTkSuQmCC) 0 0/75% auto no-repeat;
    content: "";
    width: 12px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -12px;
    opacity: .8
}

.shadow.no-revert:before {
    top: 0 !important;
    opacity: .6 !important;
    transform: none !important
}

.de-blog-title a {
    color: #0078ae;
    transition: color .4s
}

.de-blog-title a:hover {
    color: #009ddc
}

.de-blog-item {
    margin: 0 0 20px;
    border: 1px solid #d9dadb;
    position: relative;
    transition: height .5s linear;
    background: #fff
}

.de-blog-item:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #009ddc;
    z-index: 2
}

.de-blog-img {
    display: block;
    margin: 20px;
    position: relative;
    overflow: hidden;
    transition: height .5s linear
}

.de-blog-img .overflow {
    display: block;
    box-sizing: border-box;
    transition: margin .4s linear
}

.de-blog-item img {
    transition: all .4s linear;
    position: relative
}

.de-blog-item:hover .overflow {
    margin: 0
}

.de-text {
    position: relative;
    padding: 5px 20px 40px
}

.de-text-frame {
    padding: 0 24px;
    text-align: left;
    position: relative;
    overflow: hidden;
    z-index: 2;
    transition: height .5s linear
}

.de-blog-item .tag {
    font: 400 12px/11px Arial, sans-serif;
    color: #9a9a9a;
    text-transform: uppercase;
    margin: 0 0 8px;
    padding: 0 0 0 8px;
    border-left: solid 2px #0087bd
}

.de-blog-title {
    font: 22px/30px roboto-bold-webfont, sans-serif;
    text-transform: capitalize;
    color: #0078ae
}

.read-more-anim {
    display: none
}

.visit-more {
    color: #fff;
    border-top: 1px solid #116893;
    border-bottom: 1px solid #043e64;
    padding: 62px 0 58px;
    text-align: center;
    background: #0084bd;
    background: -moz-linear-gradient(top, #0084bd 0, #0078ae 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0084bd), color-stop(100%, #0078ae));
    background: -webkit-linear-gradient(top, #0084bd 0, #0078ae 100%);
    background: linear-gradient(to bottom, #0084bd 0, #0078ae 100%);
    box-shadow: inset 0 1px #0098d5, 0 1px #4ebee3
}

.nm-link {
    display: inline-block;
    font: italic 32px/1.1 roboto-light-webfont, sans-serif;
    color: #fff;
    -webkit-transition: color .4s;
    transition: color .4s
}

.nm-link:hover {
    color: #00b2fa
}

.nm-link span {
    : roboto-bold-webfont, sans-serif;
    font-style: normal;
    margin-left: 7px
}

.nm-link span:after {
    display: inline-block;
    vertical-align: top;
    margin: 6px 0 0 24px;
    width: 19px;
    height: 29px;
    content: "";
    background: url("../image/tzz_ion-1.png") -612px -280px no-repeat
}

.prev-next-pager {
    background: #f5f7f7
}

.prev-next-pager .frame {
    border-bottom: solid 1px #e2e4e5
}

.prev-next-pager a {
    font: 400 14px/40px roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    color: #009ddc
}

.prev-next-pager a:before {
    content: "Â«";
    display: inline-block;
    vertical-align: top;
    margin: 0 3px 0 0;
    font: 22px/1 roboto-bold-webfont, sans-serif;
    position: relative;
    top: 6px;
    left: 0;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out
}

.prev-next-pager a:hover:before {
    left: -3px
}

.prev-next-pager a span {
    : roboto-medium-webfont, sans-serif;
    color: #5a6063
}

.logo-process {
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat;
    margin: -10px 0 0;
    position: relative;
    padding: 80px 0 0;
    overflow: hidden;
    box-shadow: 0 -34px 26px #f8f8f8
}

.logo-process.lock:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.logo-process h2 {
    text-align: center;
    font: 400 60px roboto-bold-webfont, sans-serif;
    color: #0078ae;
    padding-bottom: 10px
}

.logo-process p {
    font: 400 17px/1.6 Arial, sans-serif;
    text-align: center;
    color: #5a6063;
    padding: 0 0 54px
}

.logo-process .lp-slider {
    text-align: left;
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat;
    margin: 0 -55px;
    padding: 70px 125px 70px 4px;
    position: relative
}

.logo-benefits {
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat;
    margin: -32px 0 80px;
    box-shadow: none
}

.slide-section .logo-benefits {
    margin: -32px 0 80px
}

.logo-benefits .frame {
    max-width: 100%
}

.logo-benefits:after {
    display: none
}

.lb-steps {
    position: relative;
    font: 16px roboto-medium-webfont, sans-serif;
    text-align: center;
    margin-top: 40px
}

.lb-steps.shadow:before {
    top: auto;
    bottom: 0;
    height: 7px;
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat;
    opacity: 1;
    z-index: 3
}

.lb-steps ul {
    max-width: 980px;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, .1);
    padding: 8px;
    height: 83px;
    display: inline-block;
    text-align: center
}

.lb-steps.short ul {
    min-width: 825px
}

.logo-benefits .lp-slider {
    max-width: 950px;
    margin: 0 auto;
    background: 0 0;
    padding: 0
}

.lb-steps li {
    display: inline-block;
    vertical-align: top;
    position: relative;
    z-index: 4
}

.lb-steps li h3 {
    font-size: 16px;
    margin: 0
}

.lb-steps li a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: #5a6063;
    padding: 10px 25px;
    height: 64px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.lb-steps li a.active {
    color: #fff;
    position: relative
}

.logo-benefits .pull-left {
    left: -30px;
    top: 200px
}

.logo-benefits .pull-right {
    right: -40px;
    top: 200px
}

.logo-benefits .slider-txt-wrap {
    padding: 15px 40px 0 70px
}

.logo-benefits .lp-slider-img {
    width: 288px;
    height: 288px;
    padding: 0;
    margin: 80px 80px 0 0
}

.logo-benefits .lp-slider-img:after {
    display: none
}

.logo-benefits .lp-slider-img li {
    height: 208px;
    width: 208px;
    position: relative;
    overflow: hidden
}

.logo-benefits .lp-slider-img .bx-wrapper {
    margin: 40px 40px 0
}

.logo-benefits .lp-slider-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.logo-benefits .lp-slider h3 {
    font: 400 60px/1 roboto-bold-webfont, sans-serif;
    padding: 35px 0 5px;
    color: #1a8fc4
}

.logo-benefits h3 .mark {
    display: block;
    font-size: 28px
}

.logo-benefits h3 > span {
    display: inline-block;
    vertical-align: top
}

.logo-benefits .lp-slider .brand h3 {
    color: #8bbb00
}

.logo-benefits .brand h3 > span {
    padding-right: 20px;
    text-align: right
}

.logo-benefits .lp-slider .brand h3 .mark {
    margin-right: -20px
}

.logo-benefits .lp-slider .transitions h3 {
    color: #a541c0
}

.logo-benefits .lp-slider .rebrand h3 {
    color: #d85855
}

.logo-benefits .lp-slider .default h3, .logo-benefits .lp-slider .supply h3 {
    color: #1a8fc4
}

.logo-benefits .lp-slider-img .shape {
    position: absolute;
    top: 0;
    left: 0;
    fill: #fff;
    -webkit-transition: fill .2s ease-in-out;
    -moz-transition: fill .2s ease-in-out;
    transition: fill .2s ease-in-out
}

.logo-benefits .process-active-0 .shape {
    fill: #8bbb00
}

.logo-benefits .process-active-1 .shape {
    fill: #a541c0
}

.logo-benefits .process-active-2 .shape {
    fill: #d85855
}

.logo-benefits .process-active-3 .shape {
    fill: #1a8fc4
}

.lp-slider-txt {
    float: left;
    width: 560px
}

.lp-slider-txt h3 {
    color: #343434;
    font: 400 45px/1 roboto-bold-webfont, sans-serif;
    padding: 35px 0 25px;
    letter-spacing: -1px
}

.slide-section .lp-slider-txt h3 {
    font-size: 28px
}

.slide-section .lb-steps li {
    font-size: 16px
}

.slide-section .lb-steps.short a, .slide-section .lb-steps.short li {
    width: 33%
}

.slide-section .lb-steps.full li {
    width: 20%;
    margin: 0 -2px;
    box-sizing: border-box
}

.slide-section .lb-steps.full-alt li {
    width: 14.28%
}

.lp-slider-txt li {
    opacity: 0;
    -webkit-transition: opacity 1s;
    transition: opacity 1s
}

.lp-slider-txt li.active-text-slide {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slider-txt-wrap {
    padding: 0 40px 0 130px
}

.lp-slider-txt h4 {
    color: #343434;
    font: 400 30px roboto-bold-webfont, sans-serif;
    padding: 0
}

.lp-slider-txt li:nth-child(1) h3, .lp-slider-txt li:nth-child(1) h4 {
    color: #343434
}

.lp-slider-txt li:nth-child(2) h3, .lp-slider-txt li:nth-child(2) h4 {
    color: #87c556
}

.lp-slider-txt li:nth-child(3) h3, .lp-slider-txt li:nth-child(3) h4 {
    color: #eb8a0d
}

.lp-slider-txt li:nth-child(4) h3, .lp-slider-txt li:nth-child(4) h4 {
    color: #ab840c
}

.lp-slider-txt li:nth-child(5) h3, .lp-slider-txt li:nth-child(5) h4 {
    color: #56d3c6
}

.lp-slider-txt li:nth-child(6) h3, .lp-slider-txt li:nth-child(6) h4 {
    color: #882fa0
}

.lp-slider-txt li:nth-child(7) h3, .lp-slider-txt li:nth-child(7) h4 {
    color: #c44441
}

.lp-slider-txt li:nth-child(8) h3, .lp-slider-txt li:nth-child(8) h4 {
    color: #0078ae
}

.lp-slider-txt p {
    text-align: left !important;
    font: 400 16px/28px Arial, sans-serif;
    color: #5a6063;
    padding: 20px 40px 0 0
}

.logo-benefits .lp-slider-txt p, .slide-section .slider-txt-wrap p {
    padding-right: 10px
}

.lp-slider-img {
    float: right;
    width: 392px;
    height: 392px;
    padding: 1px;
    position: relative;
    overflow: hidden;
    z-index: 20
}

.lp-slider-img:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 22;
    width: 100%;
    height: 100%;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.pull-left, .pull-right {
    overflow: hidden;
    text-indent: -5000px;
    background: url("../image/tzz_ion-1.svg") 0 50% no-repeat;
    position: absolute;
    top: 220px;
    right: 28px;
    width: 58px;
    height: 58px;
    z-index: 10;
    -webkit-transition: -webkit-transform .2s ease-out;
    transition: transform .2s ease-out
}

.pull-left {
    left: 48px;
    background: url("../image/tzz_ion-1.svg") 28px 50% no-repeat
}

#logo-benefits.process-active-3 .pull-right, #logo-benefits1.process-active-4 .pull-right, #logo-benefits2.process-active-2 .pull-right, #logo-benefits3.process-active-2 .pull-right, #logo-benefits4.process-active-6 .pull-right, .mob-design-pg + .slide-section .process-active-3 .pull-right, .process-active-0 .pull-left, .process-active-7 .pull-right {
    opacity: .4;
    cursor: default;
    pointer-events: none
}

.pull-right:hover {
    -webkit-transform: scale(0.9, 1.2) translate(-4px, 0);
    transform: scale(0.9, 1.2) translate(-4px, 0)
}

.pull-left:hover {
    -webkit-transform: scale(0.9, 1.2) translate(4px, 0);
    transform: scale(0.9, 1.2) translate(4px, 0)
}

.process-active-0 .pull-left:hover, .process-active-7 .pull-right:hover {
    -webkit-transform: scale(0, 0) translate(4px, 0);
    transform: scale(1, 1) translate(0, 0)
}

.lp-steps {
    text-align: center;
    font: 0/0 a;
    position: relative;
    z-index: 1
}

.lb-steps ul, .lp-steps ul {
    position: relative
}

.lb-steps .cur-step, .lp-steps .cur-step {
    content: "";
    position: absolute;
    left: 29px;
    bottom: -21px;
    width: 0;
    height: 90px;
    z-index: 2;
    -webkit-transition: all .4s linear;
    transition: all .4s linear
}

.lb-steps .cur-step {
    height: 64px;
    border-radius: 4px;
    padding: 0;
    bottom: 10px;
    left: 8px;
    z-index: 3
}

.lb-steps .cur-step:after {
    content: "";
    position: absolute;
    bottom: -24px;
    left: 50%;
    margin-left: -17px;
    border-top: 36px solid transparent;
    border-left: 18px solid transparent;
    border-right: 18px solid transparent;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    opacity: 0
}

.lb-steps .cur-step.active:after {
    opacity: 1
}

.lb-steps .active-0 .cur-step {
    background-color: #8bbb00
}

.lb-steps .active-1 .cur-step {
    background-color: #a541c0
}

.lb-steps .active-2 .cur-step {
    background-color: #d85855
}

.lb-steps .active-3 .cur-step, .slide-section .lb-steps .cur-step {
    background-color: #1a8fc4
}

.lb-steps .active-0 .cur-step:after {
    border-top-color: #8bbb00
}

.lb-steps .active-1 .cur-step:after {
    border-top-color: #a541c0
}

.lb-steps .active-2 .cur-step:after {
    border-top-color: #d85855
}

.lb-steps .active-3 .cur-step:after, .slide-section .lb-steps .cur-step:after {
    border-top-color: #1a8fc4
}

.lp-steps .cur-step-mob {
    display: none
}

.lp-steps .cur-step-sub {
    position: absolute;
    top: 0;
    left: 0;
    width: 69px;
    height: 69px
}

.lp-steps #curStep {
    position: absolute;
    top: 0;
    left: 0;
    width: 69px;
    height: 90px;
    fill: #4e4e4e;
    -webkit-transition: all .4s;
    transition: all .4s
}

@-webkit-keyframes anim-cur-step {
    20% {
        -webkit-transform: rotate(45deg)
    }
    70% {
        -webkit-transform: rotate(-45deg)
    }
    100% {
        -webkit-transform: rotate(0deg)
    }
}

@keyframes anim-cur-step {
    20% {
        transform: rotate(45deg)
    }
    70% {
        transform: rotate(-45deg)
    }
    100% {
        transform: rotate(0deg)
    }
}

@-webkit-keyframes anim-cur-step-b {
    20% {
        -webkit-transform: rotate(-45deg)
    }
    70% {
        -webkit-transform: rotate(45deg)
    }
    100% {
        -webkit-transform: rotate(0deg)
    }
}

@keyframes anim-cur-step-b {
    20% {
        transform: rotate(-45deg)
    }
    70% {
        transform: rotate(45deg)
    }
    100% {
        transform: rotate(0deg)
    }
}

.lp-steps ul.active-0 .cur-step-sub, .lp-steps ul.active-1 .cur-step-sub, .lp-steps ul.active-2 .cur-step-sub, .lp-steps ul.active-3 .cur-step-sub, .lp-steps ul.active-4 .cur-step-sub, .lp-steps ul.active-5 .cur-step-sub, .lp-steps ul.active-6 .cur-step-sub, .lp-steps ul.active-7 .cur-step-sub {
    animation: anim-cur-step .8s;
    -webkit-animation: anim-cur-step .8s
}

.lp-steps ul.active-0.active-b .cur-step-sub, .lp-steps ul.active-1.active-b .cur-step-sub, .lp-steps ul.active-2.active-b .cur-step-sub, .lp-steps ul.active-3.active-b .cur-step-sub, .lp-steps ul.active-4.active-b .cur-step-sub, .lp-steps ul.active-5.active-b .cur-step-sub, .lp-steps ul.active-6.active-b .cur-step-sub, .lp-steps ul.active-7.active-b .cur-step-sub {
    animation: anim-cur-step-b .8s;
    -webkit-animation: anim-cur-step-b .8s
}

.lp-steps li {
    display: inline-block;
    vertical-align: bottom;
    width: 11%;
    margin: 0 .75%;
    font: 400 15px/18px roboto-bold-webfont, sans-serif;
    color: #5a6063
}

.lp-steps .ico-wrap {
    display: block;
    border-radius: 35px;
    background: #fff;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, .15);
    position: relative;
    margin: 20px auto 0
}

.icon-svg, .lp-steps .ico-wrap img {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.icon-svg {
    width: 48px;
    height: 48px
}

.icon-svg svg {
    -webkit-transition: all .4s;
    transition: all .4s;
    outline: transparent solid 1px
}

.slide-section {
    background-color: transparent;
    padding: 90px 0 40px;
    box-shadow: 0 -3px 5px rgba(213, 213, 213, .46)
}

.slide-section .section-title h2 {
    : roboto-bold-webfont, sans-serif
}

.slide-section .logo-benefits {
    background: 0 0;
    padding: 0
}

.slide-section .lp-slider-txt {
    float: none;
    width: 100%
}

.slide-section .slider-txt-wrap {
    float: left;
    width: 560px
}

.slide-section .lp-slider-img {
    overflow: visible;
    width: 289px;
    height: 289px;
    float: right
}

.slide-section .lp-slider-img .bx-wrapper {
    margin: 0
}

.slide-section .lp-slider-img li {
    height: auto;
    overflow: visible
}

.slide-section .lp-slider-img img {
    position: static;
    -webkit-transform: none;
    transform: none
}

.icon-exploratory svg {
    fill: #6D6D70
}

.icon-sketches {
    width: 40px;
    height: 40px
}

.icon-sketches svg {
    fill: #F7A53C
}

.icon-fianl-logo svg {
    fill: #1A8FC4;
    -webkit-transition: all .8s;
    transition: all .8s
}

@-webkit-keyframes anim-icon-hand {
    0%, 5% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg)
    }
    9% {
        -webkit-transform: translate(-50%, -50%) rotate(10deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg)
    }
}

@keyframes anim-icon-hand {
    0%, 5% {
        transform: translate(-50%, -50%) rotate(0deg)
    }
    9% {
        transform: translate(-50%, -50%) rotate(10deg)
    }
    100% {
        transform: translate(-50%, -50%) rotate(0deg)
    }
}

@-webkit-keyframes anim-icon-finger {
    0% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg)
    }
    5% {
        -webkit-transform: translate(-50%, -50%) rotate(60deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg)
    }
}

@keyframes anim-icon-finger {
    0% {
        transform: translate(-50%, -50%) rotate(0deg)
    }
    5% {
        transform: translate(-50%, -50%) rotate(60deg)
    }
    100% {
        transform: translate(-50%, -50%) rotate(0deg)
    }
}

@-webkit-keyframes anim-icon-cloud {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(0.95)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1)
    }
}

@keyframes anim-icon-cloud {
    0% {
        transform: translate(-50%, -50%) scale(0.95)
    }
    100% {
        transform: translate(-50%, -50%) scale(1)
    }
}

.icon-word-cloud path {
    fill: #9FDD6E
}

.icon-word-cloud svg {
    position: relative;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.icon-abc-part {
    display: block;
    width: 29px;
    height: 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    -webkit-transform: translate(-50%, -24%);
    transform: translate(-50%, -24%)
}

.icon-abc-part:before {
    display: block;
    width: 29px;
    content: "ABC";
    color: #9FDD6E;
    font: 15px/15px roboto-bold-webfont, sans-serif;
    overflow: hidden
}

@-webkit-keyframes anim-icon-abc {
    0% {
        width: 26px
    }
    5% {
        width: 0
    }
    100% {
        width: 26px
    }
}

@keyframes anim-icon-abc {
    0% {
        width: 26px
    }
    5% {
        width: 0
    }
    100% {
        width: 26px
    }
}

@-webkit-keyframes anim-icon-abc-tab {
    0% {
        width: 22px
    }
    5% {
        width: 0
    }
    100% {
        width: 22px
    }
}

@keyframes anim-icon-abc-tab {
    0% {
        width: 22px
    }
    5% {
        width: 0
    }
    100% {
        width: 22px
    }
}

.icon-review svg {
    position: relative;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #c69d1e
}

.css-icon-pupil {
    width: 22px;
    height: 22px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin: auto;
    z-index: 10;
    overflow: hidden
}

@-webkit-keyframes anim-icon-pupil {
    0% {
        height: 22px
    }
    50% {
        height: 0
    }
    100% {
        height: 22px
    }
}

@keyframes anim-icon-pupil {
    0% {
        height: 22px
    }
    50% {
        height: 0
    }
    100% {
        height: 22px
    }
}

.css-icon-pupil:before {
    display: block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #c69d1e;
    border: 6px solid #fff;
    content: "";
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    top: 50%;
    left: 51%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.css-icon-pupil:after {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-100%, -100%);
    transform: translate(-100%, -100%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    content: ""
}

.icon-present-1 svg {
    fill: #65e7da;
    position: relative;
    top: 10%
}

.css-icon-present-1 {
    position: absolute;
    top: 16px;
    left: 50%;
    width: 24px;
    height: 20px;
    overflow: hidden;
    z-index: 11
}

@-webkit-keyframes anim-icon-present {
    0% {
        width: 0
    }
    100% {
        width: 24px
    }
}

@keyframes anim-icon-present {
    0% {
        width: 0
    }
    100% {
        width: 24px
    }
}

@-webkit-keyframes anim-icon-present-tab {
    0% {
        width: 0
    }
    100% {
        width: 18px
    }
}

@keyframes anim-icon-present-tab {
    0% {
        width: 0
    }
    100% {
        width: 18px
    }
}

.css-icon-present-1:before {
    position: absolute;
    top: 15px;
    left: 4px;
    width: 0;
    height: 0;
    border-top: 5px solid #65e7da;
    border-right: 5px solid transparent;
    content: ""
}

.css-icon-present-1:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 15px;
    border-radius: 3px;
    background: #65e7da;
    content: "...";
    font: 17px/5px roboto-bold-webfont, sans-serif;
    color: #fff
}

.icon-colors {
    width: 46px
}

.icon-colors svg {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-36%, -50%);
    transform: translate(-36%, -50%)
}

.icon-colors path {
    fill: #d85855
}

.icon-svg .colors-strike2, .icon-svg .colors-strike3 {
    -webkit-transform-origin: left bottom;
    -moz-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate(-36%, -48%) rotate(0deg);
    transform: translate(-36%, -48%) rotate(0deg)
}

@-webkit-keyframes anim-colors-strike2 {
    0% {
        -webkit-transform: translate(-36%, -39%) rotate(-27deg)
    }
    100% {
        -webkit-transform: translate(-36%, -48%) rotate(0deg)
    }
}

@keyframes anim-colors-strike2 {
    0% {
        transform: translate(-36%, -39%) rotate(-27deg)
    }
    100% {
        transform: translate(-36%, -48%) rotate(0deg)
    }
}

@-webkit-keyframes anim-colors-strike3 {
    0% {
        -webkit-transform: translate(-36%, -34%) rotate(-47deg)
    }
    100% {
        -webkit-transform: translate(-36%, -48%) rotate(0deg)
    }
}

@keyframes anim-colors-strike3 {
    0% {
        transform: translate(-36%, -34%) rotate(-47deg)
    }
    100% {
        transform: translate(-36%, -48%) rotate(0deg)
    }
}

.lp-mobile-swipe {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 77%;
    height: 100%;
    opacity: .5;
    z-index: 30;
    display: none
}

#easel-slide-section {
    padding: 38px 0 98px;
    background: #fff;
    box-shadow: 0 -2px 4px rgba(90, 96, 66, .05)
}

.easel-slider {
    position: relative;
    z-index: 2
}

.easel-slider .loads li {
    opacity: 0
}

.easel-slider .loads li:first-child {
    opacity: 1
}

.easel-slider li {
    display: block !important
}

.easel-box-wrap {
    margin: 0 auto;
    width: 320px;
    height: 270px;
    position: relative;
    z-index: 1
}

.easel-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-image: url("../image/tzz_ion-1.jpg");
    background-repeat: no-repeat
}

.easel-box1 {
    background-position: 0 -7040px
}

.easel-box2 {
    background-position: 0 -11840px
}

.easel-box3 {
    background-position: 0 -16000px
}

.easel-box4 {
    background-position: 0 -19520px
}

.easel-box5 {
    background-position: 0 -25280px
}

.easel-box6 {
    background-position: 0 -29120px
}

.active-easel-slide .easel-box1 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob1 .7s steps(22) forwards;
    animation: easelAnimMob1 .7s steps(22) forwards
}

@-webkit-keyframes easelAnimMob1 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -7040px
    }
}

@keyframes easelAnimMob1 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -7040px
    }
}

.active-easel-slide .easel-box2 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob2 .7s steps(15) forwards;
    animation: easelAnimMob2 .7s steps(15) forwards
}

@-webkit-keyframes easelAnimMob2 {
    0% {
        background-position: 0 -7040px
    }
    100% {
        background-position: 0 -11840px
    }
}

@keyframes easelAnimMob2 {
    0% {
        background-position: 0 -7040px
    }
    100% {
        background-position: 0 -11840px
    }
}

.active-easel-slide .easel-box3 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob3 .7s steps(13) forwards;
    animation: easelAnimMob3 .7s steps(13) forwards
}

@-webkit-keyframes easelAnimMob3 {
    0% {
        background-position: 0 -11840px
    }
    100% {
        background-position: 0 -16000px
    }
}

@keyframes easelAnimMob3 {
    0% {
        background-position: 0 -11840px
    }
    100% {
        background-position: 0 -16000px
    }
}

.active-easel-slide .easel-box4 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob4 .7s steps(11) forwards;
    animation: easelAnimMob4 .7s steps(11) forwards
}

@-webkit-keyframes easelAnimMob4 {
    0% {
        background-position: 0 -16000px
    }
    100% {
        background-position: 0 -19520px
    }
}

@keyframes easelAnimMob4 {
    0% {
        background-position: 0 -16000px
    }
    100% {
        background-position: 0 -19520px
    }
}

.active-easel-slide .easel-box5 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob5 .7s steps(18) forwards;
    animation: easelAnimMob5 .7s steps(18) forwards
}

@-webkit-keyframes easelAnimMob5 {
    0% {
        background-position: 0 -19520px
    }
    100% {
        background-position: 0 -25280px
    }
}

@keyframes easelAnimMob5 {
    0% {
        background-position: 0 -19520px
    }
    100% {
        background-position: 0 -25280px
    }
}

@-webkit-keyframes easelAnim1 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -8470px
    }
}

@keyframes easelAnim1 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -8470px
    }
}

@-webkit-keyframes easelAnim2 {
    0% {
        background-position: 0 -8470px
    }
    100% {
        background-position: 0 -14245px
    }
}

@keyframes easelAnim2 {
    0% {
        background-position: 0 -8470px
    }
    100% {
        background-position: 0 -14245px
    }
}

@-webkit-keyframes easelAnim3 {
    0% {
        background-position: 0 -14245px
    }
    100% {
        background-position: 0 -19250px
    }
}

@keyframes easelAnim3 {
    0% {
        background-position: 0 -14245px
    }
    100% {
        background-position: 0 -19250px
    }
}

@-webkit-keyframes easelAnim4 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -4235px
    }
}

@keyframes easelAnim4 {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: 0 -4235px
    }
}

@-webkit-keyframes easelAnim5 {
    0% {
        background-position: 0 -4235px
    }
    100% {
        background-position: 0 -11165px
    }
}

@keyframes easelAnim5 {
    0% {
        background-position: 0 -4235px
    }
    100% {
        background-position: 0 -11165px
    }
}

@-webkit-keyframes easelAnim6 {
    0% {
        background-position: 0 -11165px
    }
    100% {
        background-position: 0 -15785px
    }
}

@keyframes easelAnim6 {
    0% {
        background-position: 0 -11165px
    }
    100% {
        background-position: 0 -15785px
    }
}

.active-easel-slide .easel-box6 {
    opacity: 1;
    z-index: 10;
    -webkit-animation: easelAnimMob6 .7s steps(12) forwards;
    animation: easelAnimMob6 .7s steps(12) forwards
}

@-webkit-keyframes easelAnimMob6 {
    0% {
        background-position: 0 -25280px
    }
    100% {
        background-position: 0 -29120px
    }
}

@keyframes easelAnimMob6 {
    0% {
        background-position: 0 -25280px
    }
    100% {
        background-position: 0 -29120px
    }
}

.easel-text {
    padding: 0 46px 56px;
    font-size: 13px;
    line-height: 1.6;
    color: #5a6063;
    opacity: 0;
    -webkit-transition: all .6s;
    transition: all .6s;
    position: relative;
    z-index: 2
}

.easel-slider h3 {
    font: 20px/1.2 roboto-bold-webfont, sans-serif;
    color: #029edd;
    margin: 0 0 10px
}

.easel-slider li.active-easel-slide .easel-text {
    opacity: 1
}

.easel-text-inner {
    position: relative
}

.active-easel-slide .easel-text-inner {
    -webkit-animation: anim-easel-text .6s forwards;
    animation: anim-easel-text .6s forwards
}

.easel-slider .bx-viewport {
    overflow: visible !important
}

@-webkit-keyframes anim-easel-text {
    0% {
        opacity: 0;
        left: -40px
    }
    100% {
        opacity: 1;
        left: 0
    }
}

@keyframes anim-easel-text {
    0% {
        opacity: 0;
        left: -40px
    }
    100% {
        opacity: 1;
        left: 0
    }
}

.drag-pager {
    display: none;
    margin: 40px -60px 34px;
    height: 19px;
    background: #ededed;
    border-radius: 10px;
    clear: both;
    box-shadow: inset 0 5px 4px rgba(201, 201, 201, 1);
    position: relative;
    z-index: 10
}

.inner-drag-pager {
    width: 77%;
    height: 19px;
    margin: 0 auto;
    position: relative
}

.inner-drag-pager:before {
    position: absolute;
    top: 0;
    left: -15%;
    right: -15%;
    bottom: 0;
    z-index: 1;
    content: "";
    opacity: .5
}

.inner-drag-pager .ui-slider-handle {
    position: absolute;
    top: -14px;
    z-index: 2;
    margin-left: -63px;
    width: 126px;
    height: 43px;
    text-shadow: 0 -1px 0 #447523;
    box-shadow: 0 -1px 0 #c9e973, 0 1px 0 #5e8900;
    border-radius: 24px;
    background: 0 0/100% 100% #95c906;
    background: -moz-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a2d90c), color-stop(100%, #89bb00)) 0 0/100% 100%;
    background: -webkit-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: -ms-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    background: linear-gradient(to bottom, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
    -webkit-transition: left .4s linear;
    transition: left .4s linear;
    cursor: pointer
}

.inner-drag-pager .ui-slider-handle:before {
    display: block;
    content: "Drag Me";
    text-align: center;
    font: 19px/43px roboto-black-webfont, Arial, Helvetica, sans-serif;
    color: #fff
}

.easel-pager {
    display: none;
    margin: 0 -17px
}

.easel-pager ul {
    width: 100%;
    overflow: hidden;
    position: relative
}

.easel-pager li {
    float: left;
    width: 16.6%;
    text-align: center
}

.easel-pager a {
    font: 17px/1.2 roboto-bold-webfont, sans-serif;
    color: #5a6063
}

.easel-pager a.active, .easel-pager a:hover {
    color: #029edd
}

#easel-slide-section .frame {
    position: relative
}

.easel-controls .pull-left, .easel-controls .pull-right {
    top: 124px;
    z-index: 50
}

.easel-controls .pull-left {
    left: -28px
}

.easel-controls .pull-right {
    right: -36px
}

.easel-active-0 .easel-controls .pull-left, .easel-active-5 .easel-controls .pull-right {
    display: none
}

.rocket-section {
    padding: 76px 0 114px;
    position: relative;
    background: url("../image/tzz_ion-1.png")
}

.rocket-animation {
    height: 470px;
    position: relative;
    z-index: 2;
    background: url("../image/tzz_ion-1.jpg") 50% 100% no-repeat
}

.clouds-bottom {
    width: 82%;
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 1;
    -webkit-animation: cloudsBottom 8s infinite;
    animation: cloudsBottom 8s infinite
}

.clouds-bottom path {
    fill: rgba(133, 251, 255, .25)
}

@-webkit-keyframes cloudsBottom {
    0% {
        top: 100%
    }
    10% {
        top: 90%
    }
    15% {
        -webkit-transform: translate(5%, 0);
        transform: translate(5%, 0)
    }
    40% {
        top: 72%;
        -webkit-transform: translate(-7%, 0);
        transform: translate(-7%, 0)
    }
    60% {
        -webkit-transform: translate(7%, 0);
        transform: translate(7%, 0)
    }
    80% {
        top: 72%;
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }
    100% {
        top: 100%
    }
}

@keyframes cloudsBottom {
    0% {
        top: 100%
    }
    10% {
        top: 90%
    }
    15% {
        -webkit-transform: translate(5%, 0);
        transform: translate(5%, 0)
    }
    40% {
        top: 72%;
        -webkit-transform: translate(-7%, 0);
        transform: translate(-7%, 0)
    }
    60% {
        -webkit-transform: translate(7%, 0);
        transform: translate(7%, 0)
    }
    80% {
        top: 72%;
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }
    100% {
        top: 100%
    }
}

.clouds-bottom2 {
    width: 64%;
    display: block;
    position: absolute;
    top: 100%;
    right: 3%;
    z-index: 2;
    -webkit-animation: cloudsBottom2 8s infinite;
    animation: cloudsBottom2 8s infinite
}

.clouds-bottom2 path {
    fill: rgba(133, 251, 255, .37)
}

@-webkit-keyframes cloudsBottom2 {
    0% {
        top: 100%
    }
    20%, 22% {
        top: 90%
    }
    40% {
        top: 81%;
        -webkit-transform: translate(2%, 0);
        transform: translate(2%, 0)
    }
    80% {
        top: 81%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    100% {
        top: 100%
    }
}

@keyframes cloudsBottom2 {
    0% {
        top: 100%
    }
    20%, 22% {
        top: 90%
    }
    40% {
        top: 81%;
        -webkit-transform: translate(2%, 0);
        transform: translate(2%, 0)
    }
    80% {
        top: 81%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    100% {
        top: 100%
    }
}

.small-clouds {
    position: absolute;
    z-index: 3;
    top: 100%;
    left: 0;
    width: 100%;
    min-height: 160px;
    -webkit-animation: smallClouds 8s infinite;
    animation: smallClouds 8s infinite
}

@-webkit-keyframes smallClouds {
    0% {
        top: 100%
    }
    15% {
        top: 60%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    30% {
        -webkit-transform: translate(3%, 0);
        transform: translate(3%, 0)
    }
    40% {
        top: 32%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    60% {
        -webkit-transform: translate(2%, 0);
        transform: translate(2%, 0)
    }
    80% {
        top: 32%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0);
        opacity: 1
    }
    90% {
        opacity: 0
    }
    100% {
        top: 100%;
        opacity: 0
    }
}

@keyframes smallClouds {
    0% {
        top: 100%
    }
    15% {
        top: 60%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    30% {
        -webkit-transform: translate(3%, 0);
        transform: translate(3%, 0)
    }
    40% {
        top: 32%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0)
    }
    60% {
        -webkit-transform: translate(2%, 0);
        transform: translate(2%, 0)
    }
    80% {
        top: 32%;
        -webkit-transform: translate(-2%, 0);
        transform: translate(-2%, 0);
        opacity: 1
    }
    90% {
        opacity: 0
    }
    100% {
        top: 100%;
        opacity: 0
    }
}

.small-cloud {
    display: block;
    position: absolute
}

.small-cloud1 {
    top: 66px;
    left: 264px;
    width: 110px
}

.small-cloud2 {
    top: 64px;
    left: 540px;
    width: 164px
}

.small-cloud3 {
    top: 0;
    right: 100px;
    width: 144px
}

.small-cloud1 {
    fill: rgba(255, 255, 255, .3)
}

.small-cloud2 {
    fill: rgba(255, 255, 255, .14)
}

.small-cloud3 {
    fill: rgba(255, 255, 255, .06)
}

.stars {
    position: absolute;
    z-index: 4;
    top: 100%;
    left: 9%;
    width: 77.5%
}

.stars-front {
    -webkit-animation: stars 8s 2s infinite;
    animation: stars 8s 2s infinite
}

@-webkit-keyframes stars {
    0% {
        top: 100%
    }
    20% {
        top: 35%;
        opacity: .5
    }
    40% {
        top: 45%;
        opacity: 1
    }
    60% {
        opacity: .5
    }
    100% {
        top: 45%;
        opacity: 0
    }
}

@keyframes stars {
    0% {
        top: 100%
    }
    20% {
        top: 35%;
        opacity: .5
    }
    40% {
        top: 45%;
        opacity: 1
    }
    60% {
        opacity: .5
    }
    100% {
        top: 45%;
        opacity: 0
    }
}

.stars path, .stars-back path {
    fill: #80c0da
}

.stars-center {
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 63%
}

.stars-center-l svg {
    position: relative;
    -webkit-animation: starLeft 8s 2s infinite;
    animation: starLeft 8s 2s infinite
}

.stars-center-r svg, .stars-front .star-right svg {
    position: relative;
    -webkit-animation: starRight 8s 2s infinite;
    animation: starRight 8s 2s infinite
}

.star-left {
    position: absolute;
    top: 6px;
    left: 0;
    width: 14px
}

.stars-front .star-left {
    -webkit-animation: starLeft 8s 2s infinite;
    animation: starLeft 8s 2s infinite
}

@-webkit-keyframes starLeft {
    0%, 40% {
        left: 0
    }
    100%, 65% {
        left: -40px
    }
}

@keyframes starLeft {
    0%, 40% {
        left: 0
    }
    100%, 65% {
        left: -40px
    }
}

@-webkit-keyframes starRight {
    0%, 40% {
        right: 0
    }
    100%, 65% {
        right: -30px
    }
}

@keyframes starRight {
    0%, 40% {
        right: 0
    }
    100%, 65% {
        right: -30px
    }
}

.star-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 14px
}

.stars-back {
    position: absolute;
    top: 34%;
    left: 0;
    width: 100%;
    opacity: 0;
    -webkit-animation: starsBack 8s 2s infinite;
    animation: starsBack 8s 2s infinite
}

@-webkit-keyframes starsBack {
    0%, 35% {
        opacity: 0
    }
    40% {
        opacity: 1
    }
    60% {
        opacity: .5
    }
    100% {
        opacity: 0
    }
}

@keyframes starsBack {
    0%, 35% {
        opacity: 0
    }
    40% {
        opacity: 1
    }
    60% {
        opacity: .5
    }
    100% {
        opacity: 0
    }
}

.sb-star1 {
    position: absolute;
    top: 0;
    left: 68px;
    width: 12px
}

.sb-star2 {
    position: absolute;
    top: 26px;
    left: 270px;
    width: 36px
}

.sb-star3 {
    position: absolute;
    top: 106px;
    left: 406px;
    width: 12px
}

.sb-star4 {
    position: absolute;
    top: 36px;
    right: 216px;
    width: 24px
}

.rocket-slider-wrap {
    max-width: 980px;
    margin: 0 auto;
    background: #f5f5f5;
    position: relative;
    z-index: 4
}

.rocket-slider-wrap.alt {
    max-width: 1103px;
    margin-top: 60px
}

.rocket-slider {
    position: relative;
    top: 10px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 1px rgba(0, 0, 0, .2), 0 3px 3px rgba(0, 0, 0, .2);
    padding: 44px 72px;
    z-index: 4
}

.rocket-slider-text {
    font: 16px/1.6 Arial, sans-serif;
    color: #5a6063;
    overflow: hidden
}

.rocket-slider-inner {
    position: relative
}

.rocket-controls .pull-left, .rocket-controls .pull-right {
    top: 0;
    bottom: 0;
    margin: auto 0
}

.rocket-controls .pull-left {
    left: -6px
}

.rocket-controls .pull-right {
    width: 23px;
    right: 18px
}

.rocket-active-0 .rocket-controls .pull-left, .rocket-active-5 .rocket-controls .pull-right, .rocket-active-7 .alt .rocket-controls .pull-right {
    display: none
}

.rocket-active-5 .alt .rocket-controls .pull-right {
    display: block
}

.rst-col:first-child {
    text-align: center
}

.rst-col .img {
    width: 310px;
    height: 310px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-transition: all .2s;
    transition: all .2s
}

.rst-col .strategy {
    background-image: url("../image/tzz_ion-1.png")
}

.rst-col .planning {
    background-image: url("../image/tzz_ion-1.png")
}

.rst-col .design {
    background-image: url("../image/tzz_ion-1.png")
}

.rst-col .fed {
    background-image: url("../image/tzz_ion-1.png")
}

.rst-col .testing {
    background-image: url("../image/tzz_ion-1.png")
}

.rst-col .optimization {
    background-image: url("../image/tzz_ion-1.png")
}

.blue-heading {
    font-size: 17px;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 6;
    margin-bottom: -174px
}

.blue-heading h2 {
    font: 49px/1.3 roboto-bold-webfont, sans-serif;
    color: #fff;
    letter-spacing: -1px;
    margin: 0 0 5px
}

.blue-heading h2 span {
    : roboto-light-webfont, sans-serif
}

.r-fil4 {
    fill: #0078AE
}

.r-fil3 {
    fill: #009DDC
}

.r-fil2, .r-fil6 {
    fill: #B3B3B3
}

.r-fil0 {
    fill: #fff
}

.r-fil1 {
    fill: #B3B3B3;
    fill-rule: nonzero
}

.r-fil5 {
    fill: #fff;
    fill-rule: nonzero
}

.rocket-item {
    width: 60px;
    position: absolute;
    left: 6%;
    bottom: 1%;
    z-index: 10;
    -webkit-transform: rotate(70deg);
    transform: rotate(70deg);
    -webkit-transition: all .4s linear;
    transition: all .4s linear
}

@-webkit-keyframes rocketFinalStep {
    0% {
        left: 70%;
        bottom: 8%;
        -webkit-transform: rotate(70deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        -webkit-transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
}

@keyframes rocketFinalStep {
    0% {
        left: 70%;
        bottom: 8%;
        transform: rotate(70deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalStep5 {
    0% {
        left: 6%;
        bottom: 1%;
        -webkit-transform: rotate(0deg) scale(1)
    }
    5% {
        -webkit-transform: rotate(81deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        -webkit-transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
}

@keyframes rocketFinalStep5 {
    0% {
        left: 6%;
        bottom: 1%;
        transform: rotate(0deg) scale(1)
    }
    5% {
        transform: rotate(81deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalStep4 {
    0% {
        left: 23%;
        bottom: 8%;
        -webkit-transform: rotate(24deg) scale(1)
    }
    5% {
        -webkit-transform: rotate(81deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        -webkit-transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
}

@keyframes rocketFinalStep4 {
    0% {
        left: 23%;
        bottom: 8%;
        transform: rotate(24deg) scale(1)
    }
    5% {
        transform: rotate(81deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalStep3 {
    0% {
        left: 39%;
        bottom: 4%;
        -webkit-transform: rotate(73deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        -webkit-transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
}

@keyframes rocketFinalStep3 {
    0% {
        left: 39%;
        bottom: 4%;
        transform: rotate(73deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalStep2 {
    0% {
        left: 55%;
        bottom: 6%;
        -webkit-transform: rotate(83deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        -webkit-transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
}

@keyframes rocketFinalStep2 {
    0% {
        left: 55%;
        bottom: 6%;
        transform: rotate(83deg) scale(1)
    }
    20% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1)
    }
    50% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    60% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    70% {
        left: 22%;
        bottom: 30%;
        transform: rotate(-230deg) scale(0.4);
        opacity: .5
    }
    90% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    100% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalBack {
    0% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        -webkit-transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 70%;
        bottom: 8%;
        -webkit-transform: rotate(70deg) scale(1)
    }
}

@keyframes rocketFinalBack {
    0% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 70%;
        bottom: 8%;
        transform: rotate(70deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalBack3 {
    0% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        -webkit-transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 55%;
        bottom: 6%;
        -webkit-transform: rotate(70deg) scale(1)
    }
}

@keyframes rocketFinalBack3 {
    0% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 55%;
        bottom: 6%;
        transform: rotate(70deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalBack2 {
    0% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        -webkit-transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 39%;
        bottom: 4%;
        -webkit-transform: rotate(73deg) scale(1)
    }
}

@keyframes rocketFinalBack2 {
    0% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    100% {
        left: 39%;
        bottom: 4%;
        transform: rotate(73deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalBack1 {
    0% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        -webkit-transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    85% {
        bottom: 4%;
        -webkit-transform: rotate(73deg) scale(1)
    }
    100%, 95% {
        left: 23%;
        bottom: 8%;
        -webkit-transform: rotate(24deg) scale(1)
    }
}

@keyframes rocketFinalBack1 {
    0% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    85% {
        bottom: 4%;
        transform: rotate(73deg) scale(1)
    }
    100%, 95% {
        left: 23%;
        bottom: 8%;
        transform: rotate(24deg) scale(1)
    }
}

@-webkit-keyframes rocketFinalBack0 {
    0% {
        left: 64%;
        bottom: 7%;
        -webkit-transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        -webkit-transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        -webkit-transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        -webkit-transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        -webkit-transform: rotate(44deg) scale(1);
        opacity: 1
    }
    85% {
        bottom: 4%;
        -webkit-transform: rotate(73deg) scale(1)
    }
    100% {
        left: 6%;
        bottom: 1%;
        -webkit-transform: rotate(0deg) scale(1)
    }
}

@keyframes rocketFinalBack0 {
    0% {
        left: 64%;
        bottom: 7%;
        transform: rotate(-287deg) scale(1)
    }
    20% {
        left: 39%;
        bottom: 2%;
        transform: rotate(-275deg) scale(0.8);
        opacity: 1
    }
    35% {
        left: 27%;
        bottom: 41%;
        transform: rotate(-120deg) scale(0.4);
        opacity: .5
    }
    50% {
        left: 50%;
        bottom: 58%;
        transform: rotate(-74deg) scale(0.4);
        opacity: .3
    }
    60% {
        left: 84%;
        bottom: 30%;
        transform: rotate(44deg) scale(1);
        opacity: 1
    }
    85% {
        bottom: 4%;
        transform: rotate(73deg) scale(1)
    }
    100% {
        left: 6%;
        bottom: 1%;
        transform: rotate(0deg) scale(1)
    }
}

@-webkit-keyframes rocketMobAnimation {
    0% {
        -webkit-transform: rotate(78deg) translate(0, 0)
    }
    50% {
        -webkit-transform: rotate(79deg) translate(5%, 0)
    }
    100% {
        -webkit-transform: rotate(78deg) translate(0, 0)
    }
}

@keyframes rocketMobAnimation {
    0% {
        transform: rotate(78deg) translate(0, 0)
    }
    50% {
        transform: rotate(79deg) translate(5%, 0)
    }
    100% {
        transform: rotate(78deg) translate(0, 0)
    }
}

.rocket-body {
    width: 60px;
    height: 216px;
    display: block;
    position: relative;
    z-index: 2
}

.rocket-flame {
    display: none;
    position: absolute;
    top: 187px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 28px;
    height: 46px;
    z-index: 1;
    -webkit-transition: opacity .4s linear;
    transition: opacity .4s linear
}

@-webkit-keyframes flameFinalStep {
    0%, 29% {
        opacity: 0
    }
    30%, 80% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes flameFinalStep {
    0%, 29% {
        opacity: 0
    }
    30%, 80% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.rocket-flame svg {
    position: absolute;
    top: 0;
    left: 0
}

.rocket-flame .flame1 {
    -webkit-animation: flame 1s infinite linear;
    animation: flame 1s infinite linear
}

.rocket-flame .flame2 {
    width: 110%;
    -webkit-animation: flame 1s .3s infinite linear;
    animation: flame 1s .3s infinite linear
}

@-webkit-keyframes flame {
    0% {
        -webkit-transform: translate(-6px, 0) scale(1);
        opacity: 0;
        z-index: 1
    }
    5% {
        opacity: 1
    }
    40% {
        -webkit-transform: translate(1px, -4px) scale(.9);
        opacity: .5
    }
    70% {
        -webkit-transform: translate(-4px, 0) scale(1.2);
        opacity: 1;
        z-index: 2
    }
    100% {
        -webkit-transform: translate(-6px, 0) scale(1);
        opacity: .5;
        z-index: 1
    }
}

@keyframes flame {
    0% {
        transform: translate(-6px, 0) scale(1);
        opacity: 0;
        z-index: 1
    }
    5% {
        opacity: 1
    }
    40% {
        transform: translate(1px, -4px) scale(.9);
        opacity: .5
    }
    70% {
        transform: translate(-4px, 0) scale(1.2);
        opacity: 1;
        z-index: 2
    }
    100% {
        transform: translate(-6px, 0) scale(1);
        opacity: .5;
        z-index: 1
    }
}

.smoke-sprite {
    display: none
}

.start-smoke {
    position: absolute;
    top: 190px;
    left: 0;
    right: 0;
    width: 1px;
    height: 1px;
    margin: 0 auto
}

@-webkit-keyframes smokeFinalStep {
    0%, 38% {
        opacity: 1
    }
    100%, 40% {
        opacity: 0
    }
}

@keyframes smokeFinalStep {
    0%, 38% {
        opacity: 1
    }
    100%, 40% {
        opacity: 0
    }
}

.start-smoke svg {
    width: 100%;
    max-height: 100%
}

.start-smoke path {
    fill: rgba(255, 255, 255, .3)
}

.sm-smoke1 {
    display: block;
    position: absolute;
    top: -28px;
    width: 130px;
    height: 66px;
    opacity: 0
}

.sm-smoke1-left {
    top: -20px;
    right: 100%;
    -webkit-transform: rotate(-156deg);
    transform: rotate(-156deg)
}

@-webkit-keyframes smoke1 {
    0% {
        opacity: 1;
        width: 30px
    }
    100% {
        width: 130px
    }
}

@keyframes smoke1 {
    0% {
        opacity: 1;
        width: 30px
    }
    100% {
        width: 130px
    }
}

.sm-smoke2 {
    display: block;
    position: absolute;
    top: 12px;
    width: 66px;
    height: 40px;
    opacity: 0;
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg)
}

.sm-smoke2-left {
    right: 100%;
    -webkit-transform: rotate(-174deg);
    transform: rotate(-174deg)
}

@-webkit-keyframes smoke2 {
    0% {
        opacity: 1;
        width: 0
    }
    100% {
        width: 100px
    }
}

@keyframes smoke2 {
    0% {
        opacity: 1;
        width: 0
    }
    100% {
        width: 100px
    }
}

.running-smoke {
    display: block;
    position: absolute;
    top: 12px;
    left: -44px;
    width: 84px;
    height: 50px;
    opacity: 0;
    -webkit-transform: rotate(-70deg) translate(16px, 0) scale(0.6);
    transform: rotate(-70deg) translate(16px, 0) scale(0.6)
}

.rm-smoke1 {
    -webkit-animation: runningSmoke 1s infinite linear;
    animation: runningSmoke 1s infinite linear
}

.rm-smoke2 {
    -webkit-animation: runningSmoke 1s infinite linear .5s;
    animation: runningSmoke 1s infinite linear .5s
}

@-webkit-keyframes runningSmoke {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-70deg) translate(16px, 0) scale(0.6)
    }
    50% {
        opacity: 1;
        -webkit-transform: rotate(-70deg) translate(0, 0) scale(1)
    }
    100% {
        opacity: 0;
        -webkit-transform: rotate(-70deg) translate(-36px, 0) scale(0.4)
    }
}

@keyframes runningSmoke {
    0% {
        opacity: 0;
        transform: rotate(-70deg) translate(16px, 0) scale(0.6)
    }
    50% {
        opacity: 1;
        transform: rotate(-70deg) translate(0, 0) scale(1)
    }
    100% {
        opacity: 0;
        transform: rotate(-70deg) translate(-36px, 0) scale(0.4)
    }
}

.go-next-step {
    position: absolute;
    top: -45px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 90px;
    height: 90px;
    border-width: 5px;
    border-style: solid;
    border-radius: 50%;
    z-index: 20
}

.step-color-grey {
    background: #d8ddde
}

.step-color-blue {
    background: #016997
}

.step-color-light-blue {
    background: #dde4e9
}

.step-color-light-grey {
    background: #f1f3f2
}

.step-color-dark-grey {
    background: #4f4f4f
}

.step-color-dark {
    background: #13181d
}

.step-color-white {
    background: #fff
}

.step-border-white {
    border-color: #fff
}

.step-border-dark {
    border-color: #13181d
}

.step-border-blue {
    border-color: #0090c1
}

.step-border-light-grey {
    border-color: #f9f9f9
}

.step-boder-dark-grey {
    border-color: #4f4f4f
}

.gns-arrow {
    width: 56px;
    height: 28px;
    position: absolute;
    top: 36%;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transition: -webkit-transform .2s linear;
    transition: transform .2s linear
}

.go-next-step:hover .gns-arrow {
    -webkit-transform: translate(0, 8px);
    transform: translate(0, 8px)
}

.gs-arrow-left {
    fill: #4FBAEE
}

.gs-arrow-right {
    fill: #5AA6C8
}

.wvs-play-video {
    display: block;
    margin: 0 auto 38px;
    width: 134px;
    height: 134px;
    border-radius: 50%;
    border: 3px solid #fff;
    font-size: 0;
    line-height: 0;
    color: transparent;
    position: relative;
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear
}

.wvs-play-video:hover {
    opacity: .5
}

.wvs-play-video:before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto 0 auto 48px;
    content: "";
    width: 40px;
    height: 62px;
    background: url("../image/tzz_ion-1.png") -760px -280px no-repeat
}

.full-services-section {
    padding: 94px 10px;
    background: #fff;
    box-shadow: inset 0 4px 78px rgba(0, 0, 0, .1);
    position: relative
}

.full-services-section h2 {
    font: 50px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    text-align: center;
    margin: 0 0 50px
}

.full-services-section h2 span {
    : roboto-bold-webfont
}

.fss-frame {
    max-width: 980px;
    margin: 0 auto
}

.services-tabs {
    margin: 0 0 24px;
    position: relative;
    font-size: 0;
    line-height: 0
}

.services-tabs:before {
    position: absolute;
    top: 77px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 74%;
    height: 22px;
    content: "";
    background: #d5d5d5;
    background: -moz-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d5d5d5), color-stop(10%, #dedede), color-stop(14%, #e5e5e5), color-stop(29%, #f1f1f1), color-stop(38%, #f6f6f6), color-stop(48%, #f8f8f8), color-stop(81%, #f8f8f8), color-stop(90%, #f6f6f6), color-stop(100%, #f1f1f1));
    background: -webkit-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: -ms-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: linear-gradient(to bottom, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    z-index: 1
}

.services-tabs li {
    display: inline-block;
    vertical-align: top;
    width: 33%;
    position: relative;
    z-index: 2;
    padding: 192px 0 0
}

.fss-step-number {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 176px;
    height: 176px
}

.fss-step-number strong {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 152px;
    height: 152px;
    border-radius: 50%;
    background: #f7f7f7;
    box-shadow: inset 0 3px 4px rgba(0, 0, 0, .2);
    content: "";
    z-index: 1;
    -webkit-transition: all .2s;
    transition: all .2s
}

.active .fss-step-number strong {
    width: 176px;
    height: 176px
}

.fss-step-number strong:after, li:nth-child(2) .fss-step-number strong:before {
    position: absolute;
    top: 50%;
    margin-top: -11px;
    width: 3px;
    height: 22px;
    content: "";
    background: #d5d5d5;
    background: -moz-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d5d5d5), color-stop(10%, #dedede), color-stop(14%, #e5e5e5), color-stop(29%, #f1f1f1), color-stop(38%, #f6f6f6), color-stop(48%, #f8f8f8), color-stop(81%, #f8f8f8), color-stop(90%, #f6f6f6), color-stop(100%, #f1f1f1));
    background: -webkit-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: -ms-linear-gradient(top, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%);
    background: linear-gradient(to bottom, #d5d5d5 0, #dedede 10%, #e5e5e5 14%, #f1f1f1 29%, #f6f6f6 38%, #f8f8f8 48%, #f8f8f8 81%, #f6f6f6 90%, #f1f1f1 100%)
}

li:first-child .fss-step-number strong:after {
    right: 0
}

li:last-child .fss-step-number strong:after, li:nth-child(2) .fss-step-number strong:after {
    left: 0
}

li:nth-child(2) .fss-step-number strong:before {
    right: 0
}

.fss-step-number em {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 118px;
    height: 118px;
    background: #fff;
    color: #a0a0a0;
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .05);
    font: 57px/118px roboto-bold-webfont, sans-serif;
    text-align: center;
    z-index: 2;
    -webkit-transition: all .2s;
    transition: all .2s
}

.active .fss-step-number em {
    color: #fff;
    background: rgba(136, 186, 0, 1);
    width: 142px;
    height: 142px;
    line-height: 142px
}

.fss-active-1 li:nth-child(1) .fss-step-number em, .fss-active-2 li:nth-child(1) .fss-step-number em, .fss-active-2 li:nth-child(2) .fss-step-number em {
    background: #0078ae;
    color: #fff
}

a:hover .fss-step-number em {
    color: #fff;
    background: rgba(136, 186, 0, 1)
}

.tab-text {
    font: 24px/1.1 roboto-bold-webfont, sans-serif;
    color: #a0a0a0;
    text-align: center;
    display: block;
    padding: 0 40px
}

.active .tab-text {
    color: #88ba00
}

.fss-active-1 li:nth-child(1) .tab-text, .fss-active-2 li:nth-child(1) .tab-text, .fss-active-2 li:nth-child(2) .tab-text {
    color: #0078ae
}

.progress-filler {
    margin: 0 0 60px;
    height: 17px;
    background: #0078ae;
    border-radius: 4px;
    position: relative
}

.progress-indicator {
    display: block;
    width: 33.33%;
    height: 17px;
    background: #88ba00;
    border-radius: 4px;
    -webkit-transition: width .4s;
    transition: width .4s
}

.fss-active-1 .progress-indicator {
    width: 66.66%
}

.fss-active-2 .progress-indicator {
    width: 100%
}

.progress-active {
    position: absolute;
    top: 100%;
    margin-left: -22px;
    width: 0;
    height: 0;
    border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-top: 16px solid #88ba00;
    -webkit-transition: left .4s;
    transition: left .4s
}

.fss-active-0 .progress-active {
    left: 16.3%
}

.fss-active-1 .progress-active {
    left: 50%
}

.fss-active-2 .progress-active {
    left: 83.5%
}

.tabs-content {
    padding: 0 46px
}

.tabs-column {
    float: left;
    width: 57.8%;
    font-size: 17px;
    line-height: 1.6;
    color: #5a6063
}

.tabs-column:first-child {
    width: 42.1%;
    padding: 0 48px 0 0;
    font: 33px/1.2 roboto-bold-webfont, sans-serif;
    color: #0078ae
}

.tabs-content p {
    margin: 0 0 28px
}

.tabs-content a {
    font-weight: 700;
    color: #0078ae
}

.tabs-content a:hover {
    color: #88ba00
}

.mCustomScrollbar {
    -ms-touch-action: none;
    touch-action: none
}

.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action {
    -ms-touch-action: auto;
    touch-action: auto
}

.feat-gallery .start-load .mCustomScrollBox {
    opacity: 0
}

.mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: 0;
    direction: ltr;
    transition: opacity .1s linear
}

.mCSB_container {
    overflow: hidden;
    width: auto;
    height: auto
}

.mCSB_inside > .mCSB_container {
    margin-right: 35px
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0
}

.feat-gallery .mCS-dir-rtl > .mCSB_inside > .mCSB_container {
    margin-right: 0;
    margin-left: 30px
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-left: 0
}

.mCSB_scrollTools {
    position: absolute;
    width: 16px;
    height: auto;
    left: auto;
    top: 0;
    right: 0;
    bottom: 0
}

.mCSB_outside + .mCSB_scrollTools {
    right: -26px
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
    right: auto;
    left: 0
}

.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
    left: -26px
}

.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: auto
}

.mCSB_scrollTools a + .mCSB_draggerContainer {
    margin: 20px 0
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    height: 100%;
    margin: 0 auto;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px
}

.mCSB_scrollTools .mCSB_dragger {
    cursor: pointer;
    width: 100%;
    height: 30px;
    z-index: 1
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    position: relative;
    width: 4px;
    height: 100%;
    margin: 0 auto;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
    text-align: center
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 12px
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 8px
}

.mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonUp {
    display: block;
    position: absolute;
    height: 20px;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer
}

.mCSB_scrollTools .mCSB_buttonDown {
    bottom: 0
}

.mCSB_container_wrapper {
    position: absolute;
    height: auto;
    width: auto;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-right: 30px;
    margin-bottom: 30px
}

.mCSB_container_wrapper > .mCSB_container {
    padding-right: 30px;
    padding-bottom: 30px
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 20px
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 20px
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 0
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 0
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 20px
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 0
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper {
    margin-right: 0;
    margin-left: 30px
}

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
    padding-right: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
    padding-bottom: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
    margin-left: 0
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0
}

.mCSB_scrollTools, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    transition: opacity .2s ease-in-out, background-color .2s ease-in-out
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar {
    -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out
}

.mCSB_scrollTools {
    opacity: 1
}

.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
    opacity: 0
}

.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag {
    opacity: 1
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #dadada
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #009ddc
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #90c404
}

.mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight, .mCSB_scrollTools .mCSB_buttonUp {
    background-image: url("https://www.prismaxel.com/css/mCSB_buttons.png");
    background-repeat: no-repeat;
    opacity: .4
}

.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 0
}

.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -20px
}

.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -40px
}

.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -56px
}

.mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover, .mCSB_scrollTools .mCSB_buttonUp:hover {
    opacity: .75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)"
}

.mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active, .mCSB_scrollTools .mCSB_buttonUp:active {
    opacity: .9;
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)"
}

.feat-expanded-section {
    padding: 90px 0 60px;
    position: relative;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAllBMVEUVGh8UGR4WGyATGB0XHCEZHiMYHSIaHyQbICUSFxwUGR0YHSETGBwXHCAYHCETFxwVGh4ZHiIUGB0ZHSIWGx8SFxsaHyMbICQVGR4WGh8XGyAaHiMRFhsVGyARFRoRFhoQFRkSFhsUGBwTGR4UGh4UGh8VGiAaICQcISYQFBkSFhoSGB0TGR0UGR8VGR0WGh4XHSIZHyTRdQMyAAACMElEQVQYGQXBBYIkRxADQCmpqJmHFo7N9v8/5wgYkhD5j2sguqCKEziAeijEQZNkzrlnq42GLP/x0Dy2PRDEoZAAqhR5kIwq5jru/XvByQ5Ya88ByWEW2jgUQ88BvTp8x97dJpb873Qf1eyD47To0jAhFDyBfhxshgdNDKlmzZirFy/CWOCo1ldQ2AEiP0mcFPif1IdUmGC63W9D+hHmkiRqU8chDaFzATC8K7NebQPTB2SGMgTiVAQWf7t1qa0DAut1XlF6XT8HhLgaYKYvIbVA3DY0VSaZ4JRRdoDp5bxzdayaGHQxCfHJ1PphQVlmTiaUA53G1HUrRAOQjWSgu783OnNS5/y0j+3LDTMCzql7CGwnzvrkKHIGmYvqCmVW6NYRuN2OSNr6p5nDcOcvsRp6XIb0A1fnSsvCBEECmGy7emXXY4Sj5urWED1mxvfGjMRB0zXUYTJBk3G5q7IzW0WYBGOCwDto5gT8ROKq7pNPYQnHGH8N9Z/fBumfUkBkQhrMi8g8siSUsHHXNL7RURIdzkg661xOxpTVikhmKj3xALcgeXUcFuDX2NEV9K7boAQbjM61/d7vGZmNB5LMVRB4CEaclV9D3/9eyKQLV77q/fW2PaDMUNegM5keOsCQPk3vS1vi0zV9Ryw7TqhgXGYqB+u/OUp11Kd/fcP2ZbdqJbU9xDW9zJwZmTatJQwaGb05ZSMY33qemCxBkG8KhzqSONOms6SSSoiwiTFzoON/83IeUYnE+XAAAAAASUVORK5CYII=);
    text-align: center;
    z-index: 2
}

.feat-expanded-section .section-title {
    margin-bottom: 20px
}

.section-title.in-dark p {
    color: #878a8c;
    font: 20px roboto-light-webfont, sans-serif
}

.feat-section-frame {
    max-width: 1582px;
    margin: 0 auto
}

.wide-feat-frame {
    max-width: calc(100% - 100px)
}

.feat-section-frame .ready-discuss {
    background: rgba(255, 255, 255, .03);
    text-align: center;
    padding: 45px 0 50px;
    margin: 50px 6px 0
}

.feat-gallery-images .slide-item {
    display: none;
    outline: transparent solid 1px
}

.feat-gallery-images .slide-item.active-slide-item {
    display: block
}

.feat-gallery-images .slide-item.active-slide-item.no-transform, .feat-gallery-images .slide-item.active-slide-item.start-load {
    -webkit-clip-path: none;
    clip-path: none
}

.feat-gallery-images .mid-align .slide-img-wr {
    padding-top: 20px
}

.feat-expanded-section .tab-lnk {
    display: inline-block;
    vertical-align: top
}

.feat-expanded-section .tab-lnk > a {
    display: inline-block;
    height: auto;
    width: 100%
}

.wide-featexp-section .tab-lnk > a {
    overflow: hidden
}

.feat-expanded-section .exp-bg {
    background-color: #000;
    padding: 15px 0;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: 0 19px;
    position: relative;
    z-index: 2;
    overflow: hidden
}

.wide-featexp-section .exp-bg {
    margin-bottom: 50px;
    padding-bottom: 85px
}

.feat-expanded-section .feat-section-frame {
    position: relative
}

.feat-expanded-section .exp-bg.arctic {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.athletic {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.flex {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mark {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.luxury {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.school {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.global {
    background-image: url("../image/tzz_ion-1.png")
}

.feat-expanded-section .exp-bg.career {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.family {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.lemoyne {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.college {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.havi {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.glass {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.seamless2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bcn {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.leading {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.ewing {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.winchester {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.loanscribe {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.shenkman {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.unionbank {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.ebond {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.hazeltree {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.deborah {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.vintry {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mood {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.portmantos {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.portmantos2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.juice {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.juice2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.baldor {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.aol {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.tweezerman {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.epicreads {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.johnjay {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.nfl {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.penguin {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.paulstuart {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.uspolo {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.ronin {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.royal {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.benihana {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.stark {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.biowars {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.nyod {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.dance {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.amf {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.nuna {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.nuna2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.tishman, .feat-expanded-section .exp-bg.tishman2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.fitness {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.serviceking {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.napoli {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.toysrus {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mballet, .feat-expanded-section .exp-bg.mballet2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.seamless {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.cayman, .feat-expanded-section .exp-bg.cayman2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.engel {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.leon {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.tricon {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.solil {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.first-pioneer {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.allied {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mem {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.sonobello {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.orthology {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.uct {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.longlive {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bone {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.medcpu {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.collegepark {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.btb {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.magnolia {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.rana {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.juice3 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.kosher {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.gny {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.wholesome {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.biowars2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mballet {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.mmh {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.laivideo {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bcn2 {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.snc {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.nssplus {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.intelligence {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.pactera {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bhue {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.ecaytrade {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bowlmor {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.bw {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.luxor {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.girlscouts {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .exp-bg.exhale {
    background-image: url("../image/tzz_ion-1.jpg")
}

.feat-expanded-section .fwb-item .active-lnk:after {
    display: none
}

.feat-expanded-section .fwb-item {
    margin-bottom: 0
}

.button-close {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 59px;
    height: 67px;
    background-color: #b20000;
    transition: background .3s;
    border-radius: 0 0 3px 3px;
    box-shadow: inset -1px -1px rgba(0, 0, 0, .3), inset 1px 0 #c43a3a, 1px 1px rgba(255, 255, 255, .2);
    color: #fff;
    z-index: 5
}

.button-close:active, .button-close:hover {
    background-color: #900101
}

.button-close:after, .button-close:before {
    content: "";
    width: 36px;
    height: 4px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 2px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    transition: all .2s
}

.button-close:after {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg)
}

.feat-content .btn-raq, .feat-content .link-arrow.blue {
    text-transform: uppercase;
    color: #009ddc !important;
    font: 17px roboto-bold-webfont, sans-serif;
    margin-top: 7px;
    display: inline-block;
    border: none
}

.feat-content .link-arrow.blue {
    margin-top: 0
}

.feat-content {
    max-width: 1280px;
    margin: 0 auto;
    text-align: left;
    position: relative
}

.widefeat-content {
    max-width: 1582px
}

.widefeat-gallery.alt .feat-gallery-thumbs {
    background: #1f1f1f;
    min-height: 650px
}

.feat-brand {
    text-indent: -9999px;
    overflow: hidden;
    text-align: center;
    height: 178px;
    position: absolute;
    width: calc(100% - 416px);
    top: 7px;
    right: 0;
    max-width: 953px
}

.widefeat-brand {
    width: calc(100% - 654px)
}

.feat-brand:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.athletic .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 199px;
    height: 52px
}

.arctic .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 122px;
    height: 76px
}

.mark .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 237px;
    height: 78px
}

.flex .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 192px;
    height: 50px
}

.school .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 135px;
    height: 96px
}

.luxury .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 237px;
    height: 56px
}

.global .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 350px;
    height: 77px
}

.career .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 252px;
    height: 44px
}

.family .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 100px;
    height: 129px
}

.lemoyne .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 60px
}

.college .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 188px;
    height: 75px
}

.havi .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 181px;
    height: 64px
}

.glass .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 236px;
    height: 53px
}

.bcn .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 181px;
    height: 57px
}

.seamless2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 176px;
    height: 67px
}

.leading .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 197px;
    height: 51px
}

.ewing .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 205px;
    height: 53px
}

.winchester .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 160px;
    height: 74px
}

.loanscribe .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 232px;
    height: 32px
}

.shenkman .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 255px;
    height: 47px
}

.unionbank .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 198px;
    height: 77px
}

.ebond .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 307px;
    height: 50px
}

.hazeltree .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 249px;
    height: 58px
}

.exhale .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 196px;
    height: 41px
}

.girlscouts .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 193px;
    height: 76px
}

.bhue .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 138px;
    height: 66px
}

.ecaytrade .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 223px;
    height: 31px
}

.bowlmor .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 251px;
    height: 62px
}

.pactera .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 179px;
    height: 71px
}

.deborah .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 188px;
    height: 68px
}

.mood .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 151px;
    height: 75px
}

.juice .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 193px;
    height: 126px
}

.portmantos .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 220px;
    height: 102px
}

.vintry .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 154px;
    height: 55px
}

.tweezerman .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 297px;
    height: 49px
}

.baldor .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 168px;
    height: 106px
}

.aol .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 319px;
    height: 89px
}

.nuna .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 278px;
    height: 48px
}

.epicreads .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 236px;
    height: 65px
}

.dance .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 288px;
    height: 44px
}

.penguin .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 92px;
    height: 129px
}

.johnjay .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 129px;
    height: 93px
}

.nfl .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 91px;
    height: 123px
}

.paulstuart .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 215px;
    height: 36px
}

.uspolo .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 291px;
    height: 54px
}

.amf .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 141px;
    height: 109px
}

.royal .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 223px;
    height: 95px
}

.benihana .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 160px;
    height: 163px
}

.biowars .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 252px;
    height: 68px
}

.stark .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 204px;
    height: 47px
}

.ronin .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 354px;
    height: 28px
}

.nyod .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 118px;
    height: 128px
}

.cayman .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 336px;
    height: 71px
}

.tishman .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 353px;
    height: 68px
}

.seamless .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 182px;
    height: 102px
}

.toysrus .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 241px;
    height: 119px
}

.fitness .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 264px;
    height: 64px
}

.napoli .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 264px;
    height: 64px
}

.serviceking .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 202px;
    height: 71px
}

.mballet .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 282px;
    height: 36px
}

.engel .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 287px;
    height: 68px
}

.cayman2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 286px;
    height: 60px
}

.leon .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 266px;
    height: 128px
}

.tricon .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 254px;
    height: 58px
}

.solil .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 135px;
    height: 135px
}

.tishman2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 304px;
    height: 59px
}

.first-pioneer .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 243px;
    height: 79px
}

.allied .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 279px;
    height: 48px
}

.mem .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 155px;
    height: 155px
}

.sonobello .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 152px;
    height: 103px
}

.orthology .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 230px;
    height: 49px
}

.uct .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 64px;
    height: 103px
}

.collegepark .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 224px;
    height: 43px
}

.medcpu .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 224px;
    height: 46px
}

.longlive .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 210px;
    height: 32px
}

.bone .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 212px;
    height: 54px
}

.btb .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 229px;
    height: 112px
}

.rana .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 144px;
    height: 85px
}

.kosher .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 237px;
    height: 46px
}

.magnolia .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 136px;
    height: 102px
}

.juice3 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") 0 0/100% auto no-repeat;
    width: 170px;
    height: 111px
}

.gny .feat-brand:after {
    background: url("../image/tzz_ion-1.jpg") no-repeat;
    width: 132px;
    height: 70px
}

.wholesome .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 220px;
    height: 79px
}

.mballet2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") 0 0/100% auto no-repeat;
    width: 252px;
    height: 32px
}

.mmh .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 90px;
    height: 130px
}

.laivideo .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 204px;
    height: 36px
}

.biowars2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") 0 0/100% auto no-repeat;
    width: 200px;
    height: 54px
}

.bcn2 .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 210px;
    height: 51px
}

.nssplus .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 241px;
    height: 112px
}

.snc .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 223px;
    height: 42px
}

.intelligence .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 262px;
    height: 67px
}

.bw .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 131px;
    height: 66px
}

.luxor .feat-brand:after {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 205px;
    height: 58px
}

.feat-txt h5, .feat-txt h6 {
    font: 22px/1.3 roboto-light-webfont, sans-serif;
    margin-bottom: 25px;
    color: #fff
}

.feat-txt p {
    margin-bottom: 20px
}

.feat-txt p a {
    transition: color .3s linear
}

.feat-txt p a:hover {
    color: #fff
}

.feat-txt ul li {
    line-height: 1.5;
    padding-left: 19px
}

.feat-txt ul li:before {
    content: "Â»";
    display: inline-block;
    font-size: 19px;
    color: #009ddc;
    text-indent: -19px
}

.feat-txt-holder {
    position: relative;
    overflow: hidden;
    padding: 185px 0 0;
    margin-right: 50px;
    z-index: 3
}

.widefeat-txt-holder {
    margin-right: 0;
    padding-top: 179px
}

.feat-txt {
    padding: 46px 46px 24px 454px;
    position: relative;
    box-sizing: border-box;
    border: solid #4a4a4a;
    border-width: 0 1px 1px 0;
    background: #1f1f1f;
    color: #fff;
    font-size: 16px;
    line-height: 1.7;
    z-index: 3;
    max-width: 953px
}

.widefeat-txt {
    max-width: 1306px;
    padding: 46px 40px 24px 710px;
    border: none
}

.feat-content .link-arrow.green {
    float: right;
    margin: 0 10px 0 0;
    font-size: 17px
}

.feat-content .link-arrow.green:before {
    background: #383c40
}

.scroll-area {
    height: 488px
}

.feat-txt .btn-holder br {
    display: none
}

.feat-content .btn-holder {
    border-top: 1px solid #3d3d3d;
    margin: 35px 0 0;
    padding: 24px 0 0
}

.feat-gallery {
    z-index: 4;
    float: left;
    max-width: 728px;
    margin: 53px 63px 0 0;
    min-height: 850px;
    position: relative
}

.widefeat-gallery {
    min-height: 650px
}

.feat-gallery-images {
    position: absolute;
    top: 0;
    left: 100%;
    width: 515px;
    z-index: 4;
    overflow: hidden
}

.wide-gallery-images {
    width: 716px;
    overflow: visible
}

.feat-gallery-images .mCSB_inside > .mCSB_container {
    margin-right: 0
}

.feat-gallery-images .mCSB_scrollTools {
    width: 0;
    overflow: hidden
}

.feat-gallery-images .slide-item {
    width: 100%;
    position: relative;
    color: #fff;
    overflow: hidden;
    height: 835px
}

.wide-gallery-images .slide-item {
    height: 855px;
    overflow: visible
}

.feat-gallery-images .slide-item.no-transform, .wide-gallery-images .slide-item:not(.no-transform) .slide-item-inner {
    overflow: visible
}

.wide-gallery-images .active-slide-item .slide-item-inner:before {
    content: "";
    width: 20px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    box-shadow: -10px 0 20px -5px rgba(0, 0, 0, .3);
    transition: opacity .1s linear;
    z-index: 4
}

.feat-gallery-images .active-slide-item .slide-item-inner:after {
    content: "";
    width: calc(100% - 36px);
    height: 250px;
    position: absolute;
    bottom: -1px;
    left: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%);
    transition: opacity .1s linear;
    z-index: 4
}

.wide-gallery-images .active-slide-item .slide-item-inner:after {
    width: 100%
}

.feat-gallery-images .loaded.slide-item-inner .img-slide {
    background-color: transparent
}

.wide-gallery-images .start-load.slide-item:not(.no-transform):first-child {
    background: #fff;
    transition: background-color .5s linear
}

.wide-gallery-images .start-load.slide-item:not(.no-transform):first-child .loaded {
    background: 0 0
}

.feat-gallery-images .start-load .slide-item-inner .img-slide, .feat-gallery-images .start-load .slide-item-inner:after, .wide-gallery-images .start-load .slide-item-inner:before {
    opacity: 0
}

.feat-gallery-images .slide-item-inner .img-slide, .feat-gallery-images .slide-item-inner:after, .wide-gallery-images .slide-item-inner:before {
    opacity: 1
}

.feat-gallery-images .slide-item.no-transform .slide-item-inner:after, .wide-gallery-images .slide-item.no-transform .slide-item-inner:before {
    display: none
}

.start-load .slide-item-inner {
    overflow: visible
}

.slide-item-inner .img-loader:after {
    top: 270px
}

.slide-item-inner .img-loader {
    height: 835px
}

.slide-item-inner {
    padding-right: 36px;
    position: relative;
    overflow: hidden;
    z-index: 4
}

.wide-gallery-images .slide-item-inner {
    padding-right: 0
}

.feat-gallery-images .no-transform .slide-item-inner {
    overflow: visible
}

.expand-shape-wrap {
    position: absolute;
    top: 0;
    left: -1000000%
}

.no-transform .slide-item-inner img {
    max-width: 100%;
    max-height: 855px
}

.slide-img-wr {
    position: relative;
    text-align: center;
    -webkit-backface-visibility: hidden
}

.feat-gallery-images .slide-item.scroll .slide-item-inner, .feat-gallery-images .slide-item:first-child .slide-item-inner, .slide-item-inner {
    max-height: 855px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slide-item-inner .mCSB_inside > .mCSB_container {
    cursor: ns-resize
}

.feat-expanded-section .img-side {
    width: auto;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    -webkit-transform: skewY(-20deg);
    transform: skewY(-20deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.feat-expanded-section .img-side-block + img {
    margin-left: 9px;
    max-width: 470px
}

.wide-featexp-section .img-side-block + img {
    max-width: 100%;
    margin-left: 0
}

.feat-expanded-section .start-load .img-side-block {
    left: 9px;
    opacity: 0
}

.feat-expanded-section .img-side-block {
    width: 10px;
    height: 100%;
    overflow: hidden;
    z-index: 1;
    left: 0;
    opacity: 1;
    transition: left .2s linear
}

.wide-featexp-section .img-side-block {
    display: none !important
}

.feat-expanded-section .img-side-block:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, .2)
}

.feat-expanded-section .img-side-block img {
    max-width: none;
    width: 100000%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.feat-expanded-section .img-body {
    width: 100%;
    width: -moz-calc(100% - 9px);
    width: -webkit-calc(100% - 9px);
    width: calc(100% - 9px);
    margin-left: 9px
}

.feat-gallery-thumbs {
    float: left;
    width: 213px;
    margin: 132px 0 0;
    padding: 33px 0;
    background: #fff;
    text-align: center;
    position: relative;
    z-index: 3
}

.widefeat-thumbs {
    padding: 52px 30px 33px 0;
    margin-top: 126px;
    width: 248px
}

.widefeat-thumbs .mobile {
    position: absolute;
    bottom: -77px;
    left: 58px
}

.feat-gallery-thumbs:after {
    content: "";
    position: absolute;
    background-color: #fff;
    height: 100%;
    width: 30%;
    left: 100%;
    top: 0
}

.widefeat-gallery.alt {
    position: relative
}

.widefeat-gallery.alt .widefeat-thumbs {
    z-index: 5
}

.widefeat-gallery.alt .widefeat-thumbs:after {
    display: none
}

.feat-gallery-thumbs > a {
    display: inline-block;
    box-shadow: 3px 3px #939392;
    margin: 6px 0 6px 11px;
    -webkit-transition: all .3s;
    transition: all .3s;
    position: relative;
    background: #dedede
}

.feat-gallery-thumbs > a:before {
    content: "";
    position: absolute;
    right: -16px;
    top: 50%;
    margin-top: -12px;
    opacity: 0;
    border-left: 12px solid #88ba00;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    -webkit-transition: all .3s;
    transition: all .3s
}

.feat-gallery-thumbs > a.active, .feat-gallery-thumbs > a:hover {
    box-shadow: 0 1px #fff, 6px 6px #88ba00
}

.feat-gallery-thumbs > a.active {
    -webkit-transform: translate(-3px, -3px);
    transform: translate(-3px, -3px)
}

.feat-gallery-thumbs > a.active:before {
    opacity: 1
}

.feat-expanded-section img {
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.slide-item.start-draw img {
    opacity: 0 !important
}

.industry-section {
    background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAvAC0DASIAAhEBAxEB/8QAFwABAQEBAAAAAAAAAAAAAAAAAAECB//EACUQAAEDAgYBBQAAAAAAAAAAAAEAESExQQJRYXGBkTISQrHB8f/EABYBAQEBAAAAAAAAAAAAAAAAAAABBv/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AOZizNZK4XOS0HaaOFmR11K1TDLL6ygkhqQyE1QWGzqgRHCYi/ZUFBtCuKpbNAHkHrCg8aWVG2Se1tPtQA79/CCSIvRCZd3qgzs4QLHJlMQkuboaTMW3VI2qUDQs0JDbhAH1kKWn9lBo35kKASOFS19VJcaMqJBEUZUgTF1CXEgUntUgF/VYkKD/2Q==);
    position: relative;
    padding: 95px 0 100px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.industry-section a {
    color: #fff
}

.industry-section:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.industry-section .frame {
    max-width: 1060px;
    min-width: 287px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    text-align: center;
    color: #fff
}

.industry-section h1 {
    font: 57px/1.1 roboto-bold-webfont, sans-serif;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .75);
    margin-bottom: 10px
}

.industry-section .subheading {
    font-size: 20px;
    margin-bottom: 20px
}

.industry-section .content {
    border-radius: 0 0 10px 10px;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .03) 12%, rgba(0, 0, 0, .16) 39%, rgba(0, 0, 0, .17) 51%, rgba(0, 0, 0, .18) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(12%, rgba(0, 0, 0, .03)), color-stop(39%, rgba(0, 0, 0, .16)), color-stop(51%, rgba(0, 0, 0, .17)), color-stop(100%, rgba(0, 0, 0, .18)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .03) 12%, rgba(0, 0, 0, .16) 39%, rgba(0, 0, 0, .17) 51%, rgba(0, 0, 0, .18) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .03) 12%, rgba(0, 0, 0, .16) 39%, rgba(0, 0, 0, .17) 51%, rgba(0, 0, 0, .18) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .03) 12%, rgba(0, 0, 0, .16) 39%, rgba(0, 0, 0, .17) 51%, rgba(0, 0, 0, .18) 100%)
}

.industry-section .list {
    font: 24px/1.1 roboto-bold-webfont, sans-serif;
    padding: 43px 0 0
}

.industry-section .list li {
    display: inline-block;
    vertical-align: top
}

.industry-section .list a {
    display: inline-block;
    padding: 26px 17px;
    position: relative;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.industry-section .list a:before {
    content: "";
    background: url("../image/tzz_ion-1.png") no-repeat;
    display: block;
    min-height: 61px;
    margin: 0 auto 14px
}

.industry-section .list .b2b:before {
    width: 62px;
    height: 51px;
    background-position: -3px -3px
}

.industry-section .list .ecommerce:before {
    width: 51px;
    height: 58px;
    background-position: -69px -3px
}

.industry-section .list .b2c:before {
    width: 51px;
    height: 48px;
    background-position: -124px -3px
}

.industry-section .list .enterprise:before {
    width: 53px;
    height: 52px;
    background-position: -179px -3px
}

.industry-section .list .education:before {
    width: 64px;
    height: 52px;
    background-position: -235px -3px
}

.industry-section .list .startups:before {
    width: 38px;
    height: 61px;
    background-position: -371px -3px
}

.industry-section .list .profit:before {
    width: 57px;
    height: 49px;
    background-position: -311px -3px
}

.industry-section .list a:active, .industry-section .list a:hover {
    background: rgba(0, 157, 220, .25);
    box-shadow: inset 4px 4px 10px -4px rgba(0, 0, 0, .3);
    border-radius: 3px
}

.industry-expand-list {
    padding: 15px 30px 25px;
    display: none
}

.industry-expand-list ul {
    display: inline-block;
    font-size: 15px
}

.industry-expand-list li {
    text-align: left;
    width: 31.9%;
    margin: 1px .5% 0;
    background: rgba(0, 0, 0, .18);
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box
}

.industry-expand-list a {
    display: block;
    padding: 11px 15px 11px 22px;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.industry-expand-list a:before {
    content: "\bb";
    padding-left: 6px;
    font-size: 19px;
    position: relative;
    left: -9px;
    color: #009ddc
}

.industry-expand-list a:active, .industry-expand-list a:hover {
    padding-left: 32px;
    background: #88ba00
}

.industry-expand-list a:active:before, .industry-expand-list a:hover:before {
    color: #fff
}

.button {
    background: #fff;
    color: #0078ae;
    font: 18px/1 roboto-bold-webfont, sans-serif;
    border-radius: 25px;
    padding: 16px 12px;
    box-sizing: border-box;
    display: inline-block;
    box-shadow: 1px 1px #065c8b;
    position: relative;
    width: 260px;
    text-align: center;
    -webkit-transition: width .2s linear;
    transition: width .2s linear;
    white-space: nowrap
}

.button.close {
    padding-right: 45px;
    box-shadow: 0 3px #065c8b;
    width: 180px
}

.button.close:after {
    content: "";
    border-radius: 50%;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .9);
    width: 28px;
    height: 28px;
    position: absolute;
    top: 10px;
    right: 15px
}

.button.close:before {
    content: "";
    position: absolute;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #0078ae;
    top: 21px;
    right: 23px
}

.industry-section .button {
    color: #0078ae;
    position: relative;
    bottom: -25px
}

.solutions-section {
    background: #f9f9f9;
    background: -moz-linear-gradient(top, #f9f9f9 0, #fdfdfd 82%, #fff 83%, #fefefe 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(82%, #fdfdfd), color-stop(83%, #fff), color-stop(100%, #fefefe));
    background: -webkit-linear-gradient(top, #f9f9f9 0, #fdfdfd 82%, #fff 83%, #fefefe 100%);
    background: -ms-linear-gradient(top, #f9f9f9 0, #fdfdfd 82%, #fff 83%, #fefefe 100%);
    background: linear-gradient(to bottom, #f9f9f9 0, #fdfdfd 82%, #fff 83%, #fefefe 100%);
    text-align: center;
    padding: 58px 0 90px;
    position: relative
}

.solutions-section h2 {
    font: 50px/1.1 roboto-light-webfont, sans-serif;
    color: #0078ae;
    margin: 0 0 32px
}

.solutions-section h2 span {
    : roboto-bold-webfont
}

.solutions-section .drop-holder {
    display: inline-block;
    vertical-align: top;
    padding: 0 29px;
    margin-bottom: 20px;
    position: relative;
    font: 16px/1.2 roboto-bold-webfont, sans-serif;
    -webkit-perspective: 1000px;
    -ms-perspective: 1000px;
    perspective: 1000px;
    z-index: 22
}

.solutions-section h3 a {
    display: block;
    font-size: 23px;
    position: relative;
    z-index: 22
}

.solutions-section h3:before {
    content: "";
    height: 103px;
    height: -moz-calc(100% - 50px);
    height: -webkit-calc(100% - 50px);
    height: calc(100% - 50px);
    border-radius: 5px 5px 0 0;
    position: absolute;
    top: 50px;
    left: 50%;
    z-index: 21;
    opacity: 0;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    width: 230px;
    margin-left: -115px
}

.solutions-section .consulting .drop, .solutions-section .consulting h3:before {
    margin-left: -159px
}

.solutions-section .t-cell {
    width: 126px;
    height: 116px;
    padding-left: 2px;
    -webkit-transition: all .1s linear;
    transition: all .1s linear
}

.solutions-section h3 .ico {
    display: block;
    margin: 0 auto -15px;
    border-radius: 50%;
    width: 126px;
    height: 126px;
    background: #f6f6f4;
    background: -moz-linear-gradient(top, #f6f6f4 0, #f6f6f4 38%, #fafaf8 64%, #fbfbf9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6f6f4), color-stop(38%, #f6f6f4), color-stop(64%, #fafaf8), color-stop(100%, #fbfbf9));
    background: -webkit-linear-gradient(top, #f6f6f4 0, #f6f6f4 38%, #fafaf8 64%, #fbfbf9 100%);
    background: -ms-linear-gradient(top, #f6f6f4 0, #f6f6f4 38%, #fafaf8 64%, #fbfbf9 100%);
    background: linear-gradient(to bottom, #f6f6f4 0, #f6f6f4 38%, #fafaf8 64%, #fbfbf9 100%);
    border: 3px solid #fff;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition: all .05s linear;
    transition: all .05s linear
}

.ico-consulting {
    width: 53px;
    fill: #71970d
}

.ico-design {
    width: 51px;
    fill: #f18f0e
}

.ico-dev {
    width: 58px;
    fill: #862e9f
}

.ico-marketing {
    width: 61px;
    fill: #009ddc
}

.ico-mobile {
    width: 86px;
    fill: #aa4141
}

.solutions-section .consulting h3 .ico {
    box-shadow: -3px -3px 5px rgba(95, 128, 7, .13)
}

.solutions-section .design h3 .ico {
    box-shadow: -3px -3px 5px rgba(212, 123, 6, .13)
}

.solutions-section .dev h3 .ico {
    box-shadow: -3px -3px 5px rgba(160, 41, 189, .13)
}

.solutions-section .onl-marketing h3 .ico {
    box-shadow: -3px -3px 5px rgba(108, 186, 216, .13)
}

.solutions-section .mobile h3 .ico {
    box-shadow: -3px -3px 5px rgba(151, 19, 13, .13)
}

.solutions-section .consulting a {
    color: #71970d
}

.solutions-section .design a {
    color: #f18f0e
}

.solutions-section .dev a {
    color: #862e9f
}

.solutions-section .mobile a {
    color: #aa4141
}

.solutions-section .onl-marketing a {
    color: #009ddc
}

.solutions-section .drop {
    text-align: left;
    display: inline-block;
    position: absolute;
    top: 100%;
    left: 50%;
    width: 230px;
    font-size: 15px;
    margin-left: -115px;
    padding: 10px 0;
    box-sizing: border-box;
    border: 12px solid transparent;
    border-top-width: 6px;
    border-radius: 0 0 13px 13px;
    visibility: hidden;
    z-index: 22
}

.desktop-mode .solutions-section .drop-holder:hover, .solutions-section .drop-holder.item-hover {
    z-index: 24
}

.desktop-mode .solutions-section .drop-holder:hover .drop, .solutions-section .drop-holder.item-hover .drop {
    visibility: visible
}

.solutions-section .consulting .drop, .solutions-section .consulting h3:before {
    background-color: #79a501
}

.solutions-section .design .drop, .solutions-section .design h3:before {
    background-color: #f18f0e
}

.solutions-section .dev .drop, .solutions-section .dev h3:before {
    background-color: #862e9f
}

.solutions-section .onl-marketing .drop, .solutions-section .onl-marketing h3:before {
    background-color: #009ddc
}

.solutions-section .mobile .drop, .solutions-section .mobile h3:before {
    background-color: #aa4141
}

.solutions-section .drop:before {
    content: "";
    box-shadow: none;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0
}

.solutions-section .consulting .drop, .solutions-section .consulting .drop .ico:before {
    border-color: #79a501
}

.solutions-section .design .drop, .solutions-section .design .drop .ico:before {
    border-color: #f18f0e
}

.solutions-section .dev .drop, .solutions-section .dev .drop .ico:before {
    border-color: #862e9f
}

.solutions-section .onl-marketing .drop, .solutions-section .onl-marketing .drop .ico:before {
    border-color: #009ddc
}

.solutions-section .mobile .drop, .solutions-section .mobile .drop .ico:before {
    border-color: #aa4141
}

.solutions-section .drop li {
    position: relative;
    padding-left: .2%;
    z-index: 22;
    white-space: nowrap;
    cursor: pointer;
    -webkit-transition: background .15s, box-shadow .15s;
    transition: background .15s, box-shadow .15s
}

.solutions-section .drop li:active, .solutions-section .drop li:hover {
    background-color: #f2f2f2;
    box-shadow: inset 2px 2px 3px rgba(39, 39, 38, .14);
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px)
}

.solutions-section .drop a {
    display: table;
    width: 100%
}

.solutions-section .drop span {
    display: table-cell;
    vertical-align: middle;
    height: 61px
}

.solutions-section .drop .ico + span {
    padding: 0 .2%
}

.solutions-section .drop .ico {
    width: 55px;
    text-align: center;
    position: relative;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.desktop-mode .solutions-section .drop-holder:hover h3 .ico, .solutions-section .drop-holder.item-hover h3 .ico {
    background: #fff;
    box-shadow: 0 5px 8px 2px rgba(0, 0, 0, .11);
    -webkit-transform: translateY(-20px) scale(0.88);
    transform: translateY(-20px) scale(0.88)
}

.desktop-mode .solutions-section .drop-holder:hover h3 a, .solutions-section .drop-holder.item-hover h3 a {
    color: #fff
}

.desktop-mode .solutions-section .drop-holder:hover h3:before, .solutions-section .drop-holder.item-hover h3:before {
    opacity: 1
}

.solutions-section .drop .ico:before {
    content: "";
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid transparent;
    position: absolute;
    top: 2px;
    left: 0;
    opacity: 0;
    -webkit-transition: all .5s;
    transition: all .5s
}

.solutions-section .drop li:hover .ico:before {
    opacity: 1
}

.solutions-section .drop .ico:after {
    content: "";
    display: inline-block;
    background: url("../image/tzz_ion-1.png") no-repeat;
    height: 35px
}

.solutions-section .drop .analysis:after {
    background-position: -3px -3px;
    width: 36px
}

.solutions-section .drop .experience:after {
    background-position: -42px -3px;
    width: 34px
}

.solutions-section .drop .bstrategy:after {
    background-position: -79px -3px;
    width: 33px
}

.solutions-section .drop .campstrategy:after {
    background-position: -115px -3px;
    width: 30px;
    height: 45px
}

.solutions-section .drop .cstrategy:after {
    background-position: -148px -3px;
    width: 24px;
    height: 38px
}

.solutions-section .drop .logobrand:after {
    background-position: -175px -3px;
    width: 35px;
    height: 33px
}

.solutions-section .drop .joomla:after {
    background-position: -778px -5px;
    width: 30px;
    height: 31px
}

.solutions-section .drop .wm:after {
    background-position: -750px -3px;
    width: 24px;
    height: 37px
}

.solutions-section .drop .wp:after {
    background-position: -848px -4px;
    width: 33px;
    height: 33px
}

.solutions-section .drop .magento:after {
    background-position: -884px -4px;
    width: 27px;
    height: 33px
}

.solutions-section .drop .drupal:after {
    background-position: -813px -3px;
    width: 32px;
    height: 36px
}

.solutions-section .drop .sitecore:after {
    background-position: -714px -3px;
    width: 31px;
    height: 33px
}

.solutions-section .drop .website:after {
    background-position: -213px -3px;
    width: 29px;
    height: 36px
}

.solutions-section .drop .print:after {
    background-position: -245px -3px;
    width: 30px;
    height: 26px
}

.solutions-section .drop .video:after {
    background-position: -278px -3px;
    width: 29px;
    height: 28px
}

.solutions-section .drop .app:after {
    background-position: -310px -3px;
    width: 21px;
    height: 37px
}

.solutions-section .drop .ecommerce:after {
    background-position: -334px -3px;
    width: 28px;
    height: 35px
}

.solutions-section .drop .cms:after {
    background-position: -362px -2px;
    width: 24px;
    height: 36px;
    position: relative;
    left: 3px
}

.solutions-section .drop .mobile:after {
    background-position: -387px -3px;
    width: 39px;
    height: 30px
}

.solutions-section .drop .responsive:after {
    background-position: -429px -3px;
    width: 33px;
    height: 32px
}

.solutions-section .drop .optimization:after {
    background-position: -465px -3px;
    width: 45px;
    height: 47px
}

.solutions-section .drop .smmarketing:after {
    background-position: -513px -3px;
    width: 27px;
    height: 40px
}

.solutions-section .drop .emarketing:after {
    background-position: -543px -3px;
    width: 28px;
    height: 21px
}

.solutions-section .drop .ppcmarketing:after {
    background-position: -574px -3px;
    width: 26px
}

.solutions-section .drop .seoptimization:after {
    background-position: -603px -3px;
    width: 31px;
    height: 32px
}

.solutions-section .drop .advertising:after {
    background-position: -637px -3px;
    width: 39px;
    height: 42px
}

.solutions-section .drop .relations:after {
    background-position: -679px -3px;
    width: 32px;
    height: 24px
}

.solutions-section .drop .m-app-strategy:after {
    background-position: -914px -3px;
    width: 33px;
    height: 35px
}

.solutions-section .drop .m-app-design:after {
    background-position: -949px -3px;
    width: 32px;
    height: 35px
}

.solutions-section .drop .m-app:after {
    background-position: -984px -3px;
    width: 31px;
    height: 38px
}

.solutions-section .drop .m-app-ios:after {
    background-position: -1017px -3px;
    width: 21px;
    height: 37px
}

.solutions-section .drop .m-app-android:after {
    background-position: -1040px -3px;
    width: 21px;
    height: 37px
}

.solutions-section .drop .m-app-marketing:after {
    background-position: -1064px -3px;
    width: 34px;
    height: 32px
}

.ourwork-pg .bg {
    background-image: url("../image/tzz_ion-1.png")
}

.ourwork-pg .s-left {
    height: 455px
}

.top-section .bg {
    background-repeat: no-repeat;
    background-position: 100% 0;
    box-shadow: inset 0 -60px 100px rgba(255, 255, 255, .7);
    -webkit-transition: all .3s;
    transition: all .3s
}

.top-section .bg.full-height {
    background-size: auto 100%
}

.top-section {
    font-size: 0;
    padding: 0
}

.top-section.demo-reel-block .frame {
    padding: 0;
    background: 0 0;
    display: table;
    width: 100%
}

.top-section .s-left {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    width: 60%;
    height: 455px;
    padding-bottom: 3%;
    font: 23px/30px roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    color: #878a8c;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s
}

.top-section.alt-size .s-left {
    font-size: 28px;
    line-height: 1.4;
    padding-top: 5%;
    padding-bottom: 6%;
    padding-right: 5%
}

.top-section .s-left h1 {
    font: 45px/49px roboto-light-webfont, Sans-Serif;
    color: #0078AE;
    margin-bottom: 15px
}

.top-section .custom-list {
    padding: 4% 0 0;
    font-size: 15px;
    line-height: 1.7
}

.top-section .custom-list li {
    padding-bottom: 17px
}

.top-section .custom-list li:before {
    top: 2px
}

.top-section.alt-size .s-left h1 {
    font-size: 50px
}

.top-section .s-left strong {
    : roboto-medium-webfont, Sans-Serif
}

.top-section .s-right {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 40%
}

.video-frame .sub-caption {
    font: 26px/1.4 roboto-bold-webfont, Sans-Serif;
    color: #fff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
    position: relative;
    margin: 0 0 -57px
}

.video-frame .sub-caption:after {
    content: "";
    left: 42px;
    top: -64px;
    -webkit-transform: rotate(-71deg);
    transform: rotate(-71deg);
    position: absolute;
    width: 99px;
    overflow: hidden;
    height: 37px;
    background: url("../image/tzz_ion-1.png") -899px -322px no-repeat
}

.video-frame .wvs-play-video {
    background-color: rgba(0, 0, 0, .15);
    display: inline-block
}

.logo-pg {
    background: url("../image/tzz_ion-1.jpg") no-repeat #fff
}

.logo-pg .s-left h1 {
    font-size: 50px;
    line-height: 1.1
}

.logo-pg, .logo-pg .s-left {
    height: 412px
}

.logo-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 70% 5px;
    box-shadow: none
}

.logo-pg p {
    font-size: 17px;
    margin-bottom: 23px
}

.logo-pg .page-intro-title {
    padding-right: 0
}

.logo-pg .intro-fl1-image {
    margin: -31px -56px 0 -100px
}

.logo-pg-frame {
    max-width: 1570px
}

.logo-pg-frame .section-title h2 {
    font-size: 50px
}

.ld-brand {
    position: absolute;
    top: 50%;
    left: 50%;
    transition: all .5s ease
}

.ld-brand.portmantos {
    background-image: url("../image/tzz_ion-1.png");
    width: 307px;
    height: 143px
}

.ld-brand.ewing {
    background-image: url("../image/tzz_ion-1.png");
    width: 253px;
    height: 65px
}

.ld-brand.eqlco {
    background-image: url("../image/tzz_ion-1.png");
    width: 221px;
    height: 229px
}

.ld-brand.anthony {
    background-image: url("../image/tzz_ion-1.png");
    width: 354px;
    height: 115px
}

.ld-brand.leon {
    background-image: url("../image/tzz_ion-1.png");
    width: 311px;
    height: 192px
}

.ld-brand.winchester {
    background-image: url("../image/tzz_ion-1.png");
    width: 268px;
    height: 126px
}

.ld-brand.dance {
    background-image: url("../image/tzz_ion-1.png");
    width: 241px;
    height: 80px
}

.ld-brand.fabrics {
    background-image: url("../image/tzz_ion-1.png");
    width: 239px;
    height: 131px
}

.ld-brand.execu {
    background-image: url("../image/tzz_ion-1.png");
    width: 332px;
    height: 89px
}

.ld-brand.biowars {
    background-image: url("../image/tzz_ion-1.png");
    width: 316px;
    height: 98px
}

.ld-brand.btb {
    background-image: url("../image/tzz_ion-1.png");
    width: 370px;
    height: 164px
}

.ld-brand.wallops {
    background-image: url("../image/tzz_ion-1.png");
    width: 339px;
    height: 84px
}

.featured-work-fullscreen .overflow {
    overflow: hidden;
    display: block
}

.featured-work-fullscreen .fwb-item > a img {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.featured-work-fullscreen .fwb-item > a:hover img {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1
}

.featured-work-fullscreen .ld-brand {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate(-50%, -50%) scale(.9);
    transform: translate(-50%, -50%) scale(.9)
}

.featured-work-fullscreen .fwb-item > a:hover .ld-brand {
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1)
}

.case-pg.b-animated #main {
    padding-top: 0
}

.case-pg.b-animated .top-page-panel {
    display: none
}

.case-pg .section {
    width: 100%;
    position: relative;
    max-height: 93vh
}

.case-pg .section.result-section {
    display: table
}

.fullpage-wrapper {
    height: auto !important
}

.fullpage-wrapper .frame > .clearfix {
    display: table;
    width: 100%
}

.fullpage-wrapper .bg {
    height: 100%;
    overflow: hidden
}

.case-pg .top-section .bg {
    box-shadow: none;
    background-repeat: no-repeat
}

.case-pg .top-section .bg.cover {
    background-position: 50% 0 !important;
    background-size: cover !important
}

.case-pg .cover .s-left {
    width: 44%
}

.case-pg .top-section .s-left {
    height: 885px
}

.case-pg .bg.btm-corner .s-left {
    width: 45%
}

.case-pg .frame.t-holder > .t-cell {
    height: 878px
}

.case-pg .top-section sup {
    font: 19px/1 roboto-light-webfont, arial, Helvetica, sans-serif;
    position: relative;
    left: -3px
}

.case-pg .top-section .nowrap {
    white-space: nowrap
}

.case-pg .top-section .s-left {
    color: #878a8c;
    font-size: 28px;
    line-height: 1.4
}

.case-pg .top-section p {
    margin-bottom: 27px
}

.case-pg .section h2, .case-pg .top-section .s-left h2, .continue-section .PT-awards .ttl {
    color: #0078ae;
    font: 57px/1 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin: 0 0 27px
}

.case-pg .section.shadow:before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    top: -12px
}

.btm-section {
    background-color: #fff
}

.case-pg .quote-section {
    background-image: url("../image/tzz_ion-1.png");
    color: #758288
}

.case-pg .quote-section .bg {
    background-size: cover
}

.quote-section q {
    font: 50px roboto-light-webfont, arial, Helvetica, sans-serif;
    position: relative;
    display: inline-block;
    margin-bottom: 65px
}

.quote-section .quotes-after {
    position: relative
}

.quote-section .quotes-after:after, .quote-section q:before {
    content: 'â€œ';
    font: 320px/1 arial, Helvetica, sans-serif;
    position: absolute;
    top: -49px;
    left: -93px;
    opacity: .2;
    color: #fff
}

.quote-section .quotes-after:after {
    left: auto;
    top: 60px;
    right: -95px;
    font-size: 230px;
    height: 50px;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.quote-section q strong {
    color: #fff;
    : roboto-bold-webfont, arial, Helvetica, sans-serif
}

.quote-section cite {
    display: block;
    color: #fff;
    font: 20px/1.2 roboto-medium-webfont, arial, Helvetica, sans-serif
}

.quote-section cite strong {
    display: block;
    color: #00b2fa;
    font-size: 28px
}

.case-pg .result-section {
    padding: 0
}

.case-pg .result-section .section-title {
    color: #fff
}

.case-pg .result-section .t-cell {
    padding: 100px 0
}

.result-box {
    text-align: center;
    width: 100%;
    border: 2px solid #4a4e52;
    background-color: rgba(18, 77, 103, .3);
    border-radius: 6px;
    margin: 90px 0 0;
    color: #fff
}

.result-blocks-black .result-box {
    background-color: rgba(0, 0, 0, .3)
}

.result-box h3 + p {
    font: 20px roboto-regular-webfont, arial, Helvetica, sans-serif;
    color: #758288;
    margin: -10px 0 15px
}

.result-box .rs-blocks {
    padding: 15px 0 40px;
    display: table;
    width: 100%
}

.result-box .rs-block {
    display: table-cell;
    float: none;
    vertical-align: middle
}

.result-section h3 {
    color: #00b2fa;
    font: 40px/1 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    position: relative;
    top: -24px;
    display: inline-block;
    white-space: nowrap
}

.result-box-alt .section-title span, .result-section h3 span {
    display: inline-block;
    position: relative;
    z-index: 2
}

.result-box-alt .section-title:before, .result-section h3:before {
    content: "";
    background: #171c21;
    height: 2px;
    width: calc(100% + 40px);
    position: absolute;
    top: 22px;
    left: -20px;
    z-index: 1
}

.result-box-alt .section-title:before {
    top: 32px;
    width: calc(100% + 60px);
    left: -30px
}

.result-box-alt {
    width: 75%;
    margin: 90px auto 0;
    border: 2px solid #4a4e52;
    border-radius: 6px;
    color: #fff;
    background-color: rgba(0, 0, 0, .2);
    text-align: center
}

.result-box-alt .section-title {
    position: relative;
    top: -34px;
    display: inline-block;
    white-space: nowrap
}

.case-pg .result-box-alt .section-title {
    margin-bottom: 0
}

.result-list {
    font: 24px roboto-regular-webfont, arial, Helvetica, sans-serif;
    text-align: left;
    padding: 0 10px;
    margin-top: -20px
}

.result-list li {
    padding: 17px 10px 17px 135px;
    position: relative
}

.result-list li:after {
    content: "";
    position: absolute;
    width: 23px;
    height: 19px;
    top: 45px;
    left: 69px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAATCAYAAAB7u5a2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Mjg0MTE0ODNBOEE0MTFFNUI5REZBNTREODJENzU2MzUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Mjg0MTE0ODRBOEE0MTFFNUI5REZBNTREODJENzU2MzUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyODQxMTQ4MUE4QTQxMUU1QjlERkE1NEQ4MkQ3NTYzNSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyODQxMTQ4MkE4QTQxMUU1QjlERkE1NEQ4MkQ3NTYzNSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvzlJoAAAAEqSURBVHjaYpxwhIWBEpBv/RvOnniUNQNI7QKK3QPxmRioBIAGVwOp6UB8EMjmpprhQMOqgFQLlCsDxBeAYgJMVDC4Aki1ogmrAPFdSg0Hubgdh9wDSgwvx+JiGDgAjFRjdMMliDQYFBQdOOT2Aw12RI9QZ5BXgLiRgMHVeIJiH9BgJxgHZrg9EO8BYnYgrgMlXzwubsFjsDOyAMjwGFAYoSmcAMRFWAxuJ9ZgmOG5ODT0IsmV4jF4LzaDYYaDguQ4Do2TgHgLEHfhcbELrsgBGf4DiK3wWOCNy2BoImDAZzgMgCw4QWRS3E/IYGxliyUQnySgZy8QOxHjAmw51AKPD0AGuxCbhXFlf0ssFhwgxWBCRS5yEIHC2JHUwodQweUETd9O5JRsAAEGAB0yR3Ol6xpiAAAAAElFTkSuQmCC)
}

.result-list li:before {
    content: "";
    position: absolute;
    width: 46px;
    height: 46px;
    border: 1px solid #585e61;
    border-radius: 2px;
    top: 30px;
    left: 56px
}

.result-list li:nth-child(even) {
    background-color: rgba(255, 255, 255, .025)
}

.result-list span {
    font: 55px roboto-light-webfont, arial, Helvetica, sans-serif;
    margin-right: 20px
}

.case-pg .empty-section {
    height: 10px !important;
    background: #fff
}

.main-section .s-left {
    position: relative
}

.case-pg .main-section {
    background: url("../image/tzz_ion-1.png")
}

.case-pg .main-section .ttl-box {
    position: relative
}

.main-section .ttl-box h1 {
    text-indent: -9999px;
    overflow: hidden
}

.rs-gen-blocks-two {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin-top: 90px
}

.rs-blocks-wide .rs-block {
    width: 70%;
    display: block;
    margin: 0 auto
}

.rs-gen-blocks-two > .rs-block {
    width: 50%;
    display: table-cell;
    vertical-align: top
}

.rs-gen-blocks-two .divider {
    display: table-cell;
    width: 17px
}

.rs-gen-blocks-two .rs-blocks {
    padding-top: 10px
}

.rs-row > p {
    display: inline-block;
    vertical-align: middle;
    padding: 20px 4% 0
}

.rs-row .divider {
    font-size: 21px;
    padding-top: 0
}

.rs-blocks .rs-row span {
    padding-bottom: 10px
}

.biowars-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 617px;
    height: 289px;
    position: absolute;
    top: -259px;
    left: -80px;
    margin: 0
}

.biowars-section3, .biowars-section5, .continue-section {
    background: url("../image/tzz_ion-1.png")
}

.biowars-section1 .bg {
    background-image: url("../image/tzz_ion-1.png")
}

.biowars-section2 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 120% 2px
}

.biowars-section2 {
    border-top: 1px solid #fff
}

.case-pg .biowars-section2 .s-left {
    width: 40%
}

.biowars-section3 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 95% 50%;
    border-top: 1px solid #fff
}

.biowars-section4 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 110% 50%
}

.case-pg .biowars-section1 .s-left, .case-pg .biowars-section4 .s-left {
    width: 50%
}

.biowars-section5 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 140% 100%;
    border-top: 1px solid #fff
}

.case-pg .biowars-section3 .s-left, .case-pg .biowars-section5 .s-left {
    width: 35%
}

.biowars-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.biowars-quote-section blockquote {
    padding-right: 100px
}

.johnjay-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 308px;
    height: 220px
}

.main-section .s-left .johnjay-ttl {
    margin: 0 0 60px
}

.johnjay-section3, .johnjay-section5 {
    background: url("../image/tzz_ion-1.png")
}

.johnjay-section1 .bg {
    background-image: url("../image/tzz_ion-1.jpg");
    background-position: 100% 50%
}

.johnjay-section2 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 98% 50%
}

.johnjay-section2 {
    border-top: 1px solid #fff
}

.case-pg .johnjay-section2 .s-left {
    width: 40%
}

.johnjay-section3 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 105% 50%;
    border-top: 1px solid #fff
}

.case-pg .johnjay-section3 .s-left, .case-pg .johnjay-section4 .s-left {
    width: 35%
}

.johnjay-section4 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 100% 50%;
    background-size: auto 96%
}

.case-pg .johnjay-section1 .s-left, .case-pg .johnjay-section5 .s-left {
    width: 50%
}

.johnjay-section5 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 100% 50%;
    border-top: 1px solid #fff
}

.johnjay-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.medcpu-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 446px;
    height: 91px
}

.main-section .s-left .medcpu-ttl {
    margin: 0 0 60px
}

.medcpu-section3, .medcpu-section7 {
    background: url("../image/tzz_ion-1.png")
}

.medcpu-section1 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.medcpu-section2 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.medcpu-section3 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.case-pg .medcpu-section1 .s-left {
    width: 55%
}

.case-pg .medcpu-section3 .s-left {
    width: 50%
}

.medcpu-section4 {
    background: #fff
}

.medcpu-section4 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 97% 100%
}

.medcpu-section7 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 100% 90%;
    border-top: 1px solid #fff
}

.medcpu-section5 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 140% 100%
}

.medcpu-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.dance-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 539px;
    height: 82px
}

.main-section .s-left .dance-ttl {
    margin: -65px 0 45px
}

.dance-section3, .dance-section5 {
    background: url("../image/tzz_ion-1.png")
}

.dance-section1 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.dance-section2 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.case-pg .dance-section2 h2, .case-pg .dance-section2 p {
    color: #fff
}

.case-pg .dance-section4 .bg .s-left, .case-pg .dance-section5 .s-left {
    width: 32%
}

.case-pg .dance-section6 .bg .s-left {
    width: 34%
}

.dance-section4 {
    background: #fff
}

.dance-section3 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 110% 100%
}

.dance-section4 .bg {
    background-image: url("../image/tzz_ion-1.jpg");
    background-position: 100% 100%
}

.dance-section5 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 100% 90%;
    border-top: 1px solid #fff
}

.dance-section6 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 110% 100%
}

.dance-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.btb-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 514px;
    height: 251px
}

.main-section .s-left .btb-ttl {
    margin: -110px 0 35px
}

.case-pg .btb-section1 .inner-bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0/cover no-repeat
}

.btb-section1 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 150% 45%
}

.btb-section2, .btb-section4 {
    background-color: #fff;
    position: relative
}

.btb-section2 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.btb-section2 .s-left {
    width: 45%
}

.btb-section3 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 92% 52%
}

.btb-section3 .s-left {
    width: 50%
}

.btb-section4 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.btb-section5 .bg {
    border-top: 1px solid #fff;
    background-image: url("../image/tzz_ion-1.png");
    background-position: 107% 52%
}

.btb-section5 .s-left {
    width: 40%
}

.btb-section6 .bg {
    background-image: url("../image/tzz_ion-1.jpg")
}

.btb-section6 .cover .s-left {
    width: 40%
}

.btb-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

@-webkit-keyframes activeStepMobile {
    0% {
        opacity: 0;
        z-index: 1
    }
    100% {
        opacity: 1;
        z-index: 5
    }
}

@keyframes btbAnim {
    0% {
        opacity: 0;
        z-index: 1
    }
    100% {
        opacity: 1;
        z-index: 5
    }
}

.btb-section2 .rel-holder {
    height: 100%
}

.btb-anim-holder {
    width: 796px;
    height: 652px;
    position: absolute;
    top: 50%;
    left: 27%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all .3s;
    background: url("../image/tzz_ion-1.png")
}

.btb-anim {
    position: absolute;
    top: 15%;
    left: 50%;
    width: 328px;
    height: 328px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-image: url("../image/tzz_ion-1.jpg");
    background-repeat: no-repeat;
    opacity: 0
}

.fp-section.active .btb-anim1 {
    background-position: 0 -658px;
    -webkit-animation: btbAnim .1s forwards .6s;
    animation: btbAnim .1s forwards .6s
}

.fp-section.active .btb-anim2 {
    background-position: 0 -987px;
    -webkit-animation: btbAnim .1s forwards .7s;
    animation: btbAnim .1s forwards .7s
}

.fp-section.active .btb-anim3 {
    background-position: 0 -1316px;
    -webkit-animation: btbAnim .1s forwards .8s;
    animation: btbAnim .1s forwards .8s
}

.fp-section.active .btb-anim4 {
    background-position: 0 -1645px;
    -webkit-animation: btbAnim .1s forwards .9s;
    animation: btbAnim .1s forwards .9s
}

.fp-section.active .btb-anim5 {
    background-position: 0 -1974px;
    -webkit-animation: btbAnim .1s forwards 1s;
    animation: btbAnim .1s forwards 1s
}

.fp-section.active .btb-anim6 {
    background-position: 0 -2303px;
    -webkit-animation: btbAnim .1s forwards 1.1s;
    animation: btbAnim .1s forwards 1.1s
}

.fp-section.active .btb-anim7 {
    background-position: 0 -2632px;
    -webkit-animation: btbAnim .1s forwards 1.2s;
    animation: btbAnim .1s forwards 1.2s
}

.fp-section.active .btb-anim8 {
    background-position: 0 -2961px;
    -webkit-animation: btbAnim .1s forwards 1.3s;
    animation: btbAnim .1s forwards 1.3s
}

.fp-section.active .btb-anim9 {
    background-position: 0 -3290px;
    -webkit-animation: btbAnim .1s forwards 1.4s;
    animation: btbAnim .1s forwards 1.4s
}

.fp-section.active .btb-anim10 {
    background-position: 0 -3948px;
    -webkit-animation: btbAnim .1s forwards 1.4s;
    animation: btbAnim .1s forwards 1.4s
}

.fp-section.active .btb-anim11 {
    background-position: 0 -4606px;
    -webkit-animation: btbAnim .1s forwards 1.6s;
    animation: btbAnim .1s forwards 1.6s
}

.fp-section.active .btb-anim12 {
    background-position: 0 -5264px;
    -webkit-animation: btbAnim .1s forwards 1.7s;
    animation: btbAnim .1s forwards 1.7s
}

.fp-section.active .btb-anim13 {
    background-position: 0 -5922px;
    -webkit-animation: btbAnim .1s forwards 1.8s;
    animation: btbAnim .1s forwards 1.8s
}

.fp-section.active .btb-anim14 {
    background-position: 0 -6580px;
    -webkit-animation: btbAnim .1s forwards 1.9s;
    animation: btbAnim .1s forwards 1.9s
}

.fp-section.active .btb-anim15 {
    background-position: 0 -6908px;
    -webkit-animation: btbAnim .1s forwards 2s;
    animation: btbAnim .1s forwards 2s
}

.leon-ttl {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 472px;
    height: 228px
}

.main-section .s-left .leon-ttl {
    margin: -110px 0 30px
}

.case-pg .leon-section1 .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.case-pg .leon-section1 .s-left {
    width: 60%
}

.leon-section2 {
    background: url("../image/tzz_ion-1.png") 0 0/auto 100% no-repeat #dde4e9
}

.leon-section2 .bg {
    border-top: 1px solid #edf0f1;
    background-image: url("../image/tzz_ion-1.png");
    background-position: 94% 60%
}

.leon-section3 {
    background-color: #fff;
    position: relative
}

.leon-section3 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 96% 70%
}

.leon-section2 .s-left, .leon-section4 .s-left {
    width: 45%
}

.leon-section3 .s-left {
    width: 35%
}

.leon-section4, .leon-section5 {
    background: url("../image/tzz_ion-1.jpg")
}

.leon-section4 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 140% 100%
}

.leon-quote-section .bg {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat
}

.leon-quote-section q {
    font-size: 35px;
    line-height: 1.25;
    color: #fff;
    margin-right: -80px
}

.leon-quote-section .quotes-after:after, .leon-quote-section q:before {
    font-size: 230px;
    opacity: .5
}

.leon-section5 .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 105% 55%
}

.leon-section5 .s-left {
    width: 40%
}

.case-pg .leon-section6 .s-left {
    width: 45%
}

.leon-section6 .bg {
    border-top: 1px solid #f9f9f9;
    background-image: url("../image/tzz_ion-1.jpg")
}

.leon-section6 h2, .leon-section6 p {
    position: relative;
    z-index: 2
}

.leon-section6 .frame {
    position: relative
}

.leon-section6 .frame:after {
    content: "";
    position: absolute;
    top: 0;
    left: -80px;
    width: calc(50% + 80px);
    height: 100%;
    background: #fff;
    opacity: .5
}

.services-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    box-shadow: none;
    background-size: auto auto
}

.services-pg .s-left {
    height: 412px
}

.services-wide-section.shadow:before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    top: -12px;
    opacity: .3
}

.sitecore-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 86% 20px;
    box-shadow: none
}

.sitecore-pg .s-left {
    height: 500px
}

.back-link {
    position: relative;
    font: 13px/38px roboto-regular-webfont, Arial, sans-serif;
    text-transform: uppercase;
    color: #5a6063
}

.back-link a {
    color: #009ddc;
    display: inline-block;
    vertical-align: top;
    font: 13px/38px roboto-bold-webfont, Arial, sans-serif
}

.back-link a:before {
    content: "\2039";
    font: 26px/33px roboto-bold-webfont, Arial, sans-serif;
    padding-right: 6px;
    vertical-align: -2px;
    position: relative;
    left: 0;
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.back-link a:hover:before {
    left: -2px
}

.infoboxes {
    position: relative;
    padding: 4.3% 0;
    font-size: 16px;
    line-height: 1.4;
    color: #5a6063
}

.infoboxes .item {
    position: relative;
    padding: 2.2% 0
}

.infoboxes .item.shadow:before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    top: -12px;
    opacity: .4;
    background-size: auto auto;
    z-index: 2
}

.infoboxes-holder .item:first-child {
    padding-top: 0
}

.infoboxes .item:nth-child(odd):after, .infoboxes-holder .item:nth-child(even):after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .53);
    z-index: 1
}

.infoboxes-holder .item:nth-child(odd):after {
    background: 0 0
}

.infoboxes .frame {
    position: relative;
    z-index: 2
}

.infoboxes img {
    -webkit-transition: all .2s linear;
    transition: all .2s linear
}

.infoboxes .item:nth-child(even) img {
    float: left;
    margin-right: 32px
}

.infoboxes .item:nth-child(odd) img {
    float: right;
    margin-left: 32px
}

.infoboxes .section-title h2 {
    font-size: 50px;
    line-height: 1.1;
    padding-bottom: 1%
}

.infoboxes .choose-agency {
    padding: 0 0 30px
}

.infoboxes .best-website-design, .infoboxes .brand-strategy {
    padding-top: 20px
}

.infoboxes .txt {
    overflow: hidden;
    padding: 2% 0 0
}

.infoboxes .section-title + .item {
    padding-top: 0
}

.infoboxes .section-title + .item .txt {
    padding-top: 1%
}

.infoboxes h3 {
    color: #0078ae;
    margin-bottom: 2%;
    font: 33px roboto-bold-webfont, Arial, sans-serif
}

.infoboxes .sub-caption {
    font-size: 22px;
    margin-bottom: 2%
}

.infoboxes p {
    margin-bottom: 2%
}

.infoboxes .item:last-child {
    padding: 0 0 100px;
    height: 20px
}

.infoboxes .next-step-v3 {
    border: 8px solid #005f8b;
    box-shadow: 0 1px 0 #fff
}

.magento-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 82% 50%;
    box-shadow: none
}

.magento-pg .s-left {
    height: 606px
}

.magento-pg-infoboxes {
    padding: 4.3% 0 0
}

.wp-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 87% 90%
}

.wp-pg .s-left {
    height: 700px
}

.seo-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 90% -60px
}

.seo-pg .s-left {
    height: 530px
}

.drupal-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 87% 90%
}

.drupal-pg .s-left {
    height: 700px
}

.joomla-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 87% 70%
}

.joomla-pg .s-left {
    height: 700px
}

.wm-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 89% 60%
}

.wm-pg .s-left {
    height: 700px
}

.consult-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 75% 3px;
    box-shadow: none
}

.consult-pg .s-left {
    height: 485px;
    width: 40%
}

.marketing-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 90% 50%;
    box-shadow: none
}

.marketing-pg .s-left {
    height: 478px;
    width: 50%
}

.develop-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    background-position: 80% 27px;
    box-shadow: none
}

.develop-pg .s-left {
    height: 540px
}

.cr-design-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    box-shadow: none;
    background-position: 89% 0
}

.cr-design-pg .s-left {
    height: 482px;
    width: 43%
}

.mob-design-pg .top-section {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat #fbfbfb
}

.top-slide {
    position: relative;
    z-index: 1
}

.top-slide .s-left {
    height: 408px;
    width: 50%
}

.mobile-app-section-2 {
    padding-top: 100px
}

.top-slide .frame {
    position: relative
}

.top-slide .s-right .btn-simple {
    display: none
}

.circle-slider {
    font: 18px/1.4 roboto-regular-webfont, arial, Helvetica, sans-serif;
    color: #878a8c;
    position: absolute;
    top: 0;
    left: -58px;
    width: 657px;
    height: 424px
}

.circle-slider .txt {
    width: 311px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .85);
    box-shadow: 0 -2px 2px rgba(0, 0, 0, .1);
    position: relative;
    margin: 138px 0 0 3px;
    z-index: 2
}

.circle-slider .t-cell {
    height: 311px;
    padding: 0 16% 7%;
    text-align: center
}

.circle-slider p {
    margin-bottom: 20px
}

.circle-slider h2 {
    font: 32px/1.4 roboto-bold-webfont, arial, Helvetica, sans-serif;
    color: #0078ae;
    white-space: nowrap;
    margin: 0 -10px
}

.circle-slider img {
    position: absolute;
    top: -16px;
    right: 0;
    max-width: 9999px;
    z-index: 1
}

.circle-slider .more-link {
    font-size: 16px
}

.circle-slider .more-link:after {
    font-size: 28px;
    line-height: 23px
}

.pull-controls .bx-next, .pull-controls .bx-prev {
    display: block;
    height: 100%
}

.circle-slider .pull-controls {
    position: absolute;
    bottom: 0;
    left: 3px;
    width: 311px;
    height: 0
}

#pull-left, #pull-right, .pull {
    background: url("../image/arrow.svg") 100% 50% no-repeat;
    position: absolute;
    bottom: 113px;
    right: 20px;
    z-index: 51;
    width: 23px;
    height: 33px;
    -webkit-transform: scale(1.1, .8);
    transform: scale(1.1, .8);
    opacity: 1;
    transition: opacity .3s
}

#pull-left, .pull.left {
    right: auto;
    left: 20px;
    background: url("../image/arrow-left.svg") 0 50% no-repeat
}

.pull-controls #pull-left:hover, .pull-controls #pull-right:hover {
    opacity: .7
}

@-webkit-keyframes mob-slide-biowars01 {
    0%, 20% {
        opacity: 1
    }
    25%, 95% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes mob-slide-biowars01 {
    0%, 20% {
        opacity: 1
    }
    25%, 95% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes mob-slide-biowars02 {
    0%, 20% {
        opacity: 0
    }
    25%, 50% {
        opacity: 1
    }
    100%, 55% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars02 {
    0%, 20% {
        opacity: 0
    }
    25%, 50% {
        opacity: 1
    }
    100%, 55% {
        opacity: 0
    }
}

@-webkit-keyframes mob-slide-biowars03 {
    0%, 50% {
        opacity: 0
    }
    55%, 70% {
        opacity: 1
    }
    100%, 75% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars03 {
    0%, 50% {
        opacity: 0
    }
    55%, 70% {
        opacity: 1
    }
    100%, 75% {
        opacity: 0
    }
}

@-webkit-keyframes mob-slide-biowars04 {
    0%, 70% {
        opacity: 0
    }
    75%, 95% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars04 {
    0%, 70% {
        opacity: 0
    }
    75%, 95% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@-webkit-keyframes mob-an-slide {
    0% {
        background-position: 0 0
    }
    25%, 40% {
        background-position: -245px 0
    }
    65%, 75% {
        background-position: -490px 0
    }
    100% {
        background-position: 0 0
    }
}

@keyframes mob-an-slide {
    0% {
        background-position: 0 0
    }
    25%, 40% {
        background-position: -245px 0
    }
    65%, 75% {
        background-position: -490px 0
    }
    100% {
        background-position: 0 0
    }
}

@-webkit-keyframes mob-an-biowars {
    0% {
        background-position: 0 100%
    }
    10%, 15% {
        background-position: 0 -735px
    }
    30%, 40% {
        background-position: 0 -490px
    }
    55%, 65% {
        background-position: 0 -245px
    }
    80%, 90% {
        background-position: 0 0
    }
    100% {
        background-position: 0 100%
    }
}

@keyframes mob-an-biowars {
    0% {
        background-position: 0 100%
    }
    10%, 15% {
        background-position: 0 -735px
    }
    30%, 40% {
        background-position: 0 -490px
    }
    55%, 65% {
        background-position: 0 -245px
    }
    80%, 90% {
        background-position: 0 0
    }
    100% {
        background-position: 0 100%
    }
}

.print-design-pg .top-section {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat #fbfbfb
}

.print-process {
    background: url("../image/tzz_ion-1.png") 50% 0 no-repeat
}

.ecommerce-pg .slide-section {
    box-shadow: none
}

.ecommerce-pg .slide-section:nth-child(even) {
    background: #fff
}

.ecommerce-pg .bg {
    background-image: url("../image/tzz_ion-1.png");
    box-shadow: none;
    background-position: 80% 100%
}

.ecommerce-pg .s-left {
    height: 440px;
    width: 50%
}

@-webkit-keyframes orangeRotate {
    0% {
        -webkit-transform: rotate(0)
    }
    25% {
        -webkit-transform: rotate(-6deg)
    }
    50% {
        -webkit-transform: rotate(3deg)
    }
    75% {
        -webkit-transform: rotate(-3deg)
    }
    90% {
        -webkit-transform: rotate(1deg)
    }
    100% {
        -webkit-transform: rotate(0)
    }
}

@keyframes orangeRotate {
    0% {
        transform: rotate(0)
    }
    25% {
        transform: rotate(-6deg)
    }
    50% {
        transform: rotate(3deg)
    }
    75% {
        transform: rotate(-3deg)
    }
    90% {
        transform: rotate(1deg)
    }
    100% {
        transform: rotate(0)
    }
}

.press-section {
    padding: 30px 0 20px
}

.press-section .frame {
    max-width: 1600px
}

.press-section .section-title {
    margin-bottom: 45px
}

.press-section .section-title h2 {
    font: 50px roboto-bold-webfont, arial, sans-serif;
    margin-bottom: 0
}

.section-title.in-light .sub-ttl {
    font: 28px roboto-light-webfont, arial, sans-serif;
    color: #878a8c;
    text-shadow: none
}

.load-more {
    display: inline-block;
    background: #007fb6;
    text-shadow: 1px 1px #1b5c7d;
    box-shadow: 0 0 0 1px #c1c1c1;
    vertical-align: middle;
    color: #fff;
    font: 16px roboto-bold-webfont, arial, sans-serif;
    text-transform: uppercase;
    border: 1px solid #0179ad;
    border-bottom-color: #00b9d7;
    border-radius: 4px;
    min-width: 52%;
    padding: 17px 20px;
    text-align: center;
    transition: color .2s linear
}

.load-more:hover {
    color: #fff
}

.load-more:after {
    font: 26px/18px roboto-black-webfont, Arial, sans-serif;
    padding-left: 30px;
    position: relative;
    top: -10px;
    content: "\bb";
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    display: inline-block;
    transition: top .2s linear
}

.load-more:hover:after {
    top: -7px
}

.press-frame {
    margin-bottom: 40px
}

.press-item {
    width: 32.1%;
    margin: 0 .6% 20px;
    float: left
}

.home-company-logos-wrapper {
    padding: 29px 0;
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(0, 0, 0, .1);
    background: #fff;
    overflow: hidden
}

.home-company-logos-content .divider {
    display: none
}

.home-company-logos-content {
    width: 100%;
    text-align: center;
    max-width: 1450px;
    margin: 0 auto
}

.home-company-logos-content li {
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    line-height: 0;
    margin: 0 2.5%;
    color: transparent;
    position: relative
}

.home-company-logos-content li:first-child {
    margin-left: 0
}

.home-company-logos-content li:last-child {
    margin-right: 0
}

.client-logo-item:before {
    position: absolute;
    top: 0;
    left: 0;
    height: 69px;
    z-index: 2;
    content: "";
    opacity: 0
}

.client-logo-item, .client-logo-item:before {
    background-image: url("../image/tzz_ion-1.png");
    background-repeat: no-repeat
}

.cl-pg, .cl-pg:before {
    background-position: -145px 0;
    width: 81px;
    height: 36px
}

.cl-pg:before {
    background-position: -145px -51px
}

.cl-at, .cl-at:before {
    background-position: 0 0;
    width: 105px;
    height: 48px
}

.cl-at:before {
    background-position: 0 -50px
}

.cl-nasa, .cl-nasa:before {
    background-position: -258px 0;
    width: 71px;
    height: 58px
}

.cl-nasa:before {
    background-position: -258px -73px
}

.cl-canon, .cl-canon:before {
    background-position: 0 -103px;
    width: 109px;
    height: 24px
}

.cl-canon:before {
    background-position: 0 -131px
}

.cl-nfl, .cl-nfl:before {
    background-position: -378px 0;
    width: 48px;
    height: 63px
}

.cl-nfl:before {
    background-position: -378px -73px
}

.cl-ea, .cl-ea:before {
    background-position: -117px -93px;
    width: 125px;
    height: 46px
}

.cl-ea:before {
    background-position: -117px -142px
}

.cl-toys, .cl-toys:before {
    background-position: -300px -142px;
    width: 124px;
    height: 33px
}

.cl-toys:before {
    background-position: -300px -179px
}

.frame-alt {
    max-width: 1580px;
    margin: 0 auto;
    position: relative;
    z-index: 3;
    background: #000;
}

.head-anim-holder .s-left, .top-section.alt-size2 .s-left {
    color: #5a6063;
    line-height: 1.5;
    width: 35%;
    height: 550px;
    padding-top: 120px
}

.top-section .s-left .link-arrow {
    font-size: 17px;
    margin: 0
}

.top-section .s-left .ttl, .top-section .s-left h2 {
    font: 80px/1 roboto-medium-webfont, Sans-Serif;
    color: #0078AE;
    margin-bottom: 33px;
    letter-spacing: -1px
}

.hs-sub-item {
    max-height: 9999px
}

.hs-sub-row {
    padding: 30px 0 0
}

.hs-sub-row-m {
    display: none
}

.top-section .s-left .sub-ttl {
    font: 30px roboto-light-webfont, sans-serif;
    margin: 10px 0 20px
}

.wide-featexp-section .feat-expanded-section {
    background: #181d22;
    padding-bottom: 170px
}

.feat-visible-m, .feat-visible-t {
    display: none
}

.feat-visible {
    display: block
}

.wide-featexp-section .feat-expanded-section .tab-lnk {
    margin: 0 auto 20px;
    display: block;
    width: 100%;
    height: auto;
    transform: none;
    max-width: 100%
}

.wide-featexp-section .feat-expanded-section .tab-lnk:last-child {
    margin-bottom: 0
}

.see-more {
    color: #fff;
    text-align: center;
    font: 24px/1.3 roboto-light-webfont, sans-serif
}

.see-more.extra-pad {
    padding: 40px 0
}

.see-more.light {
    color: #5a6063
}

.see-more .link {
    color: #009ddc;
    : roboto-bold-webfont, sans-serif;
    margin-left: 10px
}

.see-more .link:after {
    content: "";
    background: url("../image/tzz_ion-1.svg") 100% 50% no-repeat;
    width: 12px;
    height: 33px;
    -webkit-transform: scale(1.1, .5) translate(11px, 20px);
    transform: scale(1.1, .5) translate(10px, 20px);
    transition: left .3s ease-out;
    position: relative;
    left: 0;
    display: inline-block
}

.see-more:hover .link:after {
    left: 2px
}

.see-more .link.btm:after {
    transition: all .3s linear;
    left: 0;
    -webkit-transform: rotate(90deg) scale(1, .5) translate(10px, -20px);
    transform: rotate(90deg) scale(1, .5) translate(10px, -20px)
}

.see-more .link.top:after {
    -webkit-transform: rotate(-90deg) scale(1, .5) translate(-10px, 20px);
    transform: rotate(-90deg) scale(1, .5) translate(-10px, 20px)
}

.content-section.rd-box-next, .dark-section.rd-box-next, .slider-section.rd-box-next {
    padding-bottom: 120px;
    position: relative;
    z-index: 2
}

.rd-box {
    max-width: 1103px;
    background: #fff;
    margin: -85px auto;
    position: relative;
    z-index: 3;
    border: 1px solid #dedede;
    border-radius: 5px;
    text-align: center;
    padding: 50px 20px
}

.rd-box.fade-anim {
    transition: opacity .1s ease-out
}

.rd-box-holder {
    background: #000;
    padding: 40px 20px 50px;
    position: relative;
    z-index: 3
}

.rd-box.stream {
    margin: 0 auto
}

.rd-box:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #009ddc;
    height: 3px;
    border-radius: 0 0 4px 4px
}

.rd-box .txt {
    color: #009ddc;
    font: 42px/1.3 'Roboto Bold Condensed', sans-serif;
    display: inline-block
}

.rd-box .btn-simple {
    display: inline-block;
    margin: 0 0 0 70px;
    border-radius: 5px;
    font-size: 17px;
    text-transform: uppercase;
    text-shadow: none;
    padding: 17px 27px 17px 20px;
    min-width: 250px;
    position: relative;
    top: -5px;
    color: #fff
}

.rd-box .btn-simple:hover {
    color: #fff
}

.rd-box .btn-simple:after {
    border-color: #fff
}

.shad-round {
    position: relative
}

.shad-round:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: #fff;
    border-bottom: 1px solid #dedede;
    z-index: 3
}

.shad-round:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    border-radius: 100%;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .1);
    z-index: 2
}

.slider-section {
    padding: 80px 20px 70px;
    background: #fff
}

.slider-section:not(.shad-invert):not(.inner-stream):last-child {
    padding-bottom: 25px
}

.slider-section.rel-holder {
    position: relative;
    z-index: 2
}

.border {
    border-top: 3px solid #e8e8e8
}

.slider-section .frame {
    max-width: 1582px;
    position: relative
}

.sec-ttl {
    text-align: center;
    margin-bottom: 40px
}

.sec-ttl.ad-pad {
    padding-top: 100px
}

.sec-ttl h2 {
    color: #000000;
    letter-spacing: -1px;
    font-size: 40px;
    font-weight: bold;
}

.sec-ttl h2 span {
    font: 40px roboto-light-webfont, sans-serif
}

.sec-ttl h2 span.size01 {
    font-size: 60px
}

.sec-ttl .descr {
    font: 20px/1.5 roboto-light-webfont, sans-serif;
    color: #5a6063;
    padding: 15px 40px;
    max-width: 1000px;
    margin: 0 auto
}

.sec-ttl .descr.high-size {
    font-size: 32px
}

.sec-ttl .descr strong {
    : roboto-medium-webfont, sans-serif
}

.sec-ttl.dark h2 {
    color: #fff
}

.sec-ttl.dark .descr {
    color: #878a8c
}

.simple-slider {
    position: relative;
    padding: 0 20px
}

.txt-slider {
    background-color: #fff
}

.gray .txt-slider {
    background-color: #f9f9f9
}

.simple-slider-holder {
    max-width: 1160px;
    margin: 0 auto
}

.simple-slider h3:not(.slide-ttl) {
    color: #0078ae;
    font: 45px/1.1 roboto-medium-webfont, sans-serif;
    letter-spacing: -1px;
    margin-bottom: 20px
}

.simple-slider p.sub {
    font: 24px/1.35 roboto-light-webfont, sans-serif;
    margin-bottom: 16px
}

.txt-slider p.sub {
    font: 30px/1.35 roboto-medium-webfont, sans-serif;
    color: #0078ae
}

.txt-slider p strong {
    : roboto-medium-webfont, sans-serif
}

.simple-slider .t-cell.txt.alt-view {
    padding: 0 4% 0 0;
    vertical-align: middle;
    font: 20px/1.5 roboto-light-webfont, sans-serif
}

.simple-slider .t-cell.txt.alt-view + .t-cell.visual {
    padding: 0
}

.simple-slider p.size02 {
    color: #009ddc;
    margin-bottom: 15px;
    font: 42px/1.15 roboto-light-webfont, sans-serif
}

.simple-slider p.size02 strong {
    : roboto-medium-webfont, sans-serif
}

.simple-slider .t-holder {
    margin-bottom: 40px
}

.pr-slider .t-holder {
    margin-bottom: 80px
}

.simple-slider .t-cell {
    padding: 40px 0 0;
    vertical-align: top;
    color: #5a6063;
    
}

.txt-slider .t-cell {
    font: 20px/1.6 roboto-light-webfont, sans-serif
}

.pr-slider.fade .item .t-cell {
    transition: none
}

.simple-slider .t-cell.txt {
    padding: 55px 9% 0 0;
    width: 60%
}

.simple-slider .t-cell.visual {
    width: 40%;
    text-align: right;
    vertical-align: middle
}

.simple-slider.fade .item .t-cell {
    opacity: 0;
    transition: transform .3s ease-out, opacity .6s ease-out;
    transform: translateX(150px)
}

.simple-slider.fade .item .t-cell.visual {
    transition: transform .3s ease-out .1s, opacity .3s ease-out .1s
}

.simple-slider.fade .current .t-cell {
    opacity: 1;
    transform: translateX(0);
    transition: transform .3s ease-out, opacity .2s ease-out
}

.simple-slider.fade .prev-current .t-cell {
    transform: translateX(-150px);
    opacity: 0
}

.simple-slider .bx-pager {
    text-align: center;
    position: relative;
    z-index: 3
}

.simple-slider .bx-pager-item {
    display: inline-block;
    margin: 0 20px
}

.simple-slider .bx-pager-link {
    display: inline-block;
    width: 24px;
    height: 24px;
    border: 2px solid #dedede;
    border-radius: 50%;
    position: relative;
    font-size: 0;
    line-height: 0;
    transition: all .3s linear
}

.simple-slider .bx-pager-link:after {
    content: "";
    background: #fff;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: width .5s ease-out, height .5s ease-out;
    border-radius: 50%
}

.simple-slider .bx-pager-link.active {
    border-color: #90c404
}

.simple-slider .bx-pager-link.active:after {
    background: #90c404;
    width: 12px;
    height: 12px
}

.simple-slider .pull-controls {
    height: 130px;
    overflow: hidden
}

.simple-slider .pull {
    top: 34px;
    bottom: auto;
    width: 20px;
    height: 61px;
    transform: scale(1)
}

.simple-slider .pull.left {
    width: 42px
}

.simple-slider .bx-next:after, .simple-slider .bx-prev:after {
    content: "";
    border-radius: 50%;
    width: 128px;
    height: 128px;
    position: absolute;
    top: -34px;
    transition: opacity .3s linear;
    opacity: 0
}

.simple-slider .bx-next:after {
    box-shadow: 20px 0 3px 10px rgba(255, 255, 255, 1), -3px 0 3px 0 rgba(0, 0, 0, .1);
    left: -32px
}

.simple-slider .bx-prev:after {
    box-shadow: -20px 0 3px 10px rgba(255, 255, 255, 1), 3px 0 3px 0 rgba(0, 0, 0, .1);
    right: -12px
}

.simple-slider .pull.left:hover .bx-prev:after, .simple-slider .pull.right:hover .bx-next:after {
    opacity: 1
}

.simple-slider .slide-center {
    text-align: center;
    height: 340px;
    padding: 0 15% 80px;
    vertical-align: middle;
    font: 24px/1.6 roboto-light-webfont, sans-serif
}

.simple-slider .slide-center h3 {
    font: 45px/1.2 roboto-light-webfont, sans-serif;
    margin-bottom: 15px
}

.simple-slider .slide-center h3 strong {
    : roboto-medium-webfont, sans-serif
}

.tab-slider {
    margin: 0 auto 60px;
    max-width: 1820px
}

.tab-slider-pager {
    margin: 0 auto 11px;
    max-width: 1150px;
    display: table;
    width: 100%;
    position: relative;
    z-index: 52;
    table-layout: fixed
}

.tab-slider-pager:after {
    content: "";
    background: #dedede;
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%;
    height: 4px
}

.tab-slider-pager > a {
    display: table-cell;
    height: 110px;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 100%
}

.tab-slider-pager:not(.visual) > a h3, .tab-slider-pager:not(.visual) > a span {
    font: 20px/1.2 roboto-medium-webfont, sans-serif;
    color: #5a6063;
    transition: color .2s ease-out
}

.tab-slider-pager:not(.visual) > a.active h3, .tab-slider-pager:not(.visual) > a.active span {
    color: #90c404
}

.tab-slider-pager > a:not(:first-child):after {
    content: "";
    width: 1px;
    height: 74px;
    position: absolute;
    left: 0;
    top: 22px;
    background: #dadada
}

.current-tab {
    height: 5px;
    width: 25%;
    background: #90c404;
    position: absolute;
    bottom: -11px;
    z-index: 2;
    left: 0;
    transition: all .2s linear
}

.current-tab:after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -20px;
    border-top: 14px solid #90c404;
    border-right: 20px solid transparent;
    border-left: 20px solid transparent
}

.tab-slider .active-0 .current-tab {
    left: 0 !important
}

.tab-slider-pager .brand {
    display: inline-block;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .smarties {
    width: 168px;
    height: 56px;
    background-position: -3170px -62px
}

.tab-slider-pager .active .smarties {
    background-position: -3169px -2px
}

.tab-slider-pager .rana {
    width: 106px;
    height: 63px;
    background-position: -3341px -67px
}

.tab-slider-pager .active .rana {
    background-position: -3341px 0
}

.tab-slider-pager .epicreads {
    width: 154px;
    height: 43px;
    background-position: -3549px -46px
}

.tab-slider-pager .active .epicreads {
    background-position: -3549px 0
}

.tab-slider-pager .havi {
    width: 148px;
    height: 51px;
    background-position: -2479px -54px
}

.tab-slider-pager .active .havi {
    background-position: -2479px 0
}

.tab-slider-pager .glass {
    width: 212px;
    height: 54px;
    background-position: -2266px -54px
}

.tab-slider-pager .active .glass {
    background-position: -2267px 0
}

.tab-slider-pager .active-brand {
    background-position: 0 100%
}

.tab-slider-pager .active .active-brand {
    background-position: 0 0
}

.tab-slider-pager .mem {
    width: 152px;
    height: 56px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .first {
    width: 156px;
    height: 51px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .school {
    width: 100px;
    height: 72px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .johnjay {
    width: 87px;
    height: 63px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .cayman {
    width: 228px;
    height: 48px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .bcn {
    width: 138px;
    height: 33px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .snc {
    width: 180px;
    height: 34px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .nfl {
    width: 54px;
    height: 72px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .uct {
    width: 53px;
    height: 86px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .sonobello {
    width: 142px;
    height: 88px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .bone {
    width: 183px;
    height: 46px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .intelligence {
    width: 200px;
    height: 52px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .rachel {
    width: 88px;
    height: 79px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .luxury {
    width: 191px;
    height: 45px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .stark {
    width: 140px;
    height: 32px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .dance {
    width: 168px;
    height: 25px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .medcpu {
    width: 176px;
    height: 36px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .leon {
    width: 147px;
    height: 72px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .baldor {
    width: 101px;
    height: 62px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .candy {
    width: 191px;
    height: 45px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .serviceking {
    width: 146px;
    height: 52px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .paul {
    width: 164px;
    height: 29px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .btb {
    width: 152px;
    height: 74px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .amf {
    width: 97px;
    height: 75px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .girlscouts {
    width: 187px;
    height: 74px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .toysrus {
    width: 154px;
    height: 74px;
    background-image: url("../image/tzz_ion-1.png")
}

.tab-slider-pager .bowlmor {
    width: 186px;
    height: 47px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .nuna {
    width: 152px;
    height: 25px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .ecaytrade {
    width: 176px;
    height: 25px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .kosher {
    width: 205px;
    height: 68px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .bw {
    width: 129px;
    height: 64px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .exhale {
    width: 196px;
    height: 41px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .luxor {
    width: 189px;
    height: 54px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .nssplus {
    width: 174px;
    height: 67px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .ewing {
    width: 192px;
    height: 50px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .winchester {
    width: 158px;
    height: 74px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .loanscribe {
    width: 239px;
    height: 37px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .shenkman {
    width: 197px;
    height: 36px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider-pager .unionbank {
    width: 182px;
    height: 70px;
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider .t-holder {
    margin: 0 auto;
    max-width: 1150px
}

.tab-slider .item.dance {
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider .item.leon {
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider .item.btb {
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider .item.medcpu {
    background-image: url("../image/tzz_ion-1.jpg")
}

.tab-slider .item {
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
    border-radius: 5px
}

.tab-slider .t-cell {
    vertical-align: middle;
    height: 545px;
    padding: 0
}

.tab-slider .t-cell.txt {
    font: 24px/1.5 roboto-light-webfont, sans-serif;
    width: 45%;
    padding: 0
}

.tab-slider .t-cell.visual {
    width: 55%;
    padding-top: 40px
}

.tab-slider .t-cell.visual img {
    max-width: 9999px
}

.link-arrow {
    font: 16px roboto-bold-webfont, sans-serif;
    color: #90c404;
    display: inline-block;
    margin: 32px 0 0;
    position: relative;
    text-transform: uppercase
}

.link-arrow:before {
    content: "";
    width: 108%;
    height: 3px;
    background: #e8e8e8;
    position: absolute;
    bottom: -10px;
    left: 0;
    transition: all .3s linear;
    opacity: 0
}

.link-arrow.underline:before {
    opacity: 1
}

.link-arrow.underline:hover:before {
    background: #90c404
}

.link-arrow:hover {
    color: #90c404
}

.link-arrow:hover:before {
    background: #90c404
}

.link-arrow:after {
    content: "";
    width: 6px;
    height: 6px;
    border: 3px solid #90c404;
    border-width: 3px 3px 0 0;
    transform: rotate(45deg);
    display: inline-block;
    position: relative;
    left: 8px;
    top: -1px;
    transition: all .2s linear
}

.link-arrow.blue {
    color: #0197d3
}

.link-arrow.blue:after {
    border-color: #0197d3
}

.link-arrow.blue:hover:after, .link-arrow.green:hover:after {
    left: 10px
}

.slider-section .pull-controls {
    position: absolute;
    width: 100%;
    margin: 0 auto;
    left: 0;
    top: 236px
}

.slider-section .txt-slider .pull-controls {
    top: 120px;
    margin: 0 auto
}

.case-slider .pull-controls {
    width: 85%;
    position: relative;
    overflow: visible;
    margin: 0 auto;
    height: 1px;
    z-index: 52
}

.case-slider .pull {
    top: 0
}

.case-slider .bx-next:after, .case-slider .bx-prev:after {
    display: none
}

.case-slider p {
    padding-right: 0
}

.case-slider p strong {
    : roboto-medium-webfont, sans-serif
}

.case-slider .t-cell.txt {
    width: 40%
}

.case-slider .t-cell.visual {
    padding: 0 20px 0 0;
    width: 60%
}

.ba-slider {
    border: 1px solid transparent;
    border-radius: 4px;
    margin: 60px auto 90px;
    background-color: #fff;
    transition: border-color .3s ease-out 1.2s
}

.animated.ba-slider {
    border-color: #dedede
}

.ba-note {
    color: #878a8c;
    font: 17px roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    margin-bottom: 20px
}

.ba-note svg {
    width: 80px;
    height: 38px;
    fill: #90c404;
    margin: 0 30px 0 20px;
    position: relative;
    top: 10px
}

.ba-slider-holder {
    max-width: 1301px;
    margin: 0 auto;
    padding: 50px 0 0;
    text-align: center;
    position: relative;
    z-index: 2
}

.ba-slider .pull-controls {
    top: 380px;
    width: 88%;
    margin: 0 6%
}

.jq-btn-close {
    cursor: pointer
}

.ba-expand-m {
    display: none
}

.ba-expand {
    height: 560px;
    transition: height .3s linear
}

.ba-expand.shad-round:before {
    bottom: -51px
}

.ba-expand.shad-round:after {
    bottom: -53px;
    transform: rotate(180deg);
    box-shadow: 0 3px 10px 0 rgba(0, 0, 0, .2)
}

.jq-slide-open .ba-expand {
    padding-bottom: 80px
}

.ba-btn {
    background: #fff;
    border-radius: 3px;
    color: #90c404;
    font: 17px roboto-bold-webfont, sans-serif;
    width: 283px;
    padding: 23px 0;
    text-align: center;
    border-bottom: 3px solid #90c404;
    transition: width .2s linear, padding .2s linear, border-radius .05s linear;
    white-space: nowrap;
    overflow: hidden
}

.tab-slider .ba-btn:before {
    display: none
}

.link-arrow.ba-btn:after {
    border-width: 2px 2px 0 0;
    width: 10px;
    height: 10px;
    left: 15px;
    top: -4px;
    transform: rotate(135deg)
}

.tab-slider .ba-btn {
    position: absolute;
    bottom: -38px;
    left: 50%;
    transform: translateX(-50%)
}

.ba-btn-close {
    border-radius: 100%;
    border-bottom: 1px solid #e0e0e0;
    width: auto;
    min-width: 146px;
    padding: 25px 49px 20px 37px
}

.link-arrow.ba-btn-close:after {
    transform: rotate(315deg);
    top: 2px
}

.process-section {
    padding: 90px 0 35px;
    position: relative;
}

.process-section .sec-ttl {
    background: 0 0;
    border-bottom: 1px solid #e8e8e8;
    padding: 0 0 130px;
    transition: opacity .2s linear, background .3s ease-out 2s
}

.process-section .sec-ttl.ad-pad {
    padding-top: 140px
}

.process-section .animated .sec-ttl {
    background: #fff
}

.pr-slider-holder {
    max-width: 1100px;
    margin: 0 auto
}

.pr-slider {
    max-width: 1583px;
    margin: 0 auto;
    position: relative
}

.shad-invert:before {
    bottom: -50px;
    border: none
}

.shad-invert:after {
    bottom: -50px;
    transform: rotate(180deg)
}

.pr-slider .item {
    padding-top: 60px
}

.pr-slider .t-cell.visual {
    width: 45%
}

.pr-slider .t-cell.txt {
    width: 55%
}

.pr-slider .pull-controls {
    top: 340px;
    width: 87%;
    margin: 0 6.5%
}

.pr-slider-pager {
    display: table;
    width: 100%;
    table-layout: fixed;
    max-width: 1230px;
    margin: -152px auto 30px;
    position: relative
}

.pr-slider-pager > a {
    display: table-cell;
    width: 100%;
    vertical-align: top;
    text-align: center;
    position: relative
}

.pr-slider h3:not(.slide-ttl) {
    color: #009ddc;
    font-size: 45px;
    line-height: 1.1em;
}

.pr-slider p {
    font-size: 20px;
    line-height: 1.4em;
}

.pr-slider p strong {
    : roboto-medium-webfont, sans-serif
}

.pr-txt {
    color: #5a6063;
    font: 20px/1.2;
    display: inline-block;
    margin: 0 0 20px;
    transition: color .3s linear;
    font-weight: bolder;
}

.active.strat .pr-txt {
    color: #009ddc
}

.active.info .pr-txt {
    color: #a541c0
}

.active.design .pr-txt {
    color: #f7a43c
}

.active.dev .pr-txt {
    color: #000
}

.active.qa .pr-txt {
    color: #5ea34b
}

.active.opt .pr-txt {
    color: #4dccd1
}

.pr-bg, .pr-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%
}

.pr-icon {
    display: block;
    margin: 0 auto;
    position: relative;
    z-index: 3
}

.pr-bg {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    z-index: 2
}

.pr-bg:after, .pr-bg:before {
    content: "";
    position: absolute;
    border-radius: 50%
}

.pr-bg:after {
    border: 10px solid #fff;
    width: 100%;
    height: 100%;
    z-index: 1;
    top: -10px;
    left: -10px
}

.pr-bg:before {
    top: 0;
    left: 0;
    box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, .1);
    width: 100%;
    height: 100%;
    z-index: 2
}

.pr-icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.pr-icon path {
    transition: all .3s linear
}

.strat .pr-icon svg {
    fill: #009ddc;
    width: 26px;
    height: 42px
}

.strat .pr-icon .str0, .strat .pr-icon .str2 {
    stroke: #1F71B4;
    stroke-width: 45.9624
}

.strat .pr-icon .str1 {
    stroke: #1F71B4;
    stroke-width: 114.908
}

.strat .pr-icon .fil0 {
    fill: none;
    fill-rule: nonzero
}

.strat .pr-icon .fil1 {
    fill: #F6F6F6;
    fill-rule: nonzero
}

.info .pr-icon svg {
    width: 40px;
    height: 32px
}

.info .pr-icon .str0 {
    stroke: #9D4F98;
    stroke-width: 316.52
}

.info .pr-icon .fil0 {
    fill: none;
    fill-rule: nonzero
}

.info .pr-icon .fil1 {
    fill: #9D4F98;
    fill-rule: nonzero
}

.design .pr-icon svg {
    width: 30px;
    height: 46px
}

.design .pr-icon .str0 {
    stroke: #F6AA48;
    stroke-width: 70.2664
}

.design .pr-icon .fil0 {
    fill: none;
    fill-rule: nonzero
}

.dev .pr-icon svg {
    width: 41px;
    height: 23px
}

.dev .pr-icon .str0 {
    stroke: #090A0B;
    stroke-width: 89.8064
}

.dev .pr-icon .str1 {
    stroke: #090A0B;
    stroke-width: 79.8298
}

.dev .pr-icon .fil0 {
    fill: none
}

.qa .pr-icon svg {
    width: 38px;
    height: 35px
}

.qa .pr-icon .str0 {
    stroke: #5EA34B;
    stroke-width: 359.222
}

.qa .pr-icon .fil0 {
    fill: none
}

.opt .pr-icon svg {
    width: 39px;
    height: 38px
}

.opt .pr-icon .str0 {
    stroke: #4DCCD1;
    stroke-width: 138.885
}

.opt .pr-icon .fil0 {
    fill: none
}

.active .pr-icon .fil1 {
    fill: #fff !important
}

.active .pr-icon .str0, .active .pr-icon .str1, .active .pr-icon .str2 {
    stroke: #fff !important
}

.pr-current-tab {
    position: absolute;
    top: 68px;
    width: 70px;
    height: 70px;
    background: 0 0;
    border-radius: 50%;
    z-index: 2;
    transition: all .3s linear
}

.pr-current-tab:after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 21px;
    border-top: 25px solid transparent;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    transition: all .3s linear
}

.pr-current-tab.animated {
    -webkit-animation: anim-cur-step .8s;
    animation: anim-cur-step .8s
}

.active-0 .pr-current-tab {
    background: #009ddc
}

.active-0 .pr-current-tab:after {
    border-top-color: #009ddc
}

.active-1 .pr-current-tab {
    background: #a541c0
}

.active-1 .pr-current-tab:after {
    border-top-color: #a541c0
}

.active-2 .pr-current-tab {
    background: #f7a43c
}

.active-2 .pr-current-tab:after {
    border-top-color: #f7a43c
}

.active-3 .pr-current-tab {
    background: #090a0b
}

.active-3 .pr-current-tab:after {
    border-top-color: #090a0b
}

.active-4 .pr-current-tab {
    background: #5ea34b
}

.active-4 .pr-current-tab:after {
    border-top-color: #5ea34b
}

.active-5 .pr-current-tab {
    background: #4dccd1
}

.active-5 .pr-current-tab:after {
    border-top-color: #4dccd1
}

.active-1 .digital .pr-current-tab {
    background: #5ea34b
}

.active-1 .digital .pr-current-tab:after {
    border-top-color: #5ea34b
}

.digital .opt .pr-icon .fil0 {
    fill: #1c91c7
}

.digital .active.opt .pr-txt {
    color: #1c91c7
}

.digital .qa .pr-icon .fil1 {
    fill: #5ea34b
}

.digital .qa .pr-icon .str1 {
    stroke: #5ea34b
}

.active-2 .digital .pr-current-tab {
    background: #1c91c7
}

.active-2 .digital .pr-current-tab:after {
    border-top-color: #1c91c7
}

.mob-mode, .tab-mode, .wide-mode {
    display: none
}

.head-anim-holder {
    overflow: hidden;
    position: relative;
    z-index: 1;
    background-color: #fff
}

.head-anim-holder .s-left {
    width: 60%;
    padding-right: 40%
}

.head-anim-holder .s-left.narrow {
    width: 54%;
    padding-right: 46%
}

.head-anim-holder .s-left .btn-holder {
    padding: 10px 0;
    margin-top: -10px;
    overflow: hidden
}

.head-anim {
    position: absolute;
    top: 0;
    left: 0%;
    height: 100%;
    width: 100%
}

.head-anim-img {
    position: absolute;
    top: 18px;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0
}

.img-wrap img {
    opacity: 0;
    transition: opacity .3s forwards
}

.img-loaded img {
    opacity: 1
}

.head-anim-load .img-loaded img {
    opacity: 0
}

.animated .head-anim-load .img-loaded img {
    opacity: 1
}

.an-wide {
    display: none
}

.anim-box {
    transition: opacity .2s linear
}

.anim-start {
    overflow: hidden
}

.fade-anim {
    opacity: 0;
    transition: opacity .4s ease-out
}

.fade-anim.mode-1 {
    transition: opacity .4s ease-out .3s
}

.fade-anim.mode-2 {
    transition: opacity .4s ease-out .7s
}

.fade-anim.mode-3 {
    transition: opacity .4s ease-out 1.1s
}

.animated .fade-anim, .btm-scroll.rd-box {
    opacity: 1;
}

.btm-scroll {
    opacity: 0;
    position: relative;
    transform: translateY(500px)
}

.btm-scroll.mode-1 {
    transition: transform .5s ease-out, opacity .6s ease-out
}

.btm-scroll.mode-2 {
    transition: transform .9s ease-out, opacity 1s ease-out
}

.btm-scroll.mode-3, .btm-scroll.mode-4 {
    transition: transform 1.3s ease-out, opacity 1.4s ease-out
}

.btm-scroll.mode-5 {
    transition: transform 1.7s ease-out, opacity 1.3s ease-out
}

.btm-scroll.mode-6 {
    transition: transform 2.1s ease-out, opacity 1.7s ease-out
}

.btm-scroll.mode-7 {
    transition: transform 2.5s ease-out, opacity 2.1s ease-out
}

.btm-scroll.mode-8 {
    transition: transform 2.9s ease-out, opacity 2.5s ease-out
}

.sec-ttl.anim-box .fade-anim {
    transition: opacity .3s ease-out 1s
}

.t-cell .btm-scroll.mode-2 {
    transition: transform .9s ease-out .6s, opacity 1s ease-out .6s
}

.t-cell .btm-scroll.mode-4 {
    transition: transform 1.7s ease-out .6s, opacity 1.8s ease-out .6s
}

.animated .btm-scroll {
    opacity: 1;
    transform: translateY(0);
    font-size: 40px;
}
.animated .btm-scroll h2{
    color: #3f33c1;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 30px;
}
.content-section .overflow {
    overflow: hidden
}

.content-section.gray, .slider-section.gray, .slider-section.shad-round.gray:before {
    background: #f9f9f9
}

.slider-section.gray + .slider-section {
    z-index: 3
}

.case-slider .fade-anim.pull-controls {
    transition: all .6s ease-out .5s
}

.slider-pager .fade-anim:nth-child(1) {
    transition: opacity .2s linear .5s
}

.slider-pager .fade-anim:nth-child(2) {
    transition: opacity .2s linear .6s
}

.slider-pager .fade-anim:nth-child(3) {
    transition: opacity .2s linear .7s
}

.slider-pager .fade-anim:nth-child(4) {
    transition: opacity .2s linear .8s
}

.slider-pager .fade-anim:nth-child(5) {
    transition: opacity .2s linear .9s
}

.slider-pager .fade-anim:nth-child(6) {
    transition: opacity .2s linear 1s
}

.slider-pager .fade-anim:nth-child(7) {
    transition: opacity .2s linear 1.1s
}

.slider-pager .fade-anim:nth-child(8) {
    transition: opacity .2s linear 1.2s
}

.slider-pager .fade-anim:nth-child(9) {
    transition: opacity .2s linear 1.3s
}

.slider-pager .pr-current-tab.fade-anim:after {
    transition: opacity .2s linear
}

.slider-pager .pr-current-tab.fade-anim {
    transition: opacity .2s linear .3s, left .3s linear
}

.simple-slider .current-tab.fade-anim {
    transition: opacity .2s linear .3s, left .2s linear
}

.scroll-arrow-wrap {
    position: absolute;
    top: -35px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, .08);
    z-index: 20;
    background: #fff
}

.scroll-arrow {
    width: 36px;
    height: 16px;
    position: absolute;
    top: 42%;
    left: 0;
    right: 0;
    margin: 0 auto;
    transition: transform .2s linear
}

.scroll-arrow-wrap:hover .scroll-arrow {
    -webkit-transform: translate(0, 3px);
    transform: translate(0, 3px)
}

.scroll-arrow-right {
    fill: #009ddc
}

.scroll-arrow-left {
    fill: #00b2fa
}

.slide-area {
    display: none
}

.scroll-arrow-wrap + .content-section, .scroll-arrow-wrap + .dark-section, .scroll-arrow-wrap + .slider-section:not(.process-section) {
    padding-top: 80px
}

.mix-slider {
    border: 1px solid transparent;
    border-radius: 4px;
    margin: 60px auto 0;
    background-color: transparent;
    transition: border-color .3s ease-out 1.2s, background .3s ease-out 1.4s;
    overflow: hidden
}

.animated.mix-slider {
    background: #fff;
    border-color: #dedede
}

.slider-section .mix-slider .pull-controls {
    width: 88%;
    margin: 0 6%;
    top: 50%;
    transform: translateY(-50%)
}

.mix-slider .t-cell {
    height: auto
}

.mix-slider .t-cell.txt {
    text-align: left;
    font-size: 20px;
    width: 63%;
    padding: 25px 4% 85px 0;
    vertical-align: top
}

.mix-slider .t-cell.visual {
    width: 37%;
    padding-top: 0;
    padding-bottom: 85px;
    text-align: center
}

.mix-slider h3:not(.slide-ttl) {
    font-size: 45px
}

.head-anim-holder:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0;
    transition: opacity .2s linear;
    
}

.head-anim-holder.animated:before {
    opacity: 1
}

.head-anim-holder.over:before {
    height: calc(100% - 70px)
}

.head-anim-holder.over {
    padding-bottom: 70px;
    margin-bottom: -70px;
    background-color: transparent;
    position: relative;
    z-index: 10;
    margin-left: 140px;
}

.dark-section {
    background: #181d22;
    padding: 80px 20px 70px;
    color: #fff;
    overflow: hidden
}

.dark-section .frame {
    max-width: 1608px
}

.dark-section .frame.narrow {
    max-width: 1103px
}

.equal-cols {
    table-layout: fixed
}

.equal-cols .t-cell {
    padding: 36px 0 20px;
    vertical-align: top;
    width: 100%;
    font: 20px/1.6 roboto-light-webfont, sans-serif
}

.equal-cols .link-arrow {
    margin-top: 17px;
    font-size: 17px
}

.equal-cols .visual {
    padding-left: 160px;
    height: 175px
}

.equal-cols .ios {
    background: url("../image/tzz_ion-1.jpg") 42px 44px no-repeat
}

.equal-cols .android {
    background: url("../image/tzz_ion-1.jpg") 42px 44px no-repeat
}

.equal-cols .ttl {
    font: 45px/1.1 roboto-bold-webfont, sans-serif;
    letter-spacing: -1px;
    margin-bottom: 10px
}

.same-blocks {
    margin: 0 -1.2%
}

.same-blocks > div {
    float: left;
    width: 30.93%;
    height: 180px;
    margin: 0 1.2% 2.4%
}

.same-blocks .unit {
    display: block;
    height: 100%;
    background: #fff;
    border-radius: 3px;
    box-shadow: inset 0 0 0 5px transparent, 0 0 2px 2px rgba(0, 0, 0, .05);
    position: relative;
    vertical-align: middle;
    transition: all .3s linear
}

.same-blocks .unit:hover {
    box-shadow: inset 0 0 0 5px #009ddc, 0 0 2px 2px transparent
}

.content-section {
    padding: 80px 20px 70px;
    background: #fff
}

.content-section:not(.shad-invert):last-child {
    padding-bottom: 0
}

.content-section .frame {
    max-width: 1103px
}

.content-section .frame.wide {
    max-width: 1233px
}

.same-blocks .unit > span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.same-blocks .client-logo-item, .same-blocks .client-logo-item:before {
    background-image: url("../image/tzz_ion-1.png")
}

.cl-wm, .cl-wm:before {
    width: 237px;
    height: 52px;
    background-position: 0 0
}

.cl-wm:before {
    background-position: 0 -55px
}

.cl-wp, .cl-wp:before {
    width: 238px;
    height: 54px;
    background-position: -1106px 0
}

.cl-wp:before {
    background-position: -1106px -57px
}

.cl-sitecore, .cl-sitecore:before {
    width: 231px;
    height: 56px;
    background-position: -240px 0
}

.cl-sitecore:before {
    background-position: -240px -59px
}

.cl-drupal, .cl-drupal:before {
    width: 194px;
    height: 67px;
    background-position: -909px 0
}

.cl-drupal:before {
    background-position: -909px -71px
}

.cl-joomla, .cl-joomla:before {
    width: 217px;
    height: 44px;
    background-position: -689px 0
}

.cl-joomla:before {
    background-position: -689px -48px
}

.cl-magento, .cl-magento:before {
    width: 212px;
    height: 62px;
    background-position: -474px 0
}

.cl-magento:before {
    background-position: -474px -66px
}

.cl-demand, .cl-demand:before {
    width: 216px;
    height: 45px;
    background-position: -1541px 0
}

.cl-demand:before {
    background-position: -1541px -47px
}

.cl-aem, .cl-aem:before {
    width: 191px;
    height: 74px;
    background-position: -1347px 0
}

.cl-aem:before {
    background-position: -1347px -77px
}

.cl-sitefinity, .cl-sitefinity:before {
    width: 255px;
    height: 45px;
    background-position: -1760px 0
}

.cl-sitefinity:before {
    background-position: -1760px -47px
}

.text-content {
    padding: 0 61px;
    font: 20px/1.6 roboto-light-webfont, sans-serif;
    color: #5a6063
}

.text-content p {
    margin-bottom: 30px
}

.text-content p strong {
    : roboto-medium-webfont, sans-serif
}

.text-content .size01 {
    color: #0078ae;
    font: 30px roboto-medium-webfont, sans-serif
}

.text-content .size02 {
    font-size: 24px;
    line-height: 1.4
}

.tabs-frame {
    display: table;
    position: relative;
    border-radius: 4px;
    padding: 15px 0 40px
}

.tabs-visual {
    display: table-cell;
    width: 35.5%;
    position: relative;
    z-index: 2
}

.tabs-visual .item {
    background: 0 0;
    border: solid transparent;
    border-width: 1px 0 0 1px;
    display: table;
    width: 100%;
    transition: all .3s linear 1.1s;
    position: relative
}

.tabs-visual .item:nth-child(1) {
    border-radius: 4px 0 0
}

.wide-tabs-visual .item:nth-child(1) {
    border-radius: 4px 4px 0 0
}

.tabs-visual .item:nth-last-child(2) {
    border-bottom-width: 1px;
    border-radius: 0 0 0 4px
}

.wide-tabs-visual .item:nth-last-child(2) {
    border-radius: 0 0 4px 4px;
    border-bottom-width: 0
}

.tabs-visual .item > a {
    cursor: pointer;
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    height: 125px;
    color: #009ddc;
    font: 30px/1.2 roboto-bold-webfont, sans-serif;
    padding: 0 15px 0 145px
}

.tabs-txt .ttl {
    color: #90c404;
    font: 19px/1.2 roboto-bold-webfont, sans-serif;
    margin-bottom: 20px;
    display: none
}

.tabs-visual .active > a {
    color: #90c404
}

.tabs-step {
    position: absolute;
    top: 0;
    right: -1px;
    width: 6px;
    height: 127px;
    opacity: 0;
    transition: top .2s linear, opacity .3s linear 1.1s
}

.animated .tabs-step {
    opacity: 1
}

.tabs-step:after {
    content: "";
    height: 100%;
    width: 100%;
    background: #90c404;
    position: absolute;
    top: 0;
    right: 0
}

.tabs-step:before {
    content: "";
    position: absolute;
    top: 50%;
    right: -14px;
    margin-top: -20px;
    border-left: 17px solid #90c404;
    border-top: 22px solid transparent;
    border-bottom: 22px solid transparent
}

.tabs-visual .ico {
    position: absolute;
    top: 50%;
    left: 45px;
    margin-top: -35px;
    box-shadow: 1px 2px 2px 2px rgba(0, 0, 0, .05);
    border-radius: 50%;
    height: 70px;
    width: 70px;
    text-align: center
}

.tabs-visual .ico path {
    transition: stroke .2s linear
}

.tabs-visual .ico svg {
    width: 60px;
    height: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: fill .2s linear;
    fill: #009ddc
}

.tabs-visual .ico svg.size01 {
    height: 90px
}

.tabs-visual .ico .stroke {
    fill: none;
    stroke: #009ddc
}

.tabs-visual .ico .fill-mobile {
    fill: #009ddc
}

.tabs-visual .active .fill-mobile, .tabs-visual .active svg {
    fill: #90c404
}

.tabs-visual .active .stroke {
    stroke: #90c404
}

.tabs-txt {
    display: table-cell;
    vertical-align: top;
    width: 65.5%;
    padding: 43px 50px;
    color: #5a6063;
    font: 20px/1.6 roboto-light-webfont, sans-serif;
    border-radius: 0 4px 4px;
    background: 0 0;
    border: 1px solid transparent;
    transition: all .3s linear 1s
}

.animated .tabs-txt:not(.wide-tabs-txt), .animated .tabs-visual .item, .animated .wide-tabs-txt:after {
    border-color: #dedede;
    background-color: #fff
}

.tabs-txt .unit {
    border-top: 1px solid #dedede;
    padding: 40px 0 35px
}

.tabs-txt .unit:last-child {
    padding-bottom: 20px
}

.tabs-txt .unit:first-child {
    border: none;
    padding-top: 0
}

.tabs-txt h3 {
    color: #0078ae;
    margin-bottom: 20px;
    font: 45px/1 roboto-medium-webfont, sans-serif
}

.tabs-txt .link-arrow {
    margin-top: 7px
}

.tabs-txt .unit h3 {
    color: #758288;
    font: 30px/1.2 roboto-bold-webfont, sans-serif;
    margin-bottom: 5px
}

.tabs-txt .unit.green h3 {
    color: #90c404
}

.tabs-txt ol {
    list-style-type: none;
    counter-reset: item
}

.tabs-txt .unit li {
    padding: 16px 20px 16px 57px;
    position: relative
}

.tabs-txt .unit li:before {
    content: counter(item);
    counter-increment: item;
    min-width: 23px;
    height: 25px;
    border-radius: 4px 0 0 4px;
    border: solid #758288;
    border-width: 1px 0 1px 1px;
    color: #758288;
    font: 17px roboto-black-webfont, sans-serif;
    position: absolute;
    top: 20px;
    left: 2px;
    text-align: center;
    padding-left: 3px
}

.tabs-txt .unit li:after {
    content: "";
    position: absolute;
    top: 26px;
    left: 21px;
    width: 15px;
    height: 14px;
    border: solid #758288;
    transform: rotate(-46deg) skew(-12deg, -12deg);
    border-width: 0 1px 1px 0
}

.tabs-txt .unit.green li:after, .tabs-txt .unit.green li:before {
    color: #90c404;
    border-color: #90c404
}

.wide-tabs-frame {
    padding: 0 0 20px
}

.wide-tabs-txt {
    border: none;
    padding: 20px 0;
    width: 56%;
    position: relative;
    transition: none
}

.wide-tabs-txt:after {
    content: "";
    border-radius: 0 4px 4px 0;
    position: absolute;
    top: 20px;
    left: 0;
    height: calc(100% - 40px);
    width: 100%;
    z-index: 1;
    transition: all .3s linear 1s
}

.wide-tabs-visual {
    box-shadow: 0 0 5px 3px rgba(0, 0, 0, .05);
    width: 44%;
    border-radius: 4px
}

.wide-tabs-visual .ico {
    height: 117px;
    width: 117px;
    margin-top: -59px
}

.wide-tabs-visual .ico svg {
    width: 75px;
    height: 77px
}

.wide-tabs-visual .item {
    border-width: 0 0 1px;
    table-layout: fixed
}

.wide-tabs-visual .item .ttl {
    font-size: 28px
}

.wide-tabs-visual .item > a {
    height: 158px;
    font-size: 28px;
    line-height: 1.1;
    padding-left: 195px
}

.tabs-visual:not(.wide-tabs-visual) .item:nth-last-child(2) {
    border-bottom-width: 1
}

.wide-tabs-txt .item {
    padding: 50px 50px 50px 60px;
    border-radius: 0 4px 4px 0
}

.wide-tabs-txt p strong {
    : roboto-medium-webfont, sans-serif
}

.wide-tabs-txt .scroll-content {
    height: 336px;
    overflow: auto;
    position: relative;
    z-index: 2
}

.wide-tabs-txt .scroll-content-size01 {
    height: 495px
}

.wide-tabs-step {
    height: 158px
}

.animated .head-anim23 {
    left: 259px;
    top: 230px;
    animation: head-anim-img 1s forwards .7s
}

.animated .head-anim24 {
    left: 487px;
    top: 109px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim25 {
    left: -140px;
    top: -70px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim26 {
    left: 244px;
    top: -27px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim27 {
    left: 286px;
    top: -7px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim28 {
    left: -39px;
    top: -6px;
    animation: head-anim-img 1s forwards .7s
}

.animated .head-anim29 {
    left: 346px;
    top: 102px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim30 {
    left: 48px;
    top: 112px;
    animation: head-anim-img .4s forwards 1.2s
}

.animated .head-anim31 {
    left: 265px;
    top: 238px;
    animation: head-anim-img .6s forwards .1s
}

.submenu-section .sec-ttl {
    margin-bottom: 20px
}

.submenu-section .t-cell {
    padding-top: 0
}

.submenu-section .item {
    overflow: hidden;
    display: block;
    height: 100%;
    min-height: 225px;
    padding: 140px 0 30px;
    text-align: center;
    color: #fff;
    font: 26px/1.2 roboto-bold-webfont, sans-serif;
    position: relative;
    margin: 0 12px;
    transition: color .3s ease-out;
    border-bottom: 2px solid #009ddc
}

.submenu-section .item:after, .submenu-section .item:before {
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0
}

.submenu-section .item:after {
    height: calc(100% - 40px);
    background-color: #252525;
    z-index: 1
}

.submenu-section .item:before {
    height: 0;
    background-color: #fff;
    transition: height .4s ease-out;
    z-index: 2
}

.submenu-section img {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%) scale(.95);
    z-index: 3;
    opacity: .4;
    transition: all .3s ease-out
}

.submenu-section span {
    position: absolute;
    bottom: 25px;
    left: 0;
    width: 100%;
    padding: 0 20px;
    z-index: 3
}

.animated .head-anim32 {
    left: -78px;
    top: -28px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim33 {
    left: 190px;
    top: 46px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim34 {
    left: 47px;
    top: 110px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim35 {
    left: 253px;
    top: -68px;
    animation: head-anim-img 1s forwards .7s
}

.animated .head-anim36 {
    left: -115px;
    top: -48px;
    animation: head-anim-img .4s forwards 1.2s
}

.contact-pg .ttl {
    color: #fff;
    font: 80px/1 roboto-medium-webfont, sans-serif;
    letter-spacing: -4px;
    margin-bottom: 20px
}

.contact-pg .wh-detail--wrp .wh--top-banner {
    padding: 105px 0 90px;
    margin-bottom: 0
}

.contact-pg .wh--top-banner .descr {
    color: #fff;
    font: 30px/1.3 roboto-light-webfont, sans-serif
}

.contact-pg .wh--top-banner strong {
    : roboto-medium-webfont, sans-serif
}

.contact-pg .hs-sub-row {
    background: 0 0;
    transition: background .3s ease-out .6s;
    padding: 70px 0;
    margin-bottom: 60px;
    border-radius: 0 0 6px 6px
}

.contact-pg .hs-sub-row .nw--inner-container {
    padding-right: 39%
}

.contact-pg .hs-sub-row .img-wrap {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.contact-pg .hs-sub-row .img-wrap:not(:first-child):before {
    content: "";
    height: 68px;
    width: 1px;
    background: #d3d3d3;
    position: absolute;
    top: 0;
    left: -26px
}

.contact-pg .animated .hs-sub-row {
    background: #f4f4f4
}

.contact-pg .wh-detail--wrp .wh-form-holder {
    float: none;
    position: absolute;
    top: 47px;
    right: 5.7vw;
    max-width: 612px;
    height: auto
}

.contact-pg .wh-detail--wrp .wh-form-holder .wh-form {
    float: none;
    transform: none
}

.ch-addrbox svg {
    position: absolute;
    top: -3px;
    left: 0
}

.ch-cell {
    display: inline-block;
    vertical-align: top;
    padding: 0 10px 0 60px;
    font: 19px/1.4 roboto-light-webfont, sans-serif;
    position: relative
}

.ch-addrbox .stroke {
    fill: none;
    stroke: #0f80b3
}

.ch-place {
    width: 52%
}

.ch-place svg {
    width: 70px;
    height: 80px;
    left: -15px;
    top: -3px
}

.ch-place strong {
    color: #0078ae;
    font: 26px/1.15 roboto-medium-webfont, sans-serif
}

.ch-call {
    width: 46%
}

.ch-call strong {
    color: #0078ae;
    font: 24px roboto-bold-webfont, sans-serif
}

.ch-call svg {
    width: 55px;
    height: 65px
}

.contact-pg .wh-detail--wrp .wh-infobox {
    width: 54%
}

.ch-cell a {
    color: #0078ae
}

.contact-pg .wh-detail--wrp .wh-form-holder .ch-form .f-row-check {
    padding-top: 10px
}

.ch-form .link-arrow:after {
    border-color: #fff;
    width: 9px;
    height: 9px;
    border-width: 4px 4px 0 0;
    position: absolute;
    top: 42%;
    left: 70%
}

.ch-form .btn-simple {
    border-radius: 6px;
    padding: 0
}

.ch-form .btn-simple input {
    color: #fff;
    padding: 20px 80px 20px 50px;
    font: 23px roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    cursor: pointer;
    border: none;
    background: 0 0
}

.contact-pg .wh-detail--wrp .wh-form-holder .ch-form {
    padding-bottom: 50px
}

.contact-pg .wh-detail--wrp .ch-form .ff-textarea textarea {
    height: 150px
}

.contact-pg .wh-detail--wrp {
    min-height: 860px
}

@media only screen and (max-width: 1850px) {
    .gallery-space-hold {
        margin-left: -80px
    }

    .sitecore-pg .bg {
        background-position: 94% 20px
    }

    .biowars-section1 .bg {
        background-position: 130% 0;
        background-size: 85% auto
    }

    .johnjay-section1 .bg {
        background-position: 105% 50%
    }

    .johnjay-section3 .bg {
        background-position: 120% 50%
    }

    .biowars-section2 .bg {
        background-size: auto 85%
    }

    .biowars-section4 .bg, .dance-section4 .bg {
        background-size: auto 70%
    }

    .biowars-section5 .bg, .top-section .bg.btm-corner {
        background-size: auto 75%;
        background-position: 110% 100%
    }

    .main-section .s-left .johnjay-ttl {
        margin-bottom: 30px
    }

    .btb-section1 .bg {
        background-position: 120% 50%;
        background-size: 55% auto
    }

    .btb-section3 .bg.mid-align, .btb-section5 .bg.mid-align, .leon-section3 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-position: 95% 52%;
        background-size: auto 60%
    }

    .leon-section4 .bg {
        background-size: auto 100%;
        background-position: 122% 100%
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.7) translate(-10%, -70%);
        transform: scale(0.7) translate(-10%, -70%)
    }
}

@media only screen and (max-width: 1700px) {
    .gallery-space-hold {
        margin-left: -180px
    }

    .ec-fs-logo {
        margin: 0 0 8px
    }

    .fwb-items .ec-fs-logo img {
        max-width: 150px
    }

    .featured-work-fullscreen .ec-fs-descr {
        padding-left: 20px;
        padding-right: 20px
    }

    .top-section .bg.full-height {
        background-position: 100% 0
    }

    .drupal-pg .bg, .wp-pg .bg {
        background-position: 100% 50%
    }

    .joomla-pg .bg {
        background-position: 100% 70%
    }

    .biowars-section2 .bg {
        background-position: 130% 0
    }

    .johnjay-section5 .bg {
        background-position: 115% 50%
    }

    .medcpu-section4 .bg {
        background-position: 100% 100%;
        background-size: auto 90%
    }

    .offers .frame {
        padding: 0 20px
    }

    .ba-slider-holder, .pr-slider-holder {
        max-width: 1100px
    }
}

@media only screen and (max-width: 1600px) {
    .top-section .bg {
        background-position: 98% 35%;
        background-size: auto 70%
    }

    .top-section .bg.mid-align {
        background-position: 100% 60%
    }

    .logo-pg .bg.mid-align {
        background-position: 80% 50%;
        background-size: auto auto
    }

    .leon-section2 .bg.mid-align {
        background-position: 95% 60%;
        background-size: 35% auto
    }

    .btb-section5 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-position: 98% 50%;
        background-size: auto 50%
    }

    .btb-section3 .bg.mid-align, .leon-section3 .bg.mid-align {
        background-position: 95% 50%;
        background-size: auto 55%
    }

    .btb-section1 .bg.mid-align {
        background-position: 123% 25%;
        background-size: 55% auto
    }

    .medcpu-section4 .bg {
        background-position: 110% 100%;
        background-size: auto 90%
    }

    .johnjay-section1 .bg {
        background-position: 123% 50%
    }

    .johnjay-section3 .bg {
        background-position: 120% 50%;
        background-size: auto 60%
    }

    .consult-pg .bg {
        background-position: 98% 3px
    }

    .develop-pg .bg {
        background-position: 98% 50%
    }

    .develop-pg .s-left {
        width: 50%
    }

    .sitecore-pg .bg {
        background-size: auto 85%;
        background-position: 98% 40px
    }

    .top-section .bg.full-height {
        background-position: 115% 0
    }

    .seo-pg .bg {
        background-size: auto 90%;
        background-position: 90% 50%
    }

    .drupal-pg .bg, .johnjay-section5 .bg, .wp-pg .bg {
        background-position: 100% 50%
    }

    .joomla-pg .bg {
        background-position: 100% 20%
    }

    .biowars-section2 .bg {
        background-size: auto 80%;
        background-position: 150% 50%
    }

    .biowars-section3 .bg {
        background-size: auto 90%
    }

    .biowars-section4 .bg {
        background-size: auto 67%;
        background-position: 120% 50%
    }

    .biowars-section5 .bg, .top-section .bg.btm-corner {
        background-size: auto 80%;
        background-position: 140% 100%
    }

    .dance-section4 .bg {
        background-position: 100% 100%
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.7) translate(-20%, -70%);
        transform: scale(0.7) translate(-20%, -70%)
    }

    .services-wide-section-fullscreen {
        padding-left: 17px;
        padding-right: 17px
    }

    .services-wide-section-fullscreen .fwb-item {
        margin-bottom: 23px
    }

    .services-wide-section-fullscreen .fwb-item .active-lnk::after {
        bottom: -23px
    }

    .services-wide-section-fullscreen .frame {
        max-width: 100%
    }

    .f-post {
        padding: 60px 20px 20px
    }

    .socials-box {
        padding: 0 20px
    }

    .location-subttl {
        font-size: 24px
    }

    .location-cell .loc-txt {
        width: 300px;
        padding-right: 20px
    }

    .loc-phone {
        display: block;
        margin-bottom: 10px
    }

    .loc-phone:after {
        display: none
    }

    .loc-visual {
        right: 330px
    }

    .location-cell:not(:first-child)::before {
        left: 6%
    }

    .location-ttl span:after, .location-ttl span:before {
        width: 39%
    }

    .tab-slider .pull-controls {
        width: 95%
    }

    .equal-cols img, .pr-slider .pull-controls, .slider-section .mix-slider .pull-controls {
        padding: 0 10px
    }

    .ba-slider .pull-controls, .pr-slider .pull-controls, .slider-section .mix-slider .pull-controls {
        width: 98%;
        margin: 0 1%
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 70px
    }

    .frame-alt {
        padding: 0 4.7vw
    }

    .f-menu-wrapper .frame-alt {
        padding: 0 20px
    }

    .f-menu-wrapper .loc-phone {
        display: inline-block;
        margin: 0
    }

    .contact-pg .nw--inner-container {
        max-width: 100%;
        padding: 0 3vw
    }

    .contact-pg .wh-detail--wrp .wh-form-holder {
        right: 3vw
    }

    .contact-pg .ttl {
        font-size: 65px;
        letter-spacing: -2px
    }
}

@media only screen and (max-width: 1500px) {
    .gallery-space-hold {
        margin-left: -260px
    }

    .loc-visual img {
        width: 290px;
        height: auto
    }

    .loc-active .loc-visual {
        width: 290px
    }

    .location-cell .loc-txt {
        padding: 0 20px 0 0
    }

    .location-subttl {
        font-size: 22px
    }

    .loc-address {
        padding: 4px 0 6px
    }

    .location-cell:before {
        display: none
    }

    .loc-phone {
        margin-bottom: 5px
    }

    .wide-gallery-images {
        width: 600px
    }

    .widefeat-txt {
        padding-left: 580px
    }

    .widefeat-thumbs {
        width: 213px;
        padding: 33px 0 52px
    }

    .widefeat-thumbs > a {
        margin-left: 0
    }

    .wide-gallery-images .active-slide-item .slide-item-inner:before {
        display: none
    }

    .widefeat-brand {
        width: calc(100% - 537px)
    }
}

@media only screen and (max-width: 1400px) {
    .offers {
        padding: 60px 0 20px
    }

    .offers .txt-holder {
        padding-right: 15%
    }

    .offers .img-holder {
        height: 250px
    }

    .top-section .bg {
        background-size: auto 65%
    }

    .seo-pg .bg {
        background-size: auto 85%;
        background-position: 100% 50%
    }

    .top-section .bg.full-height {
        background-size: auto auto;
        background-position: 158% 0
    }

    .biowars-section4 .bg {
        background-size: auto 60%;
        background-position: 120% 50%
    }

    .medcpu-section4 .bg {
        background-position: 110% 100%;
        background-size: auto 80%
    }

    .johnjay-section1 .bg {
        background-position: 160% 50%;
        background-size: auto auto
    }

    .johnjay-section2 .bg {
        background-position: 98% 50%
    }

    .johnjay-section3 .bg {
        background-position: 120% 50%;
        background-size: auto 50%
    }

    .johnjay-section5 .bg {
        background-position: 100% 50%
    }

    .sitecore-pg .bg {
        background-size: auto 85%;
        background-position: 110% 40px
    }

    .consult-pg .bg, .develop-pg .bg {
        background-size: auto auto
    }

    .biowars-section2 .bg {
        background-position: 140% 50%
    }

    .biowars-section5 .bg, .top-section .bg.btm-corner {
        background-size: auto 65%;
        background-position: 120% 100%
    }

    .main-section .s-left .johnjay-ttl {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        margin: -141px 0 -10px -41px
    }

    .case-pg .section h2, .case-pg .top-section .s-left h2, .continue-section .PT-awards .ttl {
        font-size: 50px
    }

    .quote-section q {
        font-size: 38px
    }

    .result-list {
        font-size: 20px
    }

    .result-list span {
        font-size: 45px;
        margin-right: 10px
    }

    .result-list li {
        padding-top: 10px;
        padding-bottom: 10px
    }

    .result-list li:before {
        top: 17px
    }

    .result-list li:after {
        top: 32px
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.6) translate(-32%, -83%);
        transform: scale(0.6) translate(-32%, -83%)
    }

    .btb-section3 .bg.mid-align, .leon-section3 .bg.mid-align {
        background-size: auto 45%;
        background-position: 85% 50%
    }

    .logo-pg .bg.mid-align {
        background-position: 87% 50%
    }

    .loc-visual {
        right: 320px
    }

    .head-anim-holder .s-left, .top-section.alt-size2 .s-left {
        padding-top: 40px
    }

    .simple-slider-holder {
        max-width: calc(100% - 120px)
    }

    .simple-slider .t-holder {
        table-layout: fixed
    }

    .case-slider {
        padding: 0;
        width: calc(100% + 40px);
        max-width: calc(100% + 40px);
        margin: 0 -20px 60px
    }

    .tab-slider .t-holder {
        max-width: calc(100% - 200px)
    }

    .tab-slider.mix-slider .t-holder {
        max-width: 100%
    }

    .tab-slider:not(.case-slider):not(.mix-slider) .t-cell {
        height: 400px
    }

    .tab-slider:not(.case-slider):not(.mix-slider) .t-cell.txt, .tab-slider:not(.case-slider):not(.mix-slider) .t-cell.visual {
        width: 50%
    }

    .tab-slider:not(.case-slider) .t-cell.visual img {
        max-width: 100%
    }

    .case-slider .t-cell.visual img {
        margin-right: 0
    }

    .case-slider .t-cell .wide-mode {
        transform: scale(.7) translateX(-134px);
        display: inline-block
    }

    .case-slider .t-cell .wide-mode img {
        transform: translateX(134px)
    }

    .contact-pg .hs-sub-row {
        padding: 40px 0
    }

    .contact-pg .hs-sub-item {
        transform: scale(.8)
    }

    .contact-pg .hs-sub-row .img-wrap:not(:first-child)::before {
        left: -3%
    }

    .contact-pg .hs-sub-item {
        margin-right: 10px
    }
}

@media only screen and (max-width: 1300px) {
    .f-menu-content .fmc-list a {
        font-size: 13px;
        line-height: 2
    }

    .f-menu-content .fmc-list li {
        margin: 4px 7px 0
    }

    .f-menu-wrapper {
        font-size: 15px
    }

    .biowars-mob-slide .holder {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
        margin: 0 -60px 0 -100px
    }

    .offers h2 {
        font-size: 33px
    }

    .offers .txt-holder p {
        margin-bottom: 15px
    }

    .main-section .s-left .leon-ttl {
        margin: -80px 0 10px
    }

    .leon-quote-section q {
        margin-right: 0
    }

    .gallery-space-hold {
        margin-left: -340px
    }

    .top-section .bg.full-height {
        background-size: 80% auto;
        background-position: 200% 0
    }

    .ecommerce-pg .bg.full-height {
        background-size: auto auto;
        background-position: 400px 100%
    }

    .cr-design-pg .bg.full-height {
        background-size: 78% auto
    }

    .top-section .bg.full-height .s-left {
        height: auto;
        padding-top: 8%;
        padding-bottom: 9%
    }

    .marketing-pg .bg.full-height {
        background-size: auto auto;
        background-position: 150% 0
    }

    .marketing-pg .bg.full-height .s-left {
        padding-top: 3%;
        padding-bottom: 4%
    }

    .case-pg .frame.t-holder > .t-cell, .case-pg .top-section .s-left {
        height: 750px
    }

    .quote-section blockquote {
        padding: 0 30px 0 80px
    }

    .btb-section5 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-size: auto 40%
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.6) translate(-40%, -83%);
        transform: scale(0.6) translate(-40%, -83%)
    }

    .featured-work-fullscreen .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.7);
        transform: translate(-50%, -50%) scale(.7)
    }

    .featured-work-fullscreen .fwb-item > a:hover .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.8);
        transform: translate(-50%, -50%) scale(.8)
    }

    .f-post h6 {
        font-size: 24px
    }

    .f-post .divider {
        width: 1.5%
    }

    .f-post .txt {
        width: 60.25%;
        padding-left: 17px
    }

    .f-post .visual {
        width: 38.25%
    }

    .f-post .whitepaper-post .txt {
        padding-left: 17px
    }

    .location-area .t-holder {
        -webkit-transform: scale(.85) translateX(-9%);
        transform: scale(.85) translateX(-9%);
        margin: -10px auto -20px;
        width: 118%
    }

    .loc-address {
        font-size: 20px
    }

    .loc-visual {
        margin-top: -10px;
        -webkit-transform: translateY(-55%);
        transform: translateY(-55%)
    }

    .location-ttl span:after, .location-ttl span:before {
        width: 37%
    }

    .ba-slider-holder, .pr-slider-holder {
        max-width: 980px
    }

    .pr-slider .t-cell.visual .wide-mode {
        left: -25px
    }

    .head-anim-holder .s-left {
        height: 500px
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 65px
    }

    .sec-ttl h2, .sec-ttl h2 span.size01 {
        font-size: 55px
    }

    .head-anim .wide-mode {
        transform: scale(.9);
        display: block
    }

    .frame-alt {
        padding: 0 3.5vw
    }

    .contact-pg .wh-detail--wrp .wh--top-banner .title-wrp {
        padding-right: 52%
    }
}

@media only screen and (max-width: 1170px) {
    .feat-txt-holder {
        margin-right: 0
    }

    .top-section .bg {
        background-position: 98% 30%;
        background-size: auto 50%
    }

    .seo-pg .bg {
        background-size: auto 70%;
        background-position: 100% 50%
    }

    .medcpu-section4 .bg {
        background-position: 110% 100%;
        background-size: auto 70%
    }

    .johnjay-section5 .bg {
        background-position: 100% 50%
    }

    .johnjay-section3 .bg {
        background-position: 140% 50%
    }

    .marketing-pg .bg.full-height {
        background-position: 190% 0
    }

    .consult-pg .bg, .develop-pg .bg {
        background-size: auto 73%
    }

    .sitecore-pg .bg {
        background-position: 125% 50px;
        background-size: auto 85%
    }

    .gallery-space-hold {
        margin-left: -410px
    }

    .drag-pager {
        margin-left: 0;
        margin-right: 0
    }

    .inner-drag-pager {
        width: 87%
    }

    .inner-drag-pager:before {
        left: -7%;
        right: -7%
    }

    .biowars-section2 .bg {
        background-size: auto 60%;
        background-position: 150% 50%
    }

    .biowars-section4 .bg {
        background-size: auto 50%;
        background-position: 130% 50%
    }

    .case-pg .bg.btm-corner .s-left, .case-pg .biowars-section5 .s-left {
        width: 30%
    }

    .case-pg .dance-section6 .bg .s-left {
        width: 34%
    }

    .top-section .bg.btm-corner {
        background-size: auto 65%;
        background-position: 130% 100%
    }

    .biowars-section5 .bg {
        background-size: auto 60%;
        background-position: 140% 100%
    }

    .johnjay-section2 .bg {
        background-position: 98% 50%
    }

    .dance-section4 .bg {
        background-position: 100% 100%
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.5) translate(-50%, -106%);
        transform: scale(0.5) translate(-50%, -106%)
    }

    .btb-section3 .s-left {
        width: 35%
    }

    .btb-section3 .bg.mid-align, .leon-section3 .bg.mid-align {
        background-size: 40% auto
    }

    .logo-pg .bg.mid-align {
        background-position: 100% 50%
    }

    .socials .item {
        font-size: 20px;
        height: 63px
    }

    .socials .icn {
        margin: -2px 4px 0 0;
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    .location-area .t-holder {
        -webkit-transform: scale(.8) translateX(-13%);
        transform: scale(.8) translateX(-13%);
        margin: -19px auto -29px;
        width: 126%
    }

    .head-anim-holder .s-left, .top-section.alt-size2 .s-left {
        height: 400px;
        padding-left: 20px
    }

    .hs-sub-row {
        padding-top: 10px
    }

    .hs-sub-item {
        margin-right: 20px
    }

    .rd-box {
        margin: -85px 20px
    }

    .simple-slider .t-cell.txt {
        padding: 0 10px 0 0
    }

    .simple-slider .t-cell.visual {
        vertical-align: top
    }

    .tab-slider .t-cell.visual {
        vertical-align: middle
    }

    .case-slider .t-cell.txt {
        padding: 40px 0
    }

    .ba-slider-holder, .pr-slider-holder {
        max-width: 800px
    }

    .pr-slider .pull-controls {
        top: 300px
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 60px
    }

    .sec-ttl h2, .sec-ttl h2 span.size01 {
        font-size: 55px
    }

    .mix-slider .t-cell.txt, .mix-slider .t-cell.visual {
        padding-bottom: 20px
    }

    .same-blocks {
        padding: 0 10px
    }

    .head-anim .wide-mode {
        transform: scale(.75)
    }

    .head-anim {
        left: 48%
    }

    .f-menu-wrapper .t-cell, .f-menu-wrapper .t-holder {
        display: block;
        width: 100%;
        text-align: center;
        white-space: normal
    }

    .f-menu-content .fmc-list a {
        line-height: 14px
    }

    .f-menu-wrapper .fmc-contact {
        padding-top: 20px
    }

    .contact-pg .ttl {
        font-size: 50px
    }

    .contact-pg .wh--top-banner .descr {
        font-size: 23px
    }

    .contact-pg .hs-sub-item {
        margin: 0 -10px
    }

    .ch-call strong {
        font-size: 20px
    }

    .ch-place strong {
        font-size: 24px;
        margin-bottom: 5px;
        display: block
    }

    .nofound {
        flex-wrap: wrap
    }

    .nofound .cs-service-column {
        width: 30%;
        padding-bottom: 20px
    }

    .f-menu-content .fmc-list li {
        margin: 0 10px
    }
}

@media only screen and (max-width: 1090px) {
    .tab-slider-pager .luxury {
        transform: scale(.8)
    }

    .solutions-section .drop-holder {
        padding: 0 24px
    }

    .industry-section {
        padding: 50px 0 120px
    }

    .industry-section .frame {
        max-width: 100%;
        box-sizing: border-box;
        padding: 0 30px
    }

    .industry-section h1 {
        font-size: 45px;
        margin-bottom: 7px
    }

    .industry-section .subheading {
        font-size: 18px;
        margin-bottom: 10px
    }

    .industry-section .list {
        padding: 10px 0 0;
        font-size: 18px
    }

    .industry-section .list a {
        padding: 15px 10px
    }

    .industry-section .list a:before {
        transform: scale(.75);
        -webkit-transform: scale(0.75);
        margin-bottom: 6px
    }

    .top-section .bg.full-height {
        background-size: 100% auto;
        background-position: 300px 0
    }

    .ecommerce-pg .bg.full-height {
        background-size: auto auto;
        background-position: 300px 100%
    }

    .cr-design-pg .bg.full-height {
        background-size: 68% auto;
        background-position: 150% 0
    }

    .services-pg .bg.full-height {
        background-size: 80% auto
    }

    .marketing-pg .bg.full-height {
        background-size: auto auto;
        background-position: 400px 0
    }
}

@media only screen and (max-width: 1024px) {
    .wide-expanded-section .exp-bg .frame {
        padding: 0 10px
    }

    .offers .t-cell {
        border: none;
        background: #fafafa;
        overflow: hidden
    }

    .offers .t-cell:before {
        content: "";
        border: solid #d9dadb;
        border-width: 0 1px;
        height: 100%;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        box-sizing: border-box
    }

    .offers .img-holder {
        height: 200px
    }

    .offers .link-arrow {
        bottom: 35px
    }

    .offers .txt-holder {
        padding-bottom: 60px
    }

    .offers .txt-holder p {
        margin-bottom: 30px
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.5) translate(-61%, -106%);
        transform: scale(0.5) translate(-61%, -106%)
    }

    .infoboxes {
        padding-bottom: 60px
    }

    .magento-pg-infoboxes {
        padding-bottom: 0
    }

    .slide-section {
        padding: 80px 0 0
    }

    .result-section .frame {
        padding: 0 10px
    }

    .video-frame .sub-caption {
        font-size: 20px;
        margin-top: -35px
    }

    .video-frame .sub-caption:after {
        display: none
    }

    .back-link {
        padding-left: 20px;
        border-bottom: 1px solid #e6e8e7
    }

    .case-pg .top-section .s-left, .top-section .s-left {
        padding-left: 20px
    }

    .feat-expanded-section .exp-bg {
        background-size: 1400px auto
    }

    .feat-gallery {
        float: none;
        max-width: 657px;
        margin: 50px auto 0
    }

    .feat-gallery-thumbs {
        margin-top: 86px;
        padding: 20px 0;
        max-width: 186px;
        border: none;
        width: auto
    }

    .feat-gallery-thumbs:after {
        display: none
    }

    .feat-gallery-thumbs > a {
        max-width: 140px
    }

    .feat-gallery-thumbs > a:before {
        right: auto;
        left: -12px;
        margin-top: -9px;
        border-left: none;
        border-right: 9px solid #88ba00;
        border-top: 15px solid transparent;
        border-bottom: 15px solid transparent
    }

    .feat-gallery-thumbs > a.active, .feat-gallery-thumbs > a:hover {
        box-shadow: 0 1px #fff, -4px 4px #88ba00
    }

    .feat-txt {
        border-right: none;
        padding: 46px 46px 24px;
        max-width: 100%
    }

    .feat-gallery-images {
        float: left;
        margin-right: -46px;
        position: static
    }

    .feat-content {
        position: relative
    }

    .feat-brand {
        width: 100%;
        max-width: 100%;
        top: 4px;
        height: 132px
    }

    .feat-brand:after {
        -webkit-transform: scale(0.7) translate(-71%, -51%);
        transform: scale(.7) translate(-71%, -51%);
        margin-left: 240px
    }

    .toysrus .feat-brand:after {
        transform: scale(.65) translate(-78%, -56%)
    }

    .mmh .feat-brand:after {
        -webkit-transform: scale(0.6) translate(-71%, -81%);
        transform: scale(.6) translate(-71%, -81%)
    }

    .leon .feat-brand:after, .mem .feat-brand:after, .solil .feat-brand:after {
        -webkit-transform: scale(0.57) translate(-71%, -81%);
        transform: scale(.57) translate(-71%, -81%)
    }

    .engel .feat-brand:after {
        margin-left: 246px
    }

    .johnjay .feat-brand:after {
        margin-left: 233px
    }

    .aol .feat-brand:after {
        margin-left: 196px
    }

    .benihana .feat-brand:after, .juice .feat-brand:after {
        margin-top: -25px
    }

    .button-close {
        width: 49px;
        height: 57px
    }

    .button-close:after, .button-close:before {
        width: 33px
    }

    .feat-txt-holder {
        clear: both;
        padding: 0;
        position: static;
        max-width: 100%;
        margin-right: 0
    }

    .demo-video-box h4, .feat-section-frame h2, .infoboxes .section-title h2 {
        font-size: 45px
    }

    .infoboxes h3 {
        font-size: 28px
    }

    .infoboxes .sub-caption {
        font-size: 18px
    }

    .infoboxes .item img {
        -webkit-transform: scale(0.9);
        transform: scale(.9)
    }

    .feat-expanded-section .tab-lnk {
        display: inline-block;
        vertical-align: bottom;
        width: 31%;
        height: auto;
        max-width: 353px;
        margin: 0 6px
    }

    .home-slider-content .hs-left {
        padding-left: 20px;
        background-size: 370px auto
    }

    .hs-left .hsl-header, .hs-left .hsl-header h1 {
        font-size: 22px;
        line-height: 1.3
    }

    .hs-left .hsl-header strong {
        font-size: 45px
    }

    .hs-left .hsl-subcaption {
        padding: 10px 70px 0 0;
        line-height: 1.2
    }

    .hs-left .hsl-subcaption, .hs-left .hsl-subcaption strong {
        font-size: 16px
    }

    .hs-left .see-our-work-btn {
        margin: 30px 0
    }

    .hs-sub-row {
        padding: 20px 10px 30px;
        margin-bottom: 0
    }

    .solutions-section {
        padding: 38px 0 55px
    }

    .solutions-section h2 {
        font-size: 40px
    }

    .solutions-section h3 a {
        font-size: 20px;
        line-height: 1.1
    }

    .solutions-section .drop-holder {
        min-width: 18%
    }

    .solutions-section h3 .t-cell {
        -webkit-transform: scale(.85);
        transform: scale(.85)
    }

    .solutions-section h3 .ico {
        margin-bottom: -19px
    }

    .solutions-section .consulting .drop, .solutions-section .consulting h3:before {
        margin-left: -115px
    }

    .go-next-step {
        width: 80px;
        height: 80px;
        top: -40px
    }

    .gns-arrow {
        width: 47px;
        height: 24px
    }

    .visit-more {
        padding: 49px 0 47px
    }

    .map-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .map-section:after, .map-section:before {
        position: absolute;
        top: 0;
        left: 0;
        width: 60px;
        height: 100%;
        z-index: 10;
        content: "";
        background: 0 0
    }

    .map-section:after {
        left: auto;
        right: 0
    }

    .ec-fs-aside-img {
        display: none
    }

    .featured-work-fullscreen .expanded-mode {
        margin-left: -17px;
        margin-right: -17px
    }

    .featured-work-fullscreen .expand-close {
        right: 12px
    }

    .featured-work-fullscreen .expanded-mode .ecg-image-box {
        width: 40%
    }

    .gallery-space-hold {
        margin-left: -480px
    }

    .featured-work-fullscreen .ec-fs-descr {
        width: 60%;
        padding: 5px 20px 18px
    }

    .featured-work-fullscreen .expanded-mode .thumbnails {
        max-width: 980px;
        margin: 0 auto
    }

    .lp-mobile-swipe {
        display: block
    }

    .lp-slider-txt {
        width: 66%
    }

    .logo-benefits .lp-slider-txt, .slide-section .slider-txt-wrap {
        width: 60%
    }

    .slide-section .lp-slider-txt {
        width: 100%
    }

    .slide-section .logo-benefits {
        margin-bottom: 0
    }

    .logo-benefits .pull-left {
        left: -10px
    }

    .logo-benefits .pull-right {
        right: -20px
    }

    .logo-benefits .lp-slider-img {
        margin-right: 80px
    }

    .lb-steps, .slide-section .lb-steps li {
        font-size: 15px;
        line-height: 1.3
    }

    .slide-section .lb-steps.full ul {
        max-width: 100%;
        border-radius: 0;
        width: 100%;
        display: table;
        table-layout: fixed
    }

    .slide-section .lb-steps.full li {
        margin: 0;
        display: table-cell
    }

    .slide-section .lb-steps.full h3 {
        font-size: 15px
    }

    .logo-benefits .lb-steps li {
        max-width: 150px
    }

    .slide-section .lb-steps li {
        max-width: 190px
    }

    .slide-section .lb-steps.short li {
        max-width: 33%
    }

    .logo-benefits .lb-steps li a {
        padding: 10px
    }

    .logo-benefits .lb-steps.full li a {
        padding: 10px 0
    }

    .logo-benefits .cur-step {
        width: 150px
    }

    .easel-slider:before, .rocket-slider:before {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        content: "";
        z-index: 20
    }

    .easel-slider .bx-wrapper, .rocket-slider .bx-wrapper {
        position: relative;
        z-index: 1
    }

    .top-section .bg {
        background-position: 98% 30%;
        background-size: auto 55%
    }

    .biowars-section4 .bg {
        background-size: auto 50%;
        background-position: 120% 50%
    }

    .medcpu-section7 .bg {
        background-position: 98% 50%
    }

    .medcpu-section4 .bg {
        background-position: 120% 100%;
        background-size: auto 80%
    }

    .sitecore-pg .bg {
        background-position: 135% 50px;
        background-size: auto 85%
    }

    .case-pg .frame.t-holder > .t-cell, .case-pg .top-section .s-left {
        height: 650px
    }

    .biowars-section2 .bg {
        background-size: auto 50%;
        background-position: 130% 50%
    }

    .top-section .bg.btm-corner {
        background-size: 65% auto;
        background-position: 155% 100%
    }

    .biowars-section5 .bg {
        background-size: auto 60%;
        background-position: 155% 100%
    }

    .johnjay-section3 .bg {
        background-position: 120% 50%;
        background-size: 50% auto
    }

    .johnjay-section2 .bg {
        background-position: 98% 50%
    }

    .dance-section4 .bg {
        background-position: 100% 100%;
        background-size: auto 63%
    }

    .leon-section4 .bg {
        background-position: 120% 45%;
        background-size: auto 70%
    }

    .logo-pg .bg.mid-align {
        background-size: auto 85%
    }

    .de-blog-img {
        margin: 10px
    }

    .de-text {
        padding: 0 10px 40px
    }

    .de-blog-title {
        line-height: 28px
    }

    .de-text-frame {
        padding: 0 12px
    }

    .logo-process h2, .section-title.in-light h2 {
        font-size: 45px
    }

    .f-post .txt, .f-post .visual, .f-post-item {
        vertical-align: top
    }

    .foot-area .ttl, .location-ttl {
        font-size: 30px;
        line-height: 1.1
    }

    .location-ttl {
        margin-top: -76px
    }

    .f-post {
        padding: 40px 20px 20px
    }

    .PT-awards {
        padding-top: 43px
    }

    .PT-awards .ttl {
        font-size: 24px
    }

    .PT-awards .ttl span {
        font-size: 45px;
        padding-bottom: 0
    }

    .location-area .t-holder {
        display: block;
        -webkit-transform: none;
        transform: none;
        margin: 20px 0 0;
        width: 100%
    }

    .location-area .location-cell {
        display: table;
        width: 100%;
        margin-bottom: 40px;
        overflow: visible
    }

    .location-area .location-cell:last-child {
        margin-bottom: 0
    }

    .location-cell .loc-txt {
        padding: 0 0 0 20px;
        float: none;
        width: auto;
        vertical-align: middle;
        display: table-cell
    }

    .loc-phone, .loc-phone:after {
        display: inline-block
    }

    .location-area .loc-visual {
        margin-top: 0;
        width: 200px;
        -webkit-transform: none;
        transform: none;
        text-align: left;
        vertical-align: middle;
        position: static;
        display: table-cell
    }

    .location-area {
        padding-top: 70px
    }

    .loc-visual img {
        width: auto;
        max-width: 100%
    }

    .location-area .location-cell:not(:first-child):after {
        content: "";
        position: absolute;
        top: -20px;
        left: 0;
        width: 100%;
        height: 1px;
        background: rgba(86, 207, 255, .3)
    }

    .location-ttl span::after, .location-ttl span::before {
        width: 35%
    }

    .hs-sub-item {
        transform: scale(.8);
        margin: 0 20px 0 -30px
    }

    .head-anim-holder .s-left, .top-section.alt-size2 .s-left {
        height: auto;
        padding: 40px 20px
    }

    .head-anim-holder .s-left {
        padding-left: 0
    }

    .top-section.head-anim-holder .s-left {
        padding-right: 52%
    }

    .home-company-logos-wrapper {
        padding: 25px 0
    }

    .content-section, .dark-section, .slider-section {
        padding: 60px 20px
    }

    .sec-ttl.ad-pad {
        padding-top: 120px
    }

    .sec-ttl h2 {
        font-size: 50px;
        line-height: 1.1;
        margin: 0
    }

    .sec-ttl h2 span, .sec-ttl h2 span.size01, .simple-slider h3:not(.slide-ttl) {
        font-size: 40px
    }

    .simple-slider p.sub {
        font-size: 22px
    }

    .simple-slider .t-cell.txt {
        padding: 20px 20px 20px 0
    }

    .simple-slider .t-cell.visual {
        vertical-align: top
    }

    .case-slider {
        margin-bottom: 45px
    }

    .case-slider .t-cell.visual img {
        max-width: 100%
    }

    .case-slider .t-cell.visual {
        vertical-align: middle;
        text-align: right
    }

    .process-section .sec-ttl {
        padding-bottom: 120px
    }

    .process-section {
        padding: 0
    }

    .sec-ttl .descr {
        padding: 25px 40px
    }

    .wide-gallery-images {
        width: 470px;
        margin-right: 0
    }

    .feat-gallery {
        min-height: 650px
    }

    .feat-gallery-images .slide-item {
        height: 650px;
        overflow: hidden
    }

    .feat-gallery-images .slide-item.scroll .slide-item-inner, .feat-gallery-images .slide-item:first-child .slide-item-inner, .no-transform .slide-item-inner img, .slide-item-inner {
        max-height: 645px
    }

    .scroll-area {
        height: auto
    }

    .tab-mode {
        display: block;
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        margin-bottom: 30px
    }

    .top-section .s-left {
        font-size: 20px
    }

    .top-section .s-left .sub-ttl {
        font-size: 24px
    }

    .head-anim img {
        max-height: 107%;
        width: auto
    }

    .feat-visible-t {
        display: block
    }

    .wide-featexp-section .feat-expanded-section {
        padding-bottom: 120px
    }

    .pr-slider .t-cell.visual {
        opacity: 0;
        transition: transform .3s ease-out, opacity .6s ease-out;
        transform: translateX(100px)
    }

    .pr-slider .current .t-cell.visual {
        opacity: 1;
        transform: translateX(0)
    }

    .pr-slider .item {
        padding-top: 0
    }

    .case-slider .pull {
        top: -80px
    }

    .case-slider .t-cell {
        height: 400px
    }

    .case-slider .t-cell.txt, .case-slider .t-cell.visual {
        width: 50%;
        padding: 0 0 0 20px
    }

    .case-slider .t-cell .wide-mode {
        display: none
    }

    .tab-slider-pager:not(.visual) > a {
        padding: 0 5px
    }

    .tab-slider-pager:not(.visual) > a h3, .tab-slider-pager:not(.visual) > a span {
        font-size: 17px;
        line-height: 1.2
    }

    .widefeat-gallery.alt .widefeat-thumbs {
        position: absolute;
        height: 480px;
        width: 239px;
        top: 0;
        right: 0;
        background: 0 0
    }

    .widefeat-thumbs .mobile {
        bottom: 77px
    }

    .equal-cols .ttl {
        font-size: 35px
    }

    .equal-cols .t-cell {
        font-size: 18px
    }

    .same-blocks {
        margin: 0 -.7%
    }

    .same-blocks > div {
        width: 31.93%;
        margin: 0 .7% 1.4%
    }

    .text-content {
        padding: 0 20px
    }

    .simple-slider .slide-center {
        padding: 0 40px 60px
    }

    .submenu-section .item {
        font-size: 20px;
        min-height: 180px
    }

    .submenu-section .item img {
        opacity: .6
    }

    .head-anim {
        left: 50%
    }

    .contact-pg .wh-detail--wrp .wh--top-banner {
        padding: 40px 0
    }

    .contact-pg .hs-sub-row {
        margin-bottom: 40px
    }

    .contact-pg .hs-sub-row .img-wrap:before {
        display: none
    }

    .contact-pg .wh-detail--wrp .wh-form-holder .ch-form {
        padding-bottom: 20px
    }

    .ch-cell {
        padding-left: 50px
    }

    .ch-cell svg {
        transform: scale(.8)
    }

    .contact-pg .wh-detail--wrp {
        min-height: 795px
    }

    .ch-place {
        width: 46%
    }

    .ch-place svg {
        top: -15px
    }

    .ch-call svg {
        top: -8px
    }

    .questions-to-ask-intro {
        padding-top: 40px
    }
}

@media screen and (max-width: 1024px) and (orientation: landscape) {
    .top-section .bg.btm-corner {
        background-size: 70% auto;
        background-position: 135% 100%
    }

    .top-section .bg.mid-align {
        background-size: auto 65%
    }

    .logo-pg .bg.mid-align {
        background-position: 100% 50%;
        background-size: auto 85%
    }

    .johnjay-section3 .bg.mid-align {
        background-size: 50% auto
    }

    .biowars-section2 .bg {
        background-size: auto 65%;
        background-position: 130% 50%
    }

    .biowars-section4 .bg {
        background-position: 105% 50%
    }

    .btb-section5 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-position: 98% 50%;
        background-size: auto 40%
    }

    .leon-section2 .bg.mid-align {
        background-size: auto 50%
    }

    .btb-section3 .bg.mid-align, .leon-section3 .bg.mid-align {
        background-position: 95% 45%;
        background-size: auto 45%
    }
}

@media only screen and (max-width: 980px) {
    .tab-slider-pager .luxury {
        transform: scale(.7);
        margin: 0 -20px
    }

    .section-title.in-dark {
        padding: 0 20px
    }

    .biowars-mob-slide .holder {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        margin: 0 -80px 0 -100px
    }

    .wide-expanded-section .txt-cell {
        padding: 10px 10px 50px 0
    }

    .wide-expanded-section .brand {
        -webkit-transform: scale(0.75) translateX(-10%);
        transform: scale(.75) translateX(-10%)
    }

    .static-sublevel.top-page-panel {
        padding: 41px 5px 5px
    }

    .static-sublevel.top-page-panel .ttl {
        font-size: 38px
    }

    .static-sublevel.top-page-panel .tpp-nav .sublevel, .static-sublevel.top-page-panel .tpp-nav ul {
        width: 98.5%
    }

    .static-sublevel.top-page-panel .tpp-nav > li {
        min-width: 140px;
        margin-left: 2px
    }

    .offers .frame {
        padding: 0 20px
    }

    .offers h2 {
        font-size: 26px
    }

    .offers .txt-holder {
        padding: 4% 5% 10%;
        font-size: 16px
    }

    .btb-anim-holder {
        -webkit-transform: scale(0.4) translate(-80%, -120%);
        transform: scale(0.4) translate(-80%, -120%)
    }

    .seotr-section {
        padding: 30px 0 50px;
        height: auto
    }

    .seotr-txt {
        width: 75%;
        min-height: 260px
    }

    .seotr-txt p {
        font-size: 15px
    }

    .seotr-txt br {
        display: none
    }

    .seotr-section .frame {
        width: 100%
    }

    .seotr-graph {
        -webkit-transform: scale(0.75) translateX(-67%);
        transform: scale(0.75) translateX(-67%);
        bottom: -54px
    }

    .section02 .seotr-graph {
        bottom: -55px
    }

    .d-block-tablet {
        display: block
    }

    .slide-section .lp-slider-img {
        width: 240px;
        margin-right: 110px
    }

    .logo-benefits .lp-slider-txt, .slide-section .slider-txt-wrap {
        width: 57%
    }

    .slide-section .lp-slider-txt {
        width: 100%
    }

    .services-wide-list {
        padding-bottom: 50px
    }

    .service-wide-item {
        display: inline-block;
        width: 49%;
        padding: 25px 20px;
        box-sizing: border-box;
        vertical-align: top
    }

    .service-wide-item:last-child {
        padding-bottom: 20px
    }

    .service-wide-item .frame {
        min-width: 0
    }

    .service-wide-item h2 {
        font-size: 28px;
        margin: 0 -15px 15px;
        white-space: nowrap
    }

    .sw-description {
        font-size: 15px;
        line-height: 1.6;
        padding: 0 15px 20px;
        width: 100%;
        display: block;
        text-align: center
    }

    .sw-description p {
        min-height: 96px
    }

    .service-wide-item:nth-child(4) .sw-description p, .service-wide-item:nth-child(5) .sw-description p {
        min-height: 120px
    }

    .service-wide-item .btn-simple {
        font-size: 17px
    }

    .sw-logo {
        width: 220px;
        display: block;
        margin: 0 auto
    }

    .sw-logo-hold {
        width: 220px;
        height: 220px;
        line-height: 195px
    }

    .wma-anim {
        -webkit-transform: scale(.93);
        transform: scale(.93);
        top: 65px;
        left: 76px
    }

    .service-dt-columns {
        display: block;
        width: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .bullet-service-list {
        font-size: 15px;
        padding: 60px 0 0 10px;
        display: inline-block;
        text-align: left
    }

    .bullet-service-list:after {
        -webkit-transform: rotate(0) scale(1);
        transform: rotate(0) scale(1);
        margin: 0 0 0 -142px;
        top: 0
    }

    .sw-list-col {
        display: block;
        width: 100%;
        box-sizing: border-box;
        text-align: center
    }

    .top-section .custom-list li {
        padding-bottom: 5px
    }

    .top-section .s-left .ttl, .top-section .s-left h1, .top-section .s-left h2, .top-section.alt-size .s-left h1 {
        font-size: 41px
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 55px
    }

    .sec-ttl h2, .sec-ttl h2 span.size01 {
        font-size: 50px
    }

    .case-pg .top-section sup {
        font-size: 14px
    }

    .case-pg .top-section .s-left, .top-section .s-left, .top-section.alt-size .s-left {
        font-size: 20px;
        height: auto;
        padding-top: 5%;
        padding-bottom: 6%
    }

    .sitecore-pg .bg {
        background-size: auto 90%;
        background-position: 155% 50px
    }

    .header {
        padding-left: 10px;
        padding-right: 10px
    }

    .logo a {
        width: 236px;
        height: 40px;
        background: url("../images/logo-tablet.png") no-repeat
    }

    
        
        
    

    .h-animated .nav .p-box {
        display: none
    }

    .sc-bubble ul {
        margin-top: 0
    }

    .occ-columns .occc-column {
        padding-right: 0
    }

    .obc-columns {
        width: 93%;
        margin: 0 auto
    }

    .flex-direction-nav {
        display: none
    }

    .case-studies-section, .cs-block.cs-block-single, .cs-wide-section, .text-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .cs-block.cs-block-single {
        padding-top: 30px
    }

    .page-navigation {
        margin-left: 26px;
        margin-right: 26px
    }

    .page-intro-block, .page-intro-center {
        margin-left: 22px;
        margin-right: 22px
    }

    .services-wide-section, .single-text-section {
        padding-left: 22px;
        padding-right: 22px
    }

    .services-wide-list, .slide-section {
        padding-left: 0;
        padding-right: 0
    }

    .blue-box-inner .ttl, .blue-box-inner h4, .text-section .blue-box-inner h4 {
        margin-right: 15px
    }

    .whitepaper-descript, .whitepaper-img, .whitepapers-section h2 {
        width: 48%
    }

    .strategy-consult-list {
        padding-left: 0;
        padding-right: 0
    }

    .strategy-consult-item {
        padding-left: 22px;
        padding-right: 22px
    }

    .ow-items {
        width: 100%
    }

    .ow-item {
        width: 30%;
        margin: 0 8px 30px
    }

    .video-production-section .ow-item {
        margin-right: 7px
    }

    .about-main-logo {
        width: 100%
    }

    .details-columns {
        padding-left: 26px;
        padding-right: 26px
    }

    .float-panel {
        display: none !important
    }

    .page-intro-narrow {
        padding-left: 0;
        padding-right: 0
    }

    .testimonial-frame .frame {
        padding-left: 22px;
        padding-right: 22px
    }

    .at-item {
        width: 44%
    }

    .at-item:nth-child(2n) {
        margin-left: 70px
    }

    .at-item .ti-author-content {
        clear: both;
        padding-top: 16px
    }

    .industries-intro-block .intro-fl-image {
        max-width: 358px;
        margin-top: -84px
    }

    .demo-reel-block, .featured-work-block, .industry-recognition-wide-section, .testimonials-wide-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .ourwork-pg .demo-reel-block {
        padding: 0
    }

    .rank-section .rs-box, .rq-logos-box {
        margin-right: 26px;
        width: 43%
    }

    .whitepapers-holder .wh-section-1, .whitepapers-holder .wh-section-2, .whitepapers-holder .wh-section-3 {
        padding-left: 26px;
        padding-right: 26px
    }

    .wh-top .page-intro-title {
        font-size: 40px
    }

    .wh-date {
        font-size: 24px
    }

    .wh-time {
        font-size: 17px
    }

    .webinars-holder .whf-title span {
        font-size: 30px
    }

    .webinars-holder .whf-title strong {
        font-size: 40px;
        margin-top: -6px
    }

    .sample-text-section .st-add-section .st-column {
        font-size: 16px;
        line-height: 20px
    }

    .sample-text-section .st-add-section h3 {
        font-size: 30px
    }

    .sample-text-section {
        padding-bottom: 50px
    }

    .join-us-form-holder .jb-1, .join-us-form-holder .jb-2 {
        padding-left: 40px;
        padding-right: 25px
    }

    .vs-holder {
        padding-left: 26px;
        padding-right: 26px
    }

    .video-section .wide-video-holder {
        margin-left: 0;
        margin-right: 0
    }

    .video-presentation-section .see-all-large, .wide-video-holder {
        margin-left: 26px;
        margin-right: 26px
    }

    .obtained-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .fwb-row .fwb-item {
        width: 32%
    }

    .demo-reel-block .drb-content h3 {
        max-width: 93%
    }

    .page-navigation a:hover, .prev-link:hover {
        color: #009ddc
    }

    .page-navigation a:focus, .prev-link:focus {
        color: #90C404
    }

    .ficc-twitter .direction-follow-btn {
        padding-right: 30px
    }

    .holder-404 {
        padding-left: 14px;
        padding-right: 14px
    }

    .saic-columns {
        width: 93%;
        margin-right: auto;
        margin-left: auto
    }

    .team-fixed-switcher {
        display: none
    }

    .text-columns {
        padding-left: 14px;
        padding-right: 14px
    }

    .steps-contents {
        margin-left: 26px;
        margin-right: 26px;
        width: auto
    }

    .step-content {
        padding-left: 26px;
        padding-right: 26px
    }

    .steps-controls {
        text-align: center;
        padding: 0
    }

    .steps-controls ul li {
        display: inline-block;
        float: none
    }

    .steps-controls li.sep {
        position: relative;
        top: -10px
    }

    .steps-controls li.sep span {
        width: 90px
    }

    .video-presentation-section .see-all-large {
        margin-left: 0;
        margin-right: 0
    }

    .extra-text-section {
        padding-left: 26px;
        padding-right: 26px
    }

    #slider_full-width {
        margin-left: 26px;
        margin-right: 26px;
        width: auto
    }

    #button_container .btn-simple-blue {
        margin-bottom: 10px
    }

    .phase-section .c-section-title, .phase-slider-holder {
        padding-left: 22px;
        padding-right: 22px
    }

    .psc-lead {
        padding: 0 150px 35px
    }

    .psc-text {
        padding: 40px 100px
    }

    .tps__1 .psn-item a {
        font-size: 25px
    }

    .pb80 {
        padding-bottom: 80px
    }

    .raq-logos-section {
        padding: 50px 0 0
    }

    .raq-logos-section .raq-logo-item {
        width: 50%;
        margin-bottom: 40px
    }

    .benefits-section {
        padding-left: 22px;
        padding-right: 22px
    }

    .benefits-section .bs-item {
        width: 33.33%
    }

    .page-team-bg {
        margin-right: 0;
        margin-left: 0
    }

    .job-section {
        padding-left: 22px;
        padding-right: 22px
    }

    .pib__1 p {
        padding-right: 55%
    }

    .pib__1 .page-navigation-float {
        margin-left: 0
    }

    .rs-blocks .rs-block, .rs-blocks-alt .rs-block, .rs-blocks-alt .rs-block:first-child, .rs-blocks-alt .rs-block:last-child, .rs-blocks-diff .rs-block, .rs-blocks-diff .rs-block:first-child {
        width: 50%;
        margin-bottom: 20px
    }

    .rs-blocks-wide .rs-block {
        width: 100%;
        margin-bottom: 0
    }

    .rs-items .rs-item {
        float: none;
        margin: 0 auto 100px
    }

    .rs-items .rs-item:nth-child(2) {
        margin: 0 auto 150px
    }

    .rs-items .rs-item:last-child {
        margin: 0 auto
    }

    .rs-blocks {
        padding-top: 30px;
        padding-bottom: 0
    }

    .rs-blocks-alt {
        padding-bottom: 30px
    }

    .rs-title {
        margin-bottom: 14px
    }

    .stat-box {
        padding-top: 0
    }

    .chart-description, .stat-box .st-item {
        padding-left: 26px;
        padding-right: 26px
    }

    .stat-box .sti-line span {
        float: none;
        display: block;
        position: relative;
        color: #333
    }

    .stat-box .sti-line span em {
        position: absolute;
        right: -50px;
        width: 35px;
        text-align: left
    }

    .stat-box.st_block .sti-line span em {
        right: 0;
        color: #fff
    }

    .stat-box.st_img {
        padding: 20px 5px 40px
    }

    .search-container .sc-bottom .frame, .search-container .sc-middle .frame, .search-container .sc-top .frame {
        padding-left: 26px;
        padding-right: 26px
    }

    .search-container #cse-search-box .google-search-container {
        width: 96.56538969616909%
    }

    .fvs-box h4 {
        font-size: 38px
    }

    .fvs-thumb-descr {
        font-size: 15px
    }

    .employees-testim .note {
        padding-bottom: 30px
    }

    .categories-testim {
        padding: 0
    }

    .categories-testim > li {
        padding: 30px 0 100px
    }

    .categories-testim .item.frame {
        width: auto;
        margin: 0 60px;
        background: 0 0;
        top: 0;
        padding: 0
    }

    .categories-testim .ico-category {
        position: static;
        display: inline-block;
        vertical-align: middle;
        max-width: 100px
    }

    .categories-testim .title-category {
        position: static;
        display: inline-block;
        vertical-align: middle;
        height: auto;
        width: auto;
        margin-left: 5px
    }

    .categories-testim .title-category span {
        position: static;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    .categories-testim .person-txt {
        margin: 20px 0 0;
        border-radius: 10px
    }

    .categories-testim .person-photo {
        bottom: -62px
    }

    .choose-agency {
        padding: 40px 0 20px
    }

    .choose-agency-cont {
        margin: 140px 10px 0
    }

    .choose-agency-cont .tabs-cont {
        margin-right: 95px
    }

    .choose-agency-cont h3 {
        height: 70px;
        font-size: 18px;
        top: -106px
    }

    .choose-agency-cont .left {
        margin: 0 27px 49px 0
    }

    .choose-agency-cont .left-sub {
        font: 22px/28px roboto-bold-webfont, sans-serif;
        padding: 36px 17px 0 24px;
        width: 246px
    }

    .choose-agency-cont .right {
        right: 15px;
        top: 20px;
        margin: 0;
        max-width: 200px
    }

    .choose-agency-cont .cont {
        padding: 25px 130px 25px 0;
        font-size: 15px;
        line-height: 24px
    }

    .featured-work-fullscreen .expanded-mode {
        margin-left: -48px;
        margin-right: -48px
    }

    .wvs-play-video {
        width: 110px;
        height: 110px
    }

    .wvs-play-video:before {
        margin-left: 38px;
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    .top-section .bg {
        background-position: 98% 40%;
        background-size: 44% auto
    }

    .dance-section4 .bg {
        background-position: 100% 100%;
        background-size: auto 55%
    }

    .medcpu-section4 .bg {
        background-position: 130% 100%;
        background-size: auto 70%
    }

    .medcpu-section7 .bg {
        background-size: 37% auto
    }

    .case-pg .section h2, .case-pg .top-section .s-left h2, .continue-section .PT-awards .ttl, .quote-section q {
        font-size: 41px
    }

    .biowars-ttl {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        left: -145px;
        top: -229px
    }

    .main-section .s-left .btb-ttl, .main-section .s-left .dance-ttl, .main-section .s-left .leon-ttl, .main-section .s-left .medcpu-ttl {
        margin: -30px -50px 20px;
        -webkit-transform: scale(0.75);
        transform: scale(0.75)
    }

    .main-section .s-left .leon-ttl {
        margin: -90px -60px 20px
    }

    .main-section .s-left .dance-ttl {
        margin: -70px -65px 20px
    }

    .case-pg .btb-section1 .ttl-box {
        top: -150px
    }

    .main-section .s-left .btb-ttl {
        margin: 0 -62px
    }

    .case-pg .frame.t-holder > .t-cell, .case-pg .top-section .s-left {
        height: 500px
    }

    .case-pg .medcpu-section3 .s-left {
        width: 43%
    }

    .quote-section blockquote {
        padding: 50px 80px 50px 100px
    }

    .biowars-section1 .bg {
        background-size: 74% auto
    }

    .top-section .bg.btm-corner {
        background-size: auto 60%;
        background-position: 150% 100%
    }

    .biowars-section5 .bg {
        background-size: auto 55%;
        background-position: 150% 100%
    }

    .johnjay-section2 .bg {
        background-position: 98% 50%
    }

    .leon-quote-section q {
        font-size: 36px
    }

    .btb-section5 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-size: auto 30%;
        background-position: 105% 50%
    }

    .featured-work-fullscreen .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.45);
        transform: translate(-50%, -50%) scale(.45)
    }

    .featured-work-fullscreen .fwb-item > a:hover .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.55);
        transform: translate(-50%, -50%) scale(.55)
    }

    .circle-slider {
        font-size: 16px;
        left: 0
    }

    .circle-slider h2 {
        font-size: 22px
    }

    .circle-slider p {
        margin-bottom: 10px
    }

    .circle-slider .t-cell {
        height: 251px
    }

    .circle-slider .txt {
        margin: 60px 0 0;
        width: 251px
    }

    .circle-slider .pull-controls {
        width: 251px
    }

    #pull-left, #pull-right {
        bottom: 230px
    }

    #pull-right {
        right: 15px
    }

    #pull-left {
        left: 10px
    }

    .circle-slider img {
        left: 40px;
        height: 90%;
        width: auto
    }

    .socials .item {
        font-size: 16px;
        line-height: 1.9;
        height: 50px
    }

    .socials .icn {
        margin: 2px -3px 0 0;
        -webkit-transform: scale(0.6);
        transform: scale(0.6)
    }

    .socials .soc-fb .icn {
        margin: 0
    }

    .f-menu-content .fmc-list {
        float: none;
        text-align: center
    }

    .f-menu-content .fmc-list li {
        display: inline;
        float: none;
        white-space: nowrap
    }

    .fmc-copyright {
        float: none;
        text-align: center
    }

    .fmc-copyright .mobile-sep {
        display: block;
        height: 10px
    }

    .hs-sub-item {
        transform: scale(.7);
        margin: 0 1px 0 -45px
    }

    .home-company-logos-content li {
        margin: 0 1.7%
    }

    .rd-box {
        padding: 52px 20px 35px
    }

    .rd-box .txt {
        font-size: 30px;
        padding-bottom: 25px
    }

    .rd-box .btn-simple {
        margin-left: 20px
    }

    .ba-slider .pull-controls, .mix-slider .pull-controls {
        display: none
    }

    .pr-slider-holder {
        max-width: 700px
    }

    .pr-slider .t-cell.txt {
        padding: 0 20px 0 0
    }

    .simple-slider .t-cell.visual {
        padding-top: 0
    }

    .case-slider .t-cell.visual {
        padding-top: 40px
    }

    .pr-slider-pager {
        margin: -135px auto 40px
    }

    .pr-txt {
        font-size: 17px
    }

    .pr-current-tab {
        top: 61px
    }

    .tabs-txt {
        padding: 30px
    }

    .wide-tabs-txt {
        font-size: 18px;
        line-height: 1.5
    }

    .tabs-txt h3 {
        font-size: 25px;
        line-height: 1.1
    }

    .wide-tabs-visual .item .ttl {
        font-size: 22px
    }

    .wide-tabs-visual .item > a {
        font: 22px/1.2 roboto-medium-webfont, sans-serif;
        height: 125px;
        padding: 0 15px 0 120px
    }

    .wide-tabs-visual .ico {
        width: 70px;
        height: 70px;
        margin-top: -35px;
        left: 25px
    }

    .wide-tabs-visual .ico svg {
        width: 50px;
        height: 52px
    }

    .wide-tabs-step {
        height: 125px
    }

    .wide-tabs-txt .item {
        padding: 30px 10px
    }

    .wide-tabs-txt .scroll-content {
        height: 257px
    }

    .wide-tabs-txt .scroll-content-size01 {
        height: 383px
    }

    .submenu-section .item {
        font-size: 18px
    }

    .content_holder .contact-pg .wh-detail--wrp .wh--top-banner .title-wrp {
        padding-right: 0;
        text-align: center
    }

    .contact-pg .hs-sub-row .nw--inner-container {
        padding: 0 40px 60px;
        text-align: center
    }

    .contact-pg .wh-detail--wrp .wh-form-holder {
        position: relative;
        right: 0;
        top: -100px;
        width: 100%;
        max-width: 80vw;
        margin: 0 auto -40px
    }

    .contact-pg .wh-detail--wrp .wh-infobox {
        width: 80vw;
        margin: 0 auto;
        float: none
    }

    .ch-cell {
        width: 49%
    }

    .contact-pg .wh-detail--wrp {
        min-height: 0;
        padding-bottom: 60px
    }
}

@media only screen and (max-width: 900px) {
    .tab-slider-pager .large {
        transform: scale(.7)
    }

    .tab-slider-pager .kosher.large {
        margin: 5px -19px 0
    }

    .sitecore-pg .bg {
        background-size: 44% auto;
        background-position: 110% 40%
    }

    .demo-reel-block .drb-content h3 {
        max-width: 90%
    }

    .occ-2-items-columns {
        text-align: center
    }

    .occ-2-items-columns .occc-column, .occ-2-items-columns .occc-column-1, .occ-2-items-columns .occc-column-2 {
        float: none;
        display: inline-block;
        vertical-align: top;
        margin: 0;
        width: 44%
    }

    .tps__1 .psn-item a {
        font-size: 22px
    }

    .sub-video-boxes {
        padding-left: .6%;
        padding-right: .6%;
        margin-top: -60px
    }

    .sv-box {
        padding: 20px
    }

    .fvs-thumbs {
        margin: 0
    }

    .fvs-box {
        margin: 0 .6%;
        width: 31.8%
    }

    .gallery-space-hold {
        margin-left: -570px
    }

    .full-services-section {
        padding: 70px 10px 60px
    }

    .full-services-section h2 {
        font-size: 45px;
        margin: 0 0 25px
    }

    .services-tabs {
        margin: 0 0 15px
    }

    .services-tabs:before {
        top: 59px;
        height: 18px
    }

    .services-tabs li {
        padding-top: 150px
    }

    .fss-step-number {
        width: 140px;
        height: 140px
    }

    .fss-step-number strong {
        width: 122px;
        height: 122px
    }

    .active .fss-step-number strong {
        width: 140px;
        height: 140px
    }

    .fss-step-number strong:after, li:nth-child(2) .fss-step-number strong:before {
        height: 18px
    }

    .fss-step-number em {
        width: 94px;
        height: 94px;
        line-height: 94px
    }

    .active .fss-step-number em {
        width: 115px;
        height: 115px;
        line-height: 115px
    }

    .progress-filler {
        margin: 0 0 36px
    }

    .progress-filler, .progress-indicator {
        height: 14px
    }

    .progress-active {
        margin-left: -18px;
        border-left: 18px solid transparent;
        border-right: 18px solid transparent;
        border-top: 13px solid #88ba00
    }

    .tab-text {
        font-size: 20px;
        padding: 0
    }

    .tabs-content {
        padding: 0 17px
    }

    .tabs-column, .tabs-column:first-child {
        width: 100%;
        float: none;
        padding: 0
    }

    .tabs-content p {
        margin: 0 0 20px
    }

    .services-wide-section-fullscreen {
        padding-top: 43px;
        padding-bottom: 10px
    }

    .logo-pg .bg.mid-align {
        background-size: auto 70%
    }

    .socials .item {
        font-size: 16px;
        line-height: 1.9;
        height: 50px
    }

    .socials .icn {
        margin: 2px -3px 0 0;
        -webkit-transform: scale(0.6);
        transform: scale(0.6)
    }

    .socials .soc-fb .icn {
        margin: 0
    }

    .f-menu-content .fmc-list {
        float: none;
        text-align: center
    }

    .f-menu-content .fmc-list li {
        display: inline;
        float: none;
        white-space: nowrap
    }

    .fmc-copyright .mobile-sep {
        display: block;
        height: 10px
    }
}

@media only screen and (max-width: 880px) {
    .lb-steps.short ul {
        min-width: 100%
    }

    .btb-section5 .bg.mid-align, .leon-section5 .bg.mid-align {
        background-size: auto 42%;
        background-position: 97% 50%
    }

    .seotr-txt {
        width: 85%
    }

    .seotr-graph {
        -webkit-transform: scale(0.76) translateX(-66%);
        transform: scale(0.76) translateX(-66%);
        bottom: -54px
    }

    .section02 .seotr-graph {
        bottom: -50px
    }

    .seo-traffic-section {
        padding-bottom: 70px
    }

    .slide-section .lb-steps h3 {
        font-size: 13px
    }

    .result-section h3 {
        font-size: 23px;
        top: -16px;
        height: 25px
    }

    .result-section h3:before {
        top: 14px
    }

    .result-box h3 + p {
        font-size: 16px
    }

    .result-box, .rs-gen-blocks-two {
        margin-top: 50px
    }

    .rs-blocks .rs-block span {
        font-size: 50px
    }

    .rs-gen-blocks-two .rs-blocks {
        padding-bottom: 10px
    }

    .logo-benefits .lp-slider-txt, .slide-section .slider-txt-wrap {
        width: 50%
    }

    .slide-section .lp-slider-txt {
        width: 100%
    }

    .wrapper {
        
    }

    .header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 99999;
        padding: 10px 0 9px;
        border-width: 3px 0 0
    }

    .header .frame {
        position: static
    }

    .logo {
        position: static;
        background: none !important
    }

    .mm-opening .logo {
        margin-left: 22px
    }

    .header .nav > li {
        position: static
    }

    .additional-nav, .header .nav a, .header .nav > li > a, .separate-border {
        display: none
    }

    .header .nav li .btn-h-request {
        position: absolute;
        top: 13px;
        right: 12px;
        display: inline-block;
        margin-top: 0
    }

    .header .nav li .link-arrow {
        position: absolute;
        top: 10px;
        right: 8px;
        display: inline-block;
        margin-top: 0;
        padding-top: 5px;
        padding-bottom: 6px;
        padding-left: 8px;
        font-size: 17px
    }

    .header .nav .link-more {
        display: block;
        position: absolute;
        top: 11px;
        right: 0;
        padding: 10px 26px 8px 13px !important;
        font: 15px/1.2 roboto-black-webfont, Arial, sans-serif;
        border-left: 1px solid #dadada
    }

    .head-top {
        margin-right: 197px;
        padding-top: 0
    }

    .ht-simplemenu .phone {
        padding: 8px 0 4px 13px;
        font-size: 17px;
        line-height: 1.2;
        font-weight: 400;
        margin-top: 0
    }

    .ht-simplemenu .phone em {
        width: 27px;
        height: 27px;
        margin-top: -4px;
        margin-right: 2px;
        background-position: -156px -1px
    }

    .ht-simplemenu .search {
        width: 29px;
        height: 29px;
        background-position: -125px 0;
        margin: 4px 0 0;
        position: relative
    }

    .hm-advancedmenu {
        padding: 0
    }

    .header .open-m-menu {
        visibility: visible
    }

    .menu-title {
        border-width: 3px 0 0
    }

    .search-line {
        margin-top: -1px;
        margin-left: 0;
        padding-bottom: 2px
    }

    .search-active {
        padding-bottom: 50px !important
    }

    .search-field {
        right: 0;
        bottom: 9px;
        padding: 7px 22px 0;
        position: absolute;
        display: none;
        border-top: 1px solid #dadada
    }

    .search-active .search-field {
        display: block;
        width: 100%
    }

    .search-field input[type=text] {
        width: 360px
    }

    .ht-simplemenu .search:hover {
        background-position: -514px -284px
    }

    .case-studies-section {
        padding-bottom: 92px
    }

    .cs-block {
        padding-top: 24px;
        padding-bottom: 24px
    }

    .cs-site-screen {
        max-width: 335px
    }

    .cs-thumb {
        margin-right: 42px
    }

    .cs-thumb-right {
        margin-right: 0;
        margin-left: 42px
    }

    .view-more {
        font-size: 20px
    }

    .view-more:after {
        font-size: 36px;
        margin-top: -11px
    }

    .cs-block-single {
        padding-top: 0
    }

    .cs-block h1 {
        font-size: 25px;
        margin: 0 0 12px
    }

    .cs-block-single .cs-thumb {
        margin-top: -36px
    }

    .section-title {
        margin-bottom: 48px
    }

    .infoboxes .section-title {
        margin-bottom: 20px
    }

    .preview-aside {
        width: 255px;
        padding: 0 5px 0 0
    }

    .frame-section-title h2, .h-h2, .section-title h2 {
        margin: 0 0 12px
    }

    .cs-graphs img:first-child {
        margin-top: 0
    }

    .cs-service-column {
        padding-left: 15px;
        padding-right: 15px
    }

    .service-logo {
        width: 100%
    }

    .page-intro-block {
        padding-top: 28px
    }

    .page-intro-text {
        font-size: 22px;
        padding-top: 28px
    }

    .page-intro-image {
        width: 354px;
        padding-right: 0
    }

    .page-intro-image img {
        width: 100%
    }

    .blue-box-inner .ttl {
        white-space: normal
    }

    .blue-box-inner .ttl span {
        white-space: nowrap
    }

    .blue-middle-box .btn-simple {
        clear: both;
        display: block;
        max-width: 215px;
        margin: 18px auto -48px
    }

    .whitepapers-section h2 {
        font-size: 40px
    }

    .whitepaper-descript p {
        margin: 0 0 16px
    }

    .whitepaper-subtext {
        padding-top: 16px
    }

    .whitepaper-subtext p {
        margin: 0 0 24px
    }

    .see-all-large {
        margin-top: 46px
    }

    .whitepapers-section {
        padding-top: 76px;
        padding-bottom: 94px
    }

    .whitepapers-section .blue-middle-box {
        margin-top: -135px
    }

    .certify-item, .certify-item:first-child {
        text-align: center;
        padding-left: 40px;
        padding-right: 40px
    }

    .certify-item img {
        float: none;
        margin-bottom: 20px
    }

    .team-slider {
        max-width: 608px
    }

    .branch-img img {
        width: 100%;
        max-width: 320px
    }

    .branch-img:after {
        width: 312px;
        height: 11px;
        background-position: 0 -14px;
        margin-left: -156px
    }

    .branch-item {
        padding: 0 22px
    }

    .branch-item h2 {
        font-size: 45px;
        margin: 0 0 22px
    }

    .paging-inline .pag-next-link, .paging-inline .pag-prev-link {
        margin: 0 16px
    }

    .dif-logos-list {
        max-width: 760px;
        padding: 0 16px;
        margin: 0 auto
    }

    .dif-logos-list li {
        width: 23%;
        height: 174px;
        line-height: 174px
    }

    .logos-three-per-row li {
        width: 31%;
        height: 230px;
        line-height: 230px
    }

    .dif-logos-list img {
        max-width: 90%
    }

    .intro-sample-image {
        width: 44%
    }

    .branch-item-dif .branch-img img {
        max-width: 230px
    }

    .branch-item-dif {
        padding-top: 50px
    }

    .sample-right-img {
        width: 46%
    }

    .fancy-list-two {
        font-size: 14px
    }

    .fancy-list-two .fl-item {
        padding-left: 36px
    }

    .testimonial-hidden-row .frame {
        padding-left: 16px;
        padding-right: 16px
    }

    .testimonial-hidden-row h4 {
        padding-right: 70px
    }

    .header .nav > li.active:before, .top-page-panel {
        display: none
    }

    .before-and-after-wrapper .frame, .page-title .frame, .text-section .frame {
        padding-left: 26px;
        padding-right: 26px
    }

    .frame.blue-middle-box, .text-section.ts__1 .frame, .text-section.ts__2 .frame {
        padding-left: 0;
        padding-right: 0
    }

    .page-cs-wide-section .fwb-row > .frame {
        padding: 0
    }

    .demo-reel-block .drb-content h3 {
        padding-right: 90px
    }

    .testimonials-items .testimonial {
        float: none;
        width: auto;
        padding-left: 50px;
        padding-right: 50px;
        margin-bottom: 58px
    }

    .testimonial .ti-author {
        padding-right: 67px
    }

    .intro-fl-image-holder .prev-link-holder a span {
        display: none
    }

    .contact-list li {
        padding-right: 30px
    }

    .rank-section, .what-you-get-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .wyg-form-box {
        left: 0
    }

    .rank-section .rs-box {
        margin-right: 0;
        width: 43%;
        font-size: 15px
    }

    .rank-section .rs-box img {
        margin-right: 10px
    }

    .extra-wh-section-1 {
        padding-top: 0
    }

    .wh-presses {
        padding-top: 85px
    }

    .wh-press img {
        float: none;
        display: block;
        margin: -70px auto 0
    }

    .wh-press .whp-content {
        padding-left: 30px;
        padding-right: 30px;
        text-align: center
    }

    .simple-header .addr {
        display: none
    }

    .simple-header .head-r-side {
        padding-top: 0
    }

    .simple-header .sh-hide {
        display: inline
    }

    .vs-holder .vsh-box {
        width: 46%;
        margin-right: 0
    }

    .vs-holder .vsh-box:nth-child(2n) {
        margin-left: 8%
    }

    .vs-holder-square .vsh-box {
        width: 49%;
        margin-right: 2%;
        margin-left: 0
    }

    .vs-holder-square .vsh-box:nth-child(2n) {
        margin-right: 0;
        margin-left: 0
    }

    .vs-holder .vsh-description {
        line-height: 21px
    }

    .fwb-row .fwb-item {
        width: 31.8%
    }

    .steps-controls li.sep span {
        width: 70px
    }

    #slider_full-width .step-content h3 {
        font-size: 32px
    }

    .psc-lead {
        padding: 0 60px 35px
    }

    .psc-item .last, .psc-text {
        padding: 40px 80px
    }

    .ps-nav .psn-item a {
        font-size: 30px
    }

    .three-phase-section .phase-slider-holder .step2 {
        left: 59%
    }

    .tps__1 .psn-item a {
        font-size: 25px;
        padding-left: 15px;
        padding-right: 15px
    }

    .lp-slider-txt {
        width: 64%
    }

    .industry-section h1 {
        font-size: 43px
    }

    .industry-section .list {
        font-size: 16px
    }

    .industry-section .frame {
        padding: 0 20px
    }

    .industry-expand-list {
        padding: 15px
    }

    .industry-expand-list li {
        width: 48%
    }

    .industry-section .list a {
        padding: 12px 6px
    }

    .industry-section .list a:before {
        margin-bottom: 4px;
        -webkit-transform: scale(0.65);
        transform: scale(.65)
    }

    .case-pg .section {
        display: table;
        width: 100%
    }

    .medcpu-section4 .bg {
        background-position: 105% 100%
    }

    .biowars-section5 .bg, .top-section .bg.btm-corner {
        background-size: auto 80%;
        background-position: 110% 100%
    }

    .case-pg .btb-section1 .ttl-box {
        top: -60px
    }

    .btb-anim-holder {
        display: none
    }

    .btb-section2 .cover .s-left {
        width: 35%
    }

    .case-pg .top-section.btb-section2 .bg.cover {
        background-image: url("../images/case-studies/btb/bg-section02-m.jpg");
        background-position: 100% 50% !important;
        background-size: auto auto !important
    }

    .home-company-logos-content li {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin: 0 .7%
    }

    .pr-slider-holder {
        max-width: 650px
    }

    .tabs-txt {
        width: 59.5%;
        padding: 20px;
        font-size: 16px
    }

    .tabs-visual .ico {
        left: 15px
    }

    .tabs-visual .item > a {
        font-size: 20px;
        padding: 0 15px 0 100px
    }

    .tabs-visual {
        width: 40%
    }

    .same-blocks {
        margin: 0 -2%
    }

    .same-blocks > div {
        width: 46%;
        margin: 0 2% 4%
    }

    .data-table .notes td, .data-table td.first {
        padding: 3px 20px 7px;
        font: 16px roboto-medium-webfont, sans-serif
    }

    .data-table th {
        font: 18px roboto-medium-webfont, sans-serif
    }

    .data-table .notes td {
        padding: 10px 15px
    }

    .data-table .notes td:not(.first) {
        font: 14px roboto-light-webfont, sans-serif
    }

    .tabs-txt .unit h3 {
        font: 24px roboto-medium-webfont, sans-serif
    }

    .tabs-txt .unit li:before {
        top: 10px
    }

    .tabs-txt .unit li:after {
        top: 16px
    }

    .tabs-txt .unit li {
        font-size: 18px;
        line-height: 1.3;
        padding: 10px 10px 10px 50px
    }

    .tabs-txt .unit {
        padding: 20px 0 25px
    }

    .tabs-txt .unit:last-child {
        padding-bottom: 0
    }

    .wide-tabs-txt, .wide-tabs-visual {
        width: 50%
    }
}

@media only screen and (max-width: 830px) {
    .top-section .bg {
        background-position: 105% 30%
    }

    .johnjay-section2 .bg {
        background-position: 98% 50%
    }

    .top-section .bg.full-height .s-left {
        padding-top: 3%;
        padding-bottom: 4%
    }

    .consult-pg .bg, .develop-pg .bg {
        background-position: 98% 40%
    }

    .demo-reel-block .drb-content h3 {
        max-width: 91%;
        padding-right: 84px;
        font-size: 32px;
        line-height: 38px
    }

    .ti-ibm {
        width: 114px
    }

    .ti-bbb {
        width: 124px
    }

    .ti-gsa {
        width: 90px
    }

    .ti-gp, .ti-norton {
        width: 124px
    }

    .before-and-after-wrapper .frame {
        padding-left: 0;
        padding-right: 0
    }

    .extra-text-section h1, .single-text-section h1 {
        font-size: 32px
    }

    .steps-controls {
        padding-left: 26px;
        padding-right: 26px
    }

    .steps-controls li.sep:nth-child(6) {
        width: 100%
    }

    .steps-controls li.sep:nth-child(6) span {
        display: none
    }

    .steps-controls .active {
        background: 0 0
    }

    .ps-nav .psn-item a {
        font-size: 24px
    }

    .ps-content {
        padding-left: 20px;
        padding-right: 20px
    }

    .three-phase-section .ps-nav .psn-item a, .three-phase-section .ps-nav .psn-item a span {
        font-size: 25px
    }

    .three-phase-section .ps-nav .psn-item {
        height: 210px
    }

    .three-phase-section .ps-content {
        margin-top: -165px
    }

    .tps__1 .psn-item a {
        font-size: 23px
    }

    .lp-slider-txt {
        width: 62.5%
    }

    .biowars-section2 .bg {
        background-position: 98% 40%;
        background-size: 44% auto
    }

    .biowars-section4 .bg {
        background-position: 100% 50%
    }

    .biowars-section5 .bg, .top-section .bg.btm-corner {
        background-size: auto 70%;
        background-position: 140% 100%
    }

    .top-section .bg.btm-corner {
        background-size: auto 75%;
        background-position: 120% 100%
    }

    .leon-section4 .bg {
        background-size: auto 70%;
        background-position: 120% 60%
    }

    .dance-section4 .bg {
        background-position: 100% 100%;
        background-size: auto 60%
    }

    .location-ttl span::after, .location-ttl span::before {
        width: 30%
    }

    .loc-visual img {
        max-width: 300px
    }

    .hs-sub-row {
        padding: 0 10px 10px;
        margin-right: -80px
    }

    .contact-pg .hs-sub-row {
        margin-right: 0
    }
}

@media only screen and (max-width: 810px) {
    .demo-reel-block .drb-content h3 {
        max-width: 87%
    }
}

@media only screen and (max-width: 800px) {
    .wide-expanded-section .biowars-mob-slide .ec-gallery {
        width: 380px
    }

    .biowars-mob-slide .holder {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        margin: 0 -110px 0 -140px
    }

    .hnc-features-list > li {
        width: 50%;
        margin-bottom: 30px
    }

    .hnc-simple-list li {
        width: 29%
    }

    .hnc-features-list .sc-bubble {
        padding-top: 28px
    }

    .serve-all-industries-content .saic-main-list {
        width: 95%
    }

    .serve-all-industries-content .saic-main-list li {
        padding: 0 10px
    }

    .serve-all-industries-content .saic-main-list .sep {
        padding: 0
    }

    .occ-columns .occc-column {
        background-size: 75%
    }

    .occc-column .client-photo img {
        width: 75%
    }

    .occc-column .client-photo {
        margin-bottom: -48px
    }

    .testimonial-frame .occc-column .client-photo {
        margin-bottom: -56px
    }

    .hnc-features-list {
        width: 70%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 40px
    }

    .full-services-lnk-wrapper {
        padding-bottom: 80px
    }

    .our-latest-projects-wrapper {
        padding: 100px 0
    }

    .contact-holder {
        padding-left: 26px;
        padding-right: 26px
    }

    .seminars {
        padding-left: 0;
        padding-right: 0
    }

    .contact-holder .ch-form .f-row {
        padding-left: 0
    }

    .contact-list {
        font-size: 15px;
        line-height: 22px
    }

    .contact-list .title, .hiring-box .title {
        font-size: 24px
    }

    .ch-contacts-details {
        margin-right: 0
    }

    .contact-holder .frame {
        background-position: 63% 0
    }

    .contact-list li {
        padding-right: 30px
    }

    .wh-top .page-intro-title {
        font-size: 35px;
        line-height: 35px
    }

    .employ-nav {
        padding-left: 32px;
        padding-right: 32px
    }

    .ps-nav {
        padding-left: 0;
        padding-right: 0
    }

    .ps-nav .psn-item a span {
        display: none
    }

    .ps-nav .psn-item {
        height: 55px
    }

    .ps-content {
        margin-top: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        padding-top: 50px;
        position: relative
    }

    .ps-nav .psn-item a {
        padding-top: 13px;
        border-bottom-right-radius: 0
    }

    .ps-nav .psn-item a:first-child {
        border-bottom-left-radius: 0
    }

    .ps-nav .psn-item a:last-child {
        border-bottom-right-radius: 0
    }

    .ps-nav .psn-item {
        width: 20.6276150627615063%;
        margin-right: -.6276150627615063%
    }

    .ps-nav .psn-item:last-child {
        width: 20%
    }

    .ps-nav .psn-item a.active:after {
        bottom: -38px
    }

    .four-phases-slider .ps-nav .psn-item:last-child {
        width: 25.7554811715481125%
    }

    .ps-nav__1 .psn-item a em, .ps-nav__1 .psn-item a.active em {
        display: none !important
    }

    .ps-nav__1 .psn-item a b {
        display: block
    }

    .current-active-0 {
        border-bottom: 19px solid #009DDC;
        position: relative;
        z-index: 2
    }

    .current-active-1 {
        border-bottom: 19px solid #0078AE;
        position: relative;
        z-index: 2
    }

    .current-active-2 {
        border-bottom: 19px solid #006B9B;
        position: relative;
        z-index: 2
    }

    .current-active-3 {
        border-bottom: 19px solid #005981;
        position: relative;
        z-index: 2
    }

    .current-active-4 {
        border-bottom: 19px solid #003B55;
        position: relative;
        z-index: 2
    }

    .three-phase-section .ps-nav .psn-item:last-child {
        width: 33.37238493723849%
    }

    .three-phase-section .ps-nav {
        padding: 0 5px 0 12px;
        border-bottom: 0
    }

    .three-phase-section .ps-nav .psn-item a.active:after {
        bottom: -19px
    }

    .three-phase-section .ps-nav .psn-item a span {
        display: block
    }

    .three-phases-slider .ps-nav .psn-item:last-child {
        width: 34.5111111%
    }

    .ps-nav__2 .psn-item a {
        padding-top: 13px !important
    }

    .benefits-section .bs-item {
        width: 50%;
        margin-bottom: 20px
    }

    .job-section .js-item {
        width: 50%;
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .job-section .js-item:nth-child(odd) {
        padding-right: 17px !important
    }

    .job-section .js-item:nth-child(even) {
        padding-left: 17px !important
    }

    .pib__1 p, .pit__1 {
        padding-right: 65%
    }

    .wide-video-holder .video-overlay {
        width: 97px;
        height: 97px
    }

    .wide-video-holder .video-overlay:before {
        background: url("../image/tzz_ion-1.png") no-repeat;
        width: 97px;
        height: 97px
    }

    .wide-video-holder .video-overlay:after {
        background: url("../image/tzz_ion-1.png") left bottom no-repeat;
        width: 97px;
        height: 97px
    }

    .video-overlay-large:before {
        width: 100px;
        height: 100px;
        background-size: 100%
    }

    .fvs-title {
        font-size: 45px;
        padding: 22px 10px
    }

    .sv-box {
        padding: 14px 10px;
        font-size: 15px
    }

    .sv-box h3 {
        font-size: 23px
    }

    .sv-box p {
        margin-bottom: 8px
    }

    .fvs-box h4 {
        font-size: 30px
    }

    .thumb-descr-frame {
        padding: 15px
    }

    .sv-box .more-link:after {
        margin-top: -6px
    }

    .lp-slider-txt {
        width: 60%
    }

    .gallery-space-hold {
        margin-left: -570px
    }

    .featured-work-fullscreen .ec-fs-descr, .featured-work-fullscreen .expanded-mode .ecg-image-box {
        width: 50%
    }

    .fwb-items .ec-fs-logo img {
        max-height: 100px
    }

    .ec-fs-intro {
        font-size: 20px;
        margin-bottom: 10px
    }

    .ec-fs-btn-holder {
        padding-top: 12px
    }

    .go-next-step {
        width: 66px;
        height: 66px;
        top: -33px
    }

    .gns-arrow {
        width: 38px;
        height: 20px
    }

    .de-blog-title {
        font-size: 20px
    }

    .f-post .download-lnk {
        white-space: nowrap
    }

    .f-post .whitepaper-post .txt {
        padding: 0
    }

    .f-post .txt, .f-post .visual {
        display: block;
        width: 100%;
        position: relative;
        z-index: 2;
        padding: 0
    }

    .f-post .visual {
        text-align: center;
        margin-bottom: 20px
    }

    .loc-phone {
        display: block
    }

    .loc-phone:after {
        display: none
    }
}

@media only screen and (min-width: 787px) {
    .feat-expanded-section .txt-tab-lnk.tab-lnk {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin: 60px 0 0;
        cursor: default
    }
}

@media only screen and (max-width: 786px) {
    .marketing-pg .bg.full-height {
        background-position: 350px 0
    }

    .feat-expanded-section .tab-lnk {
        width: 47%
    }
}

@media only screen and (max-width: 768px) {
    .pr-slider-holder {
        max-width: 550px
    }

    .offers .img-holder {
        height: 130px
    }

    .logo-pg .bg.mid-align {
        background-size: auto 85%
    }

    .wh-form-holder .ch-form {
        padding: 20px
    }

    .seotr-graph {
        -webkit-transform: scale(0.67) translateX(-75%);
        transform: scale(0.67) translateX(-75%);
        bottom: -64px
    }

    .section02 .seotr-graph {
        bottom: -60px
    }

    .biowars-ttl {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        left: -168px;
        top: -209px
    }

    .main-section .s-left .johnjay-ttl {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        margin: -121px 0 -30px -61px
    }

    .main-section .s-left .btb-ttl, .main-section .s-left .dance-ttl, .main-section .s-left .leon-ttl, .main-section .s-left .medcpu-ttl {
        margin: -40px -87px 10px;
        -webkit-transform: scale(0.6);
        transform: scale(0.6)
    }

    .main-section .s-left .btb-ttl {
        margin: -70px -90px -40px
    }

    .main-section .s-left .dance-ttl {
        margin: -80px -105px 0
    }

    .video-frame .sub-caption {
        margin-top: -90px
    }

    .video-frame .wvs-play-video {
        top: -62px
    }

    .hs-left .see-our-work-btn {
        position: absolute;
        margin: 0 0 0 -96px;
        bottom: -105px;
        left: 50%;
        z-index: 11
    }

    .logo-pg, .logo-pg .s-left {
        height: auto;
        padding-bottom: 10px
    }

    .case-pg .section h2, .case-pg .top-section .s-left h2, .continue-section .PT-awards .ttl, .top-section .s-left .ttl, .top-section .s-left h1, .top-section .s-left h2, .top-section.alt-size .s-left h1 {
        font-size: 32px;
        line-height: 1.1
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 40px
    }

    .top-section .s-left .sub-ttl {
        font-size: 21px;
        line-height: 1.2
    }

    .sec-ttl h2, .sec-ttl h2 span.size01 {
        font-size: 40px
    }

    .quote-section cite {
        font-size: 18px
    }

    .quote-section cite strong {
        font-size: 22px
    }

    .quote-section q {
        line-height: 1.3;
        font-size: 32px
    }

    .quote-section q:before {
        font-size: 230px;
        height: 50px;
        left: -80px
    }

    .top-section.alt-size .s-left {
        font-size: 18px
    }

    .back-link {
        padding-left: 10px
    }

    .top-section .s-left {
        font-size: 18px;
        line-height: 1.3
    }

    .case-pg .frame.t-holder > .t-cell {
        padding: 60px 10px 70px
    }

    .quote-section blockquote {
        padding-top: 0;
        padding-bottom: 0
    }

    .result-list {
        font-size: 18px
    }

    .result-list span {
        font-size: 35px
    }

    .result-list li {
        padding: 7px 7px 7px 55px
    }

    .result-list li:before {
        width: 32px;
        height: 32px;
        left: 10px;
        top: 13px
    }

    .result-list li:after {
        left: 16px;
        top: 21px
    }

    .case-pg .top-section .s-left {
        padding: 50px 10px 10px
    }

    .top-section .s-left, .top-section.alt-size .s-left {
        padding: 3% 20px
    }

    .top-section .custom-list li {
        padding-bottom: 10px;
        line-height: 1.4
    }

    .solutions-section .show-in-mobile {
        display: block
    }

    .solutions-section .drop-holder {
        min-height: 155px
    }

    .infoboxes .item:last-child {
        padding-bottom: 40px
    }

    .industry-section:after {
        background: #026c9c;
        background: -moz-linear-gradient(top, #026c9c 0, #0779ab 14%, #0c88bc 25%, #0d86bb 25%, #1196ce 42%, #0f90c7 87%, #108dc3 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #026c9c), color-stop(14%, #0779ab), color-stop(25%, #0c88bc), color-stop(25%, #0d86bb), color-stop(42%, #1196ce), color-stop(87%, #0f90c7), color-stop(100%, #108dc3));
        background: -webkit-linear-gradient(top, #026c9c 0, #0779ab 14%, #0c88bc 25%, #0d86bb 25%, #1196ce 42%, #0f90c7 87%, #108dc3 100%);
        background: -ms-linear-gradient(top, #026c9c 0, #0779ab 14%, #0c88bc 25%, #0d86bb 25%, #1196ce 42%, #0f90c7 87%, #108dc3 100%);
        background: linear-gradient(to bottom, #026c9c 0, #0779ab 14%, #0c88bc 25%, #0d86bb 25%, #1196ce 42%, #0f90c7 87%, #108dc3 100%)
    }

    .header {
        padding-bottom: 13px
    }

    .olpcb-two-items .olp-item img {
        max-height: 172px
    }

    .p-add-padding {
        padding-left: 40px;
        padding-right: 40px
    }

    .hidden-br {
        display: none
    }

    .full-services-lnk-content .fslc-lnk, .obc-lnk, .olpc-board, .our-clients-content .occ-lnk, .our-latest-projects-content .our-latest-projects-lnk {
        width: 93%;
        margin-right: auto;
        margin-left: auto
    }

    .saic-columns {
        margin-top: 30px
    }

    .saic-columns .saic-column-list {
        padding-right: 20px
    }

    .home-resources-img-content .hric-img .desktop-img, .in-the-news-content .desktop-img {
        display: none
    }

    .home-resources-img-content .hric-img .tablet-img, .in-the-news-content .tablet-img {
        display: block;
        margin: 0 auto
    }

    .our-clients-content h2, .our-clients-content h3 {
        font-size: 50px
    }

    .succeeding-online > h2, .succeeding-online > h3 {
        font-size: 36px
    }

    .obc-columns, .so-columns {
        width: 93%;
        margin: 0 auto
    }

    .soc-column h2, .soc-column h3, .soc-column h5 {
        min-height: 160px
    }

    .obcc-column .blog-date {
        width: 70px;
        height: 70px;
        border: 3px solid #fff;
        left: -18px;
        top: -30px;
        font: 16px/16px roboto-light-webfont, Arial, sans-serif;
        padding-top: 13px;
        z-index: 1
    }

    .obc-columns .obcc-column {
        width: 48%
    }

    .obcc-column .blog-date strong {
        font-size: 24px
    }

    .obcc-column .blog-author-comment .sep {
        padding: 0 5px
    }

    .in-the-news-content h2, .in-the-news-content h3 {
        font-size: 50px
    }

    .in-the-news-content .itnc-sep {
        margin: 30px 0
    }

    .home-slider-content .hs-left, .home-slider-content .hs-right {
        width: 100%;
        float: none;
        padding: 30px 0 10px;
        margin: 0 auto;
        text-align: center;
        overflow: hidden
    }

    .home-slider-content .hs-left {
        background-image: none;
        padding-bottom: 0
    }

    .home-slider-content .hs-right {
        width: 72%;
        position: static;
        padding-bottom: 22px
    }

    .hs-left .hsl-header, .hs-left .hsl-header h1 {
        font-size: 18px
    }

    .hs-left .hsl-header strong {
        font-size: 35px;
        line-height: 1.3
    }

    .solutions-section h2 {
        font-size: 30px
    }

    .hs-sub-row .see-our-work-btn {
        display: inline-block;
        visibility: visible;
        margin: 15px 0 25px
    }

    .hs-left .hsl-header .sep-line:first-child {
        display: inline
    }

    .hs-left .hsl-subcaption {
        padding-right: 0
    }

    .solutions-section h3 a {
        font-size: 18px
    }

    .solutions-section h3 .ico {
        margin-bottom: -16px
    }

    .hnc-simple-list li {
        font-size: 20px
    }

    .hnc-simple-list li br {
        display: inline
    }

    .succeeding-online {
        padding: 100px 0
    }

    .our-blog-content h3 {
        font-size: 50px
    }

    .hs-left .simple-sep {
        display: none
    }

    .hs-left .shadow-sep {
        background: none;
        border-bottom: 1px solid #FFF;
        border-top: 1px solid #E2E3E3;
        height: 0
    }

    .logo {
        margin-top: 3px
    }

    .logo a {
        width: 177px;
        height: 30px;
        background: url("../images/logo-mobile.png") no-repeat
    }

    .header .nav .link-more {
        padding-right: 10px !important;
        padding-left: 11px !important
    }

    .head-top {
        margin-right: 196px
    }

    .ht-simplemenu .phone {
        padding-left: 7px
    }

    .search-field {
        padding-right: 7px;
        padding-left: 7px
    }

    .hidden-for-tablet {
        display: none
    }

    .cs-services {
        padding-bottom: 110px
    }

    .cs-service-columns {
        display: block;
        padding-bottom: 0
    }

    .cs-service-column {
        display: inline-block;
        vertical-align: top;
        width: 48%;
        padding-bottom: 32px
    }

    .service-logo {
        max-width: 182px
    }

    .page-intro-block {
        margin-bottom: 60px
    }

    .blue-middle-box {
        margin-bottom: 56px
    }

    .work-section {
        padding-bottom: 118px
    }

    .ws-column {
        padding-left: 30px
    }

    .ws-column:first-child {
        padding-right: 30px
    }

    .whitepapers-section .btn-simple {
        text-align: center
    }

    .certify-section {
        padding-bottom: 124px
    }

    .demo-reel-block .drb-video-holder, .demo-reel-block .drb-video-holder img, .intro-fl-image, .intro-fl1-image {
        max-width: 316px
    }

    .sc-logo {
        margin-right: 50px
    }

    .strategy-consult-item:first-child {
        padding-top: 90px
    }

    .intro-block-no-bd {
        padding-bottom: 58px
    }

    .page-intro-block .btn-simple {
        margin-bottom: 0
    }

    .inline-btns-holder .btn-simple {
        margin-bottom: 12px
    }

    .cd-chapter.pad-r-64 {
        padding-right: 0
    }

    .creative-design-chapters {
        margin-top: 40px
    }

    .cd-descript .more-link {
        font-size: 17px
    }

    .cd-descript .more-link:after {
        font-size: 30px;
        margin-top: -5px
    }

    .ow-items {
        padding-right: 20px
    }

    .ow-item {
        width: 46%;
        margin: 0 0 30px 16px
    }

    .ow-item img {
        width: 100%
    }

    .ow-items-diff-sizes .ow-item img {
        width: auto
    }

    .services-dev-section .soc-column h2, .services-dev-section .soc-column h3, .services-dev-section .soc-column h5 {
        font-size: 19px;
        height: auto;
        min-height: 154px
    }

    .services-dev-section .soc-column p {
        padding-left: 0;
        padding-right: 0
    }

    .page-navigation-float a {
        font-size: 17px
    }

    .page-navigation-float .prev-page:before {
        font-size: 30px;
        margin-top: -9px
    }

    .page-navigation-float a span {
        display: none
    }

    .page-intro-title-narrow-alt {
        padding-right: 45%
    }

    .aside-form-box {
        margin-top: -182px
    }

    .page-intro-form p {
        padding-right: 52%
    }

    .st-column {
        padding-left: 15px
    }

    .st-column:first-child {
        padding-left: 0;
        padding-right: 15px
    }

    .baac-slider-bottom .btn-green {
        padding-left: 28px;
        padding-right: 28px
    }

    .page-intro-about p {
        font-size: 26px
    }

    .pi-left-col {
        width: 50%
    }

    .photo-container {
        text-align: center
    }

    .member-item {
        width: 46%
    }

    .at-item {
        width: 43%
    }

    .industries-intro-block .page-intro-title {
        padding-right: 0
    }

    .pp-nb-col {
        width: 100px
    }

    .pp-descript {
        padding-left: 20px
    }

    .testimonial-hidden-row h4 {
        font-size: 45px
    }

    .cf-item {
        padding-top: 8px;
        height: 136px;
        width: 18%;
        margin-right: 9px
    }

    .cf-item span {
        font-size: 15px;
        padding-top: 8px
    }

    .cf-item img {
        max-width: 56px
    }

    .cms-spec-item {
        padding-left: 26px;
        padding-right: 26px
    }

    .cms-spec-item .frame {
        padding-left: 290px
    }

    .cms-spec-item:nth-child(2n) .frame {
        padding-right: 280px
    }

    .fwb-row .fwb-item {
        width: 46.93593314763231%;
        margin-right: 4.874651810584958%
    }

    .fwb-row .fwb-item-3 {
        margin-right: 4.874651810584958%
    }

    .fwb-row .fwb-item img {
        min-width: 100%
    }

    .fwb-row .fwb-item-even {
        margin-right: 0
    }

    .testimonial .ti-author {
        padding-right: 59px
    }

    .industry-recognition-logos .desktop-img, .industry-recognition-logos .mobile-img {
        display: none
    }

    .industry-recognition-logos .tablet-img {
        display: block
    }

    .industry-recognition-wide-section, .page-cs-wide-section {
        padding-bottom: 85px
    }

    .testimonials-wide-section {
        padding-bottom: 65px
    }

    .webinars-holder .wh-form .ch-form {
        padding-left: 28px;
        padding-right: 18px
    }

    .sample-text-section .st-add-section .st-column {
        font-size: 14px;
        line-height: 19px
    }

    .sample-text-section .st-add-section h3 {
        font-size: 26px
    }

    .join-us-form-holder h2 {
        font-size: 20px
    }

    .sample-text-section {
        padding-bottom: 66px
    }

    .join-us-form-holder .jb-1, .join-us-form-holder .jb-2 {
        padding-left: 20px;
        padding-right: 20px
    }

    .demo-reel-block .drb-content h3 {
        padding-right: 45px;
        font-size: 30px;
        line-height: 36px
    }

    .extra-text-section h1, .single-text-section h1 {
        font-size: 30px
    }

    .two-col-list ul li {
        width: auto;
        display: block;
        text-align: left
    }

    .two-col-list ul li:nth-child(3n) {
        margin-bottom: 20px
    }

    .mobile-date-table table tr td {
        padding-left: 10px;
        padding-right: 10px
    }

    .mobile-date-table table tr.notes td {
        font-size: 11px;
        padding-left: 5px;
        padding-right: 5px
    }

    .mobile-date-table table tr.notes td:first-child {
        font-size: 12px;
        padding-left: 10px;
        padding-right: 10px
    }

    .demo-video-box .fwbi-text, .expanded-mode .fwbi-text-pad {
        padding-left: 20px;
        padding-right: 20px
    }

    .expanded-mode .thumbnails a {
        margin-left: 8px
    }

    .wyg-form-box .f-row {
        margin-right: 20px;
        padding-left: 20px
    }

    .three-phase-section .psc-lead {
        padding-left: 50px;
        padding-right: 50px
    }

    .pb80 {
        padding-bottom: 80px
    }

    .search-container .sc-aside {
        float: none;
        width: 100%;
        margin: 0 0 20px
    }

    .search-container .sc-aside ul {
        display: none
    }

    .search-container .sc-aside .sc-title {
        cursor: pointer;
        padding: 15px 0 16px 18px
    }

    .wistia_embed {
        width: 768px;
        height: 432px
    }

    .dig-agency-title h3 {
        font-size: 30px
    }

    .dig-agency-title .subtitle {
        font-size: 23px;
        line-height: normal
    }

    .employees-testim .note span::after {
        display: none
    }

    .choose-agency h2 {
        font-size: 30px;
        line-height: 32px;
        margin: 0 5px 25px
    }

    .prev-next-pager {
        display: none
    }

    .featured-work-fullscreen .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.6);
        transform: translate(-50%, -50%) scale(.6)
    }

    .featured-work-fullscreen .fwb-item > a:hover .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.7);
        transform: translate(-50%, -50%) scale(.7)
    }

    .top-slide .s-right {
        height: 275px
    }

    .circle-slider .more-link {
        font-size: 15px
    }

    .circle-slider .more-link:after {
        line-height: 21px
    }

    .de-blog-item:first-child + .divider {
        display: table-cell;
        width: 2%
    }

    .de-blog-item {
        display: table-cell;
        vertical-align: top;
        width: 48%;
        margin-bottom: 0
    }

    .press-item {
        display: block;
        margin-bottom: 10px
    }

    .de-text {
        padding-bottom: 25px
    }

    .PT-awards {
        padding: 30px 0 0
    }

    .PT-awards .ttl {
        font: 400 20px roboto-light-webfont, sans-serif
    }

    .PT-awards .ttl span {
        font-size: 30px;
        line-height: normal
    }

    .PT-awards-list {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin-top: -25px
    }

    .PT-awards-list br {
        display: block
    }

    .PT-awards-list .item {
        padding: 0 10px
    }

    .rd-holder .ready-discuss {
        padding: 0 0 40px
    }

    .socials .item {
        font-size: 0;
        line-height: 0
    }

    .socials .icn {
        -webkit-transform: scale(1);
        transform: scale(1);
        margin: 0
    }

    .socials-box .frame {
        padding: 30px 10px
    }

    .f-menu-content .fmc-list li {
        margin: 0 6px 10px;
        display: inline-block
    }

    .fmc-contact {
        font-size: 14px
    }

    .fmc-contact li {
        padding: 0 10px
    }

    .fmc-copyright {
        padding-bottom: 20px
    }

    .fmc-contact li:not(:first-child):before {
        display: none
    }

    .location-ttl svg {
        width: 30px;
        height: 40px;
        top: 10px
    }

    .location-ttl {
        margin-top: -60px
    }

    .location-subttl {
        font-size: 20px
    }

    .loc-address, .loc-contact, .loc-contact .link-more {
        font-size: 16px
    }

    .loc-contact .link-more:after {
        font-size: 27px
    }

    .loc-visual img {
        max-width: 250px
    }

    .home-company-logos-content li {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        margin: 0
    }

    .client-logo-item {
        overflow: hidden
    }

    .wide-featexp-section .feat-expanded-section .tab-lnk {
        margin-bottom: 20px
    }

    .simple-slider .t-cell.txt, .simple-slider .t-cell.visual {
        display: block;
        width: 100%
    }

    .simple-slider .t-cell.txt, .simple-slider .t-cell.txt.alt-view {
        padding: 20px 0
    }

    .simple-slider .t-cell.visual {
        vertical-align: top;
        padding-bottom: 20px;
        text-align: center
    }

    .simple-slider .t-cell.visual img {
        max-width: 70%
    }

    .slider-section .txt-slider .pull-controls {
        top: 60px
    }

    .simple-slider .bx-pager-item {
        margin: 0 15px
    }

    .tab-slider-pager .brand {
        transform: scale(.8);
        margin: 0 -10px
    }

    .tab-slider-pager .luxury {
        transform: scale(.6);
        margin: 0 -40px
    }

    .tab-slider-pager .cayman, .tab-slider-pager .kosher, .tab-slider-pager .loanscribe, .tab-slider-pager .paul, .tab-slider-pager .serviceking, .tab-slider-pager .shenkman {
        transform: scale(.7)
    }

    .tab-slider .t-cell {
        height: auto
    }

    .tab-slider .t-cell.txt {
        font-size: 20px;
        padding: 0 0 40px
    }

    .case-slider .t-cell.txt {
        padding-top: 40px
    }

    .case-slider .pull {
        top: -185px
    }

    .rd-box-holder {
        padding-bottom: 40px
    }

    .tab-slider.mix-slider .t-cell.visual img {
        max-width: 60%
    }

    .tab-slider-pager:not(.visual) > a h3, .tab-slider-pager:not(.visual) > a span {
        font-size: 16px
    }

    .sec-ttl .descr {
        padding-bottom: 0
    }

    .simple-slider p.size02 {
        font-size: 37px
    }

    .equal-cols {
        display: block
    }

    .equal-cols .t-cell {
        display: block;
        height: auto
    }

    .rd-box {
        padding: 23px 20px
    }

    .rd-box .txt {
        display: block
    }

    .submenu-section {
        text-align: center
    }

    .submenu-section .t-cell {
        display: inline-block;
        width: 49%
    }

    .submenu-section .item {
        height: auto;
        min-height: 220px
    }

    .submenu-section span {
        padding: 0 10px
    }

    .frame-alt {
        padding: 0
    }

    .nofound .cs-service-column {
        display: inline-block;
        vertical-align: top;
        width: 48%
    }

    .rocket-slider-wrap.alt {
        margin-top: 10px
    }
}

@media screen and (min-width: 480px) and (max-width: 768px) {
    .feat-expanded-section .txt-tab-lnk {
        padding: 0;
        margin: 0 6px;
        position: relative;
        max-height: 276px
    }

    .feat-expanded-section .txt-tab-lnk img {
        height: 100% !important;
        width: 100% !important;
        display: block;
        text-indent: -9999px;
        overflow: hidden
    }

    .feat-expanded-section .txt-tab-lnk .holder {
        position: absolute;
        top: 50%;
        margin-top: -72px;
        left: 0;
        width: 100%
    }

    .feat-expanded-section .txt-tab-lnk .txt {
        font-size: 29px;
        line-height: 1.2
    }

    .feat-expanded-section .txt-tab-lnk .btn-green {
        font-size: 19px
    }

    .olp-ecommerce .olpi-hover-stare {
        padding: 40px 15px 0
    }

    .olpi-hover-stare .hs-content {
        margin-top: 10px;
        padding-top: 10px;
        font-size: 12px
    }

    .olpi-hover-stare .hs-lnk {
        margin-top: 10px
    }

    .contact-list li {
        padding-right: 10px
    }

    .hiring-box {
        margin: 0
    }

    .rank-section .rs-box {
        width: 49%;
        font-size: 15px
    }

    .br-tablet {
        display: inline
    }

    .no-pad-marg-mobile {
        padding-bottom: 0;
        margin-bottom: 0
    }
}

@media only screen and (max-width: 755px) {
    .wide-expanded-section .t-holder {
        table-layout: fixed
    }

    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 31%
    }

    .wide-expanded-section .txt-cell {
        padding-bottom: 20px
    }

    .wide-expanded-section .ec-gallery {
        -webkit-transform: scale(.65);
        transform: scale(.65)
    }

    .wide-expanded-section .expanded-mode .biowars-mob-slide .ec-gallery {
        width: 50%;
        -webkit-transform: none;
        transform: none
    }

    .biowars-mob-slide .holder {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
        margin: 0 -120px 0 -160px
    }

    .wide-expanded-section .main-image {
        float: none;
        width: auto;
        margin: -170px -34px 0 -50px
    }

    .wide-expanded-section .thumbnails {
        margin: 0 -70px -120px;
        float: none;
        width: auto;
        -webkit-transform: scale(.85);
        transform: scale(.85)
    }

    .wide-expanded-section .btn-green {
        margin-top: 20px
    }

    .wide-expanded-section .exp-bg {
        margin-bottom: 10px
    }

    .wide-expanded-section .thumbnails > a {
        display: inline-block;
        margin: 0 5px
    }

    .wide-expanded-section {
        padding: 60px 0
    }

    .c-section-title, .wide-expanded-section .section-title {
        padding: 0 20px
    }

    .c-section-title h2, .wide-expanded-section .section-title h2 {
        font-size: 40px
    }

    .sw-logo {
        -webkit-transform: scale(.85);
        transform: scale(.85)
    }

    .service-wide-item h2 {
        font-size: 23px
    }

    .sw-description p {
        min-height: 120px
    }

    .service-wide-item:nth-child(4) .sw-description p, .service-wide-item:nth-child(5) .sw-description p {
        min-height: 168px
    }

    .feat-expanded-section {
        padding: 60px 0 30px
    }

    .demo-video-box h4, .feat-expanded-section h2 {
        font-size: 30px
    }

    .section-title.in-dark p {
        font-size: 14px
    }

    .expanded-mode .ec-gallery, .expanded-mode .ec-text {
        width: auto;
        float: none
    }

    .expanded-mode .ec-text {
        padding: 15px 0 25px
    }

    .demo-video-box .fwbi-text, .expanded-mode .fwbi-text, .expanded-mode .fwbi-text-pad {
        padding: 60px 10px 40px
    }

    .wide-expanded-section .wide-holder {
        padding: 5px 0 0
    }

    .wide-expanded-section .exp-bg {
        padding: 0
    }

    .feat-expanded-section .fwbi-text {
        padding: 15px 0
    }

    .expanded-mode h3, .expanded-mode h4 {
        font-size: 48px
    }

    .btn-launch-holder, .ec-text .btn-holder {
        text-align: center
    }

    .ec-text .btn-green {
        display: inline-block;
        float: none;
        min-width: 213px
    }

    .demo-reel-block .drb-content h3 {
        max-width: 100%;
        width: 100%;
        word-spacing: -1px
    }

    .demo-reel-block .drb-content h3 span, .demo-reel-block .drb-video-holder {
        display: none
    }

    .demo-reel-block .drb-content .hide-from-mobile {
        display: inline-block;
        float: none;
        margin: 0 auto 13px;
        width: 100%;
        max-width: 396px
    }

    .demo-reel-block .drb-content .hide-from-mobile img {
        max-width: 100%
    }

    .webinar-archive-thumb {
        width: 196px;
        height: 87px
    }

    .gallery-space-hold {
        margin-left: -780px
    }

    .logo-benefits .lp-slider {
        padding: 0 125px 70px 4px
    }

    .slide-section .lp-slider {
        padding-bottom: 0
    }

    .logo-benefits .lp-slider-img .bx-wrapper {
        margin: 30px 30px 0
    }

    .logo-benefits .lp-slider-img li {
        height: 161px
    }

    .logo-benefits .lp-slider-img .brand img {
        height: 60%;
        width: auto
    }

    .logo-benefits .lp-slider-img img {
        width: 60%;
        height: auto
    }

    .slide-section .lp-slider-img img {
        width: 80%
    }

    .logo-process .lp-slider {
        padding-left: 125px;
        background: #f8f8f8
    }

    .logo-benefits .lp-slider {
        background: 0 0
    }

    .slider-txt-wrap {
        padding-left: 0;
        padding-right: 0
    }

    .logo-process p {
        padding-bottom: 0
    }

    .logo-benefits .lp-slider-txt, .lp-slider-txt, .slide-section .slider-txt-wrap {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        text-align: center
    }

    .logo-benefits .slider-txt-wrap, .slide-section .slider-txt-wrap {
        padding: 0
    }

    .logo-benefits .lp-slider-img, .lp-slider-img, .slide-section .lp-slider-img {
        float: none;
        margin: 0 auto;
        width: 221px;
        height: 221px
    }

    .lp-slider-img:after {
        background: url("../image/tzz_ion-1.png") 0 -686px no-repeat
    }

    .lp-slider-txt h3 {
        padding-top: 0;
        padding-bottom: 10px
    }

    .logo-benefits .lp-slider-txt p, .lp-slider-txt p {
        padding-right: 0;
        text-align: center !important
    }

    .lp-steps {
        height: 78px;
        margin: 20px 0 -40px;
        background: url("../images/logo-design/bg-steps-mobile.png") 50% 0 no-repeat
    }

    .logo-benefits .lb-steps ul {
        width: 100%;
        margin: 25px 0 0;
        font-size: 16px;
        border-radius: 0
    }

    .lp-steps li {
        font-size: 0;
        line-height: 0;
        color: transparent;
        position: absolute;
        top: 12px;
        left: 50%;
        width: 52px;
        margin: 0 0 0 -26px;
        z-index: 3;
        opacity: 0;
        -webkit-transition: opacity .6s;
        -moz-transition: opacity .6s;
        transition: opacity .6s
    }

    .logo-benefits .lb-steps li {
        width: 270px;
        max-width: 270px;
        text-align: center;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        top: 40px;
        margin: 0;
        opacity: 0
    }

    .slide-section .lb-steps.full h3 {
        font-size: 15px
    }

    .slide-section .lb-steps li, .slide-section .lb-steps.full li {
        width: 270px;
        max-width: 270px
    }

    .slide-section .lb-steps h3 {
        font-size: 15px
    }

    .logo-benefits .lb-steps li a {
        display: block;
        padding: 0;
        white-space: nowrap;
        line-height: 60px;
        border-radius: 4px;
        color: #fff
    }

    .logo-benefits .lb-steps.full li a {
        padding: 0
    }

    .slide-section .lb-steps.short a, .slide-section .lb-steps.short li {
        width: auto
    }

    .logo-benefits .lb-steps br {
        display: none
    }

    .lb-steps .cur-step {
        width: 270px !important;
        left: 50% !important;
        bottom: -21px;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%)
    }

    .lb-steps ul.active-0 li:nth-child(1), .lb-steps ul.active-1 li:nth-child(2), .lb-steps ul.active-2 li:nth-child(3), .lb-steps ul.active-3 li:nth-child(4), .lb-steps ul.active-4 li:nth-child(5), .lb-steps ul.active-5 li:nth-child(6), .lb-steps ul.active-6 li:nth-child(7), .lp-steps ul.active-0 li:nth-child(1), .lp-steps ul.active-1 li:nth-child(2), .lp-steps ul.active-2 li:nth-child(3), .lp-steps ul.active-3 li:nth-child(4), .lp-steps ul.active-4 li:nth-child(5), .lp-steps ul.active-5 li:nth-child(6), .lp-steps ul.active-6 li:nth-child(7), .lp-steps ul.active-7 li:nth-child(8) {
        -webkit-animation: activeStepMobile .8s forwards;
        -ms-animation: activeStepMobile .8s forwards;
        animation: activeStepMobile .8s forwards;
        opacity: 1
    }

    .lb-steps ul.active-1 li:nth-child(1), .lb-steps ul.active-2 li:nth-child(2), .lb-steps ul.active-3 li:nth-child(3), .lb-steps ul.active-4 li:nth-child(4), .lb-steps ul.active-5 li:nth-child(5), .lb-steps ul.active-6 li:nth-child(6), .lb-steps ul.active-7 li:nth-child(7), .lp-steps ul.active-1 li:nth-child(1), .lp-steps ul.active-2 li:nth-child(2), .lp-steps ul.active-3 li:nth-child(3), .lp-steps ul.active-4 li:nth-child(4), .lp-steps ul.active-5 li:nth-child(5), .lp-steps ul.active-6 li:nth-child(6), .lp-steps ul.active-7 li:nth-child(7) {
        -webkit-transition: opacity .6s, left .6s;
        -moz-transition: opacity .6s, left .6s;
        transition: opacity .6s, left .6s;
        left: -10%
    }

    .lb-steps ul.active-0.active-b li:nth-child(1), .lb-steps ul.active-1.active-b li:nth-child(2), .lb-steps ul.active-2.active-b li:nth-child(3), .lb-steps ul.active-3.active-b li:nth-child(4), .lb-steps ul.active-4.active-b li:nth-child(5), .lb-steps ul.active-5.active-b li:nth-child(6), .lb-steps ul.active-6.active-b li:nth-child(7), .lp-steps ul.active-0.active-b li:nth-child(1), .lp-steps ul.active-1.active-b li:nth-child(2), .lp-steps ul.active-2.active-b li:nth-child(3), .lp-steps ul.active-3.active-b li:nth-child(4), .lp-steps ul.active-4.active-b li:nth-child(5), .lp-steps ul.active-5.active-b li:nth-child(6), .lp-steps ul.active-6.active-b li:nth-child(7), .lp-steps ul.active-7.active-b li:nth-child(8) {
        -webkit-animation: activeStepMobileB .8s forwards;
        -ms-animation: activeStepMobileB .8s forwards;
        animation: activeStepMobileB .8s forwards
    }

    .lb-steps ul.active-0.active-b li:nth-child(2), .lb-steps ul.active-1.active-b li:nth-child(3), .lb-steps ul.active-2.active-b li:nth-child(4), .lp-steps ul.active-0.active-b li:nth-child(2), .lp-steps ul.active-1.active-b li:nth-child(3), .lp-steps ul.active-2.active-b li:nth-child(4), .lp-steps ul.active-3.active-b li:nth-child(5), .lp-steps ul.active-4.active-b li:nth-child(6), .lp-steps ul.active-5.active-b li:nth-child(7), .lp-steps ul.active-6.active-b li:nth-child(8) {
        -webkit-transition: opacity .6s, left .6s;
        -moz-transition: opacity .6s, left .6s;
        transition: opacity .6s, left .6s;
        left: 110%
    }

    @-webkit-keyframes activeStepMobile {
        0% {
            left: 100%
        }
        100% {
            left: 50%
        }
    }@-ms-keyframes activeStepMobile {
         0% {
             left: 100%
         }
         100% {
             left: 50%
         }
     }@keyframes activeStepMobile {
          0% {
              left: 100%
          }
          100% {
              left: 50%
          }
      }@-webkit-keyframes activeStepMobileB {
           0% {
               left: 0
           }
           100% {
               left: 50%
           }
       }@-ms-keyframes activeStepMobileB {
            0% {
                left: 0
            }
            100% {
                left: 50%
            }
        }@keyframes activeStepMobileB {
             0% {
                 left: 0
             }
             100% {
                 left: 50%
             }
         }
    .lp-steps .ico-wrap {
        z-index: 3
    }

    .lp-steps .ico-wrap img {
        max-width: 66%
    }

    .icon-svg {
        width: 35px;
        height: 35px
    }

    .icon-abc-part {
        width: 22px
    }

    .icon-abc-part:before {
        width: 22px;
        font-size: 11px;
        line-height: 13px
    }

    .icon-sketches {
        -webkit-transform: translate(-50%, -50%) scale(0.85);
        transform: translate(-50%, -50%) scale(0.85)
    }

    .css-icon-pupil:before {
        width: 14px;
        height: 14px;
        border-width: 3px
    }

    .css-icon-present-1 {
        width: 18px;
        height: 15px;
        top: -13px
    }

    .css-icon-present-1:after {
        height: 11px;
        font-size: 15px;
        line-height: 3px
    }

    .css-icon-present-1:before {
        top: 10px
    }

    .icon-colors {
        -webkit-transform: translate(-50%, -50%) scale(0.8);
        transform: translate(-50%, -50%) scale(0.8)
    }

    .icon-fianl-logo {
        width: 27px;
        height: 27px
    }

    .lp-steps .cur-step-mob {
        display: block
    }

    .lp-steps .cur-step-no-mob {
        display: none
    }

    .lp-steps .cur-step {
        width: 52px;
        height: 68px;
        left: 0;
        bottom: -43px
    }

    .lp-steps ul li:nth-child(1) #curStep {
        fill: #4e4e4e
    }

    .lp-steps ul li:nth-child(2) #curStep {
        fill: #87c556
    }

    .lp-steps ul li:nth-child(3) #curStep {
        fill: #eb8a0d
    }

    .lp-steps ul li:nth-child(4) #curStep {
        fill: #ab840c
    }

    .lp-steps ul li:nth-child(5) #curStep {
        fill: #56d3c6
    }

    .lp-steps ul li:nth-child(6) #curStep {
        fill: #882fa0
    }

    .lp-steps ul li:nth-child(7) #curStep {
        fill: #c44441
    }

    .lp-steps ul li:nth-child(8) #curStep {
        fill: #0078ae
    }

    .lp-steps .cur-step-sub {
        width: 52px;
        height: 52px
    }

    .lp-steps #curStep {
        width: 52px;
        height: 68px
    }

    .lb-steps {
        margin-top: 10px
    }

    .lp-mobile-swipe {
        top: auto;
        height: 108%
    }

    .page-intro-center-alt {
        font-size: 13px
    }

    .page-intro-center-alt h2.main-title {
        font-size: 27px;
        margin: 0 0 10px
    }

    .page-intro-center-holder .page-intro-center-alt {
        padding: 25px 0 20px
    }

    #easel-slide-section {
        padding: 0
    }

    .easel-slider {
        position: relative
    }

    .easel-controls .pull-left, .easel-controls .pull-right {
        top: auto;
        bottom: 180px;
        height: 46px
    }

    .easel-controls .pull-left {
        left: -18px
    }

    .easel-controls .pull-right {
        right: -30px
    }

    #easel-slide-section .frame {
        overflow: hidden
    }

    .rocket-section {
        padding: 50px 0 26px
    }

    .blue-heading {
        font-size: 13px;
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom: -125px
    }

    .blue-heading h2 {
        font-size: 30px
    }

    .rocket-animation {
        overflow: hidden
    }

    .clouds-bottom {
        width: 190%;
        left: -100px
    }

    .clouds-bottom2 {
        width: 120%;
        right: 18%
    }

    .small-cloud3 {
        display: none
    }

    .small-cloud2 {
        left: 68%
    }

    .small-cloud1 {
        left: -5%
    }

    .rocket-item {
        left: 48%;
        bottom: 9%;
        -webkit-transform: rotate(78deg);
        transform: rotate(78deg);
        -webkit-animation: rocketMobAnimation 3s infinite linear;
        animation: rocketMobAnimation 3s infinite linear
    }

    .pager-filler {
        display: none
    }

    .rocket-pager {
        height: 104px;
        border-top: 4px solid #fff;
        background: #0078ae;
        padding: 0 40px;
        position: relative;
        z-index: 10
    }

    .rocket-pager:before {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 0;
        height: 0;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-top: 10px solid #0078ae;
        content: ""
    }

    .rocket-pager ul {
        width: 100%;
        height: 100px;
        position: relative
    }

    .rocket-pager ul:before {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        content: "";
        z-index: 11
    }

    .alt .rocket-pager li, .rocket-pager li {
        position: absolute;
        top: 0;
        width: 100%;
        text-align: center;
        opacity: 0;
        z-index: 0;
        -webkit-transition: opacity .4s;
        transition: opacity .4s
    }

    .rocket-pager li.current {
        opacity: 1;
        z-index: 10
    }

    .rocket-pager a {
        font: 17px roboto-bold-webfont, sans-serif;
        color: #fff;
        display: table;
        width: 100%;
        height: 100px
    }

    .rocket-pager a span {
        display: table-cell;
        vertical-align: middle
    }

    .rocket-pager a br {
        display: none
    }

    .rocket-slider-wrap {
        overflow: hidden
    }

    .rocket-slider {
        top: 0;
        border-radius: 0;
        margin: 0;
        padding: 36px 28px
    }

    .rocket-slider-text {
        font-size: 13px
    }

    .rst-col:first-child {
        padding: 0 0 17px
    }

    .rst-col .img {
        width: 150px;
        height: 150px;
        background-size: cover
    }

    .rocket-controls .pull-left, .rocket-controls .pull-right {
        top: -78px;
        margin: 0
    }

    .rocket-controls .pull-left {
        left: -20px
    }

    .rocket-controls .pull-right {
        right: 5px
    }
}

@media only screen and (min-width: 850px) and (max-width: 1300px) {
    .read-more-anim span {
        bottom: 10px;
        right: 10px;
        font-size: 13px
    }

    .cayman .feat-brand:after, .ebond .feat-brand:after {
        -webkit-transform: scale(.9) translate(-57%, -57%);
        transform: scale(.9) translate(-57%, -57%)
    }

    .aol .feat-brand:after, .global .feat-brand:after, .nuna .feat-brand:after, .ronin .feat-brand:after {
        -webkit-transform: scale(.7) translate(-72%, -75%);
        transform: scale(.7) translate(-72%, -75%)
    }
}

@media only screen and (min-width: 850px) and (max-width: 1024px) {
    .de-text {
        padding-bottom: 30px
    }

    .read-more-anim span {
        bottom: 6px;
        right: 5px;
        font-size: 12px
    }
}

@media only screen and (max-width: 1024px) and (min-width: 680px) {
    .infoboxes .frame {
        padding: 0 20px
    }

    .aol .feat-brand:after, .cayman .feat-brand:after, .tweezerman .feat-brand:after {
        -webkit-transform: scale(.5) translate(-71%, -71%);
        transform: scale(.5) translate(-71%, -71%)
    }

    .biowars .feat-brand:after, .dance .feat-brand:after, .mballet .feat-brand:after, .napoli .feat-brand:after, .nuna .feat-brand:after, .uspolo .feat-brand:after {
        -webkit-transform: scale(.55) translate(-71%, -35%);
        transform: scale(.55) translate(-71%, -35%)
    }

    .biowars .feat-brand:after, .mballet .feat-brand:after, .napoli .feat-brand:after, .nuna .feat-brand:after, .uspolo .feat-brand:after {
        margin-left: 209px
    }

    .ronin .feat-brand:after, .tishman .feat-brand:after {
        -webkit-transform: scale(.45) translate(-71%, -35%);
        transform: scale(.45) translate(-71%, -35%)
    }

    .cayman .feat-brand:after, .tweezerman .feat-brand:after {
        margin-left: 190px
    }

    .ronin .feat-brand:after, .tishman .feat-brand:after {
        margin-left: 174px
    }

    .widefeat-gallery.alt + .feat-txt-holder .feat-brand {
        height: 110px
    }

    .widefeat-gallery.alt + .feat-txt-holder .feat-brand:after {
        margin: 0
    }

    .widefeat-gallery.alt {
        margin-top: 140px
    }

    .widefeat-thumbs .mobile {
        bottom: auto;
        top: 0;
        left: -30px
    }
}

@media only screen and (max-width: 680px) {
    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 36%
    }

    .wide-expanded-section .expanded-mode .biowars-mob-slide .ec-gallery {
        width: 53%
    }

    .biowars-mob-slide .holder {
        margin-left: -170px
    }

    .offers .t-cell, .offers .t-holder {
        display: block;
        width: 100%;
        margin: 0
    }

    .offers .t-cell {
        margin-bottom: 20px
    }

    .offers .img-holder {
        height: auto
    }

    .offers .img-holder img {
        position: static;
        -webkit-transform: none;
        transform: none
    }

    .offers .link-arrow {
        position: relative;
        bottom: 0;
        left: 0;
        margin: 0
    }

    .offers .txt-holder {
        padding: 20px 20px 35px
    }

    .seo-traffic-section .section-title {
        margin-bottom: 20px
    }

    .seotr-section {
        padding: 20px 0 30px
    }

    .seotr-txt {
        width: 100%;
        border-radius: 0;
        min-height: 200px
    }

    .seotr-graph {
        -webkit-transform: scale(0.49) translateX(-103%);
        transform: scale(0.49) translateX(-103%);
        bottom: -110px
    }

    .section02 .seotr-graph {
        bottom: -106px
    }

    .result-box-alt {
        width: 100%
    }

    .marketing-pg .bg.full-height {
        background-position: 250px 0
    }

    .infoboxes .item:nth-child(odd) .frame {
        padding-left: 20px
    }

    .infoboxes .item:nth-child(even) .frame {
        padding-right: 20px
    }

    .infoboxes .item img {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        margin: 0 -20px -20px !important
    }

    .feat-expanded-section .exp-bg {
        background-size: 1000px auto
    }

    .feat-expanded-section .exp-bg.aol {
        background-size: 700px auto
    }

    .feat-content {
        text-align: center
    }

    .feat-gallery-images, .feat-txt-holder {
        text-align: left
    }

    .feat-brand {
        height: 100px
    }

    .feat-brand:after, .toysrus .feat-brand:after {
        -webkit-transform: scale(.6) translate(-83%, -83%);
        transform: scale(.6) translate(-83%, -83%)
    }

    .feat-txt-holder .feat-brand:after {
        margin: 0
    }

    .mem .feat-brand:after {
        -webkit-transform: scale(.5) translate(-83%, -98%);
        transform: scale(.5) translate(-83%, -98%)
    }

    .feat-gallery {
        -webkit-transform: scale(.9);
        transform: scale(.9);
        margin: 80px -26px 0;
        display: inline-block
    }

    .baac-slider-bottom .btn-launch {
        margin-left: 0;
        top: 100px;
        left: auto;
        right: 25px
    }

    .rank-section .rs-box {
        font-size: 13px
    }

    .wh-top .page-intro-title {
        font-size: 30px;
        line-height: 27px
    }

    .wh-date {
        font-size: 20px
    }

    .webinars-holder .wh-form {
        margin-top: -245px
    }

    .video-production-section .ow-item {
        margin-right: 5px
    }

    .obtained-section .os-item .alignleft, .obtained-section .os-item .alignright {
        float: none;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
        margin-bottom: 20px
    }

    .os-text {
        max-width: 100%
    }

    .mdt-holder .visible-for-mobile {
        display: block
    }

    .mobile-date-table {
        display: none
    }

    .expanded-mode h3, .expanded-mode h4 {
        font-size: 40px
    }

    .ti-item, .ti-item:first-child, .ti-item:last-child {
        display: inline-block;
        width: 30%;
        text-align: center;
        padding: 0 5px 10px
    }

    .custom-list-first, .custom-list-second {
        float: none;
        padding: 0
    }

    .mdt-holder .visible-for-mobile.btn-simple {
        display: none
    }

    .ps-content {
        position: relative;
        z-index: 10
    }

    #slider_full-width {
        padding: 0;
        position: relative
    }

    #slider_full-width:after, #slider_full-width:before, .ps-content:after, .ps-content:before {
        position: absolute;
        top: 0;
        left: 0;
        width: 32px;
        height: 100%;
        content: "";
        background: 0 0;
        z-index: 10
    }

    #slider_full-width:after, .ps-content:after {
        left: auto;
        right: 0
    }

    .ps-content:after, .ps-content:before {
        margin-top: 115px;
        width: 52px
    }

    .psc-lead h3 {
        font-size: 32px
    }

    #slider_full-width .bx-wrapper {
        position: relative;
        padding-left: 10px;
        padding-right: 10px
    }

    #button_container .btn-simple-blue {
        font-size: 12px;
        padding-left: 30px;
        padding-right: 30px
    }

    #slider_full-width .bx-controls-direction {
        display: none
    }

    #slider_full-width .sfw-slide-frame {
        padding: 30px 0 0 50px
    }

    #slider_full-width .bx-pager {
        display: block;
        overflow: hidden;
        width: 100%;
        text-align: center;
        position: absolute;
        top: 20px;
        left: 0
    }

    #slider_full-width .bx-pager-item {
        font-size: 0;
        display: inline-block
    }

    #slider_full-width .bx-pager-item a {
        width: 15px;
        height: 15px;
        border-radius: 15px;
        text-indent: -9999px;
        overflow: hidden;
        background: #dadada;
        margin-right: 3px;
        display: inline-block
    }

    #slider_full-width .bx-pager-item a.active, #slider_full-width .bx-pager-item a:hover {
        background: #035F88
    }

    .sfw-slide-frame h3 span {
        width: 40px;
        left: -50px
    }

    .fvs-container {
        margin: 0
    }

    .video-embed-overlay {
        display: none
    }

    .video-overlay-mob {
        display: block
    }

    .sub-video-boxes {
        margin: -26px 0 0;
        padding-left: 26px;
        padding-right: 26px
    }

    .sv-box {
        padding: 10px 5px
    }

    .sv-box h3 {
        font-size: 15px;
        min-height: 36px;
        margin: 0 0 3px
    }

    .sv-box p {
        display: none
    }

    .sv-box .more-link {
        font-size: 11px;
        white-space: nowrap
    }

    .sv-box .more-link:after {
        display: none
    }

    .fvs-thumbs {
        padding-left: 26px;
        padding-right: 26px
    }

    .fvs-box {
        margin: 0 0 35px;
        width: 100%
    }

    .fvs-box p {
        padding-bottom: 10px
    }

    .categories-testim .person-txt {
        border-bottom: none;
        border-radius: 10px 10px 0 0;
        padding-bottom: 0;
        box-shadow: none
    }

    .categories-testim .person-txt::before {
        left: 15px
    }

    .categories-testim .person-txt .person-txt-item {
        padding: 25px 25px 15px 68px;
        max-height: none
    }

    .categories-testim .person-info {
        background: #fff;
        border: 1px solid #cbcbcb;
        border-top: none;
        border-radius: 0 0 10px 10px;
        margin: -1px 0 0;
        position: relative;
        max-width: 100%;
        text-align: right;
        padding: 0 25px 35px
    }

    .choose-agency-cont {
        margin: 21px 15px 0
    }

    .choose-agency-cont li {
        position: static;
        max-width: 350px;
        margin: auto
    }

    .choose-agency-cont h3 {
        position: relative;
        top: 0 !important;
        left: 0 !important;
        width: 100%;
        text-align: left;
        padding: 9px 0 8px 24px;
        height: auto
    }

    .choose-agency-cont h3 span {
        position: static
    }

    .choose-agency-cont h3:after {
        content: "";
        background: url("../images/top-digital/arrows.png") no-repeat;
        width: 14px;
        height: 14px;
        position: absolute;
        right: 20px;
        top: 12px
    }

    .choose-agency-cont li:nth-child(1) h3:after {
        background-position: 0 0
    }

    .choose-agency-cont li:nth-child(2) h3:after {
        background-position: 0 -15px
    }

    .choose-agency-cont li:nth-child(3) h3:after {
        background-position: 0 -30px
    }

    .choose-agency-cont li:nth-child(4) h3:after {
        background-position: 0 -45px
    }

    .choose-agency-cont li:nth-child(5) h3:after {
        background-position: 0 -60px
    }

    .choose-agency-cont li.active:nth-child(1) h3:after {
        background-position: -14px 0
    }

    .choose-agency-cont li.active:nth-child(2) h3:after {
        background-position: -14px -15px
    }

    .choose-agency-cont li.active:nth-child(3) h3:after {
        background-position: -14px -30px
    }

    .choose-agency-cont li.active:nth-child(4) h3:after {
        background-position: -14px -45px
    }

    .choose-agency-cont li.active:nth-child(5) h3:after {
        background-position: -14px -60px
    }

    .choose-agency-cont .left {
        float: none;
        margin: 0 0 60px
    }

    .choose-agency-cont .left-sub {
        width: 100%;
        font-size: 18px;
        line-height: 22px;
        min-height: 100px;
        border-radius: 0;
        padding-top: 20px
    }

    .choose-agency-cont .right {
        position: static;
        margin: 0 auto -65px;
        max-width: 100%;
        width: 180px
    }

    .choose-agency-cont .tabs-cont {
        margin: 0 0 93px;
        display: none
    }

    .choose-agency-cont li.active .tabs-cont {
        display: block
    }

    .choose-agency-cont .cont {
        padding: 25px 20px 10px;
        margin: 0;
        overflow: visible;
        clear: both;
        font-size: 14px;
        line-height: 20px
    }

    .featured-work-fullscreen .expanded-mode {
        margin-bottom: 25px
    }

    .featured-work-fullscreen .expanded-mode .ecg-image-box {
        float: none;
        width: 100%
    }

    .gallery-space-hold {
        margin-left: 0
    }

    .featured-work-fullscreen .ec-fs-descr {
        float: none;
        width: 100%;
        padding: 5px 20px 50px
    }

    .ec-fs-logo, .featured-work-fullscreen .expanded-mode .thumbnails-desktop {
        display: none
    }

    .featured-work-fullscreen .expanded-mode .thumbnails-mobile {
        display: block
    }

    .ec-fs-intro {
        font-size: 20px
    }

    .featured-work-fullscreen .expand-close {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 106px;
        height: 26px;
        padding: 0 32px 0 20px;
        text-indent: 0;
        text-align: center;
        font: 15px/24px roboto-bold-webfont, sans-serif;
        color: #858585;
        background: #fff;
        border: 1px solid #d8d8d8;
        border-radius: 4px
    }

    .featured-work-fullscreen .expand-close:after, .featured-work-fullscreen .expand-close:before {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        content: "";
        background: #858585;
        border-radius: 50%;
        opacity: 1;
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .featured-work-fullscreen .expand-close:after {
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    .featured-work-fullscreen .expand-close:after, .featured-work-fullscreen .expand-close:before {
        width: 8px;
        height: 3px
    }

    .featured-work-fullscreen .expand-close:before {
        right: 15px;
        left: auto
    }

    .featured-work-fullscreen .expand-close:after {
        right: 19px;
        left: auto
    }

    .full-services-section {
        padding: 50px 6px 40px
    }

    .full-services-section h2 {
        font-size: 30px;
        margin: 0 0 20px
    }

    .services-tabs {
        margin: 0 0 15px
    }

    .services-tabs:before {
        top: 34px;
        width: 74%;
        height: 12px
    }

    .services-tabs li {
        padding-top: 84px
    }

    .fss-step-number {
        width: 78px;
        height: 78px
    }

    .fss-step-number strong {
        width: 66px;
        height: 66px
    }

    .active .fss-step-number strong {
        width: 78px;
        height: 78px
    }

    .fss-step-number strong:after, li:nth-child(2) .fss-step-number strong:before {
        height: 12px;
        margin-top: -6px
    }

    .fss-step-number em {
        width: 52px;
        height: 52px;
        font-size: 33px;
        line-height: 52px
    }

    .active .fss-step-number em {
        width: 64px;
        height: 64px;
        line-height: 64px
    }

    .tab-text {
        : roboto-medium-webfont;
        font-size: 13px;
        padding: 0
    }

    .progress-filler {
        margin: 0 0 20px
    }

    .progress-active {
        margin-left: -13px;
        border-left: 13px solid transparent;
        border-right: 13px solid transparent;
        border-top: 10px solid #88ba00
    }

    .tabs-content {
        padding: 0 10px
    }

    .tabs-column {
        font-size: 13px
    }

    .tabs-column:first-child {
        font-size: 19px
    }

    .feat-expanded-section .tab-lnk {
        width: 47%
    }

    .featured-work-fullscreen .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.4);
        transform: translate(-50%, -50%) scale(.4)
    }

    .featured-work-fullscreen .fwb-item > a:hover .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.5);
        transform: translate(-50%, -50%) scale(.5)
    }

    .download-lnk .icon {
        -webkit-transform: scale(.85);
        transform: scale(.85);
        width: 5px;
        top: -3px
    }

    .download-lnk, .foot-area .btn-raq {
        font-size: 14px
    }

    .foot-area .btn-raq:after {
        font-size: 22px;
        bottom: 1px
    }

    .location-area .loc-visual {
        display: none
    }

    .loc-phone, .loc-phone:after {
        display: inline-block
    }

    .location-area {
        text-align: center
    }

    .location-area .t-holder {
        margin: 0
    }

    .home-company-logos-wrapper .home-company-logos-content li {
        margin: 0 -4px
    }

    .home-company-logos-content .cl-toys {
        left: 5px
    }

    .tabs-frame {
        margin-top: 0;
        background: 0 0;
        text-align: center
    }

    .tabs-visual {
        margin: 0;
        display: inline-block;
        width: auto;
        border-bottom: 4px solid #90c404
    }

    .tabs-visual .item {
        width: 100px;
        display: inline-block;
        border: none;
        border-radius: none
    }

    .tabs-visual .item:first-child {
        border: none
    }

    .tabs-visual .item:nth-last-child(2) {
        border-radius: 0 4px 0 0
    }

    .tabs-txt {
        width: 100%;
        display: block;
        border-radius: 4px;
        background: #fff;
        margin-top: -20px;
        padding: 45px 20px 30px
    }

    .tabs-visual .item > a {
        padding: 0;
        height: 100px
    }

    .tabs-visual .ttl {
        display: none
    }

    .tabs-txt .ttl {
        display: block
    }

    .tabs-step {
        position: absolute;
        margin: 0;
        top: calc(100% + 4px);
        right: auto;
        left: 35px;
        height: auto;
        transition: left .2s linear;
        border-top: 10px solid #90c404;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent
    }

    .tabs-step:before {
        display: none
    }

    .tabs-txt .unit {
        text-align: left
    }

    .tabs-txt .unit li {
        font-size: 16px;
        padding: 5px 5px 5px 40px
    }

    .tabs-txt .unit li:before {
        font-size: 14px;
        height: 20px;
        min-width: 18px;
        top: 5px
    }

    .tabs-txt .unit h3 {
        font-size: 18px;
        margin-bottom: 10px
    }

    .tabs-txt .unit li:after {
        top: 10px;
        left: 18px;
        width: 11px;
        height: 11px
    }

    .wide-tabs-txt .scroll-content {
        height: auto
    }
}

@media only screen and (max-width: 737px) {
    .contact-pg .hs-sub-row {
        margin: 0 -20px 40px
    }

    .contact-pg .wh-detail--wrp .wh-form-holder .wh-form {
        margin: 0
    }
}

@media only screen and (max-width: 718px) {
    .baac-slider-bottom .btn-launch {
        margin-left: 0;
        top: 100px;
        left: auto;
        right: 25px
    }
}

@media only screen and (max-width: 700px) {
    .hnc-features-list.alt {
        width: 98%
    }

    .industry-section {
        padding: 25px 0 80px
    }

    .industry-section h1 {
        font-size: 30px
    }

    .industry-section .subheading {
        font-size: 14px;
        line-height: 1.6
    }

    .industry-section .list {
        padding: 0
    }

    .industry-expand-list li {
        width: 100%
    }

    .industry-section .list a {
        padding: 8px 6px;
        font-size: 14px
    }

    .industry-section .list a:before {
        margin-bottom: 0;
        min-height: 58px;
        -webkit-transform: scale(0.58);
        transform: scale(0.58)
    }

    .button {
        padding: 13px 12px;
        font-size: 16px
    }

    .button.close:after {
        top: 7px;
        right: 10px
    }

    .button.close:before {
        right: 18px;
        top: 18px
    }

    .industry-section .button {
        bottom: -20px
    }
}

@media only screen and (max-width: 646px) {
    .wide-expanded-section .biowars-mob-slide .brand {
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-79%);
        transform: scale(.6) translateX(-79%)
    }

    .wide-expanded-section .biowars-mob-slide, .wide-expanded-section .expanded-mode .biowars-mob-slide .t-cell {
        display: block;
        width: 100%
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 280px
    }

    .wide-expanded-section .biowars-mob-slide .holder {
        margin: 0;
        position: absolute;
        top: 20px;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-84%);
        transform: scale(.6) translateX(-84%)
    }

    .video-frame .sub-caption {
        margin-top: -38px;
        font-size: 18px
    }

    .video-frame .wvs-play-video {
        top: -38px
    }

    .services-wide-list {
        padding: 20px 0
    }

    .service-wide-item {
        padding-top: 0
    }

    .service-wide-item h2 {
        font-size: 20px;
        position: relative;
        z-index: 2;
        margin-bottom: 10px
    }

    .sw-description p {
        min-height: 0 !important;
        margin-bottom: 15px
    }

    .sw-description {
        font-size: 13px
    }

    .bullet-service-list {
        font-size: 15px;
        padding: 60px 0 0;
        display: inline-block;
        max-width: 320px
    }

    .bullet-service-list > li {
        padding-right: 20px;
        padding-left: 52px
    }

    .bullet-service-list li:before {
        font-size: 26px;
        line-height: 13px
    }

    .sw-logo {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        margin-bottom: -40px
    }

    .service-wide-item {
        display: block;
        width: 100%
    }

    .top-section .s-left h1 {
        font-size: 30px
    }

    .top-section .s-left {
        padding: 3% 10px 0
    }

    .top-section .bg {
        background: 0 0
    }

    .top-section .s-right {
        padding: 50px 0 65px;
        background-repeat: no-repeat;
        background-position: 50% 0;
        min-height: 205px
    }

    .ourwork-pg .top-section .s-right {
        background-image: url("../images/bg/bg-portfolio-m.png")
    }

    .services-pg .top-section .s-right {
        background-image: url("../images/bg/bg-services-m.png")
    }

    .sitecore-pg .top-section .s-right {
        background-image: url("../images/bg/bg-sitecore-m.png");
        margin-top: -20px;
        min-height: 305px
    }

    .magento-pg .top-section .s-right {
        background-image: url("../images/bg/bg-magento-m.png");
        margin-top: -5px;
        min-height: 310px
    }

    .wp-pg .top-section .s-right {
        background-image: url("../images/bg/bg-wp-m.png");
        margin-top: 10px
    }

    .seo-pg .top-section .s-right {
        background-image: url("../images/bg/bg-seo-m.png")
    }

    .drupal-pg .top-section .s-right {
        background-image: url("../images/bg/bg-drupal-m.png");
        margin-top: 10px
    }

    .joomla-pg .top-section .s-right {
        background-image: url("../images/bg/bg-joomla-m.png");
        margin-top: 10px
    }

    .develop-pg .top-section .s-right {
        background-image: url("../images/bg/bg-develop-m.png");
        min-height: 264px
    }

    .wm-pg .top-section .s-right {
        background-image: url("../images/bg/bg-webmodulite-m.png");
        margin-top: 10px;
        min-height: 300px
    }

    .marketing-pg .top-section .s-right {
        background-image: url("../images/bg/bg-marketing-m.png");
        min-height: 265px
    }

    .cr-design-pg .top-section .s-right {
        background-image: url("../images/bg/bg-services-design-m.png");
        min-height: 265px;
        margin-bottom: -40px
    }

    .ecommerce-pg .top-section .s-right {
        background-image: url("../images/ecommerce/bg-ecommerce-m.png");
        min-height: 169px
    }

    .consult-pg .top-section .s-right {
        background-image: url("../images/bg/bg-consult-m.png");
        min-height: 225px;
        margin: 0 0 -10px
    }

    .biowars-section1 .s-right {
        background-image: url("../images/case-studies/biowars/bg-section01-m.png");
        min-height: 270px;
        margin: 0 0 10px
    }

    .biowars-section2 .s-right {
        background-image: url("../images/case-studies/biowars/bg-section02-m.png");
        min-height: 270px;
        margin: -20px 0 10px
    }

    .biowars-section3 .s-right {
        background-image: url("../images/case-studies/biowars/bg-section03-m.png");
        min-height: 344px;
        margin: -30px 0 20px
    }

    .biowars-section4 .s-right {
        background-image: url("../images/case-studies/biowars/bg-section04-m.png");
        min-height: 240px
    }

    .biowars-section5 .s-right {
        background-image: url("../images/case-studies/biowars/bg-section05-m.png");
        min-height: 205px
    }

    .johnjay-section1 .s-right {
        background-image: url("../images/case-studies/johnjay/bg-section01-m.jpg");
        min-height: 320px
    }

    .johnjay-section2 .s-right {
        background-image: url("../images/case-studies/johnjay/bg-section02-m.png");
        min-height: 348px;
        margin: -10px 0 10px
    }

    .johnjay-section3 .s-right {
        background-image: url("../images/case-studies/johnjay/bg-section03-m.png");
        min-height: 234px;
        margin: -10px 0 20px
    }

    .johnjay-section4 .s-right {
        background-image: url("../images/case-studies/johnjay/bg-section04-m.png");
        min-height: 271px
    }

    .johnjay-section5 .s-right {
        background-image: url("../images/case-studies/johnjay/bg-section05-m.png");
        min-height: 352px
    }

    .medcpu-section1 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section01-m.jpg");
        min-height: 352px
    }

    .medcpu-section2 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section02-m.jpg");
        min-height: 286px
    }

    .medcpu-section3 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section03-m.png");
        min-height: 326px
    }

    .medcpu-section4 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section04-m.png");
        min-height: 363px
    }

    .medcpu-section7 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section05-m.png");
        min-height: 430px
    }

    .medcpu-section5 .s-right {
        background-image: url("../images/case-studies/medcpu/bg-section06-m.png");
        min-height: 210px
    }

    .dance-section1 .s-right {
        background-image: url("../images/case-studies/dance/bg-section01-m.png");
        min-height: 350px
    }

    .dance-section2 {
        background-color: #000
    }

    .dance-section2 .s-right {
        background-image: url("../images/case-studies/dance/bg-section02-m.png");
        min-height: 300px
    }

    .dance-section3 .s-right {
        background-image: url("../images/case-studies/dance/bg-section03-m.png");
        min-height: 252px
    }

    .dance-section4 .s-right {
        background-image: url("../images/case-studies/dance/bg-section04-m.jpg");
        min-height: 256px;
        background-position: 100% 100%
    }

    .dance-section5 .s-right {
        background-image: url("../images/case-studies/dance/bg-section05-m.png");
        min-height: 300px
    }

    .dance-section6 .s-right {
        background-image: url("../images/case-studies/dance/bg-section06-m.png");
        min-height: 234px
    }

    .btb-section1 .s-right {
        background-image: url("../images/case-studies/btb/bg-section01-m.png");
        min-height: 321px
    }

    .btb-section2 .s-right {
        background-image: url("../images/case-studies/btb/bg-section02-m.jpg");
        min-height: 320px
    }

    .case-pg .top-section.btb-section2 .bg.cover {
        background: 0 0
    }

    .btb-section3 .s-right {
        background-image: url("../images/case-studies/btb/bg-section03-m.png");
        min-height: 305px
    }

    .btb-section4 .s-right {
        background-image: url("../images/case-studies/btb/bg-section04-m.jpg");
        min-height: 305px
    }

    .btb-section5 .s-right {
        background-image: url("../images/case-studies/btb/bg-section05-m.png");
        min-height: 255px
    }

    .btb-section6 .s-right {
        background-image: url("../images/case-studies/btb/bg-section06-m.jpg");
        min-height: 311px
    }

    .leon-section1 .bg {
        background-image: url("../images/case-studies/leon-group/bg-section01-m.jpg");
        min-height: 420px
    }

    .leon-section2 {
        background-image: none
    }

    .leon-section2 .s-right {
        background-image: url("../images/case-studies/leon-group/bg-section02-m.png");
        background-position: 50% 25%;
        background-size: auto 75%;
        min-height: 317px
    }

    .leon-section3 .s-right {
        background-image: url("../images/case-studies/leon-group/bg-section03-m.png");
        min-height: 365px
    }

    .leon-section4 .s-right {
        background-image: url("../images/case-studies/leon-group/bg-section04-m.png");
        min-height: 283px
    }

    .leon-section5 .s-right {
        background-image: url("../images/case-studies/leon-group/bg-section05-m.png");
        min-height: 255px
    }

    .leon-section6 .bg {
        background-image: url("../images/case-studies/leon-group/bg-section06-m.jpg");
        min-height: 520px
    }

    .logo-pg .s-right {
        background-image: url("../images/logo-design/bg-logo-m.png");
        min-height: 290px;
        padding-bottom: 10px
    }

    .main-section .s-left .johnjay-ttl {
        margin: -50px auto -30px
    }

    .main-section .s-left .medcpu-ttl {
        margin: -40px -74px 10px
    }

    .main-section .s-left .btb-ttl, .main-section .s-left .dance-ttl, .main-section .s-left .leon-ttl {
        margin: -30px -119px 10px;
        -webkit-transform: scale(0.5);
        transform: scale(0.5)
    }

    .main-section .s-left .leon-ttl {
        margin: -60px -87px -30px
    }

    .main-section .s-left .btb-ttl {
        margin: -70px -107px -40px
    }

    .top-section .s-left, .top-section .s-right {
        display: block;
        width: 100%;
        height: auto
    }

    .leon-section6 .frame::after {
        width: 100%;
        left: 0;
        opacity: .6
    }

    .leon-section1 .s-right, .leon-section6 .s-right {
        display: none
    }

    .top-section:not(.main-section) .s-left {
        width: 100% !important
    }

    .case-pg .top-section .s-left {
        height: auto
    }

    .case-pg .main-section .s-left {
        width: 320px;
        margin: 0 auto;
        text-align: center
    }

    .case-pg .btb-section1 .ttl-box {
        top: 0
    }

    .top-section .s-left .biowars-ttl {
        position: static;
        margin: -88px -162px -79px
    }

    .feat-txt .btn-holder {
        text-align: center;
        padding: 15px 0 10px;
        margin-top: 20px
    }

    .widefeat-txt .btn-holder {
        text-align: left
    }

    .feat-txt .btn-raq {
        margin: 0 0 15px
    }

    .feat-txt .btn-holder br {
        display: block
    }

    .widefeat-txt .btn-holder br {
        display: none
    }

    .feat-txt .btn-green {
        float: none;
        display: inline-block
    }

    .feat-txt {
        padding: 15px;
        font-size: 13px
    }

    .feat-txt p {
        margin-bottom: 10px
    }

    .feat-txt h5 {
        font-size: 17px;
        margin-bottom: 10px
    }

    .button-close {
        width: 39px;
        height: 47px
    }

    .button-close:after, .button-close:before {
        width: 24px;
        height: 3px
    }

    .feat-gallery {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin: 50px -56px -56px
    }

    .wrapper {
        
    }

    .header {
        border-top: 0;
        padding-top: 59px;
        padding-bottom: 0;
        height: 102px
    }

    .head-r-side {
        float: none !important
    }

    .head-top {
        position: absolute;
        top: 0;
        left: 0;
        margin: 0;
        width: 100%;
        max-width: 100%;
        height: 44px;
        background: #0078ae;
        float: none;
        padding: 4px 0 0
    }

    .ht-nav li {
        padding: 0
    }

    .ht-simplemenu .phone {
        border-left: 0;
        margin-right: 12px;
        color: #fff
    }

    .ht-simplemenu .phone:hover {
        color: #fff !important
    }

    .ht-simplemenu .phone a {
        text-decoration: none;
        color: #fff
    }

    .ht-simplemenu .phone em {
        background-position: -268px 0
    }

    .search-line {
        border: 0
    }

    .header .nav li .btn-h-request {
        top: 6px;
        right: 170px;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2EyZDkwYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4OWJiMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top, rgba(162, 217, 12, 1) 0, rgba(137, 187, 0, 1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(162, 217, 12, 1)), color-stop(100%, rgba(137, 187, 0, 1)));
        background: -webkit-linear-gradient(top, rgba(162, 217, 12, 1) 0, rgba(137, 187, 0, 1) 100%);
        background: linear-gradient(to bottom, rgba(162, 217, 12, 1) 0, rgba(137, 187, 0, 1) 100%)
    }

    .header .nav li .btn-h-request:hover {
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzg5YmIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMmQ5MGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top, rgba(137, 187, 0, 1) 0, rgba(162, 217, 12, 1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(137, 187, 0, 1)), color-stop(100%, rgba(162, 217, 12, 1)));
        background: -webkit-linear-gradient(top, rgba(137, 187, 0, 1) 0, rgba(162, 217, 12, 1) 100%);
        background: linear-gradient(to bottom, rgba(137, 187, 0, 1) 0, rgba(162, 217, 12, 1) 100%)
    }

    .header .nav li .link-arrow {
        top: 7px;
        color: #FFF !important;
        right: auto;
        left: 7px;
        font-size: 13px;
        padding: 3px 22px 3px 12px !important;
        box-shadow: 0 -1px 0 #c9e973, 0 1px 0 #5e8900;
        border-radius: 18px;
        background: 0 0/100% 100% #95c906;
        background: -moz-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a2d90c), color-stop(100%, #89bb00)) 0 0/100% 100%;
        background: -webkit-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
        background: -ms-linear-gradient(top, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
        background: linear-gradient(to bottom, #a2d90c 0, #89bb00 100%) 0 0/100% 100%;
        -webkit-transition: all .4s linear;
        transition: all .4s linear
    }

    .header .nav li .link-arrow:hover {
        background-position: 0 -200%;
        background-size: 100% 200%;
        color: #fff
    }

    .header .nav li .link-arrow:after, .header .nav li .link-arrow:hover:after {
        border-color: #fff !important
    }

    .header .nav .link-more {
        border-left: 0;
        top: 3px;
        right: 158px;
        white-space: nowrap;
        color: #fff !important
    }

    .ht-simplemenu .search {
        position: absolute;
        right: 15px;
        bottom: -42px;
        width: 23px;
        height: 24px;
        background-position: -222px 0;
        margin: 0;
        overflow: visible
    }

    .ht-simplemenu .search:before {
        border-left: 1px solid #dadada;
        content: "";
        height: 36px;
        position: absolute;
        top: -6px;
        left: -14px;
        width: 0
    }

    .menu-title {
        border-width: 44px 0 0;
        height: 101px
    }

    .menu-title .open-m-menu {
        margin-top: 14px
    }

    .search-active {
        padding-bottom: 102px !important
    }

    .search-field {
        bottom: -105px
    }

    .header {
        -webkit-transition: top .4s ease-out;
        -moz-transition: top .4s ease-out;
        transition: top .4s ease-out
    }

    .h-animated {
        top: -41px
    }

    .ht-simplemenu .search:hover {
        background-position: -570px -287px
    }

    .mm-opened .b-animated .wrapper {
        padding-top: 61px
    }

    html.mm-opened .b-animated .menu-title {
        height: 61px;
        border-top-width: 3px
    }

    .serve-all-industries-content .mobile-sep {
        display: block !important;
        text-indent: -9999px;
        height: 5px
    }

    .serve-all-industries-content .saic-main-list-mob li {
        padding: 0 3px;
        font-size: 15px
    }

    .serve-all-industries-content .saic-main-list-mob .sep {
        margin: 0 3px
    }

    .serve-all-industries-content .saic-main-list-mob .sep:nth-child(10), .serve-all-industries-content .saic-main-list-mob .sep:nth-child(6) {
        display: block;
        font-size: 0;
        line-height: 0;
        color: transparent;
        height: 2px;
        margin: 6px -2px;
        background: #fff
    }

    .obc-columns .obcc-column {
        width: 93%;
        margin: 0 auto 25px;
        float: none
    }

    .obcc-column .blog-date {
        left: 50%;
        margin-left: -35px
    }

    .p-add-padding {
        padding-left: 0;
        padding-right: 0
    }

    .hnc-features-list {
        width: 84%
    }

    .cs-site-screen {
        max-width: 200px
    }

    .section-title {
        margin-bottom: 24px
    }

    .preview-columns {
        display: block;
        position: relative;
        padding: 0 0 300px
    }

    .preview-single-columns {
        padding-bottom: 148px
    }

    .preview-aside {
        display: block
    }

    .preview-before {
        margin: 0 auto 10px;
        width: 222px
    }

    .preview-info {
        margin: 0 0 0 -111px;
        position: absolute;
        bottom: 0;
        width: 222px;
        left: 50%
    }

    .arrow-from-to {
        width: 69px;
        height: 67px;
        background-position: 0 -45px;
        right: -5px;
        top: auto;
        bottom: -10px
    }

    .preview-aside {
        margin: 0 32px;
        width: auto;
        text-align: center
    }

    .preview-after {
        display: block;
        width: 290px;
        margin: 0 auto
    }

    .page-intro-text {
        padding-top: 0;
        padding-right: 10px;
        font-size: 21px
    }

    .blue-box-inner .ttl, .blue-box-inner h4, .text-section .blue-box-inner h4 {
        font-size: 28px
    }

    .whitepapers-section {
        padding-top: 60px;
        padding-bottom: 60px;
        text-align: center
    }

    .whitepapers-section h2 {
        float: none;
        width: 100%;
        font-size: 32px;
        margin: 0 0 20px
    }

    .whitepapers-section h2 br {
        display: none
    }

    .whitepaper-img {
        float: none;
        width: 100%;
        padding: 0 24px 16px
    }

    .whitepaper-descript {
        width: 100%;
        padding: 0
    }

    .see-all-large {
        margin-top: 38px
    }

    .whitepapers-section .btn-simple {
        font-size: 16px;
        padding-left: 10px;
        padding-right: 10px
    }

    .certify-item, .certify-item:first-child {
        padding-left: 10px;
        padding-right: 10px
    }

    .certify-item img {
        width: 100%
    }

    .page-intro-title {
        font-size: 28px
    }

    .intro-fl-image {
        max-width: 216px
    }

    .intro-block-no-bd p, .intro-block-services-landing p {
        font-size: 20px
    }

    .sc-logo {
        width: 123px;
        margin-right: 30px
    }

    .sc-descript h2 {
        line-height: 1
    }

    .cd-chapter, .cd-chapter.pad-r-64 {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0 0 44px
    }

    .cd-logo {
        float: none;
        width: 100%;
        margin: 0 0 14px
    }

    .cd-descript {
        margin: 0 auto;
        max-width: 480px
    }

    .our-work-section {
        padding-bottom: 82px
    }

    .ow-items {
        padding-right: 0
    }

    .ow-item {
        width: 100%;
        display: block;
        margin: 0 0 30px
    }

    .ow-items-diff-sizes .ow-item {
        display: inline-block
    }

    .our-work-section .see-all-large-blue {
        margin-top: 0
    }

    .services-before-after-section .section-title {
        margin-bottom: 32px
    }

    .team-slider {
        max-width: 290px
    }

    .slide-post {
        margin-left: 0
    }

    .page-intro-form {
        text-align: center
    }

    .page-intro-form .page-intro-title, .page-intro-form p {
        padding-right: 0
    }

    .aside-form-box {
        float: none;
        margin: 0 auto 24px
    }

    .aside-form-box.afb__1 {
        margin: 0 auto 24px
    }

    .page-navigation-float {
        display: none
    }

    .page-intro-form .custom-list {
        text-align: left;
        max-width: 300px;
        margin-left: auto;
        margin-right: auto
    }

    .branch-item {
        display: block;
        width: 100%;
        max-width: 400px;
        padding: 50px 16px 0;
        margin: 0 auto
    }

    .branch-item:first-child {
        padding-top: 0
    }

    .dif-logos-list li {
        width: 31%
    }

    .dif-logos-list img {
        max-width: 63%
    }

    .member-item {
        width: 100%;
        max-width: 290px
    }

    .employ-nav {
        padding-bottom: 25px
    }

    .switch-section li {
        width: 118px;
        margin: 0 0 0 22px
    }

    .switch-section li:first-child {
        margin-left: 0
    }

    .switch-section strong {
        float: none;
        display: block;
        margin: 0 0 12px
    }

    .pi-left-col {
        float: none;
        width: 100%;
        text-align: center;
        padding-bottom: 20px
    }

    .rounded-box {
        width: auto;
        float: none;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding-top: 15px;
        padding-bottom: 15px;
        height: auto;
        margin: 0 -22px
    }

    .branch-item-dif, .branch-item-dif:first-child {
        padding-top: 50px
    }

    .at-item, .at-item:nth-child(2n) {
        margin-left: 0;
        width: 100%;
        display: block
    }

    .at-item .testimonial {
        width: auto;
        max-width: 100%
    }

    .at-item .testimonial .ti-content:before {
        left: -12px
    }

    .industries-intro-block {
        margin-bottom: 20px
    }

    .industries-intro-block .intro-fl-image {
        max-width: 50%
    }

    .text-section-pd p {
        padding-left: 0;
        padding-right: 0
    }

    .pp-row {
        padding: 30px 0;
        text-align: center
    }

    .pp-icon, .pp-nb-col {
        display: inline-block;
        vertical-align: middle;
        width: auto;
        padding: 0 10px
    }

    .pp-descript {
        display: block;
        width: 100%;
        padding: 20px 0 0;
        clear: both
    }

    .fancy-list-grey {
        font-size: 14px
    }

    .fancy-list-grey .fl-item {
        padding-left: 36px;
        padding-right: 5px;
        text-align: left
    }

    .cf-item, .cf-item:nth-child(5n) {
        width: 110px;
        height: 110px;
        margin: 0 4px 10px
    }

    .cf-item span {
        font-size: 12px
    }

    .cf-item img {
        max-width: 46px
    }

    .cms-spec-item .frame {
        padding-left: 240px
    }

    .cms-spec-item:nth-child(2n) .frame {
        padding-right: 240px
    }

    .page-intro-center {
        padding-left: 0;
        padding-right: 0
    }

    .baac-row .baac-hidden-item-content h4 {
        font-size: 45px
    }

    .baac-row .baac-slider-bottom {
        text-align: center
    }

    .baac-row .baac-arrow {
        top: 35.09005628517824%
    }

    .baac-row .baac-slider-tn, .baac-row .baac-slider-tn ul li {
        float: none
    }

    .baac-row .baac-slider-tn ul li {
        margin-right: 0;
        margin-left: 9px
    }

    .baac-row .baac-slider-tn ul li:first-child {
        margin: 0
    }

    .baac-row .baac-slider-tn ul li {
        display: inline-block
    }

    .baac-slider-bottom .btn-launch {
        display: inline-block;
        position: relative;
        top: 0;
        left: 0
    }

    .btn-launch-holder {
        padding: 34px 0 43px
    }

    .baac-slider-bottom .btn-green {
        margin: 0;
        float: none;
        display: inline-block
    }

    .contact-holder {
        padding-top: 10px
    }

    .ch-form .ff-checkbox label {
        padding-right: 10px
    }

    .contact-holder .ch-form {
        margin-bottom: 50px
    }

    .contact-holder .frame {
        background-position: 68% 0
    }

    .ch-contacts-details, .contact-holder .ch-form {
        float: none;
        width: auto
    }

    .contact-holder .frame {
        background: 0 0
    }

    .contact-list .phone {
        margin-bottom: 42px
    }

    .contact-list li {
        min-height: 80px
    }

    .contact-list {
        margin-bottom: 0
    }

    .hiring-box {
        margin: 0
    }

    .tpp-heading {
        font-size: 19px;
        line-height: 24px
    }

    .tpp-heading h1 {
        font-size: 28px;
        line-height: 1.3
    }

    .rank-section, .what-you-get-section {
        padding-top: 0;
        padding-left: 0;
        padding-right: 0
    }

    .wyg-form-box {
        position: static;
        width: auto;
        padding-bottom: 70px
    }

    .rq-logos-box {
        float: none;
        width: auto;
        padding: 30px 0 15px;
        margin: 0;
        text-align: center
    }

    .rq-logos-box img:not(:last-child) {
        max-width: 50%;
        margin: 0 auto 30px
    }

    .rank-section .rs-box {
        float: none;
        width: auto;
        padding-top: 26px;
        padding-left: 6px;
        padding-right: 6px
    }

    .tpp-arrow-down:before {
        display: none
    }

    .tpp-arrow-down {
        padding-right: 0
    }

    .top-page-panel-visible .tpp-arrow-text, .top-page-panel-visible .tpp-heading {
        padding-bottom: 0
    }

    .top-page-panel-visible .tpp-heading {
        padding: 10px 26px 0
    }

    .top-page-panel-visible {
        padding-top: 10px
    }

    .wh-add-ttl.top-page-panel-visible {
        padding: 7px;
        margin: 0
    }

    .search-top-page-panel {
        margin-top: 0
    }

    .wyg-form-box .f-row {
        padding-left: 6px;
        margin-right: 6px
    }

    .rank-section, .what-you-get-section {
        padding-bottom: 20px
    }

    .wh-press, .wh-press:first-child, .wh-press:last-child {
        float: none;
        width: auto
    }

    .wh-press:first-child {
        margin: 0 0 100px
    }

    .wh-form, .wh-form-holder, .wh-infobox, .whi-content {
        float: none;
        width: auto
    }

    .webinars-holder .wh-infobox {
        text-align: center
    }

    .wh-top {
        text-align: center;
        float: none;
        width: 100%;
        padding-left: 26px;
        padding-right: 26px
    }

    .wh-top .page-intro-title {
        font-size: 28px;
        line-height: 27px;
        margin-bottom: 0
    }

    .wh-top .page-intro-title span {
        display: block
    }

    .wh-date {
        font-size: 20px
    }

    .wh-time {
        font-size: 17px
    }

    .webinars-holder .wh-section-1 {
        padding-bottom: 45px
    }

    .webinars-holder .wh-section-1, .webinars-holder .wh-section-2 {
        padding-left: 0;
        padding-right: 0
    }

    .webinar-section {
        min-height: 100px
    }

    .webinars-holder .wh-form, .webinars-holder .wh-form-holder, .webinars-holder .whi-content, .wh-add .wh-form, .wh-add .wh-form-holder, .wh-add .whi-content {
        margin: 0;
        width: auto;
        float: none
    }

    .webinars-holder .wh-form-holder {
        max-width: 500px;
        margin: 0 auto
    }

    .wh-add .wh-section-2 {
        padding-left: 0;
        padding-right: 0
    }

    .webinars-holder .whi-content, .wh-add .whi-content {
        padding-left: 26px;
        padding-right: 26px;
        margin-top: -30px
    }

    .wh-add .whi-content {
        margin-top: -50px
    }

    .webinars-holder .whi-content .wh-img, .wh-add .whi-content .wh-img {
        margin-left: auto;
        margin-right: auto;
        display: block
    }

    .wh-section-2 .wh-img {
        margin-bottom: 20px
    }

    .webinars-holder .hidden-for-mobile, .wh-add .hidden-for-mobile {
        display: none
    }

    .webinars-holder .wh-form-holder .visible-for-mobile, .wh-add .visible-for-mobile {
        display: block
    }

    .webinars-holder .wh-form .ch-form, .wh-add .wh-form .ch-form {
        padding-left: 15px;
        padding-right: 5px
    }

    .wh-add .wh-form .ch-form {
        padding-right: 15px;
        padding-top: 20px
    }

    .wh-add .ch-form .f-row .label {
        display: none
    }

    .wh-add .field-title .req {
        position: absolute;
        top: -4px;
        right: -16px
    }

    .wh-add .field-error .field-title .req {
        top: 14px
    }

    .wh-add ::-webkit-input-placeholder {
        color: #878a8c
    }

    .wh-add ::-moz-placeholder {
        color: #878a8c;
        opacity: 1
    }

    .wh-form-holder .ch-form .ff-submit {
        padding: 0;
        margin-bottom: -20px
    }

    .wh-add .wh-section-1 {
        text-align: center;
        padding-bottom: 60px
    }

    .wh-add .page-navigation-float {
        display: inline-block;
        float: none;
        margin: 0;
        font-size: 17px
    }

    .wh-add .wh-section-1 .page-navigation-float {
        display: none
    }

    .whf-content {
        padding: 30px 26px 0
    }

    .add-mobile-navigation {
        display: block
    }

    .whitepapers-holder .wh-section-2 {
        padding-bottom: 10px
    }

    .whitepapers-holder .wh-section-1, .whitepapers-holder .wh-section-3 {
        min-height: 50px;
        background: 0 0;
        border-color: transparent
    }

    .wh-form-holder .whf-title {
        font-size: 14px;
        margin-bottom: 20px
    }

    .wh-form-holder .whf-title span {
        display: none
    }

    .wh-form-holder .whf-title strong {
        font-size: 20px
    }

    .webinar-list {
        text-align: left
    }

    .webinar-archive-item {
        width: 48%
    }

    .title-detail, .web-full-post {
        padding-left: 14px;
        padding-right: 14px
    }

    .wh-breadcrumbs {
        padding: 0 14px 12px
    }

    .join-us-form-holder .jb-1 .fl, .join-us-form-holder .jb-1 .fr {
        float: none;
        width: auto
    }

    .jufh-box {
        width: auto
    }

    .vs-holder {
        padding-left: 0;
        padding-right: 0
    }

    .wide-video-holder {
        margin-left: 0;
        margin-right: 0
    }

    .web-full-post .wide-video-holder {
        margin-bottom: 20px
    }

    .vs-holder .vsh-box, .vs-holder .vsh-box:nth-child(2n) {
        margin-left: 0;
        margin-right: 0;
        width: 100%
    }

    .fancy-list-two li {
        display: block;
        width: 100%;
        max-width: 252px;
        margin-right: 0
    }

    .occ-2-items-columns .occc-column:nth-child(2), .occ-columns .occc-column {
        width: 400px;
        margin: 0 auto;
        text-align: center;
        float: none
    }

    .occc-column .client-photo {
        margin-bottom: -72px
    }

    .testimonial-frame .occc-column .client-photo {
        margin-bottom: -62px
    }

    .occ-columns .occc-column {
        background-size: 85%
    }

    .occc-column .client-photo img {
        width: 85%
    }

    .testimonial-hidden-row {
        margin-bottom: 20px
    }

    .st-column, .st-column:first-child {
        display: block;
        width: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .cms-single-section-top-indent {
        padding-top: 70px
    }

    .serve-all-industries-content .saic-main-list {
        width: 80%
    }

    .page-search-box {
        padding-right: 0
    }

    .ch-form.page-search-box .ff-btn-submit {
        position: static;
        display: block;
        margin: 10px auto 0;
        clear: both
    }

    .wh-presses {
        padding-left: 0;
        padding-right: 0
    }

    .step-content .img-right {
        display: block;
        margin: 0 auto 20px;
        float: none;
        max-width: 100%;
        height: auto
    }

    .steps-controls ul li {
        padding-bottom: 40px
    }

    .steps-controls .text {
        bottom: 17px
    }

    .video-presentation-section, .video-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .wide-video-holder {
        margin-bottom: 20px
    }

    #button_container .btn-simple-blue {
        display: block;
        margin: 0 26px 10px
    }

    #button_container .btn-simple-blue:last-child {
        margin-bottom: 0
    }

    .oms-item {
        float: none;
        width: auto;
        margin-bottom: 20px
    }

    .ps-nav .psn-item a {
        font-size: 20px;
        padding-top: 15px
    }

    .ps-nav .psn-item a em {
        display: none
    }

    .ps-nav .psn-item a.active em {
        display: inline
    }

    .ps-nav .psn-item {
        width: 16.2027027%
    }

    .ps-nav .psn-item:last-child {
        width: 17.1027027%
    }

    .ps-nav .psn-item-active {
        width: 36.827027%
    }

    .four-phases-slider .ps-nav .psn-item {
        width: 21.0576576%
    }

    .four-phases-slider .ps-nav .psn-item:last-child {
        width: 22.7777777%
    }

    .four-phases-slider .ps-nav .psn-item-active {
        width: 36.827027%
    }

    .ps-nav .psn-item-active:last-child {
        width: 37.827027%
    }

    .four-phases-slider .ps-nav .psn-item-active:last-child {
        width: 38.627027%
    }

    .psc-text .two-cols .col, .psc-text .two-cols .col:nth-child(2) {
        float: none;
        width: auto
    }

    .psc-lead {
        padding: 0 18px 35px
    }

    .ps-content .bx-controls-direction a:before, .ps-content .bx-controls-direction a:hover:before {
        background: url("https://www.prismaxel.com/images/bg/bg-arrow2.png") no-repeat;
        height: 37px;
        width: 16px
    }

    .ps-content .bx-controls-direction a.bx-prev {
        left: -28px
    }

    .ps-content .bx-controls-direction a.bx-next {
        right: -33px
    }

    .ps-content .bx-controls-direction a.bx-prev.disabled:before {
        background: url("../images/bg-arrow2.png") no-repeat #FFF
    }

    .ps-content .bx-controls-direction a.bx-prev:before {
        background: url("../images/bg-arrow2.png") 0 -113px no-repeat #FFF
    }

    .ps-content .bx-controls-direction a.bx-next.disabled:before {
        background: url("../images/bg-arrow2.png") 0 -38px no-repeat #FFF
    }

    .ps-content .bx-controls-direction a.bx-next:before {
        background: url("../images/bg-arrow2.png") 0 -72px no-repeat #FFF
    }

    .psc-lead {
        font-size: 17px;
        line-height: 1.4;
        padding-bottom: 10px
    }

    .ps-content .psc-text-full {
        padding-top: 10px
    }

    .psc-item .last, .psc-text {
        padding: 10px 0
    }

    .three-phase-section .ps-nav .psn-item a em {
        display: block
    }

    .three-phase-section .ps-nav {
        padding: 0
    }

    .three-phase-section .ps-nav .psn-item {
        height: 50px
    }

    .three-phase-section .ps-nav .psn-item a em {
        width: 44px;
        height: 44px;
        line-height: 44px;
        font-size: 28px;
        top: -26px;
        margin-left: -22px
    }

    .three-phase-section .ps-nav .psn-item p {
        display: none
    }

    .three-phase-section .ps-content {
        margin-top: 0;
        padding: 0 0 30px
    }

    .three-phase-section .psc-lead {
        padding: 0 0 30px
    }

    .three-phase-section .psc-lead h3 {
        padding: 30px 10px 25px;
        text-align: center;
        color: #fff;
        font-size: 24px;
        line-height: 30px;
        : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
        position: relative;
        margin-bottom: 40px
    }

    .three-phase-section .psc-lead h3:after {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 19px 26px 0;
        content: "";
        position: absolute;
        left: 50%;
        bottom: -19px;
        margin-left: -26px
    }

    .three-phase-section .psc-lead h3 span {
        : roboto-light-webfont, Arial, Helvetica, Sans-Serif
    }

    .three-phase-section .psc-lead p {
        margin: 0 10px;
        font-size: 15px;
        line-height: 22px
    }

    .three-phase-section .psc-item:nth-child(1) h3 {
        background: #009ddc
    }

    .three-phase-section .psc-item:nth-child(1) h3:after {
        border-color: #009ddc transparent transparent
    }

    .three-phase-section .psc-item:nth-child(2) h3 {
        background: #0078ae
    }

    .three-phase-section .psc-item:nth-child(2) h3:after {
        border-color: #0078ae transparent transparent
    }

    .three-phase-section .psc-item:nth-child(3) h3 {
        background: #006B9B
    }

    .three-phase-section .psc-item:nth-child(3) h3:after {
        border-color: #006B9B transparent transparent
    }

    .three-phase-section .ps-nav .psn-item a.active:after {
        display: none
    }

    .three-phase-section .phase-slider-holder .step-arrow {
        background: url("../images/step-arrow2.png") no-repeat;
        width: 49px;
        height: 11px;
        top: 26px
    }

    .three-phase-section .phase-slider-holder .step2 {
        left: 61%
    }

    .oms-sub-section-1 {
        padding: 100px 0 40px
    }

    .oms-sub-section-2, .oms-sub-section-3 {
        padding: 40px 0
    }

    .three-phase-section {
        padding-top: 0 !important;
        padding-bottom: 80px !important
    }

    .three-phase-section .ps-nav .psn-item:last-child {
        width: 34.5111111%
    }

    .page-team-bg {
        padding-left: 22px;
        padding-right: 22px
    }

    .text-section.ts__1 .preview-aside {
        width: auto
    }

    .text-section.ts__1 .preview-columns {
        padding-bottom: 0;
        margin: 0 0 20px
    }

    .text-section.ts__1 .preview-columns .arrow-from-to {
        right: 16px
    }

    .text-section.ts__1 .section-title h2, .text-section.ts__1 p, .text-section.ts__2 .section-title h2, .text-section.ts__2 p {
        margin: 0 0 20px
    }

    .text-section.ts__1 p:last-child, .text-section.ts__2 p:last-child {
        margin: 0
    }

    .rs-blocks .rs-block {
        font-size: 15px
    }

    .case-pg .rs-blocks .rs-block span {
        font-size: 50px
    }

    .stat-box {
        padding-bottom: 20px
    }

    .chart-description .fr {
        float: none;
        text-align: left
    }

    .chart-description span {
        float: none;
        display: block;
        margin: 0 0 5px
    }

    html.no-flash .tpp-heading {
        padding-top: 14px !important
    }

    html.no-flash .tpp-heading h1 {
        margin-bottom: 0 !important
    }

    .search-container #cse-search-box .google-search-container {
        width: 100%;
        padding-left: 10px !important
    }

    .search-container .clear-search {
        right: 10px
    }

    .fvs-video-thumb .video-overlay, .wide-video-holder .video-overlay {
        width: 64px;
        height: 64px
    }

    .fvs-video-thumb .video-overlay:before, .wide-video-holder .video-overlay:before {
        background: url("../image/tzz_ion-1.png") no-repeat;
        width: 64px;
        height: 64px
    }

    .fvs-video-thumb .video-overlay:after, .wide-video-holder .video-overlay:after {
        background: url("../image/tzz_ion-1.png") 0 -64px no-repeat;
        width: 64px;
        height: 64px
    }

    .logo-process {
        padding-top: 50px;
        background: url("../images/logo-design/bg-logo-process-mob.png") 50% 0 no-repeat;
        box-shadow: none
    }

    .logo-benefits {
        background: url("../image/tzz_ion-1.png") 50% 0 no-repeat;
        margin: 0
    }

    .logo-process:after {
        display: none
    }

    .logo-process h2 {
        font-size: 27px
    }

    .logo-process p {
        font-size: 15px
    }

    .logo-process .lp-slider {
        padding: 40px 38px;
        margin: 0
    }

    .slide-section {
        padding-top: 60px
    }

    .logo-benefits .lp-slider {
        padding-bottom: 0
    }

    .pull-left {
        left: -18px
    }

    .pull-right {
        right: -30px
    }

    .logo-benefits .lp-slider h3 {
        font-size: 28px
    }

    .lp-slider-txt h3 {
        font-size: 25px
    }

    .logo-benefits .lp-slider h3 {
        padding-top: 0
    }

    .logo-benefits .pull-left, .logo-benefits .pull-right {
        top: 370px
    }

    .slide-section .pull-left, .slide-section .pull-right {
        top: 200px
    }

    .logo-benefits {
        margin-bottom: 20px
    }

    .logo-benefits .pull-right {
        right: -26px
    }

    .logo-benefits .pull-left {
        left: -16px
    }

    .logo-benefits .lp-slider .mark {
        font-size: 20px
    }

    .lp-slider-txt p {
        font-size: 14px;
        line-height: 1.5
    }

    .lp-mobile-swipe {
        width: 87%
    }

    .visit-more {
        padding: 26px 0
    }

    .nm-link {
        font-style: normal;
        font-size: 25px;
        line-height: 1.3
    }

    .nm-link span {
        display: block
    }

    .wvs-play-video {
        width: 84px;
        height: 84px;
        margin-bottom: 5px
    }

    .wvs-play-video:before {
        margin-left: 24px;
        -webkit-transform: scale(0.7);
        transform: scale(0.7)
    }

    .top-slide .s-right {
        padding-top: 0
    }

    .top-slide .s-right .btn-simple {
        display: inline-block
    }

    .top-slide .s-left .btn-simple {
        display: none
    }

    .circle-slider {
        position: static;
        height: auto;
        width: 100%
    }

    .top-slide .visual .top-slide .visual {
        height: 200px;
        display: table-cell;
        vertical-align: middle;
        text-align: center
    }

    .circle-slider li {
        display: table;
        table-layout: fixed
    }

    .circle-slider img {
        position: static;
        width: auto;
        height: auto;
        display: block;
        margin: 0 auto -20px;
        max-width: 95%;
        max-height: 200px
    }

    .circle-slider .t-cell {
        padding: 20px 50px;
        display: block;
        width: 100%;
        height: auto
    }

    .circle-slider .txt {
        border-radius: 0;
        width: 100%;
        margin: 0;
        box-shadow: none;
        background: 0 0
    }

    .circle-slider .pull-controls {
        width: 100%
    }

    #pull-left, #pull-right {
        width: 70px;
        height: 94px;
        bottom: 121px;
        border-radius: 50%;
        background-color: #fff;
        background-size: auto 40%
    }

    #pull-left {
        left: -40px;
        box-shadow: 2px -2px 7px rgba(0, 0, 0, .1);
        background-position: 100% 50%
    }

    #pull-right {
        right: -35px;
        box-shadow: -2px -2px 7px rgba(0, 0, 0, .1);
        background-position: 23% 50%
    }

    .wrapper .top-slide {
        background: 0 0
    }

    .de-text-frame {
        padding: 10px
    }

    .foot-area .ttl.f-post-mob {
        display: block;
        text-align: center
    }

    .foot-area .btn-raq.f-post-mob {
        display: inline-block;
        margin: 0 0 20px 20px
    }

    .f-post .t-holder.info {
        display: block
    }

    .f-post .divider, .f-post-desk {
        display: none
    }

    .f-post-item {
        overflow: hidden;
        display: block;
        width: 100%;
        margin-bottom: 20px
    }

    .PT-awards-list {
        -webkit-transform: scale(.67);
        transform: scale(.67);
        width: 130%;
        margin: -25px -15% 0
    }

    .foot-area .ttl, .location-ttl {
        font-size: 24px
    }

    .socials .item {
        height: 43px
    }

    .socials .icn {
        -webkit-transform: scale(.8);
        transform: scale(.8)
    }

    .head-anim-holder .s-left, .top-section.alt-size2 .s-left {
        text-align: center;
        font-size: 16px
    }

    .head-anim-holder .s-right, .top-section.alt-size2 .s-right {
        display: none
    }

    .hs-sub-row {
        margin: 0 -20px 15px
    }

    .hs-sub-item {
        transform: scale(1);
        margin: 0 7px
    }

    .hs-sub-row {
        display: none
    }

    .hs-sub-row-m {
        display: block
    }

    .home-company-logos-wrapper .home-company-logos-content li {
        -webkit-transform: scale(.5);
        transform: scale(.5);
        margin: 0 -20px
    }

    .home-company-logos-wrapper .home-company-logos-content li.cl-nasa, .home-company-logos-wrapper .home-company-logos-content li.cl-nfl {
        margin: 0 -4px
    }

    .wide-featexp-section .feat-expanded-section {
        padding: 60px 0 120px
    }

    .see-more {
        font-size: 18px;
        padding: 20px 20px 0
    }

    .see-more .link {
        display: inline-block;
        margin-top: -10px
    }

    .see-more.extra-pad {
        padding: 20px 0 10px
    }

    .see-more .link:after {
        height: 29px
    }

    .rd-box-holder {
        padding: 30px 10px
    }

    .rd-box {
        border-radius: 4px;
        padding: 27px 10px
    }

    .rd-box .txt {
        font-size: 20px;
        display: block
    }

    .rd-box .btn-simple {
        margin-left: 0;
        font-size: 16px;
        min-width: 0;
        padding: 12px 40px 12px 30px
    }

    .content-section, .dark-section, .slider-section {
        padding: 40px 20px
    }

    .sec-ttl.ad-pad {
        padding-top: 100px
    }

    .process-section {
        padding: 0 0 40px
    }

    .process-section .sec-ttl {
        padding: 60px 15px 100px
    }

    .process-section .sec-ttl.ad-pad {
        padding-top: 120px
    }

    .shad-round:after, .shad-round:before {
        height: 20px
    }

    .sec-ttl h2 span {
        font-size: 20px;
        letter-spacing: 0
    }

    .txt-slider .t-cell.visual {
        display: none
    }

    .simple-slider .t-cell.txt {
        padding: 0
    }

    .simple-slider h3:not(.slide-ttl) {
        font-size: 25px;
        text-align: center
    }

    .txt-slider h3 {
        padding: 0 20px
    }

    .simple-slider .t-cell {
        font-size: 14px
    }

    .simple-slider p.sub {
        font-size: 17px
    }

    .simple-slider-holder {
        max-width: calc(100% - 30px)
    }

    .simple-slider {
        padding: 0
    }

    .ba-slider {
        padding: 0 10px
    }

    .simple-slider .bx-pager-link {
        height: 17px;
        width: 17px
    }

    .simple-slider .bx-pager-link.active:after, .simple-slider .bx-pager-link:after {
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        transform: none
    }

    .simple-slider .bx-pager-item {
        margin: 0 10px
    }

    .simple-slider .bx-pager {
        margin: 0 -25px
    }

    .simple-slider .bx-next:after, .simple-slider .bx-prev:after {
        display: none
    }

    .slider-section .pull-controls, .slider-section .txt-slider .pull-controls {
        top: -52px;
        z-index: 50
    }

    .simple-slider .pull {
        transform: scale(.5);
        top: 36px
    }

    .simple-slider .pull.left {
        left: 0;
        width: 70px
    }

    .simple-slider .pull.right {
        right: 5px;
        width: 70px
    }

    .txt-slider .pull.left, .txt-slider .pull.right {
        width: 40px
    }

    .tab-slider-pager .brand {
        transform: scale(.5);
        margin: 9px -30px -10px
    }

    .tab-slider .pull-controls {
        display: none
    }

    .sec-ttl {
        padding: 0 20px
    }

    .sec-ttl .descr {
        font-size: 14px;
        padding: 20px 0 0
    }

    .tab-slider-pager > a {
        height: 40px
    }

    .tab-slider-pager > a:not(:first-child):after {
        top: auto;
        bottom: 4px;
        height: 48px
    }

    .current-tab {
        width: 33.3%
    }

    .tab-slider-pager {
        margin-top: -30px
    }

    .ba-slider .tab-slider-pager {
        margin-top: 0;
        height: 52px
    }

    .ba-slider .tab-slider-pager .brand {
        position: relative;
        top: -8px
    }

    .tab-slider-pager .kosher.large {
        margin: 9px -30px -10px
    }

    .tab-slider-pager .loanscribe {
        margin: 9px -55px -10px;
        transform: scale(.4)
    }

    .tab-slider-pager .cayman, .tab-slider-pager .luxury, .tab-slider-pager .shenkman {
        margin: 9px -40px -10px
    }

    .tab-slider .t-holder {
        max-width: 100%
    }

    .tab-slider .t-cell.txt {
        font-size: 17px;
        padding: 20px
    }

    .link-arrow {
        font-size: 14px;
        margin: 15px 0 0
    }

    .link-arrow:after {
        border-width: 2px 2px 0 0
    }

    .simple-slider .t-cell.visual img {
        max-width: 90%
    }

    .tab-slider .t-cell.visual {
        padding: 10px 0 20px
    }

    .tab-slider {
        margin-bottom: 20px
    }

    .ba-slider {
        margin: 40px 0
    }

    .tab-slider .ba-btn {
        width: 222px;
        padding: 12px 0;
        bottom: -25px
    }

    .link-arrow.ba-btn::after {
        width: 8px;
        height: 8px;
        top: -3px;
        left: 8px
    }

    .ba-slider-holder {
        padding: 20px 10px
    }

    .ba-slider .bx-wrapper {
        position: relative;
        z-index: 2
    }

    .ba-section {
        padding: 40px 10px
    }

    .ba-expand {
        display: none
    }

    .ba-expand-m {
        display: block;
        max-width: 90%;
        margin: 10px auto 0;
        height: 500px
    }

    .jq-slide-open .ba-expand {
        padding-bottom: 20px
    }

    .ba-note {
        display: block;
        margin: 0 0 10px;
        text-align: left;
        font-size: 14px
    }

    .ba-note.arrow {
        transform: rotate(50deg);
        text-align: center;
        margin: -13px 0
    }

    .ba-note svg {
        width: 60px
    }

    .tab-slider .ba-btn-close {
        padding: 42px 29px 14px 27px;
        transition: all .3s linear;
        bottom: -30px;
        width: auto;
        z-index: 1
    }

    .link-arrow.ba-btn-close:after {
        top: 2px
    }

    .pr-slider h3:not(.slide-ttl) {
        font-size: 22px;
        line-height: 1.3;
        text-align: left
    }

    .pr-slider p {
        font-size: 16px
    }

    .pr-slider .t-cell.txt {
        padding: 0 15px 40px
    }

    .pr-slider .t-cell.visual img {
        max-width: 70%
    }

    .shad-invert:before {
        height: 20px;
        bottom: -18px
    }

    .shad-invert:after {
        bottom: -20px
    }

    .process-section {
        padding-bottom: 0
    }

    .pr-slider-pager {
        transform: none;
        width: 100%;
        max-width: 100%;
        display: block;
        height: 120px;
        margin-top: -120px
    }

    .pr-slider-pager > a {
        display: none;
        position: absolute;
        top: 0;
        left: 100%;
        width: 100%
    }

    .pr-txt {
        position: absolute;
        width: 100%;
        left: 0;
        bottom: 27px;
        padding: 0 40px
    }

    .pr-txt br {
        display: none
    }

    .pr-bg {
        bottom: -43px
    }

    .pr-icon {
        position: relative;
        bottom: -43px
    }

    .pr-slider .pr-current-tab {
        top: 44px;
        left: 50% !important;
        margin-left: -35px
    }

    .pr-slider-pager > a.active {
        left: 0;
        display: block
    }

    .feat-content .link-arrow.green {
        float: none;
        display: inline-block;
        margin-top: 10px
    }

    .widefeat-txt .link-arrow.green {
        float: right;
        margin-top: 0
    }

    .tab-mode {
        display: none
    }

    .mob-mode {
        display: inline
    }

    .head-anim-holder .s-right-m {
        display: block;
        margin: 50px 0 20px
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        margin-bottom: 5px
    }

    .top-section.head-anim-holder .s-left {
        padding-right: 20px
    }

    .slider-section .mix-slider .pull-controls {
        display: block;
        top: 32px;
        margin: 0;
        width: 100%;
        z-index: 52
    }

    .tab-slider-pager:not(.visual) {
        margin: 0;
        height: 60px;
        display: block
    }

    .tab-slider-pager:not(.visual) > a {
        position: absolute;
        top: 0;
        left: 100%;
        width: 100%;
        height: 100%;
        display: table;
        transition: none !important
    }

    .tab-slider-pager:not(.visual) br, .tab-slider-pager:not(.visual) > a:after {
        display: none
    }

    .tab-slider-pager:not(.visual) > a.active {
        left: 0
    }

    .tab-slider-pager:not(.visual) > a h3, .tab-slider-pager:not(.visual) > a span {
        display: table-cell;
        vertical-align: middle;
        height: 60px;
        opacity: 0;
        transition: transform .4s ease-out .1s, opacity .4s ease-out .1s;
        transform: translateX(150px);
        padding: 0 50px
    }

    .tab-slider-pager:not(.visual) a.active h3, .tab-slider-pager:not(.visual) a.active span {
        transform: translateX(0);
        opacity: 1
    }

    .tab-slider-pager:not(.visual) .current-tab {
        width: 100%;
        left: 0 !important
    }

    .mix-slider .t-cell.txt, .mix-slider .t-cell.visual {
        padding-bottom: 20px
    }

    .simple-slider .t-cell.txt.alt-view {
        padding: 0 30px
    }

    .simple-slider p.size02 {
        margin-top: -5px;
        font-size: 24px
    }

    .equal-cols .ttl {
        font: 23px/1.2 roboto-medium-webfont, sans-serif
    }

    .equal-cols .t-cell {
        font-size: 16px;
        padding-top: 20px
    }

    .equal-cols .visual {
        padding-left: 140px;
        background-position: 20px 25px
    }

    .same-blocks > div {
        height: 120px
    }

    .same-blocks .unit > span {
        transform: translate(-50%, -50%) scale(.7)
    }

    .text-content {
        padding: 0
    }

    .text-content .size01 {
        font-size: 20px
    }

    .text-content p {
        margin-bottom: 12px
    }

    .text-content {
        font-size: 16px
    }

    .simple-slider .slide-center {
        height: auto;
        padding: 0 0 30px
    }

    .simple-slider .slide-center h3 {
        font-size: 24px;
        padding: 0 20px
    }

    .scroll-arrow-wrap + .content-section, .scroll-arrow-wrap + .dark-section, .scroll-arrow-wrap + .slider-section:not(.process-section) {
        padding-top: 60px
    }

    .text-content .size02 {
        font-size: 18px
    }

    .pr-slider .pull-controls {
        width: 100%;
        margin: 0
    }

    .head-anim-holder.over {
        background-color: #fff;
        z-index: 1;
        padding-bottom: 0;
        margin-bottom: 0
    }

    .head-anim-holder.over:before {
        height: 100%
    }

    .sec-ttl h2, .sec-ttl h2 span.size01 {
        font-size: 28px
    }

    .top-section .s-left .ttl, .top-section .s-left h2 {
        font-size: 32px
    }

    .contact-pg .wh-detail--wrp .wh-form-holder {
        max-width: 90vw
    }

    .contact-pg .wh-detail--wrp .wh-form-holder .ch-form {
        padding: 15px
    }

    .contact-pg .hs-sub-row {
        padding: 10px 0
    }

    .contact-pg .hs-sub-item {
        margin: 10px 0
    }

    .contact-pg .ttl {
        font-size: 35px
    }

    .contact-pg .wh--top-banner .descr {
        font-size: 20px
    }

    .contact-pg .hs-sub-row {
        display: block
    }

    .contact-pg .wh-detail--wrp .wh-form-holder {
        margin-bottom: -60px
    }

    .contact-pg .wh-detail--wrp {
        padding-bottom: 20px
    }

    .contact-pg .wh-detail--wrp .wh-infobox {
        max-width: 80vw;
        margin: 0 -10px
    }

    .ch-cell {
        display: block;
        width: 100%;
        margin: 0 0 20px
    }

    .nofound .cs-service-column {
        display: block;
        width: 100%;
        padding: 0 0 20px
    }

    .page-intro-center-holder.top-digital h2.main-title {
        font-size: 30px;
        padding-bottom: 20px
    }

    .form-ttl {
        font-size: 22px
    }
}

@media only screen and (max-width: 600px) {
    .d-block-tablet {
        display: inline
    }

    .d-block-mobile {
        display: block
    }

    .solutions-section .drop-holder {
        padding: 0 9px
    }

    .case-pg .rs-blocks .rs-block span {
        font-size: 30px
    }

    .quote-section blockquote {
        padding: 0 45px 0 60px
    }

    .quote-section q:before {
        left: -61px;
        top: -23px;
        font-size: 160px
    }

    .quote-section .quotes-after:after {
        font-size: 160px;
        top: 24px;
        right: -60px
    }

    .das-items .das-item .tn {
        float: none;
        display: block;
        margin: 0 0 20px;
        text-align: center
    }

    .das-items .btn-green {
        left: 31px
    }

    .das-item .das-content h3 span {
        display: inline;
        padding-left: 10px
    }

    .demo-reel-block .drb-content h3 {
        padding-right: 0
    }

    .feat-gallery {
        -webkit-transform: scale(.68);
        transform: scale(.68);
        margin: 10px -106px -100px
    }

    .PT-awards .txt {
        font-size: 23px;
        line-height: 24px
    }

    .PT-awards .txt span {
        font-size: 22px
    }

    .subscribe {
        padding: 50px 20px 100px
    }

    .subscribe-form {
        width: auto;
        height: 54px
    }

    .subscribe-form .btn-simple {
        width: 156px;
        position: static;
        float: none;
        display: block;
        margin: 18px auto 0
    }

    .subscribe-form input[type=text] {
        padding: 0 16px;
        font-size: 17px
    }

    .subscribe .message {
        padding: 90px 0 0;
        margin: 0 0 -80px
    }

    .f-menu-content .fmc-list a {
        font-size: 13px
    }
}

@media screen and (max-width: 580px) {
    .infoboxes .item img {
        float: none !important;
        display: block;
        margin: -50px auto !important;
        -webkit-transform: scale(.55);
        transform: scale(.55)
    }

    .infoboxes .frame {
        padding: 0 10px
    }

    .rs-gen-blocks-two > .rs-block {
        width: 100%;
        display: block
    }

    .rs-gen-blocks-two .rs-block {
        min-height: 80px
    }

    .rs-gen-blocks-two > .rs-block:first-child {
        margin-top: 0
    }

    .rs-gen-blocks-two .divider {
        display: none
    }

    .wide-expanded-section .main-image {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin: -205px -47px -65px -70px
    }

    .wide-expanded-section .brand {
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-50%);
        transform: scale(.6) translateX(-50%)
    }

    .luxor .brand {
        margin: 25px auto
    }

    .artdex .brand {
        margin: 40px auto
    }

    .wide-expanded-section .txt-cell {
        padding-top: 90px
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 280px
    }

    .wide-expanded-section .txt-cell .first {
        font-size: 18px
    }

    .wide-expanded-section .txt-cell p {
        margin-bottom: 10px
    }

    .wide-expanded-section .thumbnails {
        margin: 0 -93px -126px;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    .wide-expanded-section .btn-green {
        margin-top: 10px
    }

    .wide-expanded-section .button-close {
        right: 10px
    }

    .submenu-section .item {
        min-height: 150px;
        margin: 0 5px
    }
}

@media only screen and (max-width: 480px) {
    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 41%
    }

    .c-section-title h2 {
        line-height: 1.1
    }

    .c-section-title h2 span {
        line-height: 1
    }

    .wide-expanded-section .section-title h2 {
        font-size: 30px
    }

    .wide-expanded-section .section-title p {
        padding: 0
    }

    .note-txt {
        font-size: 18px
    }

    .note-txt img {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        left: -5px
    }

    .seotr-txt {
        min-height: 240px
    }

    .seo-traffic-section .section-title {
        padding: 0 20px
    }

    .seotr-graph {
        -webkit-transform: scale(0.32) translateX(-157%);
        transform: scale(0.32) translateX(-157%);
        bottom: -134px
    }

    .section02 .seotr-graph {
        bottom: -130px
    }

    .result-list span {
        display: block
    }

    .quote-section q {
        font-size: 22px
    }

    .feat-gallery {
        -webkit-transform: scale(.6);
        transform: scale(.6);
        margin: -20px -140px -120px
    }

    .feat-expanded-section .tab-lnk {
        width: 100%;
        height: auto;
        margin: 0 auto
    }

    .feat-home .tab-lnk {
        display: none
    }

    .feat-home .tab-lnk.show-in-mobile {
        display: block
    }

    .feat-expanded-section .txt-tab-lnk {
        max-width: 100%
    }

    .feat-section-frame .ready-discuss {
        margin: 30px 0 0;
        padding: 20px 0
    }

    .header {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 99999
    }

    .before-and-after-wrapper .frame, .page-title .frame {
        padding: 0 8px
    }

    .search-field input[type=text] {
        width: 100%
    }

    .search-active {
        padding-bottom: 84px !important
    }

    .search-field {
        bottom: -90px
    }

    .header {
        -webkit-transition: top .4s ease-out;
        -moz-transition: top .4s ease-out;
        transition: top .4s ease-out
    }

    .h-animated {
        top: -41px
    }

    .hnc-features-list {
        width: 70%
    }

    .hnc-features-list > li {
        width: 100%
    }

    .hnc-simple-list {
        display: none
    }

    .home-nutshell-content .h3, .home-nutshell-content h3 {
        font-size: 45px;
        line-height: 42px
    }

    .home-nutshell-content h3.h3 {
        line-height: 1.2
    }

    .home-nutshell-content .h3 span, .home-nutshell-content h3 span {
        display: block
    }

    .olpcb-left-column, .olpcb-right-column {
        width: 100%
    }

    .olpcb-two-items .olp-item img {
        max-height: 300px
    }

    .olpcb-two-items .olp-item {
        max-width: 300px
    }

    .our-latest-projects-content .olpc-subcaption {
        display: none
    }

    .our-latest-projects-content h3, .serve-all-industries-content h3 {
        font-size: 45px
    }

    .serve-all-industries-content .saic-subcaption {
        padding-top: 30px
    }

    .saic-columns .saic-column-list {
        width: 93%;
        float: none;
        padding: 0;
        margin: 0 auto
    }

    .saic-columns .saic-column-list:last-child ul, .saic-columns .saic-column-list:nth-child(2) ul {
        border-style: none;
        padding-top: 0
    }

    .serve-all-industries-content .saic-subcaption {
        width: 80%;
        margin: 0 auto
    }

    .occ-2-items-columns .occc-column:nth-child(2), .occ-columns .occc-column {
        width: 300px;
        margin: 0 auto;
        text-align: center;
        float: none
    }

    .occc-column .client-photo, .testimonial-frame .occc-column .client-photo {
        margin-bottom: -56px
    }

    .occ-columns .occc-column {
        background-size: 85%
    }

    .occc-column .client-photo img {
        width: 85%
    }

    .so-columns .soc-column {
        width: 93%;
        float: none;
        margin: 0 auto;
        padding-top: 40px
    }

    .soc-column h2 .step-arrow, .soc-column h3 .step-arrow, .soc-column h5 .step-arrow {
        display: none
    }

    .succeeding-online > h2, .succeeding-online > h3 {
        font-size: 28px;
        margin-bottom: 30px
    }

    .olp-ecommerce .olpi-hover-stare {
        padding: 15% 30px 0
    }

    .olpi-hover-stare .hs-content {
        margin-top: 20px;
        padding-top: 20px
    }

    .olpi-hover-stare .hs-lnk {
        margin-top: 30px
    }

    .testimonials-items .testimonial {
        padding-left: 20px;
        padding-right: 10px
    }

    .testimonial .ti-author {
        padding-right: 0
    }

    .ti-author-content .tiac {
        clear: both;
        padding-top: 14px
    }

    .case-studies-section, .cs-block-single, .cs-wide-section, .text-section {
        padding-left: 16px;
        padding-right: 16px
    }

    .page-navigation {
        margin-left: 26px;
        margin-right: 26px
    }

    .case-studies-section {
        padding-bottom: 82px
    }

    .cs-thumb {
        float: none;
        margin: 0 0 24px
    }

    .cs-site-screen {
        width: 100%;
        max-width: 100%
    }

    .website-tag {
        top: 21px
    }

    .custom-list li {
        padding-bottom: 12px
    }

    .page-title {
        padding-top: 10px
    }

    .infoboxes .section-title h2, .page-title h1, .page-title h2 {
        font-size: 32px;
        padding-bottom: 16px
    }

    .infoboxes .section-title h2 {
        padding: 10px 10px 0;
        margin-bottom: 0
    }

    .infoboxes h3 {
        font-size: 22px
    }

    .infoboxes .sub-caption {
        font-size: 16px
    }

    .infoboxes p {
        font-size: 13px;
        margin-bottom: 10px
    }

    .page-navigation {
        padding: 14px 0 20px;
        margin-bottom: 15px
    }

    .page-navigation a span {
        display: none
    }

    .page-navigation a {
        font-size: 17px
    }

    .page-navigation .next-page:after, .page-navigation .prev-page:before {
        font-size: 30px;
        margin-top: -9px
    }

    .cs-block-single .cs-thumb {
        margin-top: 0
    }

    .cs-block h1 {
        margin-bottom: 18px;
        padding-right: 0
    }

    .section-title {
        margin-bottom: 32px
    }

    .frame-section-title h2, .h-h2, .logo-pg-frame .section-title h2, .logo-process h2, .section-title h2, .section-title.in-light h2 {
        font-size: 32px
    }

    .testimonials-wide-section .frame-section-title {
        padding-bottom: 10px
    }

    .cs-preview-design {
        padding: 82px 0
    }

    .cs-results {
        padding-top: 86px;
        padding-bottom: 100px
    }

    .cs-graphs {
        position: relative;
        overflow: hidden;
        min-height: 400px
    }

    .cs-graphs-single {
        min-height: 118px
    }

    .cs-graphs-double {
        min-height: 260px
    }

    .cs-graphs img {
        width: 674px;
        max-width: 200%;
        position: absolute;
        left: 50%;
        margin: 0 0 0 -50%;
        top: 0
    }

    .cs-graphs .cs-graph2 {
        top: 140px
    }

    .cs-graphs .cs-graph3 {
        top: 282px
    }

    .cs-details {
        padding-top: 82px;
        padding-bottom: 82px
    }

    .cs-detail-col, .cs-detail-col:first-child {
        display: block;
        width: 100%;
        padding: 0
    }

    .cs-service-column h3 br {
        display: none
    }

    .page-intro-block {
        margin-left: 16px;
        margin-right: 16px
    }

    .service-wide-item, .services-wide-section {
        padding-left: 16px;
        padding-right: 16px
    }

    .services-before-after-section {
        padding: 40px 0 20px
    }

    .services-wide-list, .slide-section {
        padding-left: 0;
        padding-right: 0
    }

    .page-intro-block {
        padding-top: 0;
        padding-bottom: 14px;
        margin-bottom: 32px
    }

    .intro-block-industries-served {
        padding-bottom: 34px
    }

    .page-intro-text {
        width: 100%;
        display: block;
        text-align: center;
        padding: 14px 0;
        font-size: 18px
    }

    .page-intro-image {
        display: block;
        width: 100%;
        padding: 0
    }

    .blue-box-inner .ttl br, .blue-box-inner h4 br {
        display: inline
    }

    .blue-middle-box {
        margin-bottom: 32px
    }

    .ws-column, .ws-column:first-child {
        display: block;
        width: 100%;
        padding: 0 0 25px;
        text-align: center
    }

    .work-section {
        padding-bottom: 70px
    }

    .certify-section {
        padding-top: 88px;
        padding-bottom: 60px
    }

    .certify-section .blue-middle-box {
        margin-top: -140px
    }

    .certify-section .section-title {
        padding-bottom: 26px;
        margin-bottom: 26px
    }

    .certify-items {
        margin: 0
    }

    .certify-item, .certify-item:first-child {
        display: block;
        width: 100%;
        padding: 0 30px 20px
    }

    .certify-item img {
        width: auto
    }

    .ti-item, .ti-item:first-child, .ti-item:last-child {
        width: 100%;
        display: block;
        padding: 0 5px 36px
    }

    .ti-ibm {
        width: 136px
    }

    .ti-bbb {
        width: 156px
    }

    .ti-gsa {
        width: 108px
    }

    .ti-norton {
        width: 170px
    }

    .ti-gp {
        width: 147px
    }

    .intro-block-no-bd {
        padding-bottom: 72px
    }

    .page-intro-title {
        padding-right: 0;
        text-align: center
    }

    .intro-fl-image, .intro-fl1-image {
        float: none;
        display: block;
        margin: 0 auto;
        width: 100%
    }

    .page-intro-email .intro-fl-image, .seo-intro-block .intro-fl-image {
        margin: 0 auto 20px
    }

    .intro-block-no-bd, .intro-block-services-landing {
        text-align: center
    }

    .intro-block-no-bd .custom-list {
        text-align: left
    }

    .strategy-consult-item {
        text-align: center
    }

    .sc-logo {
        float: none;
        margin: 0 auto 16px
    }

    .marketing-strategy-item {
        background: url("../image/tzz_ion-1.png")
    }

    .our-team-section .see-all-large-blue span {
        display: none
    }

    .sample-text-section .section-title p {
        text-align: left
    }

    .page-intro-about p {
        font-size: 20px
    }

    .branch-item h2 {
        font-size: 35px;
        margin: 0 0 14px
    }

    .branch-img {
        margin: 0 0 24px
    }

    .page-intro-center {
        padding-top: 20px
    }

    .page-intro-center h2 {
        font-size: 28px;
        margin: 0 0 10px
    }

    .page-intro-center h3 {
        font-size: 20px;
        margin: 0 0 16px
    }

    .paging-inline .paginationControl {
        margin-top: 62px
    }

    .paging-inline .pag-next-link, .paging-inline .pag-prev-link {
        position: absolute;
        top: 30px;
        left: 14px;
        margin: 0
    }

    .paging-inline .pag-next-link {
        left: auto;
        right: 14px
    }

    .details-columns {
        padding-left: 16px;
        padding-right: 16px
    }

    .detail-column, .detail-column:first-child {
        display: block;
        padding: 0;
        width: 100%;
        text-align: justify
    }

    .page-intro-details {
        padding-top: 0
    }

    .dif-logos-list {
        text-align: center;
        padding-left: 0;
        padding-right: 0
    }

    .dif-logos-list li {
        max-width: 140px;
        height: 142px;
        line-height: 142px;
        margin: 0 2px 6px
    }

    .intro-sample-image {
        float: none;
        width: 100%;
        margin: 0 0 20px
    }

    .intro-sample-image img {
        max-width: 284px
    }

    .pi-left-text {
        padding-top: 0;
        padding-bottom: 50px
    }

    .text-section-narrow p {
        padding-left: 0;
        padding-right: 0
    }

    .sample-right-img {
        float: none;
        display: block;
        width: 100%;
        max-width: 300px;
        margin: 0 auto 20px
    }

    .testimonial-frame .frame {
        padding-left: 16px;
        padding-right: 16px
    }

    .industries-intro-block {
        text-align: center;
        margin-bottom: 0
    }

    .industries-intro-block h3 {
        padding-right: 0
    }

    .industries-intro-block .intro-fl-image {
        max-width: 290px;
        margin-top: 0
    }

    .industries-inner-wrapper {
        padding-bottom: 72px
    }

    .fancy-list-two li {
        margin-left: auto;
        margin-right: auto;
        text-align: left
    }

    .pp-row {
        padding: 20px 0
    }

    .pp-row:first-child {
        padding-top: 0
    }

    .pp-icon, .pp-nb-col {
        display: block;
        clear: both;
        width: 100%;
        padding: 0 0 15px
    }

    .testimonial-hidden-row h4 {
        font-size: 32px
    }

    .cms-spec-item {
        padding-left: 12px;
        padding-right: 12px
    }

    .cms-spec-item .frame {
        padding-left: 0
    }

    .cms-spec-item:nth-child(2n) .frame {
        padding-right: 0
    }

    .cms-spec-item h3 {
        text-align: center;
        font-size: 27px
    }

    .cms-spec-logo {
        position: static;
        text-align: center;
        max-width: 180px;
        margin: 0 auto 10px
    }

    .st-column .text-custom-title, .text-custom-title {
        font-size: 28px
    }

    .baac-row .baac-visible-row .alignleft {
        margin-bottom: 18px
    }

    .baac-row .baac-visible-row .alignleft, .baac-row .baac-visible-row .alignright {
        float: none;
        width: auto
    }

    .baac-more-top {
        display: block
    }

    .baac-more-bottom {
        display: none
    }

    .baac-row .baac-arrow {
        top: 44.09005628517824%;
        width: 82px;
        height: 70px;
        background-position: -873px -15px;
        -webkit-transition: top .4s ease-out;
        -moz-transition: top .4s ease-out;
        transition: top .4s ease-out
    }

    .baac-frame .frame:hover .baac-arrow {
        left: 50%;
        top: 45%
    }

    .baac-row-active .baac-more-top a:after {
        display: none
    }

    .baac-row-active .alignright .baac-more a:after {
        background: url("../image/tzz_ion-1.png") -632px -85px no-repeat;
        width: 21px;
        height: 11px;
        position: absolute;
        bottom: -19px;
        left: 50%;
        content: "";
        margin-left: -13px
    }

    .baac-row .baac-hidden-item-content h4 {
        font-size: 32px;
        padding-bottom: 40px
    }

    .baac-row .baac-hidden-item-frame {
        padding: 27px 0
    }

    .baac-row .baac-link-close {
        top: -27px
    }

    .intro-fl-image-holder {
        float: none;
        margin: 0;
        width: auto;
        text-align: center
    }

    .intro-fl-image-holder .prev-link-holder a, .page-intro-block .desktop {
        display: none
    }

    .page-intro-block .mobile {
        display: block
    }

    .text-section h3 {
        font-size: 28px;
        line-height: 30px
    }

    .text-section h4 {
        font-size: 20px;
        line-height: 22px
    }

    .top-page-panel-visible .tpp-heading strong br {
        display: none
    }

    .design-samples-section {
        padding-left: 26px;
        padding-right: 26px
    }

    .ds-row .ds-col {
        margin: 0 0 30px;
        float: none;
        width: auto
    }

    .ds-row {
        margin: 0
    }

    .fwb-row .fwb-item {
        width: 100%;
        margin: 0 0 28px;
        float: none;
        text-align: center
    }

    .services-wide-section-fullscreen .fwb-item .active-lnk::after {
        bottom: -28px
    }

    .fwb-row .fwb-items img {
        display: block
    }

    .demo-video-box h4, .expanded-mode h3, .expanded-mode h4 {
        font-size: 28px
    }

    .demo-reel-block .drb-content h3 {
        font-size: 24px;
        line-height: 30px
    }

    .single-text-section {
        font-size: 14px
    }

    .extra-text-section h1, .single-text-section h1 {
        font-size: 24px;
        margin: 0 0 18px
    }

    .single-text-section h2 {
        font-size: 17px
    }

    .single-text-section h3 {
        font-size: 15px
    }

    .single-text-section p {
        margin: 0 0 15px
    }

    .form-login-box {
        margin-left: 10px;
        margin-right: 10px;
        padding: 16px
    }

    .form-login-box .f-row {
        padding-left: 0;
        margin-right: 0
    }

    .webinars-holder .wh-form-holder {
        margin-left: 10px;
        margin-right: 10px
    }

    .whitepapers-holder .wh-section-4 {
        padding-top: 32px
    }

    .archive-block .section-title h2, .h-h2 {
        font-size: 34px
    }

    .webinar-archive-item {
        display: block;
        width: 100%;
        max-width: 300px;
        margin-left: auto;
        margin-right: auto
    }

    .webinar-archive-thumb {
        width: 228px;
        height: 120px
    }

    .btn-top {
        width: 50px;
        height: 68px;
        padding: 5px 6px 0
    }

    .btn-top span {
        margin-bottom: 5px
    }

    .no-pad-marg-mobile {
        padding-bottom: 0;
        margin-bottom: 0
    }

    .drb-no-pad-mobile .frame {
        padding-bottom: 0
    }

    .drb-no-pad-mobile .drb-main-content {
        margin-bottom: 0
    }

    .developer-container pre {
        font-size: 9px
    }

    .mobile-center-hold {
        text-align: center
    }

    .wrapper .pt-none-mobile {
        padding-top: 0
    }

    .contact-holder {
        padding-left: 19px
    }

    .seminars {
        padding-left: 0;
        padding-right: 0
    }

    .steps-controls ul {
        margin-bottom: 15px
    }

    .steps-controls li.sep span {
        width: 60px
    }

    .steps-controls ul li {
        padding-bottom: 10px
    }

    .steps-controls .num {
        width: 45px;
        height: 45px;
        line-height: 45px;
        font-size: 20px
    }

    .steps-controls .text {
        font-size: 14px;
        bottom: 3px
    }

    .step-content {
        padding-top: 26px;
        padding-bottom: 26px
    }

    .ficc-email {
        overflow: hidden
    }

    #slider_full-width .step-content h3 {
        font-size: 28px
    }

    #slider_full-width .sfw-slide-frame {
        padding-left: 40px
    }

    .itnc-box {
        margin-bottom: 0
    }

    .box-shadow-holder.left img, .box-shadow-holder.right img {
        float: none;
        display: block;
        margin: 0 auto 20px
    }

    .box-shadow-holder {
        text-align: center
    }

    .box-shadow-holder.left .bsh-text {
        padding: 0
    }

    .phase-section {
        padding: 100px 0 80px
    }

    .phase-slider-holder .ps-content {
        padding-bottom: 20px
    }

    .seo-traffic-section {
        padding-bottom: 100px
    }

    .seo-section, .smm-section {
        padding-top: 100px;
        padding-bottom: 80px
    }

    .three-phase-section .phase-slider-holder .step2 {
        left: 59%
    }

    .design-samples-section .design-samples .ds-row {
        margin: 0
    }

    .drb-content-1-holder .ec-video-box {
        padding-top: 25px
    }

    .raq-logos-section .raq-logo-item {
        width: 100%;
        float: none
    }

    .benefits-section .bs-item {
        float: none;
        margin-right: 0;
        width: 100%
    }

    .job-section {
        padding-left: 0;
        padding-right: 0
    }

    .job-section .js-item {
        width: 100%;
        float: none;
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .job-section .js-item:nth-child(even), .job-section .js-item:nth-child(odd) {
        padding-left: 22px !important;
        padding-right: 22px !important
    }

    .job-section .js-nav {
        display: block
    }

    .job-section .js-items, .job-section .jsi-position {
        display: none
    }

    .job-section .js-nav .js-item h3 {
        font-size: 25px;
        line-height: 1
    }

    .job-section .js-nav .js-item {
        overflow: hidden;
        height: 0;
        padding: 0 !important;
        margin-bottom: 0;
        display: none
    }

    .job-section .js-nav .jsi-content {
        padding: 30px 22px 28px;
        border-bottom: 3px solid #e2e2e2
    }

    .page-team-bg h3 {
        font-size: 20px;
        line-height: 24px;
        padding: 0 20px
    }

    .rs-blocks .rs-block, .rs-blocks-alt .rs-block, .rs-blocks-alt .rs-block:first-child, .rs-blocks-alt .rs-block:last-child, .rs-blocks-diff .rs-block, .rs-blocks-diff .rs-block:first-child {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .3);
        width: 100%
    }

    .rs-blocks .rs-block:last-child {
        border-bottom: 0
    }

    .rs-blocks {
        padding-top: 0;
        padding-bottom: 0
    }

    .rs-blocks .rs-block {
        min-height: 0;
        padding: 15px;
        margin-bottom: 0
    }

    .rs-blocks .rs-block:first-child {
        padding-top: 0
    }

    .result-box h3 + p {
        margin-bottom: 0
    }

    .case-pg .result-box .rs-blocks {
        padding: 0
    }

    .case-pg .rs-blocks .rs-block {
        display: block
    }

    .rs-row > p {
        padding: 15px 5px 5px
    }

    .rs-row .divider {
        padding: 0 5px;
        font-size: 12px
    }

    .rs-title {
        font-size: 17px
    }

    .search-container .search-item .si-tn {
        display: none
    }

    .search-container .clear-search {
        right: 17px
    }

    .search-container #cse-search-box .google-search-container {
        padding-right: 50px !important
    }

    .img-loader-wisty {
        height: 160px
    }

    .wistia_embed {
        width: 480px;
        height: 270px
    }

    .fvs-title {
        font-size: 32px;
        padding: 14px 10px
    }

    .categories-testim .item.frame {
        margin: 0 10px
    }

    .categories-testim .title-category span {
        font-size: 25px
    }

    .featured-work-fullscreen .expanded-mode {
        margin-left: -42px;
        margin-right: -42px
    }

    .lp-mobile-swipe {
        width: 84%
    }

    .featured-work-fullscreen .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.6);
        transform: translate(-50%, -50%) scale(.6)
    }

    .featured-work-fullscreen .fwb-item > a:hover .ld-brand {
        -webkit-transform: translate(-50%, -50%) scale(.7);
        transform: translate(-50%, -50%) scale(.7)
    }

    .de-blog-item {
        display: block;
        margin-bottom: 15px;
        width: 100%
    }

    .section-title .sub-ttl {
        font-size: 20px
    }

    .press-frame {
        padding: 0 20px
    }

    .press-item {
        float: none
    }

    .de-blog-title {
        font-size: 18px
    }

    .de-text {
        padding: 5px 10px 15px
    }

    .PT-awards-list {
        width: 100%;
        display: block;
        margin: -35px 0 -25px;
        -webkit-transform: scale(.8);
        transform: scale(.8)
    }

    .PT-awards-list .item {
        display: block;
        width: 100%;
        padding: 0 0 25px
    }

    .PT-awards-list .item:last-child {
        padding-bottom: 0
    }

    .PT-awards-list img {
        margin-top: 5px
    }

    .f-menu-content .fmc-list {
        margin-bottom: 10px
    }

    .f-menu-content .fmc-list li {
        display: inline-block;
        margin: 0 0 20px;
        width: 49%
    }

    .fmc-copyright {
        margin-top: 0
    }

    .loc-phone {
        display: block
    }

    .loc-phone:after {
        display: none
    }

    .location-area {
        padding: 40px 20px 140px
    }

    .location-area .frame {
        padding: 20px 15px 15px
    }

    .location-ttl span:after, .location-ttl span:before {
        right: -15px;
        top: 87%;
        width: 15%
    }

    .location-ttl span:after {
        right: auto;
        left: -15px
    }

    .location-area .location-cell {
        margin-bottom: 20px
    }

    .location-area .location-cell:not(:first-child):after {
        top: -10px
    }

    .feat-visible, .feat-visible-t {
        display: none
    }

    .feat-visible-m {
        display: block;
        margin: 0 auto
    }

    .home-company-logos-wrapper {
        padding: 5px 0 13px
    }

    .home-company-logos-content {
        width: 320px;
        margin: 0 auto;
        position: relative;
        left: -10px
    }

    .home-company-logos-wrapper .home-company-logos-content li {
        -webkit-transform: scale(.5);
        transform: scale(.5);
        margin: 0 -10px
    }

    .home-company-logos-wrapper .home-company-logos-content li.cl-nfl {
        left: 10px
    }

    .home-company-logos-wrapper .home-company-logos-content li.cl-ea {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        top: -10px
    }

    .home-company-logos-content .divider {
        display: block
    }

    .home-company-logos-content .divider + li {
        margin-left: 5px
    }

    .content-section, .dark-section {
        padding-left: 10px;
        padding-right: 10px
    }

    .equal-cols .t-cell {
        padding-top: 10px
    }

    .equal-cols .visual {
        background-size: 15% auto;
        background-position: 5% 15px;
        padding-left: 25%
    }

    .equal-cols .link-arrow {
        font-size: 15px
    }

    .tabs-frame {
        margin: 0 -10px
    }

    .tabs-visual .item {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin: -10px -12px
    }

    .tabs-visual {
        max-width: 320px
    }

    .same-blocks .unit > span {
        transform: translate(-50%, -50%) scale(.5)
    }

    .tabs-step {
        left: 24px
    }

    .submenu-section .t-cell {
        display: block;
        width: 100%
    }

    .submenu-section .item {
        min-height: 230px
    }
}

@media only screen and (max-width: 420px) {
    .feat-gallery {
        -webkit-transform: scale(.46);
        transform: scale(.46);
        margin: -70px -173px -160px
    }

    .wide-expanded-section .main-image {
        margin: -180px 0 -110px;
        min-width: 282px;
        float: left
    }

    .wide-expanded-section .thumbnails {
        float: left;
        margin: -130px -32px -126px
    }

    .wide-expanded-section .txt-cell {
        text-align: center
    }

    .wide-expanded-section .thumbnails > a {
        display: block;
        margin: 10px 0
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }

    .wide-expanded-section .txt-cell {
        padding-top: 190px
    }

    .wide-expanded-section .t-holder {
        display: block;
        text-align: center;
        position: relative;
        padding-top: 120px
    }

    .wide-expanded-section .expanded-mode .t-cell {
        display: inline-block;
        padding-top: 0;
        width: 100%
    }

    .wide-expanded-section .biowars-mob-slide .holder {
        top: -10px;
        -webkit-transform: scale(0.45) translateX(-111%);
        transform: scale(.45) translateX(-111%)
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 130px
    }

    .wide-expanded-section .brand {
        -webkit-transform: scale(0.5) translateX(-105%);
        transform: scale(.5) translateX(-105%)
    }

    .ba-slider {
        padding: 0
    }

    .tab-slider-pager .brand {
        transform: scale(.45);
        margin: 8px -40px -10px
    }

    .tab-slider-pager .candy, .tab-slider-pager .cayman, .tab-slider-pager .ewing, .tab-slider-pager .glass, .tab-slider-pager .kosher.large, .tab-slider-pager .loanscribe, .tab-slider-pager .luxury, .tab-slider-pager .shenkman {
        transform: scale(.4);
        margin: 8px -70px -10px
    }
}

@media screen and (max-width: 500px) and (orientation: landscape) {
    .wrapper {
        padding-top: 90px
    }

    .mm-opened .b-animated .wrapper {
        padding-top: 50px
    }

    .header {
        height: 90px;
        padding-top: 50px
    }

    html.mm-opened .header {
        left: 205px
    }

    .ht-simplemenu .search {
        bottom: -34px
    }

    .search-field {
        bottom: -84px
    }

    .menu-title {
        height: 90px
    }

    .menu-title .open-m-menu {
        margin-top: 8px
    }

    html.mm-opened .b-animated .menu-title {
        height: 50px;
        border-top-width: 3px
    }
}

@media only screen and (max-width: 380px) {
    .offers h2 {
        font-size: 22px
    }

    .offers .link-arrow:after {
        font-size: 24px;
        margin-top: -2px
    }

    .top-section .s-right {
        background-size: 90% auto
    }

    .top-section .bg.full-height .s-right {
        background-size: auto auto
    }

    .sitecore-pg .top-section .s-right {
        min-height: 248px;
        margin-top: -10px
    }

    .drupal-pg .top-section .s-right, .joomla-pg .top-section .s-right, .wp-pg .top-section .s-right {
        min-height: 250px
    }

    .wvs-play-video {
        width: 60px;
        height: 60px
    }

    .wvs-play-video:before {
        margin-left: 10px;
        margin-top: -4px;
        -webkit-transform: scale(0.5);
        transform: scale(0.5)
    }

    .feat-expanded-section .tab-lnk {
        max-width: 287px
    }

    .feat-expanded-section .txt-tab-lnk {
        max-width: 100%
    }

    .solutions-section .drop-holder {
        padding: 0;
        margin: 0 0 -10px;
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    .lp-mobile-swipe {
        width: 82%
    }

    .gallery-space-hold {
        margin-left: 0
    }

    .widefeat-content .link-arrow.blue, .widefeat-content .link-arrow.green {
        font-size: 13px
    }

    .widefeat-content .link-arrow:after {
        width: 5px;
        height: 5px;
        border-width: 2px 2px 0 0
    }

    .widefeat-content .link-arrow.green:before {
        display: none
    }

    .widefeat-content .link-arrow.green {
        margin-top: 1px
    }
}

@media only screen and (max-width: 360px) {
    .top-section .s-left .biowars-ttl {
        -webkit-transform: scale(.45);
        transform: scale(.45);
        position: static;
        margin: -88px -162px -79px
    }

    .top-section .s-right {
        margin: 0 auto;
        max-width: 463px;
        background-position: 50% 0
    }

    .johnjay-section1 .s-right, .logo-pg .s-right {
        min-height: 260px
    }

    .ourwork-pg .top-section .s-right {
        background-size: 140% auto
    }

    .mm-opened .b-animated .wrapper {
        padding-top: 61px
    }

    html.mm-opened .b-animated .menu-title {
        height: 61px;
        border-top-width: 3px
    }

    .cs-service-column {
        display: block;
        width: 100%;
        padding: 0 0 20px
    }

    .service-logo {
        max-width: 122px;
        margin-bottom: 20px
    }

    .whitepapers-section .btn-simple {
        display: block
    }

    .rounded-box {
        margin: 0 -16px
    }

    .ow-items-diff-sizes .ow-item {
        width: 100%;
        margin-bottom: 30px;
        height: auto
    }

    .ow-items-diff-sizes .ow-item > a {
        height: auto
    }

    .ow-items-diff-sizes .ow-item img {
        max-width: 98%;
        position: static
    }

    .fancy-list li {
        margin-right: 0
    }

    .fancy-list-grey .fl-item {
        width: 100%
    }

    .dif-logos-list {
        max-width: 300px
    }

    .dif-logos-list li {
        width: 47%
    }

    .expanded-mode .thumbnails img {
        max-width: 81px
    }

    .wide-expanded-section .thumbnails {
        margin-right: -60px
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }

    .demo-video-box h4, .expanded-mode h3, .expanded-mode h4 {
        font-size: 20px;
        padding-right: 56px
    }

    .aside-form-box {
        width: 100%
    }

    .aside-form-box .field-error input {
        background-position: 99% -811px !important
    }

    .aside-form-box .field-success input {
        background-position: 99% -567px !important
    }

    .cs-preview-design-pad .featured-work-block, .demo-reel-block, .design-samples-section, .featured-work-block, .industry-recognition-wide-section, .testimonials-wide-section {
        padding-left: 20px;
        padding-right: 20px
    }

    .design-samples-section .featured-work-block, .newsletter-section .featured-work-block, .our-work-section .featured-work-block, .our-work-section-with-link .featured-work-block {
        padding-left: 0;
        padding-right: 0
    }

    .step-content .img-right {
        width: 100%
    }

    .step-content .btn-simple {
        padding-left: 40px;
        padding-right: 40px
    }

    .btn-simple-blue {
        font-size: 12px;
        padding-left: 30px;
        padding-right: 30px
    }

    .steps-controls .text {
        bottom: 3px;
        font-size: 12px
    }

    .steps-controls {
        padding-left: 5px;
        padding-right: 0
    }

    #slider_full-width .step-content h3 {
        font-size: 22px
    }

    .sfw-slide-frame h3 span {
        left: -40px;
        width: 30px
    }

    #slider_full-width .sfw-slide-frame {
        padding-left: 30px
    }

    .three-phase-section .phase-slider-holder .step2 {
        left: 57%
    }

    .rs-items .rs-item {
        -ms-transform: scale(0.8, .8);
        -webkit-transform: scale(0.8, .8);
        transform: scale(0.8, .8)
    }

    .result-section .rs-items {
        padding-top: 60px
    }

    .rs-items .rs-item {
        margin: 0 auto 40px
    }

    .rs-items .rs-item:nth-child(2) {
        margin: 0 auto 75px
    }

    .categories-testim .ico-category {
        width: 60px
    }

    .categories-testim .title-category span {
        font-size: 20px
    }

    .featured-work-fullscreen .expanded-mode {
        margin-left: -16px;
        margin-right: -16px
    }

    .top-section .s-right {
        margin-top: 10px
    }

    .biowars-section4 .s-right, .medcpu-section2 .s-right, .medcpu-section3 .s-right {
        min-height: 230px;
        margin-bottom: -20px
    }

    .medcpu-section7 .s-right {
        min-height: 370px
    }

    .medcpu-section1 .s-right, .medcpu-section4 .s-right {
        min-height: 300px
    }

    .biowars-section5 .s-right, .dance-section4 .s-right, .top-section .bg.btm-corner .s-right {
        min-height: 200px;
        margin-bottom: -20px
    }

    .dance-section4 .s-right, .medcpu-section1 .s-right, .medcpu-section2 .s-right, .medcpu-section3 .s-right {
        background-size: 100% auto
    }

    .medcpu-section3 .s-right {
        min-height: 270px
    }

    .simple-slider p.size02 {
        font-size: 20px
    }
}

@media only screen and (max-width: 320px) {
    .develop-pg .top-section .s-right {
        min-height: 230px;
        margin-top: 10px
    }

    .home-nutshell-content .h3, .home-nutshell-content h3, .in-the-news-content h2, .in-the-news-content h3, .our-clients-content h2, .our-clients-content h3, .our-latest-projects-content h3, .serve-all-industries-content h3, .text-section h3 {
        font-size: 32px;
        line-height: 40px
    }

    .hnc-subcaption-fs {
        font-size: 20px
    }

    .text-section h4 {
        font-size: 20px;
        line-height: 22px
    }

    .home-resources-img-content .hric-img .tablet-img, .in-the-news-content .tablet-img {
        display: none
    }

    .home-resources-img-content .hric-img .mobile-img, .in-the-news-content .mobile-img {
        display: block;
        margin: 0 auto
    }

    .obc-columns .obcc-column {
        width: 100%
    }

    .hs-left .simple-sep, .hsl-subcaption {
        display: none
    }

    .hs-left .shadow-sep {
        border-bottom: 1px solid #FFF;
        border-top: 1px solid #E2E3E3;
        height: 0;
        background: 0 0
    }

    .home-nutshell-wrapper {
        padding-top: 85px
    }

    .serve-all-industries-wrapper {
        padding: 80px 0
    }

    .saic-columns .saic-column-list {
        width: 80%
    }

    .home-resources-img-wrapper {
        padding-bottom: 80px
    }

    .home-resources-img-content .hric-img {
        margin-top: 50px
    }

    .in-the-news-wrapper, .our-blog-wrapper, .our-clients-wrapper {
        padding: 85px 0
    }

    .our-blog-wrapper .blue-middle-box {
        margin-top: -128px
    }

    .succeeding-online > h2, .succeeding-online > h3 {
        line-height: 30px
    }

    .our-blog-content h3 {
        font-size: 32px
    }

    .obc-columns {
        padding: 60px 0 20px
    }

    .industry-recognition-logos .desktop-img, .industry-recognition-logos .tablet-img {
        display: none
    }

    .industry-recognition-logos .mobile-img {
        display: block
    }

    .tpp-heading {
        font-size: 17px
    }

    .ow-items-diff-sizes .ow-item {
        width: 100%
    }

    .expanded-mode .thumbnails img {
        max-width: 72px
    }

    .wide-expanded-section .main-image {
        margin-left: -40px
    }

    .wide-expanded-section .thumbnails {
        margin-right: -56px
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }

    .expanded-mode .thumbnails a, .expanded-mode .thumbnails a:first-child {
        margin-left: 10px;
        margin-right: 5px
    }

    .featured-work-fullscreen .expanded-mode .thumbnails a, .featured-work-fullscreen .expanded-mode .thumbnails a:first-child {
        margin: 0
    }

    .member-descript {
        left: 0
    }

    .ps-content .btn-reason {
        padding-left: 45px;
        padding-right: 45px
    }

    .stat-box.st_img .img-desktop {
        display: none
    }

    .stat-box.st_img .img-mobile {
        display: block
    }

    .wistia_embed {
        width: 320px;
        height: 180px
    }
}

@media only screen and (min-width: 681px) {
    .ec-gallery-desk {
        display: block
    }

    .ec-gallery-mob {
        display: none
    }
}

@media only screen and (min-width: 738px) {
    .contact-pg .wh-detail--wrp .wh--top-banner .title-wrp {
        padding-right: 47%
    }
}

@media only screen and (min-width: 756px) {
    .ico-wrap:hover .icon-exploratory svg {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    .ico-wrap:hover .icon-sketches svg {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    .ico-wrap:hover .icon-fianl-logo svg {
        -webkit-transform: rotate(-135deg);
        transform: rotate(-135deg)
    }

    .icon-hand:hover img:nth-child(2) {
        -webkit-animation: anim-icon-hand 1s;
        animation: anim-icon-hand 1s
    }

    .icon-hand:hover img:nth-child(1) {
        -webkit-animation: anim-icon-finger 1s;
        animation: anim-icon-finger 1s
    }

    .ico-wrap:hover .icon-word-cloud {
        -webkit-animation: anim-icon-cloud .5s;
        animation: anim-icon-cloud .5s
    }

    .ico-wrap:hover .icon-abc-part:before {
        -webkit-animation: anim-icon-abc .7s;
        animation: anim-icon-abc .7s
    }

    .ico-wrap:hover .css-icon-pupil {
        -webkit-animation: anim-icon-pupil .7s;
        animation: anim-icon-pupil .7s
    }

    .ico-wrap:hover .css-icon-present-1 {
        -webkit-animation: anim-icon-present .7s;
        animation: anim-icon-present .7s
    }

    .ico-wrap:hover .icon-svg .colors-strike2 {
        -webkit-animation: anim-colors-strike2 .8s;
        animation: anim-colors-strike2 .8s
    }

    .ico-wrap:hover .icon-svg .colors-strike3 {
        -webkit-animation: anim-colors-strike3 .8s;
        animation: anim-colors-strike3 .8s
    }

    .easel-box-wrap {
        float: left;
        width: 385px;
        height: 385px
    }

    .easel-box1 {
        background-position: 0 -8470px
    }

    .easel-box2 {
        background-position: 0 -14245px
    }

    .easel-box3 {
        background-position: 0 -19250px
    }

    .easel-box4 {
        background-position: 0 -4235px
    }

    .easel-box5 {
        background-position: 0 -11165px
    }

    .easel-box6 {
        background-position: 0 -15785px
    }

    .active-easel-slide .easel-box1 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim1 1.2s steps(22) forwards;
        animation: easelAnim1 1.2s steps(22) forwards
    }

    .active-easel-slide .easel-box2 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim2 .7s steps(15) forwards;
        animation: easelAnim2 .7s steps(15) forwards
    }

    .active-easel-slide .easel-box3 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim3 .7s steps(13) forwards;
        animation: easelAnim3 .7s steps(13) forwards
    }

    .active-easel-slide .easel-box4 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim4 .7s steps(11) forwards;
        animation: easelAnim4 .7s steps(11) forwards
    }

    .active-easel-slide .easel-box5 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim5 .7s steps(18) forwards;
        animation: easelAnim5 .7s steps(18) forwards
    }

    .active-easel-slide .easel-box6 {
        opacity: 1;
        z-index: 10;
        -webkit-animation: easelAnim6 .7s steps(12) forwards;
        animation: easelAnim6 .7s steps(12) forwards
    }

    .drag-pager, .easel-pager {
        display: block
    }

    .rocket-active-0 .rocket-item {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    .rocket-active-1 .rocket-item {
        -webkit-transition: all .4s linear .4s;
        transition: all .4s linear .4s;
        left: 23%;
        bottom: 8%;
        -webkit-transform: rotate(24deg);
        transform: rotate(24deg)
    }

    .rocket-active-2 .rocket-item {
        left: 39%;
        bottom: 4%;
        -webkit-transform: rotate(73deg);
        transform: rotate(73deg)
    }

    .rocket-active-3 .rocket-item {
        left: 55%;
        bottom: 6%;
        -webkit-transform: rotate(83deg);
        transform: rotate(83deg)
    }

    .rocket-active-4 .rocket-item {
        left: 70%;
        bottom: 8%;
        -webkit-transform: rotate(70deg);
        transform: rotate(70deg)
    }

    .rocket-active-5 .rocket-item {
        left: 70%;
        bottom: 8%;
        -webkit-transform: rotate(70deg) scale(1);
        transform: rotate(70deg) scale(1);
        -webkit-animation: rocketFinalStep 2.5s forwards linear;
        animation: rocketFinalStep 2.5s forwards linear
    }

    .rocket-active-5.steps-forward-diff5 .rocket-item {
        -webkit-animation: rocketFinalStep5 2.5s forwards linear;
        animation: rocketFinalStep5 2.5s forwards linear
    }

    .rocket-active-5.steps-forward-diff4 .rocket-item {
        -webkit-animation: rocketFinalStep4 2.5s forwards linear;
        animation: rocketFinalStep4 2.5s forwards linear
    }

    .rocket-active-5.steps-forward-diff3 .rocket-item {
        -webkit-animation: rocketFinalStep3 2.5s forwards linear;
        animation: rocketFinalStep3 2.5s forwards linear
    }

    .rocket-active-5.steps-forward-diff2 .rocket-item {
        -webkit-animation: rocketFinalStep2 2.5s forwards linear;
        animation: rocketFinalStep2 2.5s forwards linear
    }

    .rocket-active-4.active-b .rocket-item {
        -webkit-animation: rocketFinalBack 1s forwards linear;
        animation: rocketFinalBack 1s forwards linear
    }

    .rocket-active-3.steps-diff2 .rocket-item {
        -webkit-animation: rocketFinalBack3 1s forwards linear;
        animation: rocketFinalBack3 1s forwards linear
    }

    .rocket-active-2.steps-diff3 .rocket-item {
        -webkit-animation: rocketFinalBack2 1s forwards linear;
        animation: rocketFinalBack2 1s forwards linear
    }

    .rocket-active-1.steps-diff4 .rocket-item {
        -webkit-animation: rocketFinalBack1 1s forwards linear;
        animation: rocketFinalBack1 1s forwards linear
    }

    .rocket-active-0.steps-diff5 .rocket-item {
        -webkit-animation: rocketFinalBack0 1s forwards linear;
        animation: rocketFinalBack0 1s forwards linear
    }

    .rocket-slider-wrap:before {
        position: absolute;
        top: 4px;
        width: 8px;
        height: 112px;
        content: "";
        background: #009ddc;
        z-index: 1
    }

    .rocket-pager {
        padding: 4px 8px 0;
        margin: 0 0 -10px;
        position: relative;
        z-index: 6
    }

    .pager-filler {
        position: absolute;
        top: 4px;
        left: 8px;
        right: 8px;
        height: 100px;
        z-index: 2
    }

    .filler-indicator {
        display: block;
        position: relative;
        width: 18.66%;
        height: 100px;
        background: #009ddc;
        -webkit-transition: width .4s;
        transition: width .4s
    }

    .alt .filler-indicator {
        width: 12.5%
    }

    .rocket-active-1 .filler-indicator {
        width: 33.32%
    }

    .rocket-active-2 .filler-indicator {
        width: 49.98%
    }

    .rocket-active-3 .filler-indicator {
        width: 66.64%
    }

    .rocket-active-4 .filler-indicator {
        width: 83.33%
    }

    .rocket-active-5 .filler-indicator {
        width: 100%
    }

    .rocket-active-1 .alt .filler-indicator {
        width: 25%
    }

    .rocket-active-2 .alt .filler-indicator {
        width: 37.5%
    }

    .rocket-active-3 .alt .filler-indicator {
        width: 50%
    }

    .rocket-active-4 .alt .filler-indicator {
        width: 62.5%
    }

    .rocket-active-5 .alt .filler-indicator {
        width: 75%
    }

    .rocket-active-6 .alt .filler-indicator {
        width: 87.5%
    }

    .rocket-active-7 .alt .filler-indicator {
        width: 100%
    }

    .filler-active {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        background: #90c404;
        content: "";
        -webkit-transition: width .4s;
        transition: width .4s
    }

    .filler-active.filled:after {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 0;
        height: 0;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-top: 10px solid #90c404;
        content: ""
    }

    .rocket-pager ul {
        width: 100%;
        position: relative;
        z-index: 4
    }

    .rocket-pager li {
        float: left;
        width: 16.66%
    }

    .rocket-pager li:first-child {
        width: 18.66%
    }

    .rocket-pager li:nth-child(2) {
        float: left;
        width: 14.66%
    }

    .alt .rocket-pager li {
        width: 12.5%
    }

    .rocket-pager li a {
        display: table;
        width: 100%;
        height: 100px;
        text-align: center;
        color: #0078ae;
        font: 16px/1.3 roboto-bold-webfont, sans-serif;
        -webkit-transition: color .2s .2s;
        transition: color .2s .2s
    }

    .rocket-active-1 .rocket-pager li:nth-child(1) a, .rocket-active-2 .rocket-pager li:nth-child(1) a, .rocket-active-2 .rocket-pager li:nth-child(2) a, .rocket-active-3 .rocket-pager li:nth-child(1) a, .rocket-active-3 .rocket-pager li:nth-child(2) a, .rocket-active-3 .rocket-pager li:nth-child(3) a, .rocket-active-4 .rocket-pager li:nth-child(1) a, .rocket-active-4 .rocket-pager li:nth-child(2) a, .rocket-active-4 .rocket-pager li:nth-child(3) a, .rocket-active-4 .rocket-pager li:nth-child(4) a, .rocket-active-5 .rocket-pager li:nth-child(1) a, .rocket-active-5 .rocket-pager li:nth-child(2) a, .rocket-active-5 .rocket-pager li:nth-child(3) a, .rocket-active-5 .rocket-pager li:nth-child(4) a, .rocket-active-5 .rocket-pager li:nth-child(5) a, .rocket-active-5 .rocket-pager li:nth-child(6) a, .rocket-active-6 .rocket-pager li:nth-child(1) a, .rocket-active-6 .rocket-pager li:nth-child(2) a, .rocket-active-6 .rocket-pager li:nth-child(3) a, .rocket-active-6 .rocket-pager li:nth-child(4) a, .rocket-active-6 .rocket-pager li:nth-child(5) a, .rocket-active-6 .rocket-pager li:nth-child(6) a, .rocket-active-7 .rocket-pager li:nth-child(1) a, .rocket-active-7 .rocket-pager li:nth-child(2) a, .rocket-active-7 .rocket-pager li:nth-child(3) a, .rocket-active-7 .rocket-pager li:nth-child(4) a, .rocket-active-7 .rocket-pager li:nth-child(5) a, .rocket-active-7 .rocket-pager li:nth-child(6) a, .rocket-active-7 .rocket-pager li:nth-child(7) a, .rocket-active-7 .rocket-pager li:nth-child(8) a, .rocket-active-8 .rocket-pager li:nth-child(1) a, .rocket-active-8 .rocket-pager li:nth-child(2) a, .rocket-active-8 .rocket-pager li:nth-child(3) a, .rocket-active-8 .rocket-pager li:nth-child(4) a, .rocket-active-8 .rocket-pager li:nth-child(8) a, .rocket-pager a.active {
        color: #fff
    }

    .rocket-pager li span {
        display: table-cell;
        vertical-align: middle;
        padding: 10px 3px
    }

    .rocket-active-1 .rocket-flame {
        display: block
    }

    .rocket-active-1.active-b .rocket-flame, .rocket-active-1.active-b .start-smoke, .rocket-active-2 .rocket-flame {
        opacity: 0
    }

    .rocket-active-5 .rocket-flame {
        display: block;
        top: 192px;
        -webkit-animation: flameFinalStep 2.4s forwards linear;
        animation: flameFinalStep 2.4s forwards linear
    }

    .rocket-active-5 .start-smoke {
        -webkit-animation: smokeFinalStep 2.5s forwards linear;
        animation: smokeFinalStep 2.5s forwards linear
    }

    .rocket-active-1 .sm-smoke1 {
        -webkit-animation: smoke1 1s forwards linear;
        animation: smoke1 1s forwards linear
    }

    .rocket-active-1 .sm-smoke2 {
        -webkit-animation: smoke2 .5s 2 forwards linear .1s;
        animation: smoke2 .5s 2 forwards linear .1s
    }

    .rocket-active-0 .running-smoke {
        display: none
    }

    .rst-col {
        float: left;
        width: 56%
    }

    .alt .rst-col p {
        margin-bottom: 20px
    }

    .rst-col:first-child {
        width: 44%;
        padding-right: 28px
    }
}

@media only screen and (min-width: 756px) and (max-width: 1024px) {
    .logo-benefits .slider-txt-wrap {
        padding-right: 10px
    }

    .show-in-tablet {
        display: inline
    }

    .logo-process {
        padding-top: 50px;
        background: url("../images/logo-design/bg-logo-process.jpg") 50% 7px/100% no-repeat
    }

    .logo-benefits {
        background: url("../image/tzz_ion-1.png") 50% 0/auto auto no-repeat;
        margin: 0
    }

    .logo-process h2 {
        font-size: 45px
    }

    .logo-process p {
        padding-bottom: 30px
    }

    .lp-steps {
        max-width: 756px;
        margin: 0 auto -28px;
        background: url("../images/logo-design/bg-steps-tablet.png") 50% 100% no-repeat
    }

    .lp-steps li {
        font-size: 13px;
        line-height: 16px
    }

    .lp-steps .ico-wrap {
        width: 52px;
        height: 52px;
        margin: 14px auto 6px
    }

    .lp-steps .ico-wrap img {
        max-width: 66%
    }

    .icon-svg {
        width: 35px;
        height: 35px
    }

    .icon-abc-part {
        width: 22px
    }

    .ico-wrap:hover .icon-abc-part:before {
        -webkit-animation: anim-icon-abc-tab .7s;
        animation: anim-icon-abc-tab .7s
    }

    .icon-abc-part:before {
        width: 22px;
        font-size: 11px;
        line-height: 13px
    }

    .icon-sketches {
        -webkit-transform: translate(-50%, -50%) scale(0.85);
        transform: translate(-50%, -50%) scale(0.85)
    }

    .css-icon-pupil:before {
        width: 16px;
        height: 16px;
        border-width: 4px
    }

    .css-icon-present-1 {
        width: 18px;
        height: 15px;
        top: 12px
    }

    .ico-wrap:hover .css-icon-present-1 {
        -webkit-animation: anim-icon-present-tab .7s;
        animation: anim-icon-present-tab .7s
    }

    .css-icon-present-1:after {
        height: 11px;
        font-size: 15px;
        line-height: 3px
    }

    .css-icon-present-1:before {
        top: 10px
    }

    .icon-colors {
        -webkit-transform: translate(-50%, -50%) scale(0.8);
        transform: translate(-50%, -50%) scale(0.8)
    }

    .icon-fianl-logo {
        width: 27px;
        height: 27px
    }

    .lp-steps .cur-step {
        width: 52px;
        height: 68px;
        bottom: -10px
    }

    .lp-steps .cur-step-sub {
        width: 52px;
        height: 52px
    }

    .lp-steps #curStep {
        width: 52px;
        height: 68px
    }

    .lp-steps ul.active-0 .cur-step {
        left: 22px
    }

    .lp-steps ul.active-1 .cur-step {
        left: 116px
    }

    .lp-steps ul.active-2 .cur-step {
        left: 210px
    }

    .lp-steps ul.active-3 .cur-step {
        left: 304px
    }

    .lp-steps ul.active-4 .cur-step {
        left: 400px
    }

    .lp-steps ul.active-5 .cur-step {
        left: 494px
    }

    .lp-steps ul.active-6 .cur-step {
        left: 588px
    }

    .lp-steps ul.active-7 .cur-step {
        left: 682px
    }

    .lp-steps ul.active-0 #curStep {
        fill: #4e4e4e
    }

    .lp-steps ul.active-1 #curStep {
        fill: #87c556
    }

    .lp-steps ul.active-2 #curStep {
        fill: #eb8a0d
    }

    .lp-steps ul.active-3 #curStep {
        fill: #ab840c
    }

    .lp-steps ul.active-4 #curStep {
        fill: #56d3c6
    }

    .lp-steps ul.active-5 #curStep {
        fill: #882fa0
    }

    .lp-steps ul.active-6 #curStep {
        fill: #c44441
    }

    .lp-steps ul.active-7 #curStep {
        fill: #0078ae
    }

    .logo-process .lp-slider {
        padding-bottom: 70px
    }

    .lp-slider-img {
        width: 290px;
        height: 290px
    }

    .lp-slider-img:after {
        background: url("../image/tzz_ion-1.png") 0 -394px no-repeat
    }

    .logo-benefits .lp-slider h3, .lp-slider-txt h3 {
        padding-top: 27px;
        font-size: 40px
    }

    .lp-mobile-swipe {
        height: 86%
    }

    .page-intro-center-alt {
        font-size: 15px
    }

    .page-intro-center-alt h2.main-title {
        font-size: 45px
    }

    #easel-slide-section {
        overflow: hidden
    }

    #easel-slide-section .frame {
        max-width: 768px;
        margin-left: auto;
        margin-right: auto
    }

    .easel-text {
        width: 39%;
        margin-right: 46px;
        float: right;
        font-size: 16px;
        line-height: 1.6;
        padding: 0
    }

    .easel-slider h3 {
        font-size: 30px
    }

    .drag-pager {
        margin: 36px 10px 26px
    }

    .easel-pager {
        margin: 0
    }

    .inner-drag-pager {
        width: 84%
    }

    .easel-box-wrap {
        margin: -13px 0 0 22px;
        background-image: url("../images/best-website/easel-frame-tablet.jpg");
        background-repeat: no-repeat
    }

    .easel-box {
        background-image: url("../images/best-website/easel-sprite-tablet.jpg");
        background-repeat: no-repeat
    }

    .easel-box4, .easel-box5, .easel-box6 {
        background-image: url("../images/best-website/easel-sprite-part2-tablet.jpg");
        background-repeat: no-repeat
    }

    .easel-controls .pull-left {
        left: -20px
    }

    .easel-controls .pull-right {
        right: -26px
    }

    .easel-pager a {
        font-size: 15px
    }

    .rocket-animation {
        overflow: hidden
    }

    .rocket-slider-wrap {
        max-width: 100%;
        overflow: hidden
    }

    .rocket-slider-wrap:before {
        display: none
    }

    .rocket-pager {
        padding-left: 0;
        padding-right: 0
    }

    .rocket-section {
        padding: 46px 0 52px
    }

    .blue-heading {
        font-size: 15px
    }

    .blue-heading h2 {
        font-size: 45px;
        line-height: 1;
        margin: 0 0 10px
    }

    .pager-filler {
        left: 0;
        right: 0
    }

    .rocket-pager li a {
        font-size: 13px
    }

    .rocket-slider {
        border-radius: 0
    }

    .rocket-slider-text {
        font-size: 15px
    }

    .rst-col, .rst-col:first-child {
        float: none;
        width: 100%
    }

    .rst-col:first-child {
        padding: 0 0 20px
    }

    .rst-col .img {
        width: 240px;
        height: 240px;
        background-size: cover
    }
}

@media only screen and (min-width: 769px) {
    .search-container .sc-aside ul {
        display: block !important
    }

    .industry-section:after {
        background: url("../images/home/bg-idustry.jpg") 50% 0 no-repeat
    }

    .seotr-section.section01 {
        background: url("../images/bg/bg-seotr01.jpg") 50% 0 no-repeat
    }

    .seotr-section.section02 {
        background: url("../images/bg/bg-seotr02.jpg") 50% 0 no-repeat
    }

    .seotr-section.section03 {
        background: url("../images/bg/bg-seotr03.jpg") 50% 0 no-repeat
    }
}

@media only screen and (min-width: 881px) {
    .case-pg .frame.t-holder > .t-cell, .case-pg .main-section .inner-bg, .case-pg .top-section .s-left, .continue-section .PT-awards, .fullpage-wrapper .t-holder {
        height: 100% !important
    }

    
        
        
        
        
        
        
        
        
    

    
        
        
        
    

    
        
    

    .head-top {
        padding-top: 12px
    }

    .header {
        padding: 0;
        border-top: 4px solid #0078ae;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 60
    }

    .top-page-panel {
        padding: 41px 10px 5px
    }

    .header .frame {
        padding: 0 10px 11px;
        height: 100px;
        overflow: hidden;
        transition: height .2s ease-out, opacity .4s ease-out
    }

    .head-r-side {
        position: relative;
        -webkit-transition: margin .4s ease-out;
        -moz-transition: margin .4s ease-out;
        transition: margin .4s ease-out
    }

    .additional-nav {
        padding-top: 1px
    }

    .nav .phone {
        font: 700 16px/20px roboto-bold-webfont, arial, sans-serif;
        color: #5a6063;
        vertical-align: middle;
        border-left: 1px solid #dadada;
        margin: 0;
        padding: 0 13px;
        line-height: 25px;
        display: block
    }

    .nav .phone em {
        background: url("../image/tzz_ion-1.png") no-repeat;
        width: 21px;
        height: 21px;
        margin: 2px 5px 0 0;
        display: inline-block;
        font-size: 0;
        line-height: 0;
        vertical-align: top
    }

    .nav .phone:hover {
        : roboto-medium-webfont, Arial, Helvetica, Sans-Serif !important
    }

    .additional-nav li a, .additional-nav li span {
        font: 12px/25px Arial
    }

    .hm-advancedmenu {
        padding: 21px 0 0
    }

    .ht-nav li {
        padding: 0 3px 0 6px
    }

    .ht-simplemenu .search {
        margin: 2px 4px 0 5px
    }

    .home-slider-wrapper {
        padding-top: 105px;
        background: #fbfbfb
    }

    .hs-left .simple-sep {
        border-color: #e1e2e2;
        box-shadow: 0 2px #fff;
        margin-bottom: 25px
    }

    #main {
        padding-top: 116px
    }

    .wrapper-simple #main {
        padding-top: 0
    }

    .header.h-animated {
        border-top-color: #fff
    }

    .simple-header, .simple-header.h-animated {
        border-top-color: #0078AE;
        padding-bottom: 13px;
        position: static
    }

    .h-animated .logo {
        top: 10px;
        width: 228px;
        height: 38px;
        background-size: 228px 38px
    }

    .simple-header.h-animated .logo {
        top: 20px;
        width: 360px;
        height: 60px;
        background-size: 360px 60px
    }

    .h-animated .head-r-side {
        margin-top: -45px;
        -webkit-transition: all .4s ease-out;
        -moz-transition: all .4s ease-out;
        transition: all .4s ease-out
    }

    .h-animated .head-no-transition {
        margin-top: 0
    }

    .h-animated .nav > .link > a {
        padding: 0 8px;
        -webkit-transition: all 0s ease-out;
        -moz-transition: all 0s ease-out;
        transition: all 0s ease-out
    }

    .h-animated > .frame {
        height: 67px;
        -webkit-transition: all .2s ease-out;
        -moz-transition: all .2s ease-out;
        transition: all .2s ease-out
    }

    .simple-header.h-animated > .frame {
        height: 100px
    }

    .h-animated .nav .p-box {
        visibility: visible;
        width: 161px;
        -webkit-transition: width .3s ease-out;
        -moz-transition: width .3s ease-out;
        transition: width .3s ease-out
    }
}

@media only screen and (min-width: 1170px) {
    .top-section .s-left {
        padding-top: 30px
    }

    .static-sublevel .tpp-nav .active {
        position: static
    }

    .static-sublevel .tpp-nav .active > a {
        padding-bottom: 17px;
        margin-bottom: -7px;
        border-bottom: none;
        border-bottom-right-radius: 0
    }

    .static-sublevel .tpp-nav .sublevel {
        top: -100px;
        transition: top .3s linear
    }

    .static-sublevel .tpp-nav .active .sublevel {
        opacity: 1;
        visibility: visible;
        width: 100%;
        background: #fff;
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 12;
        padding: 0;
        box-shadow: 0 2px 2px rgba(0, 0, 0, .1)
    }

    .static-sublevel .active .sublevel ul {
        max-width: 980px;
        margin: 0 auto;
        display: table;
        width: 100%
    }

    .static-sublevel .active .sublevel li {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        min-width: 0;
        margin: 0;
        padding: 0;
        border: none;
        height: 51px;
        position: relative
    }

    .static-sublevel .active .sublevel a {
        border-radius: 0;
        padding: 6px 15px 5px;
        display: inline-block;
        vertical-align: top;
        text-transform: uppercase;
        font: 14px/1.3 roboto-regular-webfont, arial, Helvetica, sans-serif;
        width: 100%;
        min-height: 0
    }

    .static-sublevel .active .sublevel a:before {
        display: none
    }

    .static-sublevel .active .sublevel li:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        background: #dadada;
        height: 25px;
        width: 1px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .static-sublevel .active .sublevel li:first-child:before {
        display: none
    }

    .static-sublevel .active .sublevel li:first-child > a {
        padding-left: 0
    }

    .static-sublevel .active .sublevel li:last-child > a {
        padding-right: 0
    }

    .static-sublevel {
        margin-bottom: 51px
    }

    .services-pg {
        margin-top: -51px
    }

    .static-sublevel .active .active a {
        color: #90c404;
        margin: 0;
        position: relative
    }

    .static-sublevel .active .active {
        position: relative
    }

    .static-sublevel .active .active:after {
        content: "";
        height: 1px;
        width: 100%;
        background: #90c404;
        position: absolute;
        bottom: -1px;
        left: 1px
    }

    .read-more-anim span {
        right: 15px;
        bottom: 15px
    }

    .feat-txt-altsize {
        font: 22px/1.4 roboto-light-webfont, sans-serif
    }

    .feat-txt-altsize h5 {
        font-size: 28px;
        : roboto-medium-webfont, sans-serif
    }

    .feat-txt-altsize ul li {
        font: 18px roboto-regular-webfont, sans-serif
    }

    .feat-txt-altsize ul li:before {
        font-size: 26px
    }

    .feat-txt-altsize p strong {
        : roboto-medium-webfont, sans-serif
    }
}

@media only screen and (min-width: 1025px) {
    .wide-expanded-section .exp-bg.pancake {
        background-image: url("../images/mobile-design/pancake/pancake-bg.jpg")
    }

    .wide-expanded-section .exp-bg.artdex {
        background-image: url("../images/mobile-design/artdex/artdex-bg.jpg")
    }

    .wide-expanded-section .exp-bg.proshop {
        background-image: url("../images/mobile-design/proshop/proshop-bg.jpg")
    }

    .wide-expanded-section .exp-bg.luxor {
        background-image: url("../images/mobile-design/luxor/luxor-bg.jpg")
    }

    .wide-expanded-section .exp-bg.biowars {
        background-image: url("../images/mobile-design/biowars/biowars-bg.jpg")
    }

    .lb-steps.full-alt li a {
        min-width: 137px;
        padding: 10px 15px
    }

    .feat-section-frame .section-title h2 {
        font-size: 50px
    }

    .wide-featexp-section .section-title h2 {
        font: 70px roboto-medium-webfont, sans-serif
    }

    .an-paul {
        background: url("../images/projects/paul/bg.png") 85% 0 no-repeat;
        -webkit-transition: background-position .3s;
        transition: background-position .3s
    }

    .an-paul:before {
        content: "";
        background: url("../images/projects/paul/hand.png");
        width: 173px;
        height: 414px;
        position: absolute;
        top: 25px;
        left: 239px;
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-transition: all .3s;
        transition: all .3s;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%
    }

    .an-paul:after {
        content: "";
        background: url("../images/projects/paul/logo.png");
        width: 196px;
        height: 33px;
        position: absolute;
        bottom: 46px;
        left: 33px
    }

    .an-paul:hover {
        background-position: 0 0
    }

    .an-paul:hover:before {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
        left: 285px;
        top: 28px
    }

    .an-nuna {
        background: url("../images/projects/nuna/bg.png") 0 100% no-repeat;
        transition: background-position .2s
    }

    .an-nuna .mouth {
        background: url("../images/projects/nuna/mouth.png");
        width: 40px;
        height: 31px;
        position: absolute;
        top: 87px;
        left: 312px;
        visibility: hidden;
        transition: left .2s
    }

    .an-nuna:before {
        content: "";
        background: url("../images/projects/nuna/arm-l.png");
        width: 199px;
        height: 103px;
        position: absolute;
        top: 140px;
        left: 202px;
        -webkit-transition: all .13s linear;
        transition: all .13s linear;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        z-index: 2
    }

    .an-nuna:after {
        content: "";
        background: url("../images/projects/nuna/arm-r.png");
        width: 55px;
        height: 99px;
        position: absolute;
        top: 90px;
        left: 181px;
        -webkit-transition: all .13s linear;
        transition: all .13s linear;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        z-index: 1
    }

    .an-nuna .an-brand {
        background: url("../images/projects/nuna/logo.png");
        width: 178px;
        height: 31px;
        position: absolute;
        bottom: 49px;
        right: 43px
    }

    .an-nuna:hover {
        background-position: 100% 100%
    }

    .an-nuna:hover:before {
        -webkit-transform: rotate(11deg) translateX(-33px) translateY(-30px);
        transform: rotate(11deg) translateX(-33px) translateY(-30px)
    }

    .an-nuna:hover:after {
        -webkit-transform: rotate(18deg);
        transform: rotate(18deg);
        left: 160px;
        top: 80px
    }

    .an-nuna:hover .mouth {
        visibility: visible;
        left: 294px
    }

    .an-aol {
        background: url("../images/projects/aol/bg.png") 50% 100% no-repeat;
        -webkit-transition: background-position .3s;
        transition: background-position .3s
    }

    .an-aol:before {
        content: "";
        background: url("../images/projects/aol/girl.png");
        width: 247px;
        height: 231px;
        position: absolute;
        bottom: 47px;
        left: -16px;
        -webkit-transition: bottom .5s, left .8s;
        transition: bottom .5s, left .8s
    }

    .an-aol .man {
        position: absolute;
        top: 40px;
        right: 0;
        width: 263px;
        height: 246px;
        -webkit-transition: top .5s, right .8s, transform .8s;
        transition: top .5s, right .8s, transform .8s;
        overflow: hidden
    }

    .an-aol .man:after {
        content: "";
        background: url("../images/projects/aol/man.png");
        width: 263px;
        height: 246px;
        position: absolute;
        top: 0;
        right: -75px;
        -webkit-transition: right .8s;
        transition: right .8s
    }

    .an-aol .an-brand {
        background: url("../images/projects/aol/logo.png");
        width: 156px;
        height: 87px;
        position: absolute;
        bottom: 33px;
        right: 27px
    }

    .an-aol:hover {
        background-position: 100% 100%;
        overflow: visible
    }

    .an-aol:hover:before {
        bottom: 30px;
        left: -45px
    }

    .an-aol:hover .man {
        top: 20px;
        -webkit-transform: translateY(15px);
        transform: translateY(15px)
    }

    .an-aol:hover .man:after {
        right: 5px
    }

    .an-baldor {
        background: url("../images/projects/baldor/bg.png") 0 100% no-repeat;
        -webkit-transition: background-position .3s;
        transition: background-position .3s;
        overflow: hidden
    }

    .an-baldor:before {
        content: "";
        background: url("../images/projects/baldor/bg-inner.jpg") 0 50%/100% auto no-repeat;
        width: 100%;
        height: 149px;
        position: absolute;
        top: 175px;
        left: 0;
        box-sizing: border-box;
        -webkit-transition: margin .8s ease-out, height .8s ease-out, -webkit-transform .5s, background-position 1s;
        transition: margin .8s ease-out, height .8s ease-out, transform .5s, background-position 1s
    }

    .an-baldor:after {
        content: "";
        background: url("../images/projects/baldor/logo.png");
        width: 196px;
        height: 135px;
        position: absolute;
        top: 182px;
        left: 158px;
        -webkit-transition: -webkit-transform .7s;
        transition: transform .7s
    }

    .an-baldor:hover {
        background-position: 100% 100%
    }

    .an-baldor:hover:before {
        margin: -24px 0;
        height: 197px;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        background-position: 0 130%
    }

    .an-baldor:hover:after {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    .an-epicreads {
        background: url("../images/projects/epicreads/bg.png") 0 25px no-repeat;
        -webkit-transition: all .4s;
        transition: all .4s
    }

    .an-epicreads:before {
        content: "";
        background: url("../images/projects/epicreads/logo.jpg") 53% 43% no-repeat #000;
        width: 100%;
        height: 200px;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 4;
        -webkit-transition: all .4s;
        transition: all .4s
    }

    .an-epicreads .an-books {
        background: url("../images/projects/epicreads/books.jpg");
        width: 207px;
        height: 242px;
        position: absolute;
        top: 80px;
        left: 68px;
        z-index: 3;
        -webkit-transition: all .4s;
        transition: all .4s
    }

    .an-epicreads .an-book-left {
        background: url("../images/projects/epicreads/book-left.png");
        width: 56px;
        height: 259px;
        position: absolute;
        top: 37px;
        left: 27px;
        z-index: 2;
        -webkit-transition: all .6s;
        transition: all .6s
    }

    .an-epicreads .an-book-right {
        background: url("../images/projects/epicreads/book-right.png");
        width: 68px;
        height: 325px;
        position: absolute;
        top: 39px;
        right: 197px;
        z-index: 2;
        -webkit-transition: all .6s;
        transition: all .6s
    }

    .an-epicreads:hover {
        background-position: 0 13px
    }

    .an-epicreads:hover:before {
        height: 167px
    }

    .an-epicreads:hover .an-books {
        top: 68px
    }

    .an-epicreads:hover .an-book-left {
        top: 28px;
        left: 14px
    }

    .an-epicreads:hover .an-book-right {
        top: 30px;
        right: 171px
    }

    .an-johnjay {
        overflow: hidden
    }

    .an-johnjay .an-bg {
        background: url("../images/projects/johnjay/bg.jpg") 100% 100% no-repeat;
        -webkit-transition: all .3s;
        transition: all .3s;
        position: absolute;
        bottom: 0;
        left: -48px;
        width: 563px;
        height: 394px;
        z-index: 1
    }

    .an-johnjay .an-bg:before {
        content: "";
        background: url("../images/projects/johnjay/people.png") no-repeat;
        width: 378px;
        height: 154px;
        position: absolute;
        bottom: 6px;
        left: 178px
    }

    .an-johnjay:after {
        content: "";
        background: url("../images/projects/johnjay/logo.png");
        width: 203px;
        height: 159px;
        position: absolute;
        bottom: 269px;
        left: 25px;
        -webkit-transition: all .7s;
        transition: all .7s;
        z-index: 2
    }

    .an-johnjay:hover .an-bg {
        left: 0
    }

    .an-johnjay:hover .an-bg:before {
        background: url("../images/projects/johnjay/people.gif") 20px 25px no-repeat;
        width: 459px;
        height: 207px;
        left: 130px
    }

    .an-johnjay:hover:after {
        bottom: 189px
    }

    .an-uspolo {
        background: url("../images/projects/uspolo/bg.jpg") -33px 100% no-repeat;
        -webkit-transition: background-position .7s;
        transition: background-position .7s;
        overflow: hidden
    }

    .an-uspolo:before {
        content: "";
        background: url("../images/projects/uspolo/girl.png") 0 100%;
        width: 309px;
        height: 434px;
        position: absolute;
        bottom: 0;
        right: -33px;
        -webkit-transition: all .7s;
        transition: all .7s;
        z-index: 2
    }

    .an-uspolo:after {
        content: "";
        background: url("../images/projects/uspolo/logo.gif") 32px 50% no-repeat #fff;
        width: 100%;
        height: 111px;
        position: absolute;
        bottom: 50px;
        left: 0;
        z-index: 1
    }

    .an-uspolo:hover {
        background-position: 0 100%
    }

    .an-uspolo:hover:before {
        right: 0
    }

    .an-deborah {
        background: url("../images/projects/deborah/bg.jpg") 100% 100% no-repeat;
        -webkit-transition: background-position .3s;
        transition: background-position .3s;
        overflow: hidden
    }

    .an-deborah:after {
        content: "";
        background: url("../images/projects/deborah/logo.png") no-repeat;
        -webkit-transition: -webkit-transform .2s linear, left .6s ease-out;
        transition: transform .2s linear, left .6s ease-out;
        width: 198px;
        height: 410px;
        position: absolute;
        bottom: 18px;
        left: 25px;
        z-index: 1
    }

    .an-deborah:hover {
        background-position: 0 100%
    }

    .an-deborah:hover:after {
        -webkit-transform: translateX(40px);
        transform: translateX(40px);
        left: 65px
    }

    .an-portmantos {
        background: url("../images/projects/portmantos/bg.jpg") 100% 100% no-repeat;
        -webkit-transition: background-position .3s linear;
        transition: background-position .3s linear;
        overflow: hidden
    }

    .an-portmantos:after, .an-portmantos:before {
        content: "";
        -webkit-transition: all .3s linear;
        transition: all .3s linear
    }

    .an-portmantos:after {
        background: url("../images/projects/portmantos/logo.png") 0 0/100% auto no-repeat;
        width: 299px;
        height: 139px;
        position: absolute;
        bottom: 58px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 2
    }

    .an-portmantos:before {
        background: url("../images/projects/portmantos/guy.png") no-repeat;
        width: 267px;
        height: 416px;
        position: absolute;
        bottom: 0;
        right: 5px;
        z-index: 1
    }

    .an-portmantos:hover {
        background-position: 0 100%
    }

    .an-portmantos:hover:after {
        width: 274px;
        height: 137px
    }

    .an-portmantos:hover:before {
        -webkit-transform: translateX(-35px);
        transform: translateX(-35px)
    }

    .an-vintry {
        background: url("../images/projects/vintry/bg.jpg") 0 100% no-repeat
    }

    .an-vintry:after, .an-vintry:before {
        content: "";
        position: absolute
    }

    .an-vintry:after {
        background: url("../images/projects/vintry/vine01.png") no-repeat;
        width: 100px;
        height: 423px;
        bottom: -1px;
        right: 24px;
        z-index: 2;
        -webkit-transition: all .3s linear;
        transition: all .3s linear
    }

    .an-vintry:before {
        background: url("../images/projects/vintry/vine02.png") no-repeat;
        width: 97px;
        height: 404px;
        bottom: 15px;
        right: 95px;
        z-index: 1;
        -webkit-transition: all .3s linear .2s;
        transition: all .3s linear .2s
    }

    .an-vintry:hover:after {
        -webkit-transform: translate(-38px, -7px);
        transform: translate(-38px, -7px)
    }

    .an-vintry:hover:before {
        -webkit-transform: translate(-44px, -7px);
        transform: translate(-44px, -7px)
    }

    .an-mood {
        overflow: hidden
    }

    .an-mood:after, .an-mood:before, .an-patch-btm:after, .an-patch-btm:before, .an-patch-top:after, .an-patch-top:before {
        content: "";
        position: absolute;
        z-index: 3;
        -webkit-transition: all .6s;
        transition: all .6s
    }

    .an-mood:after {
        background: url("../images/projects/mood/logo.jpg") 290px 216px no-repeat #fff;
        width: 100%;
        height: 392px;
        left: 0;
        bottom: 0;
        z-index: 1
    }

    .an-mood:before {
        background: url("../images/projects/mood/patch01.png") no-repeat;
        width: 280px;
        height: 282px;
        bottom: -119px;
        right: -146px
    }

    .an-mood:hover:before {
        -webkit-transform: translate(-8px, -7px);
        transform: translate(-8px, -7px)
    }

    .an-patch-top:before {
        background: url("../images/projects/mood/patch02.png") no-repeat;
        width: 248px;
        height: 253px;
        top: 49px;
        right: -39px
    }

    .an-mood:hover .an-patch-top:before {
        -webkit-transform: translate(-31px, -19px);
        transform: translate(-31px, -19px)
    }

    .an-patch-top:after {
        background: url("../images/projects/mood/patch03.png") no-repeat;
        width: 271px;
        height: 277px;
        top: 47px;
        right: 128px;
        z-index: 2
    }

    .an-mood:hover .an-patch-top:after {
        -webkit-transform: translate(11px, -19px);
        transform: translate(11px, -19px)
    }

    .an-patch-btm:before {
        background: url("../images/projects/mood/patch04.png") no-repeat;
        width: 281px;
        height: 286px;
        top: 38px;
        left: -159px;
        z-index: 4
    }

    .an-mood:hover .an-patch-btm:before {
        -webkit-transform: translate(30px, 43px);
        transform: translate(30px, 43px)
    }

    .an-patch-btm:after {
        background: url("../images/projects/mood/patch05.png") no-repeat;
        width: 279px;
        height: 277px;
        bottom: -76px;
        left: -21px
    }

    .an-mood:hover .an-patch-btm:after {
        -webkit-transform: translate(24px, -28px);
        transform: translate(24px, -28px)
    }

    .an-juice {
        overflow: hidden;
        background: url("../images/projects/juice/bg.jpg") 0 100% no-repeat
    }

    .an-bottle:after, .an-bottle:before, .an-cup:after, .an-cup:before, .an-fruit:after, .an-fruit:before, .an-juice:after, .an-juice:before {
        content: "";
        position: absolute
    }

    .an-fruit:after {
        background: url("../images/projects/juice/lemon.png") no-repeat;
        width: 138px;
        height: 95px;
        right: 15px;
        bottom: 31px;
        z-index: 5
    }

    .an-fruit:before {
        background: url("../images/projects/juice/orange.png") no-repeat;
        width: 119px;
        height: 99px;
        bottom: 57px;
        left: -3px;
        z-index: 5;
        -webkit-transition: -webkit-animation .3s ease-out;
        transition: animation .3s ease-out
    }

    .an-juice:hover .an-fruit:before {
        -webkit-animation: orangeRotate .9s linear;
        -ms-animation: orangeRotate .9s linear;
        animation: orangeRotate .9s linear
    }

    .an-bottle {
        background: url("../images/projects/juice/bottle-empty.png") no-repeat;
        position: absolute;
        width: 180px;
        height: 393px;
        bottom: 37px;
        left: 6px;
        z-index: 2;
        -webkit-transition: all .8s linear;
        transition: all .8s linear
    }

    .an-juice:hover .an-bottle {
        left: -14px
    }

    .an-bottle:before {
        background: url("../images/projects/juice/bottle-label.png") no-repeat;
        z-index: 4;
        width: 74px;
        height: 257px;
        top: 75px;
        left: 54px
    }

    .an-bottle:after {
        background: url("../images/projects/juice/bottle-full.png") 0 100% no-repeat;
        z-index: 3;
        width: 180px;
        height: 393px;
        bottom: 0;
        left: 0;
        -webkit-transition: all .8s linear;
        transition: all .8s linear
    }

    .an-juice:hover .an-bottle:after {
        height: 64%
    }

    .an-cup {
        background: url("../images/projects/juice/cup-empty.png") no-repeat;
        position: absolute;
        width: 227px;
        height: 275px;
        bottom: 66px;
        right: 77px;
        z-index: 2;
        -webkit-transition: all .6s linear;
        transition: all .6s linear
    }

    .an-juice:hover .an-cup {
        right: 57px
    }

    .an-cup:after {
        background: url("../images/projects/juice/cup-full.png") 0 100% no-repeat;
        width: 227px;
        height: 25%;
        bottom: 0;
        left: 0;
        z-index: 3;
        -webkit-transition: all .7s linear .1s;
        transition: all .7s linear .1s
    }

    .an-juice:hover .an-cup:after {
        height: 100%
    }

    .an-cup:before {
        background: url("../images/projects/juice/cup-label.png") no-repeat;
        width: 90px;
        height: 89px;
        bottom: 53px;
        right: 20px;
        z-index: 4
    }

    .an-penguin {
        background: url("../images/projects/penguin/bg.jpg") 100% 100% no-repeat;
        overflow: hidden;
        -webkit-transition: background-position .4s;
        transition: background-position .4s
    }

    .an-penguin:before {
        content: "";
        background: url("../images/projects/penguin/book-left.png");
        width: 156px;
        height: 250px;
        position: absolute;
        top: 41px;
        left: 36px;
        -webkit-transition: all .4s .14s ease-out;
        transition: all .4s .14s ease-out;
        z-index: 1
    }

    .an-penguin:after {
        content: "";
        background: url("../images/projects/penguin/book-right.png");
        width: 159px;
        height: 272px;
        position: absolute;
        top: 28px;
        left: 126px;
        -webkit-transition: all .7s;
        transition: all .7s;
        z-index: 2
    }

    .an-penguin .an-header {
        background: url("../images/projects/penguin/header.png");
        width: 200px;
        height: 249px;
        position: absolute;
        top: 102px;
        right: 14px;
        -webkit-transition: all .5s;
        transition: all .5s
    }

    .an-penguin .an-body {
        background: url("../images/projects/penguin/body.png");
        width: 164px;
        height: 150px;
        position: absolute;
        bottom: 0;
        right: 44px;
        -webkit-transition: all .5s;
        transition: all .5s
    }

    .an-penguin .an-brand {
        background: url("../images/projects/penguin/logo.png");
        width: 197px;
        height: 79px;
        position: absolute;
        bottom: 39px;
        left: 49px
    }

    .an-penguin:hover {
        background-position: -8px 100%
    }

    .an-penguin:hover .an-header {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg);
        right: -46px;
        top: 99px
    }

    .an-penguin:hover .an-body {
        right: 4px
    }

    .an-penguin:hover:after {
        left: 188px
    }

    .an-penguin:hover:before {
        left: 80px
    }

    .an-dance {
        background: url("../images/projects/dance/bg.jpg") 0 100% no-repeat;
        -webkit-transition: background-position .3s;
        transition: background-position .3s;
        overflow-y: hidden
    }

    .an-dance .an-brand {
        background: url("../images/projects/dance/logo.png") no-repeat;
        width: 205px;
        height: 90px;
        position: absolute;
        bottom: 0;
        left: 52px;
        -webkit-transition: height .3s;
        transition: height .3s;
        z-index: 3
    }

    .an-dance:before {
        content: "";
        background: url("../images/projects/dance/body.png");
        width: 397px;
        height: 259px;
        position: absolute;
        top: 17px;
        left: 32px;
        -webkit-transition: all .3s linear;
        transition: all .3s linear;
        z-index: 1
    }

    .an-dance:after {
        content: "";
        background: url("../images/projects/dance/arm.png");
        width: 158px;
        height: 122px;
        position: absolute;
        top: 61px;
        left: 126px;
        -webkit-transition: all .3s linear;
        transition: all .3s linear;
        z-index: 2
    }

    .an-legs {
        background: url("../images/projects/dance/legs.png");
        width: 311px;
        height: 215px;
        position: absolute;
        bottom: 29px;
        right: 31px;
        -webkit-transition: all .3s linear;
        transition: all .3s linear;
        z-index: 2
    }

    .an-dance:hover {
        background-position: 100% 100%
    }

    .an-dance:hover .an-brand {
        height: 111px
    }

    .an-dance:hover:before {
        left: -9px;
        top: 23px;
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg)
    }

    .an-dance:hover:after {
        left: 110px;
        top: 101px;
        -webkit-transform: rotate(-37deg);
        transform: rotate(-37deg)
    }

    .an-dance:hover .an-legs {
        right: 73px;
        bottom: 40px;
        -webkit-transform: rotate(7deg);
        transform: rotate(7deg)
    }

    .an-amf {
        overflow: hidden
    }

    .an-amf .bg {
        position: absolute;
        bottom: 0;
        left: 50%;
        margin-left: -59%;
        width: 118%;
        height: 100%;
        background: url("../images/projects/amf/bg.png") 50% 0/100% auto no-repeat;
        transition: all .2s linear
    }

    .an-amf:before {
        content: "";
        background: url("../images/projects/amf/girl.png");
        width: 138px;
        height: 273px;
        position: absolute;
        right: -55px;
        bottom: 28px;
        transition: all .33s;
        z-index: 2
    }

    .an-amf:after {
        content: "";
        background: url("../images/projects/amf/people.png");
        width: 356px;
        height: 321px;
        position: absolute;
        left: -8px;
        bottom: -52px;
        transition: all .3s;
        z-index: 3
    }

    .an-amf .an-brand {
        background: url("../images/projects/amf/logo.png") no-repeat;
        width: 148px;
        height: 114px;
        position: absolute;
        bottom: 19px;
        right: 37px;
        z-index: 4
    }

    .an-amf:hover .bg {
        width: 100%;
        left: 0;
        margin-left: 0
    }

    .an-amf:hover:before {
        bottom: 59px;
        right: -17px
    }

    .an-amf:hover:after {
        bottom: 0;
        left: 5px
    }

    .an-nfl {
        overflow: hidden;
        -webkit-transition: all 2s ease-out;
        transition: all 2s ease-out
    }

    .an-nfl:after, .an-nfl:before {
        content: "";
        width: 100%;
        height: 88%;
        position: absolute;
        bottom: 0;
        left: 0;
        background: url("../images/projects/nfl/bg.jpg") 50% 50% no-repeat;
        -webkit-transition: all 2s ease-out;
        transition: all 2s ease-out;
        z-index: 1
    }

    .an-nfl:after {
        z-index: 2;
        background: rgba(90, 201, 1, .1);
        -webkit-transition: opacity .5s ease;
        transition: opacity .5s ease;
        opacity: 0
    }

    .an-nfl:before {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    .an-nfl:hover:before {
        -webkit-transform: scale(.85) translate(-55px, 41px);
        transform: scale(.85) translate(-55px, 41px);
        width: 120%;
        height: 104%
    }

    .an-nfl:hover:after {
        opacity: 1
    }

    .an-nfl .an-brand {
        width: 100px;
        height: 138px;
        position: absolute;
        bottom: 47px;
        right: 53px
    }

    .an-nfl .an-brand:before {
        content: "";
        background: url("../images/projects/nfl/logo.png");
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 3
    }

    .an-nfl .an-brand:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -8px 0 0 -4px;
        border-radius: 50%;
        width: 10px;
        height: 10px;
        box-shadow: 0 0 34px 57px rgba(255, 255, 255, .7);
        opacity: 0;
        z-index: 1;
        -webkit-transition: opacity .7s .5s ease-out;
        transition: opacity .7s .5s ease-out
    }

    .an-nfl:hover .an-brand:after {
        opacity: 1
    }

    .an-nfl .an-person {
        content: "";
        background: url("../images/projects/nfl/person.png");
        width: 377px;
        height: 478px;
        position: absolute;
        top: -6px;
        left: 19px;
        -webkit-transition: all .7s ease-out;
        transition: all .7s ease-out;
        z-index: 3;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    .an-nfl:hover .an-person {
        left: -30px;
        -webkit-transform: rotate(7deg);
        transform: rotate(7deg)
    }

    .an-tweezerman {
        overflow: hidden;
        background: url("../images/projects/tweezerman/bg.jpg") 95% 100% no-repeat;
        -webkit-transition: all .8s;
        transition: all .8s
    }

    .an-tweezerman:hover {
        background-position: 70% 100%
    }

    .an-scale-holder:before, .an-tweezerman:after {
        content: "";
        position: absolute
    }

    .an-tweezerman:after {
        background: url("../images/projects/tweezerman/logo.gif");
        width: 212px;
        height: 37px;
        bottom: 38px;
        right: 36px
    }

    .an-scale-holder {
        -webkit-transition: all 2s;
        transition: all 2s;
        display: block;
        height: 100%
    }

    .an-scale-holder:before {
        background: url("../images/projects/tweezerman/brush02.png");
        width: 145px;
        height: 311px;
        -webkit-transition: all .7s;
        transition: all .7s;
        bottom: 88px;
        left: -39px;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg)
    }

    .an-brush:before {
        content: "";
        background: url("../images/projects/tweezerman/brush04.png");
        width: 188px;
        height: 281px;
        -webkit-transition: all .7s;
        transition: all .7s;
        position: absolute;
        bottom: 43px;
        left: 81px;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        -webkit-transform: rotate(-30deg);
        transform: rotate(-30deg)
    }

    .an-brush:after {
        content: "";
        background: url("../images/projects/tweezerman/brush03.png");
        width: 151px;
        height: 317px;
        -webkit-transition: all .7s;
        transition: all .7s;
        position: absolute;
        bottom: 40px;
        left: 80px;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        -webkit-transform: rotate(-18deg);
        transform: rotate(-18deg)
    }

    .an-brush-main {
        content: "";
        background: url("../images/projects/tweezerman/brush.png");
        width: 107px;
        height: 357px;
        -webkit-transition: all .7s;
        transition: all .7s;
        position: absolute;
        bottom: 22px;
        left: 41px
    }

    .an-tweezerman:hover .an-brush-main {
        -webkit-transform: translate(25px, -7px) scale(.9);
        transform: translate(25px, -7px) scale(.9)
    }

    .an-tweezerman:hover .an-scale-holder {
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }

    .an-tweezerman:hover .an-scale-holder:before {
        -webkit-transform: translate(28px, 28px) scale(.97) rotate(2deg);
        transform: translate(28px, 28px) scale(.97) rotate(2deg)
    }

    .an-tweezerman:hover .an-brush:after {
        -webkit-transform: translate(25px, -21px) scale(.9) rotate(2deg);
        transform: translate(25px, -21px) scale(.9) rotate(2deg)
    }

    .an-tweezerman:hover .an-brush:before {
        -webkit-transform: translate(25px, -13px) scale(.9) rotate(4deg);
        transform: translate(25px, -13px) scale(.9) rotate(4deg)
    }

    .an-nyod {
        overflow: hidden
    }

    .an-nyod .an-bg {
        background: url("../images/projects/nyod/bg.png") 100% 0 no-repeat;
        -webkit-transition: background-position .5s;
        transition: background-position .5s;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 394px
    }

    .an-nyod:before {
        content: "";
        background: url("../images/projects/nyod/people.png") 100% 100% no-repeat;
        width: 454px;
        height: 426px;
        position: absolute;
        bottom: 0;
        right: 0;
        -webkit-transition: all .6s;
        transition: all .6s;
        z-index: 2
    }

    .an-nyod:after {
        content: "";
        background: url("../images/projects/nyod/logo.png") no-repeat;
        width: 116px;
        height: 134px;
        position: absolute;
        bottom: 20px;
        left: 30px;
        z-index: 1
    }

    .an-nyod:hover .an-bg {
        background-position: 0 100%
    }

    .an-nyod:hover:before {
        right: -33px
    }

    .an-benihana {
        overflow: hidden
    }

    .an-benihana .an-bg {
        height: 394px;
        width: 100%;
        overflow: hidden;
        position: absolute;
        bottom: 0;
        left: 0
    }

    .an-benihana .an-bg:before {
        content: "";
        background: url("../images/projects/benihana/bg.jpg") 50% 100% no-repeat;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: all .6s;
        transition: all .6s
    }

    .an-benihana .an-guy {
        background: url("../images/projects/benihana/guy.png") no-repeat;
        width: 426px;
        height: 407px;
        position: absolute;
        bottom: -1px;
        left: 30px;
        -webkit-transition: all .4s;
        transition: all .4s;
        z-index: 3
    }

    .an-benihana:before {
        content: "";
        background: url("../images/projects/benihana/logo.png") no-repeat;
        width: 159px;
        height: 212px;
        position: absolute;
        top: 23px;
        right: 32px;
        -webkit-transition: all .3s;
        transition: all .3s;
        z-index: 2
    }

    .an-benihana:after {
        content: "";
        background: url("../images/projects/benihana/cloud.png") no-repeat;
        width: 159px;
        height: 71px;
        position: absolute;
        top: 36px;
        left: 0;
        z-index: 1;
        -webkit-transition: all .6s;
        transition: all .6s
    }

    .an-benihana:hover:after {
        left: 54px
    }

    .an-benihana:hover .an-guy {
        left: 57px
    }

    .an-benihana:hover:before {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    .an-benihana:hover .an-bg:before {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
        background-position: 60% 0
    }

    .an-ronin {
        background: url("../images/projects/ronin/bg.jpg") -33px 100% no-repeat;
        -webkit-transition: background-position .9s;
        transition: background-position .9s;
        overflow: hidden
    }

    .an-ronin:before {
        content: "";
        background: url("../images/projects/ronin/people.png") 0 100% no-repeat;
        width: 299px;
        height: 441px;
        position: absolute;
        bottom: 0;
        right: 10px;
        -webkit-transition: all .4s;
        transition: all .4s;
        z-index: 1
    }

    .an-ronin:after {
        content: "";
        background: url("../images/projects/ronin/logo.png") 32px 50% no-repeat;
        width: 445px;
        height: 45px;
        position: absolute;
        bottom: 45px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 2
    }

    .an-ronin:hover {
        background-position: 0 100%
    }

    .an-ronin:hover:before {
        right: 27px
    }

    .an-stark {
        overflow: hidden
    }

    .an-stark .an-bg {
        position: absolute;
        bottom: 50%;
        left: 50%;
        width: 595px;
        height: 485px;
        background: url("../images/projects/stark/bg.png") 100% 100%/100% auto no-repeat;
        -webkit-transform: translate(-56.8%, 57.7%);
        transform: translate(-56.8%, 57.7%);
        z-index: 1;
        -webkit-transition: all .6s linear;
        transition: all .6s linear
    }

    .an-stark:hover .an-bg {
        bottom: 62%;
        left: 57%;
        width: 102%
    }

    .an-stark .an-brand {
        background: url("../images/projects/stark/logo.png") no-repeat;
        width: 204px;
        height: 46px;
        position: absolute;
        bottom: 60px;
        left: 50%;
        -webkit-transform: translateX(-95%);
        transform: translateX(-95%);
        -webkit-transition: -webkit-transform .6s;
        transition: transform .6s;
        z-index: 2
    }

    .an-stark:hover .an-brand {
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .an-royal {
        overflow: hidden
    }

    .an-royal:after {
        content: "";
        background: url("../images/projects/royal/logo.png") no-repeat;
        width: 388px;
        height: 180px;
        position: absolute;
        right: -20px;
        top: 55px;
        -webkit-transition: all .8s;
        transition: all .8s;
        z-index: 3
    }

    .an-royal:before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        background: url("../images/projects/royal/bg.png") 50% 100% no-repeat;
        z-index: 1;
        -webkit-transition: all .7s ease-out;
        transition: all .7s ease-out
    }

    .an-royal:hover:before {
        background-position: 100% 100%;
        -webkit-transform: scale(1.1) translateY(15px);
        transform: scale(1.1) translateY(15px)
    }

    .an-royal:hover:after {
        right: -4px
    }

    .an-biowars {
        overflow: hidden
    }

    .an-biowars .an-bg {
        overflow: hidden;
        position: absolute;
        bottom: 0;
        height: 394px;
        width: 100%;
        left: 0
    }

    .an-biowars .an-bg:after {
        content: "";
        background: url("../images/projects/biowars/bg.jpg") 50% 100% no-repeat;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: -webkit-transform .6s;
        transition: transform .6s
    }

    .an-biowars:after, .an-biowars:before {
        content: "";
        position: absolute;
        -webkit-transition: -webkit-transform .5s ease-out, right .8s ease-out, bottom .3s ease-out;
        transition: -webkit-transform .5s ease-out, right .8s ease-out, bottom .3s ease-out
    }

    .an-biowars:before {
        background: url("../images/projects/biowars/blastor.png") no-repeat;
        width: 394px;
        height: 428px;
        bottom: 0;
        right: -2px;
        z-index: 3
    }

    .an-biowars:after {
        background: url("../images/projects/biowars/humron.png") no-repeat;
        width: 236px;
        height: 322px;
        bottom: -31px;
        right: 212px;
        z-index: 2
    }

    .an-biowars .an-viron {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 4
    }

    .an-biowars .an-viron:after, .an-biowars .an-viron:before {
        content: "";
        position: absolute
    }

    .an-biowars .an-viron:before {
        background: url("../images/projects/biowars/viron-m.png") no-repeat;
        width: 176px;
        height: 158px;
        bottom: 174px;
        left: -23px;
        -webkit-transform: scale(.57);
        transform: scale(.57);
        -webkit-transition: -webkit-transform .6s ease-out .1s, left .4s ease-out .1s, bottom .4s ease-out .1s;
        transition: transform .6s ease-out .1s, left .4s ease-out .1s, bottom .4s ease-out .1s
    }

    .an-biowars .an-viron:after {
        background: url("../images/projects/biowars/viron-l.png") no-repeat;
        width: 148px;
        height: 134px;
        bottom: 286px;
        left: 6px;
        -webkit-transform: scale(.77);
        transform: scale(.77);
        -webkit-transition: -webkit-transform .6s ease-out, left .4s ease-out, bottom .4s ease-out;
        transition: transform .6s ease-out, left .4s ease-out, bottom .4s ease-out
    }

    .an-biowars .an-brand {
        background: url("../images/projects/biowars/logo.png") no-repeat;
        width: 284px;
        height: 89px;
        position: absolute;
        bottom: 30px;
        right: 21px;
        z-index: 4
    }

    .an-biowars:hover .an-bg:after {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }

    .an-biowars:hover:hover:after {
        right: 128px;
        bottom: -39px;
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }

    .an-biowars:hover:before {
        right: -66px;
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    .an-biowars:hover .an-viron:before {
        -webkit-transform: scale(1) rotate(-36deg);
        transform: scale(1) rotate(-10deg);
        left: 33px;
        bottom: 159px
    }

    .an-biowars:hover .an-viron:after {
        -webkit-transform: scale(1) rotate(-36deg);
        transform: scale(1) rotate(-36deg);
        left: 73px;
        bottom: 289px
    }

    .an-cayman {
        background: url("../images/projects/cayman/bg.jpg") 0 100% no-repeat;
        overflow: hidden
    }

    .an-cayman:before {
        content: "";
        background: url("../images/projects/cayman/bg-up.png") 50% 50%/100% auto no-repeat;
        width: 540px;
        height: 438px;
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        transition: width .3s linear;
        z-index: 1
    }

    .an-cayman:after {
        content: "";
        background: url("../images/projects/cayman/logo.png") 50% 0 no-repeat;
        width: 100%;
        height: 61px;
        position: absolute;
        bottom: 52px;
        left: 0;
        z-index: 2
    }

    .an-cayman:hover:before {
        width: 101%
    }

    .an-fitness {
        overflow: hidden
    }

    .an-fitness .an-bg {
        width: 589px;
        height: 386px;
        position: absolute;
        bottom: 50%;
        left: 51%;
        -webkit-transform: translate(-51%, 56%);
        transform: translate(-51%, 56%);
        background: url("../images/projects/fitness/bg.jpg") 50% 50%/100% auto no-repeat;
        transition: width 1s linear;
        z-index: 1
    }

    .an-fitness:hover .an-bg {
        width: 100%
    }

    .an-fitness .an-brand {
        content: "";
        background: url("../images/projects/fitness/logo.png") 49% 78% no-repeat, linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(7, 7, 7, .2) 36%, rgba(0, 0, 0, 1) 100%);
        width: 100%;
        height: 296px;
        position: absolute;
        left: 0;
        bottom: 0;
        z-index: 3
    }

    .an-fitness:after {
        content: "";
        background: url("../images/projects/fitness/man.png") 0 0/100% auto no-repeat;
        width: 433px;
        height: 422px;
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        transition: all .7s linear;
        z-index: 2
    }

    .an-fitness:hover:after {
        width: 94%;
        bottom: 17px
    }

    .an-mballet {
        background: url("../images/projects/mballet/bg.jpg") 0 56px no-repeat;
        transition: background-position .3s linear;
        overflow: hidden
    }

    .an-mballet .female:after, .an-mballet .female:before, .an-mballet .man:after, .an-mballet .man:before, .an-mballet:after {
        content: "";
        position: absolute;
        transition: all .3s linear;
        z-index: 3
    }

    .an-mballet:after {
        background: url("../images/projects/mballet/logo.png") no-repeat;
        width: 100%;
        height: 88px;
        bottom: 0;
        left: 0;
        z-index: 4
    }

    .an-mballet:hover {
        background-position: 100% 56px
    }

    .an-mballet .female {
        width: 313px;
        height: 231px;
        right: 0;
        bottom: 82px;
        position: absolute;
        z-index: 6
    }

    .an-mballet .female:after {
        background: url("../images/projects/mballet/female-body.png") no-repeat;
        width: 313px;
        height: 237px;
        bottom: 0;
        right: -38px;
        z-index: 4
    }

    .an-mballet:hover .female:after {
        right: 0
    }

    .an-mballet .female:before {
        background: url("../images/projects/mballet/female-arm.png") no-repeat;
        width: 99px;
        height: 185px;
        top: -87px;
        right: 76px;
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%
    }

    .an-mballet:hover .female:before {
        -webkit-transform: rotate(-20deg) translate(-33px, -6px);
        transform: rotate(-20deg) translate(-33px, -6px)
    }

    .an-mballet .man {
        background: url("../images/projects/mballet/man-legs.png") no-repeat;
        width: 158px;
        height: 177px;
        position: absolute;
        top: 298px;
        left: 31px;
        transition: all .3s linear;
        z-index: 5
    }

    .an-mballet:hover .man {
        -webkit-transform: translate(-37px, -19px);
        transform: translate(-37px, -19px)
    }

    .an-mballet .man:after {
        background: url("../images/projects/mballet/man-arm.png") no-repeat;
        width: 73px;
        height: 215px;
        top: -284px;
        left: 5px;
        z-index: 2
    }

    .an-mballet:hover .man:after {
        -webkit-transform: rotate(14deg) translate(24px, -10px);
        transform: rotate(14deg) translate(24px, -10px)
    }

    .an-mballet .man:before {
        background: url("../images/projects/mballet/man-body.png") no-repeat;
        width: 194px;
        height: 216px;
        top: -202px;
        left: 30px;
        z-index: 3
    }

    .an-mballet:hover .man:before {
        -webkit-transform: rotate(6deg) translate(10px, 4px);
        transform: rotate(6deg) translate(10px, 4px)
    }

    .an-napoli {
        background: url("../images/projects/napoli/bg.jpg") 0 100% no-repeat;
        overflow: hidden
    }

    .an-napoli:before {
        content: "";
        background: url("../images/projects/napoli/people.png") 50% 100%/100% auto no-repeat;
        width: 569px;
        height: 436px;
        position: absolute;
        top: 57%;
        left: 50%;
        transition: all .2s linear;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 2
    }

    .an-napoli:hover:before {
        width: 101%;
        top: 54%
    }

    .an-seamless {
        overflow: hidden
    }

    .an-seamless .bg-l:after, .an-seamless .bg-l:before, .an-seamless .bg-r:after, .an-seamless .bg-r:before, .an-seamless .bg:after, .an-seamless .bg:before, .an-seamless:after, .an-seamless:before {
        content: "";
        position: absolute;
        transition: all .2s;
        z-index: 2
    }

    .an-seamless:after {
        background: url("../images/projects/seamless/bg.jpg") 0 100% no-repeat;
        width: 100%;
        height: 394px;
        left: 0;
        bottom: 0;
        z-index: 1
    }

    .an-seamless:before {
        background: url("../images/projects/seamless/logo.png") 0 0/100% auto no-repeat;
        width: 308px;
        height: 140px;
        left: 51%;
        top: 56%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 3
    }

    .an-seamless:hover:before {
        width: 350px
    }

    .an-seamless .bg:before {
        background: url("../images/projects/seamless/bg-t.png");
        width: 158px;
        height: 138px;
        top: 10px;
        left: 183px;
        z-index: 3
    }

    .an-seamless:hover .bg:before {
        -webkit-transform: rotate(14deg);
        transform: rotate(14deg)
    }

    .an-seamless .bg:after {
        background: url("../images/projects/seamless/bg-b.png") no-repeat;
        width: 234px;
        height: 110px;
        bottom: -1px;
        right: 25px
    }

    .an-seamless:hover .bg:after {
        bottom: -38px
    }

    .an-seamless .bg-l:before {
        background: url("../images/projects/seamless/bg-l.png");
        width: 224px;
        height: 440px;
        top: 9px;
        left: 0
    }

    .an-seamless:hover .bg-l:before {
        left: -36px
    }

    .an-seamless .bg-l:after {
        background: url("../images/projects/seamless/bg-bl.png") no-repeat;
        width: 190px;
        height: 121px;
        bottom: -1px;
        left: 22px
    }

    .an-seamless .bg-r:before {
        background: url("../images/projects/seamless/bg-tr.png") 0 100%;
        width: 190px;
        height: 200px;
        top: 54px;
        right: -1px
    }

    .an-seamless:hover .bg-r:before {
        right: -37px;
        height: 186px
    }

    .an-seamless .bg-r:after {
        background: url("../images/projects/seamless/bg-r.png") no-repeat;
        width: 70px;
        height: 84px;
        bottom: 74px;
        right: 0
    }

    .an-seamless:hover .bg-r:after {
        bottom: 104px;
        right: -4px;
        transform: rotate(23deg)
    }

    .an-wholesome {
        overflow: hidden
    }

    .an-wholesome .bg1:after, .an-wholesome .bg1:before, .an-wholesome .bg2:after, .an-wholesome .bg2:before, .an-wholesome:after, .an-wholesome:before {
        content: "";
        position: absolute;
        transition: all .3s ease-out
    }

    .an-wholesome:after {
        background: url("../images/projects/wholesome/bg.png") 0 100% no-repeat;
        width: 100%;
        height: 432px;
        left: 0;
        bottom: 0;
        z-index: 1
    }

    .an-wholesome:before {
        background: url("../images/projects/wholesome/logo.png") no-repeat;
        width: 213px;
        height: 76px;
        left: 37px;
        top: 87px;
        z-index: 4
    }

    .an-wholesome:hover:before {
        transform: scale(.9)
    }

    .an-wholesome .bg1:before {
        background: url("../images/projects/wholesome/sweets-green.png");
        width: 165px;
        height: 223px;
        bottom: -63px;
        right: 45px;
        z-index: 2
    }

    .an-wholesome:hover .bg1:before {
        transform: rotate(-40deg);
        bottom: -125px
    }

    .an-wholesome .bg1:after {
        background: url("../images/projects/wholesome/sweets-yellow.png") no-repeat;
        width: 254px;
        height: 271px;
        bottom: -91px;
        right: -39px;
        z-index: 3
    }

    .an-wholesome:hover .bg1:after {
        transform: rotate(-44deg);
        bottom: -140px;
        right: -100px
    }

    .an-wholesome .bg2:before {
        background: url("../images/projects/wholesome/sweets-pink.png");
        width: 223px;
        height: 242px;
        bottom: -28px;
        left: 178px;
        z-index: 2
    }

    .an-wholesome:hover .bg2:before {
        transform: rotate(20deg);
        left: 160px
    }

    .an-wholesome .bg2:after {
        background: url("../images/projects/wholesome/sweets-blue.png") no-repeat;
        width: 233px;
        height: 270px;
        bottom: 5px;
        right: -34px;
        z-index: 3
    }

    .an-wholesome:hover .bg2:after {
        transform: rotate(14deg);
        bottom: 45px
    }

    .an-serviceking {
        background: url("../images/projects/serviceking/bg.png") 0 100% no-repeat;
        transition: background-position .3s linear;
        overflow: hidden
    }

    .an-serviceking:before {
        content: "";
        background: url("../images/projects/serviceking/man.png") no-repeat;
        width: 270px;
        height: 368px;
        position: absolute;
        bottom: -20px;
        right: 65px;
        transition: all .3s linear;
        -webkit-transform: rotate(11deg) translateY(-9px);
        transform: rotate(11deg) translateY(-9px);
        z-index: 1
    }

    .an-serviceking:after {
        content: "";
        background: url("../images/projects/serviceking/logo.png") no-repeat;
        width: 210px;
        height: 93px;
        position: absolute;
        bottom: 19px;
        right: 29px;
        z-index: 2
    }

    .an-serviceking:hover {
        background-position: 100% 100%
    }

    .an-serviceking:hover:before {
        right: 120px;
        -webkit-transform: none;
        transform: none
    }

    .an-tishman {
        background: url("../images/projects/tishman/bg-anim.gif") 0 100% no-repeat;
        overflow: hidden
    }

    .an-tishman .an-bg {
        background: url("../images/projects/tishman/bg.jpg") 0 100% no-repeat;
        transition: opacity .1s linear;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 392px;
        opacity: 1
    }

    .an-tishman:hover .an-bg {
        opacity: 0
    }

    .an-tishman:before {
        content: "";
        background: url("../images/projects/tishman/bg-building.png") 50% 100%/100% auto no-repeat;
        width: 546px;
        height: 422px;
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        transition: width .3s linear;
        z-index: 1
    }

    .an-tishman:after {
        content: "";
        background: url("../images/projects/tishman/logo.png") no-repeat;
        width: 274px;
        height: 53px;
        position: absolute;
        bottom: 30px;
        right: 44px;
        z-index: 2
    }

    .an-tishman:hover:before {
        width: 101%
    }

    .an-toysrus {
        background: url("../images/projects/toysrus/bg.jpg") 100% 100% no-repeat;
        transition: background-position .2s linear;
        overflow: hidden
    }

    .an-toysrus .animal:after, .an-toysrus .animal:before, .an-toysrus:after, .an-toysrus:before {
        content: "";
        position: absolute;
        transition: all .2s linear
    }

    .an-toysrus:before {
        background: url("../images/projects/toysrus/arm.png") no-repeat;
        width: 210px;
        height: 278px;
        bottom: -19px;
        right: 271px;
        z-index: 2;
        -webkit-transform: rotate(-7deg);
        transform: rotate(-7deg)
    }

    .an-toysrus:hover:before {
        bottom: -2px;
        right: 230px;
        -webkit-transform: none;
        transform: none
    }

    .an-toysrus:after {
        background: url("../images/projects/toysrus/logo.png") no-repeat;
        width: 278px;
        height: 137px;
        bottom: 17px;
        right: 20px;
        z-index: 5
    }

    .an-toysrus .animal {
        background: url("../images/projects/toysrus/head.png") no-repeat;
        position: absolute;
        width: 390px;
        height: 393px;
        top: 11px;
        left: -28px;
        z-index: 3;
        transition: all .2s linear;
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    .an-toysrus:hover .animal {
        left: 0;
        -webkit-transform: none;
        transform: none
    }

    .an-toysrus .animal:before {
        background: url("../images/projects/toysrus/eye-l.png") no-repeat;
        width: 29px;
        height: 22px;
        top: 122px;
        left: 198px;
        -webkit-transform: skewX(12deg) scale(.96);
        transform: skewX(12deg) scale(.96);
        z-index: 4
    }

    .an-toysrus:hover .animal:before {
        -webkit-transform: none;
        transform: none;
        top: 135px;
        left: 175px
    }

    .an-toysrus .animal:after {
        background: url("../images/projects/toysrus/eye-r.png") no-repeat;
        width: 23px;
        height: 24px;
        top: 120px;
        right: 114px;
        z-index: 4;
        -webkit-transform: skewY(27deg) scale(.85) rotate(-8deg);
        transform: skewY(27deg) scale(.85) rotate(-8deg)
    }

    .an-toysrus:hover .animal:after {
        -webkit-transform: none;
        transform: none;
        top: 129px;
        right: 138px
    }

    .an-toysrus:hover {
        background-position: 0 100%
    }

    .feat-expanded-section .tab-lnk {
        width: 515px;
        height: 448px;
        margin: 0 5px;
        position: relative;
        display: inline-block;
        vertical-align: bottom;
        cursor: pointer;
        -webkit-transition: all .2s;
        transition: all .2s;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    .feat-expanded-section .an-item {
        display: block;
        height: 100%;
        position: relative
    }

    .solutions-section .consulting {
        padding-left: 0
    }

    .solutions-section .mobile-apps {
        padding-right: 0
    }

    .show-in-desktop {
        display: inline
    }

    .ecommerce-pg .top-section {
        background: url("../images/ecommerce/bg-ecommerce-top.jpg") 50% 0 no-repeat #fff
    }

    .ourwork-pg .top-section {
        background: url("../images/home/bg-home-top.jpg") 30% -90px no-repeat #fff
    }

    .services-pg .top-section {
        background: url("../images/bg/bg-services-top.jpg") 50% 0 no-repeat #ededed
    }

    .sitecore-pg .top-section {
        background: url("../images/bg/bg-sitecore-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .magento-pg .top-section {
        background: url("../images/bg/bg-magento-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .drupal-pg .top-section {
        background: url("../images/bg/bg-drupal-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .wp-pg .top-section {
        background: url("../images/bg/bg-wordpress-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .seo-pg .top-section {
        background: url("../images/bg/bg-seo-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .joomla-pg .top-section {
        background: url("../images/bg/bg-joomla-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .wm-pg .top-section {
        background: url("../images/bg/bg-webmodulite-top.jpg") 50% 0 no-repeat #f9f9f9
    }

    .consult-pg .top-section {
        background: url("../images/bg/bg-consult-top.jpg") 50% 0 no-repeat #fbfbfb
    }

    .cr-design-pg .top-section {
        background: url("../images/bg/bg-services-design-top.jpg") 50% 0 no-repeat #fbfbfb
    }

    .develop-pg .top-section {
        background: url("../images/bg/bg-develop-top.jpg") 50% 0 no-repeat #fbfbfb
    }

    .marketing-pg .top-section {
        background: url("../images/bg/bg-marketing-top.jpg") 50% 0 no-repeat #fafafa
    }

    .home-slider-wrapper {
        background: url("../images/home/bg-home-top.jpg") 50% 28px no-repeat
    }

    .case-pg .biowars-section1 .inner-bg {
        background: url("../images/case-studies/biowars/bg-section01-top.jpg") 50% 0 no-repeat
    }

    .case-pg .biowars-section2 {
        background: url("../images/case-studies/biowars/bg-section02-top.png") 50% 0 no-repeat #fefefe
    }

    .case-pg .johnjay-section1 .inner-bg {
        background: url("../images/case-studies/johnjay/bg-section01-top.jpg.png") 50% 0 no-repeat
    }

    .case-pg .johnjay-section2 {
        background: url("../images/case-studies/johnjay/bg-section02-top.jpg") 50% 0/cover no-repeat #fefefe
    }

    .solutions-section h3:before {
        width: 287px;
        margin-left: -143px
    }

    .solutions-section .dev h3:before {
        width: 327px;
        margin-left: -164px
    }

    .solutions-section .drop {
        width: 287px;
        font-size: 16px;
        margin-left: -143px;
        -webkit-transform-origin: 50% 0;
        transform-origin: 50% 0;
        -webkit-transform: rotateX(-85deg);
        transform: rotateX(-85deg);
        -webkit-transition: -webkit-transform .5s, visibility .2s;
        transition: transform .5s, visibility .5s
    }

    .solutions-section .dev .drop {
        width: 327px;
        margin-left: -164px
    }

    .desktop-mode .solutions-section .drop-holder:hover .drop, .solutions-section .drop-holder.item-hover .drop {
        visibility: visible;
        -webkit-transform: rotateX(0deg);
        transform: rotateX(0deg)
    }

    .solutions-section .drop:before {
        background-color: transparent;
        -webkit-transition: all .5s;
        transition: all .5s
    }

    .desktop-mode .solutions-section .drop-holder:hover .drop:before, .solutions-section .drop-holder.item-hover .drop:before {
        background-color: #fff;
        box-shadow: 0 0 1px 1px rgba(0, 0, 0, .2)
    }

    .solutions-section .drop li {
        padding-left: 10px;
        visibility: hidden;
        -webkit-transition: background .15s, box-shadow .15s, visibility .5s;
        transition: background .15s, box-shadow .15s, visibility .5s
    }

    .desktop-mode .solutions-section .drop-holder:hover li, .solutions-section .drop-holder.item-hover li {
        visibility: visible
    }

    .solutions-section .drop .ico + span {
        padding: 0 10px
    }

    .solutions-section .drop .ico {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    .lp-steps {
        background: url("../images/logo-design/bg-steps.png") 50% 100% no-repeat;
        margin: 0 -425px -35px;
        padding: 0 410px 8px
    }

    .lp-steps .ico-wrap {
        width: 69px;
        height: 69px
    }

    .lp-steps ul.active-0 .cur-step {
        left: 29px
    }

    .lp-steps ul.active-1 .cur-step {
        left: 155px
    }

    .lp-steps ul.active-2 .cur-step {
        left: 281px
    }

    .lp-steps ul.active-3 .cur-step {
        left: 407px
    }

    .lp-steps ul.active-4 .cur-step {
        left: 534px
    }

    .lp-steps ul.active-5 .cur-step {
        left: 660px
    }

    .lp-steps ul.active-6 .cur-step {
        left: 787px
    }

    .lp-steps ul.active-7 .cur-step {
        left: 913px
    }

    .lp-steps ul.active-0 #curStep {
        fill: #4e4e4e
    }

    .lp-steps ul.active-1 #curStep {
        fill: #87c556
    }

    .lp-steps ul.active-2 #curStep {
        fill: #eb8a0d
    }

    .lp-steps ul.active-3 #curStep {
        fill: #ab840c
    }

    .lp-steps ul.active-4 #curStep {
        fill: #56d3c6
    }

    .lp-steps ul.active-5 #curStep {
        fill: #882fa0
    }

    .lp-steps ul.active-6 #curStep {
        fill: #c44441
    }

    .lp-steps ul.active-7 #curStep {
        fill: #0078ae
    }

    .easel-box-wrap {
        margin: -87px 0 0 46px;
        background-image: url("../images/best-website/easel-frame.jpg");
        background-repeat: no-repeat
    }

    .easel-box {
        background-image: url("../images/best-website/easel-sprite.jpg");
        background-repeat: no-repeat
    }

    .easel-box4, .easel-box5, .easel-box6 {
        background-image: url("../images/best-website/easel-sprite-part2.jpg");
        background-repeat: no-repeat
    }

    .easel-text {
        float: right;
        width: 440px;
        margin: 0 56px 0 0;
        font-size: 16px;
        line-height: 1.6;
        padding: 0
    }

    .easel-slider h3 {
        font-size: 35px;
        margin: 0 0 16px
    }

    .de-blog-img .overflow {
        margin: -23px -23px 0
    }

    .de-text {
        -webkit-transition: -webkit-transform .4s;
        transition: transform .4s
    }

    .read-more-anim {
        display: block;
        width: 100%;
        height: 0;
        color: #fff;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 10;
        overflow: hidden;
        text-align: right;
        transition: height .4s
    }

    .mob-an-item .read-more-anim {
        left: auto;
        right: -65%;
        z-index: 2
    }

    .read-more-anim:hover {
        color: #fff
    }

    .mob-an-item:hover .read-more-anim {
        height: 65px
    }

    .read-more-anim:before {
        position: absolute;
        top: 100%;
        right: -4%;
        width: 222%;
        height: 65px;
        content: "";
        background: #009ddc;
        -webkit-transition: -webkit-transform .4s;
        transition: transform .4s;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        outline: transparent solid 1px
    }

    .mob-an-item .read-more-anim:before {
        width: 204%;
        background: #0078ae
    }

    .mob-an-item:hover .read-more-anim:before {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    .read-more-anim span {
        position: absolute;
        z-index: 5;
        text-transform: uppercase;
        font: 14px/1 roboto-bold-webfont, sans-serif;
        display: inline-block
    }

    .mob-an-item .read-more-anim span {
        right: auto;
        left: 24%;
        bottom: 13px
    }

    .read-more-anim span:after {
        content: "Â»";
        padding-left: 5px;
        font-size: 24px;
        line-height: 1;
        position: relative;
        top: 2px
    }

    .de-blog-item:hover .read-more-anim {
        height: 68px
    }

    .de-blog-item:hover .read-more-anim:before {
        -webkit-transform: rotate(-6deg);
        transform: rotate(-6deg)
    }

    .f-post .download-lnk {
        white-space: nowrap
    }

    .bg-ny {
        background-image: url("../images/home/bg-ny.jpg")
    }

    .bg-chicago {
        background-image: url("../images/home/bg-chicago.jpg")
    }

    .bg-seattle {
        background-image: url("../images/home/bg-seattle.jpg")
    }

    .location-area .bg {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-position: 50% 100%;
        background-size: cover;
        background-repeat: no-repeat
    }

    .client-logo-item:hover, .same-blocks .unit:hover .client-logo-item {
        background-image: none
    }

    .client-logo-item:hover:before, .same-blocks .unit:hover .client-logo-item:before {
        opacity: 1
    }

    .wide-mode {
        display: inline
    }

    .feat-gallery-images .mid-align .slide-item-inner {
        display: table;
        width: 100%;
        table-layout: fixed
    }

    .feat-gallery-images .mid-align .slide-img-wr {
        height: 855px;
        display: table-cell;
        vertical-align: middle
    }

    .link-arrow.btn {
        transition: all .3s ease
    }

    .link-arrow.btn:after, .link-arrow.btn:before {
        transition: all .3s linear .3s
    }

    .link-arrow.btn > span {
        transition: all .3s ease .3s;
        display: inline-block;
        position: relative;
        left: 0;
        z-index: 2;
        padding: 0 20px 10px 0;
        margin: 0 -20px -10px 0
    }

    .link-arrow.btn > span:before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 3px;
        background: #90c404;
        transition: all .3s linear;
        z-index: 3
    }

    .link-arrow.btn:hover > span:before {
        width: 100%;
        border-radius: 0 0 4px 4px
    }

    .link-arrow.btn:hover {
        color: #fff
    }

    .link-arrow.btn:hover span {
        left: 15px
    }

    .link-arrow.btn:hover:after {
        border-color: #fff;
        z-index: 2;
        left: 23px
    }

    .link-arrow.btn:hover:before {
        background: #90c404;
        z-index: 1;
        height: 185%;
        width: calc(100% + 40px);
        border-radius: 4px
    }

    .pr-slider.fade .item, .pr-slider.fade .item.current, .txt-slider.fade .item, .txt-slider.fade .item.current {
        opacity: 1 !important
    }

    .pr-slider .t-cell.visual .wide-mode {
        position: relative;
        top: -4px;
        left: -76px
    }

    .seo-pr--slider .t-cell.visual .wide-mode {
        top: -54px
    }

    .an-wide {
        display: block;
        width: 100%;
        position: relative;
        margin: 35px 0 80px
    }

    .an-wide.simple {
        margin: 20px 0 0
    }

    .an-wide .overflow {
        overflow: hidden;
        display: block
    }

    .feat-expanded-section .an-wide img {
        max-width: 1819px;
        transition: all .4s ease-out
    }

    .img-bg {
        display: block
    }

    .img-bg img {
        margin: 0 0 0 -7.6%;
        z-index: 1;
        width: 102%;
    }

    .an-wide.simple .img-bg img {
        margin: 0
    }

    .img-logo {
        position: absolute;
        top: 44%;
        transform: translateY(-50%);
        z-index: 2;
        text-align: left;
    }
    .img-logo h3{
        color: #ffffff;
        font-size: 3.75em;
        font-weight: bold;
        margin-bottom: 30px;
        line-height: 1.375;
    }
    .img-logo h3 span{
        font-weight: normal;
    }
    .img-logo p{
        color: #ffffff;
        font-size: 20px;
        line-height: 1.875;
    }
    .simple .img-logo-wrap {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 2;
        transition: height .2s ease-out
    }

    .simple .img-logo {
        transition: all .2s ease-out;
        left: 50%;
        top: 50%;
        bottom: auto;
        transform: translate(-50%, -50%)
    }

    .an-wide.simple:hover .img-logo-wrap {
        height: 45%
    }

    .an-wide.simple .link-arrow:after {
        border-color: #fff
    }

    .an-wide.simple .link-arrow {
        color: #fff
    }

    .img-descktop {
        position: absolute;
        top: 23%;
        z-index: 2
    }

    .img-mobile {
        position: absolute;
        z-index: 3
    }

    .an-wide-left .img-logo {
        left: 15.4%
    }
    .an-wide-left .img-logo2 {
        left: 55.4%;
        text-align: right;
    }
    .an-wide-left .img-descktop {
        left: 45%;
        top: 18%;
    }
    .an-wide-left .img-descktop2 {
        left: 11%;
        top: 18%;
    }
    .an-wide-left .img-mobile {
        left: 60%;
        top: 25%
    }
    .an-wide-left .img-mobile2 {
        left: 26%;
        top: 25%
    }

    .an-wide-right .img-logo {
        right: 9.4%
    }

    .an-wide-right .img-descktop {
        left: 10.7%
    }

    .an-wide-right .img-mobile {
        left: 7.6%;
        top: 38.4%
    }

    .an-wide .txt-info {
        z-index: 1;
        position: absolute;
        top: 45%;
        color: #fff;
        font: 17px/1.6 roboto-regular-webfont, sans-serif;
        transition: opacity .2s ease-out;
        width: 100%;
        left: 50%;
        transform: translateX(-50%);
        padding: 0 3vw;
        max-width: 50%;
        box-sizing: border-box;
        margin: 0 auto;
        opacity: 0
    }

    .an-wide .btn {
        z-index: 1;
        border-radius: 50%;
        width: 186px;
        height: 186px;
        padding: 65px 40px 0;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -65%);
        color: #fff;
        font: 20px/1.3 'Roboto Bold Condensed', sans-serif;
        transition: opacity .2s ease-out;
        opacity: 0
    }

    .an-wide .btn > span {
        display: inline-block;
        position: relative;
        z-index: 2
    }

    .an-wide .btn:after {
        content: "";
        border-radius: 50%;
        background: rgba(0, 0, 0, .5);
        width: 0;
        height: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transition: all .3s ease-out
    }

    .an-wide:hover .btn:after {
        width: 100%;
        height: 100%
    }

    .an-wide:hover .btn, .an-wide:hover .txt-info {
        opacity: 1
    }

    .pr-slider.fade .item .t-cell.visual:not(.no-anim) {
        transform: none;
        transition: none
    }

    .anim-img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        opacity: 0
    }

    .current .anim-img {
        opacity: 1
    }

    .screen-btm {
        background: url("../images/pr-screen-btm.png") no-repeat;
        width: 275px;
        height: 194px;
        top: -21px;
        z-index: 3
    }

    .current .screen-btm {
        transition: none
    }

    .pr-anim101 {
        background: url("../images/pr-anim101.png") no-repeat;
        width: 92px;
        height: 213px;
        left: -71px;
        top: -81px;
        z-index: 3;
        transition: all .3s linear .4s
    }

    .current .pr-anim101 {
        transform: translateX(52px)
    }

    .pr-anim102 {
        background: url("../images/pr-anim102.png") no-repeat;
        width: 96px;
        height: 224px;
        left: 194px;
        top: 30px;
        z-index: 4;
        transition: all .3s linear .7s
    }

    .pr-anim103 {
        background: url("../images/pr-anim103.png") no-repeat;
        width: 102px;
        height: 112px;
        left: -98px;
        top: -23px;
        transition: all .3s linear .2s
    }

    .pr-anim104 {
        background: url("../images/pr-anim104.png") no-repeat;
        width: 187px;
        height: 345px;
        left: 46px;
        top: -176px;
        transition: all .3s linear
    }

    .slide02 .pr-anim104 {
        transition: transform .3s linear
    }

    .current.slide02 .pr-anim104 {
        transform: translateY(-40px)
    }

    .pr-anim201 {
        background: url("../images/pr-anim201.png") no-repeat;
        width: 146px;
        height: 211px;
        left: -56px;
        top: -23px;
        z-index: 5;
        transition: all .3s linear .2s
    }

    .current .pr-anim201 {
        transform: translateX(-17px)
    }

    .pr-anim202 {
        background: url("../images/pr-anim202.png") no-repeat;
        width: 201px;
        height: 261px;
        left: -8px;
        top: -106px;
        z-index: 4;
        opacity: 0;
        transition: all .3s linear
    }

    .current .pr-anim202 {
        transform: translateX(-21px)
    }

    .pr-anim301 {
        background: url("../images/pr-anim301.png") no-repeat;
        width: 81px;
        height: 106px;
        left: -72px;
        top: -200px;
        transition: all .3s linear .2s
    }

    .pr-anim302 {
        background: url("../images/pr-anim302.png") no-repeat;
        width: 125px;
        height: 79px;
        left: 41px;
        top: 215px;
        transition: all .3s linear .8s
    }

    .current .pr-anim302 {
        transform: translate(35px, -25px)
    }

    .pr-anim303 {
        background: url("../images/pr-anim303.png") no-repeat;
        width: 177px;
        height: 335px;
        left: 46px;
        top: -214px;
        transition: all .3s linear
    }

    .pr-anim304 {
        background: url("../images/pr-anim304.png") no-repeat;
        width: 211px;
        height: 133px;
        left: -109px;
        top: 131px;
        transition: all .3s linear .6s
    }

    .current .pr-anim304 {
        transform: translate(21px, -17px)
    }

    .pr-anim305 {
        background: url("../images/pr-anim305.png") no-repeat;
        width: 54px;
        height: 200px;
        left: 193px;
        top: -26px;
        z-index: 4;
        transition: all .3s linear .2s
    }

    .current .pr-anim305 {
        transform: translateX(16px)
    }

    .pr-anim306 {
        background: url("../images/pr-anim306.png") no-repeat;
        width: 134px;
        height: 225px;
        left: -140px;
        top: -79px;
        z-index: 5;
        transition: all .3s linear .4s
    }

    .pr-anim401 {
        background: url("../images/pr-anim401.png") no-repeat;
        width: 219px;
        height: 232px;
        left: -163px;
        top: -45px;
        transition: all .3s linear .5s
    }

    .current .pr-anim401 {
        transform: translate(11px, 6px)
    }

    .pr-anim402 {
        background: url("../images/pr-anim402.png") no-repeat;
        width: 187px;
        height: 293px;
        left: 30px;
        top: -170px;
        transition: all .3s linear
    }

    .current .pr-anim402 {
        transform: translate(10px, -10px)
    }

    .pr-anim403 {
        background: url("../images/pr-anim403.png") no-repeat;
        width: 146px;
        height: 192px;
        left: 14px;
        top: -31px;
        z-index: 4;
        transition: all .3s linear .1s
    }

    .current .pr-anim403 {
        transform: translateX(10px)
    }

    .pr-anim404 {
        background: url("../images/pr-anim404.png") no-repeat;
        width: 101px;
        height: 100px;
        left: 140px;
        top: 188px;
        transition: all .3s linear .3s
    }

    .current .pr-anim404 {
        transform: translateY(-16px)
    }

    .pr-anim501 {
        background: url("../images/pr-anim501.png") no-repeat;
        width: 117px;
        height: 275px;
        left: 3px;
        top: -36px;
        z-index: 5;
        transition: all .3s linear .2s
    }

    .current .pr-anim501 {
        transform: translateX(16px)
    }

    .pr-anim502 {
        background: url("../images/pr-anim502.png") no-repeat;
        width: 96px;
        height: 224px;
        left: -75px;
        top: -90px;
        z-index: 4;
        transition: all .3s linear .5s
    }

    .current .pr-anim502 {
        transform: translateX(10px)
    }

    .pr-anim503 {
        background: url("../images/pr-anim503.png") no-repeat;
        width: 184px;
        height: 326px;
        left: 40px;
        top: -162px;
        transition: all .3s linear
    }

    .current .pr-anim503 {
        transform: translateY(-30px)
    }

    .slide06 .pr-anim503 {
        top: -192px;
        transition: all .3s linear
    }

    .current.slide06 .pr-anim503 {
        transform: none;
        transition: none
    }

    .pr-anim601 {
        background: url("../images/pr-anim601.png") no-repeat;
        width: 176px;
        height: 235px;
        left: -131px;
        top: -36px;
        z-index: 4;
        transition: all .3s linear
    }

    .current .pr-anim601 {
        transform: translateY(-38px)
    }

    .pr-anim602 {
        background: url("../images/pr-anim602.png") no-repeat;
        width: 195px;
        height: 132px;
        left: -72px;
        top: 131px;
        transition: all .3s linear .1s
    }

    .current .pr-anim602 {
        transform: translateY(5px)
    }

    .pr-anim603 {
        background: url("../images/pr-anim603.png") no-repeat;
        width: 97px;
        height: 259px;
        left: 203px;
        top: -101px;
        z-index: 4;
        transition: all .3s linear .3s
    }

    .current .pr-anim603 {
        transform: translateY(-67px)
    }

    .cs-paralax-left, .cs-paralax-right {
        position: relative;
        z-index: 3
    }

    .case-slider .wide-mode {
        display: block;
        background: rgba(255, 255, 255, .1)
    }

    .cs-bg {
        width: 478px;
        height: 360px;
        overflow: hidden;
        left: 163px;
        top: 32px;
        z-index: 1
    }

    .current .cs-bg {
        animation: case-slide 16s linear .3s infinite
    }

    .cs-left {
        z-index: 3;
        transform: translateX(100px);
        transition: transform .5s ease-out .2s
    }

    .cs-right {
        z-index: 3;
        transform: translateX(100px);
        transition: transform .4s ease-out .1s
    }

    .current .cs-left, .current .cs-right {
        transform: translateX(0)
    }

    .cs-anim-medcpu01 {
        background: url("../images/cs-slider/anim/cs-medcpu-anim01.png") no-repeat;
        width: 141px;
        height: 228px;
        left: 548px;
        top: 238px
    }

    .cs-anim-medcpu02 {
        background: url("../images/cs-slider/anim/cs-medcpu-anim02.jpg") no-repeat
    }

    .cs-anim-medcpu03 {
        background: url("../images/cs-slider/anim/cs-medcpu-anim03.png") no-repeat;
        width: 354px;
        height: 248px;
        left: 49px;
        top: 270px
    }

    .cs-anim-btb01 {
        background: url("../images/cs-slider/anim/cs-btb-anim01.png") no-repeat;
        width: 141px;
        height: 228px;
        left: 99px;
        top: 208px
    }

    .cs-anim-btb02 {
        background: url("../images/cs-slider/anim/cs-btb-anim02.jpg") no-repeat
    }

    .cs-anim-btb03 {
        background: url("../images/cs-slider/anim/cs-btb-anim03.png") no-repeat;
        width: 301px;
        height: 344px;
        left: 459px;
        top: 163px
    }

    .cs-anim-leon01 {
        background: url("../images/cs-slider/anim/cs-leon-anim01.png") no-repeat;
        width: 186px;
        height: 151px;
        left: 42px;
        top: 281px
    }

    .cs-anim-leon02 {
        background: url("../images/cs-slider/anim/cs-leon-anim02.jpg") no-repeat
    }

    .cs-anim-leon03 {
        background: url("../images/cs-slider/anim/cs-leon-anim03.png") no-repeat;
        width: 451px;
        height: 219px;
        left: 263px;
        top: 276px
    }

    .cs-anim-dance01 {
        background: url("../images/cs-slider/anim/cs-dance-anim01.png") no-repeat;
        width: 141px;
        height: 228px;
        left: 102px;
        top: 210px
    }

    .cs-anim-dance02 {
        background: url("../images/cs-slider/anim/cs-dance-anim02.jpg") no-repeat
    }

    .cs-anim-dance03 {
        background: url("../images/cs-slider/anim/cs-dance-anim03.png") no-repeat;
        width: 320px;
        height: 421px;
        left: 483px;
        top: 19px
    }

    .animated .head-anim-webdesign01 {
        animation: head-anim-webdesign01 1.8s forwards
    }

    .animated .head-anim-webdesign02 {
        animation: head-anim-webdesign02 1.8s forwards
    }

    .animated .head-anim-webdesign03 {
        animation: head-anim-webdesign03 1.8s forwards
    }

    .animated .head-anim-webdesign04 {
        animation: head-anim-webdesign04 1.8s forwards
    }

    .animated .head-anim-webdesign05 {
        animation: head-anim-webdesign05 1.8s forwards
    }

    .animated .head-anim01 {
        animation: head-anim01 1.3s forwards
    }

    .animated .head-anim02 {
        animation: head-anim02 1.3s forwards
    }

    .animated .head-anim03 {
        animation: head-anim03 1.3s forwards
    }

    .animated .head-anim04 {
        animation: head-anim04 1.3s forwards
    }

    .animated .head-anim05 {
        animation: head-anim05 1s forwards
    }

    .animated .head-anim06 {
        animation: head-anim06 1s forwards
    }

    .animated .head-anim07 {
        left: 251px;
        top: 231px;
        animation: head-anim-img 1s forwards .7s
    }

    .animated .head-anim08 {
        left: -26px;
        top: 33px;
        animation: head-anim-img .6s forwards .5s
    }

    .animated .head-anim09 {
        left: -45px;
        top: -51px;
        animation: head-anim-img .8s forwards .2s
    }

    .animated .head-anim10 {
        left: 8px;
        top: 202px;
        animation: head-anim-img .4s forwards 1.2s
    }

    .animated .head-anim11 {
        left: 385px;
        top: 197px;
        animation: head-anim-img .6s forwards
    }

    .animated .head-anim12 {
        left: 337px;
        top: 109px;
        animation: head-anim-img .8s forwards
    }

    .animated .head-anim13 {
        left: -1px;
        top: -27px;
        animation: head-anim-img .4s forwards .5s
    }

    .animated .head-anim14 {
        left: 66px;
        top: -64px;
        animation: head-anim-img .6s forwards .8s
    }

    .animated .head-anim15 {
        left: 440px;
        top: -32px;
        animation: head-anim-img .8s forwards .6s
    }

    .animated .head-anim16 {
        left: 502px;
        top: 109px;
        animation: head-anim-img .6s forwards 1.2s
    }

    .animated .head-anim17 {
        left: 183px;
        top: 133px;
        animation: head-anim-img .8s forwards .8s
    }

    .animated .head-anim18 {
        left: -8px;
        top: -75px;
        animation: head-anim-img .5s forwards .6s
    }

    .animated .head-anim19 {
        left: -50px;
        top: -7px;
        animation: head-anim-img .8s forwards .2s
    }

    .animated .head-anim20 {
        left: 10px;
        top: 36px;
        animation: head-anim-img 1s forwards .7s
    }

    .animated .head-anim21 {
        left: 122px;
        top: -3px;
        animation: head-anim-img .6s forwards .5s
    }

    .animated .head-anim22 {
        left: -45px;
        top: 14px;
        animation: head-anim-img .4s forwards 1.2s
    }

    .unit-anim, .unit-anim-img, .unit-anim-img:after, .unit-anim-img:before, .unit-anim:after {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%
    }

    .unit-anim-img:after, .unit-anim-img:before, .unit-anim:after {
        content: "";
        opacity: 0
    }

    .unit-anim-img {
        z-index: 2
    }

    .unit-anim:after {
        z-index: 1;
        background-repeat: no-repeat;
        background-size: cover
    }

    .offers .t-cell {
        border-width: 1px;
        padding-bottom: 3px
    }

    .offers .t-cell:hover {
        background: #fafafa
    }

    .offers .t-cell:hover:after {
        background: #90c404
    }

    .offers .txt-holder h2, .offers .txt-holder p {
        position: relative;
        z-index: 3
    }

    .offers .txt-holder a {
        z-index: 3
    }

    .offers .img-holder {
        margin: 0;
        height: 280px;
        z-index: 1
    }

    .animated .top-anim-mobile01 {
        animation: top-anim-mobile01 2s forwards .2s
    }

    .animated .top-anim-mobile02 {
        animation: top-anim-mobile02 2s forwards .2s
    }

    .animated .top-anim-mobile03 {
        animation: top-anim-mobile03 2s forwards .2s
    }

    .animated .top-anim-mobile04 {
        animation: top-anim-mobile04 2s forwards .2s
    }

    .animated .top-anim-mobile05 {
        animation: top-anim-mobile05 2s forwards .2s
    }

    .animated .top-anim-mobile06 {
        animation: top-anim-mobile06 2s forwards .2s
    }

    .animated .top-anim-mobile07 {
        animation: top-anim-mobile07 2s forwards .2s
    }

    .strategy-anim:after {
        background-image: url("https://www.prismaxel.com/images/mobile-apps/anim/strategy-animbg.jpg")
    }

    .strategy-anim01:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/strategy-anim01.png") no-repeat;
        width: 422px;
        height: 275px
    }

    .strategy-anim01:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/strategy-anim02.png") no-repeat;
        width: 414px;
        height: 257px
    }

    .strategy-anim02:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/strategy-anim03.png") no-repeat;
        width: 444px;
        height: 266px
    }

    .animated .strategy-anim:after {
        animation: unit-anim-bg 1.2s forwards .4s
    }

    .animated .strategy-anim01:before {
        animation: strategy-anim01 1.2s forwards .4s
    }

    .animated .strategy-anim01:after {
        animation: strategy-anim02 1.2s forwards .4s
    }

    .animated .strategy-anim02:before {
        animation: strategy-anim03 1.2s forwards .4s
    }

    .design-anim:after {
        background-image: url("https://www.prismaxel.com/images/mobile-apps/anim/design-animbg.jpg")
    }

    .design-anim01:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/design-anim01.png") no-repeat;
        width: 54px;
        height: 250px
    }

    .design-anim01:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/design-anim02.png") no-repeat;
        width: 423px;
        height: 323px
    }

    .design-anim02:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/design-anim03.png") no-repeat;
        width: 493px;
        height: 352px
    }

    .animated .design-anim:after {
        animation: unit-anim-bg 1.8s forwards 1.4s
    }

    .animated .design-anim01:before {
        animation: design-anim01 1.8s forwards 1.4s
    }

    .animated .design-anim01:after {
        animation: design-anim02 1.8s forwards 1.4s
    }

    .animated .design-anim02:before {
        animation: design-anim03 1.8s forwards 1.4s
    }

    .dev-anim:after {
        background-image: url("https://www.prismaxel.com/images/mobile-apps/anim/dev-animbg.jpg")
    }

    .dev-anim01:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/dev-anim01.png") no-repeat;
        width: 90px;
        height: 85px
    }

    .dev-anim01:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/dev-anim02.png") no-repeat;
        width: 91px;
        height: 101px
    }

    .dev-anim02:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/dev-anim03.png") no-repeat;
        width: 230px;
        height: 209px
    }

    .dev-anim02:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/dev-anim04.png") no-repeat;
        width: 448px;
        height: 300px
    }

    .animated .dev-anim:after {
        animation: unit-anim-bg 1.8s forwards .4s
    }

    .animated .dev-anim01:before {
        animation: dev-anim01 1.8s forwards .4s
    }

    .animated .dev-anim01:after {
        animation: dev-anim02 1.8s forwards .4s
    }

    .animated .dev-anim02:before {
        animation: dev-anim03 1.8s forwards .4s
    }

    .animated .dev-anim02:after {
        animation: dev-anim04 1.8s forwards .4s
    }

    .marketing-anim:after {
        background-image: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-animbg.jpg")
    }

    .marketing-anim01:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-anim01.png") no-repeat;
        width: 419px;
        height: 304px
    }

    .marketing-anim01:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-anim02.png") no-repeat;
        width: 308px;
        height: 207px
    }

    .marketing-anim02:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-anim03.png") no-repeat;
        width: 450px;
        height: 314px
    }

    .marketing-anim02:after {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-anim04.png") no-repeat;
        width: 143px;
        height: 98px
    }

    .marketing-anim03:before {
        background: url("https://www.prismaxel.com/images/mobile-apps/anim/marketing-anim05.png") no-repeat;
        width: 186px;
        height: 165px
    }

    .animated .marketing-anim:after {
        animation: unit-anim-bg 1.8s forwards 1.9s
    }

    .animated .marketing-anim01:before {
        animation: marketing-anim01 1.8s forwards 1.9s
    }

    .animated .marketing-anim01:after {
        animation: marketing-anim02 1.8s forwards 1.9s
    }

    .animated .marketing-anim02:before {
        animation: marketing-anim03 1.8s forwards 1.9s
    }

    .animated .marketing-anim02:after {
        animation: marketing-anim04 1.8s forwards 1.9s
    }

    .animated .marketing-anim03:before {
        animation: marketing-anim05 1.8s forwards 1.9s
    }

    .submenu-section .item:hover:before {
        height: calc(100% - 40px)
    }

    .submenu-section .item:hover img {
        opacity: 1;
        transform: translate(-50%, -23%) scale(.54)
    }

    .submenu-section .item:hover {
        color: #0078ae
    }

    .tab-slider-pager:not(.visual) > a:hover span {
        color: #90c404
    }
}

@media only screen and (max-width: 1700px) and (min-width: 1025px) {
    .an-wide .btn {
        z-index: 2
    }

    .animated .brand-anim03:before {
        width: 413px
    }

    .unit-anim {
        overflow: hidden
    }

    .unit-anim-img {
        top: 50%;
        left: 50%;
        transform: scale(.8) translate(-65%, -55%)
    }

    .cr-design-pg .unit-anim-img {
        top: 55%
    }
}

@media only screen and (max-width: 1598px) and (min-width: 1025px) {
    .feat-expanded-section .tab-lnk {
        -webkit-transform: scale(.9);
        transform: scale(.9);
        margin: -23px
    }
}

@media only screen and (max-width: 1434px) and (min-width: 1025px) {
    .feat-expanded-section .tab-lnk {
        -webkit-transform: scale(.85);
        transform: scale(.85);
        margin: -35px
    }

    .offers .img-holder {
        height: 250px
    }

    .unit-anim-img {
        transform: scale(.7) translate(-83%, -73%)
    }

    .cr-design-pg .unit-anim-img {
        top: 58%
    }
}

@media only screen and (max-width: 1357px) and (min-width: 1025px) {
    .feat-expanded-section .tab-lnk {
        -webkit-transform: scale(.76);
        transform: scale(.76);
        margin: -57px
    }
}

@media only screen and (max-width: 1230px) and (min-width: 1025px) {
    .feat-expanded-section .tab-lnk {
        -webkit-transform: scale(.68);
        transform: scale(.68);
        margin: -76px
    }

    .feat-expanded-section .txt-tab-lnk {
        margin: 60px 0 0;
        -webkit-transform: none;
        transform: none
    }

    .feat-txt p {
        margin-bottom: 10px
    }

    .feat-txt h5 {
        font-size: 19px;
        margin-bottom: 15px
    }

    .feat-content .btn-holder {
        margin-top: 20px
    }

    .feat-content .btn-green {
        padding: 9px 15px 11px;
        font-size: 15px
    }

    .feat-content .btn-raq {
        font-size: 14px
    }

    .wide-gallery-images {
        width: 520px
    }

    .widefeat-txt {
        padding-left: 480px
    }

    .widefeat-thumbs {
        padding-bottom: 32px
    }

    .widefeat-brand {
        width: calc(100% - 457px)
    }

    .widefeat-content .link-arrow.blue, .widefeat-content .link-arrow.green {
        font-size: 13px
    }

    .widefeat-content .link-arrow:after {
        width: 5px;
        height: 5px;
        border-width: 2px 2px 0 0
    }

    .offers .img-holder {
        height: 200px
    }

    .unit-anim-img {
        transform: scale(.6) translate(-100%, -96%)
    }
}

@media only screen and (max-width: 1170px) and (min-width: 1025px) {
    .an-wide {
        margin: 0 0 50px
    }

    .an-wide-right .img-mobile {
        left: -5%
    }

    .an-wide-right .img-descktop {
        left: -2%
    }

    .pr-slider .t-cell.visual .wide-mode {
        left: -10px
    }

    .pr-slider p {
        padding-right: 20%
    }

    .img-descktop, .img-mobile {
        transform: scale(.9)
    }

    .img-bg img {
        margin-left: -20%
    }
}

@media only screen and (max-width: 1115px) and (min-width: 1025px) {
    .feat-expanded-section .tab-lnk {
        -webkit-transform: scale(.62);
        transform: scale(.62);
        margin: -84px -94px
    }

    .feat-expanded-section .txt-tab-lnk {
        margin: 60px 0 0;
        -webkit-transform: none;
        transform: none
    }

    .feat-txt {
        padding: 24px 24px 24px 430px
    }

    .widefeat-txt {
        padding: 46px 20px 24px 480px
    }
}

@media only screen and (max-width: 880px) and (-webkit-min-device-pixel-ratio: 2) {
    .logo a {
        background: url("../images/logo-tablet-2x.png") 0 0/238px 40px no-repeat;
        width: 238px;
        height: 40px
    }
}

@media only screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {
    .logo a {
        background: url("../images/logo-mobile-2x.png") 0 0/180px 30px no-repeat;
        height: 30px;
        width: 180px
    }
}

@media only screen and (min-width: 881px) and (-webkit-min-device-pixel-ratio: 2) {
    .logo {
        background: url("../images/logo-desctop-x2.png") 0 0/360px 60px no-repeat
    }

    .simple-header.h-animated .logo {
        top: 20px;
        width: 360px;
        height: 60px;
        background-size: 360px 60px
    }
}

@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none) {
    .solutions-section h3 svg {
        height: 70px
    }
}

.fwbi-text .btn-holder {
    text-align: center
}

.nw-container {
    max-width: 1582px;
    margin: 0 auto
}

.nw-container:after {
    content: '';
    display: block;
    clear: both
}

.nw-container.pd {
    max-width: 1622px;
    padding: 0 20px
}

.nw-container.narrow {
    max-width: 1152px
}

#main {
    background: #fff
}

.f--nw-container {
    display: flex;
    max-width: 1582px;
    margin: 0 auto;
    flex-wrap: wrap
}

.nw--wide-container {
    max-width: 1822px;
    margin: 0 auto
}

.nw-header.header > .nw--container-xl {
    max-width: 1582px;
    margin: 0 auto
}

.nw--b__section {
    max-width: 1368px;
    margin: 0 auto
}

.sec-ttl .descr .subhead-descr {
    text-align: center;
    color: #009ddc;
    font-size: 24px;
    : roboto-medium-webfont, Arial, sans-serif;
    margin-bottom: 25px
}

.sand, .sand .txt-slider {
    background: #f6f6f6
}

.slider-head {
    padding-top: 80px
}

@media all and (max-width: 767px) {
    .slider-head {
        padding-top: 40px
    }
}

.rd-box-holder.tr-top {
    margin-top: -100px;
    padding: 0
}

.scroll-btn--wrp {
    position: relative;
    height: 0
}

.scroll-btn--wrp .nxt-anchor {
    height: 69px;
    position: absolute;
    left: 50%;
    top: -35px;
    z-index: 9;
    transform: translateX(-50%);
    width: 69px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, .1);
    display: flex;
    justify-content: center;
    align-items: center
}

.scroll-btn--wrp .nxt-anchor svg {
    width: 36px;
    height: 16px;
    transition: transform .2s linear
}

@media all and (max-width: 1025px) {
    .top-section.nw--top-section .top--col-left, .top-section.nw--top-section .top--col-right {
        position: static;
        width: 100%;
        float: none;
        padding: 0;
        display: flex;
        justify-content: center;
        height: auto
    }

    .top-section.nw--top-section .top--col-left .ttl br, .top-section.nw--top-section .top--col-right .ttl br {
        display: none;
        text-align: center;
        font-size: 55px
    }

    .top-section.nw--top-section .top--col-left .btn-holder, .top-section.nw--top-section .top--col-left p, .top-section.nw--top-section .top--col-right .btn-holder, .top-section.nw--top-section .top--col-right p {
        text-align: center
    }

    .top-section.nw--top-section .top--col-left {
        margin-bottom: 30px
    }

    .top-section.nw--top-section .top--col-right {
        margin-bottom: 0
    }
}

.tl-title--text {
    font-weight: 700;
    : roboto-light-webfont, Arial, Helvetica, sans-serif;
    font-size: 40px;
    text-align: center
}

.container-xx {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px
}

.container-xx.no-pd {
    max-width: 1100px;
    padding: 0
}

.pd-top--container {
    padding-top: 80px
}

.pmp-rd {
    margin: -120px auto
}

.nw--inner-container {
    max-width: 1350px;
    margin: 0 auto
}

.bfb {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif !important
}

.sm-pd--b {
    padding: 80px 0 60px;
    margin-bottom: 60px;
    border-bottom: 3px solid #009ddc
}

@media all and (max-width: 1025px) {
    .sm-pd--b {
        margin-bottom: 30px
    }
}

.sm-pd--b .ns-see-more {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.sm-pd--b .ns-see-more a {
    margin-left: 7px
}

@media all and (max-width: 767px) {
    .sm-pd--b .ns-see-more a {
        display: block;
        margin-left: 0
    }
}

.nw-container-12 {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px
}

.va-pd {
    padding: 0 20px
}

.brand-list {
    min-height: 200px
}

.brand-list img:first-child {
    height: auto !important
}

.brand-list img:first-child.ac:not(.active-slide-img) {
    height: 0 !important
}

.bbt {
    border-bottom: 3px solid #e8e8e8
}

.nw-header {
    box-shadow: none;
    z-index: 999999;
    padding: 0
}

@media all and (min-width: 882px) and (max-width: 1025px) {
    .nw-header .search-line {
        transform: translateY(18px)
    }
}

@media all and (min-width: 882px) and (max-width: 1025px) {
    .nw-header .logo {
        transform: translateX(58px)
    }
}

@media all and (min-width: 646px) and (max-width: 768px) {
    .nw-header.header {
        height: 60px
    }
}

@media all and (min-width: 646px) and (max-width: 768px) {
    .nw-header.header.search-active {
        height: 100px
    }
}

.nw-header.header .nav li .link-arrow {
    font-size: 14px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin: 0;
    color: #90c404;
    border-left: 1px solid #DADADA
}

@media all and (min-width: 646px) and (max-width: 882px) {
    .nw-header.header .nav li .link-arrow {
        line-height: 35px
    }
}

.nw-header.header .nav li .link-arrow:after {
    transition: border-color .3s ease-out;
    border-width: 2px 2px 0 0
}

.nw-header.header .nav li .link-arrow:hover:after {
    border-color: #0078ae
}

@media all and (max-width: 1025px) and (min-width: 882px) {
    .nw-header.header .nav li .link-arrow {
        position: absolute;
        top: -31px;
        right: 6px;
        display: inline-block;
        margin-top: 0;
        padding-top: 5px;
        padding-bottom: 6px;
        padding-left: 8px;
        font-size: 15px;
        width: 170px
    }

    .nw-header.header .ht-simplemenu {
        margin-right: 190px
    }
}

@media all and (max-width: 1025px) and (min-width: 882px) and (max-width: 1025px) {
    .nw-header .open-m-menu {
        visibility: visible;
        display: block
    }
}

@media all and (max-width: 1025px) {
    .nw-header .nav li:not(:last-child) {
        display: none
    }
}

.nw-header + #main {
    transition: all 1s
}

@media only screen and (min-width: 881px) {
    .nw-header + #main {
        padding-top: 74px
    }
}

@media all and (min-width: 1025px) {
    .nw-header + #main {
        padding-top: 203px
    }
}

@media all and (min-width: 1025px) {
    .nw-header + #main.has-no-sub {
        padding-top: 150px
    }
}

@media all and (min-width: 1025px) {
    .nw-header + #main.not-menu-page {
        padding-top: 102px
    }
}

@media all and (max-width: 1600px) and (min-width: 1026px) {
    .nw-header {
        padding: 0 4.7vw
    }
}

@media all and (max-width: 1300px) and (min-width: 1026px) {
    .nw-header {
        padding: 0 3.5vw
    }
}

@media all and (max-width: 1025px) {
    .nw-header {
        padding-top: 0 !important
    }
}

@media all and (max-width: 768px) {
    .nw-header .head-top {
        margin-right: 170px
    }
}

@media all and (max-width: 1025px) {
    .nw-header .additional-nav {
        display: none
    }
}

.nw-header .additional-nav li a, .nw-header .additional-nav li span {
    font-size: 12px
}

.nw-header .ht-simplemenu .phone {
    font-size: 15px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

@media all and (max-width: 768px) {
    .nw-header .ht-simplemenu .phone {
        padding-right: 15px
    }
}

@media all and (min-width: 882px) and (max-width: 1025px) {
    .nw-header .ht-simplemenu .phone {
        transform: translateY(18px)
    }
}

@media all and (min-width: 881px) {
    .nw-header .nw-header--menu {
        width: 75%
    }
}

@media all and (min-width: 881px) {
    .nw-header.header .head-r-side {
        width: 100%
    }
}

.nw-header.header.h-animated .head-top {
    border-bottom: none !important
}

@media all and (min-width: 862px) and (max-width: 1025px) {
    .nw-header.header.h-animated .logo {
        margin-top: 5px
    }
}

@media all and (min-width: 881px) {
    .nw-header.header.h-animated > .nw--container-xl {
        height: 66px
    }
}

@media all and (max-width: 767px) {
    .nw-header.header.h-animated > .nw--container-xl {
        height: 60px
    }
}

@media all and (min-width: 1286px) {
    .nw-header.header.h-animated .nw-header--menu {
        width: calc(100% - 300px)
    }
}

.nw-header.header.h-animated .logo {
    height: 38px;
    width: 230px;
    background-size: cover;
    margin-top: 0
}

@media all and (min-width: 1400px) {
    .nw-header.header.h-animated .logo {
        width: 260px;
        height: 43px
    }
}

@media all and (min-width: 1026px) {
    .nw-header.header.h-animated .logo {
        margin-top: 13px
    }
}

.nw-header.header > .nw--container-xl {
    padding: 0
}

@media all and (min-width: 1026px) {
    .nw-header.header > .nw--container-xl {
        height: 97px
    }
}

@media all and (min-width: 882px) and (max-width: 1025px) {
    .nw-header.header > .nw--container-xl {
        height: 70px
    }
}

@media all and (min-width: 882px) and (max-width: 1025px) {
    .nw-header.header > .nw--container-xl .open-m-menu {
        visibility: visible;
        display: block;
        transform: translateY(18px)
    }
}

.nw-header.header .nav > li:not(.not-tr).active:before {
    bottom: -8px;
    margin-left: -12px;
    background: 0 0;
    height: 0;
    width: 0;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 13px solid #018fcf
}

.nw-header.header .nav > li a {
    font-size: 14px;
    text-transform: uppercase;
    padding: 0 14px
}

.nw-header.header .nav > li:nth-child(n) {
    max-width: 100%
}

.nw-header.header .nav > li:nth-child(5) a {
    padding-right: 25px
}

.nw-header.header .nav > li:nth-child(7) a {
    padding-left: 25px
}

@media only screen and (min-width: 881px) {
    .nw-header .ht-nav li {
        padding: 0 16px 0 6px
    }

    .nw-header .ht-simplemenu em.arrow {
        margin: 9px 18px 0 0
    }

    .nw-header .head-top {
        width: 100%;
        max-width: 100%;
        padding: 9px 0;
        margin-bottom: 10px
    }

    .nw-header .hm-advancedmenu {
        float: none
    }

    .nw-header .nw-header--menu {
        float: right
    }
}

.nw-header .logo {
    position: static;
    float: left;
    margin-top: 27px;
    height: 38px;
    width: 230px;
    background-size: cover
}

@media all and (min-width: 1400px) {
    .nw-header .logo {
        width: 260px;
        height: 43px
    }
}

@media all and (min-width: 882px) and (max-width: 1026px) {
    .nw-header .logo {
        position: absolute;
        margin-top: -5px
    }
}

@media all and (max-width: 862px) {
    .nw-header .logo {
        width: 177px
    }
}

@media all and (max-width: 881px) {
    .nw-header .logo {
        margin-top: 0
    }
}

@media all and (min-width: 1281px) {
    .nw-header .nw-header--menu {
        width: calc(100% - 360px);
        transition: all .1s
    }

    .nw-header .logo {
        width: 360px;
        height: 60px
    }

    .nw-header .header.h-animated .logo {
        top: 10px;
        width: 228px !important;
        height: 38px !important;
        background-size: 228px 38px !important
    }
}

.header .nw-header--menu .hm-advancedmenu .nav-submenu {
    position: absolute;
    top: 35px;
    left: 50%;
    height: 0;
    background: #fff;
    transform: translateX(-49.9%);
    transition: all .3s linear;
    min-width: 200px;
    border: solid #009ddc;
    border-width: 3px 0;
    box-shadow: 0 3px 3px 1px #d5dfe4;
    z-index: 2;
    opacity: 0;
    display: block;
    visibility: hidden
}

.header .nw-header--menu .hm-advancedmenu .nav-submenu:before {
    content: "";
    width: 18px;
    height: 18px;
    background-color: #009ddc;
    position: absolute;
    top: -7px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    z-index: -1
}

.header .nw-header--menu .hm-advancedmenu .nav-submenu li {
    max-width: 100%;
    border: none;
    z-index: 9;
    background: #fff
}

.header .nw-header--menu .hm-advancedmenu .nav-submenu li a {
    display: block;
    color: #5a6063;
    font: 14px/1.2 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    padding: 14px 25px !important;
    transition: all .3s linear
}

.header .nav > li {
    padding-bottom: 10px
}

.header .nav > li:not(.active):hover .nav-submenu {
    height: auto
}

.header .nav > li:not(.active):hover .nav-submenu li:hover a {
    color: #009ddc
}

@media all and (min-width: 1025px) {
    .nw-header > .nw--container-xl {
        overflow: visible
    }
}

@media only screen and (max-width: 980px) {
    .s--top-page-panel.static-sublevel.top-page-panel {
        padding: 22px 5px 5px
    }
}

@media all and (max-width: 646px) {
    .open-m-menu {
        transition: none
    }

    .mm-opened .open-m-menu {
        transition: none;
        margin-top: 9px !important;
        border-right: none
    }
}

@media all and (min-width: 882px) and (max-width: 1026px) {
    .mm-opened .nw--container-xl .open-m-menu {
        display: none !important
    }
}

@media all and (max-width: 662px) {
    .nw-header.header.h-animated .logo {
        width: 177px
    }
}

@media all and (max-width: 646px) {
    .header {
        padding-top: 55px !important
    }
}

@media all and (max-width: 695px) {
    .nw-header.header.h-animated .logo {
        width: 177px !important
    }
}

@media only screen and (min-width: 1025px) {
    .header.h-animated .head-r-side {
        margin-top: -65px
    }
}

@media all and (max-width: 1025px) {
    .header.h-animated .head-r-side {
        margin-top: 0
    }
}

@media all and (max-width: 880px) and (min-width: 646px) {
    .nw-header.header > .nw--container-xl {
        padding-top: 10px
    }
}

@media all and (max-width: 882px) {
    .nw--container-xl .open-m-menu {
        margin-top: 9px !important;
        transform: translateY(-9px)
    }
}

@media all and (min-width: 1026px) {
    .nw--container-xl .open-m-menu {
        display: none
    }
}

@media all and (min-width: 1026px) and (max-width: 1281px) {
    .h-animated.nw-header.header .nav > li a {
        padding: 0 8px
    }

    .h-animated.nw-header.header .nav > li.p-box {
        width: 130px
    }
}

@media all and (min-width: 1026px) and (max-width: 1101px) {
    .h-animated.nw-header.header .nav > li a {
        font-size: 13px
    }
}

.nw-menu--wrp {
    justify-content: center;
    max-width: 1582px;
    background: #018fcf;
    padding: 6px 20px 2px;
    border-radius: 6px;
    position: relative;
    z-index: 30
}

@media all and (max-width: 1600px) {
    .nw-menu--wrp {
        max-width: 1420px
    }
}

@media all and (max-width: 1281px) {
    .nw-menu--wrp {
        max-width: 1154px
    }
}

@media all and (max-width: 1024px) {
    .nw-menu--wrp {
        max-width: 938px
    }
}

.nw-menu--wrp .n-nav--list {
    display: flex;
    width: 100%;
    justify-content: center;
    max-width: 1376px;
    margin: 0
}

.nw-menu--wrp .n-nav--list li a {
    box-shadow: none !important
}

.nw-menu--wrp .n-nav--list > li {
    margin: 0 !important;
    position: relative;
    border-radius: 5px 5px 0 0 !important;
    border-right: 2px solid transparent
}

.nw-menu--wrp .n-nav--list > li:first-child {
    border-radius: 5px 0 0 !important
}

.nw-menu--wrp .n-nav--list > li:last-child {
    border-radius: 0 5px 0 0 !important;
    border: none
}

.nw-menu--wrp .n-nav--list > li > a {
    margin: 0 !important;
    border-radius: 5px 5px 0 0 !important
}

.nw-menu--wrp .n-nav--list > li > a.active {
    padding: 0
}

.nw-menu--wrp .n-nav--list > li:hover {
    background: #fbff00;
    color: #018fcf;
    border-radius: 5px 5px 0 0 !important
}

.nw-menu--wrp .n-nav--list > li.active {
    background: #0078ae;
    color: #fff;
    text-shadow: none;
    border-radius: 5px 5px 0 0 !important
}

.nw-menu--wrp .n-nav--list > li.active a {
    color: #fff
}

.nw-menu--wrp:not(.service-menu) .n-nav--list > li:hover {
    background: #0078ae
}

.nw-menu--wrp:not(.service-menu) .n-nav--list > li:hover a {
    color: #fff !important
}

.s--top-page-panel {
    margin: 0 auto;
    background: #000;
    padding: 0
}

@media all and (min-width: 1025px) {
    .s--top-page-panel {
        position: fixed;
        left: 0;
        right: 0;
        top: 100px;
        z-index: 999
    }

    .s--top-page-panel:after {
        position: absolute;
        width: 300%;
        background: #fff;
        left: 0;
        right: 0;
        z-index: 99;
        top: 70px;
        height: 100%
    }
}

@media all and (max-width: 1025px) {
    .s--top-page-panel {
        display: none
    }
}

@media all and (max-width: 1600px) {
    .s--top-page-panel {
        padding: 0 4.7vw
    }
}

@media all and (max-width: 1300px) and (min-width: 1026px) {
    .s--top-page-panel {
        padding: 0 3.5vw
    }
}

.s--top-page-panel .tpp-nav {
    position: relative;
    float: none;
    width: 100%
}

.s--top-page-panel .tpp-nav > li {
    float: none;
    display: flex;
    position: static;
    width: 100%;
    border-radius: 0 !important;
    margin: 0 !important;
    border-right: 1px solid #0178ad;
    border-top: none !important;
    background: #018fcf
}

.s--top-page-panel .tpp-nav > li.active > .sublevel {
    background: #252525
}

.s--top-page-panel .tpp-nav > li.active > .sublevel ul {
    max-width: 100%
}

.s--top-page-panel .tpp-nav > li.active > .sublevel ul li:before {
    top: 100%
}

.s--top-page-panel .tpp-nav > li > .sublevel {
    padding: 0 38px 38px 35px !important;
    right: 0
}

.s--top-page-panel .tpp-nav > li a {
    font-size: 16px;
    background: 0 0 !important;
    min-height: 35px;
    font-weight: 700;
    border-radius: 0;
    text-transform: uppercase;
    border: none;
    text-shadow: none !important;
    padding: 16px 15px !important;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center
}

@media all and (max-width: 1281px) {
    .s--top-page-panel .tpp-nav > li a {
        font-size: 13px;
        padding: 15px 10px !important
    }
}

@media all and (max-width: 1101px) {
    .s--top-page-panel .tpp-nav > li a {
        font-size: 12px;
        padding: 15px 10px !important
    }
}

.s--top-page-panel .tpp-nav > li a .nw-icon {
    margin-right: 20px
}

.s--top-page-panel .tpp-nav > li a:before {
    content: none
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel {
    width: 100%;
    top: 100%;
    background: #252525;
    transition: opacity .5s ease;
    transform-origin: 50% 0;
    transform: scaleY(0);
    opacity: 0 !important;
    pointer-events: none;
    overflow: hidden;
    box-shadow: none
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul {
    display: flex;
    flex-wrap: wrap;
    transition: all .3s;
    background: #252525;
    margin-right: -20px
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li {
    width: calc(25% - 22px);
    min-width: 10%;
    max-width: calc(25% - 22px);
    position: relative;
    border-top: none;
    height: 152px;
    z-index: 2;
    display: flex;
    margin: 50px 20px 0 0;
    background: #2F2F2F;
    opacity: 0
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(1) {
    transition: opacity .4s;
    transition-delay: .5s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(2) {
    transition: opacity .4s;
    transition-delay: .55s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(3) {
    transition: opacity .4s;
    transition-delay: .6s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(4) {
    transition: opacity .4s;
    transition-delay: .65s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(5) {
    transition: opacity .4s;
    transition-delay: .7s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(6) {
    transition: opacity .4s;
    transition-delay: .75s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(7) {
    transition: opacity .4s;
    transition-delay: .8s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(8) {
    transition: opacity .4s;
    transition-delay: .85s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(9) {
    transition: opacity .4s;
    transition-delay: .9s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(10) {
    transition: opacity .4s;
    transition-delay: .95s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(11) {
    transition: opacity .4s;
    transition-delay: 1s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:nth-child(12) {
    transition: opacity .4s;
    transition-delay: 1.05s
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:before {
    width: 100%;
    height: 2px;
    content: '';
    display: block !important;
    bottom: 0;
    position: absolute;
    background: #009ddc;
    z-index: 3
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transform: scaleY(0);
    transform-origin: 0 100%;
    transition: transform .4s;
    background: #fff
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:hover:after {
    transform: scaleY(1)
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:hover:before {
    height: 5px
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:hover a img {
    opacity: 1;
    transform: scale(.73) translateY(-54%)
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li:hover .nw-menu-text {
    color: #0078ae
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li > a {
    background: 0 0 !important;
    position: relative;
    overflow: visible;
    z-index: 1;
    height: 100%;
    font-weight: 700;
    font-size: 20px;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    left: 0;
    text-align: center
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li > a img {
    transform: translateY(-50px);
    opacity: .5;
    max-width: auto;
    display: block;
    transition: all .4s ease
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li > a .nw-menu-text {
    position: absolute;
    bottom: 25px;
    width: 100%;
    padding: 0 20px;
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    text-transform: none;
    left: 0;
    z-index: 3;
    text-align: center
}

@media all and (max-width: 1281px) {
    .s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li > a .nw-menu-text {
        font-size: 17px
    }
}

.s--top-page-panel .tpp-nav > li:not(.active) .sublevel ul li > a:before {
    content: none
}

.s--top-page-panel .tpp-nav > li.active .sublevel {
    background: #fff;
    padding: 9px 0 !important;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 2;
    transition: padding .4s ease
}

.s--top-page-panel .tpp-nav > li.active .sublevel:after {
    content: "";
    position: absolute;
    width: 300%;
    left: -100%;
    background: #fff;
    height: 100%;
    z-index: -1;
    top: 0;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .1)
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul {
    display: flex;
    justify-content: center
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li {
    padding: 0;
    display: flex;
    height: auto;
    min-height: 35px;
    min-width: inherit;
    border-top: none;
    flex: 1 1 auto
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li:after {
    transition: opacity .3s;
    position: absolute;
    left: 1px;
    content: '';
    background: #009ddc;
    height: 2px;
    bottom: -9px;
    width: calc(100% + 2px);
    transform: translateX(-1px);
    opacity: 0
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li.active:after, .s--top-page-panel .tpp-nav > li.active .sublevel ul li:hover:after {
    opacity: 1
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li:not(:last-child) {
    border-right: 1px solid #e3e3e3
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li:before {
    content: none
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li a {
    padding: 0 30px !important;
    height: 100%;
    display: flex;
    min-height: 35px;
    text-transform: uppercase
}

@media all and (max-width: 1281px) {
    .s--top-page-panel .tpp-nav > li.active .sublevel ul li a {
        font-size: 12px;
        padding: 0 15px !important
    }
}

.s--top-page-panel .tpp-nav > li.active .sublevel ul li a:before {
    content: none
}

.s--top-page-panel .tpp-nav > li.active .sublevel img {
    display: none
}

.s--top-page-panel .tpp-nav > li.active .sublevel .nw-menu-text {
    color: #018fcf;
    text-align: center
}

.s--top-page-panel .tpp-nav > li.active .sublevel .nw-menu-text br {
    display: none
}

.s--top-page-panel .tpp-nav > li:hover .sublevel {
    transform: scaleY(1);
    opacity: 1 !important;
    pointer-events: all
}

.s--top-page-panel .tpp-nav > li:hover .sublevel ul {
    transform: translate3d(0, 0, 0)
}

.s--top-page-panel .tpp-nav > li:hover .sublevel ul li {
    opacity: 1
}

.s--top-page-panel .tpp-nav > li.hover .sublevel {
    transform: translate3d(0, 0, 0) scaleY(1)
}

.s--top-page-panel .tpp-nav > li:not(.active):hover a {
    color: #018fcf
}

.s--top-page-panel .tpp-nav > li:not(.active):hover a svg {
    fill: #018fcf
}

body.b-animated .s--top-page-panel {
    top: 70px;
    background: #000
}

body.b-animated .s--top-page-panel .tpp-nav > li a {
    padding: 11px 15px !important
}

body.b-animated .s--top-page-panel:after {
    background: 0 0
}

body.b-animated .s--top-page-panel .tpp-nav > li.active .sublevel {
    padding: 5px 0 !important
}

body.b-animated .s--top-page-panel .tpp-nav > li.active .sublevel ul li {
    min-height: 14px
}

body.b-animated .s--top-page-panel .tpp-nav > li.active .sublevel ul li:after {
    bottom: -5px
}

body.b-animated .s--top-page-panel .tpp-nav > li.active .sublevel ul li a {
    min-height: 14px;
    padding: 5px 30px !important
}

body.b-animated .s--top-page-panel .nw-menu--wrp {
    padding-top: 0
}

@media all and (max-width: 980px) {
    .s--top-page-panel.static-sublevel.top-page-panel {
        padding: 20px 20px 0
    }

    .s--top-page-panel.static-sublevel.top-page-panel .ttl {
        font-size: 38px
    }

    .s--top-page-panel.static-sublevel.top-page-panel .tpp-nav .sublevel, .s--top-page-panel.static-sublevel.top-page-panel .tpp-nav ul {
        width: 100%
    }
}

@media all and (max-width: 1170px) {
    .s--top-page-panel.static-sublevel .tpp-nav .active .sublevel {
        opacity: 1;
        visibility: visible;
        width: 100%;
        background: #fff;
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 2;
        padding: 0;
        box-shadow: 0 2px 2px rgba(0, 0, 0, .1)
    }

    .s--top-page-panel.static-sublevel .active .active:after {
        content: "";
        height: 1px;
        width: 100%;
        background: #90c404;
        position: absolute;
        bottom: -1px;
        left: 1px
    }
}

.top-page-panel .tpp-nav li > ul.drop-sm {
    position: absolute;
    top: 43px;
    left: 50%;
    width: 100%;
    transform: translateX(-49.9%);
    transition: all .1s linear;
    padding: 0;
    border-bottom: 3px solid #009ddc;
    z-index: 2;
    visibility: hidden;
    opacity: 0
}

.top-page-panel .tpp-nav li > ul.drop-sm:after {
    content: "";
    position: absolute;
    top: -8px;
    background: 0 0;
    left: 50%;
    transform: translateX(-50%);
    transition: border .2s;
    height: 0;
    width: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #fff
}

.top-page-panel .tpp-nav li > ul.drop-sm li {
    margin: 0
}

.top-page-panel .tpp-nav li > ul.drop-sm li:hover a {
    color: #009ddc !important;
    background: #fff !important
}

.top-page-panel .tpp-nav li > ul.drop-sm li a {
    text-transform: uppercase;
    font-size: 14px;
    color: #5a6063 !important;
    transition: all .2s;
    padding: 0 17px
}

.top-page-panel .tpp-nav li > ul.drop-sm li a:before {
    content: none
}

.top-page-panel .tpp-nav li.drop-sm--item {
    position: relative
}

.top-page-panel .tpp-nav li.drop-sm--item:hover > ul.drop-sm {
    opacity: 1;
    visibility: visible
}

.top-page-panel .tpp-nav li.drop-sm--item:hover > ul.drop-sm li:hover a {
    color: #fff;
    position: relative;
    z-index: 2
}

body.b-animated .top-page-panel .tpp-nav li > ul.drop-sm {
    top: 33px
}

.s--top-page-panel.nav-sm--drop .tpp-nav > li.drop-sm--item .drop-sm a {
    display: block;
    color: #009ddc !important;
    font: 14px/1.3 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    padding: 27px 25px !important;
    transition: all .1s linear;
    text-align: center;
    width: 100%
}

.s--top-page-panel.nav-sm--drop .tpp-nav > li.drop-sm--item:hover ul li:hover a {
    color: #252a30 !important
}

@media all and (min-width: 1026px) {
    .tnx-top--panel {
        padding-top: 70px
    }
}

.hover-drop {
    display: none !important
}

@media all and (min-width: 1026px) {
    .case-pg.b-animated .top-page-panel {
        display: block !important
    }
}

.nav-submenu {
    position: absolute;
    top: 35px;
    left: 50%;
    -webkit-transform: translateX(-49.9%);
    transform: translateX(-49.9%);
    transition: all .1s linear;
    width: auto;
    border: solid #009ddc;
    border-width: 3px 0;
    box-shadow: 0 3px 3px 1px #d5dfe4;
    z-index: 2;
    visibility: hidden;
    opacity: 0
}

.header .nav > li:not(.active):hover .nav-submenu {
    opacity: 1;
    visibility: visible
}

.nav-submenu:before {
    content: "";
    width: 18px;
    height: 18px;
    background-color: #009ddc;
    position: absolute;
    top: -7px;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
    z-index: 1
}

.header .nav .nav-submenu > li {
    background-color: #fff;
    width: auto;
    max-width: 100%;
    white-space: nowrap;
    position: relative;
    z-index: 2
}

.header .nav .nav-submenu li:not(:first-child) {
    border-top: 1px solid #e3e3e3
}

.nav-submenu li > a {
    display: block;
    color: #009ddc;
    font: 17px/1.3 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    padding: 18px 25px !important;
    transition: all .1s linear
}

.header .hm-advancedmenu .nav-submenu > li:hover > a {
    background-color: #0ae;
    color: #fff !important;
    position: relative;
    z-index: 2
}

.nav-sublevel {
    background-color: #fafafa;
    border-left: 5px solid #0ae;
    position: absolute;
    top: 0;
    left: 100%;
    box-shadow: 0 1px 2px 2px rgba(213, 223, 228, .7);
    transition: all .3s linear;
    z-index: 1;
    width: auto;
    visibility: hidden;
    opacity: 0
}

.header .nav .nav-sublevel > li {
    background-color: #fafafa;
    max-width: 100%;
    transition: background-color .1s linear, opacity .1s linear
}

.nav-sublevel li > a {
    color: #5a6063;
    padding: 15px 25px;
    font: 15px/1.3 roboto-regular-webfont, Arial, Helvetica, Sans-Serif;
    transition: all .2s linear
}

.header .nav-sublevel > li:hover > a {
    color: #90c404 !important;
    background: #fff
}

.header .nav .nav-sublevel li:hover + li {
    border-color: #90c404
}

.header .nav .nav-submenu > li:hover .nav-sublevel {
    visibility: visible;
    opacity: 1
}

@media all and (max-width: 768px) {
    .nw-slider--item.simple-slider .t-holder {
        padding: 0 10px
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item.simple-slider .t-holder {
        padding: 0 20px
    }
}

.nw-slider--item .pull-controls {
    z-index: 50
}

@media all and (min-width: 646px) and (max-width: 1025px) {
    .nw-slider--item.pr-slider .pull-controls {
        display: none
    }
}

@media all and (min-width: 1026px) {
    .nw-slider--item.pr-slider .item {
        padding-top: 0
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item.simple-slider .bx-pager {
        margin: 0
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item.simple-slider.txt-slider:not(.pr-slider) .t-cell.txt {
        margin-bottom: 40px
    }
}

@media all and (max-width: 768px) {
    .nw-slider--item .t-cell .alt-view p {
        padding: 0 20px
    }
}

@media all and (max-width: 768px) {
    .nw-slider--item .pr-slider-holder {
        max-width: 100%;
        width: 100%
    }
}

.nw-slider--item .t-cell {
    vertical-align: middle
}

.nw-slider--item .text-item {
    margin-bottom: 45px
}

@media all and (max-width: 768px) {
    .nw-slider--item .text-item {
        margin-bottom: 25px
    }
}

@media all and (max-width: 768px) {
    .nw-slider--item .text-item {
        padding-right: 10px
    }
}

.nw-slider--item .text-item .title {
    font-size: 25px;
    color: #009ddc;
    line-height: 1.1;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin-bottom: 12px
}

@media all and (max-width: 768px) {
    .nw-slider--item .text-item .title {
        text-align: left
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item .text-item .title {
        font-size: 17px
    }
}

.nw-slider--item .text-item p {
    font-size: 17px;
    : roboto-regular-webfont, Arial, Helvetica, Sans-Serif;
    padding-right: 0
}

.nw-slider--item .text-item p strong {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

@media all and (max-width: 768px) {
    .nw-slider--item .text-item p {
        text-align: left
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item .text-item p {
        font-size: 13px
    }
}

@media all and (min-width: 769px) {
    .nw-slider--item .tl-left .text-item .title {
        text-align: left
    }

    .nw-slider--item .tl-right .text-item .title, .nw-slider--item .tl-right .text-item p {
        text-align: right
    }

    .nw-slider--item .tl-center .text-item {
        margin: 0 auto 45px
    }

    .nw-slider--item .tl-center .text-item .title, .nw-slider--item .tl-center .text-item p {
        text-align: left
    }
}

@media all and (min-width: 1025px) {
    .nw-slider--item .tl-center .text-item {
        max-width: 270px
    }
}

@media all and (max-width: 768px) {
    .sp-section .sec-ttl .descr {
        padding: 0 20px
    }
}

.slider--h-text__item {
    font-size: 45px;
    color: #009ddc;
    line-height: 1.1;
    margin-bottom: 25px;
    : roboto-light-webfont, Arial, Helvetica, sans-serif
}

.slider--h-text__item strong {
    : roboto-medium-webfont, Arial, Helvetica, sans-serif
}

@media all and (min-width: 1026px) {
    .seo-pr--slider .t-cell.visual img {
        max-width: inherit
    }
}

.seo-pr--slider .pr-slider-pager a svg {
    width: 42px;
    height: 42px
}

.seo-pr--slider .pr-slider-pager a.active svg {
    stroke: #fff
}

.seo-pr--slider .pr-slider-pager a:nth-child(1) {
    stroke: #009DDC
}

.seo-pr--slider .pr-slider-pager a:nth-child(2) {
    stroke: #9AC91A
}

.seo-pr--slider .pr-slider-pager a:nth-child(3) {
    stroke: #F7A53C
}

.seo-pr--slider .pr-slider-pager a:nth-child(4) {
    stroke: #9D4F98
}

.seo-pr--slider .pr-slider-pager a:nth-child(5) {
    stroke: #4DCCD1
}

@media all and (max-width: 768px) {
    .seo-pr--slider .t-holder {
        display: flex;
        flex-wrap: wrap;
        padding: 0 40px
    }

    .seo-pr--slider .t-holder .t-cell {
        width: 100%
    }

    .seo-pr--slider .t-holder .t-cell.txt {
        order: 1;
        width: 100%
    }

    .seo-pr--slider .t-holder .t-cell.visual {
        width: 100%;
        order: 2;
        display: flex;
        flex-direction: column-reverse
    }

    .seo-pr--slider .t-holder .t-cell.visual .text-list {
        margin-right: auto;
        width: 50%
    }
}

@media all and (max-width: 646px) {
    .seo-pr--slider .t-holder .t-cell.visual {
        width: 100%;
        order: 2;
        display: flex;
        flex-direction: column-reverse
    }

    .seo-pr--slider .t-holder .t-cell.visual .text-list {
        width: 100%;
        margin-right: 0
    }
}

.seo-pr--slider .seo-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 187px;
    height: 345px;
    left: 46px;
    top: -114px;
    transition: all .35s linear;
    z-index: 1
}

.seo-pr--slider .seo-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 284px;
    height: 317px;
    transition: all .35s linear .3s;
    top: -155px;
    z-index: 3;
    left: 9px
}

.seo-pr--slider .seo-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 187px;
    height: 345px;
    left: -50px;
    top: -31px;
    z-index: 4;
    transition: all .35s linear .7s
}

.seo-pr--slider .seo-pr-anim204 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 211px;
    height: 345px;
    top: -41px;
    left: -33px;
    z-index: 5;
    transition: all .35s linear .9s
}

.seo-pr--slider .seo-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 207px;
    height: 321px;
    left: 30px;
    top: -200px;
    transition: all .35s linear;
    z-index: 1
}

.seo-pr--slider .seo-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 271px;
    height: 233px;
    transition: all .35s linear .3s;
    top: -98px;
    left: -71px;
    z-index: 3
}

.seo-pr--slider .seo-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 102px;
    height: 96px;
    left: -22px;
    top: 23px;
    z-index: 4;
    transition: all .35s linear .7s
}

.seo-pr--slider .seo-pr-anim304 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 53px;
    height: 101px;
    top: 4px;
    left: -89px;
    z-index: 5;
    transition: all .35s linear .9s
}

.seo-pr--slider .seo-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 159px;
    height: 219px;
    left: 100px;
    top: -145px;
    transition: all .35s linear;
    z-index: 1
}

.seo-pr--slider .seo-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 168px;
    height: 243px;
    transition: all .35s linear .3s;
    top: -110px;
    left: -30px;
    z-index: 3
}

.seo-pr--slider .seo-pr-anim403 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 86px;
    height: 116px;
    left: -71px;
    top: -14px;
    z-index: 4;
    transition: all .35s linear .7s
}

.seo-pr--slider .seo-pr-anim501 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 251px;
    height: 294px;
    left: 13px;
    top: -149px;
    transition: all .35s linear;
    z-index: 1
}

.seo-pr--slider .seo-pr-anim502 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 125px;
    height: 294px;
    transition: all .35s linear .3s;
    top: -12px;
    left: 81px;
    z-index: 3
}

.seo-pr--slider .seo-pr-anim503 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 145px;
    height: 182px;
    left: -85px;
    top: -14px;
    z-index: 4;
    transition: all .35s linear .7s
}

.seo-pr--slider .t-cell.txt {
    width: 28%;
    vertical-align: top;
    padding-top: 0;
    padding-bottom: 0
}

@media all and (max-width: 1170px) {
    .seo-pr--slider .t-cell.txt {
        padding: 0
    }
}

.seo-pr--slider .t-cell.txt .text-list:after {
    content: '';
    display: block;
    clear: both
}

.seo-pr--slider .t-cell.visual {
    width: 44%
}

@media all and (min-width: 769px) and (max-width: 1170px) {
    .seo-pr--slider .t-cell.visual {
        padding: 0 15px;
        width: 38%
    }
}

.seo-pr--slider .pr-slider-pager {
    table-layout: fixed
}

.seo-pr--slider .pr-slider-pager > a {
    width: 100%
}

.seo-pr--slider .subheader-text {
    text-align: center;
    opacity: 0;
    transition: transform .3s ease-out, opacity .6s ease-out;
    transform: translateX(150px)
}

@media all and (min-width: 1171px) {
    .seo-pr--slider .subheader-text {
        padding: 48px 0 40px;
        margin-bottom: 60px
    }
}

@media all and (min-width: 1026px) and (max-width: 1170px) {
    .seo-pr--slider .subheader-text {
        padding: 48px 0 40px;
        margin-bottom: 90px
    }
}

@media all and (max-width: 646px) {
    .seo-pr--slider .subheader-text .sub-title {
        text-align: center;
        margin-bottom: 0
    }
}

.seo-pr--slider .subheader-text .sub-descr {
    color: #009ddc;
    font-size: 24px;
    text-align: center;
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

@media all and (min-width: 646px) {
    .seo-pr--slider .subheader-text .sub-descr {
        padding: 0 20px
    }
}

@media all and (max-width: 1025px) {
    .seo-pr--slider .subheader-text .sub-descr {
        padding: 10px 40px 30px;
        margin-bottom: 30px;
        position: relative
    }

    .seo-pr--slider .subheader-text .sub-descr br {
        display: none
    }
}

@media all and (max-width: 767px) {
    .seo-pr--slider .subheader-text .sub-descr {
        text-align: left;
        padding: 0 10px
    }
}

@media all and (min-width: 769px) {
    .seo-pr--slider .subheader-text .sub-descr:after {
        content: '';
        position: absolute;
        height: 1px;
        bottom: 0;
        display: block;
        background: #d9dadb;
        left: 50%;
        transform: translateX(-50%);
        width: 50%;
        max-width: 230px
    }
}

@media all and (max-width: 646px) {
    .seo-pr--slider .subheader-text .sub-descr {
        padding: 10px 20px 30px;
        margin-bottom: 0;
        font-size: 17px
    }

    .seo-pr--slider .subheader-text .sub-descr:after {
        content: none
    }
}

.simple-slider.fade .current .subheader-text {
    opacity: 1;
    transform: translateX(0);
    transition: transform .3s ease-out, opacity .2s ease-out
}

@media all and (min-width: 1026px) {
    .pr-slider.nw-slider--item.simple-slider.col-2 .t-cell.txt {
        padding-right: 0;
        width: 42%
    }
}

@media all and (min-width: 1025px) {
    .pr-slider.nw-slider--item.simple-slider.col-2 .t-holder {
        margin-bottom: 80px
    }
}

.simple-slider.nw-cs--slider {
    margin: 0 auto;
    width: 100%
}

@media all and (max-width: 980px) {
    .simple-slider.nw-cs--slider.ba-slider .pull-controls {
        display: block
    }

    .simple-slider.nw-cs--slider.ba-slider .pull-controls .pull {
        transform: scale(.7)
    }

    .simple-slider.nw-cs--slider.ba-slider .pull-controls .pull.left {
        left: 0
    }

    .simple-slider.nw-cs--slider.ba-slider .pull-controls .pull.right {
        right: 0
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider.ba-slider .pull-controls {
        display: none
    }
}

@media only screen and (max-width: 1025px) {
    .simple-slider.nw-cs--slider.ba-slider .pull-controls .pull {
        top: 0
    }
}

@media only screen and (max-width: 1025px) {
    .simple-slider.nw-cs--slider .smm-spr1 {
        transform: scale(.65)
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider .smm-spr1 {
        transform: scale(.5)
    }
}

@media only screen and (max-width: 481px) {
    .simple-slider.nw-cs--slider .smm-spr1 {
        transform: scale(.4);
        margin: 0 -24px 0 -20px
    }
}

.simple-slider.nw-cs--slider .ba-slider-holder {
    padding-bottom: 40px
}

@media only screen and (max-width: 1025px) {
    .simple-slider.nw-cs--slider .ba-slider-holder {
        padding-bottom: 60px
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider .ba-slider-holder {
        padding-bottom: 35px
    }
}

@media all and (max-width: 1170px) {
    .simple-slider.nw-cs--slider .ba-slider-holder {
        max-width: 85%
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider .ba-slider-holder {
        max-width: 100%
    }
}

.simple-slider.nw-cs--slider .ba-slider-holder .t-holder {
    max-width: 100%;
    width: 100%
}

@media only screen and (min-width: 1026px) {
    .simple-slider.nw-cs--slider .t-holder {
        padding: 0 60px
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider .t-holder {
        padding: 0
    }
}

.simple-slider.nw-cs--slider .t-cell {
    height: auto
}

.simple-slider.nw-cs--slider .t-cell.txt {
    text-align: left;
    width: 41%;
    font-size: 23px
}

@media only screen and (max-width: 768px) {
    .simple-slider.nw-cs--slider .t-cell.txt {
        width: 100%;
        text-align: center;
        font-size: 22px;
        padding: 0
    }
}

@media only screen and (max-width: 646px) {
    .simple-slider.nw-cs--slider .t-cell.txt {
        font-size: 17px;
        margin-bottom: 25px
    }
}

.simple-slider.nw-cs--slider .t-cell.visual {
    width: 59%;
    text-align: left;
    padding-left: 10%
}

.simple-slider.nw-cs--slider .t-cell.visual img {
    max-width: 100%;
    height: auto
}

@media only screen and (max-width: 768px) {
    .simple-slider.nw-cs--slider .t-cell.visual {
        width: 100%;
        text-align: center
    }
}

.simple-slider.nw-cs--slider .pull-controls {
    position: absolute;
    top: 50%
}

.nw--ar-nav a {
    position: absolute;
    top: 34px;
    bottom: auto;
    width: 42px;
    height: 61px;
    transform: scale(1);
    z-index: 51
}

@media only screen and (max-width: 1025px) {
    .nw--ar-nav a {
        transform: scale(.7)
    }
}

@media only screen and (max-width: 737px) {
    .nw--ar-nav a {
        transform: scale(.5)
    }
}

.nw--ar-nav.center a {
    top: 50%;
    transform: translateY(-50%) scale(1)
}

@media only screen and (max-width: 1025px) {
    .nw--ar-nav.center a {
        transform: translateY(-50%) scale(.7)
    }
}

@media only screen and (max-width: 737px) {
    .nw--ar-nav.center a {
        transform: translateY(-50%) scale(.5)
    }
}

.nw--ar-nav.nw--ar-prev a {
    background: url("../image/tzz_ion-1.svg") 0 50% no-repeat;
    left: 0
}

@media only screen and (max-width: 530px) {
    .nw--ar-nav.nw--ar-prev.card-slider__pager-prev a {
        left: -20px
    }
}

.nw--ar-nav.nw--ar-next a {
    background: url("../image/tzz_ion-1.svg") 100% 50% no-repeat;
    right: 0
}

@media only screen and (max-width: 530px) {
    .nw--ar-nav.nw--ar-next.card-slider__pager-next a {
        right: -20px
    }
}

.nw-cs--pager {
    display: flex;
    justify-content: center;
    margin-top: 26px
}

.nw-cs--pager .bx-pager-item:not(:last-child) {
    margin-right: 25px
}

.nw-cs--pager .bx-pager-link {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #dedede;
    border-radius: 50%;
    position: relative;
    font-size: 0;
    line-height: 0;
    transition: all .3s linear
}

.nw-cs--pager .bx-pager-link:after {
    content: "";
    background: #fff;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: width .5s ease-out, height .5s ease-out;
    border-radius: 50%
}

.nw-cs--pager .bx-pager-link.active {
    border-color: #90c404
}

.nw-cs--pager .bx-pager-link.active:after {
    background: #90c404;
    width: 8px;
    height: 8px
}

.ta {
    text-align: center
}

@media all and (min-width: 1025px) {
    .nw--pr-sl-anim.pr-slider .t-cell.visual .wide-mode {
        top: 0;
        left: 50px
    }
}

@media all and (min-width: 1025px) and (max-width: 1170px) {
    .nw--pr-col-2 .pr-cell--sc {
        transform: scale(.7)
    }
}

@media all and (min-width: 1025px) {
    .nw--smm-item.slide01 {
        padding-bottom: 50px
    }
}

@media all and (min-width: 1025px) {
    .nw--sms-pr-slider .slide04 {
        padding-bottom: 50px
    }
}

@media all and (min-width: 1025px) {
    .nw--sms-pr-slider .slide05 {
        padding-top: 90px
    }
}

@media all and (min-width: 1025px) {
    .nw--pr-sl-anim.pr-slider .t-cell.visual .wide-mode {
        top: 0;
        left: 50px
    }
}

@media all and (min-width: 1025px) and (max-width: 1170px) {
    .nw--pr-col-2 .pr-cell--sc {
        transform: scale(.7)
    }
}

@media all and (min-width: 1025px) {
    .nw--smm-item.slide01 {
        padding-bottom: 50px
    }
}

@media all and (min-width: 1025px) {
    .nw--sms-pr-slider .slide04 {
        padding-bottom: 50px
    }
}

.dmp-pr-anim101 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 246px;
    left: -149px;
    top: -128px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.dmp-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 255px;
    height: 335px;
    left: -12px;
    top: -11px;
    z-index: 4;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.dmp-pr-anim103 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 345px;
    height: 422px;
    left: -224px;
    top: -69px;
    z-index: 5;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.dmp-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 223px;
    height: 339px;
    left: 132px;
    top: -232px;
    z-index: 5;
    transition: all .35s linear .3s;
    transform: translateX(50px)
}

.dmp-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 260px;
    height: 344px;
    left: 49px;
    top: -191px;
    z-index: 5;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.dmp-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 258px;
    height: 266px;
    left: -21px;
    top: -141px;
    z-index: 5;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.dmp-pr-anim204 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 215px;
    height: 213px;
    left: -55px;
    top: -96px;
    z-index: 5;
    transition: all .35s linear 1.2s;
    transform: translateY(50px)
}

.dmp-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 236px;
    height: 364px;
    left: 160px;
    top: -245px;
    z-index: 5;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.dmp-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 328px;
    height: 231px;
    left: -101px;
    top: -106px;
    z-index: 5;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.dmp-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 181px;
    height: 190px;
    left: 112px;
    top: -5px;
    z-index: 5;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.current .dmp-pr-anim101, .current .dmp-pr-anim102 {
    transform: translateY(0)
}

.current .dmp-pr-anim103, .current .dmp-pr-anim201, .current .dmp-pr-anim202 {
    transform: translateX(0)
}

.current .dmp-pr-anim203, .current .dmp-pr-anim204, .current .dmp-pr-anim301, .current .dmp-pr-anim302 {
    transform: translateY(0)
}

.current .dmp-pr-anim303 {
    transform: translateX(0)
}

.wdd-pr-anim101 {
    background: url("../image/wdd-102.png") no-repeat;
    width: 250px;
    height: 363px;
    top: -250px;
    left: 139px;
    z-index: 5;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.wdd-pr-anim102 {
    background: url("../image/wdd-103.png") no-repeat;
    width: 139px;
    height: 307px;
    left: 199px;
    top: -118px;
    z-index: 5;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.wdd-pr-anim103 {
    background: url("../image/wdd-104.png") no-repeat;
    width: 98px;
    height: 223px;
    left: 90px;
    top: -145px;
    z-index: 5;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.wdd-pr-anim201 {
    background: url("../image/wdd-202.png") no-repeat;
    width: 139px;
    height: 307px;
    left: 166px;
    top: 13px;
    z-index: 5;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.wdd-pr-anim202 {
    background: url("../image/wdd-203.png") no-repeat;
    width: 146px;
    height: 199px;
    left: -100px;
    top: 10px;
    z-index: 5;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.current .wdd-pr-anim101, .current .wdd-pr-anim102 {
    transform: translateY(0)
}

.current .wdd-pr-anim103 {
    transform: translateX(0)
}

.current .wdd-pr-anim201 {
    transform: translateY(0)
}

.current .wdd-pr-anim202 {
    transform: translateX(0)
}

.nw__mob-menu--wrp.mm-menu {
    width: 100%;
    background: 0 0
}

.nw__mob-menu--wrp.mm-menu.mm-opened {
    z-index: 2
}

.nw__mob-menu--wrp .menu-title {
    width: 260px;
    opacity: 0;
    transition: opacity .5s ease
}

.nw__mob-menu--wrp .mob-menus {
    width: 260px
}

.nw__mob-menu--wrp .mob-menus .sub {
    padding: 28px 15px 28px 0;
    background: #018fcf
}

.nw__mob-menu--wrp .mob-menus .sub:after {
    content: none
}

.nw__mob-menu--wrp .mob-menus .sub > li {
    position: relative;
    padding: 0 0 2px
}

.nw__mob-menu--wrp .mob-menus .sub > li > a {
    font-size: 18px;
    line-height: 1.1;
    font-weight: 700;
    border-radius: 0;
    text-transform: none;
    border: none;
    background: #009ddc;
    box-shadow: none;
    padding: 17px
}

@media all and (min-width: 1026px) {
    .nw__mob-menu--wrp .mob-menus .sub > li > a {
        font-size: 18px
    }
}

.nw__mob-menu--wrp .mob-menus .sub > li > a:before {
    content: none
}

.nw__mob-menu--wrp .mob-menus .sub > li:last-child > a {
    border-radius: 0 0 4px
}

.nw__mob-menu--wrp .mob-menus .sub > li:first-child > a {
    border-radius: 0 4px 0 0
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open > a {
    background: #252525;
    position: relative;
    overflow: visible;
    color: #018fcf;
    border-radius: 0
}

@media all and (min-width: 1026px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open > a:after {
        content: '';
        position: absolute;
        right: -18px;
        background: #252525;
        height: 100%;
        width: 18px;
        top: 0
    }
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel {
    position: absolute;
    margin-bottom: 0;
    right: -500px;
    margin-top: 0;
    top: 0;
    background: #252525;
    padding: 25px 30px 0 25px;
    width: 485px;
    overflow: hidden
}

@media all and (max-width: 1025px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel {
        position: static;
        width: 100%;
        padding: 0 20px 25px
    }
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li {
    min-width: auto;
    position: relative;
    z-index: 2;
    margin: 0 15px 35px 0;
    background: #2F2F2F;
    width: calc(50% - 8px);
    float: left
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li:nth-child(even) {
    margin-right: 0
}

@media all and (max-width: 1025px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li {
        float: none;
        width: 100%;
        margin: 0 0 9px
    }
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li a {
    padding: 0;
    border: none;
    height: 100%;
    overflow: hidden;
    transition: none
}

@media all and (max-width: 1025px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li a {
        display: flex;
        justify-content: center;
        align-items: center;
        height: auto;
        padding: 17px 0
    }
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li a img {
    opacity: .2;
    transition: all .4s ease;
    position: relative;
    z-index: 3;
    transform: scale(.75) translateY(20px)
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li:before {
    width: 2px;
    height: 100%;
    content: '';
    bottom: 0;
    left: 0;
    position: absolute;
    background: #009ddc;
    z-index: 3
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li:after {
    content: '';
    position: absolute;
    width: 100%;
    z-index: -1;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transform: scaleY(0);
    transform-origin: 0 100%;
    transition: transform .4s;
    background: #fff
}

.nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li .nw-menu-text {
    position: absolute;
    bottom: 25px;
    width: 100%;
    padding: 0 20px;
    color: #fff;
    text-align: left;
    font-weight: 700;
    font-size: 17px;
    left: 0;
    z-index: 3;
    : roboto-bold-webfont
}

@media all and (max-width: 1025px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li .nw-menu-text {
        position: static
    }
}

@media all and (min-width: 1026px) {
    .nw__mob-menu--wrp .mob-menus .sub .drop-open .mobnav-sublevel li:hover a {
        height: 100%
    }
}

.mob-menus {
    opacity: 0;
    transition: opacity .5s ease, transform .5s ease
}

html.mm-opening {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

html.mm-opening .mob-menus {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

html.mm-opening .menu-title {
    opacity: 1
}

html.mm-opening #mm-blocker, html.mm-opening .mm-page {
    left: 325px !important
}

html.mm-opening #mm-blocker {
    z-index: 1
}

html.mm-opening {
    position: relative;
    z-index: 3
}

.mm-page {
    z-index: 1
}

#mm-blocker {
    position: relative;
    z-index: 1
}

.nw__mob-menu--wrp.mm-opened .mm-inner {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow-y: scroll
}

.nw__mob-menu--wrp .mob-menus {
    box-shadow: 11px 0 16px -15px rgba(0, 0, 0, .8);
    min-height: 90%
}

.nw__mob-menu--wrp .mob-menus > ul:not(.secondary-menu) {
    border-bottom: 1px solid #d3d3d3;
    padding-bottom: 13px
}

.nw__mob-menu--wrp .mob-menus > ul > li {
    border-bottom: none
}

.nw__mob-menu--wrp .mob-menus > ul > li.drop-open > a {
    color: #018fcf
}

.nw-icon {
    width: 55px;
    height: 55px;
    fill: #fff
}

.breadcrumbs {
    font: 14px roboto-light-webfont, sans-serif;
    position: relative;
    top: 55px;
    color: #fff;
    padding-right: 50%;
    white-space: nowrap
}

.breadcrumbs li {
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 85%
}

.breadcrumbs a {
    margin: 0 20px 0 0;
    color: #fff;
    font: 15px roboto-medium-webfont, sans-serif;
    text-transform: capitalize
}

.breadcrumbs a:hover {
    color: #fff
}

.breadcrumbs a:after {
    border-color: #fff;
    width: 5px;
    height: 5px;
    border-width: 2px 2px 0 0
}

.tech-item .tech-item--inner {
    position: relative;
    border: 1px solid #dfdfdf;
    border-radius: 6px;
    padding: 55px 128px 70px 93px
}

.tech-item .tech-item--inner:after {
    content: '';
    top: -39px;
    width: 78px;
    height: 78px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%)
}

@media all and (max-width: 1025px) {
    .tech-item .tech-item--inner {
        padding: 45px 30px 30px
    }
}

@media all and (max-width: 646px) {
    .tech-item .tech-item--inner {
        padding: 25px 20px 20px
    }
}

.tech-item.kt .tech-item--inner:after {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.tech-item.kt .tech-item--inner .text {
    max-width: 652px
}

.tech-item.gt .tech-item--inner:after {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.tech-item.ti .tech-item--inner:after {
    background: url("../image/tzz_ion-1.png") no-repeat
}

.tech-item:not(:last-child) {
    margin-bottom: 65px
}

.tech-item .title {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 45px;
    color: #0078ae;
    font-weight: 700;
    margin-bottom: 10px;
    text-align: center
}

@media all and (max-width: 1025px) {
    .tech-item .title {
        font-size: 32px
    }
}

.tech-item .text {
    max-width: 780px;
    text-align: center;
    font-size: 20px;
    : roboto-light-webfont, Arial, Helvetica, sans-serif;
    margin: 0 auto 35px;
    line-height: 1.6
}

@media all and (max-width: 1025px) {
    .tech-item .text {
        font-size: 16px
    }
}

.opp-item {
    : roboto-light-webfont, Arial, Helvetica, sans-serif;
    font-size: 17px;
    line-height: 1.5;
    padding-left: 48px;
    position: relative
}

.opp-item:before {
    content: '';
    position: absolute;
    top: 6px;
    width: 29px;
    height: 29px;
    left: 0;
    background: url("../image/tzz_ion-1.png") no-repeat
}

@media all and (max-width: 646px) {
    .opp-item:before {
        width: 16px;
        height: 16px;
        background-size: cover
    }
}

@media all and (max-width: 1025px) {
    .opp-item {
        padding-left: 25px
    }
}

.opp-item:not(:last-child) {
    margin-bottom: 35px
}

.opp-item strong {
    font-size: 20px;
    color: #80ae05;
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    font-weight: 700
}

@media all and (max-width: 1201px) {
    .tech-list {
        margin: 0 20px
    }
}

.nw--count__list {
    flex-wrap: wrap
}

@media all and (max-width: 646px) {
    .nw--count__list.units-3 .nw--count__item {
        width: 100%
    }
}

.nw--count__item {
    flex: 1
}

@media all and (max-width: 737px) {
    .nw--count__item {
        flex: 1 0 auto;
        width: 50%;
        margin-bottom: 15px
    }

    .nw--count__item br {
        display: none
    }
}

@media all and (max-width: 1025px) {
    .nw--count__item .cnt--amount {
        font-size: 34px
    }
}

@media all and (max-width: 646px) {
    .nw--count__item .cnt-info span br {
        display: none
    }
}

@media all and (max-width: 1025px) {
    .nw--count__item .cnt-info {
        font-size: 15px
    }
}

@media all and (max-width: 1025px) {
    .nw--case-std__list {
        padding: 0 40px
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__list {
        padding: 0
    }
}

@media all and (max-width: 768px) {
    .nw--case-std__item {
        margin-bottom: 65px
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__item {
        flex-direction: column-reverse;
        margin-bottom: 45px
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__item.revert {
        flex-direction: column-reverse
    }
}

@media all and (min-width: 647px) {
    .nw--case-std__item.revert .col-left {
        padding-right: 0
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__item .col-left, .nw--case-std__item .col-right {
        width: 100%
    }
}

@media all and (min-width: 647px) {
    .nw--case-std__item .col-left {
        padding-right: 55px
    }
}

@media all and (min-width: 647px) {
    .nw--case-std__item .col-right {
        padding-right: 35px
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__item .img-wrp {
        max-width: 155px;
        display: block
    }
}

@media all and (max-width: 1025px) {
    .nw--case-std__descr {
        font-size: 18px;
        line-height: 24px
    }
}

.top-banner {
    min-height: 433px;
    padding: 85px 0;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    display: flex;
    align-items: center;
    background-color: #292d30
}

.top-banner .link-arrow:before {
    background: #46484c
}

@media all and (min-width: 2160px) {
    .top-banner {
        min-height: 545px
    }
}

@media all and (max-width: 1024px) {
    .top-banner {
        min-height: 292px;
        padding: 50px 0 70px
    }
}

@media all and (max-width: 646px) {
    .top-banner {
        min-height: 282px;
        padding: 40px 0 60px
    }
}

@media all and (min-width: 1025px) {
    .top-banner.content-marketing {
        background-image: url("../images/new-pages-redesign/content-marketing/header/banner-d.jpg")
    }
}

@media all and (min-width: 1025px) and (min-width: 2160px) {
    .top-banner.content-marketing {
        background-image: url("../images/new-pages-redesign/content-marketing/header/banner-b-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.content-marketing {
        background-image: url("../images/new-pages-redesign/content-marketing/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.content-marketing {
        background-image: url("../images/new-pages-redesign/content-marketing/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.smm {
        background-image: url("../images/new-pages-redesign/smm-page/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.smm {
        background-image: url("../images/new-pages-redesign/smm-page/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.smm {
        background-image: url("../images/new-pages-redesign/smm-page/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.smm {
        background-image: url("../images/new-pages-redesign/smm-page/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.dpr-page {
        background-image: url("../images/new-pages-redesign/digital-pr/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.dpr-page {
        background-image: url("../images/new-pages-redesign/digital-pr/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.dpr-page {
        background-image: url("../images/new-pages-redesign/digital-pr/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.dpr-page {
        background-image: url("../images/new-pages-redesign/digital-pr/header/banner-m.jpg")
    }
}

.top-banner.top-digital {
    background-position: 50% 0
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.top-digital {
        background-image: url("../images/new-pages-redesign/top-digital/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.top-digital {
        background-image: url("../images/new-pages-redesign/top-digital/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.top-digital {
        background-image: url("../images/new-pages-redesign/top-digital/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.marketing-strategy {
        background-image: url("../images/new-pages-redesign/marketing-strategy/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.marketing-strategy {
        background-image: url("../images/new-pages-redesign/marketing-strategy/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.marketing-strategy {
        background-image: url("../images/new-pages-redesign/marketing-strategy/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.marketing-strategy {
        background-image: url("../images/new-pages-redesign/marketing-strategy/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.cro-page {
        background-image: url("../images/new-pages-redesign/cro/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.cro-page {
        background-image: url("../images/new-pages-redesign/cro/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.cro-page {
        background-image: url("../images/new-pages-redesign/cro/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.cro-page {
        background-image: url("../images/new-pages-redesign/cro/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.paid-media {
        background-image: url("../images/new-pages-redesign/pmp-page/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.paid-media {
        background-image: url("../images/new-pages-redesign/pmp-page/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.paid-media {
        background-image: url("../images/new-pages-redesign/pmp-page/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.paid-media {
        background-image: url("../images/new-pages-redesign/pmp-page/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.seo-page {
        background-image: url("../images/new-pages-redesign/seo-page/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.seo-page {
        background-image: url("../images/new-pages-redesign/seo-page/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.seo-page {
        background-image: url("../images/new-pages-redesign/seo-page/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.seo-page {
        background-image: url("../images/new-pages-redesign/seo-page/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.email-marketing {
        background-image: url("../images/new-pages-redesign/email-marketing/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.email-marketing {
        background-image: url("../images/new-pages-redesign/email-marketing/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.email-marketing {
        background-image: url("../images/new-pages-redesign/email-marketing/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.email-marketing {
        background-image: url("../images/new-pages-redesign/email-marketing/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.join-our-team {
        background-image: url("../images/new-pages-redesign/join-our-team/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.join-our-team {
        background-image: url("../images/new-pages-redesign/join-our-team/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.join-our-team {
        background-image: url("../images/new-pages-redesign/join-our-team/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.join-our-team {
        background-image: url("../images/new-pages-redesign/join-our-team/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.cs--service-king {
        background-image: url("../images/new-pages-redesign/case-studies/service-king/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.cs--service-king {
        background-image: url("../images/new-pages-redesign/case-studies/service-king/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.cs--service-king {
        background-image: url("../images/new-pages-redesign/case-studies/service-king/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.cs--service-king {
        background-image: url("../images/new-pages-redesign/case-studies/service-king/header/banner-m.jpg")
    }
}

@media all and (min-width: 2160px) {
    .top-banner.cs--luxor {
        background-image: url("../images/new-pages-redesign/case-studies/luxor/header/banner-b-d.jpg")
    }
}

@media all and (min-width: 1025px) and (max-width: 2159px) {
    .top-banner.cs--luxor {
        background-image: url("../images/new-pages-redesign/case-studies/luxor/header/banner-d.jpg")
    }
}

@media all and (max-width: 1024px) {
    .top-banner.cs--luxor {
        background-image: url("../images/new-pages-redesign/case-studies/luxor/header/banner-t.jpg")
    }
}

@media all and (max-width: 646px) {
    .top-banner.cs--luxor {
        background-image: url("../images/new-pages-redesign/case-studies/luxor/header/banner-m.jpg")
    }
}

.top-banner__inner {
    max-width: 1582px;
    margin: 0 auto
}

@media all and (max-width: 1600px) {
    .top-banner__inner {
        padding: 0 4.7vw
    }
}

@media (max-width: 1300px) and (min-width: 1026px) {
    .top-banner__inner {
        padding: 0 3.5vw
    }
}

.top-banner__anchor {
    position: absolute;
    bottom: -35px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, .08);
    z-index: 20;
    background: #fff
}

.top-banner__anchor:hover .scroll-arrow {
    transform: translate(0, 3px)
}

.top-banner__title {
    font: 80px/1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #fff;
    margin-bottom: 26px;
    text-align: center
}

.top-banner__title span {
    : roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    line-height: 1.4
}

@media all and (max-width: 1366px) {
    .top-banner__title {
        font-size: 54px
    }
}

@media all and (max-width: 1025px) {
    .top-banner__title.img img {
        max-width: 170px
    }
}

@media all and (max-width: 737px) {
    .top-banner__title {
        font-size: 34px
    }

    .top-banner__title.img img {
        max-width: 130px
    }
}

.top-banner__buttons-wrp {
    text-align: center
}

.top-banner__descr {
    font: 24px/1.4 roboto-regular-webfont, Arial, Helvetica, sans-serif;
    color: #fff;
    text-align: center;
    letter-spacing: -.5px
}

.top-banner__descr strong {
    : roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

@media all and (max-width: 1366px) {
    .top-banner__descr {
        font-size: 20px
    }
}

@media all and (max-width: 1026px) {
    .top-banner__descr {
        font-size: 17px
    }
}

@media all and (max-width: 737px) {
    .top-banner__descr {
        font-size: 13px
    }

    .top-banner__descr br {
        display: none
    }
}

@media all and (max-width: 1170px) {
    .ba-slider .pull-controls, .pr-slider .pull-controls, .slider-section .mix-slider .pull-controls {
        width: 98%;
        margin: 0 1%
    }
}

.top-banner__cite-container {
    text-align: center;
    margin-bottom: 28px;
    color: #fff
}

.top-banner__cite-container blockquote {
    font: 35px/1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

.top-banner__cite-container strong {
    font: 20px/1.5 roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

@media all and (max-width: 1025px) {
    .top-banner__cite-container blockquote {
        font-size: 24px
    }
}

@media all and (max-width: 737px) {
    .top-banner__cite-container blockquote {
        font-size: 18px
    }
}

.top-banner__sub-descr {
    text-align: center;
    color: #fff;
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, sans-serif
}

.top-banner__sub-descr.sk-sub {
    font: 24px/35px roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1025px) {
    .top-banner__sub-descr {
        font-size: 14px
    }

    .top-banner__sub-descr.sk-sub {
        font: 14px/1.5 roboto-light-webfont, Arial, Helvetica, sans-serif
    }

    .top-banner__sub-descr br {
        display: none
    }
}

.lead-wrap .de-blog-title a {
    color: #0078ae;
    transition: color .4s
}

.lead-wrap .de-blog-title a:hover {
    color: #009ddc
}

.lead-wrap .de-blog-img {
    display: block;
    margin: 20px;
    position: relative;
    overflow: hidden;
    max-height: 50%
}

.lead-wrap .de-blog-img .overflow {
    display: block;
    box-sizing: border-box;
    transition: margin .4s linear
}

.lead-wrap .de-blog-img img {
    transition: all .4s linear;
    position: relative;
    max-height: 257px
}

.lead-wrap .de-blog-item {
    margin: 0 0 20px;
    border: 1px solid #d9dadb;
    position: relative;
    min-height: 0;
    transition: min-height .3s linear;
    height: 50%;
    display: flex;
    flex-direction: column
}

.lead-wrap .de-blog-item:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #009ddc;
    z-index: 2
}

.lead-wrap .de-blog-item:hover .overflow {
    margin: 0
}

.lead-wrap .de-text {
    position: relative;
    padding: 5px 20px 50px;
    flex-grow: 1
}

.lead-wrap .de-text-frame {
    padding: 0 24px;
    text-align: left;
    position: relative;
    overflow: hidden;
    z-index: 2
}

.lead-wrap .de-blog-title {
    font: 22px/30px roboto-bold-webfont, sans-serif;
    text-transform: capitalize;
    color: #0078ae
}

.lead-wrap .read-more-anim {
    display: none
}

.lead-wrap .lead-box {
    background-color: #fff;
    position: relative
}

@media only screen and (max-width: 1700px) {
    .lead-wrap .lead-box {
        padding: 0 10px
    }
}

.lead-wrap .lead-box img {
    display: block;
    width: 100%;
    transition: opacity .4s
}

.lead-wrap .lead-box .tag {
    font: 400 12px/11px Arial, sans-serif;
    color: #9a9a9a;
    text-transform: uppercase;
    margin: 0 0 8px;
    padding: 0 0 0 8px;
    border-left: solid 2px #0087bd
}

.lead-wrap .lead-box .frame {
    max-width: 1600px
}

.lead-wrap .lead-box .section-title h2 {
    color: #0078ae;
    font-size: 57px
}

.lead-wrap .lead-box .ttl {
    position: relative;
    margin: 7px 0 40px;
    letter-spacing: 0
}

.lead-wrap .lead-box .ttl .link-arrow {
    position: absolute;
    bottom: 0;
    right: 11px;
    margin: 0
}

.lead-wrap .lead-box .ttl:after {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 0;
    width: 100%;
    height: 5px;
    background: #e7e7e7
}

.lead-wrap .lead-box h3 {
    font: 40px/1 roboto-bold-webfont, sans-serif;
    color: #0078ae;
    display: inline-block;
    vertical-align: bottom;
    padding-right: 60px;
    letter-spacing: 0
}

.lead-wrap .lead-sections {
    display: table;
    width: 100%;
    table-layout: fixed
}

.lead-wrap .lead-col {
    width: 33.3%;
    display: table-cell;
    vertical-align: top;
    padding: 0 11px
}

.lead-wrap .lead-col .t-holder {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: 15px
}

.lead-wrap .lead-col .divider {
    display: none
}

.lead-wrap .lead-col .btn-raq {
    font-size: 17px;
    border-left: 0;
    transition: color .3s ease-out
}

.lead-wrap .lead-col .btn-raq:after {
    font-size: 28px
}

.lead-wrap .lead-col .btn-raq:hover, .lead-wrap .lead-col .btn-raq:hover:after {
    color: #0078ae !important
}

.lead-wrap .lead-col .shadow {
    position: relative;
    padding-bottom: 35px
}

.lead-wrap .lead-col .shadow:before {
    top: 100%;
    background-size: 130% 10px
}

@media only screen and (max-width: 1024px) {
    .lead-wrap .de-blog-img {
        margin: 10px
    }

    .lead-wrap .de-text {
        padding: 0 10px 40px
    }

    .lead-wrap .de-blog-title {
        line-height: 28px
    }

    .lead-wrap .de-text-frame {
        padding: 0 12px
    }

    .lead-wrap .lead-box h3 {
        font-size: 32px;
        padding-right: 30px
    }

    .lead-wrap .lead-box .frame {
        padding: 0 10px
    }

    .lead-wrap .lead-col {
        padding: 0 8px
    }
}

@media only screen and (max-width: 900px) {
    .lead-wrap .lead-box .section-title h2 {
        font-size: 45px
    }
}

@media only screen and (max-width: 800px) {
    .lead-wrap .de-blog-title {
        font-size: 20px
    }
}

@media only screen and (max-width: 768px) {
    .lead-wrap .lead-col .shadow {
        padding-bottom: 0
    }

    .lead-wrap .lead-col .shadow:before {
        display: none
    }

    .lead-wrap .lead-sections {
        display: block
    }

    .lead-wrap .lead-col {
        display: table;
        width: 100%;
        margin-bottom: 20px
    }

    .lead-wrap .lead-col:last-child {
        margin-bottom: 0
    }

    .lead-wrap .lead-col .t-holder {
        display: table;
        margin-bottom: 5px;
        table-layout: fixed
    }

    .lead-wrap .de-blog-item:first-child + .divider {
        display: table-cell;
        width: 2%
    }

    .lead-wrap .de-blog-item {
        display: table-cell;
        vertical-align: top;
        width: 48%;
        margin-bottom: 0
    }

    .lead-wrap .de-text {
        padding-bottom: 25px
    }
}

@media only screen and (max-width: 680px) {
    .lead-wrap .lead-col .t-holder {
        margin-bottom: 0
    }

    .lead-wrap .lead-col .btn-raq {
        font-size: 14px
    }

    .lead-wrap .lead-col .btn-raq:after {
        font-size: 22px;
        bottom: 1px
    }

    .lead-wrap .lead-box h3 {
        font-size: 22px
    }

    .lead-wrap .lead-box .section-title {
        margin-bottom: 30px
    }

    .lead-wrap .lead-box .section-title h2 {
        font-size: 30px
    }
}

@media only screen and (max-width: 646px) {
    .lead-wrap .lead-box img {
        margin-bottom: 0
    }

    .lead-wrap .de-text-frame {
        padding: 10px
    }
}

@media only screen and (max-width: 480px) {
    .lead-wrap .de-blog-item {
        display: block;
        margin-bottom: 15px
    }

    .lead-wrap .de-blog-item:first-child + .divider, .lead-wrap .lead-col .divider {
        display: none
    }

    .lead-wrap .de-blog-item {
        width: 100%
    }

    .lead-wrap .de-blog-title {
        font-size: 18px
    }

    .lead-wrap .de-text {
        padding-bottom: 10px
    }
}

@media only screen and (min-width: 850px) {
    .lead-wrap .de-blog-img .overflow {
        margin: -23px -23px 0
    }

    .lead-wrap .de-text {
        -webkit-transition: -webkit-transform .4s;
        transition: transform .4s
    }

    .lead-wrap .read-more-anim {
        display: block;
        width: 100%;
        height: 0;
        color: #fff;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 10;
        overflow: hidden;
        text-align: right;
        transition: height .4s
    }

    .lead-wrap .read-more-anim:hover {
        color: #fff
    }

    .lead-wrap .de-blog-item:hover .read-more-anim {
        height: 68px
    }

    .lead-wrap .read-more-anim:before {
        position: absolute;
        top: 100%;
        right: -4%;
        width: 222%;
        height: 61px;
        content: "";
        background: #009ddc;
        -webkit-transition: -webkit-transform .4s;
        transition: transform .4s;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        outline: transparent solid 1px
    }

    .lead-wrap .de-blog-item:hover .read-more-anim:before {
        -webkit-transform: rotate(-6deg);
        transform: rotate(-6deg)
    }

    .lead-wrap .read-more-anim span {
        position: absolute;
        right: 15px;
        bottom: 15px;
        z-index: 5;
        text-transform: uppercase;
        font: 14px/1 roboto-bold-webfont, sans-serif;
        display: inline-block
    }

    .lead-wrap .read-more-anim span:after {
        content: "Â»";
        padding-left: 5px;
        font-size: 24px;
        line-height: 1;
        position: relative;
        top: 2px
    }
}

@media only screen and (min-width: 850px) and (max-width: 1024px) {
    .lead-wrap .de-text {
        padding-bottom: 30px
    }

    .lead-wrap .read-more-anim span {
        bottom: 6px;
        right: 5px;
        font-size: 12px
    }
}

@keyframes head-anim-seo01 {
    0% {
        opacity: 1;
        transform: translate(-40px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-40px, 80px)
    }
}

@keyframes head-anim-seo02 {
    0% {
        opacity: 0;
        transform: translate(150px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(150px, 80px)
    }
}

@keyframes head-anim-seo03 {
    0% {
        opacity: 0;
        transform: translate(0, 36px)
    }
    100% {
        opacity: 1;
        transform: translate(0, 180px)
    }
}

.animated .head-anim-seo01 {
    animation: head-anim-seo01 1.8s forwards;
    z-index: 4
}

.animated .head-anim-seo02 {
    animation: head-anim-seo02 1.8s forwards;
    z-index: 2
}

.animated .head-anim-seo03 {
    animation: head-anim-seo03 1.8s forwards;
    z-index: 3
}

.nw-seo--wrp {
    background: #fff
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

@media all and (min-width: 1025px) {
    .nw-seo--wrp .simple-slider .t-cell.txt {
        padding: 40px 0 0
    }
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .simple-slider .t-cell.txt {
        padding: 0
    }
}

.nw-seo--wrp .seo-traffic-section {
    padding: 80px 0
}

@media all and (max-width: 767px) {
    .nw-seo--wrp .seo-traffic-section {
        padding-bottom: 40px
    }
}

.nw-seo--wrp .simple-slider p {
    padding-right: 0
}

.nw-seo--wrp .pr-slider p {
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

.nw-seo--wrp .pr-pager {
    margin: 0 auto 30px
}

.nw-seo--wrp .pr-slider .item {
    padding-top: 0
}

.nw-seo--wrp .seo-traffic-section {
    background: 0 0
}

@media all and (max-width: 1025px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section {
        margin-bottom: 60px;
        padding-top: 40px
    }
}

@media all and (min-width: 1026px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section {
        padding-top: 40px
    }
}

@media all and (max-width: 531px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section {
        margin-bottom: 0
    }
}

@media all and (min-width: 1026px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        background: url("../images/new-pages-redesign/seo-page/granite-bg.jpg") 50% 0 no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 1025px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        height: 510px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/tablet/granite-transformations_BG_tablet.jpg") center center/cover no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 768px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        height: 430px
    }
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        height: 430px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/mobile/granite-transformations_BG_mobile.jpg") center center/cover no-repeat
    }
}

@media all and (max-width: 531px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        height: 350px
    }
}

@media all and (max-width: 440px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section01 {
        background-size: contain;
        height: 310px
    }
}

@media all and (min-width: 1026px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        background: url("../images/new-pages-redesign/seo-page/adv-bg.jpg") 50% 0 no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 1025px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        height: 510px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/tablet/granite-transformations_BG_tablet.jpg") center center/cover no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 768px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        height: 430px
    }
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        height: 430px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/mobile/granite-transformations_BG_mobile.jpg") center center/cover no-repeat
    }
}

@media all and (max-width: 531px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        height: 350px
    }
}

@media all and (max-width: 440px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section02 {
        background-size: contain;
        height: 310px
    }
}

@media all and (min-width: 1026px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        background: url("../images/new-pages-redesign/seo-page/luxor-bg.jpg") 50% 0 no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 1025px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        height: 510px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/tablet/granite-transformations_BG_tablet.jpg") center center/cover no-repeat
    }
}

@media all and (min-width: 647px) and (max-width: 768px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        height: 430px
    }
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        height: 430px;
        background: url("../images/new-pages-redesign/seo-page/seo-results/mobile/granite-transformations_BG_mobile.jpg") center center/cover no-repeat
    }
}

@media all and (max-width: 531px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        height: 350px
    }
}

@media all and (max-width: 440px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section.section03 {
        background-size: contain;
        height: 310px
    }
}

@media all and (min-width: 1026px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section .title {
        font-size: 30px;
        color: #fff;
        margin-bottom: 33px;
        text-align: center
    }

    .nw-seo--wrp .seo-traffic-section .seotr-section .frame {
        max-width: 1100px;
        width: 100%
    }

    .nw-seo--wrp .seo-traffic-section .seotr-section .seotr-txt {
        min-height: 305px;
        width: 100%;
        max-width: 1000px
    }

    .nw-seo--wrp .seo-traffic-section .seotr-section .seotr-txt p {
        font: 20px/1.5 roboto-light-webfont, Arial, Helvetica, sans-serif;
        color: #758288
    }
}

@media all and (max-width: 1025px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section .title {
        color: #fff;
        font-size: 25px;
        top: 45px;
        position: absolute;
        text-align: center;
        left: 0;
        width: 100%
    }

    .nw-seo--wrp .seo-traffic-section .seotr-section .seotr-txt {
        position: absolute;
        top: 130px;
        left: 20px;
        min-height: auto;
        background: #fff;
        height: auto;
        width: 90%;
        border-radius: 6px 6px 0 0
    }
}

@media all and (max-width: 768px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section .title {
        top: 30px
    }
}

@media all and (max-width: 646px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section .title {
        font-size: 20px
    }
}

@media all and (max-width: 531px) {
    .nw-seo--wrp .seo-traffic-section .seotr-section .seotr-txt {
        top: 78px;
        background: 0 0
    }

    .nw-seo--wrp .seo-traffic-section .seotr-section .seotr-txt p {
        font-size: 12px
    }
}

@media all and (max-width: 1025px) {
    .nw--case-std__list {
        padding: 0
    }
}

.nw--case-std__item {
    display: flex;
    margin-bottom: 100px;
    flex-wrap: wrap
}

@media all and (max-width: 768px) {
    .nw--case-std__item {
        margin-bottom: 65px
    }
}

@media all and (max-width: 646px) {
    .nw--case-std__item {
        flex-direction: column-reverse;
        margin-bottom: 45px
    }
}

.nw--case-std__item.revert {
    flex-direction: row-reverse
}

@media all and (max-width: 646px) {
    .nw--case-std__item.revert {
        flex-direction: column-reverse
    }
}

.nw--case-std__item .col-left, .nw--case-std__item .col-right {
    width: 50%
}

@media all and (max-width: 646px) {
    .nw--case-std__item .col-left, .nw--case-std__item .col-right {
        width: 100%
    }
}

@media all and (min-width: 647px) {
    .nw--case-std__item .col-left {
        padding-right: 55px
    }
}

@media all and (min-width: 647px) {
    .nw--case-std__item .col-right {
        padding-right: 35px
    }
}

.nw--case-std__item .img-wrp {
    margin-bottom: 35px
}

@media all and (max-width: 646px) {
    .nw--case-std__item .img-wrp {
        max-width: 155px;
        display: block
    }
}

.nw--case-std__item .img-wrp a {
    display: block
}

.nw--case-std__item .cs-anim-dance01 {
    left: 0
}

.nw--case-std__item .cs-anim-dance02 {
    left: 24px
}

.nw--case-std__item .cs-anim-dance03 {
    left: 350px
}

.nw--case-std__item .cs-anim-medcpu01 {
    left: 392px
}

.nw--case-std__item .cs-anim-medcpu02 {
    left: 24px
}

.nw--case-std__item .cs-anim-medcpu03 {
    left: -128px
}

.nw--count__list {
    display: flex;
    justify-content: space-between
}

@media all and (max-width: 646px) {
    .nw--count__list {
        flex-wrap: wrap
    }
}

.nw--count__item:not(:last-child) {
    padding-right: 20px
}

@media all and (max-width: 646px) {
    .nw--count__item {
        width: 50%;
        margin-bottom: 15px
    }
}

.nw--count__item .cnt--amount {
    : roboto-regular-webfont, Arial, Helvetica, sans-serif;
    font-size: 45px;
    color: #009ddc;
    margin-bottom: 5px
}

@media all and (max-width: 1025px) {
    .nw--count__item .cnt--amount {
        font-size: 34px
    }
}

.nw--count__item .cnt--amount .amount {
    : roboto-bold-webfont, Arial, Helvetica, sans-serif
}

.nw--count__item .cnt-info {
    font-size: 20px;
    letter-spacing: -.25px;
    line-height: 1.4;
    color: #5a6063;
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 646px) {
    .nw--count__item .cnt-info span br {
        display: none
    }
}

@media all and (max-width: 1025px) {
    .nw--count__item .cnt-info {
        font-size: 15px
    }
}

.nw--case-std__wrp {
    max-width: 1100px;
    margin: 0 auto
}

.nw--case-std__descr {
    font-size: 24px;
    line-height: 35px;
    color: #5a6063;
    margin-bottom: 30px;
    : roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1025px) {
    .nw--case-std__descr {
        font-size: 18px;
        line-height: 24px
    }
}

.anim-p--vs img {
    max-width: auto
}

@media all and (min-width: 1201px) and (max-width: 1400px) {
    .anim-p--vs {
        transform: scale(.7)
    }
}

@media all and (min-width: 1025px) and (max-width: 1200px) {
    .anim-p--vs {
        transform: scale(.6)
    }
}

@media all and (max-width: 646px) {
    .anim-p--vs {
        margin-bottom: 22px
    }
}

@media all and (max-width: 767px) {
    .sp-section, .sp-section .sec-ttl {
        padding: 0
    }
}

@media all and (max-width: 768px) {
    .sp-section .slider-head__m {
        padding-top: 40px
    }
}

@media all and (max-width: 1025px) {
    .nw-seo--wrp .seotr-graph {
        display: none
    }
}

@media all and (min-width: 1025px) {
    .nw-seo--wrp .seotr-graph {
        bottom: -30px
    }
}

@media all and (min-width: 1025px) {
    .nw-seo--wrp .seotr-section:not(.section03) {
        margin-bottom: 60px
    }

    .nw-seo--wrp .seotr-section.section03 {
        margin-bottom: 0
    }
}

.seo--color .active-1 .pr-current-tab {
    background: #9ac91a
}

.seo--color .active-1 .pr-current-tab:after {
    border-top-color: #9ac91a
}

.seo--color .active.info .pr-txt {
    color: #9ac91a
}

.seo--color .active-3 .pr-current-tab {
    background: #a541c0
}

.seo--color .active-3 .pr-current-tab:after {
    border-top-color: #a541c0
}

.seo--color .active.dev .pr-txt {
    color: #a541c0
}

.seo--color .active-4 .pr-current-tab {
    background: #59cfd4
}

.seo--color .active-4 .pr-current-tab:after {
    border-top-color: #59cfd4
}

.seo--color .active.qa .pr-txt {
    color: #59cfd4
}

@keyframes animBg {
    0% {
        background-position: 0 0
    }
    48%, 50% {
        background-position: 0 100%
    }
    100%, 98% {
        background-position: 0 0
    }
}

.anim-p--vs .cs-bg {
    animation-name: animBg;
    animation-duration: 13s;
    animation-timing-function: linear;
    animation-iteration-count: infinite
}

@keyframes head-anim-pmp01 {
    0% {
        opacity: 1;
        transform: translate(-70px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-20px, 170px)
    }
}

@keyframes head-anim-pmp02 {
    0% {
        opacity: 0;
        transform: translate(150px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(130px, 30px)
    }
}

@keyframes head-anim-pmp03 {
    0% {
        opacity: 0;
        transform: translate(250px, 36px)
    }
    100% {
        opacity: 1;
        transform: translate(200px, 130px)
    }
}

@keyframes head-anim-pmp04 {
    0% {
        opacity: 0;
        transform: translate(200px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(210px, 330px)
    }
}

@keyframes head-anim-pmp05 {
    0% {
        opacity: 0;
        transform: translate(-30px, 36px)
    }
    100% {
        opacity: 1;
        transform: translate(-30px, 100px)
    }
}

.animated .head-anim-pmp01 {
    animation: head-anim-pmp01 1.8s forwards;
    z-index: 1
}

.animated .head-anim-pmp02 {
    animation: head-anim-pmp02 1.8s forwards;
    z-index: 2
}

.animated .head-anim-pmp03 {
    animation: head-anim-pmp03 1.8s forwards;
    z-index: 2
}

.animated .head-anim-pmp04 {
    animation: head-anim-pmp04 1.8s forwards;
    z-index: 3
}

.animated .head-anim-pmp05 {
    animation: head-anim-pmp05 1.8s forwards;
    z-index: 3
}

.nw-pmp--wrp {
    background: #fff
}

@media all and (max-width: 1170px) {
    .nw-pmp--wrp .next-over .slider-section, .nw-pmp--wrp .next-over .wide-expanded-section {
        padding-top: 0
    }
}

.nw-pmp--wrp .top-section.head-anim-holder.over:after {
    background: #f4f4f4
}

.nw-pmp--wrp .txt-slider {
    background: 0 0
}

@media all and (max-width: 646px) {
    .nw-pmp--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

@media all and (min-width: 1025px) {
    .nw-pmp--wrp .pr-slider .t-cell.txt {
        padding: 0
    }
}

@media all and (max-width: 646px) {
    .nw-pmp--wrp .pr-slider .t-cell.txt {
        padding: 0
    }
}

.nw-pmp--wrp .seo-traffic-section {
    padding: 80px 0 0
}

.nw-pmp--wrp .simple-slider p {
    padding-right: 0
}

.nw-pmp--wrp .pr-slider p {
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

.nw-pmp--wrp .pr-pager {
    margin: 0 auto 30px
}

.nw-pmp--wrp .pr-slider .item {
    padding-top: 0
}

.cs-paralax-left, .cs-paralax-right {
    position: relative;
    z-index: 3
}

.case-slider .wide-mode {
    display: block;
    background: rgba(255, 255, 255, .1)
}

.cs-bg {
    width: 478px;
    height: 360px;
    overflow: hidden;
    left: 163px;
    top: 32px;
    z-index: 1
}

.cs-left {
    z-index: 3;
    transform: translateX(100px);
    transition: transform .5s ease-out .2s
}

.cs-right {
    z-index: 3;
    transform: translateX(100px);
    transition: transform .4s ease-out .1s
}

.anim-p .cs-left, .anim-p .cs-right {
    transform: translateX(0)
}

.anim-p .anim-img {
    opacity: 1
}

@media all and (min-width: 1201px) and (max-width: 1400px) {
    .anim-p--vs {
        transform: scale(.7)
    }
}

@media all and (min-width: 1025px) and (max-width: 1200px) {
    .anim-p--vs {
        transform: scale(.6)
    }
}

@media all and (max-width: 646px) {
    .anim-p--vs {
        margin-bottom: 22px
    }
}

@media all and (max-width: 767px) {
    .sp-section, .sp-section .sec-ttl {
        padding: 0
    }
}

.sp-section .slider-head__m {
    padding: 70px 0 150px
}

.sp-section .slider-head__m h2 {
    margin-bottom: 15px
}

.sp-section .slider-pager {
    margin-top: -150px
}

.bsp-section .nw-slider--item {
    padding-bottom: 160px
}

.bsp-section.slider-section {
    padding: 0
}

.bsp-section .rd-box-holder {
    padding: 0;
    margin-top: -150px
}

.pmp-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 242px;
    height: 211px;
    left: -6px;
    top: 20px;
    z-index: 4;
    transition: all .35s linear .7s
}

.pmp-pr-anim104 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 241px;
    height: 287px;
    left: 16px;
    top: -145px;
    z-index: 1;
    transition: all .35s linear .7s;
    transform: translateY(0)
}

.pmp-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 136px;
    height: 181px;
    left: -50px;
    top: 2px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateX(40px)
}

.pmp-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 189px;
    height: 294px;
    left: 32px;
    top: -192px;
    z-index: 2;
    transition: all .35s linear .7s;
    transform: translateX(40px)
}

.pmp-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 187px;
    height: 312px;
    top: -201px;
    left: 48px;
    z-index: 1;
    transition: all .35s linear .2s;
    transform: translateY(0)
}

.pmp-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 177px;
    height: 308px;
    top: -223px;
    left: 48px;
    z-index: 1;
    transition: all .35s linear .2s;
    transform: translateY(40px)
}

.pmp-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 40px;
    height: 189px;
    left: 230px;
    top: -103px;
    z-index: 1;
    transition: all .35s linear .5s;
    transform: translateX(40px)
}

.pmp-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 140px;
    height: 117px;
    left: -50px;
    top: -80px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateY(40px)
}

.pmp-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 213px;
    height: 325px;
    left: 61px;
    top: -283px;
    z-index: 1;
    transition: all .35s linear .3s;
    transform: translateY(0)
}

.pmp-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 247px;
    height: 312px;
    left: -8px;
    top: -240px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(0)
}

.pmp-pr-anim403 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 235px;
    height: 235px;
    left: -73px;
    top: -165px;
    z-index: 3;
    transition: all .35s linear .8s;
    transform: translateX(40px)
}

.pmp-pr-anim404 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 210px;
    height: 202px;
    left: -103px;
    top: -126px;
    z-index: 3;
    transition: all .35s linear 1s;
    transform: translateX(40px)
}

.pmp-pr-anim501 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 241px;
    height: 287px;
    left: 16px;
    top: -185px;
    z-index: 1;
    transition: all .35s linear .3s;
    transform: translateY(40px)
}

.pmp-pr-anim502 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 125px;
    height: 294px;
    left: 70px;
    top: -35px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(40px)
}

.pmp-pr-anim503 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 136px;
    height: 181px;
    left: -82px;
    top: -55px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateY(40px)
}

.current .pmp-pr-anim104, .current .pmp-pr-anim203 {
    transform: translateY(0)
}

.current .pmp-pr-anim201, .current .pmp-pr-anim202 {
    transform: translateX(0)
}

.current .pmp-pr-anim301 {
    transform: translateY(40px)
}

.current .pmp-pr-anim302 {
    transform: translateX(0)
}

.current .pmp-pr-anim401, .current .pmp-pr-anim402, .current .pmp-pr-anim403, .current .pmp-pr-anim404 {
    transform: translateY(40px)
}

.cs-anim-exh1 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 379px;
    height: 439px;
    left: 0;
    top: 0
}

.cs-anim-exh2 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 466px;
    height: 377px;
    left: 140px;
    top: 120px
}

.cs-anim-twe01 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 426px;
    height: 348px;
    left: 20px;
    top: 178px;
    z-index: 2
}

.cs-anim-twe02 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 507px;
    height: 319px;
    left: 0;
    top: 0;
    z-index: 1
}

.pmp-pr--slider .slide04 .t-cell.visual {
    padding-top: 160px
}

.pmp-pmc--section.slider-section {
    padding-bottom: 140px
}

.pmp-pr--slider .active-1 .pr-current-tab {
    background: #a0cc27
}

.pmp-pr--slider .active-1 .pr-current-tab:after {
    border-top-color: #a0cc27
}

.pmp-pr--slider .active.info .pr-txt {
    color: #a0cc27
}

.pmp-pr--slider .active-2 .pr-current-tab {
    background: #9d4f98
}

.pmp-pr--slider .active-2 .pr-current-tab:after {
    border-top-color: #9d4f98
}

.pmp-pr--slider .active.design .pr-txt {
    color: #9d4f98
}

.pmp-pr--slider .active-3 .pr-current-tab {
    background: #f8b660
}

.pmp-pr--slider .active-3 .pr-current-tab:after {
    border-top-color: #f8b660
}

.pmp-pr--slider .active.dev .pr-txt {
    color: #f8b660
}

.pmp-pr--slider .active-4 .pr-current-tab {
    background: #57cfd4
}

.pmp-pr--slider .active-4 .pr-current-tab:after {
    border-top-color: #57cfd4
}

.pmp-pr--slider .active.qa .pr-txt {
    color: #57cfd4
}

.pmp-pr--slider .design svg {
    stroke: #9d4f98
}

.pmp-pr--slider .dev svg {
    stroke: #f8b660
}

@keyframes open-corner {
    0% {
        background-position: 0 0
    }
    100% {
        background-position: -633px 0
    }
}

@keyframes close-corner {
    0% {
        background-position: -633px 0
    }
    100% {
        background-position: 0 0
    }
}

.wh-papers--wrp {
    background: #fff
}

.wh-papers--wrp.nw-whitepapers--spa {
    background: #000;
    width: 100%
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp.nw-whitepapers--spa {
        height: 100%
    }
}

@media only screen and (max-width: 1025px) {
    .wh-papers--wrp.nw-whitepapers--spa {
        padding-bottom: 100px
    }
}

@media all and (min-height: 1300px) {
    .wh-papers--wrp.nw-whitepapers--spa {
        display: flex;
        flex-direction: column;
        justify-content: center
    }
}

.wh-papers--wrp .nw--page-h {
    padding-top: 60px;
    border-top: 3px solid #2ebbf3
}

.wh-papers--wrp .wh-page--content {
    padding: 0 20px
}

.wh-papers--wrp .wh--papers-list {
    display: flex
}

.wh-papers--wrp .wh--papers-list:not(.spa-list) {
    flex-wrap: wrap;
    padding-top: 64px
}

@media all and (max-width: 1281px) {
    .wh-papers--wrp .wh--papers-list:not(.spa-list) {
        justify-content: space-around
    }
}

.wh-papers--wrp .wh--papers-list.spa-list {
    margin-top: 5.3125rem
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp .wh--papers-list.spa-list {
        flex-wrap: nowrap
    }
}

@media only screen and (max-width: 1025px) {
    .wh-papers--wrp .wh--papers-list.spa-list {
        flex-wrap: wrap;
        justify-content: center;
        padding: 0 20px
    }
}

@media only screen and (max-width: 646px) {
    .wh-papers--wrp .wh--papers-list.spa-list {
        justify-content: center
    }
}

.wh-papers--wrp .wh--img-wrp {
    position: relative
}

.wh-papers--wrp .wh--img-wrp:after {
    content: '';
    display: block;
    position: absolute;
    height: 250px;
    width: 78px;
    top: 0;
    z-index: 9;
    right: 0;
    background: url("../image/tzz_ion-1.png") no-repeat
}

.wh-papers--wrp .wh--descr {
    color: #fff;
    font-size: 18px;
    line-height: 1.4;
    : roboto-light-webfont, Arial, Helvetica, sans-serif
}

.wh-papers--wrp .wh-paper--item {
    background: #282828;
    transition: background .4s, box-shadow .4s;
    box-shadow: none
}

.wh-papers--wrp .wh-paper--item:not(.small) {
    max-width: 512px;
    padding: 0 68px 68px;
    margin: 0 0 128px
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp .wh-paper--item:not(.small) {
        width: calc(33.33% - 16px)
    }
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--title a {
    color: #fff;
    font: 33px 'Roboto Bold Condensed', sans-serif
}

@media all and (max-width: 1650px) {
    .wh-papers--wrp .wh-paper--item:not(.small) .wh--title a {
        font-size: 22px
    }
}

.wh-papers--wrp .wh-paper--item.small {
    padding: 0 3.4375rem .9375rem
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp .wh-paper--item.small {
        width: 25%
    }
}

.wh-papers--wrp .wh-paper--item.small .wh--title a {
    color: #fff;
    font-size: 1.4375rem;
    : 'Roboto Bold Condensed', sans-serif;
    line-height: 1.75rem
}

@media only screen and (max-width: 1025px) {
    .wh-papers--wrp .wh-paper--item.small .wh--title a {
        font-size: 18px
    }
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp .wh-paper--item.small:not(:last-child) {
        margin: 0 1.25rem 0 0
    }
}

@media only screen and (min-width: 647px) {
    .wh-papers--wrp .wh-paper--item.small:nth-child(-2n+3) {
        margin-right: 16px
    }
}

@media only screen and (max-width: 1025px) {
    .wh-papers--wrp .wh-paper--item.small {
        margin-bottom: 80px
    }
}

@media only screen and (max-width: 737px) {
    .wh-papers--wrp .wh-paper--item.small {
        margin-bottom: 60px
    }
}

@media all and (max-width: 1281px) {
    .wh-papers--wrp .wh-paper--item {
        width: calc(50% - 16px);
        height: auto
    }
}

@media all and (max-width: 768px) {
    .wh-papers--wrp .wh-paper--item:not(.small) {
        padding: 0 30px 30px
    }
}

@media all and (max-width: 646px) {
    .wh-papers--wrp .wh-paper--item {
        width: 100%;
        max-width: 380px
    }
}

.wh-papers--wrp .wh-paper--item.play .wh--img-wrp:after {
    animation: open-corner .5s steps(7) forwards
}

.wh-papers--wrp .wh-paper--item.revert .wh--img-wrp:after {
    animation: close-corner .5s steps(7) forwards
}

.wh-papers--wrp .wh-paper--item:hover {
    background: #fff;
    box-shadow: 2px 2px 21px 2px rgba(0, 0, 0, .2);
    animation: open-corner .7s steps(7) forwards
}

.wh-papers--wrp .wh-paper--item:hover .wh--card {
    box-shadow: 1px 1px 6px 3px rgba(0, 0, 0, .2)
}

.wh-papers--wrp .wh-paper--item img {
    width: 100%;
    height: auto;
    display: block
}

.wh-papers--wrp .wh-paper--item img[lazy=loading] {
    height: 12.5rem
}

@media all and (min-width: 1282px) {
    .wh-papers--wrp .wh-paper--item:not(.small):nth-child(3n+2) {
        margin: 0 24px 128px
    }
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card-inner {
    padding-bottom: 105px;
    position: relative
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card-inner:after {
    content: '';
    display: block;
    width: 70%;
    position: absolute;
    left: 30px;
    bottom: 40px;
    height: 38px;
    background: url("../image/tzz_ion-1.png") 0 0/100% no-repeat
}

.wh-papers--wrp .wh-paper--item .wh--card-inner {
    padding-bottom: 4.375rem;
    position: relative
}

.wh-papers--wrp .wh-paper--item .wh--card-inner:after {
    content: '';
    display: block;
    width: 70%;
    position: absolute;
    left: 1.25rem;
    bottom: 1.5rem;
    height: 1.75rem;
    background: url("../image/tzz_ion-1.png") 0 0/100% no-repeat
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card {
    margin: -64px 0 32px;
    background: #fff;
    position: relative;
    padding-right: 5px;
    box-shadow: none;
    transition: box-shadow .4s
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card:after, .wh-papers--wrp .wh-paper--item:not(.small) .wh--card:before {
    content: '';
    position: absolute;
    background: #0096d3
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card:after {
    right: 0;
    top: 10px;
    width: 5px;
    height: calc(100% - 10px)
}

.wh-papers--wrp .wh-paper--item:not(.small) .wh--card:before {
    right: 0;
    bottom: -5px;
    width: calc(100% - 5px);
    height: 5px
}

.wh-papers--wrp .wh-paper--item.small .wh--btn-wrp a {
    font-size: .9375rem
}

.wh-papers--wrp .wh-paper--item.small .wh--btn-wrp a .icon-arrow-card {
    width: .9375rem;
    height: .9375rem
}

.wh-papers--wrp .wh-paper--item.small .wh--card {
    margin: -3.125rem 0 1rem;
    background: #fff;
    position: relative;
    padding-right: .3125rem;
    box-shadow: none;
    transition: box-shadow .4s
}

@media only screen and (min-width: 1026px) {
    .wh-papers--wrp .wh-paper--item.small .wh--card img {
        max-width: 270px;
        max-height: 200px
    }
}

.wh-papers--wrp .wh-paper--item.small .wh--card:after, .wh-papers--wrp .wh-paper--item.small .wh--card:before {
    content: '';
    position: absolute;
    background: #0096d3
}

.wh-papers--wrp .wh-paper--item.small .wh--card:after {
    right: 0;
    top: 10px;
    width: 5px;
    height: calc(100% - 10px)
}

.wh-papers--wrp .wh-paper--item.small .wh--card:before {
    right: 0;
    bottom: -5px;
    width: calc(100% - 5px);
    height: 5px
}

.wh-papers--wrp .wh-paper--item .wh--btn-wrp {
    text-align: center
}

.wh-papers--wrp .wh-paper--item .wh--btn-wrp a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    color: #90c404;
    transition: color .3s;
    font-weight: 700;
    : roboto-bold-webfont, arial, Helvetica, sans-serif;
    font-size: 17px
}

.wh-papers--wrp .wh-paper--item .wh--btn-wrp a .icon-arrow-card {
    fill: currentColor;
    width: 16px;
    height: 16px;
    transition: fill .3s;
    margin-left: 10px
}

.wh-papers--wrp .wh-paper--item .wh--btn-wrp a span {
    line-height: 21px
}

.wh-papers--wrp .wh-paper--item .wh--btn-wrp a:hover {
    color: #000
}

.wh-papers--wrp .wh-paper--item .wh--title-wrp {
    width: 85%;
    position: relative;
    z-index: 2;
    background: url("../image/tzz_ion-1.png") 0 0/cover
}

.wh-papers--wrp .wh-paper--item .wh--title-wrp:not(.small) {
    height: 243px;
    margin-top: -143px;
    padding: 36px 18px 36px 36px;
    max-width: 315px
}

.wh-papers--wrp .wh-paper--item .wh--title-wrp.small {
    height: 11.25rem;
    padding: 1.5625rem 1.25rem 1.25rem;
    margin-top: -6.25rem
}

.wh-papers--wrp .wh-paper--item .wh--cat {
    position: absolute;
    top: -12px;
    left: 0;
    z-index: 3;
    background: #2ebbf3;
    text-transform: uppercase;
    color: #fff;
    padding: 8px 20px 8px 34px;
    font: 14px/14px roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

.wh-detail--wrp {
    padding: 0 20px;
    background: #fff
}

.wh-detail--wrp .nw--inner-container {
    max-width: 1443px
}

@media all and (max-width: 737px) {
    .wh-detail--wrp {
        padding: 0 20px
    }
}

.wh-detail--wrp .wh--top-banner {
    padding: 120px 40px 60px;
    background: url("../image/tzz_ion-1.png") 0 0/cover;
    border-radius: 6px 6px 0 0
}

@media all and (min-width: 738px) {
    .wh-detail--wrp .wh--top-banner {
        margin-bottom: 45px
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh--top-banner {
        padding: 30px 30px 90px;
        margin: 0 -20px
    }
}

.wh-detail--wrp .wh--top-banner .title {
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    font-size: 50px;
    line-height: 1;
    letter-spacing: -2.5px;
    color: #fff
}

@media all and (max-width: 1366px) {
    .wh-detail--wrp .wh--top-banner .title {
        font-size: 38px
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh--top-banner .title {
        font-size: 24px;
        letter-spacing: normal
    }
}

@media all and (min-width: 738px) {
    .wh-detail--wrp .wh--top-banner .title-wrp {
        padding-right: 52%
    }
}

.wh-detail--wrp .wh--topics-title {
    color: #009ddc;
    font: 28px/1.1 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin-bottom: 30px
}

.wh-detail--wrp .whf-content ul li {
    padding: 0 0 24px 40px
}

.wh-detail--wrp .whf-content ul li:before {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAUCAYAAACJfM0wAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjBFODY1N0Q3QzAzRDExRTY5RTA4RTBCMjM3QUY0RjdEIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjBFODY1N0Q4QzAzRDExRTY5RTA4RTBCMjM3QUY0RjdEIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MEU4NjU3RDVDMDNEMTFFNjlFMDhFMEIyMzdBRjRGN0QiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MEU4NjU3RDZDMDNEMTFFNjlFMDhFMEIyMzdBRjRGN0QiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6lnR1GAAABZElEQVR42qyUvy8EQRTHdy9+RKOjkCgUIioKriEhIYJWwR9Ao7mEQlRKoXF6/wCF3DVEriJ3yaEXEqVI6FyBOMLnJbPJZPKGzY5v8snNvJ393rx5bycuVluiEBXGmtF+rVWGM1Bh/i2TXPQ/WoYzKPMn7RKIQ3eMBuDWmj9DPnTHHXDlxLqhFGIcwyl0OvEPmAgx3hADJT5OARtZjUdhW4lvwnXWrpDUq0r8HHak/bIY54xBmxNvwFzSw66xLC6Yovi0C8NKPI/pm7uDpMJlKMKJsiPRNKwr8RVM77TURFswa8byew9d1joZVxTTEhz4zmzKGNvqhUdJEeTTvFTefYLFpFiacQ0ulGeJ4Q30Kc9HzMfgNX6HSdjzrOlXYgvw8Ff7iKRN1iS1FC0nZ3qcpi9tHcEgvHrWf8Jq2oZ3JVdgjzlbV1LoZlZj0QsMwaEVm/cUWdVvt7ykvQR1+DJXZGr9CDAAkhtLQsKfA3AAAAAASUVORK5CYII=) center center no-repeat;
    width: 22px;
    height: 20px;
    top: 10px
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .whi-content {
        padding: 0 14px
    }
}

.wh-detail--wrp .whi-content ul li {
    padding: 0 0 18px 40px;
    font: 20px/1.6 roboto-regular-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1025px) {
    .wh-detail--wrp .whi-content ul li {
        font-size: 14px
    }
}

.wh-detail--wrp .whi-content ul li:before {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAUCAYAAACJfM0wAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjBFODY1N0Q3QzAzRDExRTY5RTA4RTBCMjM3QUY0RjdEIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjBFODY1N0Q4QzAzRDExRTY5RTA4RTBCMjM3QUY0RjdEIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MEU4NjU3RDVDMDNEMTFFNjlFMDhFMEIyMzdBRjRGN0QiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MEU4NjU3RDZDMDNEMTFFNjlFMDhFMEIyMzdBRjRGN0QiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6lnR1GAAABZElEQVR42qyUvy8EQRTHdy9+RKOjkCgUIioKriEhIYJWwR9Ao7mEQlRKoXF6/wCF3DVEriJ3yaEXEqVI6FyBOMLnJbPJZPKGzY5v8snNvJ393rx5bycuVluiEBXGmtF+rVWGM1Bh/i2TXPQ/WoYzKPMn7RKIQ3eMBuDWmj9DPnTHHXDlxLqhFGIcwyl0OvEPmAgx3hADJT5OARtZjUdhW4lvwnXWrpDUq0r8HHak/bIY54xBmxNvwFzSw66xLC6Yovi0C8NKPI/pm7uDpMJlKMKJsiPRNKwr8RVM77TURFswa8byew9d1joZVxTTEhz4zmzKGNvqhUdJEeTTvFTefYLFpFiacQ0ulGeJ4Q30Kc9HzMfgNX6HSdjzrOlXYgvw8Ff7iKRN1iS1FC0nZ3qcpi9tHcEgvHrWf8Jq2oZ3JVdgjzlbV1LoZlZj0QsMwaEVm/cUWdVvt7ykvQR1+DJXZGr9CDAAkhtLQsKfA3AAAAAASUVORK5CYII=) center center no-repeat;
    width: 22px;
    height: 20px
}

.wh-detail--wrp .wh-add .whi-content {
    margin-top: 0
}

.wh-detail--wrp .wh-add .init-height {
    min-height: 380px
}

.wh-detail--wrp .wh-form-holder {
    width: 45%;
    height: 0;
    top: 47px
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder {
        float: none;
        width: calc(100% - 18px);
        margin: 0 auto;
        height: auto;
        top: 0
    }
}

.wh-detail--wrp .wh-form-holder .ch-form {
    background: #fff;
    box-shadow: 0 0 1px 3px rgba(0, 0, 0, .07);
    padding: 60px 70px 0
}

@media all and (max-width: 1366px) {
    .wh-detail--wrp .wh-form-holder .ch-form {
        padding: 20px 20px 0
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .ch-form {
        padding-bottom: 0
    }
}

.wh-detail--wrp .wh-form-holder .ch-form .ff-btn-submit {
    font-size: 23px;
    text-transform: uppercase;
    width: 100%;
    display: block;
    padding: 16px 76px 16px 38px
}

@media all and (max-width: 900px) {
    .wh-detail--wrp .wh-form-holder .ch-form .ff-btn-submit {
        font-size: 16px
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .ch-form .ff-btn-submit {
        font-size: 14px
    }
}

.wh-detail--wrp .wh-form-holder .ch-form .ff-submit {
    display: inline-block;
    position: relative;
    padding: 0;
    margin: 20px 0 0
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .ch-form .ff-submit {
        margin: 10px 0 0
    }
}

.wh-detail--wrp .wh-form-holder .ch-form .ff-submit:after {
    position: absolute;
    right: 40px;
    content: '';
    width: 21px;
    height: 23px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAVCAYAAACkCdXRAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjgzMkE1Q0VBQzA3NjExRTZBNkFFOEFEMkZBRURBQjBEIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjgzMkE1Q0VCQzA3NjExRTZBNkFFOEFEMkZBRURBQjBEIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODMyQTVDRThDMDc2MTFFNkE2QUU4QUQyRkFFREFCMEQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODMyQTVDRTlDMDc2MTFFNkE2QUU4QUQyRkFFREFCMEQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz54hmLcAAAAyUlEQVR42mL8//8/AwEgAcQ8UPZTIP6OUyXIMAJ41X8EcMCnlomBimDUMMoN4wLiGiBmIUIvNxA3oZiBFLVMQHwCmgSeAbEGnqThCsQ/oWL9MDOQDSv8jwk6gHgLEj8WiDdgUWeGbhgjEGdjUfgbif0XTe47ckLGlpIlgfjyf8IA5H1OZL24sgYuV2K4hhjDkF15D8mgLeiuIcUwmCsXAHEKIbWMRBRBA5MDYCm9kgpmfQJ5kxHI+EcFwx5T3ZugGHCkglk/AAIMAH2lEd51PuurAAAAAElFTkSuQmCC) center center no-repeat;
    top: 50%;
    transform: translateY(-50%)
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .ch-form .ff-submit:after {
        right: 20px
    }
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row {
    position: relative;
    padding: 0;
    z-index: 1;
    margin-bottom: 10px
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row ::-webkit-input-placeholder {
    color: #5a6063;
    opacity: 1
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row ::-moz-placeholder {
    color: #5a6063;
    opacity: 1
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row :-moz-placeholder {
    color: #5a6063;
    opacity: 1
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row :-ms-input-placeholder {
    color: #5a6063;
    opacity: 1
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row .field-title .label {
    display: none
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row .field-title .validation {
    z-index: -1;
    position: absolute;
    left: 0;
    height: 100%;
    margin: 0;
    width: 100%;
    padding: 0 22px;
    font: 20px/68px roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .ch-form .f-row .field-title .validation {
        font-size: 14px;
        line-height: 40px;
        height: 40px
    }
}

.wh-detail--wrp .wh-form-holder .ch-form .f-row.active .field-title .label {
    display: none
}

.wh-detail--wrp .wh-form-holder .wh-form {
    transform: translateY(-54%)
}

@media all and (max-width: 1366px) {
    .wh-detail--wrp .wh-form-holder .wh-form {
        transform: translateY(-34%)
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .wh-form {
        transform: translateY(0);
        margin: -60px 0 30px
    }
}

@media all and (max-width: 1366px) {
    .wh-detail--wrp .wh-form-holder .whf-title {
        margin-bottom: 25px
    }
}

@media all and (max-width: 1025px) {
    .wh-detail--wrp .wh-form-holder .whf-title {
        margin-bottom: 20px
    }
}

.wh-detail--wrp .wh-form-holder .whf-title span {
    font: 22px/1.5 roboto-light-webfont, Arial;
    color: #5a6063
}

@media all and (min-width: 1026px) {
    .wh-detail--wrp .wh-form-holder .whf-title span {
        letter-spacing: -1px
    }
}

@media all and (max-width: 646px) {
    .wh-detail--wrp .wh-form-holder .whf-title span {
        display: block
    }
}

@media all and (max-width: 1400px) {
    .wh-detail--wrp .wh-form-holder .whf-title span {
        font-size: 17px
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .whf-title span {
        font-size: 14px
    }
}

.wh-detail--wrp .wh-form-holder .whf-title strong {
    font: 32px/1.2 roboto-medium-webfont, Arial;
    color: #009ddc
}

@media all and (min-width: 1026px) {
    .wh-detail--wrp .wh-form-holder .whf-title strong {
        letter-spacing: -1px
    }
}

@media all and (max-width: 1400px) {
    .wh-detail--wrp .wh-form-holder .whf-title strong {
        font-size: 23px
    }
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form-holder .whf-title strong {
        font-size: 17px
    }
}

.wh-detail--wrp .wh-infobox {
    width: 48%
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-infobox {
        width: 100%;
        float: none;
        display: block
    }
}

.wh-detail--wrp .wh-form {
    margin-top: 0
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .wh-form {
        margin: 0 -20px
    }
}

.wh-detail--wrp .ch-form .field-success input, .wh-detail--wrp .jq-join-us-form.ch-form .field-success textarea {
    background-position: 99% 16px !important
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .ch-form .field-success input, .wh-detail--wrp .jq-join-us-form.ch-form .field-success textarea {
        background-position: 99% 5px !important
    }
}

.wh-detail--wrp .ch-form .field-error input, .wh-detail--wrp .ch-form .field-error textarea {
    background-position: 99% -255px !important
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .ch-form .field-error input, .wh-detail--wrp .ch-form .field-error textarea {
        background-position: 99% -268px !important
    }
}

.wh-detail--wrp .ch-form .ff-input input, .wh-detail--wrp .ch-form .ff-textarea textarea, .wh-detail--wrp .page-search-box input[type=text] {
    box-shadow: none;
    background: 0 0;
    height: 68px;
    line-height: 68px;
    border: 1px solid #a8abac;
    color: #5a6063;
    font: 20px/1 roboto-light-webfont, Arial, Helvetica, sans-serif
}

.wh-detail--wrp .ch-form .ff-input input:focus, .wh-detail--wrp .ch-form .ff-textarea textarea:focus, .wh-detail--wrp .page-search-box input[type=text]:focus {
    border: 1px solid #5a6063
}

@media all and (max-width: 737px) {
    .wh-detail--wrp .ch-form .ff-input input, .wh-detail--wrp .ch-form .ff-textarea textarea, .wh-detail--wrp .page-search-box input[type=text] {
        height: 40px;
        line-height: 40px;
        font-size: 14px
    }
}

@media all and (max-width: 737px) {
    .wh-f--m {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse
    }
}

.wh-card {
    background: url("../image/tzz_ion-1.png") 30% 91%/70% auto no-repeat #fff;
    max-width: 265px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .3), 5px 5px 0 -1px #0096d3;
    margin: 0 50px 20px 0;
    padding: 0 0 77px;
    position: relative;
    flex-basis: 50%;
    align-self: flex-start
}

@media all and (max-width: 1400px) {
    .wh-card {
        margin-right: 30px
    }
}

.wh-card .wh-card-ttl {
    max-height: 203px;
    margin-top: -135px;
    padding: 60px 18px 36px 24px;
    max-width: 315px;
    width: 85%;
    position: relative;
    z-index: 2;
    background: url("../image/tzz_ion-1.png") 100% 100%/100% auto no-repeat
}

@media all and (max-width: 1200px) {
    .wh-card .wh-card-ttl {
        max-height: 180px
    }
}

.wh-card .wh-card-ttl h4 {
    color: #fff;
    font: 23px/1.2 'Roboto Bold Condensed', sans-serif
}

@media all and (max-width: 1600px) {
    .wh-card .wh-card-ttl h4 {
        font-size: 18px
    }
}

@media all and (max-width: 1200px) {
    .wh-card .wh-card-ttl h4 {
        font-size: 14px
    }
}

.wh-card img {
    width: 100%;
    display: block
}

.wh-detail-pg .whi-content {
    float: none
}

.wh-detail-pg .wh-detail--wrp {
    min-height: 680px
}

@media all and (max-width: 980px) {
    .wh-detail-pg .wh-detail--wrp {
        padding-bottom: 0
    }
}

.wh-detail-pg .wh-detail--wrp .wh-infobox {
    padding-top: 50px;
    display: flex;
    width: 100%;
    padding-right: 44%
}

@media all and (max-width: 980px) {
    .wh-detail-pg .wh-detail--wrp .wh-infobox {
        max-width: 80vw;
        padding-right: 20px;
        margin: 0 auto
    }
}

.wh-detail-pg .wh-detail--wrp .ch-form {
    padding: 50px 60px 0
}

@media all and (max-width: 1400px) {
    .wh-detail-pg .wh-detail--wrp .ch-form {
        padding: 25px 20px !important
    }
}

.wh-detail-pg .wh-detail--wrp .wh--top-banner {
    padding-top: 90px;
    border-radius: 7px;
    background-position: 50% 0
}

@media all and (max-width: 646px) {
    .wh-detail-pg .wh-detail--wrp .wh--top-banner {
        border-radius: 0
    }
}

.wh-detail-pg .wh-detail--wrp .wh-form-holder {
    top: 60px;
    right: 4vw;
    max-width: 540px
}

@media all and (max-width: 1400px) {
    .wh-detail-pg .wh-detail--wrp .wh-form-holder {
        right: 2vw;
        max-width: 450px
    }
}

@media all and (max-width: 1200px) {
    .wh-detail-pg .wh-detail--wrp .wh-form-holder {
        max-width: 380px
    }
}

@media all and (max-width: 980px) {
    .wh-detail-pg .wh-detail--wrp .wh-form-holder {
        margin: -20px auto 40px;
        max-width: 80vw;
        right: 0
    }
}

@keyframes head-anim-pmp01 {
    0% {
        opacity: 1;
        transform: translate(-70px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-70px, 60px)
    }
}

@keyframes head-anim-pmp02 {
    0% {
        opacity: 0;
        transform: translate(150px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(130px, 30px)
    }
}

@keyframes head-anim-pmp03 {
    0% {
        opacity: 0;
        transform: translate(150px, 36px)
    }
    100% {
        opacity: 1;
        transform: translate(-70px, 170px)
    }
}

@keyframes head-anim-pmp04 {
    0% {
        opacity: 0;
        transform: translate(100px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(70px, 70px)
    }
}

.animated .head-anim-cro01 {
    animation: head-anim-pmp01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-cro02 {
    animation: head-anim-pmp02 1.5s forwards;
    z-index: 2
}

.animated .head-anim-cro03 {
    animation: head-anim-pmp03 1.8s forwards;
    z-index: 2
}

.animated .head-anim-cro04 {
    animation: head-anim-pmp04 2.2s forwards;
    z-index: 3
}

.cro-page--wrp {
    background: #fff
}

@media all and (max-width: 646px) {
    .cro-page--wrp .whitepaper-descript {
        padding-bottom: 40px
    }
}

@media all and (max-width: 646px) {
    .cro-page--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

.cro-page--wrp .nw--case-std__item {
    margin-bottom: 0
}

@media all and (max-width: 646px) {
    .cro-page--wrp .nw--case-std__item {
        flex-direction: column
    }
}

@media all and (min-width: 646px) {
    .cro-page--wrp .nw--case-std__item .col-right {
        padding: 0 0 0 35px
    }
}

.cro-page--wrp .head-anim-img {
    top: -15px
}

.cro--cs-anim-twe01 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 428px;
    height: 361px;
    left: 63px;
    top: 163px;
    z-index: 1
}

.cro--cs-anim-twe02 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 512px;
    height: 324px;
    left: 0;
    top: 0;
    z-index: 2
}

.nw--add-wrp {
    background: #fff;
    padding: 0 20px
}

.nw--content-add .title {
    font: 24px roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    color: #5a6063;
    text-align: center
}

.nw--content-add .title a {
    font: 24px roboto-bold-webfont, Arial, Helvetica, sans-serif;
    color: #009ddc;
    position: relative
}

@media all and (max-width: 481px) {
    .nw--content-add .title a {
        display: block;
        text-align: center
    }
}

.nw--content-add .title a:after {
    content: '';
    height: 16px;
    width: 12px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAQCAMAAAD3Y3VMAAAAolBMVEUAndwAsvr///8AndwAsvoAndwAndwAsvoAsvoAndwAsvoAsvoAndwAndwAndwAsvoAndwAsvoAsvoAsvoAn98AndwAndwAndwAsvoAsvoAndwAsvoAsvoAsvoAndwAsvoAndwAsvoAndwAndwAsvoAndwAsvoAn94AndwAsvoAndwAn98AoOAAndwAsvoAoOAAsvoAndwAndwAsvoAndwAsvpRoY0rAAAANHRSTlMAAAABAQIEBAYHCQsODxEYHiMsLi8wMklOW2RmZ2txd46PkqWytbfKzNHX2ubo6e/v9fn59BgD6gAAAG9JREFUeAE1yFcSwkAMBNERGDA555yzYUFz/6tRyNr+etWYziWGNNsm0dLloRItC17r0cmJWdsttTe/fbf0SE7csia5FFiDx+t+To2tj+qzY798Uz1WUfh7r7oqwjzTMALMQ700kLsZNiW4d2PA/QOPcwmMKNs3wgAAAABJRU5ErkJggg==) center center no-repeat;
    display: inline-block;
    margin-left: 10px
}

.nw-case--st {
    background: #fff;
    counter-reset: topic-list
}

@media only screen and (min-width: 1026px) {
    .nw-case--st {
        margin-top: 30px
    }
}

@media all and (max-width: 1025px) {
    .nw-case--st .scroll-arrow-wrap {
        display: none
    }
}

@media all and (max-width: 1622px) {
    .nw-case--st .nw-container:not(.no-pd) {
        padding: 0 60px
    }
}

@media all and (max-width: 737px) {
    .nw-case--st .nw-container:not(.no-pd) {
        padding: 0 20px
    }
}

.nw-case--st .frame-alt {
    max-width: 1582px
}

.nw-case--st .resp-img {
    display: block;
    width: 100%;
    height: auto
}

.nw-case--st .cs-frame {
    max-width: 980px;
    margin: 0 auto;
    position: relative;
    z-index: 2
}

@media all and (max-width: 1025px) {
    .case-head.p-d {
        padding: 0 60px
    }
}

@media all and (max-width: 737px) {
    .case-head.p-d {
        padding: 0 20px
    }
}

.case-head.bor-bt {
    position: relative;
    margin-bottom: 45px;
    padding-bottom: 15px
}

@media all and (max-width: 1025px) {
    .case-head.bor-bt {
        padding-bottom: 0
    }
}

.case-head.bor-bt:after {
    position: absolute;
    content: "";
    width: 90px;
    height: 1px;
    background: #e3e4e5;
    left: 0;
    bottom: 0
}

@media all and (max-width: 1025px) {
    .case-head.bor-bt:after {
        left: 50%;
        transform: translateX(-50%)
    }
}

@media all and (max-width: 737px) {
    .case-head.bor-bt:after {
        width: 60px
    }
}

.case-heading--title {
    font: 60px/1.2 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #0078ae;
    margin-bottom: 15px;
    letter-spacing: -1.6px
}

.case-heading--title.center {
    text-align: center
}

.case-heading--title.black {
    color: #000
}

.case-heading--title.white {
    color: #fff
}

@media all and (max-width: 1281px) {
    .case-heading--title {
        font-size: 50px
    }
}

@media all and (max-width: 737px) {
    .case-heading--title {
        font-size: 30px;
        margin-bottom: 15px
    }
}

@media all and (max-width: 1025px) {
    .case-heading--title {
        text-align: center
    }
}

.case-descr {
    font: 24px/1.5 roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #5a6063;
    margin-bottom: 35px;
    letter-spacing: -.3px
}

.case-descr.center {
    text-align: center
}

.case-descr.heading {
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1281px) {
    .case-descr {
        font-size: 20px;
        margin-bottom: 25px
    }
}

@media all and (max-width: 1025px) {
    .case-descr {
        padding-bottom: 35px;
        text-align: center;
        margin-bottom: 0
    }
}

@media all and (max-width: 737px) {
    .case-descr {
        font-size: 16px;
        text-align: center
    }
}

.cs-section--base {
    margin-bottom: 85px
}

.cs-section--base.last {
    margin-bottom: 0
}

.cs-section--base.pd-t {
    padding-top: 90px
}

@media all and (max-width: 1025px) {
    .cs-section--base.pd-t {
        padding-top: 70px
    }
}

@media all and (max-width: 737px) {
    .cs-section--base.pd-t {
        padding-top: 50px
    }
}

@media all and (max-width: 1281px) {
    .cs-section--base {
        margin-bottom: 60px
    }
}

@media all and (max-width: 737px) {
    .cs-section--base {
        margin-bottom: 35px
    }
}

.topic-list--wrp.border {
    border: 2px solid #ececed;
    border-radius: 7px;
    padding: 48px 75px 40px
}

@media all and (max-width: 1281px) {
    .topic-list--wrp.border {
        padding: 48px 36px 40px
    }
}

@media all and (max-width: 737px) {
    .topic-list--wrp.border {
        padding: 28px 15px 30px
    }
}

.topic-list--title {
    color: #000;
    font: 28px/1.3 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    margin-bottom: 35px
}

.topic-list--title.center {
    text-align: center
}

@media all and (max-width: 1281px) {
    .topic-list--title {
        font-size: 24px;
        margin-bottom: 25px
    }
}

@media all and (max-width: 737px) {
    .topic-list--title {
        font-size: 18px
    }
}

@media all and (max-width: 1025px) {
    .topic-list--title {
        text-align: center
    }
}

.topic-list {
    display: flex;
    flex-wrap: wrap;
    counter-reset: topic-list
}

.topic-list.arrows .topic-item {
    padding-left: 33px
}

.topic-list.arrows .topic-item:not(.topic-item--col-3) {
    width: 100%;
    box-sizing: border-box
}

.topic-list.arrows .topic-item:before {
    content: "";
    width: 13px;
    height: 15px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAPCAMAAAAI/bVFAAAAilBMVEX///+YyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTwbCldrAAAALXRSTlMA9d4DAf2w0J2xkj+lCQbB21Fw14Y3IOjqIT5kUxFqhIJuV/61RfrHCjLp9hMVib5HAAAAZElEQVR4Xi3LVxLEIBBDQWxYcM45b873v549Yt5fl0oizNwjPxa28U9pyazAgKUisGAmKemUM+eS+K2ZTUvseuaAq7GQGs8JUB6mRaAV2CzOgKeAy5Vwk8D9QXi+gPfHOTI/YAehGA5vpUNP/wAAAABJRU5ErkJggg==);
    position: absolute;
    left: 0;
    top: 6px;
    z-index: 1
}

.topic-list.arrows.orange .topic-item:before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAPCAMAAAAI/bVFAAAAilBMVEX/////0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gD/0gCuNIuXAAAALXRSTlMA9d4DAf2w0J2xkj+lCQbB21Fw14Y3IOjqIT5kUxFqhIJuV/61RfrHCjLp9hMVib5HAAAAZElEQVR4Xi3LVxLEIBBDQWxYcM45b873v549Yt5fl0oizNwjPxa28U9pyazAgKUisGAmKemUM+eS+K2ZTUvseuaAq7GQGs8JUB6mRaAV2CzOgKeAy5Vwk8D9QXi+gPfHOTI/YAehGA5vpUNP/wAAAABJRU5ErkJggg==)
}

.topic-list.arrows.gold .topic-item:before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAPCAMAAAAI/bVFAAAAilBMVEX////Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx37Zx35uzCcEAAAALXRSTlMA9d4DAf2w0J2xkj+lCQbB21Fw14Y3IOjqIT5kUxFqhIJuV/61RfrHCjLp9hMVib5HAAAAZElEQVR4Xi3LVxLEIBBDQWxYcM45b873v549Yt5fl0oizNwjPxa28U9pyazAgKUisGAmKemUM+eS+K2ZTUvseuaAq7GQGs8JUB6mRaAV2CzOgKeAy5Vwk8D9QXi+gPfHOTI/YAehGA5vpUNP/wAAAABJRU5ErkJggg==)
}

.topic-list.uncount .topic-item__text {
    padding-left: 30px;
    position: relative
}

.topic-list.uncount .topic-item__text:before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    z-index: 1;
    height: 74px;
    width: 3px
}

.topic-list.uncount.orange .topic-item__text:before {
    background: #ffd200
}

.topic-list.uncount.gold .topic-item__text:before {
    background: #d9c77e
}

.topic-list.col-2 {
    justify-content: space-between
}

.topic-item {
    position: relative;
    text-align: left;
    margin: 0 0 28px;
    font: 19px/30px roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #5a6063;
    letter-spacing: -.2px
}

@media all and (max-width: 1281px) {
    .topic-item {
        font-size: 17px;
        line-height: 1.4
    }
}

@media all and (max-width: 737px) {
    .topic-item {
        font-size: 15px
    }
}

@media all and (min-width: 1026px) {
    .topic-item:nth-child(3n+2).topic-item--col-3 {
        margin: 0 45px 25px
    }
}

.topic-item--col-3 {
    width: calc(33.33% - 30px)
}

@media all and (max-width: 1025px) {
    .topic-item--col-3 {
        width: 100%
    }
}

.topic-item--col-2 {
    width: 45.5%
}

@media all and (max-width: 1025px) {
    .topic-item--col-2 {
        width: 100%
    }
}

.shift-content {
    background: #fff;
    position: relative;
    z-index: 2
}

@media all and (min-width: 1026px) {
    .shift-content {
        margin-top: -150px
    }
}

.shift-content--up:after {
    content: '';
    display: block;
    clear: both
}

@media all and (min-width: 1026px) {
    .shift-content--up {
        margin-top: -150px;
        padding: 90px 80px 0
    }
}

@media all and (max-width: 1025px) {
    .shift-content--up {
        padding: 60px 0 0
    }
}

@media all and (max-width: 737px) {
    .shift-content--up {
        padding: 40px 0 0
    }
}

.shift-content--up .text-left {
    float: left;
    width: 52%
}

@media all and (max-width: 1281px) {
    .shift-content--up .text-left {
        width: 65%
    }
}

@media all and (max-width: 1025px) {
    .shift-content--up .text-left {
        float: none;
        width: 100%
    }

    .shift-content--up .text-left .case-descr, .shift-content--up .text-left .case-heading--title {
        text-align: center
    }
}

.shift-content--up .img-right {
    float: right;
    width: 370px
}

@media all and (max-width: 1281px) {
    .shift-content--up .img-right {
        width: 30%
    }
}

@media all and (max-width: 1025px) {
    .shift-content--up .img-right {
        float: none;
        width: 100%;
        text-align: center
    }
}

.shift-content--up .img-right img {
    max-width: 370px;
    display: block;
    width: 100%;
    height: auto
}

@media all and (min-width: 1282px) {
    .shift-content--up .img-right img {
        margin-top: -100%
    }
}

@media all and (max-width: 1281px) {
    .shift-content--up .img-right img {
        margin-top: -70%
    }
}

@media all and (max-width: 1025px) {
    .shift-content--up .img-right img {
        display: inline-block;
        max-width: 260px;
        margin-top: 0
    }
}

@media all and (min-width: 1026px) {
    .col-2--content-grid .col-left {
        float: left;
        width: 52%;
        padding-right: 60px
    }
}

@media all and (max-width: 1025px) {
    .col-2--content-grid .col-left {
        text-align: center
    }
}

.col-2--content-grid .col-left .tr-pos {
    margin-top: -52%;
    transform: translateX(100%)
}

.col-2--content-grid .col-right {
    float: left;
    width: 40%
}

@media all and (max-width: 1025px) {
    .col-2--content-grid .col-right {
        width: 100%;
        float: none;
        margin-top: 35px;
        text-align: center
    }
}

@media all and (max-width: 1025px) {
    .product-head:not(.no-pd) {
        padding: 0 60px
    }
}

@media all and (max-width: 737px) {
    .product-head:not(.no-pd) {
        padding: 0 20px
    }
}

.product-head .product-heading--title {
    color: #fff;
    font: 60px/1.2 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    margin-bottom: 15px;
    text-align: center
}

@media all and (max-width: 1281px) {
    .product-head .product-heading--title {
        font-size: 50px
    }
}

@media all and (max-width: 737px) {
    .product-head .product-heading--title {
        font-size: 30px
    }
}

.product-head .product-descr {
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #fff
}

@media all and (max-width: 1025px) {
    .product-head .product-descr {
        font-size: 17px
    }
}

@media all and (max-width: 737px) {
    .product-head .product-descr {
        font-size: 13px
    }
}

.product-head .product-descr p {
    text-align: center;
    margin-bottom: 1.5em
}

.product-head .product-descr p:last-child {
    margin-bottom: 3em
}

.product-section {
    margin-bottom: 130px;
    padding-top: 100px;
    position: relative
}

@media all and (max-width: 1025px) {
    .product-section {
        padding-top: 65px;
        margin-bottom: 70px
    }
}

@media all and (max-width: 737px) {
    .product-section {
        padding-top: 45px;
        margin-bottom: 35px
    }
}

.product-section:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 85%
}

.product-section.tricon:after {
    background: url("../image/tzz_ion-1.jpg") 0 0/cover no-repeat
}

.product-section.engel-volkers:after {
    background: url("../image/tzz_ion-1.png") 0 0/cover no-repeat
}

.product-section .img-wrp {
    text-align: center;
    padding: 0 60px;
    position: relative;
    z-index: 2
}

@media all and (max-width: 737px) {
    .product-section .img-wrp {
        padding: 0 20px
    }
}

.product-section .img-wrp img {
    display: inline-block;
    max-width: 100%
}

.extra-list--content {
    border: 1px solid #dedede
}

.extra-list--content:after {
    content: '';
    display: block;
    clear: both
}

@media all and (min-width: 1026px) {
    .extra-list--content .extra-left {
        float: left;
        width: 50%;
        padding: 7% 50px 2.6% 5%
    }
}

@media all and (max-width: 1025px) {
    .extra-list--content .extra-left {
        padding: 55px 40px 0
    }
}

@media all and (max-width: 737px) {
    .extra-list--content .extra-left {
        padding: 35px 20px 0
    }
}

@media all and (min-width: 1026px) {
    .extra-list--content .extra-right {
        float: left;
        width: 50%;
        position: relative
    }

    .extra-list--content .extra-right img {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        z-index: 9;
        transform: translateY(-9%)
    }
}

@media all and (max-width: 1025px) {
    .extra-list--content .extra-right {
        padding: 0 40px;
        margin-bottom: -65px
    }
}

@media all and (max-width: 737px) {
    .extra-list--content .extra-right {
        padding: 0 20px
    }
}

.extra-list--content .extra-right.eav-img img {
    right: 38px
}

.extra-add--section {
    margin-bottom: 170px
}

@media all and (max-width: 1025px) {
    .extra-add--section {
        margin-bottom: 130px
    }
}

@media all and (max-width: 737px) {
    .extra-add--section {
        margin-bottom: 90px
    }
}

.counters-section--wrp {
    background: #181d22;
    padding: 100px 0 80px;
    margin: 0 0 120px
}

@media all and (max-width: 1025px) {
    .counters-section--wrp {
        padding: 70px 0 80px;
        margin: 0 -40px 45px
    }
}

@media all and (max-width: 737px) {
    .counters-section--wrp {
        padding: 50px 0;
        margin: 0 0 45px
    }
}

.numbers-cnt--list {
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap
}

.numbers-cnt--list.col-4 {
    justify-content: center
}

.numbers-cnt--item {
    padding: 0 20px
}

@media all and (min-width: 738px) {
    .numbers-cnt--item {
        width: 33.33%
    }

    .numbers-cnt--item:not(:last-child) {
        border-right: 1px solid #494c50
    }
}

@media all and (min-width: 738px) {
    .numbers-cnt--item.col-4 {
        width: 25%;
        margin-bottom: 50px
    }

    .numbers-cnt--item.col-4:nth-child(4n) {
        border-right: none
    }
}

@media all and (max-width: 737px) {
    .numbers-cnt--item {
        width: 100%
    }

    .numbers-cnt--item:not(:last-child) {
        margin-bottom: 22px;
        padding-bottom: 22px;
        position: relative
    }

    .numbers-cnt--item:not(:last-child):after {
        content: "";
        position: absolute;
        width: 120px;
        height: 1px;
        background: #42464a;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%)
    }
}

.numbers-cnt--amount {
    font-size: 90px;
    : roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #91c405;
    text-align: center;
    letter-spacing: -3px
}

@media all and (max-width: 1400px) {
    .numbers-cnt--amount {
        font-size: 60px
    }
}

@media all and (max-width: 1025px) {
    .numbers-cnt--amount {
        font-size: 45px
    }
}

.numbers-cnt--text {
    text-align: center;
    font: 28px/1.3 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #fff
}

@media all and (max-width: 1025px) {
    .numbers-cnt--text {
        font-size: 20px
    }
}

.browse-cs-section {
    background: #181d22;
    padding-bottom: 120px
}

@media all and (max-width: 1025px) {
    .browse-cs-section {
        padding-bottom: 65px
    }
}

@media all and (max-width: 1025px) {
    .browse-cs-section {
        padding-bottom: 50px
    }
}

.oth-cs--list {
    display: flex;
    margin-top: 40px;
    flex-wrap: wrap
}

@media all and (max-width: 1025px) {
    .nw-case--st .nw-cs--top-section.top-section .ttl {
        text-align: center
    }

    .nw-case--st .nw-cs--top-section.top-section .ttl img {
        display: inline-block;
        max-width: 260px
    }

    .nw-case--st .nw-cs--top-section.top-section:before {
        height: 80%
    }
}

@media all and (max-width: 646px) {
    .nw-case--st .nw-cs--top-section.top-section:before {
        height: 90%
    }
}

@media all and (max-width: 737px) {
    .nw-case--st .nw-cs--top-section.top-section .ttl {
        margin-bottom: 25px
    }

    .nw-case--st .nw-cs--top-section.top-section .ttl img {
        max-width: 185px
    }
}

.nw-case--st .nw-cs--top-section.top-section .s-left {
    height: 550px !important
}

@media all and (max-width: 1024px) {
    .nw-case--st .nw-cs--top-section.top-section .s-left {
        width: 100%;
        padding: 30px 80px 40px;
        height: auto !important;
        margin-bottom: 0
    }
}

@media all and (max-width: 646px) {
    .nw-case--st .nw-cs--top-section.top-section .s-left {
        padding: 20px 30px 0
    }

    .nw-case--st .nw-cs--top-section.top-section .s-left .s-right-m {
        margin-top: 30px;
        margin-bottom: 0
    }
}

@media all and (max-width: 1024px) {
    .nw-case--st .nw-cs--top-section.top-section .head-anim {
        position: static;
        height: auto;
        text-align: center;
        line-height: 1.5;
        margin-top: 0
    }
}

@media all and (min-width: 1026px) {
    .nw-cs--top-section.top-section.over {
        padding-bottom: 90px
    }
}

@media only screen and (min-width: 1170px) {
    .nw-cs--top-section.top-section .s-left {
        padding-top: 0
    }
}

@media all and (min-width: 1026px) and (max-width: 1600px) {
    .nw-cs--top-section.top-section .s-left {
        padding-left: 60px
    }
}

@media all and (min-width: 1026px) {
    .nw-cs--top-section.top-section .s-left .fade-anim {
        max-width: 550px
    }
}

.nw-cs--top-section.top-section .s-left p {
    color: #fff;
    font: 24px/35px roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1025px) {
    .nw-cs--top-section.top-section .s-left p {
        text-align: center
    }

    .nw-cs--top-section.top-section .s-left p br {
        display: none
    }
}

@media all and (max-width: 737px) {
    .nw-cs--top-section.top-section .s-left p {
        font-size: 16px;
        line-height: 1.4
    }
}

.oth-cs--item {
    width: calc(50% - 10px)
}

@media all and (min-width: 1026px) {
    .oth-cs--item:first-child {
        margin-right: 20px
    }
}

@media all and (max-width: 1025px) {
    .oth-cs--item {
        width: 100%;
        margin-bottom: 25px
    }
}

.oth-cs--link {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1
}

.oth-cs--link img:not(.oth-cs--logo) {
    width: 100%
}

.oth-cs--link:before {
    content: "";
    background: #000;
    opacity: .4;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    transition: opacity .3s
}

.oth-cs--link:hover:before {
    opacity: 0
}

.oth-cs--logo {
    position: absolute;
    left: 50%;
    z-index: 3;
    top: 50%;
    transform: translate3d(-50%, -50%, 0)
}

@media all and (max-width: 1025px) {
    .oth-cs--logo {
        max-width: 240px
    }
}

@media all and (max-width: 737px) {
    .oth-cs--logo {
        max-width: 140px
    }
}

.nw-cs--top-section.tricon-top-section:before {
    background: url("../image/tzz_ion-1.jpg") 0 0/cover no-repeat
}

@media all and (max-width: 1025px) {
    .nw-cs--top-section.tricon-top-section:before {
        background-position: center center
    }
}

.nw-cs--top-section.engel-volkers-top-section:before {
    background: url("../image/tzz_ion-1.jpg") 0 0/cover no-repeat
}

@media all and (max-width: 1025px) {
    .nw-cs--top-section.engel-volkers-top-section:before {
        background-position: center center
    }
}

@media all and (max-width: 1025px) {
    .cell--col-2__list {
        margin-top: 60px
    }
}

.cell--col-2__item {
    display: flex
}

.cell--col-2__item:not(:last-child) {
    margin-bottom: 15px
}

@media all and (max-width: 1025px) {
    .cell--col-2__item {
        flex-wrap: wrap
    }

    .cell--col-2__item.mob-revert {
        flex-direction: column-reverse
    }
}

@media all and (min-width: 1026px) {
    .cell--col-2__unit {
        width: 50%
    }

    .cell--col-2__unit.text {
        display: flex;
        padding-left: 4.2%;
        flex-direction: column
    }

    .cell--col-2__unit.text.first .cell--col-2__unit-inner {
        padding-top: 35%
    }

    .cell--col-2__unit.text .enge {
        padding-top: 25%
    }

    .cell--col-2__unit.pd-l {
        padding-left: 3.8%
    }
}

@media all and (max-width: 1025px) {
    .cell--col-2__unit {
        width: 100%;
        text-align: center
    }
}

.counters-section__descr {
    text-align: center;
    margin-bottom: 50px;
    font: 24px/1 roboto-regular-webfont, Arial, Helvetica, sans-serif;
    color: #758288
}

.counters-section__descr strong {
    color: #fff
}

@media all and (max-width: 737px) {
    .counters-section__descr strong {
        display: block
    }
}

.case-heading--subtitle {
    font: 45px/1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #000;
    margin-bottom: 25px;
    letter-spacing: -1.3px
}

@media all and (max-width: 1281px) {
    .case-heading--subtitle {
        font-size: 36px
    }
}

@media all and (max-width: 1025px) {
    .case-heading--subtitle {
        font-size: 28px;
        text-align: center
    }
}

.topic-item__title {
    font: 28px/1.3 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    color: #000;
    margin-bottom: .7em
}

@media all and (max-width: 1025px) {
    .topic-item__title {
        font-size: 22px
    }
}

.cs-sect-head--img {
    position: relative;
    z-index: 1;
    padding-top: 100px
}

@media all and (max-width: 1281px) {
    .cs-sect-head--img {
        padding-top: 60px
    }
}

@media all and (max-width: 737px) {
    .cs-sect-head--img {
        padding-top: 20px
    }
}

.cs-sect-img {
    margin-top: -11.5%;
    position: relative;
    z-index: -1
}

.cs-sect-img.alt-marg-top {
    margin-top: -10%
}

@keyframes head-anim-tri01 {
    0% {
        opacity: 1;
        transform: translate(10px, -30px)
    }
    100% {
        opacity: 1;
        transform: translate(10px, 20px)
    }
}

@keyframes head-anim-tri02 {
    0% {
        opacity: 0;
        transform: translate(450px, 230px)
    }
    100% {
        opacity: 1;
        transform: translate(450px, 230px)
    }
}

@keyframes head-anim-tri03 {
    0% {
        opacity: 0;
        transform: translate(0, 120px)
    }
    100% {
        opacity: 1;
        transform: translate(0, 120px)
    }
}

.animated .head-anim-tri01 {
    animation: head-anim-tri01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-tri02 {
    animation: head-anim-tri02 1.5s forwards;
    z-index: 2
}

.animated .head-anim-tri03 {
    animation: head-anim-tri03 1.8s forwards;
    z-index: 2
}

@keyframes head-anim-eav01 {
    0% {
        opacity: 1;
        transform: translate(10px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(10px, -10px)
    }
}

@keyframes head-anim-eav02 {
    0% {
        opacity: 0;
        transform: translate(450px, 250px)
    }
    100% {
        opacity: 1;
        transform: translate(450px, 250px)
    }
}

.animated .head-anim-eav01 {
    animation: head-anim-eav01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-eav02 {
    animation: head-anim-eav02 1.5s forwards;
    z-index: 2
}

@media all and (min-width: 1026px) {
    .cell--col-2__list {
        margin-top: -9.2%
    }
}

.sk--solution-banner {
    height: 407px;
    padding: 5.8% 20px 0;
    background-color: #15191d;
    background-image: url("../image/tzz_ion-1.jpg");
    background-repeat: no-repeat;
    background-size: cover
}

@media all and (max-width: 1025px) {
    .sk--solution-banner {
        height: 300px
    }
}

@media only screen and (max-width: 646px) {
    .sk--solution-banner {
        height: 250px
    }
}

.sk--result-section-top {
    background-color: #000;
    background-image: url("../image/tzz_ion-1.png");
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    background-position-y: bottom;
    padding-bottom: 30px
}

.sk--result-section-top img {
    margin-top: -30px
}

.se--intro-ground {
    background: #fff;
    margin-top: -155px;
    border-radius: 5px 5px 0 0;
    padding: 90px 90px 50px
}

.se--intro-ground.no-pad-b .left {
    padding-bottom: 30px
}

@media all and (max-width: 1025px) {
    .se--intro-ground {
        padding: 40px 60px
    }
}

@media all and (max-width: 737px) {
    .se--intro-ground {
        padding: 40px 20px
    }
}

.build-grid {
    display: flex;
    flex-wrap: wrap
}

@media all and (min-width: 1026px) {
    .build-grid.mid-align {
        align-items: center
    }

    .build-grid.btm-align {
        align-items: flex-end
    }
}

.build-grid__col.left {
    width: 44%
}

@media all and (max-width: 1025px) {
    .build-grid__col.left {
        margin-bottom: 40px
    }
}

@media all and (max-width: 737px) {
    .build-grid__col.left {
        margin-bottom: 20px
    }
}

.build-grid__col.left.text {
    padding-right: 26px
}

.build-grid__col.right {
    width: 56%
}

.build-grid__col.right.img {
    padding-left: 26px;
    text-align: right
}

.build-grid__col.invert {
    width: 50%
}

@media all and (max-width: 1025px) {
    .build-grid__col.left, .build-grid__col.right {
        width: 100%
    }
}

.sk--counters-section {
    background: #000;
    border: 1px solid #373737;
    border-radius: 6px;
    padding-top: 55px
}

.sk--case-head {
    padding: 0 90px
}

@media all and (max-width: 1025px) {
    .sk--case-head {
        padding: 0 60px
    }
}

@media all and (max-width: 737px) {
    .sk--case-head {
        padding: 0 20px
    }
}

.sk--localization {
    background: #181d22;
    border-radius: 6px;
    padding: 50px 90px 0
}

.sk--localization.luxor-bg {
    background-image: url("../image/tzz_ion-1.jpg");
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: auto 100%;
    padding-bottom: 50px
}

@media all and (max-width: 1025px) {
    .sk--localization {
        padding: 50px 60px
    }
}

@media all and (max-width: 737px) {
    .sk--localization {
        padding: 40px 20px
    }
}

.sk--localization .case-descr, .sk--localization .case-heading--subtitle, .sk--localization .topic-item {
    color: #fff
}

@media all and (min-width: 1026px) {
    .sk--localization .build-grid {
        align-items: flex-end
    }
}

@media all and (min-width: 1026px) {
    .sk--localization .build-grid__col.right {
        padding: 40px 0 30px 10%
    }

    .sk--localization .build-grid__col.right.invert {
        padding-left: 5%
    }
}

@media all and (max-width: 1025px) {
    .sk-marketing {
        margin-bottom: 60px
    }
}

@media all and (min-width: 1026px) {
    .sk-marketing .build-grid__col.right {
        text-align: right
    }

    .sk-marketing .build-grid__col.left {
        padding: 40px 20px 0 90px
    }
}

.sk--result-section-bottom {
    background: #000;
    padding-bottom: 100px
}

@media all and (max-width: 1025px) {
    .sk--result-section-bottom {
        padding-bottom: 40px
    }
}

.sk--result-section {
    background: #000;
    margin-bottom: 0
}

.sk--numbers-list {
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

@media only screen and (min-width: 1026px) {
    .sk--numbers-list {
        padding-bottom: 40px
    }
}

.sk--numbers-cnt__item {
    width: 25%;
    margin-bottom: 30px;
    padding: 0 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media all and (max-width: 768px) {
    .sk--numbers-cnt__item {
        width: 33%
    }
}

@media only screen and (max-width: 646px) {
    .sk--numbers-cnt__item {
        width: 50%
    }
}

@media only screen and (max-width: 481px) {
    .sk--numbers-cnt__item {
        width: 100%
    }
}

.sk--numbers-cnt__item:after {
    position: absolute;
    top: 50%;
    right: 0;
    width: 1px;
    max-height: 130px;
    height: 80%;
    background: #373737;
    transform: translateY(-50%)
}

@media only screen and (min-width: 769px) {
    .sk--numbers-cnt__item:not(:last-child):not(:nth-child(4n)):after {
        content: ''
    }
}

.sk--numbers-cnt__item .numbers-cnt--amount {
    color: #ffd200
}

.sk--numbers-cnt__item .numbers-cnt--text {
    font: 24px/1.5 roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

@media (max-width: 1281px) {
    .sk--numbers-cnt__item .numbers-cnt--text {
        font-size: 20px
    }
}

@media (max-width: 1025px) {
    .sk--numbers-cnt__item .numbers-cnt--text {
        font-size: 18px
    }
}

@media only screen and (min-width: 1026px) {
    .sk-cs--page .topic-list.col-2 .topic-item {
        margin-bottom: 0
    }
}

@media all and (min-width: 1026px) {
    .sk-cs--page .topic-list {
        margin-top: 30px
    }
}

@media all and (min-width: 1026px) {
    .sk--sol-tr {
        margin-top: -15%;
        transform: translateX(5%)
    }
}

.luxor--solution-banner {
    height: 407px;
    padding: 5.8% 20px 0;
    background-color: #15191d;
    background-image: url("../image/tzz_ion-1.jpg");
    background-repeat: no-repeat;
    background-size: cover
}

@media all and (max-width: 1025px) {
    .luxor--solution-banner {
        height: 300px
    }
}

@media only screen and (max-width: 646px) {
    .luxor--solution-banner {
        height: 250px
    }
}

.luxor--result-section {
    padding-top: 18%
}

.luxor--result-section-top {
    text-align: center;
    background: #0f1215
}

.luxor--result-section-top img {
    margin: -16% 0 60px
}

@media all and (max-width: 1025px) {
    .luxor-marketing {
        margin-bottom: 60px
    }
}

@media all and (min-width: 1026px) {
    .luxor-marketing .build-grid__col.right {
        text-align: right
    }

    .luxor-marketing .build-grid__col.right img {
        display: block;
        margin: 7% -5% 0 -3%;
        max-width: 106%
    }

    .luxor-marketing .build-grid__col.left {
        padding: 40px 20px 0 90px
    }
}

.luxor--result-section-bottom {
    background: #000;
    background: linear-gradient(to bottom, #0f1215 0, #060709 50%, #000 100%);
    padding-bottom: 100px
}

@media all and (max-width: 1025px) {
    .luxor--result-section-bottom {
        padding-bottom: 40px
    }
}

.luxor--counters-section {
    background: #000;
    border: 1px solid #373737;
    border-radius: 5px;
    padding: 60px 3vw
}

.luxor--counters-section .counters-section__descr {
    color: #fff;
    font: 20px/1.7 roboto-light-webfont, Arial, Helvetica, sans-serif
}

.luxor--numbers-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 835px;
    margin: 0 auto
}

.luxor--numbers-cnt__item {
    width: 50%;
    padding: 0 20px;
    margin-bottom: 10vh;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media only screen and (max-width: 481px) {
    .luxor--numbers-cnt__item.last:last-child {
        margin-bottom: 0
    }

    .luxor--numbers-cnt__item.last:last-child:before {
        display: none
    }
}

@media only screen and (min-width: 482px) {
    .luxor--numbers-cnt__item.last {
        margin-bottom: 0
    }

    .luxor--numbers-cnt__item.last:before {
        display: none
    }
}

@media only screen and (max-width: 481px) {
    .luxor--numbers-cnt__item {
        width: 100%
    }
}

.luxor--numbers-cnt__item:before {
    content: "";
    position: absolute;
    bottom: -6vh;
    left: 0;
    height: 1px;
    width: 100%;
    background: #373737
}

.luxor--numbers-cnt__item:nth-child(odd):after {
    content: "";
    position: absolute;
    top: 4%;
    right: 0;
    width: 1px;
    height: 100%;
    background: #373737
}

@media only screen and (max-width: 481px) {
    .luxor--numbers-cnt__item:nth-child(odd):after {
        display: none
    }
}

.luxor--numbers-cnt__item .numbers-cnt-wrap {
    display: flex;
    justify-content: center
}

.luxor--numbers-cnt__item .numbers-cnt--amount {
    color: #d9c77e;
    letter-spacing: -4px;
    line-height: 1
}

.luxor--numbers-cnt__item .numbers-cnt--amount.sub {
    font-size: 28px;
    letter-spacing: 0;
    line-height: 1.2;
    padding: 4px 0 0 20px
}

@media (max-width: 1400px) {
    .luxor--numbers-cnt__item .numbers-cnt--amount.sub {
        font-size: 22px
    }
}

@media (max-width: 1025px) {
    .luxor--numbers-cnt__item .numbers-cnt--amount.sub {
        font-size: 16px
    }
}

.luxor--numbers-cnt__item .numbers-cnt--text {
    font: 24px/1.5 roboto-medium-webfont, Arial, Helvetica, Sans-Serif
}

@media (max-width: 1281px) {
    .luxor--numbers-cnt__item .numbers-cnt--text {
        font-size: 20px
    }
}

@media (max-width: 1025px) {
    .luxor--numbers-cnt__item .numbers-cnt--text {
        font-size: 18px
    }
}

.card-slider {
    display: flex
}

.deliver-card__item {
    text-align: center
}

@media only screen and (min-width: 738px) {
    .deliver-card__item {
        border: 1px solid #dfdfdf;
        padding: 0 20px 60px;
        background: #fff;
        width: calc((100% / 3) - (56px / 3))
    }

    .deliver-card__item:nth-child(2) {
        margin: 0 28px
    }
}

@media only screen and (max-width: 1025px) {
    .deliver-card__item {
        width: calc((100% / 3) - (30px / 3))
    }

    .deliver-card__item:nth-child(2) {
        margin: 0 15px
    }
}

@media only screen and (max-width: 737px) {
    .deliver-card__item {
        padding-top: 80px;
        text-align: center
    }

    .deliver-card__item:nth-child(2) {
        margin: 0
    }
}

.deliver-card__item-inner {
    text-align: center;
    max-width: 300px;
    display: inline-block
}

@media only screen and (max-width: 737px) {
    .deliver-card__item-inner {
        border: 1px solid #dfdfdf;
        padding: 0 30px 30px
    }
}

@media only screen and (max-width: 530px) {
    .deliver-card__item-inner {
        max-width: 240px
    }
}

.deliver-card__item-content {
    max-width: 270px;
    margin: 0 auto
}

.deliver-card__title {
    font: 28px/1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #0078ae;
    border-bottom: 1px solid #d9dadb;
    padding-bottom: 18px;
    margin-bottom: 18px
}

.deliver-card__title span {
    display: block
}

.deliver-card__title strong {
    font: 60px/.7 roboto-bold-webfont, Arial, Helvetica, Sans-Serif
}

@media only screen and (max-width: 1025px) {
    .deliver-card__title {
        font-size: 20px;
        padding-bottom: 12px;
        margin-bottom: 12px
    }

    .deliver-card__title strong {
        font-size: 45px
    }
}

@media only screen and (max-width: 737px) {
    .deliver-card__title {
        font-size: 18px
    }

    .deliver-card__title strong {
        font-size: 42px
    }
}

.deliver-card__subtitle {
    font: 28px/1 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    color: #90c404;
    margin-bottom: 6px
}

.deliver-card__subtitle span {
    display: block
}

.deliver-card__subtitle strong {
    font-size: 45px
}

@media only screen and (max-width: 1025px) {
    .deliver-card__subtitle {
        font-size: 20px;
        padding-bottom: 12px;
        margin-bottom: 12px
    }

    .deliver-card__subtitle strong {
        font-size: 33px
    }
}

@media only screen and (max-width: 737px) {
    .deliver-card__subtitle {
        font-size: 19px
    }

    .deliver-card__subtitle strong {
        font-size: 30px
    }
}

.deliver-card__descr {
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #5a6063
}

@media only screen and (max-width: 1025px) {
    .deliver-card__descr {
        font-size: 17px
    }
}

.deliver-card__img {
    margin-top: -142px
}

@media only screen and (max-width: 1025px) {
    .deliver-card__img {
        margin-top: -80px;
        max-width: 170px
    }
}

.meet-team__section {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("../image/tzz_ion-1.jpg");
    padding: 80px 20px 170px
}

@media only screen and (max-width: 1025px) {
    .meet-team__section {
        padding: 50px 20px 130px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__section {
        padding: 40px 20px
    }
}

.meet-team__pager {
    display: flex;
    justify-content: center
}

@media only screen and (max-width: 737px) {
    .meet-team__pager {
        margin-bottom: 30px
    }
}

.meet-team__slider--wrp {
    position: relative
}

@media only screen and (max-width: 737px) {
    .meet-team__slider--wrp {
        border: 1px solid #464a4d;
        padding: 35px 14px;
        border-radius: 7px
    }
}

.meet-team__slider-container {
    max-width: 730px;
    margin: 0 auto
}

@media only screen and (max-width: 1025px) {
    .meet-team__slider-container {
        padding: 0 50px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__slider-container {
        padding: 0 20px
    }
}

.meet-team__slide .meet-team__slide-inner {
    transform: translate3d(200px, 0, 0);
    opacity: 0;
    transition: transform .3s linear, opacity .3s linear
}

.meet-team__slide.active .meet-team__slide-inner {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

.meet-team__pager--list {
    display: flex;
    align-items: center
}

@media only screen and (min-width: 1026px) {
    .meet-team__pager--list {
        margin-top: -234px
    }
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--list {
        margin-top: -187px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--list {
        flex-direction: column;
        margin-top: 0
    }
}

@media only screen and (min-width: 738px) {
    .meet-team__section-head {
        margin-bottom: 250px
    }
}

.meet-team__container {
    margin: 0 auto;
    max-width: 1100px;
    border-color: #464a4d;
    border-style: solid;
    border-width: 0 1px 1px;
    padding: 0 85px 70px;
    position: relative;
    border-radius: 6px
}

@media only screen and (max-width: 737px) {
    .meet-team__container {
        padding: 0;
        border: none
    }
}

.meet-team__container:after, .meet-team__container:before {
    content: "";
    position: absolute;
    width: 140px;
    top: 0;
    height: 20px;
    border-top: 1px solid #464a4d
}

@media only screen and (max-width: 1025px) {
    .meet-team__container:after, .meet-team__container:before {
        width: 50px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__container:after, .meet-team__container:before {
        display: none
    }
}

.meet-team__container:before {
    left: 0;
    border-top-left-radius: 6px
}

.meet-team__container:after {
    right: 0;
    border-top-right-radius: 6px
}

.meet-team__pager--pin {
    width: 108px;
    height: 108px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    font: 17px/20px "Roboto Bold Condensed";
    color: #fff;
    transition: box-shadow .3s;
    margin-bottom: 11px
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--pin {
        width: 84px;
        height: 84px;
        font-size: 16px;
        line-height: 18px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin {
        font-size: 13px
    }
}

.meet-team__pager--pin.pin0 {
    background: #0084c0;
    margin: 0 18px 0 0;
    width: 126px;
    height: 126px;
    font-size: 20px;
    position: relative
}

.meet-team__pager--pin.pin0:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    background: #969fa1;
    height: 2px;
    width: 52px;
    transform: translateX(30px);
    z-index: 3
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--pin.pin0 {
        width: 96px;
        height: 96px;
        font-size: 17px
    }

    .meet-team__pager--pin.pin0:after {
        width: 42px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin0 {
        margin: 0 0 12px
    }

    .meet-team__pager--pin.pin0:after {
        width: 2px;
        height: 36px;
        transform: translate(0, -10px);
        left: 50%;
        top: 100%
    }
}

.meet-team__pager--pin.pin1 {
    background: #00c6ff;
    width: 112px;
    height: 112px;
    margin-bottom: 0;
    position: relative
}

.meet-team__pager--pin.pin1:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    background: #969fa1;
    height: 2px;
    width: 72px;
    transform: translateX(59px);
    z-index: 3
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--pin.pin1 {
        width: 86px;
        height: 86px
    }

    .meet-team__pager--pin.pin1:after {
        width: 55px;
        transform: translateX(44px)
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin1:after {
        right: 50%;
        width: 2px;
        height: 46px;
        transform: translate(0, 33px)
    }
}

.meet-team__pager--pin.pin2 {
    background: #8900d2;
    position: relative
}

.meet-team__pager--pin.pin2:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-27px);
    z-index: 3
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin2:after {
        width: 2px;
        height: 14px;
        left: 50%;
        top: -17px;
        transform: none
    }
}

.meet-team__pager--pin.pin3 {
    background: #491062;
    position: relative
}

.meet-team__pager--pin.pin3:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-27px);
    z-index: 3
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin3:after {
        width: 2px;
        height: 14px;
        left: 50%;
        top: -17px;
        transform: none
    }
}

.meet-team__pager--pin.pin4 {
    background: #4a06a2;
    position: relative
}

.meet-team__pager--pin.pin4:after {
    content: "";
    position: absolute;
    top: 50%;
    background: #969fa1;
    height: 2px;
    z-index: 3;
    right: 0;
    left: auto;
    transform: translateX(27px);
    width: 37px
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin4 {
        margin: 0 7px
    }

    .meet-team__pager--pin.pin4:after {
        width: 2px;
        height: 23px;
        top: auto;
        bottom: -17px;
        left: 50%;
        transform: none
    }
}

.meet-team__pager--pin.pin5 {
    background: #126d7d;
    position: relative
}

.meet-team__pager--pin.pin5:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    background: #969fa1;
    height: 2px;
    width: 33px;
    transform: translateX(26px);
    z-index: 3
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin5:after {
        top: auto;
        bottom: -12px;
        width: 2px;
        height: 18px;
        left: 50%;
        transform: none
    }
}

.meet-team__pager--pin.pin6 {
    width: 70px;
    height: 70px
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin6 {
        height: 25px;
        margin-bottom: 15px
    }
}

.meet-team__pager--pin.pin7 {
    background: #769b10;
    position: relative
}

.meet-team__pager--pin.pin7:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

.meet-team__pager--pin.pin8 {
    background: #85b111;
    position: relative
}

.meet-team__pager--pin.pin8:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

.meet-team__pager--pin.pin9 {
    background: #8ec12c;
    position: relative
}

.meet-team__pager--pin.pin9:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

.meet-team__pager--pin.pin10 {
    background: #8fc344;
    position: relative
}

.meet-team__pager--pin.pin10:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

.meet-team__pager--pin.pin11 {
    background: #90c45d;
    position: relative
}

.meet-team__pager--pin.pin11:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

.meet-team__pager--pin.pin12 {
    background: #91c676;
    position: relative
}

.meet-team__pager--pin.pin12:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    background: #969fa1;
    height: 2px;
    width: 22px;
    transform: translateX(-37px);
    z-index: 3
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--pin.pin10:after, .meet-team__pager--pin.pin11:after, .meet-team__pager--pin.pin12:after, .meet-team__pager--pin.pin7:after, .meet-team__pager--pin.pin8:after, .meet-team__pager--pin.pin9:after {
        width: 19px;
        transform: translateX(-27px)
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--pin.pin10:after, .meet-team__pager--pin.pin11:after, .meet-team__pager--pin.pin12:after, .meet-team__pager--pin.pin7:after, .meet-team__pager--pin.pin8:after, .meet-team__pager--pin.pin9:after {
        width: 2px;
        height: 13px;
        top: -20px;
        transform: translateX(22px)
    }
}

.meet-team__pager--link {
    display: flex;
    -webkit-tap-highlight-color: transparent !important
}

.meet-team__pager--link.link2 {
    flex-direction: column-reverse
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--link.link2 {
        flex-direction: row-reverse
    }
}

.meet-team__pager--link.active .pin0 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(0, 234, 255, .66)
}

.meet-team__pager--link.active .pin1 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(0, 252, 255, .66)
}

.meet-team__pager--link.active .pin2, .meet-team__pager--link.active .pin3 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(166, 0, 255, .66)
}

.meet-team__pager--link.active .pin4 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(0, 120, 255, .66)
}

.meet-team__pager--link.active .pin5 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(15, 174, 200, .66)
}

.meet-team__pager--link.active .pin7 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(169, 231, 5, .66)
}

.meet-team__pager--link.active .pin8 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(175, 229, 31, .66)
}

.meet-team__pager--link.active .pin9 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(161, 222, 43, .66)
}

.meet-team__pager--link.active .pin10 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(138, 221, 19, .66)
}

.meet-team__pager--link.active .pin11 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(153, 220, 87, .66)
}

.meet-team__pager--link.active .pin12 {
    box-shadow: inset 0 0 0 2px #fff, 0 2px 37px 4px rgba(101, 244, 28, .66)
}

.meet-team__pager--item {
    display: flex
}

.meet-team__pager--item.item1, .meet-team__pager--item.item4 {
    flex-direction: column
}

.meet-team__pager--item.item0, .meet-team__pager--item.item2, .meet-team__pager--item.item3 {
    align-items: center
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item0, .meet-team__pager--item.item2, .meet-team__pager--item.item3 {
        margin-right: 0
    }
}

.meet-team__pager--item.item0 {
    margin: 0 45px 11px 0
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--item.item0 {
        margin: 0 40px 11px 0
    }
}

.meet-team__pager--item.item0 .meet-team__pager--link {
    align-items: center
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item0 {
        margin: 0 0 32px
    }

    .meet-team__pager--item.item0 .meet-team__pager--link {
        flex-direction: column
    }
}

.meet-team__pager--item.item1 {
    justify-content: center;
    margin-right: 20px;
    position: relative
}

.meet-team__pager--item.item1:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #969fa1;
    height: calc(100% - 117px);
    width: 2px;
    transform: translate(-29px, 54px);
    z-index: 3
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--item.item1:before {
        transform: translate(-28px, 42px);
        height: calc(7%)
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item1 {
        margin-right: 0;
        flex-direction: row
    }

    .meet-team__pager--item.item1:before {
        height: 2px;
        width: calc(100% - 82px);
        transform: translate(42px, -19px)
    }
}

@media only screen and (min-width: 738px) {
    .meet-team__pager--item.item2 {
        margin-right: 35px
    }
}

@media only screen and (min-width: 1026px) {
    .meet-team__pager--item.item3 {
        margin-right: 50px
    }
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--item.item3 {
        margin-right: 37px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item3 {
        margin: 0 0 20px
    }
}

.meet-team__pager--item.item4 {
    position: relative
}

.meet-team__pager--item.item4:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #969fa1;
    height: calc(100% - 77px);
    width: 2px;
    transform: translate(-39px, 38px);
    z-index: 3
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--item.item4:before {
        height: calc(39%);
        transform: translate(-27px, 30px)
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item4 {
        flex-direction: row-reverse
    }

    .meet-team__pager--item.item4 .meet-team__pager--link {
        margin: 0 2px
    }

    .meet-team__pager--item.item4:before {
        height: 2px;
        width: calc(100% - 50px);
        top: -52px;
        left: 51px
    }
}

.meet-team__pager--item.item4 .meet-team__pager--pin {
    width: 76px;
    height: 76px;
    margin-bottom: 3px
}

@media only screen and (max-width: 1025px) {
    .meet-team__pager--item.item4 .meet-team__pager--pin {
        width: 60px;
        height: 60px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__pager--item.item4 .meet-team__pager--pin {
        width: 48px;
        height: 48px
    }
}

.meet-team__title {
    font: 45px/1.1 roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    color: #fff;
    margin-bottom: 20px;
    text-align: center
}

@media only screen and (max-width: 1025px) {
    .meet-team__title {
        font-size: 30px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__title {
        font-size: 20px
    }
}

.meet-team__descr {
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, Sans-Serif;
    text-align: center;
    color: #fff
}

@media only screen and (max-width: 1025px) {
    .meet-team__descr {
        font-size: 17px
    }
}

@media only screen and (max-width: 737px) {
    .meet-team__descr {
        font-size: 13px;
        line-height: 18px
    }
}

.marketing-strategy__page--wrp {
    background: #fff
}

.marketing-strategy__page--wrp .ns-see-more {
    padding: 0 20px;
    margin-bottom: 70px
}

@media only screen and (max-width: 1025px) {
    .marketing-strategy__page--wrp .process-section .sec-ttl.ad-pad {
        padding-top: 120px
    }
}

@media only screen and (max-width: 646px) {
    .marketing-strategy__page--wrp .process-section .sec-ttl.ad-pad {
        padding-top: 60px
    }
}

@media all and (max-width: 646px) {
    .marketing-strategy__page--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

.marketing-strategy__page--wrp .pr-icon svg {
    width: 45px;
    height: 45px
}

.marketing-strategy__page--wrp .pr-kick .pr-icon svg {
    stroke: #009ddc;
    fill: #009ddc
}

.marketing-strategy__page--wrp .pr-kick.active .pr-txt {
    color: #009ddc
}

.marketing-strategy__page--wrp .raa .pr-icon svg {
    stroke: #87c556;
    fill: #87c556
}

.marketing-strategy__page--wrp .raa.active .pr-txt {
    color: #87c556
}

.marketing-strategy__page--wrp .ep .pr-icon svg {
    stroke: #f7a53c
}

.marketing-strategy__page--wrp .ep.active .pr-txt {
    color: #f7a53c
}

.marketing-strategy__page--wrp .ccd .pr-icon svg {
    stroke: #a541c0
}

.marketing-strategy__page--wrp .ccd.active .pr-txt {
    color: #a541c0
}

.marketing-strategy__page--wrp .ap .pr-icon svg {
    stroke: #59cfd4
}

.marketing-strategy__page--wrp .ap.active .pr-txt {
    color: #59cfd4
}

.marketing-strategy__page--wrp .active-0 .pr-current-tab {
    background: #009ddc
}

.marketing-strategy__page--wrp .active-0 .pr-current-tab:after {
    border-top-color: #009ddc
}

.marketing-strategy__page--wrp .active-0 .pr-kick .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.marketing-strategy__page--wrp .active-1 .pr-current-tab {
    background: #87c556
}

.marketing-strategy__page--wrp .active-1 .pr-current-tab:after {
    border-top-color: #87c556
}

.marketing-strategy__page--wrp .active-1 .raa .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.marketing-strategy__page--wrp .active-2 .pr-current-tab {
    background: #f7a53c
}

.marketing-strategy__page--wrp .active-2 .pr-current-tab:after {
    border-top-color: #f7a53c
}

.marketing-strategy__page--wrp .active-2 .ep .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.marketing-strategy__page--wrp .active-3 .pr-current-tab {
    background: #a541c0
}

.marketing-strategy__page--wrp .active-3 .pr-current-tab:after {
    border-top-color: #a541c0
}

.marketing-strategy__page--wrp .active-3 .cross-prom .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.marketing-strategy__page--wrp .active-4 .pr-current-tab {
    background: #59cfd4
}

.marketing-strategy__page--wrp .active-4 .pr-current-tab:after {
    border-top-color: #59cfd4
}

.marketing-strategy__page--wrp .active-4 .ap .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.deliver-card--section {
    padding: 70px 20px 150px;
    background: #f9f9f9
}

.deliver-card--section .sec-ttl {
    margin-bottom: 150px
}

@media only screen and (max-width: 1025px) {
    .deliver-card--section .sec-ttl {
        margin-bottom: 80px
    }
}

@media only screen and (max-width: 737px) {
    .deliver-card--section .sec-ttl {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1025px) {
    .deliver-card--section {
        padding: 50px 20px 120px
    }
}

@media only screen and (max-width: 737px) {
    .deliver-card--section {
        padding: 30px 20px 150px
    }
}

.smm-spr1.se-dance {
    background: url("../image/tzz_ion-1.png") -5px -2px no-repeat;
    width: 145px;
    height: 55px
}

.active .smm-spr1.se-dance {
    background-position: -5px -101px
}

.sms-pr-anim101 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 182px;
    height: 262px;
    top: -176px;
    left: 48px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateX(50px)
}

.sms-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 92px;
    height: 213px;
    top: 0;
    left: 59px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.sms-pr-anim103 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 166px;
    height: 288px;
    top: -130px;
    left: -133px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.sms-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 240px;
    top: -136px;
    left: 90px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateX(50px)
}

.sms-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 92px;
    height: 213px;
    left: 173px;
    top: -42px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.sms-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 152px;
    height: 194px;
    left: 15px;
    top: -65px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.sms-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 240px;
    left: 140px;
    top: -135px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateX(0)
}

.sms-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 240px;
    top: -1px;
    left: 164px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.sms-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 201px;
    height: 240px;
    top: -143px;
    left: 7px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.sms-pr-anim304 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 220px;
    height: 201px;
    top: -59px;
    left: -117px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateY(50px)
}

.sms-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 177px;
    height: 334px;
    top: -219px;
    left: 36px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.sms-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 40px;
    height: 189px;
    left: 215px;
    top: -14px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.sms-pr-anim403 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 81px;
    height: 106px;
    left: -74px;
    top: -178px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.sms-pr-anim404 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 125px;
    height: 77px;
    left: 80px;
    top: 201px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateX(50px)
}

.sms-pr-anim405 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 211px;
    height: 133px;
    left: -77px;
    top: 124px;
    z-index: 3;
    transition: all .35s linear 1.5s;
    transform: translateY(50px)
}

.sms-pr-anim406 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 134px;
    height: 225px;
    left: -141px;
    top: -71px;
    z-index: 3;
    transition: all .35s linear 1.8s;
    transform: translateX(50px)
}

.sms-pr-anim501 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 223px;
    height: 339px;
    left: 132px;
    top: -232px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.sms-pr-anim502 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 260px;
    height: 344px;
    left: 52px;
    top: -195px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.sms-pr-anim503 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 258px;
    height: 266px;
    top: -127px;
    left: -16px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.sms-pr-anim504 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 215px;
    height: 213px;
    left: -49px;
    top: -81px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateY(50px)
}

.current .sms-pr-anim101 {
    transform: translateX(0)
}

.current .sms-pr-anim102 {
    transform: translateY(0)
}

.current .sms-pr-anim103 {
    transform: translateX(0)
}

.current .sms-pr-anim201 {
    transform: translateX(50px)
}

.current .sms-pr-anim202, .current .sms-pr-anim203, .current .sms-pr-anim301, .current .sms-pr-anim302, .current .sms-pr-anim303 {
    transform: translateX(0)
}

.current .sms-pr-anim304, .current .sms-pr-anim401 {
    transform: translateY(0)
}

.current .sms-pr-anim402 {
    transform: translateX(0)
}

.current .sms-pr-anim403 {
    transform: translateY(0)
}

.current .sms-pr-anim404 {
    transform: translateX(0)
}

.current .sms-pr-anim405 {
    transform: translateY(0)
}

.current .sms-pr-anim406 {
    transform: translateX(0)
}

.current .sms-pr-anim501, .current .sms-pr-anim502, .current .sms-pr-anim503, .current .sms-pr-anim504 {
    transform: translateY(0)
}

.impact-section {
    background-color: #1a1f24;
    padding: 90px 0
}

@media all and (max-width: 1025px) {
    .impact-section {
        padding: 60px 0
    }
}

@media all and (max-width: 737px) {
    .impact-section {
        padding: 40px 0
    }
}

.impact-grid {
    display: flex
}

@media all and (max-width: 737px) {
    .impact-grid {
        justify-content: center
    }
}

.impact-col.left, .impact-col.right {
    width: calc((100% - 464px) / 2)
}

@media all and (max-width: 1025px) {
    .impact-col.left, .impact-col.right {
        width: calc((100% - 327px) / 2);
        margin-top: -20px
    }
}

@media all and (max-width: 737px) {
    .impact-col.left, .impact-col.right {
        display: none
    }
}

.impact-col.left {
    padding-right: 15px
}

.impact-col.left .impact-item--text {
    text-align: right
}

.impact-col.left .impact-item--text:nth-child(1) {
    padding-top: 10px;
    transform: translateX(13%);
    width: 105%
}

.impact-col.right {
    padding-left: 15px
}

.impact-col.right .impact-item--text {
    text-align: left
}

.impact-col.right .impact-item--text:nth-child(1) {
    padding-top: 10px;
    transform: translateX(-22%)
}

.impact-col.right .impact-item--text:nth-child(2) {
    padding-top: 36px
}

@media all and (max-width: 1025px) {
    .impact-col.right .impact-item--text:nth-child(2) {
        padding-top: 0
    }
}

.impact-col.center {
    width: 464px;
    padding-top: 30px
}

@media all and (max-width: 1025px) {
    .impact-col.center {
        width: 327px
    }
}

@media all and (max-width: 737px) {
    .impact-col.center {
        width: 285px;
        padding-top: 0
    }
}

.impact-col.center .impact-item--text {
    text-align: center;
    padding-top: 15px
}

@media all and (max-width: 737px) {
    .impact-col.center .impact-item--text {
        display: none
    }
}

.impact-item--text {
    color: #fff;
    font: 17px/1.5 roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media all and (max-width: 1025px) {
    .impact-item--text {
        font-size: 13px
    }
}

.impact-item--text:first-child {
    margin-bottom: 90px
}

@media all and (max-width: 1025px) {
    .impact-item--text:first-child {
        margin-bottom: 45px
    }
}

.impact-item--image {
    height: 442px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("../image/tzz_ion-1.png")
}

@media all and (max-width: 1025px) {
    .impact-item--image {
        background-image: url("../images/new-pages-redesign/content-marketing/graph/graph-t.png");
        height: 308px
    }
}

@media all and (max-width: 737px) {
    .impact-item--image {
        background-image: url("../images/new-pages-redesign/content-marketing/graph/graph-t.png");
        height: 285px;
        width: 285px
    }
}

@media all and (max-width: 646px) {
    .cont-marketing__page--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

.cont-marketing__page--wrp .creation .pr-icon svg {
    stroke: #f7a43c;
    fill: #f7a43c;
    width: 100%;
    height: 100%
}

.cont-marketing__page--wrp .creation.active .pr-txt {
    color: #f7a43c
}

.cont-marketing__page--wrp .distrib .pr-icon svg {
    stroke: #9d4f98;
    fill: #9d4f98;
    width: 50px;
    height: 50px
}

.cont-marketing__page--wrp .distrib.active .pr-txt {
    color: #9d4f98
}

.cont-marketing__page--wrp .cross-prom .pr-icon svg {
    stroke: #4dccd1;
    width: 45px;
    height: 45px
}

.cont-marketing__page--wrp .cross-prom.active .pr-txt {
    color: #4dccd1
}

.cont-marketing__page--wrp .active-1 .pr-current-tab {
    background: #f7a43c
}

.cont-marketing__page--wrp .active-1 .pr-current-tab:after {
    border-top-color: #f7a43c
}

.cont-marketing__page--wrp .active-1 .creation .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.cont-marketing__page--wrp .active-2 .pr-current-tab {
    background: #9d4f98
}

.cont-marketing__page--wrp .active-2 .pr-current-tab:after {
    border-top-color: #9d4f98
}

.cont-marketing__page--wrp .active-2 .distrib .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.cont-marketing__page--wrp .active-3 .pr-current-tab {
    background: #4dccd1
}

.cont-marketing__page--wrp .active-3 .pr-current-tab:after {
    border-top-color: #4dccd1
}

.cont-marketing__page--wrp .active-3 .cross-prom .pr-icon svg {
    stroke: #fff;
    fill: #fff
}

.sec-ttl.dark .descr.white {
    color: #fff
}

.cm-pr-anim101 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 233px;
    height: 311px;
    left: 50px;
    top: -144px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(0)
}

.cm-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 156px;
    height: 303px;
    left: -49px;
    top: -98px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.cm-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 214px;
    height: 250px;
    left: 7px;
    top: -70px;
    z-index: 4;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.cm-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 140px;
    height: 219px;
    left: 7px;
    top: -36px;
    z-index: 5;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.cm-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 192px;
    height: 262px;
    top: -245px;
    left: -72px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.cm-pr-anim204 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 167px;
    height: 243px;
    left: -146px;
    top: -169px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateX(50px)
}

.cm-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 281px;
    height: 301px;
    left: -95px;
    top: -67px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.cm-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 245px;
    height: 340px;
    left: -138px;
    top: -115px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.cm-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 234px;
    height: 275px;
    left: 30px;
    top: -96px;
    z-index: 3;
    transition: all .35s linear .3s;
    transform: translateY(50px)
}

.cm-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 287px;
    height: 183px;
    left: -16px;
    top: -158px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.cm-pr-anim403 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 265px;
    height: 200px;
    left: -41px;
    top: -13px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.cm-pr-anim404 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 91px;
    height: 110px;
    left: -56px;
    top: -103px;
    z-index: 3;
    transition: all .35s linear 1.2s;
    transform: translateX(50px)
}

.current .cm-pr-anim101, .current .cm-pr-anim102, .current .cm-pr-anim201, .current .cm-pr-anim202, .current .cm-pr-anim203 {
    transform: translateY(0)
}

.current .cm-pr-anim204 {
    transform: translateX(0)
}

.current .cm-pr-anim301, .current .cm-pr-anim302, .current .cm-pr-anim401 {
    transform: translateY(0)
}

.current .cm-pr-anim402 {
    transform: translateX(0)
}

.current .cm-pr-anim403 {
    transform: translateY(0)
}

.current .cm-pr-anim404 {
    transform: translateX(0)
}

@media all and (min-width: 1025px) {
    .cm--pr-slide.slide02 .t-cell.visual {
        padding-top: 75px
    }
}

@keyframes head-anim-smm01 {
    0%, 100% {
        opacity: 1;
        transform: translate(10px, 10px)
    }
}

@keyframes head-anim-smm02 {
    0% {
        opacity: 0;
        transform: translate(150px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(170px, 125px)
    }
}

@keyframes head-anim-smm03 {
    0% {
        opacity: 0;
        transform: translate(270px, 80px)
    }
    100% {
        opacity: 1;
        transform: translate(270px, 80px)
    }
}

@keyframes head-anim-smm04 {
    0% {
        opacity: 0;
        transform: translate(0, 0)
    }
    100% {
        opacity: 1;
        transform: translate(170px, -10px)
    }
}

@keyframes head-anim-smm05 {
    0% {
        opacity: 0;
        transform: translate(-20px, 77px)
    }
    100% {
        opacity: 1;
        transform: translate(-20px, 77px)
    }
}

.animated .head-anim-smm01 {
    animation: head-anim-smm01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-smm02 {
    animation: head-anim-smm02 1.5s forwards;
    z-index: 2
}

.animated .head-anim-smm03 {
    animation: head-anim-smm03 1.8s forwards;
    z-index: 2
}

.animated .head-anim-smm04 {
    animation: head-anim-smm04 2.5s forwards;
    z-index: 3
}

.animated .head-anim-smm05 {
    animation: head-anim-smm05 2.5s forwards;
    z-index: 3
}

.smm-integration--wrp {
    background: #151515;
    padding: 80px 0 135px
}

@media all and (max-width: 1399px) {
    .smm-integration--wrp {
        padding: 80px 20px 135px
    }
}

@media all and (max-width: 1026px) {
    .smm-integration--wrp {
        padding: 40px 20px
    }
}

.nw-container--xs {
    max-width: 1100px;
    margin: 0 auto
}

.channel-section {
    padding-top: 70px
}

@media all and (max-width: 1026px) {
    .channel-section {
        padding-top: 40px
    }
}

.channel-title {
    font: 45px/1.1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    color: #fff;
    margin-bottom: 35px;
    text-align: center
}

@media all and (max-width: 646px) {
    .channel-title {
        font-size: 30px
    }
}

@media all and (min-width: 1026px) {
    .channel-list:after {
        content: '';
        display: block;
        clear: both
    }
}

@media all and (max-width: 1025px) {
    .channel-list {
        display: flex;
        flex-wrap: wrap
    }
}

.channel-left, .channel-right {
    width: 50%
}

@media all and (min-width: 1026px) {
    .channel-left, .channel-right {
        float: left
    }
}

@media all and (max-width: 737px) {
    .channel-left, .channel-right {
        width: 100%
    }
}

@media all and (max-width: 737px) {
    .channel-left {
        margin-bottom: 30px
    }
}

.channel-right {
    position: relative
}

@media all and (min-width: 1400px) {
    .channel-right {
        transform: translateX(-30%)
    }
}

@media all and (max-width: 1399px) and (min-width: 1025px) {
    .channel-right {
        transform: translateX(-40%)
    }
}

@media all and (max-width: 1025px) {
    .channel-right {
        display: flex;
        align-items: center
    }
}

.channel-right .channel-img {
    position: absolute;
    width: auto;
    max-width: none
}

@media all and (max-width: 1399px) {
    .channel-right .channel-img {
        transform: scale(.75)
    }
}

@media all and (max-width: 1025px) {
    .channel-right .channel-img {
        position: static;
        transform: none;
        width: 100%
    }
}

.int-item--title {
    font: 28px/1.5 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    color: #fff;
    margin-bottom: 10px
}

@media all and (max-width: 1025px) {
    .int-item--title {
        font-size: 20px
    }
}

.f-ad--list {
    font-size: 17px;
    color: #fff;
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

.int-item {
    padding: 30px 60px 35px;
    background: #212121;
    border-radius: 7px
}

.int-item:not(:last-child) {
    margin-bottom: 5px
}

@media all and (max-width: 1025px) {
    .int-item {
        padding: 20px
    }
}

.f-ad--item {
    position: relative;
    padding-left: 30px
}

.f-ad--item:not(:last-child) {
    margin-bottom: 15px
}

.f-ad--item:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 16px;
    height: 18px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAQCAMAAAAs2N9uAAAAUVBMVEUAAACYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTyYyTx3wM/5AAAAGnRSTlMABvXdFg3AjmFaLPClItLGtrOmloJ/aE5LNSkDUTcAAABwSURBVBjTXY9JEoAgDAQVZBH3Xef/D3VQSoG+ELpSSaZIKYucStq8RwOtSpQB0HSxqUHO2DhBs8VGSZoprNmfZ6SR6l0zYGa10gj3NrWs++4AqcMtC0jjR5tvruXXo6M0l/RGVEk0TWWzcIajc9xf3tDwBv/LPOvUAAAAAElFTkSuQmCC) center center no-repeat;
    z-index: 2
}

.channel-list {
    margin-bottom: 75px
}

.smm-exm--item {
    display: flex;
    flex-wrap: wrap
}

.smm-exm--item:not(:last-child) {
    margin-bottom: 27px
}

.smm-exm--unit {
    font: 20px/1.5 roboto-light-webfont, Arial, Helvetica, sans-serif
}

.smm-exm--unit.left {
    width: 41%;
    background: #212121;
    padding: 45px;
    color: #fff
}

.smm-exm--unit.right {
    width: 59%;
    background: #fff;
    padding: 45px;
    color: #5a6063
}

@media all and (max-width: 767px) {
    .smm-exm--unit {
        font-size: 16px
    }

    .smm-exm--unit.left, .smm-exm--unit.right {
        padding: 20px
    }
}

@media all and (max-width: 646px) {
    .smm-exm--unit.left, .smm-exm--unit.right {
        width: 100%
    }
}

.smm-exm--title {
    font: 28px/1 roboto-bold-webfont, Arial, Helvetica, Sans-Serif;
    color: #9ac91a;
    margin-bottom: 15px
}

@media all and (max-width: 646px) {
    .smm-exm--title {
        font-size: 22px;
        text-align: center
    }
}

@media all and (min-width: 1025px) {
    .smm-page--wrp .simple-slider .t-cell.txt {
        padding: 40px 0 0
    }
}

.smm-spr1 {
    background: url("../image/tzz_ion-1.png");
    display: inline-block
}

.smm-spr1.se-king {
    width: 148px;
    height: 53px;
    background-position: -18px 178px
}

.smm-spr1.se-amf {
    width: 100px;
    height: 77px;
    background-position: 711px 190px
}

.smm-spr1.se-hue {
    width: 123px;
    height: 60px;
    background-position: 436px 180px
}

.smm-spr1.se-flashp {
    width: 180px;
    height: 50px;
    background-position: 198px 177px
}

.active .smm-spr1.se-king {
    background-position: -18px 83px
}

.active .smm-spr1.se-amf {
    background-position: 711px 95px
}

.active .smm-spr1.se-hue {
    background-position: 436px 85px
}

.active .smm-spr1.se-flashp {
    background-position: 198px 82px
}

@media all and (max-width: 1399px) {
    .nw--bw--slider {
        margin: 0 -20px
    }
}

@media all and (max-width: 646px) {
    .nw-slider--item.txt-slider .t-cell.visual {
        display: block
    }
}

@media all and (min-width: 1026px) {
    .nw-slider--item.txt-slider p:not(.size02) {
        font: 20px/1.4 roboto-light-webfont, sans-serif
    }
}

@media all and (max-width: 646px) {
    .smm-page--wrp .simple-slider .t-cell.alt-view .size02 {
        font-size: 24px
    }
}

@media all and (max-width: 646px) {
    .smm-page--wrp .slider-section.nw--bw--slider {
        padding-top: 40px
    }
}

@media all and (max-width: 1025px) {
    .smm-page--wrp .bsp-section .nw-slider--item {
        padding-bottom: 40px
    }
}

.smm-page--wrp .smm-r {
    padding: 0 0 65px;
    background: #fff
}

@media all and (max-width: 646px) {
    .smm-page--wrp .tab-slider-pager:not(.visual) {
        height: 80px
    }

    .smm-page--wrp .tab-slider-pager:not(.visual) > a {
        display: block
    }

    .smm-page--wrp .tab-slider-pager:not(.visual) > a span {
        display: inline-block;
        height: 80px
    }
}

@media all and (min-width: 1026px) {
    .smm-page--wrp .nw--bw--slider {
        padding: 0 80px 70px
    }
}

.smm-page--wrp .seo-pr--slider .pr-slider-pager a:nth-child(4) {
    stroke: #57cfd4
}

.smm-page--wrp .seo--color .active-3 .pr-current-tab {
    background: #57cfd4
}

.smm-page--wrp .seo--color .active-3 .pr-current-tab:after {
    border-top-color: #57cfd4
}

.smm-pr-anim101 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 166px;
    height: 288px;
    top: 38px;
    left: 225px;
    z-index: 5;
    transform: translateX(40px);
    transition: all .35s linear .3s
}

.smm-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 99px;
    height: 230px;
    top: -34px;
    left: 101px;
    z-index: 5;
    transform: translateY(40px);
    transition: all .35s linear .7s
}

.smm-pr-anim103 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 95px;
    height: 109px;
    left: 29px;
    top: -82px;
    z-index: 3;
    transform: translateY(40px);
    transition: all .35s linear .9s
}

.smm-pr-anim104 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 211px;
    height: 245px;
    top: -183px;
    left: 144px;
    z-index: 3;
    transform: translateY(40px);
    transition: all .35s linear 1.1s
}

.smm-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 250px;
    height: 311px;
    top: -143px;
    left: 16px;
    z-index: 3;
    transition: all .35s linear .3s
}

.smm-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 42px;
    height: 65px;
    top: -107px;
    left: 170px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.smm-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 209px;
    height: 148px;
    top: -164px;
    left: -48px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateY(50px)
}

.smm-pr-anim204 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 166px;
    height: 288px;
    top: -7px;
    left: 51px;
    z-index: 3;
    transition: all .35s linear 1.1s;
    transform: translateX(50px)
}

.smm-pr-anim205 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 50px;
    height: 84px;
    top: -106px;
    left: -40px;
    z-index: 3;
    transition: all .35s linear 1.4s;
    transform: translateX(50px)
}

.smm-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 250px;
    height: 311px;
    top: -121px;
    left: 13px;
    z-index: 3;
    transition: all .35s linear .3s
}

.smm-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 42px;
    height: 65px;
    top: -27px;
    left: 143px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateX(50px)
}

.smm-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 209px;
    height: 148px;
    top: -152px;
    left: -85px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.smm-pr-anim304 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 50px;
    height: 84px;
    top: -82px;
    left: -53px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.smm-pr-anim305 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 108px;
    height: 151px;
    top: -30px;
    left: -97px;
    z-index: 3;
    transition: all .35s linear 1.1s;
    transform: translateY(50px)
}

.smm-pr-anim306 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 187px;
    height: 223px;
    top: 13px;
    left: 28px;
    z-index: 3;
    transition: all .35s linear 1.4s;
    transform: translateX(50px)
}

.smm-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 211px;
    height: 245px;
    top: -186px;
    left: 185px;
    z-index: 3;
    transform: translateY(40px);
    transition: all .35s linear .3s
}

.smm-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 42px;
    height: 65px;
    top: -133px;
    left: 205px;
    z-index: 3;
    transition: all .35s linear .6s;
    transform: translateY(50px)
}

.smm-pr-anim403 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 50px;
    height: 84px;
    top: -133px;
    left: 140px;
    z-index: 3;
    transition: all .35s linear .9s;
    transform: translateX(50px)
}

.smm-pr-anim404 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 50px;
    height: 84px;
    top: -155px;
    left: 85px;
    z-index: 3;
    transition: all .35s linear 1.1s;
    transform: translateX(50px)
}

.smm-pr-anim405 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 152px;
    height: 194px;
    left: 79px;
    top: -34px;
    z-index: 3;
    transition: all .35s linear 1.4s;
    transform: translateX(50px)
}

.current .smm-pr-anim101 {
    transform: translateX(0)
}

.current .smm-pr-anim102, .current .smm-pr-anim103 {
    transform: translateY(0)
}

.current .smm-pr-anim202 {
    transform: translateX(0)
}

.current .smm-pr-anim203 {
    transform: translateY(0)
}

.current .smm-pr-anim204, .current .smm-pr-anim205, .current .smm-pr-anim302 {
    transform: translateX(0)
}

.current .smm-pr-anim303 {
    transform: translateY(0)
}

.current .smm-pr-anim304 {
    transform: translateX(0)
}

.current .smm-pr-anim305 {
    transform: translateY(0);
    transform: translateX(0)
}

.current .smm-pr-anim402 {
    transform: translateY(0)
}

.current .smm-pr-anim403, .current .smm-pr-anim404, .current .smm-pr-anim405 {
    transform: translateX(0)
}

@media all and (max-width: 646px) {
    .spr-page--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

@media all and (max-width: 646px) {
    .spr-page--wrp .simple-slider-holder {
        width: 100%;
        max-width: 100%
    }
}

@keyframes head-anim-spr01 {
    0%, 100% {
        opacity: 1;
        transform: translate(15px, 0)
    }
}

@keyframes head-anim-spr02 {
    0% {
        opacity: 0;
        transform: translate(90px, 90px)
    }
    100% {
        opacity: 1;
        transform: translate(90px, 90px)
    }
}

@keyframes head-anim-spr03 {
    0% {
        opacity: 0;
        transform: translate(345px, 45px)
    }
    100% {
        opacity: 1;
        transform: translate(345px, 45px)
    }
}

.animated .head-anim-spr01 {
    animation: head-anim-spr01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-spr02 {
    animation: head-anim-spr02 1.5s forwards;
    z-index: 2
}

.animated .head-anim-spr03 {
    animation: head-anim-spr03 1.5s forwards;
    z-index: 2
}

@keyframes head-anim-sl01 {
    0%, 100% {
        opacity: 1;
        transform: translate(320px, 40px)
    }
}

@keyframes head-anim-sl02 {
    0% {
        opacity: 0;
        transform: translate(355px, 295px)
    }
    100% {
        opacity: 1;
        transform: translate(355px, 295px)
    }
}

@keyframes head-anim-sl03 {
    0% {
        opacity: 0;
        transform: translate(150px, 55px)
    }
    100% {
        opacity: 1;
        transform: translate(0, 55px)
    }
}

@keyframes head-anim-sl04 {
    0% {
        opacity: 0;
        transform: translate(100px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-130px, 120px)
    }
}

@keyframes head-anim-sl05 {
    0% {
        opacity: 0;
        transform: translate(200px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-155px, 230px)
    }
}

@keyframes head-anim-sl06 {
    0% {
        opacity: 0;
        transform: translate(200px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-20px, 310px)
    }
}

.animated .head-anim-sl01 {
    animation: head-anim-sl01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-sl02 {
    animation: head-anim-sl02 1.5s forwards;
    z-index: 2
}

.animated .head-anim-sl03 {
    animation: head-anim-sl03 1.8s forwards;
    z-index: 3
}

.animated .head-anim-sl04 {
    animation: head-anim-sl04 2.2s forwards;
    z-index: 2
}

.animated .head-anim-sl05 {
    animation: head-anim-sl05 2.5s forwards;
    z-index: 4
}

.animated .head-anim-sl06 {
    animation: head-anim-sl06 2.5s forwards;
    z-index: 5
}

.dark-services--section {
    background: #242b32;
    padding: 80px 0 200px
}

.dark-services--section a {
    color: inherit
}

@media only screen and (max-width: 992px) {
    .dark-services--section {
        padding: 80px 0
    }
}

.nw--service-item {
    padding: 58px 0;
    background: #161616;
    position: relative
}

.nw--service-item:not(:last-child) {
    margin-bottom: 29px
}

@media only screen and (max-width: 992px) {
    .nw--service-item {
        width: calc(50% - 15px);
        padding: 25px 0 40px
    }
}

@media only screen and (max-width: 646px) {
    .nw--service-item {
        width: 100%
    }
}

.nw--service-item:after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 450px;
    height: 400px;
    left: 0;
    background-size: contain;
    z-index: 1
}

@media only screen and (max-width: 992px) {
    .nw--service-item:after {
        width: 100%;
        background-size: 100%
    }
}

.nw--service-item.strategy:after {
    background: url("../image/tzz_ion-1.jpg") left top no-repeat
}

@media only screen and (max-width: 992px) {
    .nw--service-item.strategy:after {
        background-size: 100%
    }
}

.nw--service-item.branding-design:after {
    background: url("../image/tzz_ion-1.jpg") left top no-repeat
}

@media only screen and (max-width: 992px) {
    .nw--service-item.branding-design:after {
        background-size: 100%
    }
}

.nw--service-item.web-dev:after {
    background: url("../image/tzz_ion-1.jpg") left top no-repeat
}

@media only screen and (max-width: 992px) {
    .nw--service-item.web-dev:after {
        background-size: 100%
    }
}

.nw--service-item.mob-apps:after {
    background: url("../image/tzz_ion-1.jpg") left top no-repeat
}

@media only screen and (max-width: 992px) {
    .nw--service-item.mob-apps:after {
        background-size: 100%
    }
}

.nw--service-item.digital-marketing:after {
    background: url("../image/tzz_ion-1.jpg") left top no-repeat
}

@media only screen and (max-width: 992px) {
    .nw--service-item.digital-marketing:after {
        background-size: 100%
    }
}

.nw--service-item__title {
    font: 45px/1 roboto-medium-webfont, Arial;
    margin-bottom: 12px;
    transition: color .2s
}

@media only screen and (max-width: 992px) {
    .nw--service-item__title {
        font-size: 28px;
        text-align: center
    }
}

.nw--service-item__title.st {
    color: #71980d
}

.nw--service-item__title.bld {
    color: #d57e0e
}

.nw--service-item__title.wd {
    color: #872f9f
}

.nw--service-item__title.ma {
    color: #aa4141
}

.nw--service-item__title.dm {
    color: #0078ae
}

.nw--service-item__title:hover {
    color: #fff
}

.nw--service-item__content {
    position: relative;
    z-index: 2;
    color: #fff;
    font: 20px/32px roboto-light-webfont, Arial, Helvetica, sans-serif
}

@media only screen and (min-width: 993px) {
    .nw--service-item__content {
        width: 42%;
        margin: 0 35px
    }
}

@media only screen and (max-width: 992px) {
    .nw--service-item__content {
        text-align: center;
        font-size: 16px;
        margin-bottom: 50px
    }
}

.nw--service-item__content p {
    margin-bottom: 25px
}

@media only screen and (max-width: 992px) {
    .nw--services-list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap
    }
}

.nw--service-item__wrp {
    max-width: 1220px;
    margin: 0 auto;
    display: flex;
    padding: 0 20px
}

@media only screen and (max-width: 992px) {
    .nw--service-item__wrp {
        flex-direction: column;
        align-items: center
    }
}

.nw--service-item__nav {
    position: relative;
    z-index: 2
}

@media only screen and (min-width: 993px) {
    .nw--service-item__nav {
        width: calc(37% - 70px)
    }
}

.nw--service-item__logo {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center
}

@media only screen and (min-width: 993px) {
    .nw--service-item__logo {
        width: 21%
    }
}

@media only screen and (max-width: 646px) {
    .nw--service-item__logo img {
        max-width: 150px
    }
}

.service-nav__list {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media only screen and (min-width: 993px) {
    .service-nav__list {
        height: 249px;
        padding-left: 80px
    }
}

.service-nav__list.green {
    color: #71980d
}

.service-nav__list.green a:before {
    border-color: #71980d
}

.service-nav__list.orange {
    color: #d57e0e
}

.service-nav__list.orange a:before {
    border-color: #d57e0e
}

.service-nav__list.purple {
    color: #872f9f
}

.service-nav__list.purple a:before {
    border-color: #872f9f
}

.service-nav__list.red {
    color: #aa4141
}

.service-nav__list.red a:before {
    border-color: #aa4141
}

.service-nav__list.blue {
    color: #0078ae
}

.service-nav__list.blue a:before {
    border-color: #0078ae
}

.service-nav__list a:hover:before {
    border-color: #fff
}

.service-nav__list:before {
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    height: 100%;
    width: 57px;
    background: url("../image/tzz_ion-1.png") center center no-repeat
}

@media only screen and (max-width: 992px) {
    .service-nav__list:before {
        background: url("https://www.prismaxel.com/images/new-pages-redesign/service-landing/list_long-rotate.png.png") center center no-repeat;
        width: 100%;
        height: 30px
    }
}

@media only screen and (min-width: 993px) {
    .service-nav__list.big {
        height: 300px
    }
}

.service-nav__list.big:before {
    background: url("../image/tzz_ion-1.png") center center no-repeat
}

@media only screen and (max-width: 992px) {
    .service-nav__list.big:before {
        background: url("https://www.prismaxel.com/images/new-pages-redesign/service-landing/list_long-rotate.png.png") center center no-repeat;
        width: 100%;
        height: 30px
    }
}

.service-nav__list.big .service-nav__item {
    margin-bottom: 14px
}

.service-nav__list.big .service-nav__item:last-child {
    margin-bottom: 0
}

@media only screen and (max-width: 992px) {
    .service-nav__list.big .service-nav__item {
        margin-bottom: 10px
    }
}

.service-nav__item {
    margin-bottom: 22px
}

.service-nav__item:last-child {
    margin-bottom: 0
}

@media only screen and (max-width: 992px) {
    .service-nav__item {
        margin-bottom: 10px
    }
}

.service-nav__item a {
    transition: color .2s;
    font: 20px/1 roboto-bold-webfont, Arial;
    position: relative
}

@media only screen and (max-width: 992px) {
    .service-nav__item a {
        font-size: 16px
    }
}

.service-nav__item a:before {
    content: "";
    width: 6px;
    height: 6px;
    border: 3px solid #fff;
    border-width: 3px 3px 0 0;
    transform: rotate(45deg);
    display: inline-block;
    position: absolute;
    left: -26px;
    top: 9px;
    transition: all .2s linear
}

.service-nav__item:hover a {
    color: #fff
}

.btn-wrp .vm-btn {
    position: relative;
    text-transform: uppercase;
    font: 16px/1 roboto-bold-webfont, Arial;
    padding: 0 20px 12px 0;
    transition: color .2s
}

.btn-wrp .vm-btn:after {
    content: "";
    width: 6px;
    height: 6px;
    border: 3px solid #fff;
    border-width: 3px 3px 0 0;
    transform: rotate(45deg);
    display: inline-block;
    position: absolute;
    right: 2px;
    top: 7px;
    transition: all .2s
}

.btn-wrp .vm-btn:before {
    content: "";
    width: 100%;
    height: 3px;
    background: #393939;
    position: absolute;
    left: 0;
    bottom: 4px;
    transition: all .2s
}

.btn-wrp .vm-btn.green {
    color: #71980d
}

.btn-wrp .vm-btn.green:hover {
    color: #fff
}

.btn-wrp .vm-btn.green:hover:after {
    border-color: #fff
}

.btn-wrp .vm-btn.green:hover:before {
    background: #71980d
}

.btn-wrp .vm-btn.green:after {
    border-color: #71980d
}

.btn-wrp .vm-btn.orange {
    color: #d57e0e
}

.btn-wrp .vm-btn.orange:hover {
    color: #fff
}

.btn-wrp .vm-btn.orange:hover:after {
    border-color: #fff
}

.btn-wrp .vm-btn.orange:hover:before {
    background: #d57e0e
}

.btn-wrp .vm-btn.orange:after {
    border-color: #d57e0e
}

.btn-wrp .vm-btn.purple {
    color: #872f9f
}

.btn-wrp .vm-btn.purple:hover {
    color: #fff
}

.btn-wrp .vm-btn.purple:hover:after {
    border-color: #fff
}

.btn-wrp .vm-btn.purple:hover:before {
    background: #872f9f
}

.btn-wrp .vm-btn.purple:after {
    border-color: #872f9f
}

.btn-wrp .vm-btn.red {
    color: #aa4141
}

.btn-wrp .vm-btn.red:hover {
    color: #fff
}

.btn-wrp .vm-btn.red:hover:after {
    border-color: #fff
}

.btn-wrp .vm-btn.red:hover:before {
    background: #aa4141
}

.btn-wrp .vm-btn.red:after {
    border-color: #aa4141
}

.btn-wrp .vm-btn.blue {
    color: #0078ae
}

.btn-wrp .vm-btn.blue:hover {
    color: #fff
}

.btn-wrp .vm-btn.blue:hover:after {
    border-color: #fff
}

.btn-wrp .vm-btn.blue:hover:before {
    background: #0078ae
}

.btn-wrp .vm-btn.blue:after {
    border-color: #0078ae
}

@media all and (min-width: 1301px) and (max-width: 1600px) {
    .nw--service-page__wrp .head-anim {
        margin-left: 16%
    }
}

@media all and (max-width: 1600px) {
    .nw--service-page__wrp .head-anim .wide-mode {
        transform: scale(.8);
        margin-left: 80px
    }
}

@media all and (max-width: 1200px) {
    .nw--service-page__wrp .head-anim .wide-mode {
        transform: scale(.7)
    }
}

@keyframes head-anim-em01 {
    0%, 100% {
        opacity: 1;
        transform: translate(-75px, 30px)
    }
}

@keyframes head-anim-em02 {
    0% {
        opacity: 0;
        transform: translate(90px, 30px)
    }
    100% {
        opacity: 1;
        transform: translate(90px, 30px)
    }
}

.animated .head-anim-em01 {
    animation: head-anim-em01 1.2s forwards;
    z-index: 1
}

.animated .head-anim-em02 {
    animation: head-anim-em02 1.5s forwards;
    z-index: 2
}

.em-page--wrp {
    background: #fff
}

@media all and (max-width: 646px) {
    .em-page--wrp .anim-p--vs {
        margin-bottom: 0
    }
}

@media all and (max-width: 646px) {
    .em-page--wrp .txt-slider .t-cell.visual {
        display: block
    }
}

.em-page--wrp .seo-pr--slider .pr-slider-pager a:nth-child(3) {
    stroke: #c07cd4
}

.em-page--wrp .seo-pr--slider .pr-slider-pager a:nth-child(4) {
    stroke: #f9bb6c
}

.em-page--wrp .active-2 .pr-current-tab {
    background: #c07cd4
}

.em-page--wrp .active-2 .pr-current-tab:after {
    border-top-color: #c07cd4
}

.em-page--wrp .active.design .pr-txt {
    color: #c07cd4
}

.em-page--wrp .active.dev .pr-txt {
    color: #f9bb6c
}

.em-page--wrp .active-3 .pr-current-tab {
    background: #f9bb6c
}

.em-page--wrp .active-3 .pr-current-tab:after {
    border-top-color: #f9bb6c
}

.em-page--wrp .nw--case-std__item {
    margin-bottom: 30px
}

@media all and (max-width: 646px) {
    .em-page--wrp .nw--case-std__item {
        margin-bottom: 0
    }
}

@media all and (min-width: 1401px) {
    .em-page--wrp .nw--case-std__item .col-left {
        padding-top: 80px
    }
}

@media all and (max-width: 646px) {
    .em-page--wrp .nw--case-std__item .col-right {
        margin-top: 40px
    }
}

.em-page--wrp .anim-img {
    background-size: cover
}

@media all and (max-width: 768px) {
    .em-page--wrp .pr-slider .t-cell.txt {
        margin-bottom: 30px
    }
}

.em-page--wrp .pr-slider .t-cell.visual .wide-mode {
    top: 0;
    left: 0
}

.em-page--wrp .pr-slider .item {
    padding-top: 0
}

.em-page--wrp .pr-slider .sub-descr {
    : roboto-regular-webfont, Arial, Helvetica, sans-serif
}

@media all and (min-width: 647px) {
    .em-page--wrp .nw--case-std__item.revert .col-left {
        padding-right: 75px
    }
}

.em-pr-anim101 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 510px;
    height: 256px;
    left: 35px;
    top: -124px;
    transition: all .35s linear;
    z-index: 1;
    transform: translateX(-40px)
}

.em-pr-anim102 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 196px;
    height: 309px;
    top: -252px;
    left: 188px;
    transition: all .35s linear;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim103 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 121px;
    height: 279px;
    top: -207px;
    left: 127px;
    transition: all .35s linear .4s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim201 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 510px;
    height: 256px;
    left: 35px;
    top: -124px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateX(-40px)
}

.em-pr-anim202 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 163px;
    height: 256px;
    top: -252px;
    left: 315px;
    transition: all .35s linear .6s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim203 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 281px;
    height: 321px;
    top: -234px;
    left: 131px;
    transition: all .35s linear .9s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim204 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 121px;
    height: 279px;
    top: -195px;
    left: 133px;
    transition: all .35s linear 1.2s;
    z-index: 1;
    transform: translateX(-40px)
}

.em-pr-anim301 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 315px;
    height: 202px;
    top: -22px;
    left: 248px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateX(-40px)
}

.em-pr-anim302 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 178px;
    height: 244px;
    top: -247px;
    left: 224px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateX(-40px)
}

.em-pr-anim303 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 189px;
    height: 163px;
    top: -128px;
    left: 140px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim304 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 215px;
    height: 121px;
    top: -2px;
    left: 25px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim401 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 499px;
    height: 394px;
    top: -269px;
    left: 36px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim402 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 275px;
    height: 206px;
    top: -91px;
    left: 26px;
    transition: all .35s linear .6s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim501 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 145px;
    height: 282px;
    top: -261px;
    left: 308px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim502 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 108px;
    height: 124px;
    top: -242px;
    left: 219px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateY(-40px)
}

.em-pr-anim503 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 292px;
    height: 211px;
    top: -107px;
    left: 68px;
    transition: all .35s linear .3s;
    z-index: 1;
    transform: translateX(-40px)
}

.current .em-pr-anim101 {
    transform: translateX(0)
}

.current .em-pr-anim102, .current .em-pr-anim103 {
    transform: translateY(0)
}

.current .em-pr-anim201 {
    transform: translateX(0)
}

.current .em-pr-anim202, .current .em-pr-anim203 {
    transform: translateY(0)
}

.current .em-pr-anim204, .current .em-pr-anim301 {
    transform: translateX(0)
}

.current .em-pr-anim302, .current .em-pr-anim303 {
    transform: translateY(0)
}

.current .em-pr-anim401 {
    transform: translateX(0)
}

.current .em-pr-anim402, .current .em-pr-anim403 {
    transform: translateY(0)
}

.current .em-pr-anim501 {
    transform: translateX(0)
}

.current .em-pr-anim502, .current .em-pr-anim503 {
    transform: translateY(0)
}

.em--cs-anim-twe01 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 479px;
    height: 358px;
    left: -76px;
    top: -11px;
    z-index: 1
}

.em--cs-anim-twe02 {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 536px;
    height: 416px;
    left: 47px;
    top: 81px;
    z-index: 3
}

@media all and (min-width: 1026px) and (max-width: 1401px) {
    .em-pr--slider .t-cell.visual {
        transform: scale(.65) !important
    }

    .em-pr--slider .t-cell.visual .wide-mode {
        left: -50px !important
    }
}

@media all and (min-width: 1402px) {
    .em-pr--slider .t-cell.visual {
        padding-top: 100px
    }
}

.company-intro__grid {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 40px
}

.company-intro__article {
    margin-bottom: 40px;
    font: 20px/1.6 roboto-light-webfont, Arial, Helvetica, sans-serif;
    color: #5a6063
}

@media all and (max-width: 1025px) {
    .company-intro__article {
        font-size: 17px
    }
}

@media all and (max-width: 737px) {
    .company-intro__article {
        font-size: 15px
    }
}

@media all and (max-width: 646px) {
    .company-intro__article {
        width: 100%
    }
}

@media all and (min-width: 647px) {
    .company-intro__article {
        width: calc(50% - 28px)
    }

    .company-intro__article:nth-child(odd) {
        margin-right: 55px
    }
}

.company-intro__title {
    color: #0078ae;
    font: 45px/1 roboto-medium-webfont, Arial, Helvetica, Sans-Serif;
    margin-bottom: 25px
}

@media all and (max-width: 1025px) {
    .company-intro__title {
        font-size: 30px
    }
}

@media all and (max-width: 737px) {
    .company-intro__title {
        font-size: 22px
    }
}

@media all and (min-width: 1026px) {
    .benefits-section.nw {
        padding-top: 80px
    }

    .benefits-section.nw h2 {
        font-size: 60px;
        margin-bottom: 80px
    }
}

.hi-pg {
    background: #fff;
    padding-top: 74px
}

@media all and (max-width: 880px) {
    .hi-pg {
        padding-top: 0
    }
}

@media all and (min-width: 1025px) {
    .hi-pg {
        padding-top: 102px
    }

    .hi-pg .sec-ttl.alt.alt h2 {
        font-size: 48px;
        letter-spacing: 0
    }

    .hi-pg .sec-ttl.alt .descr {
        font-size: 32px;
        padding: 10px 40px
    }
}

.hi-pg .clients {
    max-width: 100%;
    padding: 20px 0
}

@media all and (max-width: 1300px) {
    .hi-pg .clients {
        margin: -40px -3vw -20px;
        max-width: calc(106%)
    }
}

.hi-pg .clients li {
    border: none;
    margin: 0 7px 13px;
    min-width: 15.7%;
    min-height: 130px
}

.hi-pg .clients li img {
    max-width: 90%;
    max-height: 80%
}

@media all and (max-width: 1300px) {
    .hi-pg .clients li {
        margin: 10px;
        min-height: 110px
    }
}

@media all and (max-width: 980px) {
    .hi-pg .clients li {
        min-height: 80px
    }

    .hi-pg .clients li img {
        width: 70%
    }
}

@media all and (max-width: 646px) {
    .hi-pg .clients li {
        margin: 0 -5px
    }
}

.hi-pg .clients img {
    border-radius: 0;
    width: auto
}

.hi-pg .nw--inner-container {
    max-width: 1582px
}

.hi-pg .wh-detail--wrp {
    min-height: 0
}

.hi-pg .wh-detail--wrp .rel-holder {
    max-width: 1822px;
    margin: 0 auto
}

@media all and (max-width: 646px) {
    .hi-pg .wh-detail--wrp .wh-infobox {
        max-width: 100%;
        width: 100%;
        margin: 0
    }

    .hi-pg .wh-detail--wrp .wh-infobox .ch-cell {
        width: 100%;
        padding-left: 70px
    }

    .hi-pg .wh-detail--wrp .wh-infobox .ch-call {
        margin-bottom: 0
    }

    .hi-pg .wh-detail--wrp .wh-infobox .ch-call svg {
        left: 10px;
        top: -2px
    }

    .hi-pg .wh-detail--wrp .wh-infobox .ch-place svg {
        left: 0
    }

    .hi-pg .wh-detail--wrp .wh-infobox .ch-place:before {
        display: none
    }
}

@media all and (max-width: 980px) {
    .hi-pg .wh-detail--wrp {
        padding-bottom: 0
    }
}

.hi-pg .wh-detail--wrp .hi-banner {
    background: url("../image/tzz_ion-1.jpg") 50% 0 no-repeat;
    padding: 85px 0 80px;
    min-height: 436px;
    border-radius: 7px
}

.hi-pg .wh-detail--wrp .hi-banner .title-wrp {
    position: relative;
    padding-bottom: 60px
}

@media all and (max-width: 980px) {
    .hi-pg .wh-detail--wrp .hi-banner {
        min-height: 0;
        padding-bottom: 100px
    }

    .hi-pg .wh-detail--wrp .hi-banner .title-wrp {
        padding-right: 0;
        max-width: 460px;
        margin: 0 auto
    }
}

@media all and (max-width: 500px) {
    .hi-pg .wh-detail--wrp .hi-banner {
        border-radius: 0
    }

    .hi-pg .wh-detail--wrp .hi-banner .title-wrp {
        max-width: 320px;
        padding-bottom: 30px
    }
}

.hi-pg .wh-detail--wrp .hi-banner .link-arrow {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 21px;
    transition: color .3s linear;
    margin-left: 94px
}

@media all and (max-width: 1400px) {
    .hi-pg .wh-detail--wrp .hi-banner .link-arrow {
        font-size: 18px;
        margin-left: 62px
    }
}

@media all and (max-width: 500px) {
    .hi-pg .wh-detail--wrp .hi-banner .link-arrow {
        font-size: 16px;
        margin: 0 0 0 44px
    }
}

.hi-pg .wh-detail--wrp .hi-banner .link-arrow:hover:before {
    background: #fff
}

.hi-pg .wh-detail--wrp .hi-banner .link-arrow:hover:after {
    border-color: #fff
}

.hi-pg .wh-detail--wrp .hi-banner .link-arrow:before {
    background: #90c404
}

.hi-pg .wh-detail--wrp .hi-banner .link-arrow:hover {
    color: #fff
}

.hi-pg .wh-detail--wrp .btn-simple {
    margin: 10px 0 0
}

.hi-pg .wh-detail--wrp .btn-simple input {
    font-size: 27px
}

@media all and (max-width: 980px) {
    .hi-pg .wh-detail--wrp .btn-simple input {
        font-size: 21px
    }
}

.hi-pg .wh-detail--wrp .ff-textarea textarea {
    background: #f9f9f9
}

.hi-pg .wh-detail--wrp .ff-input input {
    height: 60px;
    background: #f9f9f9
}

.hi-pg .wh-detail--wrp .field-error .ff-input input {
    background-position: 99% -258px !important
}

.hi-pg .wh-detail--wrp .field-success .ff-input input {
    background-position: 99% 16px !important
}

.hi-pg .wh-detail--wrp .wh-form-holder {
    right: 7vw;
    z-index: 2;
    max-width: 642px
}

@media all and (max-width: 1600px) {
    .hi-pg .wh-detail--wrp .wh-form-holder {
        right: 3vw;
        max-width: 40%
    }
}

@media all and (max-width: 980px) {
    .hi-pg .wh-detail--wrp .wh-form-holder {
        right: 0;
        max-width: 100%;
        margin-top: 40px
    }
}

.hi-pg .wh-detail--wrp .wh-form-holder .ch-form {
    padding: 35px 2.7vw
}

@media all and (max-width: 1400px) {
    .hi-pg .wh-detail--wrp .wh-form-holder .ch-form {
        padding: 15px 25px
    }
}

.hi-pg .wh-detail--wrp .wh-form-holder .ch-form .f-row-check {
    padding-top: 0
}

.hi-pg .hs-sub-row {
    padding: 40px 0;
    margin-bottom: 5px;
    white-space: nowrap
}

@media all and (max-width: 980px) {
    .hi-pg .hs-sub-row {
        white-space: normal
    }

    .hi-pg .hs-sub-row .nw--inner-container {
        padding: 0 0 60px
    }
}

.hi-pg .hs-sub-row .img-wrap:not(:first-child):before {
    height: 80px;
    left: -40px;
    top: -7px
}

@media all and (max-width: 1600px) {
    .hi-pg .hs-sub-row .img-wrap:not(:first-child):before {
        left: -6px
    }
}

@media all and (max-width: 1400px) {
    .hi-pg .hs-sub-row .img-wrap:not(:first-child):before {
        display: none
    }
}

.hi-pg .hs-sub-item {
    margin: 0 75px 0 0
}

@media all and (max-width: 1600px) {
    .hi-pg .hs-sub-item {
        transform: scale(.8);
        margin: 0 20px 0 15px
    }
}

@media all and (max-width: 1400px) {
    .hi-pg .hs-sub-item {
        transform: scale(.7);
        margin: 0 -20px
    }
}

.hi-ttl {
    color: #fff;
    font: 59px/.9 roboto-bold-webfont, sans-serif;
    text-transform: uppercase;
    background: url("../image/tzz_ion-1.png") 0 100% no-repeat;
    padding-bottom: 40px;
    margin-bottom: 10px
}

.hi-ttl .row-pad {
    display: block;
    padding-left: 52px
}

.hi-ttl .row-pad:nth-child(3) {
    padding-left: 90px
}

@media all and (max-width: 1400px) {
    .hi-ttl {
        font-size: 40px;
        background-size: 331px auto;
        padding-bottom: 23px
    }

    .hi-ttl .row-pad {
        padding-left: 36px
    }

    .hi-ttl .row-pad:nth-child(3) {
        padding-left: 62px
    }
}

@media all and (max-width: 500px) {
    .hi-ttl {
        font-size: 26px;
        line-height: 1;
        background-size: 222px auto;
        padding-bottom: 14px
    }

    .hi-ttl .row-pad {
        padding-left: 24px
    }

    .hi-ttl .row-pad:nth-child(3) {
        padding-left: 41px
    }
}

.hi-infobox {
    background: #0078ae;
    color: #fff;
    margin: 0 -20px -1px;
    padding: 50px 0;
    position: relative;
    z-index: 1
}

.hi-infobox .ch-place {
    width: 59.2%
}

.hi-infobox .ch-place:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    height: 100%;
    width: 1px
}

.hi-infobox .ch-call {
    width: 40%;
    padding: 5px 10px 0 80px
}

.hi-infobox .ch-call svg {
    top: 2px;
    left: 13px
}

.hi-infobox a, .hi-infobox strong {
    color: #fff
}

.hi-infobox svg {
    fill: #fff
}

.hi-subscribe .subscribe {
    padding-bottom: 100px
}

.hi-subscribe .subscribe:before {
    content: "";
    background: #e7e7e7;
    display: block;
    width: 75%;
    height: 3px;
    margin: 0 auto 50px
}

@keyframes head-anim-webdesign01 {
    0%, 45% {
        opacity: 0;
        transform: translate(100px, 81px)
    }
    100%, 75% {
        opacity: 1;
        transform: translate(100px, 280px)
    }
}

@keyframes head-anim-webdesign02 {
    0%, 30% {
        opacity: 0;
        transform: translate(4px, -125px)
    }
    100%, 60% {
        opacity: 1;
        transform: translate(-31px, 25px)
    }
}

@keyframes head-anim-webdesign03 {
    0% {
        opacity: 0;
        transform: translate(435px, 36px)
    }
    100%, 40% {
        opacity: 1;
        transform: translate(435px, 170px)
    }
}

@keyframes head-anim-webdesign04 {
    0%, 15% {
        opacity: 0;
        transform: translate(0px, -68px)
    }
    100%, 55% {
        opacity: 1;
        transform: translate(77px, 6px)
    }
}

@keyframes head-anim-webdesign05 {
    0%, 65% {
        opacity: 0;
        transform: translate(4px, 94px)
    }
    100% {
        opacity: 1;
        transform: translate(-26px, 200px)
    }
}

@keyframes head-anim01 {
    0%, 45% {
        opacity: 0;
        transform: translate(123px, 78px)
    }
    100%, 75% {
        opacity: 1;
        transform: translate(123px, 148px)
    }
}

@keyframes head-anim02 {
    0%, 30% {
        opacity: 0;
        transform: translate(215px, 184px)
    }
    100%, 60% {
        opacity: 1;
        transform: translate(215px, 264px)
    }
}

@keyframes head-anim03 {
    0% {
        opacity: 0;
        transform: translate(-22px, -55px)
    }
    100%, 40% {
        opacity: 1;
        transform: translate(-22px, 35px)
    }
}

@keyframes head-anim04 {
    0% {
        opacity: 0;
        transform: translate(-20px, -20px)
    }
    78% {
        opacity: 0;
        transform: translate(-20px, -7px)
    }
    100% {
        opacity: 1;
        transform: translate(-20px, 53px)
    }
}

@keyframes head-anim05 {
    0%, 30% {
        opacity: 0;
        transform: translate(105px, -40px)
    }
    100% {
        opacity: 1;
        transform: translate(105px, 67px)
    }
}

@keyframes head-anim06 {
    0% {
        opacity: 0;
        transform: translate(-46px, 0)
    }
    100% {
        opacity: 1;
        transform: translate(-46px, 61px)
    }
}

@keyframes head-anim-img {
    0% {
        opacity: 0;
        transform: translateY(0)
    }
    100% {
        opacity: 1;
        transform: translateY(100px)
    }
}

@keyframes mob-an-slide {
    0% {
        background-position: 0 0
    }
    25%, 40% {
        background-position: -245px 0
    }
    65%, 75% {
        background-position: -490px 0
    }
    100%, 85% {
        background-position: 0 0
    }
}

@keyframes mob-an-biowars {
    0% {
        background-position: 0 100%
    }
    10%, 15% {
        background-position: 0 -735px
    }
    30%, 40% {
        background-position: 0 -490px
    }
    55%, 65% {
        background-position: 0 -245px
    }
    80%, 90% {
        background-position: 0 0
    }
    100% {
        background-position: 0 100%
    }
}

@keyframes unit-anim-bg {
    0% {
        opacity: 0
    }
    10%, 100% {
        opacity: 1
    }
}

@keyframes top-anim-mobile01 {
    0%, 50% {
        opacity: 0;
        transform: translate(233px, 91px)
    }
    100% {
        opacity: 1;
        transform: translate(195px, 91px)
    }
}

@keyframes top-anim-mobile05 {
    0%, 25% {
        opacity: 0;
        transform: translate(-100px, 30px)
    }
    100%, 45% {
        opacity: 1;
        transform: translate(-100px, 69px)
    }
}

@keyframes top-anim-mobile06 {
    0% {
        opacity: 0;
        transform: translate(7px, 7px)
    }
    10% {
        opacity: 0;
        transform: translate(8px, 8px)
    }
    100%, 30% {
        opacity: 1;
        transform: translate(-9px, 78px)
    }
}

@keyframes top-anim-mobile07 {
    0% {
        opacity: 0;
        transform: translate(350px, -2px)
    }
    15% {
        opacity: 1;
        transform: translate(350px, 36px)
    }
    100% {
        opacity: 1;
        transform: translate(406px, 119px)
    }
}

@keyframes strategy-anim01 {
    0% {
        opacity: 0;
        transform: translate(273px, -22px)
    }
    100%, 35% {
        opacity: 1;
        transform: translate(304px, -22px)
    }
}

@keyframes strategy-anim02 {
    0%, 30% {
        opacity: 0;
        transform: translate(373px, 0)
    }
    100%, 70% {
        opacity: 1;
        transform: translate(317px, -2px)
    }
}

@keyframes strategy-anim03 {
    0%, 65% {
        opacity: 0;
        transform: translate(285px, -60px)
    }
    100% {
        opacity: 1;
        transform: translate(282px, -27px)
    }
}

@keyframes design-anim01 {
    0%, 20% {
        opacity: 0;
        transform: translate(668px, 15px)
    }
    100% {
        opacity: 1;
        transform: translate(708px, 16px)
    }
}

@keyframes design-anim02 {
    0%, 40% {
        opacity: 0;
        transform: translate(-15px, -53px)
    }
    100%, 70% {
        opacity: 1;
        transform: translate(-14px, -17px)
    }
}

@keyframes design-anim03 {
    0%, 70% {
        opacity: 0;
        transform: translate(153px, -61px)
    }
    100% {
        opacity: 1;
        transform: translate(151px, -25px)
    }
}

@keyframes dev-anim01 {
    0% {
        opacity: 0;
        transform: translate(97px, 156px)
    }
    100%, 30% {
        opacity: 1;
        transform: translate(97px, 182px)
    }
}

@keyframes dev-anim02 {
    0%, 25% {
        opacity: 0;
        transform: translate(30px, 61px)
    }
    100%, 55% {
        opacity: 1;
        transform: translate(29px, 88px)
    }
}

@keyframes dev-anim03 {
    0%, 50% {
        opacity: 0;
        transform: translate(111px, 35px)
    }
    100%, 80% {
        opacity: 1;
        transform: translate(111px, 71px)
    }
}

@keyframes dev-anim04 {
    0%, 75% {
        opacity: 0;
        transform: translate(230px, -50px)
    }
    100% {
        opacity: 1;
        transform: translate(230px, -22px)
    }
}

@keyframes marketing-anim01 {
    0% {
        opacity: 0;
        transform: translate(0px, -59px)
    }
    100%, 25% {
        opacity: 1;
        transform: translate(0px, -33px)
    }
}

@keyframes marketing-anim02 {
    0%, 20% {
        opacity: 0;
        transform: translate(457px, 60px)
    }
    100%, 45% {
        opacity: 1;
        transform: translate(457px, 89px)
    }
}

@keyframes marketing-anim03 {
    0%, 40% {
        opacity: 0;
        transform: translate(124px, -41px)
    }
    100%, 65% {
        opacity: 1;
        transform: translate(124px, -14px)
    }
}

@keyframes marketing-anim04 {
    0%, 75% {
        opacity: 0;
        transform: translate(36px, 90px)
    }
    100% {
        opacity: 1;
        transform: translate(36px, 107px)
    }
}

@keyframes marketing-anim05 {
    0%, 60% {
        opacity: 0;
        transform: translate(340px, 107px)
    }
    100%, 85% {
        opacity: 1;
        transform: translate(340px, 136px)
    }
}

@keyframes case-slide {
    0% {
        background-position: 0 0
    }
    48%, 50% {
        background-position: 0 100%
    }
    100%, 98% {
        background-position: 0 0
    }
}

@keyframes playbtn-out-anim {
    0% {
        opacity: 0;
        width: 100%;
        height: 100%
    }
    20% {
        opacity: 1;
        width: 113%;
        height: 113%
    }
    35% {
        opacity: .5;
        width: 123%;
        height: 123%
    }
    100%, 45% {
        opacity: 0;
        width: 123%;
        height: 123%
    }
}

@keyframes playbtn-inside-anim {
    0% {
        opacity: 0;
        width: 50%;
        height: 50%
    }
    20% {
        opacity: 1;
        width: 75%;
        height: 75%
    }
    45% {
        opacity: 1;
        width: 85%;
        height: 85%
    }
    100%, 55% {
        opacity: 0;
        width: 85%;
        height: 85%
    }
}

@keyframes playbtn-anim {
    0% {
        transform: translate(-50%, -50%) scale(1)
    }
    50% {
        transform: translate(-50%, -50%) scale(1.2)
    }
    100%, 80% {
        transform: translate(-50%, -50%) scale(1)
    }
}

.light-section {
    background-color: #fff
}

.animated .head-anim37 {
    left: 62px;
    top: -40px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim38 {
    left: 410px;
    top: 95px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim39 {
    left: 84px;
    top: 172px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim40 {
    left: 111px;
    top: 27px;
    animation: head-anim-img 1s forwards .7s
}

.animated .head-anim41 {
    left: 16px;
    top: 57px;
    animation: head-anim-img .4s forwards 1.2s
}

.pr-slider-pager.size01 {
    max-width: 1380px
}

.pr-txt.size01 {
    font-size: 20px;
    margin-bottom: 24px;
    height: 23px;
}

.active .pr-icon .fill-active {
    fill: #fff !important
}

.active .pr-icon .str-active {
    stroke: #fff !important
}

.size01 .audit .pr-icon svg {
    width: 48px;
    height: 45px
}

.websitedev .business .pr-icon svg {
    width: 40px;
    height: 35px
}

.brandlogo .business .pr-icon svg {
    width: 50px;
    height: 45px
}

.size01 .bed .pr-icon svg {
    width: 45px;
    height: 42px
}

.websitedev .digital .pr-icon svg {
    width: 58px;
    height: 58px;
    fill: #c79b1e
}

.brandlogo .digital .pr-icon svg {
    width: 50px;
    height: 45px
}

.brandlogo .dev .pr-icon svg {
    width: 55px;
    height: 50px
}

.brandlogo .qa .pr-icon svg {
    width: 45px;
    height: 45px
}

.brandlogo .info svg {
    width: 75px;
    height: 80px
}

.websitedev .info .pr-icon .fil1 {
    fill: #f0ab40
}

.websitedev .info .pr-icon .str0 {
    stroke: #f0ab40
}

.websitedev .dev .pr-icon .str0, .websitedev .dev .pr-icon .str1 {
    stroke: #85d0ce
}

.websitedev .qa .pr-icon .str0 {
    stroke: #e06968
}

.websitedev .opt .pr-icon .str0 {
    stroke: #288fc2
}

.size01 .active.audit .pr-txt {
    color: #009ddc
}

.size01 .active.bed .pr-txt {
    color: #a541c0
}

.size01 .active.business .pr-txt {
    color: #8ec900
}

.size01 .active.info .pr-txt {
    color: #f0ab40
}

.size01 .active.digital .pr-txt {
    color: #c79b1e
}

.size01 .active.dev .pr-txt {
    color: #65e7da
}

.size01 .active.qa .pr-txt {
    color: #e06968
}

.websitedev .active.opt .pr-txt {
    color: #288fc2
}

.active-1 .size01 .pr-current-tab {
    background: #a2cf6e
}

.active-1 .size01 .pr-current-tab:after {
    border-top-color: #a2cf6e
}

.active-3 .size01 .pr-current-tab {
    background: #c79b1e
}

.active-3 .size01 .pr-current-tab:after {
    border-top-color: #c79b1e
}

.active-4 .size01 .pr-current-tab {
    background: #65e7da
}

.active-4 .size01 .pr-current-tab:after {
    border-top-color: #65e7da
}

.active-4 .websitedev .pr-current-tab, .active-5 .size01 .pr-current-tab {
    background: #a541c0
}

.active-4 .websitedev .pr-current-tab:after, .active-5 .size01 .pr-current-tab:after {
    border-top-color: #a541c0
}

.active-5 .websitedev .pr-current-tab, .active-6 .size01 .pr-current-tab {
    background: #e06968
}

.active-5 .websitedev .pr-current-tab:after, .active-6 .size01 .pr-current-tab:after {
    border-top-color: #e06968
}

.active-6 .websitedev .pr-current-tab {
    background: #288fc2
}

.active-6 .websitedev .pr-current-tab:after {
    border-top-color: #288fc2
}

.active-5 .brandlogo .pr-current-tab {
    background: #e06968
}

.active-5 .brandlogo .pr-current-tab:after {
    border-top-color: #e06968
}

.active-6 .brandlogo .pr-current-tab {
    background: #4dccd1
}

.active-6 .brandlogo .pr-current-tab:after {
    border-top-color: #4dccd1
}

.animated .head-anim42 {
    left: 128px;
    top: -22px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim43 {
    left: 320px;
    top: 57px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim44 {
    left: -137px;
    top: 116px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim45 {
    left: 63px;
    top: 12px;
    animation: head-anim-img 1s forwards .7s
}

.animated .head-anim46 {
    left: 227px;
    top: -12px;
    animation: head-anim-img .4s forwards 1.2s
}

.content-section .feat-expanded-section {
    background: 0 0;
    padding: 0
}

.brand-frame .logo-pg-frame {
    max-width: 1582px;
    padding-top: 30px
}

.brand-frame .frame, .wide-brand .frame {
    max-width: 1582px
}

.brand-frame .featured-work-block {
    padding: 0
}

.brand-frame .fwb-item > a:hover img {
    transform: none;
    opacity: 1
}

.brand-frame .an-wide .btn {
    transform: translate(-50%, -50%);
    text-align: center
}

.brand-frame .fwb-item {
    margin-bottom: 20px
}

.brand-frame .expanded-mode {
    background: #000;
    color: #fff;
    position: relative;
    margin-bottom: 20px
}

.brand-frame .expanded-mode .ec-gallery, .wide-brand .expanded-block .ec-gallery {
    position: static;
    float: none;
    border: none;
    width: 100%
}

.brand-frame .active-lnk:after {
    display: none
}

.brand-frame .button-close, .wide-brand .button-close {
    right: 0;
    top: 0
}

.brand-frame .an-wide {
    display: block;
    margin: 0
}

.brand-txt {
    width: 43%;
    color: silver;
    font: 20px/1.6 roboto-light-webfont, sans-serif;
    text-align: left;
    padding: 88px 0 20px
}

.brand-txt .size01 {
    color: #fff;
    font: 24px/1.4 roboto-light-webfont, sans-serif;
    margin-bottom: 30px
}

.brand-txt p strong {
    : roboto-medium-webfont, sans-serif
}

.brand-txt .brand {
    margin: 0 auto 55px;
    text-align: center
}

.brand-simple {
    width: 57%;
    padding: 0 7px 0 75px
}

.brand-gallery {
    padding: 0 7px 0 0
}

.brand-slider {
    width: 57%;
    max-width: 834px;
    overflow: hidden;
    position: relative
}

.brand-list img {
    transform: scale(1.1);
    transition: transform 2s linear, opacity .2s linear;
    opacity: 0;
    height: 0
}

.brand-list .first-load {
    height: auto
}

.brand-list {
    overflow: hidden
}

.brand-list .active-slide-img {
    transform: scale(1);
    opacity: 1;
    height: auto
}

.brand-pager-holder {
    position: relative;
    z-index: 2;
    border-top: 25px solid #000
}

.brand-pager {
    background: #000;
    font-size: 0;
    line-height: 0;
    display: table;
    width: 100%;
    table-layout: fixed
}

.brand-pager > a {
    opacity: .3;
    transition: opacity .3s linear;
    display: table-cell;
    width: 100%
}

.brand-slider .current-tab {
    bottom: auto;
    top: -6px;
    left: 0
}

.brand-slider .current-tab:after {
    border-top: none;
    border-bottom: 14px solid #90c404;
    top: auto;
    bottom: 0
}

.brand-pager > a.active, .brand-pager > a:hover {
    opacity: 1
}

.brand-frame .fwb-row img {
    display: inline-block
}

.brand-frame .fwbi-text {
    padding: 27px 0
}

.brand-frame + .anim-section .see-more {
    padding-top: 40px
}

.brand-frame .fwb-item {
    margin-right: 10px
}

.brand-frame .fwb-item:last-child {
    margin-right: 0
}

.brand-frame .fwb-row {
    text-align: center
}

.slide-center.alt-view {
    padding: 0 7% 80px;
    height: auto
}

.slide-center.alt-view p {
    font-size: 20px;
    margin-top: 30px
}

.animated .head-anim-inf01 {
    left: 190px;
    top: -8px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim-inf02 {
    left: -35px;
    top: -10px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim-business01 {
    left: 226px;
    top: -82px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim-business02 {
    left: -64px;
    top: -43px;
    animation: head-anim-img .8s forwards .2s
}

.mix-slider p:not(:last-child), .pr-slider p:not(:last-child), .txt-slider p {
    margin-bottom: 20px
}

.animated .head-anim-brand01 {
    left: -5px;
    top: 166px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-brand02 {
    left: -1px;
    top: -42px;
    animation: head-anim-img 1.2s forwards .3s
}

.animated .head-anim-brand03 {
    left: 180px;
    top: -64px;
    animation: head-anim-img .8s forwards .8s
}

.animated .head-anim-brand04 {
    left: 483px;
    top: 207px;
    animation: head-anim-img .5s forwards .6s
}

.animated .head-anim-brand05 {
    left: 332px;
    top: 110px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim-content01 {
    left: 230px;
    top: 0;
    animation: head-anim-img .6s forwards
}

.animated .head-anim-content02 {
    left: 212px;
    top: -69px;
    animation: head-anim-img 1s forwards .8s
}

.animated .head-anim-content03 {
    left: 43px;
    top: -44px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim-content04 {
    left: -15px;
    top: -35px;
    animation: head-anim-img .5s forwards .7s
}

.animated .head-anim-print01 {
    left: 131px;
    top: -50px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-print02 {
    left: 72px;
    top: -2px;
    animation: head-anim-img .6s forwards 1.2s
}

.animated .head-anim-print03 {
    left: 212px;
    top: -32px;
    animation: head-anim-img .8s forwards .8s
}

.animated .head-anim-print04 {
    left: 309px;
    top: 44px;
    animation: head-anim-img .5s forwards .6s
}

.animated .head-anim-print05 {
    left: -67px;
    top: 124px;
    animation: head-anim-img .8s forwards .2s
}

.brandprint .heart .pr-icon svg {
    width: 40px;
    height: 44px
}

.brandprint .active.heart .pr-txt {
    color: #009ddc
}

.brandprint .layout .pr-icon svg, .brandprint .star .pr-icon svg {
    width: 45px;
    height: 40px
}

.brandprint .active.layout .pr-txt {
    color: #90c404
}

.active-1 .brandprint .pr-current-tab {
    background: #90c404
}

.active-1 .brandprint .pr-current-tab:after {
    border-top-color: #90c404
}

.brandprint .qa .str0 {
    stroke: #f7a53c
}

.brandprint .active.qa .pr-txt {
    color: #f7a43c
}

.brandprint .active.star .pr-txt {
    color: #4dccd1
}

.active-3 .brandprint .pr-current-tab {
    background: #4dccd1
}

.active-3 .brandprint .pr-current-tab:after {
    border-top-color: #4dccd1
}

.sec-ttl-sub {
    color: #009ddc;
    font: 45px/1.2 roboto-bold-webfont, sans-serif
}

.sec-ttl-sub:before {
    content: "";
    display: block;
    margin: 20px auto 40px;
    background: #d6d8d9;
    width: 230px;
    height: 1px;
    opacity: 0;
    transition: opacity .3s ease-out 1.2s
}

.animated .sec-ttl-sub:before {
    opacity: 1
}

.pr-slider .t-cell.circle-anim, .pr-slider .t-cell.no-anim {
    padding-top: 0;
    text-align: center
}

.animated .head-anim-logo01 {
    left: 521px;
    top: 248px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-logo02 {
    left: -36px;
    top: 149px;
    animation: head-anim-img .6s forwards 1.2s
}

.animated .head-anim-logo03 {
    left: 388px;
    top: 68px;
    animation: head-anim-img .8s forwards .8s
}

.animated .head-anim-logo04 {
    left: 2px;
    top: -41px;
    animation: head-anim-img .5s forwards .6s
}

.animated .head-anim-logo05 {
    left: 238px;
    top: 54px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim-logo06 {
    left: 89px;
    top: 139px;
    animation: head-anim-img .8s forwards 1.4s
}

.pr-circle-holder {
    display: inline-block;
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 389px
}

.pr-circle {
    position: absolute;
    top: 0;
    left: 0
}

.pr-slider .prev-current .circle-anim {
    opacity: 1
}

.pr-circle-anim {
    transition: transform .3s ease-out .1s;
    transform: translateX(100%)
}

.current .pr-circle-anim {
    transform: translateX(0);
    transition: transform .3s ease-out
}

.prev-current .pr-circle-anim {
    transform: translateX(-100%)
}

.animated .head-anim-video01 {
    left: 8px;
    top: 166px;
    animation: head-anim-img .6s forwards .5s
}

.animated .head-anim-video02 {
    left: 111px;
    top: -21px;
    animation: head-anim-img .6s forwards
}

.animated .head-anim-video03 {
    left: -63px;
    top: 13px;
    animation: head-anim-img 1s forwards .7s
}

.fwb-row .fwb-item span.btm-scroll {
    display: block
}

.whitepapers-section .link-arrow {
    margin: 0
}

.tabs-list {
    padding-top: 12px
}

.tabs-list .sub-ttl {
    display: block;
    : roboto-medium-webfont, sans-serif;
    margin-bottom: 5px
}

.tabs-list li {
    padding: 15px 0 0 26px;
    float: left;
    width: 50%;
    line-height: 1.2;
    position: relative
}

.tabs-list li:before {
    content: "";
    width: 8px;
    height: 8px;
    border: 4px solid #0197d3;
    border-width: 4px 4px 0 0;
    transform: rotate(45deg);
    position: absolute;
    left: 0;
    top: 21px;
    transition: all .2s linear
}

.video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 128px;
    height: 128px;
    background: rgba(0, 157, 220, .74);
    border: 6px solid #fff;
    border-radius: 50%
}

.video-play:after {
    content: "";
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-67%, -50%) rotate(-45deg) skew(6deg, 6deg);
    border: 2px solid #fff;
    border-width: 0 2px 2px 0;
    width: 42px;
    height: 42px;
    border-radius: 5px;
    z-index: 3
}

.video-play:before {
    content: "";
    border: 2px solid #fff;
    width: 2px;
    height: 50px;
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-10px, -50%);
    border-radius: 10px;
    border-width: 2px 0 2px 2px;
    z-index: 3
}

.brand-frame .expanded-mode .ttl {
    font: 45px roboto-medium-webfont, sans-serif;
    padding: 0 0 20px
}

.video-frame {
    max-width: 980px;
    margin: 0 auto
}

.video-frame .link-arrow {
    margin: 0
}

.video-frame .btn-holder {
    padding: 40px 10px 20px 0
}

.animated .head-anim-pack01 {
    left: -35px;
    top: 212px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-pack02 {
    left: 243px;
    top: -73px;
    animation: head-anim-img .6s forwards 1.2s
}

.animated .head-anim-pack03 {
    left: 565px;
    top: 1px;
    animation: head-anim-img .8s forwards .8s
}

.animated .head-anim-pack04 {
    left: 19px;
    top: 46px;
    animation: head-anim-img .5s forwards .6s
}

.animated .head-anim-pack05 {
    left: 63px;
    top: 119px;
    animation: head-anim-img .8s forwards .2s
}

.wide-brand .expanded-block {
    background: #000;
    color: #fff;
    margin-bottom: 20px;
    position: relative
}

.wide-brand .feat-section-frame {
    padding: 0 0 27px;
    position: static
}

.wide-featexp-section .feat-visible-m {
    max-width: 287px
}

.animated .head-anim-clients01 {
    left: 467px;
    top: 216px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-clients02 {
    left: 24px;
    top: 114px;
    animation: head-anim-img .6s forwards 1.2s
}

.animated .head-anim-clients03 {
    left: 485px;
    top: 95px;
    animation: head-anim-img .8s forwards .2s
}

.animated .head-anim-clients04 {
    left: 27px;
    top: 3px;
    animation: head-anim-img .5s forwards .6s
}

.animated .head-anim-clients05 {
    left: 196px;
    top: -16px;
    animation: head-anim-img .8s forwards .8s
}

.animated .head-anim-clients06 {
    left: 135px;
    top: 139px;
    animation: head-anim-img .8s forwards 1.4s
}

.clients {
    max-width: 1600px;
    margin: 0 auto;
    padding: 40px 0 25px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    opacity: 0;
    transition: opacity .6s linear
}

.clients li {
    display: flex;
    border: 1px solid #dedede;
    border-radius: 5px;
    margin: 0 7px 13px;
    min-width: 15.7%;
    min-height: 250px;
    background: #fff
}

.animated .clients {
    opacity: 1
}

.clients li img {
    border-radius: 6px;
    margin: auto;
    width: 100%;
    max-width: 206px;
    max-height: 206px
}

.pg-ttl-sec {
    text-align: center;
    padding: 55px 20px 100px
}

.pg-ttl {
    font: 80px/1.3 roboto-medium-webfont, sans-serif;
    color: #0078ae
}

.cs-list {
    overflow: visible
}

.cs-list .frame-alt {
    margin-top: -140px
}

.cs-list .link-arrow {
    margin-top: 0
}

.cs-list .link-arrow:before {
    opacity: .2
}

.cs-list .cs-item:hover .link-arrow:before {
    opacity: 1
}

.cs-item {
    color: #fff;
    font: 20px/1.6 roboto-light-webfont, sans-serif;
    background: #212121;
    border-bottom: 3px solid #009ddc;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
    transition: all .2s ease-out
}

.cs-item:hover {
    background: #fff;
    color: #5a6063
}

.cs-txt {
    overflow: hidden;
    width: 50%;
    margin: auto;
    padding: 20px 4% 30px 5.2%;
    align-self: center
}

.cs-txt p {
    margin-bottom: 15px
}

.cs-txt h2 {
    font: 45px/1.1 roboto-medium-webfont, sans-serif;
    margin-bottom: 6px
}

.cs-txt h2 a {
    color: #fff
}

.cs-item:hover h2 a {
    color: #0078ae
}

.cs-visual {
    width: 50%;
    overflow: hidden;
    max-width: 778px
}

.cs-visual > span {
    min-height: 326px;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    transition: transform .5s ease
}

.cs-item:hover .cs-visual > span {
    transform: scale(1.1)
}

.cs-visual:not(.no-center) > span {
    background-position: 50% 50%
}

.cs-visual.serviceking > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.luxor > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.engel > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.johnjay > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.dance > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.btb > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.leon > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.medcpu > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.tricon > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.nyod > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.biowars > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-visual.tweezerman > span {
    background-image: url("../image/tzz_ion-1.jpg")
}

.cs-item:nth-child(even) {
    border-radius: 4px 3px 3px
}

.cs-item:nth-child(odd) {
    border-radius: 3px 4px 3px 3px
}

.cs-item:nth-child(even) .cs-visual {
    border-radius: 3px 0 0
}

.cs-item:nth-child(odd) .cs-visual {
    border-radius: 0 3px 0 0
}

.cs-item:nth-child(odd) .cs-visual, .slide-area .cs-item:nth-child(even) .cs-visual {
    order: 1
}

.slide-area .cs-item:nth-child(odd) .cs-visual {
    order: initial
}

.cs-list .see-more {
    padding-top: 25px
}

.pr-slider-holder.websitedev .txt {
    padding-top: 10%
}

.animated .head-anim-med01 {
    left: 65px;
    top: 186px;
    animation: head-anim-img .8s forwards 1s
}

.animated .head-anim-med02 {
    left: -88px;
    top: -76px;
    animation: head-anim-img .3s forwards .8s
}

.animated .head-anim-med03 {
    left: 470px;
    top: 41px;
    animation: head-anim-img .6s forwards .2s
}

.animated .head-anim-med04 {
    left: 23px;
    top: -104px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-med05 {
    left: -53px;
    top: 118px;
    animation: head-anim-img .8s forwards 1.2s
}

.animated .head-anim-med03.pos01 {
    z-index: 3
}

.animated .head-anim-med01.pos01 {
    left: 136px;
    top: 118px
}

.animated .head-anim-food01 {
    left: 158px;
    top: 181px;
    animation: head-anim-img .8s forwards 1s
}

.animated .head-anim-food02 {
    left: -127px;
    top: -74px;
    animation: head-anim-img .3s forwards .8s
}

.animated .head-anim-food03 {
    left: 301px;
    top: 79px;
    animation: head-anim-img .6s forwards .2s
}

.animated .head-anim-food04 {
    left: -47px;
    top: -88px;
    animation: head-anim-img .8s forwards .6s
}

.animated .head-anim-food05 {
    left: 321px;
    top: 237px;
    animation: head-anim-img .8s forwards 1.2s
}

@media only screen and (min-width: 1025px) {
    .brand-frame .an-wide .btn {
        transform: translate(-50%, -50%)
    }

    .video-play .anim {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    .video-play .anim:after {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border: 5px solid rgba(255, 255, 255, .7);
        border-radius: 50%;
        opacity: 0
    }

    .video-play .anim:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 50%;
        width: 50%;
        height: 50%;
        transform: translate(-50%, -50%);
        background: rgba(255, 255, 255, .35);
        opacity: 0
    }

    .video-items .fwb-item:hover .video-play {
        animation: playbtn-anim 1s ease-out infinite
    }

    .video-items .fwb-item:hover .anim:before {
        animation: playbtn-inside-anim 1s ease-out infinite
    }

    .video-items .fwb-item:hover .anim:after {
        animation: playbtn-out-anim 1s ease-out infinite
    }

    .wide-brand .an-wide .btn {
        z-index: 5
    }

    .an-bhue .img-descktop {
        left: 40.7%;
        top: -22px;
        z-index: 4
    }

    .an-bhue .img-mobile {
        left: 28%;
        top: 115px
    }

    .an-hlc .img-descktop {
        left: 5.5%;
        top: -33px
    }

    .an-hlc .img-mobile {
        left: 24%;
        top: 63px
    }

    .an-hookaps .img-logo {
        right: 0;
        top: 0;
        transform: none
    }

    .an-hookaps .img-descktop {
        left: 24.8%;
        top: 74px;
        z-index: 4
    }

    .an-hookaps .img-mobile {
        left: 5.8%;
        top: -25px
    }

    .an-portmantos-wide .img-descktop {
        left: 68%;
        top: -35px
    }

    .an-portmantos-wide .img-mobile {
        left: 43%;
        top: 156px
    }

    .pr-slider .t-cell.visual .dmp-pr-pos01 {
        top: -54px
    }

    .pr-slider .t-cell.visual .dmp-pr-pos02, .pr-slider .t-cell.visual .dmp-pr-pos03 {
        top: 54px
    }

    .pr-slider-holder.alt-tabwide .t-cell.visual {
        text-align: right
    }

    .mix-anim .wide-mode img {
        opacity: 0;
        transition: opacity .2s linear
    }

    .mix-anim .current .wide-mode img {
        opacity: 1
    }

    .pr-slider .t-cell.visual .wdd-pr-pos2 {
        top: -54px;
        left: -25px
    }

    .wdd-pr-anim301 {
        background: url("../images/pr-anim101.png") no-repeat;
        width: 92px;
        height: 213px;
        left: -71px;
        top: -81px;
        z-index: 3;
        transition: all .3s linear .6s
    }

    .current .wdd-pr-anim301 {
        transform: translateX(52px)
    }

    .wdd-pr-anim302 {
        background: url("../images/pr-anim102.png") no-repeat;
        width: 96px;
        height: 224px;
        left: 194px;
        top: 30px;
        z-index: 4;
        transition: all .3s linear .9s
    }

    .wdd-pr-anim303 {
        background: url("../images/pr-anim103.png") no-repeat;
        width: 102px;
        height: 112px;
        left: -98px;
        top: -23px;
        transition: all .3s linear .4s
    }

    .wdd-pr-anim304 {
        background: url("../images/pr-anim104.png") no-repeat;
        width: 187px;
        height: 345px;
        left: 46px;
        top: -176px;
        transition: all .3s linear .2s
    }

    .wdd-pr-anim401 {
        background: url("../images/wdd-402.png") no-repeat;
        width: 188px;
        height: 345px;
        left: 22px;
        top: -179px;
        z-index: 2;
        transition: all .3s linear .2s
    }

    .current .wdd-pr-anim401 {
        top: -231px
    }

    .wdd-pr-anim402 {
        background: url("../images/wdd-403.png") no-repeat;
        width: 258px;
        height: 327px;
        left: -98px;
        top: -123px;
        z-index: 4;
        transition: all .3s linear .4s
    }

    .current .wdd-pr-anim402 {
        left: -135px;
        top: -103px
    }

    .wdd-pr-anim403 {
        background: url("../images/wdd-404.png") no-repeat;
        width: 62px;
        height: 205px;
        left: 200px;
        top: -24px;
        z-index: 6;
        transition: all .3s linear .7s
    }

    .current .wdd-pr-anim403 {
        left: 205px
    }

    .wdd-pr-anim501 {
        background: url("../images/wdd-501.png") no-repeat;
        width: 241px;
        height: 381px;
        left: -127px;
        top: -183px;
        z-index: 2;
        transition: all .5s linear .2s
    }

    .current .wdd-pr-anim501 {
        left: -167px;
        top: -163px
    }

    .wdd-pr-anim502 {
        background: url("../images/wdd-503.png") no-repeat;
        width: 164px;
        height: 219px;
        left: 20px;
        top: 0;
        z-index: 3;
        transition: all .3s linear .4s
    }

    .current .wdd-pr-anim502 {
        left: 0
    }

    .wdd-pr-anim704 {
        background: url("../images/wdd-704.png") no-repeat;
        width: 216px;
        height: 325px;
        left: 40px;
        top: -162px;
        transition: all .3s linear
    }

    .current .wdd-pr-anim704 {
        transform: translateY(-30px)
    }

    .wdd-pr-anim705 {
        background: url("../images/wdd-705.png") no-repeat;
        width: 180px;
        height: 174px;
        left: 54px;
        top: -35px;
        z-index: 4;
        transition: all .3s linear .4s
    }

    .current .wdd-pr-anim705 {
        transform: translateX(-30px)
    }

    .wdd-pr-anim706 {
        background: url("../images/wdd-706.png") no-repeat;
        width: 171px;
        height: 172px;
        left: 76px;
        top: -92px;
        transition: all .3s linear .3s
    }

    .current .wdd-pr-anim706 {
        transform: translateX(-30px)
    }

    .wdd-pr-anim702 {
        background: url("../images/pr-anim502.png") no-repeat;
        width: 96px;
        height: 224px;
        left: -107px;
        top: -102px;
        z-index: 4;
        transition: all .3s linear .5s
    }

    .current .wdd-pr-anim702 {
        transform: translateX(10px)
    }

    .wdd-pr-anim802 {
        background: url("../images/website-dev/process/wdd-802.png") no-repeat;
        width: 210px;
        height: 344px;
        left: 37px;
        top: -172px;
        z-index: 2;
        transition: all .5s linear .2s
    }

    .current .wdd-pr-anim802 {
        transform: translateY(-30px)
    }

    .wdd-pr-anim803 {
        background: url("../images/website-dev/process/wdd-803.png") no-repeat;
        width: 216px;
        height: 203px;
        left: -72px;
        top: 47px;
        z-index: 4;
        transition: all .3s linear .4s
    }

    .current .wdd-pr-anim803 {
        transform: translateY(-30px)
    }

    .wdd-pr-anim804 {
        background: url("../images/website-dev/process/wdd-804.png") no-repeat;
        width: 184px;
        height: 133px;
        left: -62px;
        top: 137px;
        z-index: 5;
        transition: all .3s linear .6s
    }

    .current .wdd-pr-anim804 {
        transform: translateY(-30px)
    }

    .wdd-pr-anim805 {
        background: url("../images/website-dev/process/wdd-202.png") 0 0/100% auto no-repeat;
        width: 109px;
        height: 307px;
        left: 170px;
        top: -22px;
        z-index: 3;
        transition: all .2s linear .2s
    }

    .current .wdd-pr-anim805 {
        transform: translateX(-20px)
    }
}

@media only screen and (min-width: 769px) {
    .pr-slider .item .t-cell.circle-anim {
        transform: none;
        transition: none;
        opacity: 1
    }
}

@media only screen and (max-width: 1850px) {
    .brand-simple, .brand-slider {
        padding-top: 60px
    }

    .brand-gallery {
        padding: 0 7px 0 20px
    }

    .brand-txt {
        padding-top: 60px
    }
}

@media only screen and (max-width: 1600px) {
    .brand-txt {
        padding: 20px
    }

    .brand-gallery {
        padding: 0 20px 0 0
    }

    .clients li {
        min-height: 0
    }
}

@media only screen and (max-width: 1170px) {
    .pr-slider-pager .pr-txt.size01 {
        font: 16px roboto-regular-webfont, sans-serif
    }

    .pr-slider-holder.alt-tabwide {
        max-width: 80vw
    }

    .pr-slider .t-cell.visual .dmp-pr-pos01 {
        top: 50px;
        left: -45px
    }

    .pr-slider .t-cell.visual .dmp-pr-pos03 {
        left: -20px
    }

    .pg-ttl-sec {
        padding-top: 20px
    }

    .pg-ttl {
        font-size: 60px
    }

    .cs-txt h2 {
        font-size: 40px
    }

    .cs-item {
        font-size: 18px
    }
}

@media only screen and (max-width: 1024px) {
    .pr-slider-pager .pr-txt.size01 {
        font-size: 14px;
        margin-bottom: 27px
    }

    .brand-frame .an-wide .btn {
        display: none
    }

    .brand-txt .size01 {
        font-size: 20px
    }

    .brand-txt {
        font-size: 18px
    }

    .sec-ttl-sub {
        font-size: 36px
    }

    .brand-simple {
        padding-left: 20px
    }

    .video-items .expanded-mode {
        margin: 0 -20px;
        padding: 0 20px
    }

    .video-play {
        width: 100px;
        height: 100px
    }

    .video-play:before {
        height: 34px;
        transform: translate(-8px, -50%)
    }

    .video-play:after {
        width: 30px;
        height: 30px
    }

    .family .feat-brand:after {
        height: 169px
    }

    .pr-slider li:first-child .t-cell.visual, .seo-pr--slider li:first-child .subheader-text, li:first-child .pr-circle-anim {
        transform: none;
        opacity: 1
    }
}

@media only screen and (max-width: 980px) and (min-width: 646px) {
    .pr-slider-pager.size01 {
        margin: -135px -15px 40px;
        width: calc(100% + 30px)
    }

    .pr-slider-pager .pr-txt.size01 {
        font-size: 12px;
        margin-bottom: 32px
    }

    .pr-slider-pager.size01 .pr-bg, .pr-slider-pager.size01 .pr-current-tab, .pr-slider-pager.size01 .pr-icon {
        width: 60px;
        height: 60px
    }

    .pr-slider-pager.size01 .pr-current-tab {
        top: 67px
    }

    .pr-slider-pager.size01 .pr-current-tab:after {
        left: 16px
    }

    .pr-slider-pager.size01 .pr-icon svg {
        transform: translate(-50%, -50%) scale(.87)
    }
}

@media only screen and (max-width: 880px) {
    .tabs-list li {
        float: none;
        width: 100%;
        padding-left: 20px
    }

    .tabs-list li:before {
        width: 6px;
        height: 6px;
        top: 20px;
        border-width: 3px 3px 0 0
    }
}

@media only screen and (max-width: 768px) {
    .brand-txt {
        width: 100%;
        padding: 35px 15px 15px
    }

    .brand-simple {
        width: 100%
    }

    .brand-slider {
        width: 100%;
        max-width: 100%;
        padding-top: 20px
    }

    .odd-row .fwb-item:last-child {
        display: none;
        height: 0
    }

    .sec-ttl-sub:before {
        margin: 40px auto
    }

    .pr-slider .t-cell .pr-circle-holder {
        max-width: 270px
    }

    .pr-slider .t-cell .pr-circle-holder img {
        max-width: 100%
    }

    .pr-slider .item .t-cell.circle-anim, .pr-slider .item .t-cell.no-anim {
        padding-top: 20px
    }

    .pr-slider-holder {
        max-width: 500px
    }

    .brand-frame .expanded-mode .ttl {
        font-size: 40px
    }

    .brand-gallery {
        padding-left: 20px
    }

    .brand-simple {
        padding: 0
    }

    .clients {
        padding: 0 0 20px
    }

    .cs-list .see-more {
        padding-top: 15px
    }

    .cs-txt h2 {
        font-size: 33px
    }

    .cs-item {
        display: block
    }

    .cs-item:hover {
        background: #212121
    }

    .cs-item:hover .cs-txt {
        background: #fff
    }

    .cs-txt {
        font-size: 16px;
        width: 100%
    }

    .cs-item .cs-visual:nth-child(even), .cs-item .cs-visual:nth-child(odd) {
        display: block;
        width: 100%;
        min-height: 250px;
        border-radius: 3px 3px 0 0
    }

    .pg-ttl {
        font-size: 40px
    }
}

@media only screen and (max-width: 755px) {
    .tabs-list ul {
        text-align: center;
        display: inline-block
    }

    .tabs-list li {
        text-align: left
    }

    .family .feat-brand:after {
        transform: scale(.6) translate(-83%, -66%)
    }
}

@media only screen and (max-width: 646px) {
    .pr-slider-pager .pr-txt.size01 {
        font-size: 16px;
        margin-bottom: 20px
    }

    .slide-center.alt-view {
        padding: 0 0 30px
    }

    .slide-center.alt-view h3 {
        padding: 0 20px
    }

    .brand-frame + .anim-section .see-more {
        padding-top: 20px
    }

    .sec-ttl-sub:before {
        margin: 20px auto
    }

    .brand-frame .expanded-mode .ttl, .sec-ttl-sub {
        font: 24px/1.2 roboto-medium-webfont, sans-serif
    }

    .video-frame .btn-holder {
        padding: 20px 10px 0 0
    }

    .clients li {
        min-width: 0;
        max-width: 45.3%
    }

    .clients img {
        width: auto;
        height: auto
    }

    .cs-txt h2 {
        font-size: 26px
    }

    .cs-list .frame-alt {
        margin-top: -100px
    }

    .pr-slider-holder.websitedev .txt {
        padding-top: 0
    }
}

@media only screen and (max-width: 480px) {
    .odd-row .fwb-item:last-child {
        display: inline-block;
        height: auto
    }

    .brand-txt .brand {
        transform: scale(.9);
        margin: -20px auto 30px
    }
}

.whitepapers-section {
    padding: 90px 0 30px;
    background: #fff;
    position: relative;
    z-index: 2
}

.whitepapers-section .frame {
    max-width: 1103px;
    padding-right: 60px
}

.whitepaper-img {
    float: left;
    margin-top: 20px
}

.whitepapers-section h2 {
    font: 50px/1 roboto-bold-webfont, sans-serif;
    color: #0078ae;
    width: 47.5%;
    float: right
}

.whitepapers-section h2 span {
    : roboto-black-webfont, sans-serif
}

.whitepaper-descript {
    float: right;
    width: 47.5%;
    padding: 30px 0;
    font-size: 17px;
    line-height: 1.6;
    color: #5a6063
}

.whitepaper-descript p {
    margin: 0 0 35px
}

.whitepaper-subtext {
    border: solid #d9dadb;
    border-width: 1px 0;
    padding: 20px 0;
    position: relative;
    margin: 0 0 35px
}

.whitepaper-subtext h5 {
    font-size: 13px;
    text-transform: uppercase;
    color: #009ddc;
    : roboto-regular-webfont, sans-serif
}

.whitepaper-subtext p {
    color: #5a6063;
    font: 24px/1.2 roboto-bold-webfont, sans-serif;
    margin: 0
}

.whitepaper-descript .link-arrow {
    font-size: 18px;
    margin-top: 0
}

.whitepaper-descript .link-arrow:after {
    top: -2px
}

@media only screen and (max-width: 1170px) {
    .whitepapers-section .frame {
        padding-left: 20px
    }
}

@media only screen and (max-width: 880px) {
    .whitepapers-section h2 {
        font-size: 40px
    }

    .whitepaper-descript p {
        margin: 0 0 16px
    }

    .whitepaper-subtext {
        padding-top: 16px
    }

    .whitepaper-subtext p {
        margin: 0 0 24px
    }

    .whitepapers-section {
        padding: 80px 0 0
    }

    .whitepapers-section .blue-middle-box {
        margin-top: -135px
    }
}

@media only screen and (max-width: 646px) {
    .whitepapers-section .frame {
        padding: 0 20px
    }

    .whitepapers-section {
        padding: 50px 0 5px;
        text-align: center
    }

    .whitepaper-subtext {
        padding: 30px 0 5px
    }

    .whitepapers-section h2 {
        float: none;
        width: 100%;
        font-size: 32px;
        margin: 0 0 20px
    }

    .whitepapers-section h2 br {
        display: none
    }

    .whitepaper-img {
        float: none;
        width: 100%;
        padding: 0 24px 20px
    }

    .whitepaper-img img {
        max-width: 70%
    }

    .whitepaper-descript {
        width: 100%;
        padding: 0
    }
}

.wide-expanded-section {
    position: relative;
    padding: 6px 0 0
}

.wide-expanded-section.dark {
    background: #181d22
}

.wide-expanded-section .wide-mode {
    display: block
}

.wide-expanded-section .wide-holder {
    padding: 40px 0 0
}

.wide-expanded-section .exp-bg {
    background: 0 30px/100% auto no-repeat #fff;
    box-shadow: 0 0 5px rgba(23, 23, 23, .18);
    margin: 10px 0 40px;
    padding: 0;
    position: relative;
    z-index: 2
}

.wide-expanded-section .exp-bg:before {
    content: "";
    z-index: 1;
    background: #fff;
    box-shadow: 0 0 5px rgba(23, 23, 23, .18);
    width: 30px;
    height: 30px;
    position: absolute;
    top: -1px;
    left: 50%;
    -webkit-transform: rotate(33deg) translateX(-50%) skewX(-25deg);
    transform: rotate(33deg) translateX(-50%) skewX(-25deg)
}

.wide-expanded-section .exp-bg .frame {
    position: relative;
    background: #fff;
    z-index: 2
}

.wide-expanded-section .section-title {
    font: 17px/1.4 roboto-regular-webfont, arial, Helvetica, sans-serif;
    margin: 0 0 27px
}

.wide-expanded-section .section-title h2 {
    font-size: 50px;
    color: #0078ae;
    margin-bottom: 16px
}

.wide-expanded-section .section-title p {
    color: #5a6063;
    text-shadow: none;
    padding: 0 18%
}

.note-txt {
    text-align: center;
    font: 22px/1.4 roboto-regular-webfont, arial, Helvetica, sans-serif;
    color: #0078ae;
    margin-bottom: 10px
}

.note-txt strong {
    : roboto-bold-webfont, arial, Helvetica, sans-serif
}

.note-txt svg {
    fill: #009ddc;
    width: 50px;
    height: 30px;
    position: relative;
    top: 20px
}

.wide-expanded-section .fwb-item {
    width: 100%;
    text-align: center
}

.wide-expanded-section .fwb-item > a {
    display: inline-block
}

.wide-expanded-section .fwb-item .active-lnk:after {
    display: none
}

.wide-expanded-section .fwb-item:first-child {
    margin-top: 0
}

.wide-expanded-section .ec-text {
    max-width: 980px;
    background: #fff;
    position: relative;
    z-index: 2
}

.wide-expanded-section .button-close {
    right: 15px;
    top: 0;
    background: #fafafa;
    border-bottom: 1px solid #8e9193;
    border-radius: 0 0 4px 4px;
    box-shadow: inset -2px 0 rgba(0, 0, 0, .05), inset 2px 0 rgba(0, 0, 0, .05)
}

.wide-expanded-section .button-close:after, .wide-expanded-section .button-close:before {
    background: #8f9294
}

.wide-expanded-section .button-close:hover {
    background: #414446;
    box-shadow: none;
    top: 0;
    border: none
}

.wide-expanded-section .button-close:hover:after, .wide-expanded-section .button-close:hover:before {
    background: #fff
}

.wide-expanded-section .main-image img:not(:first-child) {
    opacity: 0;
    display: none
}

.wide-expanded-section .expanded-mode {
    background: 0 0;
    color: #878a8c
}

.wide-expanded-section .t-cell {
    vertical-align: top;
    text-align: left
}

.wide-expanded-section .ec-gallery {
    width: 400px;
    border: none;
    float: none
}

.wide-expanded-section .txt-cell {
    padding: 20px 20px 50px;
    font: 17px/1.5 roboto-regular-webfont, arial, Helvetica, sans-serif
}

.wide-expanded-section .txt-cell p {
    margin-bottom: 15px
}

.wide-expanded-section .first {
    color: #323232;
    font: 24px/1.4 roboto-light-webfont, arial, Helvetica, sans-serif
}

.wide-expanded-section .btn-green {
    float: none;
    display: inline-block;
    margin-top: 10%
}

.wide-expanded-section .link-arrow {
    margin-top: 15px
}

.wide-expanded-section .brand {
    display: block;
    margin: 0 auto
}

.pancake .brand {
    background: url("../image/tzz_ion-1.jpg") no-repeat;
    width: 303px;
    height: 102px;
    margin-bottom: 5px
}

.mindclash .brand {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 264px;
    height: 59px;
    margin-bottom: 26px
}

.artdex .brand {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 257px;
    height: 23px;
    margin: 30px auto 40px
}

.proshop .brand {
    background: url("../image/tzz_ion-1.jpg") no-repeat;
    width: 276px;
    height: 60px;
    margin: 20px auto 30px
}

.luxor .brand {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 169px;
    height: 47px;
    margin: 20px auto 30px
}

.biowars .brand {
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 202px;
    height: 55px;
    margin: 20px auto 30px
}

.wide-expanded-section .main-image {
    margin: -30px 10px -24px 0;
    padding: 67px 6px 0;
    background: url("../image/tzz_ion-1.png") no-repeat;
    width: 282px;
    height: 610px;
    float: left
}

.wide-expanded-section .thumbnails {
    margin: 27px 0 0;
    float: left;
    width: 96px
}

.wide-expanded-section .thumbnails > a {
    display: block;
    margin-top: 2px;
    padding: 3px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .4)
}

.wide-expanded-section .thumbnails > a:after {
    display: none
}

.wide-expanded-section .thumbnails > .active {
    box-shadow: inset 0 0 0 3px #90c404
}

.wide-expanded-section .thumbnails img {
    display: block;
    max-height: 155px;
    max-width: 88px;
    width: 100%
}

.wide-expanded-section .biowars-mob-slide .ec-gallery {
    width: 450px;
    padding-top: 30px
}

.biowars-mob-slide .holder {
    margin: 0 0 0 -210px;
    position: relative;
    width: 652px;
    height: 347px;
    z-index: 5
}

.biowars-mob-slide .holder:before {
    content: "";
    background: url("../image/tzz_ion-1.png") no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.biowars-mob-slide img {
    position: absolute;
    top: 16px;
    left: 90px;
    opacity: 1
}

@-webkit-keyframes mob-slide-biowars01 {
    0%, 20% {
        opacity: 1
    }
    25%, 95% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes mob-slide-biowars01 {
    0%, 20% {
        opacity: 1
    }
    25%, 95% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes mob-slide-biowars02 {
    0%, 20% {
        opacity: 0
    }
    25%, 50% {
        opacity: 1
    }
    100%, 55% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars02 {
    0%, 20% {
        opacity: 0
    }
    25%, 50% {
        opacity: 1
    }
    100%, 55% {
        opacity: 0
    }
}

@-webkit-keyframes mob-slide-biowars03 {
    0%, 50% {
        opacity: 0
    }
    55%, 70% {
        opacity: 1
    }
    100%, 75% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars03 {
    0%, 50% {
        opacity: 0
    }
    55%, 70% {
        opacity: 1
    }
    100%, 75% {
        opacity: 0
    }
}

@-webkit-keyframes mob-slide-biowars04 {
    0%, 70% {
        opacity: 0
    }
    75%, 95% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes mob-slide-biowars04 {
    0%, 70% {
        opacity: 0
    }
    75%, 95% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.biowars-mob-slide .slide01 {
    z-index: 4;
    -webkit-animation: mob-slide-biowars01 6s linear infinite .01s;
    animation: mob-slide-biowars01 6s linear infinite .01s
}

.biowars-mob-slide .slide02 {
    z-index: 3;
    -webkit-animation: mob-slide-biowars02 6s linear infinite .01s;
    animation: mob-slide-biowars02 6s linear infinite .01s
}

.biowars-mob-slide .slide03 {
    z-index: 2;
    -webkit-animation: mob-slide-biowars03 6s linear infinite .01s;
    animation: mob-slide-biowars03 6s linear infinite .01s
}

.biowars-mob-slide .slide04 {
    z-index: 1;
    -webkit-animation: mob-slide-biowars04 6s linear infinite .01s;
    animation: mob-slide-biowars04 6s linear infinite .01s
}

@media only screen and (max-width: 1024px) {
    .wide-expanded-section .exp-bg .frame {
        padding: 0 10px
    }
}

@media only screen and (max-width: 980px) {
    .wide-expanded-section .txt-cell {
        padding: 10px 10px 50px 0
    }

    .wide-expanded-section .brand {
        -webkit-transform: scale(0.75) translateX(-10%);
        transform: scale(.75) translateX(-10%)
    }
}

@media only screen and (max-width: 800px) {
    .wide-expanded-section .biowars-mob-slide .ec-gallery {
        width: 380px
    }
}

@media only screen and (max-width: 755px) {
    .wide-expanded-section .t-holder {
        table-layout: fixed
    }

    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 31%
    }

    .wide-expanded-section .txt-cell {
        padding-bottom: 20px
    }

    .wide-expanded-section .ec-gallery {
        -webkit-transform: scale(.65);
        transform: scale(.65)
    }

    .wide-expanded-section .expanded-mode .biowars-mob-slide .ec-gallery {
        width: 50%;
        -webkit-transform: none;
        transform: none
    }

    .wide-expanded-section .main-image {
        float: none;
        width: auto;
        margin: -170px -34px 0 -50px
    }

    .wide-expanded-section .thumbnails {
        margin: 0 -70px -120px;
        float: none;
        width: auto;
        -webkit-transform: scale(.85);
        transform: scale(.85)
    }

    .wide-expanded-section .btn-green {
        margin-top: 20px
    }

    .wide-expanded-section .exp-bg {
        margin-bottom: 10px
    }

    .wide-expanded-section .thumbnails > a {
        display: inline-block;
        margin: 0 5px
    }

    .wide-expanded-section {
        padding: 60px 0
    }

    .wide-expanded-section .section-title {
        padding: 0 20px
    }

    .wide-expanded-section .section-title h2 {
        font-size: 40px
    }

    .wide-expanded-section .wide-holder {
        padding: 5px 0 0
    }

    .wide-expanded-section .exp-bg {
        padding: 0
    }
}

@media only screen and (max-width: 680px) {
    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 36%
    }

    .wide-expanded-section .expanded-mode .biowars-mob-slide .ec-gallery {
        width: 53%
    }
}

@media only screen and (max-width: 646px) {
    .wide-expanded-section .biowars-mob-slide .brand {
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-79%);
        transform: scale(.6) translateX(-79%)
    }

    .wide-expanded-section .biowars-mob-slide, .wide-expanded-section .expanded-mode .biowars-mob-slide .t-cell {
        display: block;
        width: 100%
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 280px
    }

    .wide-expanded-section .biowars-mob-slide .holder {
        margin: 0;
        position: absolute;
        top: 20px;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-84%);
        transform: scale(.6) translateX(-84%)
    }
}

@media screen and (max-width: 580px) {
    .wide-expanded-section .main-image {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        margin: -205px -47px -65px -70px
    }

    .wide-expanded-section .brand {
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: scale(0.6) translateX(-50%);
        transform: scale(.6) translateX(-50%)
    }

    .luxor .brand {
        margin: 25px auto
    }

    .artdex .brand {
        margin: 40px auto
    }

    .wide-expanded-section .txt-cell {
        padding-top: 90px
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 280px
    }

    .wide-expanded-section .txt-cell .first {
        font-size: 18px
    }

    .wide-expanded-section .txt-cell p {
        margin-bottom: 10px
    }

    .wide-expanded-section .thumbnails {
        margin: 0 -93px -126px;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }

    .wide-expanded-section .btn-green {
        margin-top: 10px
    }

    .wide-expanded-section .button-close {
        right: 10px
    }
}

@media only screen and (max-width: 480px) {
    .wide-expanded-section .expanded-mode .ec-gallery {
        width: 41%
    }

    .wide-expanded-section .section-title h2 {
        font-size: 30px
    }

    .wide-expanded-section .section-title p {
        padding: 0
    }

    .note-txt {
        font-size: 18px
    }

    .note-txt img {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        left: -5px
    }
}

@media only screen and (max-width: 420px) {
    .wide-expanded-section .main-image {
        margin: -180px 0 -110px;
        min-width: 282px;
        float: left
    }

    .wide-expanded-section .thumbnails {
        float: left;
        margin: -130px -32px -126px
    }

    .wide-expanded-section .txt-cell {
        text-align: center
    }

    .wide-expanded-section .thumbnails > a {
        display: block;
        margin: 10px 0
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }

    .wide-expanded-section .txt-cell {
        padding-top: 190px
    }

    .wide-expanded-section .t-holder {
        display: block;
        text-align: center;
        position: relative;
        padding-top: 120px
    }

    .wide-expanded-section .expanded-mode .t-cell {
        display: inline-block;
        padding-top: 0;
        padding-bottom: 40px;
        width: 100%
    }

    .wide-expanded-section .biowars-mob-slide .holder {
        top: -10px;
        -webkit-transform: scale(0.45) translateX(-111%);
        transform: scale(.45) translateX(-111%)
    }

    .wide-expanded-section .biowars-mob-slide .txt-cell {
        padding-top: 130px
    }

    .wide-expanded-section .brand {
        -webkit-transform: scale(0.5) translateX(-105%);
        transform: scale(.5) translateX(-105%)
    }
}

@media only screen and (max-width: 360px) {
    .wide-expanded-section .thumbnails {
        margin-right: -40px
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }
}

@media only screen and (max-width: 320px) {
    .wide-expanded-section .main-image {
        margin-left: -40px
    }

    .wide-expanded-section .thumbnails {
        margin-right: -56px
    }

    .wide-expanded-section .thumbnails img {
        max-width: 125px
    }
}

@media only screen and (min-width: 1025px) {
    .wide-expanded-section .exp-bg.pancake {
        background-image: url("../images/app-design/pancake/pancake-bg.jpg")
    }

    .wide-expanded-section .exp-bg.mindclash {
        background-image: url("../images/app-design/mindclash/mindclash-bg.jpg")
    }

    .wide-expanded-section .exp-bg.artdex {
        background-image: url("../images/app-design/artdex/artdex-bg.jpg")
    }

    .wide-expanded-section .exp-bg.proshop {
        background-image: url("../images/app-design/proshop/proshop-bg.jpg")
    }

    .wide-expanded-section .exp-bg.luxor {
        background-image: url("../images/app-design/luxor/luxor-bg.jpg")
    }

    .wide-expanded-section .exp-bg.biowars {
        background-image: url("../images/app-design/biowars/biowars-bg.jpg")
    }

    .wide-expanded-section .mob-an-item {
        display: inline-block;
        
        position: relative;
        
        
        transition: background-position .3s linear;
        border: none;
        width: 115%;
    }

    .mob-an-item img {
        transition: all .4s ease-out
    }

    .mob-an-item .img-bg img {
        max-width: 9999px;
        max-height: 900px;
    }

    .mob-an-item .overflow {
        overflow: hidden;
        display: block;
        height: 100%;
        position: relative
    }

    .mob-an-item .slide {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 3
    }

    .mob-an-item .slide:after, .mob-an-item .slide:before, .mob-an-item:after {
        content: "";
        position: absolute
    }

    .mob-an-item .slide:before {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3
    }

    .mob-an-item .slide:after {
        overflow: hidden;
        background-repeat: no-repeat;
        background-position: 0 0;
        z-index: 2
    }

    .mob-an-item:hover .slide:after {
        animation: mob-an-slide 2s linear .5s infinite
    }

    .mob-an-pancake .slide {
        top: -15px;
        width: 525px;
        height: 463px;
        transition: right .1s linear .2s;
        z-index: 2;
        transform: translate3d(0, 0, 0)
    }

    .mob-an-pancake .slide:before {
        background: url("../images/app-design/pancake/anim/phone.png") no-repeat
    }

    .mob-an-pancake .slide:after {
        top: 5px;
        left: 138px;
        width: 245px;
        height: 431px;
        background-image: url("../images/app-design/pancake/anim/slides.jpg");
        transform: rotate3d(-55, 29, 47, 56deg)
    }

    .mob-an-mindclash .slide {
        top: 40px;
        width: 525px;
        height: 463px;
        transition: right .1s linear .2s;
        z-index: 2;
        transform: translate3d(0, 0, 0);
        transform: rotate(-2deg);
    }

    .mob-an-mindclash .slide:before {
        background: url("../images/phone.png") no-repeat
    }

    .mob-an-mindclash .slide:after {
        top: 4px;
        left: 123px;
        width: 247px;
        height: 413px;
        background-image: url("../images/pic-1.jpg");
        background-size: 100% auto;
        transform: rotate3d(-43, 25, 33, 51.5deg) scale(.98)
    }
    .pic2 .slide:after {
        background-image: url("../images/pic-2.jpg");
    }
    .pic3 .slide:after {
        background-image: url("../images/pic-3.jpg");
    }
    .pic4 .slide:after {
        background-image: url("../images/pic-4.jpg");
    }
    .pic5 .slide:after {
        background-image: url("../images/pic-5.jpg");
    }

    .mob-an-mindclash:hover .slide:after {
        animation: mob-an-mindclash 5s linear infinite 1.5s
    }

    @-webkit-keyframes mob-an-mindclash {
        0% {
            background-position: 0 0
        }
        15%, 30% {
            background-position: 0 36%
        }
        45%, 60% {
            background-position: 0 71.5%
        }
        75%, 90% {
            background-position: 0 100%
        }
        100% {
            background-position: 0 0
        }
    }@keyframes mob-an-mindclash {
         0% {
             background-position: 0 0
         }
         15%, 30% {
             background-position: 0 36%
         }
         45%, 60% {
             background-position: 0 71.5%
         }
         75%, 90% {
             background-position: 0 100%
         }
         100% {
             background-position: 0 0
         }
     }
    .mob-an-proshop .slide {
        bottom: 0;
        left: 97px;
        width: 280px;
        height: 398px;
        transition: left .2s linear .1s
    }

    .mob-an-proshop .slide:before {
        background: url("../images/app-design/proshop/anim/phone.png") no-repeat
    }

    .mob-an-proshop .slide:after {
        bottom: 0;
        left: 17px;
        width: 245px;
        height: 330px;
        background-image: url("../images/app-design/proshop/anim/slides.jpg")
    }

    .mob-an-proshop .img-logo {
        top: 20%
    }

    .mob-an-proshop.an-wide-right .img-descktop {
        left: 5%;
        top: -21px
    }

    .mob-an-luxor .slide {
        left: 30px;
        bottom: -26px;
        width: 468px;
        height: 431px;
        transform: translate3d(0, 0, 0)
    }

    .mob-an-luxor .slide:before {
        background: url("../images/app-design/luxor/anim/phone.png") no-repeat
    }

    .mob-an-luxor .slide:after {
        top: -5px;
        left: 109px;
        width: 245px;
        height: 431px;
        background-image: url("../images/app-design/luxor/anim/slides.jpg");
        transform: rotate3d(-45, 24, 34, 51deg) scale(.94)
    }

    .mob-an-artdex .slide {
        top: -12px;
        width: 407px;
        height: 447px;
        transform: translate3d(0, 0, 0)
    }

    .mob-an-artdex .slide:before {
        background: url("../images/app-design/artdex/anim/phone.png") no-repeat
    }

    .mob-an-artdex .slide:after {
        top: 0;
        left: 79px;
        width: 245px;
        height: 431px;
        background-image: url("../images/app-design/artdex/anim/slides.jpg");
        transform: rotate3d(71, 48, -69, 41deg) scale(.85)
    }

    .mob-an-biowars.an-wide-left .img-logo {
        top: 22%;
        left: 7%
    }

    .mob-an-biowars.an-wide-left .img-descktop {
        left: 30%;
        top: 70px
    }

    .mob-an-biowars .slide {
        width: 541px;
        height: 303px;
        transition: left .3s linear;
        transform: translate3d(0, 0, 0)
    }

    .mob-an-biowars .slide:before {
        background: url("../images/app-design/biowars/anim/phone.png") no-repeat
    }

    .mob-an-biowars .slide:after {
        top: 11px;
        left: 58px;
        width: 431px;
        height: 245px;
        background-image: url("../images/app-design/biowars/anim/slides.jpg");
        background-position: 0 100%;
        transform: rotate3d(-65, 32, 25, 35deg) scale(.96)
    }

    .mob-an-biowars:hover .slide:after {
        animation: mob-an-biowars 3.3s linear .05s infinite
    }
}

@media only screen and (max-width: 1170px) {
    .img-bg img {
        margin-left: -10%
    }

    .wide-expanded-section .mob-an-item {
        max-width: 980px
    }

    .test {
        margin: 0
    }
}


@media only screen and (max-width: 1170px){
    .head-anim {
        left: 27%;
    }
}


@media only screen and (max-width: 1200px){
    .head-anim {
        left: -14%;
    }
    .head-anim-holder.over{
        margin-left: 0;
        margin-bottom: -270px;
    }
}
@media only screen and (max-width: 992px){
    .head-anim img{
        margin-left: 67px;
    }

}