html{line-height:1.15;-webkit-text-size-adjust:100%}body,h2,h3,h4,h5,h6,p{margin:0}ul{padding-left:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}

/*!
 * Bootstrap Grid v4.1.2 (https://getbootstrap.com/)
 * Copyright 2011-2018 The Bootstrap Authors
 * Copyright 2011-2018 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
@-ms-viewport {
  width: device-width;
}
html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-overflow-style: scrollbar;
}

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

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.col {
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  max-width: 100%;
}

.col-auto {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: auto;
  max-width: none;
}

.col-1 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 8.3333333333%;
          flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

.col-2 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 16.6666666667%;
          flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

.col-3 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 25%;
          flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.3333333333%;
          flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

.col-5 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41.6666666667%;
          flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

.col-6 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 58.3333333333%;
          flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

.col-8 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 66.6666666667%;
          flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

.col-9 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 83.3333333333%;
          flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

.col-11 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 91.6666666667%;
          flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

.col-12 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}

.order-first {
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
}

.order-last {
  -webkit-box-ordinal-group: 14;
      -ms-flex-order: 13;
          order: 13;
}

.order-0 {
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0;
}

.order-1 {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

.order-2 {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}

.order-3 {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}

.order-4 {
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
}

.order-5 {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5;
}

.order-6 {
  -webkit-box-ordinal-group: 7;
      -ms-flex-order: 6;
          order: 6;
}

.order-7 {
  -webkit-box-ordinal-group: 8;
      -ms-flex-order: 7;
          order: 7;
}

.order-8 {
  -webkit-box-ordinal-group: 9;
      -ms-flex-order: 8;
          order: 8;
}

.order-9 {
  -webkit-box-ordinal-group: 10;
      -ms-flex-order: 9;
          order: 9;
}

.order-10 {
  -webkit-box-ordinal-group: 11;
      -ms-flex-order: 10;
          order: 10;
}

.order-11 {
  -webkit-box-ordinal-group: 12;
      -ms-flex-order: 11;
          order: 11;
}

.order-12 {
  -webkit-box-ordinal-group: 13;
      -ms-flex-order: 12;
          order: 12;
}

.offset-1 {
  margin-left: 8.3333333333%;
}

.offset-2 {
  margin-left: 16.6666666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.3333333333%;
}

.offset-5 {
  margin-left: 41.6666666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.3333333333%;
}

.offset-8 {
  margin-left: 66.6666666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.3333333333%;
}

.offset-11 {
  margin-left: 91.6666666667%;
}
@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    max-width: 100%;
  }

  .col-md-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-md-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.3333333333%;
            flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }

  .col-md-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
            flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }

  .col-md-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }

  .col-md-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
            flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }

  .col-md-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.6666666667%;
            flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }

  .col-md-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }

  .col-md-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.3333333333%;
            flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }

  .col-md-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.6666666667%;
            flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }

  .col-md-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }

  .col-md-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.3333333333%;
            flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }

  .col-md-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.6666666667%;
            flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }

  .col-md-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }

  .order-md-first {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }

  .order-md-last {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }

  .order-md-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }

  .order-md-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }

  .order-md-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }

  .order-md-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }

  .order-md-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }

  .order-md-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }

  .order-md-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }

  .order-md-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }

  .order-md-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }

  .order-md-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }

  .order-md-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }

  .order-md-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }

  .order-md-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }

  .offset-md-0 {
    margin-left: 0;
  }

  .offset-md-1 {
    margin-left: 8.3333333333%;
  }

  .offset-md-2 {
    margin-left: 16.6666666667%;
  }

  .offset-md-3 {
    margin-left: 25%;
  }

  .offset-md-4 {
    margin-left: 33.3333333333%;
  }

  .offset-md-5 {
    margin-left: 41.6666666667%;
  }

  .offset-md-6 {
    margin-left: 50%;
  }

  .offset-md-7 {
    margin-left: 58.3333333333%;
  }

  .offset-md-8 {
    margin-left: 66.6666666667%;
  }

  .offset-md-9 {
    margin-left: 75%;
  }

  .offset-md-10 {
    margin-left: 83.3333333333%;
  }

  .offset-md-11 {
    margin-left: 91.6666666667%;
  }
}
@media (min-width: 992px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    max-width: 100%;
  }

  .col-lg-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-lg-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.3333333333%;
            flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }

  .col-lg-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
            flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }

  .col-lg-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }

  .col-lg-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
            flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }

  .col-lg-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.6666666667%;
            flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }

  .col-lg-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }

  .col-lg-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.3333333333%;
            flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }

  .col-lg-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.6666666667%;
            flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }

  .col-lg-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }

  .col-lg-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.3333333333%;
            flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }

  .col-lg-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.6666666667%;
            flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }

  .col-lg-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }

  .order-lg-first {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }

  .order-lg-last {
    -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
            order: 13;
  }

  .order-lg-0 {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }

  .order-lg-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }

  .order-lg-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }

  .order-lg-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }

  .order-lg-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }

  .order-lg-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }

  .order-lg-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }

  .order-lg-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }

  .order-lg-8 {
    -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
            order: 8;
  }

  .order-lg-9 {
    -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
            order: 9;
  }

  .order-lg-10 {
    -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
            order: 10;
  }

  .order-lg-11 {
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }

  .order-lg-12 {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }

  .offset-lg-0 {
    margin-left: 0;
  }

  .offset-lg-1 {
    margin-left: 8.3333333333%;
  }

  .offset-lg-2 {
    margin-left: 16.6666666667%;
  }

  .offset-lg-3 {
    margin-left: 25%;
  }

  .offset-lg-4 {
    margin-left: 33.3333333333%;
  }

  .offset-lg-5 {
    margin-left: 41.6666666667%;
  }

  .offset-lg-6 {
    margin-left: 50%;
  }

  .offset-lg-7 {
    margin-left: 58.3333333333%;
  }

  .offset-lg-8 {
    margin-left: 66.6666666667%;
  }

  .offset-lg-9 {
    margin-left: 75%;
  }

  .offset-lg-10 {
    margin-left: 83.3333333333%;
  }

  .offset-lg-11 {
    margin-left: 91.6666666667%;
  }
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}
.visible {
  visibility: visible !important;
}

.invisible {
  visibility: hidden !important;
}

/* MARGIN ROW */
.row-0{
  margin: 0px 0px;
}
.row-5{
  margin: 0px -5px;
}
.row-10{
  margin: 0px -10px;
}
.col-p-0{
  padding: 0px 0px;
}
.col-p-5{
  padding: 0px 5px;
}
.col-p-10{
  padding: 0px 10px;
}

