/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
html, button, input, select, textarea { color: #222; }
/*html { font-size: 1em; line-height: 1.4; }*/
::-moz-selection {
 background: #b3d4fc;
 text-shadow: none;
}
::selection { background: #b3d4fc; text-shadow: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
audio, canvas, img, video { vertical-align: middle; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
a:focus{outline:none;} 
a{outline: 0 !important; color:#000000;}

/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */

@media print {
 * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; }
 a,  a:visited { text-decoration: none; }
 a[href]:after { content: " (" attr(href) ")"; }
 abbr[title]:after { content: " (" attr(title) ")"; }
 .ir a:after,  a[href^="javascript:"]:after,  a[href^="#"]:after { content: ""; }
 pre,  blockquote { border: 1px solid #999; page-break-inside: avoid; }
 thead { display: table-header-group; /* h5bp.com/t */ }
 tr,  img { page-break-inside: avoid; }
 img { max-width: 100% !important; }
 @page {
  margin: 0.5cm;
 }
 p,  h2,  h3 { orphans: 3; widows: 3; }
 h2,  h3 { page-break-after: avoid; }
}


/*! normalize.css v1.1.3 | MIT License | git.io/normalize */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block;  zoom: 1;
}
audio:not([controls]) { display: none; height: 0; }
[hidden] { display: none;}
html { font-size: 100%; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }
html, button, input, select, textarea { font-family: sans-serif; }
a:focus { outline: thin dotted; }
a:active, a:hover { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }
mark { background: #ff0; color: #000; }
code, kbd, pre, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ''; content: none; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
dl, menu, ol, ul { margin: 1em 0; }
dd { margin: 0 0 0 40px; }
menu, ol, ul { padding: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; }
img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */  }
button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */  
}
button, input { line-height: normal; }
button, select { text-transform: none; }
button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */  
}
button[disabled], html input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ 
}
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
 -webkit-appearance: none;
}
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}
textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ }
table { border-collapse: collapse; border-spacing: 0; }

*{padding:0; margin:0; outline:0;}
a img{border:none}a{text-decoration:none}a:hover{text-decoration:none}
ul, li{padding:0; margin:0; list-style:none}
.FL{float:left}.FR{float:right}.CL{clear:both; font-size:0; line-height:0; height:0}.CL1{clear:both}
.CTR{text-align:center}.TAR{text-align:right}.uline{text-decoration:underline}.UC{text-transform:uppercase}
.FL{float:left;}.FR{float:right;}.FN{float:none;}.CL{clear:both; font-size:0; line-height:0; height:0;}.CL1{clear:both}
:focus{outline:0}.PR{position:relative}
.checkBox{height:13px; width:13px; vertical-align:middle}
.no_brd{border:0 !important}.dsno{ display:none}
img{width: 100%; height: 100%; object-fit: cover;}
.clearfix:before,.clearfix:after{content:" "; display:table;}
.clearfix:after{clear:both}

body {
  margin: 0;
  background-color: #202020;
  overflow-x: hidden;
  position: relative;
}
.tit_top_T{
  width: 775px;
  height: 835px;
  background: url(../images/tit_T.png) no-repeat;
  background-size: cover;
  top: -80px;
  left: -115px;
  position: absolute;
  z-index: -1;
}
.section {
  padding: 30px 55px;
  animation: fadeIn 2s ease-out;
  position: relative;
}
.logo{
  width: 215px;
  height: 45px;
  background: url(../images/logo.png) no-repeat;
  background-size: cover;
}
.headertit{
  font-family: "Arimo", sans-serif;
  font-size: 68px;
  font-weight: 800;
  margin-top: 58px;
  line-height: 0.8;
  color: #fff;
  text-transform: uppercase;
}

