@import url(//fonts.googleapis.com/css?family=Lato:300:400);
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900");
@import url("https://fonts.googleapis.com/css2?family=Concert+One:wght@400");
html { width: 100%; height: 100%; padding: 0; margin: 0; background-color: #ffffff; color: #343434; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth; }
body { width: 100%; height: 100%; padding: 0; margin: 0; background-color: #ffffff; color: #343434; -webkit-tap-highlight-color: transparent; }
a { text-decoration: none; outline: none; }
ul { list-style-type: square; }
#leaf { list-style: square outside url("../../site/image/leaf-icon.png"); }
li { margin-top: 7px; }
.master { width: 100%; max-width: 100%; height: auto; padding: 0; margin: 0; overflow-x: hidden; word-wrap: break-word; }
.top-fix { position: fixed; top:0; left:0; z-index:999; width: 100%; max-width: 100%; overflow: hidden; word-wrap: break-word; padding:0; margin:0; background: #070930; text-align: center; }
.top { position: relative; width: calc(100% - 44px); max-width: 1560px; overflow: hidden; word-wrap: break-word; padding:14px 24px 9px 20px; margin:0 auto; }
.top-left { width:175px; padding:0; margin:0; float:left; }
.top-right { width:auto; max-width:calc(100% - 175px); padding:0 0 0 35px; margin:auto 0; float:right; text-align:right; position: relative; }
.top-logo { width:175px; }
.top-link { font-family: 'Lexend', arial, sans-serif; font-size: 17px; font-weight: 500; color: #ffffff; text-decoration: none; letter-spacing: 1px; margin: 0 0 0 35px; }
.top-link:hover { color: #F7E3EC; text-decoration: underline; }
.top-link:visited { color: #ffffff; }
.top-link:active { color: #ffffff; }
.top-button-contact { display: inline-block; text-align: center; margin-left:27px; min-width:80px; width:auto; height:100%; overflow-y: hidden; padding:8px 24px 9px 24px; border-radius: 5px; border: 1px solid #B25279; background-color: #D34D75; font-family: 'Poppins', arial, sans-serif; font-size: 17px; font-weight: 300; color: #ffffff; text-decoration: none; letter-spacing: 1px; }
.top-button-contact:hover { border: 1px solid #D77CA1; cursor: pointer; transition: 0.4s; }
.top-button-log-in { display: inline-block; text-align: center; margin-left:24px; min-width:60px; width:auto; height:100%; overflow-y: hidden; padding:6px 21px 7px 21px; border-radius: 5px; background-color: #9b3566; font-family: 'Poppins', arial, sans-serif; font-size: 17px; font-weight: 300; color: #ffffff; text-decoration: none; letter-spacing: 1px; }
.top-button-log-in:hover { background-color: #ab4576; opacity:1; cursor: pointer; transition: 0.5s; }
.top-button-log-menu { display: none; text-align: center; margin-left:24px; min-width:25px; height:100%; overflow-y: hidden; padding:6px 6px 7px 7px; border-radius: 5px; border: 1px solid #B25279; background-color: #B25279; opacity:.8; font-family: 'Poppins', arial, sans-serif; font-size: 21px; font-weight: 300; color: #ffffff; text-decoration: none; }
.top-button-log-menu:hover { border: 1px solid #D77CA1; opacity:1; cursor: pointer; transition: 0.4s; }
.top-button-menu-option { display: inline-block; text-align: center; margin:0; min-width:35px; widith:auto; height:100%; overflow-y: hidden; padding:6px 11px 7px 11px; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 17px; font-weight: 300; color: #ffffff; text-decoration: none; letter-spacing: 1px; }
.top-button-menu-option:hover { border: 1px solid #9b3566; background-color: #9b3566; cursor: pointer; transition: 0.4s; }

.button-container { padding:0; margin:40px 0 65px 0; text-align: center; }
.footer-segment { padding:0; margin: 11px 0 0 0; }


#serv-2 { display: none; }
#serv-3 { display: none; }
#serv-1 { display: inline-block; }
.service-container { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 80px 0 100px 0; margin: 0; background-color: #070930; text-align: center; border-top: 10px solid #1B1C3B; }
.service-table { display: table; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: center; }
.service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 10px 25px 9px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 23px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #EE3264; letter-spacing: 1px; line-height:180%; word-spacing: 10px; cursor: default; }
.service-image { width: auto; max-width: 98%; outline: none; border: none; }
.service-table-cell-left { display: table-cell; min-width: calc(50% - 45px); width: calc(50% - 45px); max-width: calc(50% - 45px); min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 90px 0 0; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.service-text { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: left; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 400; color: #ffffff; text-decoration: none; }
.service-table-cell-right { display: table-cell; width: auto; max-width: auto; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: center; vertical-align: middle; }
.service-table-cell-right-2 { display: table-cell; min-width: 50%; width: 50%; max-width: 50%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 0 0 90px; margin: 0; text-align: left; vertical-align: middle; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.work-with-us { display: inline-block; padding: 90px 0 0 0; text-align: center; width: 100%; color: #ffffff; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 500; text-decoration: none; line-height:120%; }


.get-in-touch { display: inline-block; cursor: pointer; text-align: center; margin: 7px 0 0 0; min-width:200px; width:auto; height:52px; max-height: 52px; overflow-y: hidden; padding:13px 26px 12px 25px; border-radius: 5px; border: 1px solid #E52F61; background-color: #E52F61; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; letter-spacing: 1px; line-height:100%; transition: all 0.5s; }

.get-in-touch span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.get-in-touch span:after {
  content: '\027A4';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.get-in-touch:hover span {
  padding-right: 25px;
  opacity: 1;
  transition: 0.4s;
}

.get-in-touch:hover span:after {
  opacity: 1;
  right: 0;
  transition: 0.4s;
}

.get-in-touch:hover {
  padding-right: 25px;
  transition: 0.4s;
  background-color: #D8216A;
  border: 1px solid #D8216A;
}


[data-inviewport] { /* THIS DEMO ONLY */
  width:100%; height:100%; margin: 0; padding: 0; 
}

/* inViewport */

[data-inviewport="scale-in"] { 
  transition: 2s;
  transform: scale(0.1);
}
[data-inviewport="scale-in"].is-inViewport { 
  transform: scale(1);
}

[data-inviewport="fade-rotate"] { 
  transition: 2s;
  opacity: 0;
}
[data-inviewport="fade-rotate"].is-inViewport { 
  transform: rotate(180deg);
  opacity: 1;
}



h1 {
  font-family: 'Lato', sans-serif;
  font-weight:300;
  letter-spacing: 2px;
  font-size:48px;
}
h3 {
  font-family: 'Poppins', sans-serif;
  letter-spacing: 1px;
  font-size:22px;
  line-height: 170%;
  color: #ffffff;
  margin:0; padding:0;
  font-weight: 500;
  cursor: default;
}

.logo {
  width:50px;
  fill:#fff;
  padding-right:15px;
  display:inline-block;
  vertical-align: middle;
}

.inner-header {
  height:100%;
  width:100%;
  margin: 0;
  padding: 0;
}

.flex { /*Flexbox for containers*/
  display: flex;
  align-items: center;
  font-family: 'Lexend', arial, sans-serif; font-size: 27px; color: #000; text-decoration: none; letter-spacing: 1px;
}

.middle-container { width: 100%; max-width: 100%; height: calc(100% - 70px); max-height: calc(100% - 70px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:70px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
.middle-absolute { position: absolute; left:0; top:0; right:0; bottom:0; width:100%; height:100%; padding:0; margin:0; background: transparent; z-index: 997; }
.middle-inner-div { display: inline-block; width: calc(100% - 50px); max-width: 800px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
.middle-inner-div-text { margin:20px 0 0 0; transform: scale(0.94); animation: scale 3s forwards cubic-bezier(0.5, 1, 0.89, 1); }
@keyframes scale {
  100% {
    transform: scale(1);
  }
}



.content-container { width: 100%; margin: 0; padding: 110px 0; text-align: center; background-color: #F8F6F8; }
.content-main { width: calc(100% - 40px); max-width:1560px; margin: 0 auto; padding: 0 20px; background-color: transparent; text-align: center; }
.content-element-1 { width: 330px; max-width:330px; overflow-x: hidden; margin: 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-1 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; margin: 0; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-architecture.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-2 { width: 330px; max-width:330px; overflow-x: hidden; margin: 0 39px 0 74px; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-2 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-development.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-3 { width: 330px; max-width:330px; overflow-x: hidden; margin: 0 0 0 39px; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-3 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-consulting.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-4 { width: 330px; max-width:330px; overflow-x: hidden; margin: 90px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-4 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-agency.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-label { width: 100%; position: absolute; bottom: 15px; overflow: hidden; word-wrap: break-word; padding: 0; margin: 0; text-transform: uppercase; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #34021F; text-decoration: none; line-height:120%; letter-spacing: 1px; cursor: default; }
.content-element-container { width: calc(100% - 40px); height: 300px; position: relative; overflow: hidden; word-wrap: break-word; padding: 30px 20px 0 20px; margin: 0; text-align: left; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 300; color: #000000; text-decoration: none; line-height:150%; }
.content-element-5 { width: 738px; max-width:738px; height:422px; overflow-x: hidden; margin: 55px 0 0 74px; padding: 0; background-color: transparent; display: inline-block; text-align: left; background-image: url(../image/marketing-automation-cloud.png); background-repeat: no-repeat; background-position: 0 center; background-size: contain; }
#content-main-2 { display: none; }
#content-main-3 { display: none; }


h1 { padding:0; margin:0; line-height:100%;
  font-family: 'Baloo Chettan 2', arial, sans-serif; font-size: 7.8vh; font-weight: 600; color: #FCB5C8; text-decoration: none; line-height:120%;
  background-image: linear-gradient(-200deg, #FCB5C8 0%, #fea7d0 50%);
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  cursor: default; }

.animText {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
}

.animText:nth-child(1) {
  animation: fade-in 0.8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.animText:nth-child(2) {
  animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.animText:nth-child(3) {
  animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.animText:nth-child(4) {
  animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.animText2:nth-child(1) {
  padding:0; color: #B02869; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 7.7vh; animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

h2 {
  padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 7.7vh; cursor: default;
}

@keyframes fade-in {
  100% {
    opacity: 1;
    filter: blur(0);
  }
}



.animate-charcter
{
  background-image: linear-gradient(
    -200deg,
    #042C65 0%,
    #463F88 14%,
    #44107a 29%,
    #ff1361 67%,
    #fff800 100%
  );
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.middle-left { width: 60%; max-width: 1560px; overflow: hidden; word-wrap: break-word; padding:14px 24px 10px 20px; margin: auto; }

.content {
  position:relative;
  height:20vh;
  text-align:center;
  background-color: #fff;
}



.top-button-contact-mobi { display: none; }
.top-menu-mobi { display: none; position: fixed; z-index: 998; text-align: center; line-height:50px; background-color: #021E47; left: 0; top: 0; width: calc(100% - 40px); min-height:70px; height:auto; padding:77px 24px 27px 24px; font-family: 'Lexend', arial, sans-serif; font-size: 18px; font-weight: 300; color: #ffffff; letter-spacing: 1px; }
.top-menu-mobi-link { font-family: 'Poppins', arial, sans-serif; font-size: 19px; font-weight: 400; color: #FBFCFC !important; text-decoration: none; line-height:150%; cursor: pointer; }
.top-menu-mobi-link:link { font-family: 'Poppins', arial, sans-serif; font-size: 19px; font-weight: 400; color: #FBFCFC !important; text-decoration: none; line-height:150%; cursor: pointer; }
.top-menu-mobi-link:active { font-family: 'Poppins', arial, sans-serif; font-size: 19px; font-weight: 400; color: #FBFCFC !important; text-decoration: none; line-height:150%; cursor: pointer; }
.top-menu-mobi-link:visited { font-family: 'Poppins', arial, sans-serif; font-size: 19px; font-weight: 400; color: #FBFCFC !important; text-decoration: none; line-height:150%; cursor: pointer; }
.top-menu-mobi-link:hover { color: #F6C7E8; }

 
.footer { width: 100%; max-width: 100%; margin: 0; padding: 0 0 21px 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
.footer-container { display: block; min-width:150px; width: auto; min-height: 50px; height: auto; padding: 0 0 58px 0; margin: 0; text-align: center; position: relative; vertical-align: top; }
.footer-element-1 { display: inline-block; width:240px; max-width:240px; padding: 60px 45px 0 45px; margin: 0 auto; line-height: 180%; text-align: left; vertical-align: top; }
.footer-element-2 { display: inline-block; width:130px; max-width:130px; padding: 60px 45px 0 45px; margin: 0 auto; line-height: 180%; text-align: left; vertical-align: top; }
.footer-element-3 { display: inline-block; width:250px; max-width:250px; padding: 60px 45px 0 45px; margin: 0 auto; line-height: 180%; text-align: left; vertical-align: top; }
.footer-element-4 { display: inline-block; width:120px; max-width:120px; padding: 60px 45px 0 45px; margin: 0 auto; line-height: 180%; text-align: left; vertical-align: top; }
.footer-span { font-family: 'Poppins', arial, sans-serif; font-size: 15px; font-weight: 400; color: #eeeeee; text-decoration: none; line-height:150%; }
.footer-link-1 { font-family: 'Poppins', arial, sans-serif; font-size: 15px; font-weight: 400; color: #eeeeee; text-decoration: none; line-height:150%; outline: none; }
.footer-link-1:hover { color: #bcbcbc; text-decoration: underline; }
.footer-link-1-icon { font-family: 'Poppins', arial, sans-serif; font-size: 15px; font-weight: 400; color: #eeeeee; text-decoration: none; line-height:150%; outline: none; }
.footer-link-1-icon:hover { color: #cdcdcd; text-decoration: none; }
.footer-logo { width:120px; border: none; outline: none; -webkit-filter: grayscale(57%); filter: grayscale(57%); }
.footer-partner { width:124px; border: none; outline: none; }
.footer-flag { width:20px; height:11px; border: none; outline: none; }
.footer-bottom { min-width: 200px; width: auto; max-width: 983px; margin: 5px auto; padding: 14px 20px 5px 20px; font-family: 'Poppins', arial, sans-serif; font-size: 14px; font-weight: 400; color: #898989; text-decoration: none; line-height:150%; text-align: center; border-top: 1px solid #48403B; }
.footer-bottom-link { font-family: 'Poppins', Arial, sans-serif; font-size: 14px; font-weight: 400; color: #898989; text-decoration: none; }
.footer-bottom-link:hover { text-decoration: underline; }
#footer-split-2 { display: none; }
#footer-split-4 { display: none; }




@media (max-width: 1500px) {
#serv-1 { display: none; }
#serv-3 { display: none; }
#serv-2 { display: inline-block; }
.service-container { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 80px 0 100px 0; margin: 0; background-color: #070930; text-align: center; border-top: 10px solid #1B1C3B; }
.service-table { display: table; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: center; }
.service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 17px 25px 15px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #f25a5a; letter-spacing: 1px; line-height:100%; word-spacing: 10px; cursor: default; }
.service-image { width: auto; max-width: 100%; outline: none; border: none; }
.service-table-cell-left { display: table-cell; min-width: 50%; width: 50%; max-width: 50%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 90px 0 0; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.service-text { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: left; font-family: 'Poppins', arial, sans-serif; font-size: 19px; font-weight: 500; color: #ffffff; text-decoration: none; }
.service-table-cell-right { display: table-cell; width: auto; max-width: auto; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: right; vertical-align: top; }
.service-table-cell-right-2 { display: table-cell; min-width: 50%; width: 50%; max-width: 50%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 0 0 90px; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.work-with-us { display: inline-block; padding: 0; text-align: center; width: 100%; color: #ffffff; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 500; text-decoration: none; line-height:120%; }
}




@media (max-width: 1210px) {
    .content-container { width: 100%; margin: 0; padding: 110px 0; border-bottom: 3px solid #FFEDE7; text-align: center; background-color: #F8F6F8; }
.content-main { width: calc(100% - 40px); max-width:1210px; margin: 0 auto; padding: 0 20px; background-color: transparent; text-align: center; }
.content-element-1 { width: 330px; max-width:330px; overflow-x: hidden; margin: 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-1 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; margin: 0; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-architecture.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-2 { width: 330px; max-width:330px; overflow-x: hidden; margin: 0 0 0 74px; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-2 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-development.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-3 { width: 330px; max-width:330px; overflow-x: hidden; margin: 90px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-3 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-consulting.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-4 { width: 330px; max-width:330px; overflow-x: hidden; margin: 90px 0 0 74px; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-4 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-agency.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-label { width: 100%; position: absolute; bottom: 15px; overflow: hidden; word-wrap: break-word; padding: 0; margin: 0; text-transform: uppercase; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #34021F; text-decoration: none; line-height:120%; letter-spacing: 1px; cursor: default; }
.content-element-container { width: calc(100% - 40px); height: 300px; position: relative; overflow: hidden; word-wrap: break-word; padding: 30px 20px 0 20px; margin: 0; text-align: left; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 300; color: #000000; text-decoration: none; line-height:150%; }
.content-element-5 { display: none; }
#content-main-2 { display: block; }
#content-main-3 { display: none; }
#content-main-1 { display: none; }
}


@media (max-width: 1150px) {
    .footer-element-1 { display: inline-block; width:250px; max-width:250px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-2 { display: inline-block; width:130px; max-width:130px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-3 { display: inline-block; width:250px; max-width:250px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-4 { display: inline-block; width:130px; max-width:130px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .service-table-cell-left { display: table-cell; min-width: calc(50% - 35px); width: calc(50% - 35px); max-width: calc(50% - 35px); min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 70px 0 0; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
}

@media (max-width: 1050px) {
    .footer-element-1 { display: inline-block; width:230px; max-width:230px; padding: 60px 20px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-2 { display: inline-block; width:100px; max-width:100px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-3 { display: inline-block; width:230px; max-width:230px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-4 { display: inline-block; width:110px; max-width:110px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 10px 25px 9px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #f25a5a; letter-spacing: 1px; line-height:150%; word-spacing: 10px; cursor: default; }
    .service-table-cell-left { display: table-cell; min-width: calc(50% - 30px); width: calc(50% - 30px); max-width: calc(50% - 30px); min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 60px 0 0; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
}

@media (max-width: 950px) {
    #footer-full { display: none; }
    #footer-split-2 { display: block; }
    .footer-element-1 { display: inline-block; width:250px; max-width:250px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-2 { display: inline-block; width:130px; max-width:130px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-3 { display: inline-block; width:250px; max-width:250px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-4 { display: inline-block; width:130px; max-width:130px; padding: 60px 30px 0 30px; margin: 0 auto; line-height: 180%; text-align: left; }
    .service-table-cell-left { display: table-cell; min-width: calc(50% - 28px); width: calc(50% - 28px); max-width: calc(50% - 28px); min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0 55px 0 0; margin: 0; text-align: left; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
}


@media (max-width: 885px) {
#serv-1 { display: none; }
#serv-2 { display: none; }
#serv-3 { display: inline-block; }
.service-container { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 80px 0 100px 0; margin: 0; background-color: #070930; text-align: center; border-top: 10px solid #1B1C3B; }
.service-table { display: table; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: center; }
.service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 17px 25px 15px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 21px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #f25a5a; letter-spacing: 1px; line-height:100%; word-spacing: 10px; cursor: default; }
.service-image { width: auto; max-width: 100%; outline: none; border: none; margin-top: 30px; }
.service-table-cell-left { display: table-cell; min-width: 100%; width: 100%; max-width: 100%; min-height: 200px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: center; vertical-align: top; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.service-text { display: inline-block; width: 100%; max-width: 100%; min-height: 100px; height: auto; overflow-x: hidden; word-wrap: break-word; padding: 0; margin: 0; text-align: left; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; color: #ffffff; text-decoration: none; }
.work-with-us { display: inline-block; padding: 92px 0 0 0; text-align: center; width: 100%; color: #ffffff; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 500; text-decoration: none; line-height:120%; }
}


@media (max-width: 850px) {
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 800px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:100%; overflow: hidden; padding:0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 8px 0 0 10px; min-width: 20px; height:100%; overflow-y: hidden; padding: 0; opacity:1; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
}



@media (max-width: 799px) {
    .content-container { width: 100%; margin: 0; padding: 80px 0; border-bottom: 3px solid #FFEDE7; text-align: center; background-color: #F8F6F8; }
.content-main { width: calc(100% - 40px); max-width: 799px; margin: 0 auto; padding: 0 20px; background-color: transparent; text-align: center; }
.content-element-1 { width: 100%; max-width: 100%; overflow-x: hidden; margin: 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-1 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; margin: 0; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-architecture.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-2 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 70px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-2 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-development.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-3 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 70px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-3 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-consulting.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-element-4 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 70px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-4 { width: calc(100% - 130px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 130px; text-align: left; background-color: transparent; background-image: url(../image/cloud-agency.png); background-repeat: no-repeat; background-position: 20px top; border-bottom: 8px solid #8C2C80; }
.content-label { width: 100%; position: absolute; bottom: 15px; overflow: hidden; word-wrap: break-word; padding: 0; margin: 0; text-transform: uppercase; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #34021F; text-decoration: none; line-height:120%; letter-spacing: 1px; cursor: default; }
.content-element-container { width: calc(100% - 40px); min-height: 100px; height: auto; position: relative; overflow: hidden; word-wrap: break-word; padding: 30px 20px 10px 20px; margin: 0; text-align: left; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 300; color: #000000; text-decoration: none; line-height:150%; }
.content-element-5 { display: none; }
#content-main-3 { display: block; }
#content-main-2 { display: none; }
#content-main-1 { display: none; }
}



/*Shrinking for mobile*/
@media (max-width: 660px) {
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 70px); max-height: calc(100% - 70px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:70px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 620px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:100%; overflow: hidden; padding:0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 8px 0 0 10px; min-width: 20px; height:100%; overflow-y: hidden; padding: 0; opacity:1; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
    h1 { padding:0; margin:0; line-height:100%; font-family: 'Poppins', arial, sans-serif; font-size: 6.0vh; font-weight: 500; color: #042C65; text-decoration: none; line-height:120%; background-image: linear-gradient(-200deg, #FCB5C8 0%, #FE90AE 50%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; color: #fff; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    h2 { padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 5.9vh; }
}

@media (max-width: 560px) {
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 70px); max-height: calc(100% - 70px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:70px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 520px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 8px 0 0 10px; min-width: 20px; height:100%; overflow-y: hidden; padding: 0; opacity:1; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:100%; overflow: hidden; padding:0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    h1 { padding:0; margin:0; line-height:100%; font-family: 'Poppins', arial, sans-serif; font-size: 5.9vh; font-weight: 500; color: #042C65; text-decoration: none; line-height:120%; background-image: linear-gradient(-200deg, #FCB5C8 0%, #FE90AE 50%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; color: #fff; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    h2 { padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 5.8vh; }
    h3 { font-family: 'Poppins', sans-serif; letter-spacing: 1px; font-size: 18px; line-height: 150%; color: #ffffff; font-weight: 400; margin:0; padding:0; }
    #footer-full { display: none; }
    #footer-split-2 { display: block; }
    .footer-element-1 { display: inline-block; width:230px; max-width:230px; padding: 60px 10px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-2 { display: inline-block; width:120px; max-width:120px; padding: 60px 10px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-3 { display: inline-block; width:230px; max-width:230px; padding: 60px 10px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; }
    .footer-element-4 { display: inline-block; width:120px; max-width:120px; padding: 60px 10px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; }
}



@media (max-width: 520px) {
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 70px); max-height: calc(100% - 70px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:70px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 500px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 8px 0 0 10px; min-width: 20px; height:100%; overflow-y: hidden; padding: 0; opacity:1; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:100%; overflow: hidden; padding:0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    h1 { padding:0; margin:0; line-height:100%; font-family: 'Poppins', arial, sans-serif; font-size: 5.0vh; font-weight: 500; color: #042C65; text-decoration: none; line-height:120%; background-image: linear-gradient(-200deg, #FCB5C8 0%, #FE90AE 50%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; color: #fff; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    h2 { padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 4.9vh; }
    h3 { font-family: 'Poppins', sans-serif; letter-spacing: 1px; font-size: 18px; line-height: 150%; color: #ffffff; font-weight: 400; margin:0; padding:0; }
    .work-with-us { display: inline-block; padding: 90px 0 0 0; text-align: center; width: 100%; color: #ffffff; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 500; text-decoration: none; line-height:120%; }
}



@media (max-width: 450px) {
    .top { position: relative; width: calc(100% - 20px); max-width: 400px; overflow: hidden; word-wrap: break-word; padding:12px 5px 6px 10px; margin:0 auto; height:35px; max-height:35px; }
    .top-left { width:120px; padding:0; margin:0; float:left; }
    .top-right { width:auto; max-width:calc(100% - 120px); padding:0 0 0 5px; margin:auto 0; float:right; text-align:right; position: relative; }
    .top-logo { width:120px; }
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 34px); max-height: calc(100% - 34px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:34px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 500px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 0 9px 0 10px; min-width: 20px; height:100%; overflow-y: hidden; padding: 0; opacity:1; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:auto; overflow: hidden; padding:0 10px 0 0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    h1 { padding:0; margin:0; line-height:100%; font-family: 'Poppins', arial, sans-serif; font-size: 4.3vh; font-weight: 500; color: #ffffff; text-decoration: none; line-height:120%; }
    h2 { padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 4.2vh; }
    h3 { font-family: 'Poppins', sans-serif; letter-spacing: 1px; font-size: 18px; line-height: 150%; color: #ffffff; font-weight: 400; margin:0; padding:0; }
}

@media (max-width: 430px) {
    .footer { width: 100%; max-width: 100%; margin: 0; padding: 0 0 21px 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .footer-logo { width:120px; border: none; outline: none; }
    #footer-full { display: none; }
    #footer-split-2 { display: none; }
    #footer-split-4 { display: block; }
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 34px); max-height: calc(100% - 34px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:34px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 500px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .content-container { width: 100%; margin: 0; padding: 70px 0; border-bottom: 3px solid #FFEDE7; text-align: center; background-color: #F8F6F8; }
.content-main { width: calc(100% - 24px); max-width: 430px; margin: 0 auto; padding: 0 12px; background-color: transparent; text-align: center; }
.content-element-1 { width: 100%; max-width: 100%; overflow-x: hidden; margin: 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-1 { width: calc(100% - 100px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; margin: 0; padding: 0 0 22px 100px; text-align: left; background-color: transparent; background-image: url(../image/cloud-architecture.png); background-repeat: no-repeat; background-position: 0 top; border-bottom: 7px solid #8C2C80; }
.content-element-2 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 60px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-2 { width: calc(100% - 100px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 100px; text-align: left; background-color: transparent; background-image: url(../image/cloud-development.png); background-repeat: no-repeat; background-position: 0 top; border-bottom: 7px solid #8C2C80; }
.content-element-3 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 60px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-3 { width: calc(100% - 100px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 100px; text-align: left; background-color: transparent; background-image: url(../image/cloud-consulting.png); background-repeat: no-repeat; background-position: 0 top; border-bottom: 7px solid #8C2C80; }
.content-element-4 { width:  100%; max-width: 100%; overflow-x: hidden; margin: 60px 0 0 0; padding: 0; background-color: transparent; display: inline-block; text-align: left; }
.content-element-top-4 { width: calc(100% - 100px); height: 80px; position: relative; overflow: hidden; word-wrap: break-word; padding: 0 0 22px 100px; text-align: left; background-color: transparent; background-image: url(../image/cloud-agency.png); background-repeat: no-repeat; background-position: 0 top; border-bottom: 7px solid #8C2C80; }
.content-label { width: 100%; position: absolute; bottom: 15px; overflow: hidden; word-wrap: break-word; padding: 0; margin: 0; text-transform: uppercase; font-family: 'Poppins', arial, sans-serif; font-size: 20px; font-weight: 500; color: #34021F; text-decoration: none; line-height:120%; letter-spacing: 1px; cursor: default; }
.content-element-container { width: 100%; min-height: 100px; height: auto; position: relative; overflow: hidden; word-wrap: break-word; padding: 25px 0 10px 0; margin: 0; text-align: left; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 18px; font-weight: 300; color: #000000; text-decoration: none; line-height:150%; }
.content-element-5 { display: none; }
#content-main-3 { display: block; }
#content-main-2 { display: none; }
#content-main-1 { display: none; }
    .footer-container { display: inline; min-width:200px; width: 100%; min-height: 50px; height: auto; padding: 0 0 58px 0; margin: 0; text-align: center; }
    .footer-element-1 { display: inline-block; width: calc(100% - 30px); min-width:230px; padding: 50px 15px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; word-wrap: break-word; }
    .footer-element-2 { display: inline-block; width: calc(100% - 30px); min-width:230px; padding: 50px 15px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; word-wrap: break-word; }
    .footer-element-3 { display: inline-block; width: calc(100% - 30px); min-width:230px; padding: 50px 15px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; word-wrap: break-word; }
    .footer-element-4 { display: inline-block; width: calc(100% - 30px); min-width:230px; padding: 50px 15px 0 15px; margin: 0 auto; line-height: 180%; text-align: left; word-wrap: break-word; }
    .footer-bottom { min-width: 200px; width: 80%; max-width: 80%; margin: 55px auto 5px auto; padding: 10px 15px 5px 15px; font-family: 'Poppins', arial, sans-serif; font-size: 14px; font-weight: 400; color: #898989; text-decoration: none; line-height:150%; text-align: center; border-top: 1px solid #48403B; }
    .service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 10px 25px 9px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 22px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #f25a5a; letter-spacing: 1px; line-height:145%; word-spacing: 10px; cursor: default; }
}

@media (max-width: 399px) {
    .top { position: relative; width: calc(100% - 20px); max-width: 400px; overflow: hidden; word-wrap: break-word; padding: 8px 5px 6px 10px; margin:0 auto; height:35px; max-height:35px; }
    .top-left { width:120px; padding:0; margin:0; float:left; }
    .top-right { width:auto; max-width: 25px; height: 100%; margin:0; padding: 0; float: right; text-align: left; position: relative; }
    .top-logo { width:120px; }
    .middle-container { width: 100%; max-width: 100%; height: calc(100% - 34px); max-height: calc(100% - 34px); overflow-x: hidden; position: relative; word-wrap: break-word; padding:0; margin:34px 0 0 0; text-align: center; background: #021E47; background: linear-gradient(30deg, #0B0D3B 0%, #000320 100%), radial-gradient(100% 225% at 100% 0%, #FE7343 0%, #000000 100%), linear-gradient(225deg, #960D3D 0%, #000000 100%), linear-gradient(135deg, #CDFFEB 10%, #CDFFEB 35%, #009F9D 35%, #009F9D 60%, #07456F 60%, #07456F 67%, #0F0A3D 67%, #0F0A3C 100%); background-blend-mode: screen, overlay, hard-light, normal; }
    .middle-inner-div { display: inline-block; width: calc(100% - 40px); max-width: 500px; text-align: center; margin:0; position: relative; top: 50%; transform: translateY(-50%); }
    .top-button-menu-option { display: none; }
    .top-button-log-in { display: none; }
    .top-button-log-menu { display: inline-block; text-align: center; margin: 0; min-width: 20px; width: auto; height:100%; overflow-y: hidden; opacity:1; padding:0; border-radius: 5px; border: 1px solid transparent; background-color: transparent; font-family: 'Poppins', arial, sans-serif; font-size: 25px; font-weight: 500; color: #FEBCD1; text-decoration: none; line-height:100%; transform: rotate(90deg); }
    .top-button-log-menu:hover { border: 1px solid transparent; background-color: transparent; color: #F9DDF6; opacity:1; cursor: pointer; }
    .top-button-contact-mobi { display: inline-block; text-align: center; margin-left:27px; min-width:18px; width:auto; height:auto; overflow: hidden; padding: 0 10px 0 0; background-color: #021E47; font-family: 'Lexend', arial, sans-serif; font-size: 35px; font-weight: 300; color: #ffffff; text-decoration: none; outline: none; border: none; }
    .top-button-contact-mobi:hover, .top-button-contact-mobi:active, .top-button-contact-mobi:focus { cursor: pointer; text-decoration: none; outline: none; border: none; }
    h1 { padding:0; margin:0; line-height:100%; font-family: 'Poppins', arial, sans-serif; font-size: 3.9vh; font-weight: 500; color: #ffffff; text-decoration: none; line-height:120%; }
    h2 { padding:0; margin:0; color: #FEBDDC; font-family: 'Baloo Chettan 2', cursive; font-weight: 600; font-size: 3.8vh; }
    h3 { font-family: 'Poppins', sans-serif; letter-spacing: 1px; font-size: 17px; line-height: 150%; color: #ffffff; font-weight: 400; margin:0; padding:0; }
    .service-title { display: inline-block;  min-width: 100px; width: auto; height: auto; padding: 10px 25px 9px 24px; margin: 0 0 40px 0; font-family: 'Poppins', arial, sans-serif; font-size: 21px; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; background-color: #f25a5a; letter-spacing: 1px; line-height:145%; word-spacing: 10px; cursor: default; }
}