*{
  /* font-family: 'Source Sans Pro', sans-serif; */
  font-family: 'Poppins', sans-serif;
  /* font-family: 'Quicksand', sans-serif; */
}
body{
  margin: 0px;
  box-sizing: border-box;
}
/* FONTFACE */
@font-face {
  font-family: 'font-icon';
  src: url('../font/font-icon.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
.font-icon{
  font-family: "font-icon";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: .2em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a{
  color: #000;
  text-decoration: none;
}
p{
  line-height: 25px;
}
/* SCROLLBAR */
::-webkit-scrollbar {
    width: 5px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb {
  background-color: #333434;
  outline: 1px solid slategrey;
}
/* COMMON CSS */
.img-responsive{
  width: 100%;
}
.text-center{
  text-align: center;
}
.wrapper-relative{
  width: 100%;
  height: 100%;
  position: relative;
}
.wrapper-table{
  width: 100%;
  height: 100%;
  position: relative;
  display: table;
}
.center-y-item{
  display: table-cell;
  vertical-align: middle;
}
.opacity-0{
  opacity: 0;
}
h2{
  line-height: 26px;
}
.text-animate-wrapper{
  position: static;
}
.text-animate{
  position: static;
  display: inline-block;
  width: auto;
}
.margin-top-15{
  margin-top: 15px;
}
.margin-bot-15{
  margin-bottom: 15px;
}
.margin-top-10{
  margin-top: 10px;
}
.margin-top-30{
  margin-top: 30px;
}
.margin-top-5{
  margin-top: 5px;
}

.relative{
  position: relative;
}
.h-100{
  height: 100%;
}
.min-h-100vh{
  min-height: 100vh;
}
.w-100{
  width: 100%;
}
/* BTN */
.btn-default-black{
  display: inline-block;
  background-color: #000;
  padding: 10px 35px;
  color: #fff;
  outline: 0;
  border: 0px;
  cursor: pointer;
  font-size: 14px;
}
.btn-white{
  background-color: #fff;
  padding: 10px 35px;
  display: inline-block;
  width: 100%;
  cursor: pointer;
  font-size: 14px;
  color: #19a0cb;
  border-radius: 4px;
  text-align: center;
}
.btn-blue{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,1) 0%, rgba(49,105,178,1) 100%);
  padding: 10px 35px;
  display: inline-block;
  width: 100%;
  cursor: pointer;
  font-size: 14px;
  color: #fff;
  border-radius: 4px;
  text-align: center;
}
/* LOADER */
.load-change-page{
  background: #f4f4f4;
  width: 100%;
  height: 100vh;
  position: fixed;
  opacity: 0;
  z-index: -99;
  transition: 0.4s cubic-bezier(0.4, 0.1, 0.7, 0.95);
}
.loader{
  background: #f4f4f4;
  width: 100%;
  height: 100vh;
  position: fixed;
  z-index: 2000;
  transition: 1s cubic-bezier(0.4, 0.1, 0.7, 0.95);
}
.loader-wrapper{
  display: inline-block;
  margin-left: 20px;
  vertical-align: middle;
  margin-top: -2px;
}
.loader-out{
  /* transform: translateY(-50%); */
  opacity: 0;
  background: linear-gradient(to right, #f2f2f2 20%, #f4f4f4 40%, #f9f9f9 60%, #fff 80%);
  animation: shine 1.5s linear infinite;
  z-index: -99;
}
.loader-enter{
  /* transform: translateY(-50%); */
  opacity: 1;
  background: #f4f4f4;
  animation: shine 1.5s linear infinite;
  z-index: 2000;
}

.loader-content{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
}
.logo-sandev-animate{
  height: 80px;
}
.loader p{
  font-weight: 600;
  font-size: 14px;
  margin-top: 10px;
  background: linear-gradient(to right, #38bac8 20%, #35b1c7 40%, #19a0cb 60%, #1a75af 80%);
  background-size: 200% auto;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-animation: shine 1s linear infinite;
  animation: shine 1s linear infinite
}
@-webkit-keyframes shine {
    to {
        background-position: 200% center
    }
}
@keyframes shine {
    to {
        background-position: 200% center
    }
}
/* HEADER */
header{
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100vh;
  background-attachment: fixed;
  /* position: relative; */
}
.title-header-page{
  font-size: 36px;
  line-height: 40px;
}
/* NAV DESKTOP */

.nav-desktop{
  padding: 30px 0px;
  text-align: center;
  position: fixed;
  width: 100%;
  z-index: 1000;
  transition: 0.5s;
}
.nav-desktop-trigger{
  background-color: #fff;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.06);
}
.nav-desktop-logo{
  opacity: 0;
  position: fixed;
  margin-top: 10px;
  left: 30px;
  top: 25px;
  transition: 0.5s;
}
.nav-desktop-logo-trigger{
  opacity: 1;
}
.nav-desktop-logo img{
  height: 30px;
}
.nav-desktop ul{
  margin: 0px;
  transition: 0.5s;
}
.nav-desktop-ul-trigger{
  float: right;
  margin-right: 30px !important;
}
.nav-desktop ul li{
  list-style-type: none;
  display: inline-block;
  padding: 10px 15px;
}
.nav-desktop ul li a{
  color: #000;
  font-weight: 600;
  text-decoration: none;
  font-size: 14px;
}
.nav-active, nav a:hover{
  font-weight: 600;
  font-size: 14px;
  /* margin-top: 10px; */
  background: linear-gradient(to right, #38bac8 20%, #35b1c7 40%, #19a0cb 60%, #1a75af 80%);
  background-size: 200% auto;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-animation: shine 1s linear infinite;
  animation: shine 1s linear infinite
}
/* NAV MOBILE */
.nav-mobile-head{
  position: fixed;
  z-index: 1000;
  width: 100%;
  background-color: #fff;
  transition: 0.3s;
}
.menu-bar-mobile{
  margin: 20px;
  height: 25px;
  cursor: pointer;
  z-index: 1000;
}
.nav-mobile{
  position: fixed;
  top: 0px;
  height: 100vh;
  width: 70%;
  z-index: 1001;
  background-color: #fff;
  transform: translateX(-100%);
  transition: 0.5s;
}
.nav-mobile-trigered{
  transform: translateX(0px);
}
.nav-bg-transparent{
  background-color: transparent;
}
.close-bar-mobile{
  position: fixed;
  left: 25px;
  top: 25px;
  height: 25px;
  cursor: pointer;
  z-index: 1002;
}
.nav-mobile ul{
  padding-left: 25px;
}
.nav-mobile ul li{
  margin: 20px 0px;
  list-style-type: none;
}
.nav-mobile ul li a{
  color: #000;
  font-weight: 600;
  text-decoration: none;
  font-size: 18px;
}
.nav-mobile-bottom-content{
  position: absolute;
  bottom: 0px;
  width: 100%;
}
.nav-mobile-bottom-footer{
  font-size: 12px;
  position: absolute;
  left: 25px;
  bottom: 18px;
  color:#fff;
}
/* HEADER CONTENT */
.header-content{
  position: absolute;
  width: 100%;
  top: 50%;
  transform: translateY(-50%);
}
.svg-logo{
  width: 70px;
  margin-bottom: 25px;
}
.header-motto{
  font-size: 26px;
  font-weight: 600;
  text-align: right;
  margin: 0px;
  line-height: 32px;
  position: static;
}
.header-line{
  position: absolute;
  height: 3px;
  background-color: #000;
  width: 70%;
  top: 50%;
  transform: translateY(-50%);
}
.header-desc{
  line-height: 25px;
  font-weight:600;
  font-size: 14px;
}
.go-to-content-wrapper{
  position: absolute;
  bottom: 30px;
  width: 100%;
  text-align: center;
}
.go-to-content #scroll-svg{
  height: 25px;
}
.go-to-content #scroll-svg .text{
  font-size: 16px;
  font-weight: 600;
}
/* HOME ABOUT */
.home-about{
  padding: 100px 0px;
}
.home-about-desc h2{
  margin-bottom: 40px
}
.home-about-desc-title{
  vertical-align: top;
  margin-right: 5px;
}
.home-about-desc p{
  margin-bottom: 30px;
  line-height: 25px;
}
.home-about-desc p:last-child{
  margin-bottom: 0px;
}
.image-about{
  width: 80%;
  margin: 30px;
}
.about-us-dream{
  padding: 80px 0px;
  background-image: url(../images/common/home-about-background.jpg);
  background-size: cover;
  background-position: center;
}
.about-us-dream-desc{
  color: #fff;
}
.about-us-dream-desc p{
  line-height: 25px;
  margin-top:20px;
}
/* HOME SERVICES */
.home-services{
  padding: 100px 0px;
}
.home-services h2{
  margin-bottom: 20px;
}
.home-services h3{
 margin: 5px 0px;
}
.home-services-part-svg{
  width: 100%;
}
img.icon{
  width: 30px
}
.services-desc{
  line-height: 25px;
  font-size: 14px;
}
.inside-services{
  margin: 15px 0px;
  background-color: #f9f9f9;
  padding: 15px;
  border-radius: 3px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.03);
  border: 1.5px solid #f2f2f2;
  transition: 0.5s;
}
.inside-services:hover{
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
}
/* CLIENT */
.client-section{
  margin-top: -45px;
}
.client-content{
  width: 100%;
  background-color: #fff;
  padding: 30px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  border-radius: 3px;
}
.client-content img{
  width: 100%;
  filter: grayscale(1);
}
.client-content img:hover{
  filter: grayscale(0);
}
/* HOME WORKS */
.home-works{
  padding: 100px 0px 30px 0px;
  position: relative;
}
.bg-home-works{
  width: 80%;
  position: absolute;
  right: 0;
  top: 60%;
}
.home-works h2{
  margin-bottom: 30px;
}
.home-works p{
  line-height: 25px;
  margin-bottom: 30px;
}
.card-works{
  position: relative;
  margin: 5px 0px;
  border: 1px solid #ddd;
}
.portofolio-page .card-works{
  margin: 0px;
  border: 1.5px solid #fff;
}
.card-works img{
  width: 100%;
  display: block;
}
.card-works-text{
  text-align: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
}
.card-works-text h3{
  font-size: 16px;
  color: #fff;
  opacity: 0;
  transition: 0.4s;
}
.card-works-color{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,0.7) 0%, rgba(49,105,178,0.9) 100%);
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  opacity: 0;
  transition: 0.4s;
}
.card-works-text .category{
  background-color: #fff;
  display: inline-block;
  color: #000;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 13px;
  border-radius: 50px;
  opacity: 0;
  transition: 0.4s;
}
.card-works-text hr{
  border: 1px solid #fff;
  width: 30%;
  text-align: center;
  opacity: 0;
  transition: 0.4s;
}
/* CARD HOVER */
.card-works:hover h3,
.card-works:hover .card-works-color,
.card-works:hover .category,
.card-works:hover hr{
  opacity: 1;
}
/* HOME LETS TALK */
.home-lets-talk{
  padding-top: 78px;
}
.home-lets-talk-form{
  padding: 50px;
  background-color: #f9f9f9;
}
.home-lets-talk-form h2{
  margin-bottom: 10px;
}
.home-lets-talk-form p{
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 25px;
}
.home-lets-talk-bg{
  width: 100%;
  height: 100%;
  background-image: url(../images/common/lets-talk-background.jpg);
  background-size: cover;
  background-position: center;
}
.form-data{
  margin: 10px 0px;
}
.form-data-control{
  width: 100%;
  padding: 8px;
  border: 1px solid #ddd;
  background-color: transparent;
}
textarea{
  resize: vertical;
}
.form-data-control:focus,
.form-data-control:active{
  box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.05);
  background-color: #fff;
  outline: none;
}
/* HOME TEAM */
.home-teams{
  padding: 100px 0px;
}
.home-teams h2{
  margin-bottom: 30px;
}
.teams-desc{
  font-size: 14px;
  line-height:28px;
}
.card-default img{
  width: 100%;
  transform: translateZ(20px)
}
.card-default{
  margin: 15px 0px;
  border-radius: 3px;
  background-color: #f9f9f9;
  transition: 0.5s;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.03);
  border: 1.5px solid #f2f2f2;
}
.card-default:hover{
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
}
.card-default-image{
  position: relative;
}
.card-default-image img{
  display: block;
  border-radius: 5px;
}
.card-default-color{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,0.6) 0%, rgba(49,105,178,0.6) 100%);
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  transition: 0.4s;
  border-radius: 8px;
}
.card-default-text{
  padding: 15px 10px 10px 10px;
  transform: translateZ(20px)
}
.card-default-text .date{
  font-size: 12px;
  color: #a3a3a3;
}
.card-default-text .title{
  font-size: 15px;
}
.card-default:hover{
  box-shadow: 1px 1px 19px -2px rgba(0,0,0,0.2);
}
.card-default:hover .card-team-color{
  opacity: 0;
}
/* ABOUT */
.section-about-1{
  padding: 100px 0px;
  background-color: #fff;
}
.title-24{
  font-size: 24px;
}
.color-blue{
  color: #19a0cb;
}
.color-white{
  color: #fff;
}
.section-about-2{
  padding: 100px 0px 200px 0px;
  background-image: url(../images/common/banner-about-bottom.jpg);
}
.section-about-3{
  margin-top: -150px;
  padding: 30px 0px 150px 0px;
}
.style-like-p{
  font-size: 16px;
  font-weight: 400;
}
.card-team{
  position: relative;
  transition: 0.5s;
}
.card-team img{
  width: 100%;
  height: 450px;
  display:block
}
.card-team .info-text{
  opacity: 0;
  position: absolute;
  bottom: 20px;
  left: 20px;
  transition: 0.5s;
  transition-delay: 0.3s;
}
.card-team .info-text p{
  font-size: 14px;
  color: #fff;
}
.card-team .info-text p.name{
  font-weight: medium;
  font-size: 16px;
}
.card-team .color-overlay{
  opacity: 0;
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,0.7) 0%, rgba(49,105,178,0.7) 100%);
  position: absolute;
  width: 100%;
  height: 50%;
  bottom:0;
  transition: 0.5s;
}
.card-team:hover .color-overlay{
  opacity: 1;
  height: 100%;
}
.card-team:hover .info-text{
  opacity: 1;
}
.ct{
  border: 3px solid #fff;
}
.ct:nth-child(2){
  border: 0px solid #fff;
  border-top: 3px solid #fff;
  border-bottom: 3px solid #fff;
}
.see-portofolio-btn{
  background-color: #f9f9f9;
  padding: 20px 0px;
  width: 100%;
  text-align: center;
  height: 100%;
  display: block;
  display:table-cell;
  vertical-align:middle;
  border: 2px solid #19a0cb;
  color: #19a0cb;
  font-weight: medium;
  border-style: dashed;
}
.section-work-and-client{
  padding-bottom: 100px;
}
/* SERVICES */
.section-web-dev{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,0.9) 0%, rgba(49,105,178,0.9) 100%);
  padding: 100px 0px;
  color: #fff;
  position: relative;
}
.section-app-dev{
  background-color: #fff;
  padding: 100px 0px;
  color: #000;
  position: relative;
}
.bg-web-dev svg{
  width: 100%;
  position: absolute;
  left: 0;
  top:0;
  z-index: -1;
}
.bg-app-dev{
  position: absolute;
  right: 20px;
  top:-130px;
  width: 15%;
  z-index: 1;
  opacity: 0.4;
}
.section-app-dev .container{
  z-index: 2;
}
.feature-services{
  background-color: #fff;
  height: 100%;
  width: 100%;
  border-radius: 4px;
  color: #000;
}
.inside-feature-services{
  height: 100%;
}
.pagination-process{
  bottom: 5px !important;
}
.header-title{
  margin-bottom: 10px;
}
.feature-services .desc{
  font-size: 14px;
}
.feature-services .number{
  font-weight: medium;
  margin-right: 5px;
}
.inside-feature-services{
  padding: 20px;
}
.feature-services.f-blue{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,1) 0%, rgba(49,105,178,1) 100%);
  color: #fff;
}
.list-feature{
  padding-left: 0px;
  margin-bottom: 0px;
}
.list-feature li{
  list-style-type: none;
  display: block;
  margin-bottom: 10px;
}
.list-feature li:last-child{
  margin-bottom: 0px;
}
.list-feature li::before{
  content: "〉";
  display: inline-block;
  margin-right: 5px;
  color: #fff;
  font-weight: medium;
  width: 1.3em;
}
.list-feature.f-blue li::before{
  color: #fff;
}
.pricing-data-web .glide__slides,
.pricing-data-app .glide__slides{
}
.pricing-card{
  background-color: #fff;
  padding: 20px;
  border-radius: 4px;
  color: #000;
  position: relative;
  height: 100%;
}
.pricing-card .price{
  position: absolute;
  right: 0;
  top: 10px;
  padding: 10px 20px 10px 20px;
  border-radius: 10px 0px 0px 10px;
  background-color: #19a0cb;
  color: #fff;
  font-size: 14px;
}
.pricing-card .title{
  font-weight: medium;
  margin-top: 5px;
}
.pricing-card.f-blue{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,1) 0%, rgba(49,105,178,1) 100%);
  color: #fff;
}
.pricing-card.f-blue .price{
  background-color: #fff;
  color: #19a0cb;
}
.faq-content{
  margin-top: 15px;
}
.faq-content:first-child{
  margin-top: 0px;
}
.swiper-web, .swiper-app,
.swiper-proses-web, .swiper-proses-app{
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
}
.go-next{
  position: absolute;
  z-index: 2;
  color: #fff;
  padding: 3px;
  border-radius: 3px 0px 0px 3px;
  right: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
}
.go-prev{
  position: absolute;
  z-index: 2;
  color: #fff;
  padding: 3px;
  border-radius: 0px 3px 3px 0px;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
}
.tab-question{
  padding: 10px;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  color: #000;
  font-weight: medium;
  cursor: pointer;
}
.tab-answer{
  display: none;
  margin-left: 30px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  padding: 10px;
  background-color: #f7f7f7;
  color: #000;
  font-size: 14px;
  border-radius: 4px;
  margin-top: 5px;
}
.tab-question.f-blue{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,1) 0%, rgba(49,105,178,1) 100%);
  color: #fff;
}
/* PORTOFOLIO */
.section-portofolio-1{
  padding: 0px 0px 150px 0px;
}
.section-portofolio-detail{
  background-color: #f4f4f4;
  min-height: 100vh;
}
.bg-dots-portfolio{
  top: -80px;
  left: -40px;
  position: absolute;
  width: 120px;
}
.section-portofolio-detail-other{
  padding: 120px 0px;
}
/* BLOG */
.bg-blog{
  position: absolute;
  top: 0;
  right: 0;
  width: 150px;
}
.sec-blog .card-default{
  margin: 5px 0px !important;
}
.card-blog-big{
  border-radius: 4px;
  height: 100%;
  width: 100%;
  margin-bottom: 5px;
  position: relative;
  margin-bottom: 10px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  border-radius: 4px;
}
.card-blog-big .content-info{
  background-color: #fff;
  padding: 15px;
  width: 50%;
}
.card-blog-big img{
  display: block;
  border-radius: 4px;
}
.card-blog-big .content-info{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
.overlay-color-blog{
  background: -webkit-linear-gradient(-45deg, rgba(18,160,212,0.6) 0%, rgba(49,105,178,0.7) 100%);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.cb-margin{
  margin: 5px 0px;
  display: inline-block;
}
.card-blog-small{
  border-radius: 4px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  background-color: #fff;
}
.cb-margin:first-child{
  margin-top:0px;
}
.cb-margin:last-child{
  margin-bottom: 0px;
}
.card-blog-small img{
  width: 100%;
  display: block;
  border-radius: 4px 0px 0px 4px;
}
.card-blog-small .date,.card-blog-big .date{
  color: #a3a3a3;
  font-size: 12px;
}
.card-blog-small .content-text{
  padding: 10px 15px;
}
.card-blog-small .title,.card-blog-big .title{
  font-size: 14px;
}
.banner-blog-detail{
  height: 50vh;
  position: relative;
}
.banner-blog-detail .title-header-page{
  margin-top: 100px;
}
.blue-text{
  color: #178bdf;
}
.blog-setting{
  background-color: #fff;
  padding: 15px;
  border-radius: 4px;
  box-shadow: 2px 2px 16px 0px rgba(0,0,0,0.14);
  margin-bottom: 30px;
}
.bg-dark{
  background-color: #202020;
}
.text-con-white{
  color: #fff !important;
}
.color-overlay-white{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(-45deg, rgba(230, 230, 230, 0.85) 0%, rgba(255, 255, 255, 0.85) 100%);
}
.color-overlay-dark{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(-45deg, rgba(10, 7, 18, 0.85) 0%, rgba(8, 13, 55, 0.85) 100%);
}
.portfolio-detail-info{
  min-height: 100vh;
  padding: 80px 0px;
  background-size: cover;
  background-position: center;
}
/* SWITCH */
.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 24px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .slider {
  background-color: #242424;
}
input:focus + .slider {
  box-shadow: 0 0 1px #242424;
}
input:checked + .slider:before {
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  transform: translateX(16px);
}
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}
.font-change{
  width: 80px;
  text-align: center;
}
.min-font,.plus-font{
  background-color: #000;
  color: #fff;
  padding: 0px 8px;
  cursor: pointer;
}
/* KONTAK */
#map{
  width: 100%;
  height: 550px;
  margin-bottom: -150px;
  z-index: 1;
}
.map-ornament-top{
  transform: rotate(-180deg);
  position: absolute;
  top: -5px;
  width: 100%;
  z-index: 2;
}
.map-ornament-top path{
  fill:#fff !important;
}
.map-ornament-bot{
  position: absolute;
  bottom: -5px;
  width: 100%;
  z-index: 2;
}
/* FOOTER */
.footer-content{
  margin-top: -5px;
  padding: 80px 0px 20px 0px;
  background-color: #f2f2f2;
}
.footer-content h3{
  font-size: 16px;
  margin-bottom: 30px;
}
.footer-text-p{
  font-size: 14px;
  line-height: 27px;
}
.footer-content ul li{
  list-style-type: none;
  margin-bottom: 15px;
}
.footer-content ul li a{
  text-decoration: none;
  color: #181818;
  font-size: 14px;
}
.footer-content ul li a:hover{
  color: #000;
}
.footer-contact-info a{
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 5px;
  display: inline-block;
  color: #181818;
}
.footer-copyright{
  background-color: #f2f2f2;
}
.footer-copyright-content{
  border-top: 1px solid #ddd;
  padding: 20px 0px;
}
.footer-copyright-content p{
  font-size: 14px;
}
.footer-copyright-content ul{
  margin: 0px;
  text-align: right;
  padding-left: 0px;
}
.footer-copyright-content ul li{
  list-style-type: none;
  display: inline-block;
}
.footer-copyright-content ul li a{
  color: #000;
  font-size: 14px;
  text-decoration: none;
  margin: 0px 5px;
}
/* LOADER */

