/*-- media query for tablet */
/*-- media query for mobile landscape */
/*-- media query for mobile portrait */
body {
  font-family: Arial;
  font-size: 16px;
  line-height: 18px;
  font-weight: normal;
  color: #000;
  background: #f8f8f8; }
h1, h2, h3, h4, h5, h6 {
  padding: 0;
  margin: 0; }
h1 {
  font-size: 157px;
  line-height: 159px;
  color: #000000;
  font-weight: normal;
  font-family: 'BrandonGrotesque-Black'; }
h2 {
  font-size: 110px;
  line-height: 112px;
  color: #000000;
  font-weight: normal;
  padding: 0;
  margin: 0;
  font-family: 'BrandonGrotesque-Black';
  display: inline-block;
  vertical-align: top; }
h3 {
  display: block;
  font-size: 58px;
  line-height: 60px;
  color: #ffffff;
  font-family: 'Flama-Bold';
  margin: 0;
  padding: 0;
  font-weight: normal; }
h4 {
  font-size: 20px;
  line-height: 22px;
  color: #000000;
  font-weight: normal;
  font-family: 'BrandonGrotesque-Black'; }
h5 {
  font-size: 23px;
  line-height: 25px;
  color: #ffffff;
  padding: 0;
  margin: 0;
  font-weight: normal;
  font-family: 'Flama-Bold'; }
h6 {
  padding: 0 0 15px 0;
  font-size: 14px; }
p {
  font-size: 20px;
  line-height: 30px;
  color: #000000;
  font-weight: normal;
  font-family: 'National-Light'; }
ul, ol {
  list-style-type: none;
  margin: 0;
  padding: 0; }
li {
  list-style-type: none;
  line-height: 1px; }
figure {
  margin: 0;
  padding: 0; }
img {
  max-width: 100%;
  height: auto;
  border: 0 none; }
.clear {
  clear: both;
  display: block;
  font-size: 1px;
  line-height: 1px; }
.clearfix:after {
  content: "";
  display: block;
  clear: both; }
a {
  text-decoration: none; }
.get {
  display: inline-block;
  background: #ff4256;
  font-size: 20px;
  line-height: 22px;
  color: #ffffff;
  font-weight: normal;
  font-family: 'BrandonGrotesque-Black';
  text-transform: uppercase;
  position: relative;
  text-transform: uppercase;
  padding: 14px 47px 12px 20px;
  border-radius: 23px;
  width: 63%;
  text-align: left;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
@media (max-width: 991px) {
    .get {
      font-size: 18px; } }
@media (max-width: 479px) {
    .get {
      font-size: 13px; } }
.get:hover {
    background: #c20014; }
.get span {
  background: url(../images/right-arrow1.png) no-repeat right top;
  position: absolute;
  top: 13px;
  right: 17px;
  width: 28px;
  height: 23px; }
@font-face {
  font-family: 'BrandonGrotesque-Black';
  src: url("../fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.eot") format("embedded-opentype"), url("../fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.woff") format("woff"), url("../fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.ttf") format("truetype"), url("../fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.svg#BrandonGrotesque-Black") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'BrandonGrotesque-Regular';
  src: url("../fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.eot") format("embedded-opentype"), url("../fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.otf") format("opentype"), url("../fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.woff") format("woff"), url("../fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.ttf") format("truetype"), url("../fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.svg#BrandonGrotesque-Regular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'National-Light';
  src: url("../fonts/National-Light/National-Light.eot") format("embedded-opentype"), url("../fonts/National-Light/National-Light.woff") format("woff"), url("../fonts/National-Light/National-Light.ttf") format("truetype"), url("../fonts/National-Light/National-Light.svg#National-Light") format("svg");
  font-weight: normal;
  font-style: normal; }
.header-bm {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99999; }
.header-dtls {
  padding: 27px 34px 27px 28px;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
@media (max-width: 1120px) {
    .header-dtls {
      padding: 25px 15px; } }
.sticky .header-bm {
  position: fixed;
  background: #ffffff;
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.sticky .header-dtls {
  padding: 20px 15px; }
@media (max-width: 1120px) {
    .sticky .header-dtls {
      padding: 18px 15px; } }
.logo {
  display: inline-block;
  float: left; }
.logo a {
  display: inline-block;
  font-size: 20px;
  line-height: 22px;
  color: #000000;
  font-weight: normal;
  font-family: 'BrandonGrotesque-Black';
  text-transform: uppercase;
  position: relative; }
nav {
  display: inline-block;
  float: right; }
nav ul li {
  display: inline-block;
  float: left;
  padding: 0 10px;
  position: relative; }
nav ul li a {
  display: inline-block;
  font-size: 20px;
  line-height: 22px;
  color: #000000;
  font-weight: normal;
  font-family: 'BrandonGrotesque-Black';
  position: relative;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
nav ul li a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 1px;
  height: 2px;
  background: #000000;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
nav ul li a:hover:after {
  visibility: visible;
  opacity: 1;
  width: 100%; }
nav ul li:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  -webkit-transform: rotate(25deg);
          transform: rotate(25deg); }
nav ul li:last-child:after {
  display: none; }
.cnt_bt {
  padding: 77px 0 0; }
@media (max-width: 767px) {
    .cnt_bt {
      padding: 0; } }
.cnt_bt ul {
    display: block; }
.cnt_bt ul li {
      display: inline-block;
      padding: 0 10px; }
.cnt_bt ul li a {
        font-size: 20px;
        line-height: 22px;
        color: #000000;
        font-weight: normal;
        font-family: 'BrandonGrotesque-Black';
        position: relative; }
@media (max-width: 479px) {
          .cnt_bt ul li a {
            font-size: 18px;
            line-height: 20px; } }
.cnt_bt ul li a:after {
          content: "/";
          position: absolute;
          right: -9px;
          top: 4px;
          color: #000000;
          font-size: 25px; }
.cnt_bt ul li:last-child a:after {
        display: none; }
/*case-study*/
.header-main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999; }
.sticky .header-main {
  position: fixed;
  background-image: linear-gradient(158deg, #d83f49, #b30f61);
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
/*footer*/
footer {
  background: #ffffff;
  padding: 37px 0; }
@media (max-width: 479px) {
    footer {
      padding: 25px 0; } }
.developer {
  display: block; }
/*society*/
.society {
  float: left;
  width: 25.83%;
  padding: 9px 0 0 0; }
@media (max-width: 991px) {
    .society {
      width: 40%; } }
@media (max-width: 479px) {
    .society {
      width: 100%;
      display: block;
      padding: 9px 0; } }
/*term*/
.term {
  float: left;
  width: 33.33%;
  padding: 7px 0 0 0; }
@media (max-width: 991px) {
    .term {
      width: 60%; } }
@media (max-width: 479px) {
    .term {
      width: 100%;
      display: block; } }
.term p {
    font-size: 17px;
    line-height: 19px;
    padding: 0 0 5px 0;
    font-weight: bold;
    font-family: 'National-Light';
    color: #4a4a4a; }
.term ul li {
    float: left;
    display: inline-block;
    padding: 0 15px 0 0; }
.term ul li a {
      display: block;
      text-decoration: underline;
      color: #ff4256;
      font-size: 14px;
      line-height: 16px; }
.term a {
    display: block;
    text-decoration: underline;
    color: #ff4256;
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
    font-family: 'National-Light'; }
.term .fa-icons {
    padding: 41px 0 33px 0; }
.term .fa-icons span {
      background: #ff4256;
      width: 50px;
      height: 50px;
      display: inline-block;
      border-radius: 100%;
      position: relative;
      vertical-align: middle;
      text-align: center;
      margin: 0 0px 0 2px;
      transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out; }
.term .fa-icons span:hover {
        background: #c20014; }
.term .fa-icons .fa {
      color: #ffffff;
      font-size: 30px;
      line-height: 50px; }
.term .para {
    padding: 25px 0 0 0; }
.term .para p {
      font-size: 14px;
      line-height: 19px;
      font-weight: bold;
      font-family: 'National-Light';
      color: #4a4a4a;
      padding: 0 0 8px 0; }
/*newsletter*/
.newsletter {
  float: left;
  width: 40.83%;
  padding: 7px 0 0 0; }
@media (max-width: 991px) {
    .newsletter {
      width: 100%; } }
@media (max-width: 479px) {
    .newsletter {
      width: 100%;
      display: block; } }
.newsletter a {
    display: block;
    width: 100%; }
.newsletter h4 {
    padding: 25px 10px 5px 21px;
    color: #4a4a4a; }
@media (max-width: 479px) {
      .newsletter h4 {
        padding: 25px 10px 5px 7px; } }
.newsletter p {
    padding: 0 0 10px 20px;
    font-size: 17px;
    line-height: 28px;
    font-weight: bold;
    font-family: 'National-Light';
    color: #4a4a4a; }
@media (max-width: 479px) {
      .newsletter p {
        padding: 0 0 10px 7px; } }
.newsletter ul li {
    float: left;
    width: 25%;
    display: inline-block;
    padding: 9px 25px 9px 0px; }
@media (max-width: 479px) {
      .newsletter ul li {
        padding: 9px;
        width: 50%; } }
.newsletter ul li:last-child {
      padding: 0; }
/*form-group*/
.form-group {
  padding: 0 0 55px 0; }
@media (max-width: 479px) {
    .form-group {
      padding: 0 0 25px 0; } }
.form-group form {
    width: 72%;
    float: left; }
@media (max-width: 991px) {
      .form-group form {
        width: 60%; } }
@media (max-width: 479px) {
      .form-group form {
        width: 100%;
        display: block;
        padding: 0 0 20px 0; } }
.form-group form .form-cnt {
      width: 96%;
      height: 48px;
      padding: 0 18px 0 18px;
      font-size: 21px;
      line-height: 48px;
      color: #9b9b9b;
      outline: none;
      font-family: 'National-Light';
      border-radius: 25px;
      border: 2px solid #9b9b9b; }
@media (max-width: 479px) {
        .form-group form .form-cnt {
          width: 100%; } }
.form-group a {
    width: 28%;
    float: left; }
@media (max-width: 991px) {
      .form-group a {
        width: 40%; } }
@media (max-width: 479px) {
      .form-group a {
        width: 100%;
        display: block; } }
* {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
.wrapper {
  overflow: hidden; }
.container {
  max-width: 1080px;
  margin: 0 auto; }
@media (max-width: 1120px) {
    .container {
      max-width: 100%;
      padding: 0 15px; } }
/*socialmedia*/
.socialmedia {
  position: relative;
  z-index: 1; }
.socialmedia-dtls {
  padding: 180px 8px 0; }
@media (max-width: 991px) {
    .socialmedia-dtls {
      padding: 95px 8px 0; } }
@media (max-width: 479px) {
    .socialmedia-dtls {
      padding: 95px 0 0; } }
.socialmedia-dtls h2 {
    display: inline;
    vertical-align: top;
    line-height: 92px;
    float: left;
    width: calc(100% - 200px);
    width: -webkit-calc(100% - 200px); }
@media (max-width: 1120px) {
      .socialmedia-dtls h2 {
        font-size: 95px; } }
@media (max-width: 991px) {
      .socialmedia-dtls h2 {
        font-size: 72px;
        line-height: 65px; } }
@media (max-width: 767px) {
      .socialmedia-dtls h2 {
        font-size: 48px;
        line-height: 47px; } }
@media (max-width: 599px) {
      .socialmedia-dtls h2 {
        font-size: 29px;
        line-height: 35px; } }
@media (max-width: 479px) {
      .socialmedia-dtls h2 {
        font-size: 29px;
        line-height: 35px; } }
.socialmedia-dtls h2 span {
      display: inline-block;
      vertical-align: top;
      background: #A05FDD;
      padding: 20px 18px; }
@media (max-width: 991px) {
        .socialmedia-dtls h2 span {
          padding: 10px; } }
@media (max-width: 767px) {
        .socialmedia-dtls h2 span {
          padding: 6px; } }
@media (max-width: 599px) {
        .socialmedia-dtls h2 span {
          padding: 5px 10px; } }
.graphics-wrap {
  position: relative;
  margin: 0 0 0 -55px; }
@media (max-width: 767px) {
    .graphics-wrap {
      margin: 0; } }
@media (max-width: 479px) {
    .graphics-wrap {
      padding: 35px 0; } }
.graphics-cnt {
  position: relative;
  z-index: 1;
  width: 53.4%;
  background: #ffffff;
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  float: right;
  padding: 64px 66px 37px 70px;
  margin: -20px -10px 20px 0; }
@media (max-width: 767px) {
    .graphics-cnt {
      width: 100%;
      margin: 0; } }
@media (max-width: 479px) {
    .graphics-cnt {
      padding: 35px; } }
@media (max-width: 479px) {
    .graphics-cnt {
      padding: 25px;
      margin: 0 0 25px; } }
.graphics-cnt h4 {
    line-height: 30px; }
@media (max-width: 479px) {
      .graphics-cnt h4 {
        font-size: 20px;
        line-height: 22px; } }
.graphics-cnt p {
    padding: 19px 0 24px; }
@media (max-width: 479px) {
      .graphics-cnt p {
        font-size: 18px;
        line-height: 25px; } }
.graphics-cnt a {
    float: right; }
@media (max-width: 1120px) {
    .graphics-cnt .get {
      width: 75%; } }
@media (max-width: 991px) {
    .graphics-cnt .get {
      width: 100%; } }
.levels {
  float: left;
  background: #6423C0;
  padding: 11px 0;
  display: inline-block;
  vertical-align: top;
  width: 115px;
  text-align: center; }
@media (max-width: 479px) {
    .levels {
      width: 36%; } }
@media (max-width: 599px) {
    .levels {
      width: 99px;
      padding: 5px 0; } }
.graphics {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  margin: 0 0 -75px; }
@media (max-width: 767px) {
    .graphics {
      margin: 0;
      position: static; } }
.graphics figure {
    display: inline-block;
    vertical-align: top; }
.graphics figure img {
      display: block;
      margin: 0 auto; }
/*main-cnt*/
.main-cnt {
  margin: 0 0 0 -33px;
  z-index: 0; }
.main-cnt ul li {
    margin: 0;
    padding: 0 10px;
    display: inline-block;
    cursor: pointer; }
.icons {
  position: relative;
  display: inline-block; }
.icons .icons-cnt {
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.7);
    height: 100%;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    display: -webkit-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-justify-content: center; }
/*service*/
.service {
  padding: 150px 0 75px; }
@media (max-width: 991px) {
    .service {
      padding: 75px 0; } }
@media (max-width: 767px) {
    .service {
      padding: 35px 0; } }
.service h2 {
    display: inline;
    vertical-align: top;
    line-height: 92px;
    max-width: 475px;
    float: left;
    width: calc(100% - 200px);
    width: -webkit-calc(100% - 200px); }
@media (max-width: 1120px) {
      .service h2 {
        font-size: 95px; } }
@media (max-width: 991px) {
      .service h2 {
        font-size: 80px;
        line-height: 65px; } }
@media (max-width: 599px) {
      .service h2 {
        font-size: 50px;
        line-height: 50px; } }
@media (max-width: 479px) {
      .service h2 {
        font-size: 32px;
        line-height: 32px; } }
.service h2 span {
      display: inline-block;
      vertical-align: top;
      background: #A05FDD;
      padding: 20px 14px;
      color: #000000; }
.service h2 span.white {
        color: #ffffff; }
.service-links ul {
  max-width: 1080px;
  padding: 20px 0 0; }
@media (max-width: 991px) {
    .service-links ul {
      padding: 35px 0 0; } }
@media (max-width: 767px) {
    .service-links ul {
      padding: 0; } }
.service-links ul .links {
    text-align: center;
    cursor: pointer;
    width: 33.33%;
    display: inline-block;
    float: left;
    margin: 0 -5px 0 0; }
.service-links ul .links.active {
      margin: -20px 0 0 -9px;
      width: 35.03%; }
@media (max-width: 767px) {
        .service-links ul .links.active {
          width: 100%;
          margin: 0; } }
.service-links ul .links.active small {
        padding: 24px 0; }
.service-links ul .links.active .design p {
        padding: 7px 5px; }
.service-links ul .links.active .design span {
        margin: 20px 0 28px;
        width: 100%;
        box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.service-links ul .links.active .great-design {
        padding: 18px 25px 38px;
        box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
@media (max-width: 991px) {
          .service-links ul .links.active .great-design {
            padding: 20px 20px 30px; } }
.service-links ul .links > span {
      display: inline-block;
      text-align: center;
      padding: 0 0 17px; }
.service-links ul .links small {
      font-size: 38px;
      line-height: 40px;
      color: #ffffff;
      display: block;
      text-align: center;
      padding: 20px 0;
      font-family: 'BrandonGrotesque-Black'; }
@media (max-width: 767px) {
      .service-links ul .links {
        width: 100%;
        padding: 15px 0; } }
.great-design {
  background: #ffffff;
  padding: 18px 25px 30px; }
@media (max-width: 991px) {
    .great-design {
      padding: 15px 15px 20px; } }
.design {
  text-align: left; }
.design p {
    font-size: 30px;
    line-height: 32px;
    color: #000000;
    padding: 5px 5px 7px;
    font-family: 'National-Light'; }
@media (max-width: 1120px) {
      .design p {
        font-size: 28px; } }
@media (max-width: 991px) {
      .design p {
        font-size: 20px;
        line-height: 22px;
        padding: 3px 5px; } }
.design p b {
      padding: 0 0 0 18px;
      vertical-align: top; }
.design span {
    width: 100%;
    height: 3px;
    background: #ececec;
    display: block;
    margin: 16px 0;
    box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.start {
  text-align: center; }
.start span {
    font-size: 39px;
    line-height: 41px;
    color: #000000;
    font-family: 'BrandonGrotesque-Black';
    display: block; }
.start .get {
    width: 87%; }
.start .get.get1 {
      background: #59dcc4;
      transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out; }
.start .get.get1:hover {
        background: #209680; }
.start .get.get2 {
      background: #2eb9e0;
      transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out; }
.start .get.get2:hover {
        background: #12657c; }
.start .get.get3 {
      background: #A05FDD;
      transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out; }
.start .get.get3:hover {
        background: #60219b; }
.start p {
    padding: 6px 0 15px;
    font-family: 'National-Light';
    font-weight: bold; }
.great {
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.great small {
    background: #59dcc4; }
.better {
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 1; }
.better small {
    background: #2eb9e0; }
.best {
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.best small {
    background: #A05FDD; }
/*custom*/
.custom {
  padding: 18px 0 54px;
  text-align: center; }
@media (max-width: 479px) {
    .custom {
      padding: 20px 0; } }
.custom b {
    font-size: 30px;
    line-height: 34px;
    color: #000000;
    font-family: 'BrandonGrotesque-Black'; }
@media (max-width: 479px) {
      .custom b {
        font-size: 25px;
        line-height: 30px; } }
.custom small {
    font-size: 31px;
    line-height: 34px;
    padding: 0 0 0 16px;
    letter-spacing: 0;
    color: #000000;
    font-family: 'National-Light';
    font-weight: bold; }
@media (max-width: 479px) {
      .custom small {
        font-size: 20px;
        line-height: 25px;
        padding: 0 0 0 10px; } }
.btn {
  text-align: center;
  margin: 22px 0; }
.btn .get {
    width: 27%; }
@media (max-width: 767px) {
      .btn .get {
        width: 50%; } }
/*banner-bt*/
.banner-bt img {
  width: 100%; }
/*index.html*/
/*designs*/
.designs {
  position: relative; }
.designs-dtls {
  padding: 180px 0 0; }
@media (max-width: 767px) {
    .designs-dtls {
      padding: 80px 0 0; } }
.designs-dtls h1 {
    display: inline-block;
    vertical-align: top;
    line-height: 128px; }
@media (max-width: 991px) {
      .designs-dtls h1 {
        font-size: 115px;
        line-height: 97px; } }
@media (max-width: 767px) {
      .designs-dtls h1 {
        font-size: 90px;
        line-height: 77px; } }
@media (max-width: 599px) {
      .designs-dtls h1 {
        font-size: 60px;
        line-height: 40px; } }
@media (max-width: 479px) {
      .designs-dtls h1 {
        font-size: 40px;
        line-height: 25px; } }
.designs-dtls h1 span {
      display: inline-block;
      vertical-align: top;
      background: #59dcc4;
      padding: 14px 28px 14px 18px;
      margin: 0 0 -28px; }
.designs-dtls h1 span:first-child {
        padding-top: 28px; }
@media (max-width: 479px) {
        .designs-dtls h1 span {
          padding: 15px 23px 9px 18px; } }
@media (max-width: 991px) {
        .designs-dtls h1 span {
          margin: 0 0 -16px; } }
@media (max-width: 599px) {
        .designs-dtls h1 span {
          margin: 0 0 -2px; } }
.designs-dtls h1 small {
      padding-bottom: 28px;
      color: #ffffff;
      display: inline-block;
      vertical-align: top;
      background: #59dcc4;
      padding: 14px 24px 14px 19px;
      font-size: 157px; }
@media (max-width: 991px) {
        .designs-dtls h1 small {
          font-size: 115px;
          line-height: 97px; } }
@media (max-width: 767px) {
        .designs-dtls h1 small {
          font-size: 90px;
          line-height: 77px; } }
@media (max-width: 599px) {
        .designs-dtls h1 small {
          font-size: 60px;
          line-height: 40px; } }
@media (max-width: 479px) {
        .designs-dtls h1 small {
          font-size: 40px;
          line-height: 25px;
          padding: 10px 24px 10px 19px; } }
.creative-wrap {
  position: relative;
  margin: -19px 0 0; }
@media (max-width: 767px) {
    .creative-wrap {
      margin: 0; } }
.creative-cnt {
  width: 597px;
  background: #ffffff;
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  float: right;
  padding: 64px 66px 37px 70px; }
@media (max-width: 767px) {
    .creative-cnt {
      width: 551px; } }
@media (max-width: 599px) {
    .creative-cnt {
      width: 432px;
      padding: 25px; } }
@media (max-width: 479px) {
    .creative-cnt {
      width: 273px;
      padding: 15px; } }
.creative-cnt h4 {
    line-height: 30px; }
@media (max-width: 479px) {
      .creative-cnt h4 {
        line-height: 25px; } }
.creative-cnt p {
    padding: 19px 0 24px; }
@media (max-width: 479px) {
      .creative-cnt p {
        font-size: 18px;
        line-height: 25px;
        padding: 15px 0; } }
.creative-cnt a {
    float: right; }
.creative-cnt .get4 {
    width: 46%; }
@media (max-width: 767px) {
      .creative-cnt .get4 {
        width: 70%; } }
.service-cnt {
  padding: 85px 0 0; }
@media (max-width: 767px) {
    .service-cnt {
      padding: 50px 0 0; } }
@media (max-width: 479px) {
    .service-cnt {
      padding: 30px 0 0; } }
.service-cnt h2 {
    display: inline;
    vertical-align: top;
    line-height: 92px;
    max-width: 607px;
    padding: 0 0 19px;
    float: left;
    width: calc(100% - 200px);
    width: -webkit-calc(100% - 200px); }
@media (max-width: 991px) {
      .service-cnt h2 {
        font-size: 90px; } }
@media (max-width: 767px) {
      .service-cnt h2 {
        font-size: 60px;
        line-height: 35px; } }
@media (max-width: 599px) {
      .service-cnt h2 {
        font-size: 50px;
        width: auto; } }
@media (max-width: 479px) {
      .service-cnt h2 {
        font-size: 40px;
        line-height: 15px; } }
.service-cnt h2 span {
      display: inline-block;
      vertical-align: top;
      background: #59dcc4;
      padding: 13px 15px 10px 12px;
      margin: 0 0 -19px;
      color: #000000; }
@media (max-width: 767px) {
        .service-cnt h2 span {
          margin: 0; } }
.service-cnt h2 span small {
        display: inline-block;
        vertical-align: top;
        background: #59dcc4;
        color: #ffffff;
        font-size: 110px; }
@media (max-width: 991px) {
          .service-cnt h2 span small {
            font-size: 90px; } }
@media (max-width: 767px) {
          .service-cnt h2 span small {
            font-size: 60px;
            line-height: 35px; } }
@media (max-width: 599px) {
          .service-cnt h2 span small {
            font-size: 50px; } }
@media (max-width: 479px) {
          .service-cnt h2 span small {
            font-size: 40px;
            line-height: 15px; } }
.social-links {
  padding: 0 0 149px; }
.media-links {
  -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); }
@media (max-width: 767px) {
    .media-links {
      padding: 0 0 50px; } }
@media (max-width: 479px) {
    .media-links {
      padding: 0 0 30px; } }
.media-links ul li {
    position: relative;
    float: left;
    display: inline-block;
    width: 33.33%;
    text-align: center;
    min-height: 360px;
    vertical-align: middle;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    display: -webkit-flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-align-items: center;
    cursor: pointer;
    background: #f8f8f8; }
.media-links ul li:hover .sub-link {
      visibility: visible;
      opacity: 1;
      -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
      -o-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
      -ms-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
      box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); }
@media (max-width: 767px) {
      .media-links ul li {
        width: 50%; } }
@media (max-width: 599px) {
      .media-links ul li {
        width: 100%; } }
@media (max-width: 767px) {
      .media-links ul li:nth-child(4n) {
        background: #ffffff; } }
@media (max-width: 599px) {
      .media-links ul li:nth-child(4n) {
        background: #f8f8f8; } }
.media-links ul li:nth-child(4n+1) {
      background: #ffffff; }
.media-links ul li:nth-child(4n+3) {
      background: #ffffff; }
@media (max-width: 767px) {
        .media-links ul li:nth-child(4n+3) {
          background: #f8f8f8; } }
@media (max-width: 599px) {
        .media-links ul li:nth-child(4n+3) {
          background: #ffffff; } }
.media-links ul li .report span {
      padding: 31px 0 0;
      font-size: 20px;
      line-height: 22px;
      font-weight: normal;
      display: block;
      color: #000000;
      font-family: 'BrandonGrotesque-Black'; }
@media (max-width: 991px) {
        .media-links ul li .report span {
          font-size: 16px;
          line-height: 18px; } }
.sub-link {
  background: #ffffff;
  padding: 25px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  height: 100%;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  z-index: 9999; }
@media (max-width: 991px) {
    .sub-link {
      padding: 15px; } }
.sub-link figure {
    float: left; }
.sub-link span {
    float: left;
    padding: 25px 0 0 25px !important; }
@media (max-width: 991px) {
      .sub-link span {
        padding: 10px 0 0 10px !important; } }
.sub-link a {
    float: right; }
.sub-link .get6 {
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 100%;
    padding: 0; }
.sub-link .get6 span {
      right: 13px; }
.sub-link p {
    text-align: left;
    padding: 0 0 25px; }
@media (max-width: 991px) {
      .sub-link p {
        font-size: 16px;
        line-height: 18px; } }
.sub-cnt {
  padding: 0 0 25px; }
.sub-cnt img {
    max-width: 80%; }
.right-main {
  position: relative;
  background: url("../images/particles-shape.jpg") no-repeat center center;
  background-size: cover;
  min-height: 590px;
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.right-main:before {
    content: "";
    position: absolute;
    left: -90px;
    top: -53px;
    background: url("../images/mobile.png") no-repeat center center;
    width: 792px;
    height: 793px;
    background-size: contain; }
@media (max-width: 1200px) {
      .right-main:before {
        left: -96px;
        top: -79px;
        width: 700px; } }
@media (max-width: 1120px) {
      .right-main:before {
        left: -127px;
        top: -101px;
        width: 647px; } }
@media (max-width: 767px) {
      .right-main:before {
        position: static;
        display: inline-block; } }
@media (max-width: 991px) {
      .right-main:before {
        left: -114px;
        top: -121px;
        width: 529px; } }
@media (max-width: 767px) {
      .right-main:before {
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
        padding-top: 100%; } }
.right-rt {
  float: right;
  width: 48%;
  padding: 39px 65px 0 0; }
@media (max-width: 1200px) {
    .right-rt {
      padding: 39px 10px 0 0;
      width: 50%; } }
@media (max-width: 767px) {
    .right-rt {
      width: 100%;
      float: none;
      padding: 25px; } }
.right-rt h4 {
    padding: 0 0 11px; }
.right-rt figure {
    padding: 0 0 30px; }
.right-rt p {
    padding: 0 0 19px;
    font-weight: bold; }
.right-rt .get5 {
    background: #ffffff;
    color: #000000;
    transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out; }
.right-rt .get5:hover {
      background: #bfbfbf; }
@media (max-width: 991px) {
      .right-rt .get5 {
        width: 80%; } }
.right-rt .get5 span {
      background: url("../images/right-arrow.png") no-repeat right top; }
.cnt-btm {
  padding: 0 0 150px; }
.cnt-main {
  box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.2); }
.btm-main {
  float: right;
  width: 66.5%; }
@media (max-width: 767px) {
    .btm-main {
      width: 100%;
      float: none; } }
.mobile {
  background: #ce1d2c;
  width: 33.5%;
  float: left;
  position: relative;
  min-height: 725px;
  overflow: hidden;
  padding: 77px 0 0;
  text-align: center; }
.mobile:after {
    content: "";
    position: absolute;
    left: -75px;
    bottom: -130px;
    background: url("../images/mobile-blur.png") no-repeat center center;
    width: 589px;
    height: 665px; }
@media (max-width: 767px) {
    .mobile {
      width: 100%;
      float: none; } }
.monitor {
  background: #ffffff;
  overflow: hidden;
  position: relative;
  min-height: 359px; }
.monitor figure {
    float: right;
    padding: 23px 0 0; }
.monitor:after {
    content: "";
    position: absolute;
    left: -160px;
    bottom: -219px;
    background: url("../images/mobile-map.png") no-repeat center center;
    width: 767px;
    height: 617px;
    background-size: contain; }
@media (max-width: 991px) {
      .monitor:after {
        width: 665px; } }
@media (max-width: 767px) {
    .monitor {
      width: 100%;
      float: none; } }
.church figure {
  float: left;
  max-width: 50%; }
.church figure img {
    height: 361px;
    -o-object-fit: cover;
       object-fit: cover; }
@media (max-width: 991px) {
  .church {
    width: 100%; } }
/*--case-study start--*/
.header1 {
  background-image: linear-gradient(158deg, #d83f49, #b30f61);
  z-index: 1;
  position: static; }
.header1 .logo a {
    color: #fff; }
.header1 nav ul li a {
    color: #fff; }
.header1 .header_bt {
    padding: 153px 0 0; }
@media (max-width: 599px) {
      .header1 .header_bt {
        padding: 85px 0 0; } }
.header1 .header_bt ul {
      display: block; }
.header1 .header_bt ul li {
        display: inline-block;
        padding: 0 10px; }
.header1 .header_bt ul li a {
          font-size: 20px;
          line-height: 22px;
          color: #ffffff;
          font-weight: normal;
          font-family: 'BrandonGrotesque-Black';
          position: relative; }
@media (max-width: 479px) {
            .header1 .header_bt ul li a {
              font-size: 18px;
              line-height: 20px; } }
.header1 .header_bt ul li a:after {
            content: "/";
            position: absolute;
            right: -9px;
            top: 4px;
            color: #ffffff;
            font-size: 25px; }
.header1 .header_bt ul li:last-child a:after {
          display: none; }
.header_cont {
  display: block;
  position: relative;
  z-index: 1;
  padding: 102px 0 0; }
@media (max-width: 767px) {
    .header_cont {
      padding: 30px 0 0; } }
.header_cont:after {
    content: "";
    background: url("../images/hand_img.png") no-repeat bottom right;
    bottom: -39px;
    position: absolute;
    right: -16%;
    background-size: cover;
    width: 1072px;
    height: 925px;
    z-index: -1; }
@media (max-width: 1500px) {
      .header_cont:after {
        background-size: contain;
        right: 0;
        width: 55%; } }
@media (max-width: 767px) {
      .header_cont:after {
        display: none; } }
.header_cont_in {
  padding: 0 0 0 7px;
  display: block; }
.header_cont_in .header_left {
    padding: 0 0 153px;
    float: left;
    width: 45%; }
@media (max-width: 1410px) {
      .header_cont_in .header_left {
        padding: 0 0 50px; } }
@media (max-width: 767px) {
      .header_cont_in .header_left {
        float: none;
        width: 100%; } }
.header_cont_in .header_left a {
      display: block; }
.header_cont_in .header_left p {
      font-family: 'National-Light';
      font-size: 40px;
      line-height: 46px;
      color: #fff;
      font-weight: bold;
      padding: 28px 0 0; }
@media (max-width: 991px) {
        .header_cont_in .header_left p {
          font-size: 25px;
          line-height: 33px; } }
.header_right {
  float: right;
  width: 100%; }
.header_right figure img {
    display: none; }
@media (max-width: 767px) {
      .header_right figure img {
        display: block; } }
.problem_in {
  display: block; }
.problem_in .problem_cont {
    padding: 163px 0 162px; }
@media (max-width: 767px) {
      .problem_in .problem_cont {
        padding: 50px 0; } }
.problem_in .problem_cont ul {
      display: block;
      font-size: 0; }
.problem_in .problem_cont ul li {
        display: inline-block;
        width: 33.3%;
        vertical-align: top;
        padding: 0 20px; }
@media (max-width: 767px) {
          .problem_in .problem_cont ul li {
            width: 100%;
            display: block;
            padding: 0 0 25px; } }
.problem_in .problem_cont ul li .problem_bk h5 {
          font-family: 'BrandonGrotesque-Black';
          font-size: 20px;
          font-weight: 900;
          font-style: normal;
          padding: 0 0 9px;
          line-height: 22px;
          letter-spacing: normal;
          color: #000000; }
.problem_in .problem_cont ul li .problem_bk p {
          font-family: 'National-Light';
          font-size: 20px;
          font-weight: normal;
          line-height: 31px;
          letter-spacing: normal;
          color: #000000; }
.img_block1 figure img {
  display: block;
  width: 100%; }
.working_in .work_bk {
  display: block;
  padding: 198px 0 205px; }
@media (max-width: 1024px) {
    .working_in .work_bk {
      padding: 100px 0; } }
@media (max-width: 767px) {
    .working_in .work_bk {
      padding: 50px 0; } }
.work_lt {
  float: left;
  display: inline-block;
  width: 17%;
  padding: 17px 25px 0 0; }
@media (max-width: 1024px) {
    .work_lt {
      width: 30%; } }
@media (max-width: 479px) {
    .work_lt {
      width: 100%;
      float: none;
      display: block; } }
.work_lt figure img {
    display: block;
    margin: 0 auto; }
.work_lt h5 {
    color: #000000;
    font-size: 19px;
    line-height: 20px;
    font-family: 'BrandonGrotesque-Black';
    font-weight: normal;
    text-align: right;
    padding: 15px 0 2px; }
@media (max-width: 479px) {
      .work_lt h5 {
        text-align: center; } }
.work_lt span {
    color: #9b9b9b;
    font-size: 16px;
    line-height: 21px;
    font-weight: normal;
    font-family: 'National-Light';
    text-align: right;
    display: block; }
@media (max-width: 479px) {
      .work_lt span {
        text-align: center; } }
.work_rt {
  float: right;
  display: inline-block;
  width: 82%; }
@media (max-width: 1024px) {
    .work_rt {
      width: 70%; } }
@media (max-width: 479px) {
    .work_rt {
      width: 100%;
      float: none;
      display: block; } }
.work_rt p {
    font-size: 40px;
    font-weight: normal;
    font-style: italic;
    line-height: 47px;
    letter-spacing: normal;
    color: #000000;
    padding: 9px 0 0; }
@media (max-width: 1024px) {
      .work_rt p {
        font-size: 30px; } }
@media (max-width: 767px) {
      .work_rt p {
        font-size: 25px;
        line-height: 30px; } }
.out_in {
  background: #f6f6f6; }
.out_txt {
  padding: 0 0 184px 10px;
  display: block; }
@media (max-width: 991px) {
    .out_txt {
      padding: 0 0 150px; } }
@media (max-width: 767px) {
    .out_txt {
      padding: 0 0 50px; } }
.out_txt .out_lt {
    float: left;
    display: inline-block;
    width: 40%; }
@media (max-width: 767px) {
      .out_txt .out_lt {
        width: 100%;
        display: block;
        margin: 0 0 25px; } }
.out_txt .out_lt p {
      font-family: 'BrandonGrotesque-black';
      font-size: 40px;
      font-weight: bold;
      font-style: normal;
      font-stretch: normal;
      line-height: 53px;
      letter-spacing: normal;
      color: #ff4256; }
@media (max-width: 991px) {
        .out_txt .out_lt p {
          font-size: 30px;
          line-height: 40px; } }
@media (max-width: 767px) {
        .out_txt .out_lt p {
          font-size: 25px;
          line-height: 30px; } }
.out_txt .out_rt {
    display: inline-block;
    float: right;
    width: 54.8%;
    padding: 0 10px 0 0; }
@media (max-width: 767px) {
      .out_txt .out_rt {
        width: 100%;
        display: block; } }
.out_txt .out_rt p {
      font-family: 'National-Light';
      font-size: 20px;
      font-weight: normal;
      font-style: normal;
      font-stretch: normal;
      line-height: 32px;
      letter-spacing: normal;
      color: #000000;
      padding: 0 0 33px; }
.img_block2 {
  display: block; }
.img_block2 figure img {
    display: block;
    width: 100%; }
.single_in {
  display: block;
  padding: 273px 0 0; }
@media (max-width: 991px) {
    .single_in {
      padding: 80px 0 0 0 !important; } }
@media (max-width: 1410px) {
    .single_in {
      padding: 150px 0 0; } }
.single_in .single_bk {
    position: relative; }
.single_in .single_bk:after {
      content: "";
      background: url("../images/small_img2.png") no-repeat;
      width: 615px;
      height: 723px;
      position: absolute;
      left: -132px;
      top: -41px; }
@media (max-width: 1024px) {
        .single_in .single_bk:after {
          background-size: 80%; } }
@media (max-width: 767px) {
        .single_in .single_bk:after {
          display: none; } }
@media (max-width: 991px) {
        .single_in .single_bk:after {
          top: 5px; } }
.single_in .single_bk .single_lt {
      float: left;
      width: 50%;
      position: relative;
      display: none; }
@media (max-width: 767px) {
        .single_in .single_bk .single_lt {
          display: block;
          width: 100%;
          float: none; } }
.single_in .single_bk .single_lt figure img {
        display: block;
        width: 100%; }
.single_in .single_bk .single_rt {
      float: right;
      width: 46.5%;
      padding: 195px 17px 161px 0; }
@media (max-width: 767px) {
        .single_in .single_bk .single_rt {
          display: block;
          width: 100%;
          float: none;
          padding: 30px 0; } }
@media (max-width: 1024px) {
        .single_in .single_bk .single_rt {
          padding: 100px 0; } }
.single_in .single_bk .single_rt p {
        font-family: 'National-Light';
        font-size: 20px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: 32px;
        letter-spacing: normal;
        color: #000000;
        padding: 0 0 33px; }
.img_block3 {
  background-image: linear-gradient(216deg, #d83f49, #b30f61);
  position: relative;
  z-index: 9; }
.img_block3 figure img {
    margin: -55px 0 0;
    display: inline-block;
    width: 100%; }
.img_bk_cont {
  display: block;
  padding: 62px 0 151px;
  max-width: 680px;
  margin: 0 auto; }
@media (max-width: 1024px) {
    .img_bk_cont {
      padding: 40px 0; } }
.img_bk_cont span {
    display: block; }
.img_bk_cont span img {
      margin: 0 auto;
      display: block; }
.img_bk_cont p {
    font-size: 40px;
    font-weight: normal;
    line-height: 48px;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    padding: 13px 0 3px; }
@media (max-width: 1024px) {
      .img_bk_cont p {
        font-size: 30px;
        line-height: 40px; } }
@media (max-width: 767px) {
      .img_bk_cont p {
        font-size: 25px;
        line-height: 30px; } }
.img_block4 {
  display: block;
  padding: 76px 0 144px; }
@media (max-width: 767px) {
    .img_block4 {
      padding-bottom: 0; } }
.img_block4 figure img {
    display: block;
    width: 100%; }
.simlar_in {
  display: block;
  max-width: 680px;
  margin: 0 auto;
  padding: 81px 0 0; }
.simlar_in p {
    font-family: 'National-Light';
    font-size: 20px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 32px;
    letter-spacing: normal;
    color: #000000;
    padding: 0 0 31px; }
.service_img {
  position: absolute;
  left: 0;
  right: 0;
  top: 58%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -moz-transform: translateY(-50%); }
@media (max-width: 1024px) {
    .service_img {
      top: 64%;
      padding: 0 10px; } }
@media (max-width: 767px) {
    .service_img {
      top: 65%; } }
@media (max-width: 599px) {
    .service_img {
      top: 68%; } }
@media (max-width: 479px) {
    .service_img {
      top: 59%; } }
.service_img span {
    display: block;
    font-family: 'National-Regular';
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 20px;
    letter-spacing: normal;
    color: #fff;
    text-align: center;
    padding: 0 0 10px; }
@media (max-width: 767px) {
      .service_img span {
        font-size: 12px;
        line-height: 12px; } }
@media (max-width: 599px) {
      .service_img span {
        font-size: 10px;
        line-height: 10px; } }
.service_img h5 {
    font-family: 'BrandonGrotesque-Black';
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 20px;
    letter-spacing: normal;
    color: #fff;
    text-align: center;
    display: block; }
@media (max-width: 599px) {
      .service_img h5 {
        font-size: 13px;
        line-height: 15px; } }
.services_in {
  display: block;
  padding: 0 0 292px; }
@media (max-width: 767px) {
    .services_in {
      padding: 0 0 150px; } }
.svg-img {
  display: none !important; }
.services_bk {
  display: block;
  position: relative;
  padding: 138px 0 0; }
@media (max-width: 479px) {
    .services_bk {
      padding: 50px 0 0; } }
@media (max-width: 1200px) {
    .services_bk figure {
      width: 52%;
      margin: 0 auto; } }
@media (max-width: 479px) {
    .services_bk figure {
      width: 80%; } }
.services_bk figure img {
    display: block;
    margin: 0 auto; }
@media (max-width: 1200px) {
      .services_bk figure img {
        width: 100%; } }
.img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  margin: 0 auto; }
@media (max-width: 767px) {
    .img {
      width: 115px; } }
@media (max-width: 599px) {
    .img {
      width: 95px; } }
@media (max-width: 479px) {
    .img {
      width: 25px; } }
.img span {
    font-family: 'BrandonGrotesque-Black';
    font-size: 16px;
    padding: 0 0 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 20px;
    letter-spacing: normal;
    color: #000;
    text-align: center;
    display: block; }
@media (max-width: 479px) {
      .img span {
        display: none; } }
@media (max-width: 479px) {
      .img span {
        font-size: 12px;
        line-height: 14px; } }
@media only screen and (min-width: 1025px) {
    .img:hover .act_in {
      display: block; } }
.img:hover span {
    color: #f00; }
.img a {
    display: block; }
.img a img {
      display: block;
      margin: 0 auto; }
@media (max-width: 479px) {
        .img a img {
          width: 30px; } }
.img a img.png-img {
        opacity: 1;
        visibility: visible; }
.img a img.svg-img {
        opacity: 0;
        visibility: hidden;
        height: 0; }
.img2 {
  left: 10.2%;
  right: auto;
  top: 25%; }
@media (max-width: 767px) {
    .img2 {
      left: 11.2%;
      top: 17%; } }
.img2 a {
    display: inline-block; }
.img2 span {
    display: inline-block;
    vertical-align: top;
    margin: 33px 10px 0 0; }
@media (max-width: 479px) {
      .img2 span {
        display: none; } }
.img3 {
  left: auto;
  right: 88px;
  top: 25%; }
@media (max-width: 1200px) {
    .img3 {
      right: 22px; } }
.img3 a {
    display: inline-block; }
.img3 span {
    display: inline-block;
    vertical-align: top;
    margin: 13px -15px 0 13px;
    text-align: left; }
@media (max-width: 479px) {
      .img3 span {
        display: none; } }
@media (max-width: 479px) {
      .img3 span {
        margin: 8px 0 0 -27px; } }
.img4 {
  left: 4.2%;
  right: auto;
  top: 64%; }
@media (max-width: 1200px) {
    .img4 {
      left: 1.5%; } }
@media (max-width: 767px) {
    .img4 {
      left: 5.5%;
      top: 64%; } }
@media (max-width: 599px) {
    .img4 {
      left: 1.5%; } }
.img4 a {
    display: inline-block; }
.img4 span {
    display: inline-block;
    vertical-align: top;
    margin: 33px 10px 0 0; }
@media (max-width: 479px) {
      .img4 span {
        display: none; } }
.img5 {
  left: auto;
  right: 45px;
  top: 65%; }
@media (max-width: 1200px) {
    .img5 {
      right: 0; } }
@media (max-width: 599px) {
    .img5 {
      right: 22px; } }
@media (max-width: 479px) {
    .img5 {
      right: 0; } }
.img5 a {
    display: inline-block; }
.img5 span {
    display: inline-block;
    vertical-align: top;
    margin: 13px -15px 0 13px;
    text-align: left; }
@media (max-width: 479px) {
      .img5 span {
        display: none; } }
@media (max-width: 479px) {
      .img5 span {
        margin: 0 0 0 -27px; } }
.img6 {
  right: 31%;
  bottom: -15%;
  margin: 0;
  top: auto;
  left: auto; }
@media (max-width: 767px) {
    .img6 {
      bottom: -27%;
      right: 26%; } }
@media (max-width: 1200px) {
    .img6 {
      bottom: -20%; } }
@media (max-width: 599px) {
    .img6 {
      bottom: -29%; } }
@media (max-width: 479px) {
    .img6 {
      bottom: -35px; } }
.img6 span {
    padding: 10px 0; }
.img7 {
  left: 35%;
  bottom: -15%;
  margin: 0;
  top: auto;
  right: auto; }
@media (max-width: 767px) {
    .img7 {
      left: 22%;
      bottom: -27%; } }
@media (max-width: 599px) {
    .img7 {
      bottom: -33%; } }
@media (max-width: 479px) {
    .img7 {
      bottom: -38px; } }
.img7 span {
    padding: 10px 0; }
.delived_in {
  display: block; }
.delived_cont {
  border-top: 2px solid #ccc;
  padding: 56px 0 0; }
.delived_cont > ul {
    display: block;
    font-size: 0; }
.delived_cont > ul > li {
      display: inline-block;
      width: 33.3%;
      padding: 0 20px;
      vertical-align: top; }
@media (max-width: 767px) {
        .delived_cont > ul > li {
          width: 100%;
          display: block;
          padding: 0 0 25px; } }
.delived_bk h5 {
  font-family: 'BrandonGrotesque-Black';
  font-size: 20px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 20px;
  letter-spacing: normal;
  color: #000;
  padding: 0 0 11px;
  display: block; }
.delived_bk ul {
  display: block; }
.delived_bk ul li {
    display: block; }
.delived_bk ul li p {
      font-family: 'National-Light';
      font-size: 20px;
      padding: 0 0 20px;
      font-weight: normal;
      font-style: normal;
      font-stretch: normal;
      line-height: 29px;
      letter-spacing: normal;
      color: #000;
      display: block; }
.act_in {
  background: #e5e5e5;
  width: 246px;
  padding: 15px;
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 99;
  margin: 0 auto; }
@media (max-width: 767px) {
    .act_in {
      margin: 15px auto; } }
.act_in p {
    font-family: 'National-Light';
    font-size: 20px;
    padding: 0 0 20px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 29px;
    letter-spacing: normal;
    color: #000;
    display: block; }
.talk_in {
  text-align: center;
  padding: 128px 0;
  max-width: 1010px;
  margin: 0 auto; }
@media (max-width: 1024px) {
    .talk_in {
      padding: 100px 0; } }
@media (max-width: 767px) {
    .talk_in {
      padding: 50px 0; } }
.talk_in h2 {
    font-size: 40px;
    line-height: 44px;
    font-family: 'National-Light';
    font-weight: normal;
    padding: 0 0 31px; }
@media (max-width: 1024px) {
      .talk_in h2 {
        font-size: 30px;
        line-height: 40px; } }
@media (max-width: 767px) {
      .talk_in h2 {
        font-size: 25px;
        line-height: 30px; } }
.talk_in a {
    width: 33%; }
@media (max-width: 599px) {
      .talk_in a {
        width: 45%; } }
@media (max-width: 479px) {
      .talk_in a {
        width: 100%; } }
.next_project {
  display: block;
  background: #eaeaea; }
.next_in {
  display: block; }
@media (max-width: 767px) {
    .next_in {
      padding: 30px 0; } }
.next_lt {
  float: left;
  width: 51%; }
@media (max-width: 767px) {
    .next_lt {
      width: 100%;
      float: none;
      display: block;
      margin: 20px 0 0;
      padding: 0; } }
.next_lt figure {
    margin: -49px 0 0; }
.next_lt figure img {
      display: block;
      margin: 0 auto; }
.next_rt {
  display: block;
  float: right;
  width: 44.2%;
  padding: 98px 0 0; }
@media (max-width: 991px) {
    .next_rt {
      padding: 35px 0 0; } }
@media (max-width: 767px) {
    .next_rt {
      width: 100%;
      float: none;
      display: block;
      padding: 10px 0 0; } }
.next_rt h5 {
    font-family: 'BrandonGrotesque-black';
    font-size: 24px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 55px;
    letter-spacing: normal;
    color: #000; }
.next_rt a.get {
    width: 43%;
    background: #fff;
    color: #000;
    display: block;
    margin: 24px 0 0; }
@media (max-width: 1024px) {
      .next_rt a.get {
        width: 60%; } }
.next_rt a.get span {
      background: url("../images/right-arrow.png") no-repeat right top; }
.animation {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out; }
.animation figure {
    position: absolute;
    transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out; }
.ani-card1 {
  top: 0;
  right: 0;
  width: 100%; }
.ani-card2 {
  right: 0;
  top: 0;
  width: 100%;
  z-index: 99; }
.ani-card3 {
  right: -0;
  bottom: 0;
  width: 100%;
  z-index: 9; }
.ani-card4 {
  left: 0;
  bottom: 0;
  width: 100%; }
.ani-card5 {
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 99; }
.ani-card6 {
  left: 0;
  top: 0;
  width: 100%; }
.ani-card7 {
  left: 0;
  top: 0;
  width: 100%; }
@media (min-width: 1025px) {
  li:hover .animation {
    opacity: 1;
    visibility: visible; }
  li:hover .ani-card1 {
    top: -84px;
    right: -58px;
    width: 100%; }
  li:hover .ani-card2 {
    right: -231px;
    top: 187px;
    width: 100%;
    z-index: 99; }
  li:hover .ani-card3 {
    right: -101px;
    bottom: -71px;
    width: 100%;
    z-index: 9; }
  li:hover .ani-card4 {
    left: -29px;
    bottom: -109px;
    width: 100%; }
  li:hover .ani-card5 {
    left: -167px;
    bottom: 37px;
    width: 100%;
    z-index: 99; }
  li:hover .ani-card6 {
    left: -176px;
    top: 42px;
    width: 100%; }
  li:hover .ani-card7 {
    left: -249px;
    top: -42px;
    width: 100%; } }
#canvas {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1; }

/*# sourceMappingURL=main.css.map */