.coconut-img {
  width: 720px;
  height: 606px;
  margin: 10px auto;
  padding-right: 100px;
  display: block;
  animation: float 3s infinite ease-in-out;
  position: relative;
}
.coconut-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.digref{
  position: absolute;
  right: -30px;
  bottom: 180px;
  font-family: "Arimo", sans-serif;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  text-transform: uppercase;
}
.text-block {
  max-width: 600px;
  margin: 20px auto;
  font-size: 1rem;
  line-height: 1.5;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUp {
  from { transform: translateY(50px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-50px); }
}

.abtsec{
  margin: 20px 0px 80px 340px;
  color: #fff;
  line-height: 1.2;
  font-family: "Arimo", sans-serif;
  font-size: 23px;
}
.beyondsec{
  position: relative;
  padding: 68px 0px 125px 140px;
  height: 207px;
}
.tit_www{
  width: 100%;
  height: 400px;
  background: url(../images/tit_www.png) no-repeat;
  background-size: cover;
  background-position: center;
  top: 0px;
  left: 0px;
  position: absolute;
  z-index: -1;
}
.arwbe{
  width: 96px;
  height: 80px;
  display: block;
}
.arwbe img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.aewtxt{
  color: #fff;
  font-size: 120px;
  display: ruby-text;
  font-weight: 700;
  margin-top: 10px;
}
.services{
  background: #000;
  width: 1170px;
  margin: 20px auto;
}
.servpadd{
  padding: 60px 50px 45px 50px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 60px;
}
.servicesmob{
  display: none;
}
.titserv{
  color: #fff;
  line-height: 1.2;
  font-family: "Arimo", sans-serif;
  font-size: 70px;
  font-weight: bolder;
  letter-spacing: 3px;
}
.omob{display: none;}
.serdesc p{
  color: #fff;
  line-height: 1.5;
  font-family: "Arimo", sans-serif;
  font-size: 18px;
  padding: 0px;
  margin-bottom: 20px;
}

.secmindset{
  margin: 125px 0px;
  position: relative;
}
.digmind{
  font-size: 80px;
  color: #fff;
  font-family: "Arimo", sans-serif;
  font-weight: 900;
  width: 1170px;
  margin: 0px auto;
  line-height: 1;
  text-transform: uppercase;
}
.digmind a{color: #fff;}

.tit_s{
  width: 649px;
  height: 717px;
  background: url(../images/tit_S.png) no-repeat;
  background-size: cover;
  background-position: center;
  top: -190px;
  left: -100px;
  position: absolute;
  z-index: -1;
}
.tit_i{
  width: 547px;
  height: 547px;
  background: url(../images/tit_I.png) no-repeat;
  background-size: cover;
  background-position: center;
  top: -300px;
  right: -130px;
  position: absolute;
  z-index: -1;
}
.clientsec{
  background: #fff; 
  padding-top: 55px;
}
.clientscwrap{
  width: 1170px;
  margin: 0px auto;
}
.tit_client{
  color: #000;
  font-size: 70px;
  font-family: "Arimo", sans-serif;
  font-weight: bolder;
}
.clentsliderwrap{
  padding: 70px 0px;
}
.img-ticker {
  display: flex;  
  margin-left: -17px;
}

.tickerlogo {
  width: 135px;
  flex: none;
  margin: 0 1rem 0 1rem;
  align-self: flex-start;
  max-width: 100%;
  height: 75px;
}
.footer{
  position: relative;
  padding: 52px 0px 300px 0px;
  width: 1170px;
  margin: 0px auto;
}
.footer a{
  margin-right: 50px;
  color: #fff;
  font-size: 70px;
  font-family: "Arimo", sans-serif;
  font-weight: bolder;
}
.footer a span{
  width: 48px;
  height: 49px;
  background: url(../images/socarw.png) no-repeat;
  background-size: cover;
  display: inline-block;
  margin-left: 20px;
}
.titbtm_t{
  width: 567px;
  height: 520px;
  background: url(../images/tit_T2.png) no-repeat;
  background-size: cover;
  background-position: center;
  top: -60px;
  right: -170px;
  position: absolute;
  z-index: -1;
}
.nextspon{margin-top: 50px;}
.shomob{display: none;}

@media screen and (max-width: 1400px) {
  .aewtxt {
    font-size: 90px;
  }
}

@media screen and (max-width: 1300px) {
  .headertit {
    font-size: 60px;
    line-height: 1;
  }
  .beyondsec {
    padding: 68px 0px 125px 85px; width: 100%;
  }
}

@media screen and (max-width: 1050px) {
  .headertit {font-size: 48px;}
  .section {width: 100%;}
  .tit_www {background-size: 110%;}
  .services{width: 90%;}
  .digmind {font-size: 90px; width: 90%;}
  .clientscwrap {width: 90%;}
  .img-ticker{display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px;}
  .footer {width: 90%;}
}
@media screen and (max-width: 580px) {
  .tit_top_T {width: 522px; height: 565px;top: -50px;}
  .section {width: 100%; margin: 0 auto; padding: 0px;}
  .logo {width: 115px; height: 24px; margin-top: 24px; margin-left: 20px;}
  .headertit {font-size: 35px; margin-left: 20px;}
  .coconut-img {width: 330px; height: 290px; margin: 80px auto 50px auto; padding-right: 0px;}
  .digref {right: 50%;transform: translate(60%, 0px); bottom: -20px; font-size: 13px;}
  .abtsec {margin: 0px auto 30px auto; font-size: 20px; width: 90%;}
  .beyondsec {padding: 0px 0px 0px;width: 100%; height: 140px;}
  .arwbe {width: 38px; height: 30px; padding-left: 19px; padding-top: 36px;}
  .aewtxt {font-size: 20px;}
  .tit_www {background-size: 130%; background-position: center; height: 140px;}
  .services {width: 100%; display: none;}
  .servicesmob{display: block; background: #000;}
  .sermob{padding: 20px 0px 50px 20px;}
  .titserv {font-size: 22px; letter-spacing: 0px;}
  .sermob .serdescmain{display: flex; overflow-x: auto; margin-top: 20px;}
  .sermob .serdescmain .serdesc{width: 280px; margin-right: 50px; flex: 0 0 auto !important;}
  .digmind {font-size: 27px; width: 100%;}
  .tit_s {width: 230px;height: 254px; top: 15px; left: -50px; z-index: 0;}
  .tit_i {width: 205px; height: 205px; top: 0px; right: -80px; z-index: 0;}
  .clientsec {padding-top: 25px;}
  .tit_client {font-size: 30px; margin-left: 15px;}
  .clentsliderwrap {padding: 40px 0px;}
  .img-ticker {display: grid; grid-template-columns: repeat(2, 1fr); margin: 0px;}
  .tickerlogo { margin: 0px;}
  .footer {padding: 95px 0px 0px 0px; margin: 0px auto; width: 100%;}
  .titbtm_t {width: 155px; height: 170px; top: -40px; right: -40px;}
  .footer a {margin-right: 20px; font-size: 20px;}
  .footer a span {width: 16px; height: 16px; margin-left: 5px;}
  .secmindset, .beyondsec, .section, .footer{overflow-x: hidden;}
  .secmindset {padding: 125px 15px; margin: 0px;}
  .fotepadd{padding: 0px 20px 15px;}
  .aewtxt{width: 100%;}
  .omob{display: block;}
  .shomob{display: block;}
  .hidemob{display: none;}
}