.d-none{
  display: none;
}

.loader-form {
  background-color: transparent;
  height: 16px;
  width: 16px;
  vertical-align: middle;
  border:3px solid #000;
  margin-right: 5px;
  display: inline-block;
  animation: animateLoader 1.5s ease-in-out infinite;
}
.loader-wrapper span{
  vertical-align: middle;
  font-size: 14px;
  font-weight: medium;
}
@keyframes animateLoader {
  0% {
    box-shadow: inset #fff 0 0 0 17px;
    transform: rotate(-140deg);
  }
  50% {
    box-shadow: inset #fff 0 0 0 2px;
  }
  100% {
    box-shadow: inset #fff 0 0 0 17px;
    transform: rotate(140deg);
  }
}
/* ALERT */
.alert-success{
  position: fixed;
  right: 30px;
  bottom: 30px;
  background-color: #000;
  color: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  z-index: 999;
}
/* 404 */
.error-404{
  padding: 50px 0px;
  width: 100%;
  text-align: center;
}
.img-404{
  width: 50%;
}

.hidden-lg{
  display: none;
}
.show-lg{
  display: block;
}
@media (max-width: 1024px){
  .hidden-1024{
    display: none;
  }
}
@media (min-width:1440px) and (max-width:4000px){
  .bg-web-dev{
    display: none;
  }
}
@media (min-width: 768px) and (max-width:1023px) {
  .hidden-md{
    display: none;
  }
  .show-md{
    display: block;
  }
  .home-about-part-image{
    width: 100%;
  }
  .home-services h2{
    margin-top: 30px
  }
  .home-works{
    padding: 20px 0px;
  }
  .bg-home-works{
    width: 100%;
  }
  .footer-content h3{
    margin-bottom: 0px;
    margin-top: 30px;
  }
  .footer-content{
    padding: 30px 0px 20px 0px;
  }
}
@media (max-width: 425px) {
  .hidden-sm{
    display: none;
  }
  .show-sm{
    display: block;
  }
  /* START */
  .feature-services{
    margin-top: 20px;
  }
  .header-motto{
    text-align: center;
  }
  .header-desc{
    margin-top: 20px;
    text-align: center;
  }
  .home-services h2{
    margin-top: 30px
  }
  .bg-home-works{
    width: 100%;
  }
  .home-works{
    padding: 20px 0px;
  }
  .home-lets-talk-form{
    padding: 30px;
  }
  .card-blog-big{
    height: 200px;
  }
  .bg-blog{
    width: 100%;
  }
  .title-header-page{
    font-size: 24px;
  }
  .footer-content h3{
    margin-bottom: 0px;
    margin-top: 30px;
  }
  .footer-content{
    padding: 30px 0px 20px 0px;
  }
  .footer-copyright{
    text-align: center;
  }
  .footer-copyright-content ul{
    text-align: center;
    margin-top: 10px;
  }
}
.title-dictionary {
  font-size: 36px;
  font-weight: bold;
  margin-top: 30px;
}

.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block
}

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0.5em
}

.resp-sharing-button {
  border-radius: 5px;
  transition: 25ms ease-out;
  padding: 5px 0.75em 8px 0.75em;
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif
}

.resp-sharing-button__icon svg {
  width: 1em;
  height: 1em;
  margin-right: 0.4em;
  vertical-align: top
}

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle
}

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none
}

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none
}

.resp-sharing-button--twitter {
  background-color: #55acee
}

.resp-sharing-button--twitter:hover {
  background-color: #2795e9
}

.resp-sharing-button--pinterest {
  background-color: #bd081c
}

.resp-sharing-button--pinterest:hover {
  background-color: #8c0615
}

.resp-sharing-button--facebook {
  background-color: #3b5998
}

.resp-sharing-button--facebook:hover {
  background-color: #2d4373
}

.resp-sharing-button--tumblr {
  background-color: #35465C
}

.resp-sharing-button--tumblr:hover {
  background-color: #222d3c
}

.resp-sharing-button--reddit {
  background-color: #5f99cf
}

.resp-sharing-button--reddit:hover {
  background-color: #3a80c1
}

.resp-sharing-button--google {
  background-color: #dd4b39
}

.resp-sharing-button--google:hover {
  background-color: #c23321
}

.resp-sharing-button--linkedin {
  background-color: #0077b5
}

.resp-sharing-button--linkedin:hover {
  background-color: #046293
}

.resp-sharing-button--email {
  background-color: #777
}

.resp-sharing-button--email:hover {
  background-color: #5e5e5e
}

.resp-sharing-button--xing {
  background-color: #1a7576
}

.resp-sharing-button--xing:hover {
  background-color: #114c4c
}

.resp-sharing-button--whatsapp {
  background-color: #25D366
}

.resp-sharing-button--whatsapp:hover {
  background-color: #1da851
}

.resp-sharing-button--hackernews {
background-color: #FF6600
}
.resp-sharing-button--hackernews:hover, .resp-sharing-button--hackernews:focus {   background-color: #FB6200 }

.resp-sharing-button--vk {
  background-color: #507299
}

.resp-sharing-button--vk:hover {
  background-color: #43648c
}

.resp-sharing-button--facebook {
  background-color: #3b5998;
  border-color: #3b5998;
}

.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
  background-color: #2d4373;
  border-color: #2d4373;
}

.resp-sharing-button--twitter {
  background-color: #55acee;
  border-color: #55acee;
}

.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
  background-color: #2795e9;
  border-color: #2795e9;
}

.resp-sharing-button--email {
  background-color: #777777;
  border-color: #777777;
}

.resp-sharing-button--email:hover,
.resp-sharing-button--email:active {
  background-color: #5e5e5e;
  border-color: #5e5e5e;
}

.resp-sharing-button--pinterest {
  background-color: #bd081c;
  border-color: #bd081c;
}

.resp-sharing-button--pinterest:hover,
.resp-sharing-button--pinterest:active {
  background-color: #8c0615;
  border-color: #8c0615;
}

.resp-sharing-button--linkedin {
  background-color: #0077b5;
  border-color: #0077b5;
}

.resp-sharing-button--linkedin:hover,
.resp-sharing-button--linkedin:active {
  background-color: #046293;
  border-color: #046293;
}

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

.dropdown-item-wrapper:hover .dropdown-item{
  display: block;
}

.dropdown-item{
  width: 300px;
  display: none;
  background-color: #fff;
  padding: 15px;
  border: 0px;
  top: 100%;
  border-radius: 10px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid #ddd;
  box-shadow: 0px 0px 21px -1px rgba(0,0,0,0.05);
}