@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&display=swap");
html {
  font-size: 16px; }
  @media all and (max-width: 768px) {
    html {
      font-size: 10px; } }

body {
  font-family: 'Inter', sans-serif; }

::selection {
  background-color: #210e6b;
  color: #ffffff; }

ul {
  list-style: none;
  margin: 0px;
  padding: 0px; }

a,
a:hover,
a:focus,
a:link,
a:visited {
  text-decoration: none;
  display: inline-block; }

h4 {
  margin: 0; }

.pri-heading {
  font-size: 2.5rem;
  color: #210e6b;
  font-weight: bold;
  margin-bottom: 1.875rem; }

.para {
  font-size: 1.125rem;
  color: #918ca4;
  font-weight: normal;
  margin-bottom: 2.5rem; }

.mb-entry-card {
  margin-bottom: 3.188rem; }

.mb-host-row {
  margin-bottom: 9.375rem; }

.get-started-btn {
  padding: 1.438rem 2.3rem;
  background-color: #ff3400;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 0.938rem;
  font-weight: bold;
  border: 2px solid #ff3400;
  border-radius: 2.4rem;
  transition: all .3s ease-in-out; }
  .get-started-btn:hover, .get-started-btn:focus {
    background-color: #ffffff;
    color: #ff3400;
    border: 2px solid #ffffff; }
  .get-started-btn:active {
    transform: scale(0.9); }

.cloud-card {
  box-shadow: 2px 2px 0.938rem 1px rgba(0, 0, 0, 0.2);
  border-radius: 0.75rem;
  transition: all .3s ease-in-out;
  cursor: pointer;
  height: 100%;
  position: relative; }
  .cloud-card-sub {
    padding: 2rem 2.813rem 1.813rem 2.313rem;
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem; }
    .cloud-card-sub-1, .cloud-card-sub-3 {
      background-color: #00d9ff;
      color: #ffffff; }
    .cloud-card-sub h4 {
      font-size: 0.875rem;
      font-weight: bold;
      margin-bottom: 0.813rem;
      padding-left: 5px; }
    .cloud-card-sub ul {
      margin-bottom: 0.813rem; }
      .cloud-card-sub ul li {
        display: inline-block; }
        .cloud-card-sub ul li:first-child {
          font-size: 3.125rem; }
        .cloud-card-sub ul li:nth-child(2), .cloud-card-sub ul li:nth-child(3) {
          position: relative;
          bottom: 7px; }
        .cloud-card-sub ul li:nth-child(2) {
          margin-right: 1.125rem; }
        .cloud-card-sub ul li:last-child {
          font-size: 12px;
          font-weight: bold;
          padding: 11px;
          border-radius: 20px;
          background-color: #01cdf1; }
    .cloud-card-sub-2 {
      background-color: #2583ff;
      color: #ffffff; }
      .cloud-card-sub-2 ul li:last-child {
        background-color: #126de4; }
    .cloud-card-sub p {
      font-size: 1.063rem;
      margin: 0; }
  .cloud-card-list {
    padding: 1.688rem 2.75rem 2.188rem 2.688rem;
    color: #210e6b; }
    .cloud-card-list-details li {
      margin-bottom: 1.688rem;
      font-size: 1.125rem;
      font-weight: 600; }
    .cloud-card-list-details-1 {
      padding-right: 7px;
      width: 10%;
      text-align: right; }
      .cloud-card-list-details-1 li {
        color: #2fd5a8; }
    .cloud-card-list-details-2 {
      width: 90%; }
      .cloud-card-list-details-2 li {
        text-transform: uppercase; }
    .cloud-card-list button.buy-now.get-started-btn {
      position: static;
      padding: 1.25rem 5.75rem;
      background-color: #ffffff;
      color: #210e6b;
      border: 2px solid #210e6b;
      width: 100%;
      text-align: center; }
      .cloud-card-list button.buy-now.get-started-btn:hover, .cloud-card-list button.buy-now.get-started-btn:focus, .cloud-card-list button.buy-now.get-started-btn:active {
        background-color: #210e6b;
        color: #ffffff; }
  @media all and (min-width: 1200px) {
    .cloud-card:hover {
      transform: scale(1.1, 1.2);
      box-shadow: 0px 0.938rem 1.5rem 0px rgba(0, 0, 0, 0.4); } }
  .cloud-card span {
    position: absolute;
    background-color: #210e6b; }
    .cloud-card span:nth-child(1) {
      top: -10px;
      right: 57px;
      height: 15px;
      width: 15px;
      transform: rotate(32deg);
      z-index: -1; }
    .cloud-card span:nth-child(2) {
      top: -10px;
      right: 28px;
      height: 15px;
      width: 15px;
      transform: rotate(61deg);
      z-index: -1; }
    .cloud-card span:nth-child(3) {
      top: -6px;
      right: 6px;
      transform: rotate(90deg) translateX(20px);
      color: #ffffff;
      font-weight: bold;
      padding: 6px 15px;
      font-size: 15px;
      text-transform: capitalize; }
    .cloud-card span:nth-child(4) {
      height: 25px;
      width: 50px;
      top: 67px;
      right: 32px;
      clip-path: polygon(100% 0, 100% 100%, 50% 0); }
    .cloud-card span:nth-child(5) {
      height: 25px;
      width: 50px;
      top: 67px;
      right: 18px;
      clip-path: polygon(0 1%, 0% 100%, 50% 0); }

.learn-more, .learn-more-link, .learn-more-visited {
  text-transform: uppercase;
  color: #ff3400;
  font-size: 0.938rem;
  font-weight: bold;
  border-bottom: 2px solid transparent; }
  .learn-more:hover, .learn-more:focus, .learn-more:active, .learn-more-link:hover, .learn-more-link:focus, .learn-more-link:active, .learn-more-visited:hover, .learn-more-visited:focus, .learn-more-visited:active {
    color: #ff3400;
    border-bottom: 2px solid #ff3400; }
    .learn-more:hover i, .learn-more:focus i, .learn-more:active i, .learn-more-link:hover i, .learn-more-link:focus i, .learn-more-link:active i, .learn-more-visited:hover i, .learn-more-visited:focus i, .learn-more-visited:active i {
      transform: translateX(2px); }

.feedback-card {
  padding: 2.125rem;
  border-radius: 12px;
  box-shadow: 0px 1px 1.5rem 1rem rgba(0, 0, 0, 0.2);
  position: relative; }
  .feedback-card img {
    height: 29.313rem;
    width: 100%; }
  .feedback-card-detail {
    color: #5c5577;
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 3.875rem;
    display: inline-block; }
  .feedback-card-info {
    margin-left: 3.938rem; }
    .feedback-card-info h4 {
      margin-bottom: 1.125rem;
      color: #210e6b;
      font-size: 1.5rem;
      font-weight: 600; }
    .feedback-card-info p {
      font-size: 1rem; }
  .feedback-card-tag {
    position: absolute;
    border-radius: 50%;
    background-color: #ff3400; }
    @media all and (max-width: 576px) {
      .feedback-card-tag {
        top: 25px;
        right: -10px; } }
    @media all and (min-width: 576px) {
      .feedback-card-tag {
        top: 25px;
        right: -6px; } }
    @media all and (min-width: 576px) {
      .feedback-card-tag {
        top: 25px;
        right: -19px; } }
    .feedback-card-tag i {
      font-size: 3.438rem;
      color: #ffffff;
      height: 100%;
      width: 100%;
      padding: 1.125rem 1.375rem; }

.getstartCard {
  padding: 4.25rem 2.375rem 2.75rem 3.75rem;
  background-color: #126de4;
  border-radius: 15px;
  transform: translateY(-12rem); }
  .getstartCard-info {
    margin-bottom: 2rem; }
    @media all and (min-width: 992px) {
      .getstartCard-info {
        width: 70%; } }
    .getstartCard-info h2 {
      color: #ffffff; }
    .getstartCard-info p {
      font-size: 1.25rem;
      font-weight: 400;
      color: #ffffff;
      margin: 0; }
  @media all and (min-width: 992px) {
    .getstartCard .get-started {
      width: 30%;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-left: 3.75rem; } }
  .getstartCard .get-started-btn {
    color: #ffffff;
    background-color: #00d9ff;
    border: 2px solid #00d9ff; }
    @media all and (min-width: 992px) {
      .getstartCard .get-started-btn {
        width: 100%; } }

.header {
  padding: 2.5rem 0 8.75rem;
  background-color: #000000;
  clip-path: polygon(0 0, 100% 0, 100% 75%, 0 100%); }
  .header .header-info {
    margin: 13.125rem 0px 10.313rem; }
    @media all and (max-width: 768px) {
      .header .header-info {
        margin: 13.125rem 0px 0px; } }
    .header .header-info h2 {
      color: #ffffff;
      font-size: 5rem;
      text-transform: capitalize;
      font-weight: 600;
      margin-bottom: 1.688rem; }
    .header .header-info p {
      color: #b9c3cf;
      font-size: 1.25rem;
      margin-bottom: 2.563rem; }

.hosting {
  padding: 2.563rem 0px 7.313rem; }
  .hosting .form-control {
    padding: 1.688rem 2.625rem;
    font-size: 0.938rem;
    color: #210e6b;
    border: 1px solid #ffffff;
    box-shadow: 2px 2px 0.938rem 1px rgba(0, 0, 0, 0.2);
    border-radius: 2.25rem;
    margin-bottom: 1rem;
    position: relative; }
    @media all and (min-width: 992px) {
      .hosting .form-control {
        margin-bottom: 2.188rem; } }
    .hosting .form-control::placeholder {
      color: #210e6b; }
    .hosting .form-control:focus {
      border-color: #210e6b;
      outline: 0;
      box-shadow: 2px 2px 0.938rem 1px rgba(33, 14, 107, 0.2); }
  .hosting .web-hosting .get-started-btn {
    padding: 12px 40px 13px 14px;
    border: 1px solid #ffffff; }
    @media all and (max-width: 576px) {
      .hosting .web-hosting .get-started-btn {
        margin-bottom: 2.188rem; } }
    @media all and (min-width: 576px) {
      .hosting .web-hosting .get-started-btn {
        margin-bottom: 2.188rem; } }
    @media all and (min-width: 992px) {
      .hosting .web-hosting .get-started-btn {
        margin-bottom: 0px;
        position: absolute;
        bottom: 3px;
        right: 19px; } }
    .hosting .web-hosting .get-started-btn:hover, .hosting .web-hosting .get-started-btn:focus {
      background-color: #ff3400;
      color: #ffffff; }
    .hosting .web-hosting .get-started-btn span {
      margin-left: 0.813rem; }
  .hosting .web-hosting-info ul {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 7.813rem; }
    .hosting .web-hosting-info ul li {
      margin: 0px 1.2rem 1rem 0px; }
      @media all and (min-width: 992px) {
        .hosting .web-hosting-info ul li {
          margin: 0px 0px 1rem 1.2rem; } }
      .hosting .web-hosting-info ul li a {
        color: #210e6b;
        font-size: 0.938rem;
        font-weight: bold;
        padding: 0.625rem 0.938rem;
        transition: all .3s ease-in-out; }
        .hosting .web-hosting-info ul li a:hover, .hosting .web-hosting-info ul li a:focus {
          background-color: #00d9ff;
          color: #ffffff;
          border-radius: 3.125rem;
          transform: scale(1.15);
          box-shadow: 2px 2px 0.938rem 1px #00d9ff; }
        .hosting .web-hosting-info ul li a:active {
          transform: translateY(1px); }

.mainnavbar {
  padding: 0px; }
  .mainnavbar [class^="logo"] {
    position: relative; }
  .mainnavbar .logo1 {
    z-index: 1;
    opacity: 0.8; }
  .mainnavbar .logo2 {
    left: -25px; }
  .mainnavbar .logo3 {
    left: -20px;
    top: 2px; }
  .mainnavbar .navbar-nav .nav-link,
  .mainnavbar .navbar-nav .active > .nav-link {
    text-transform: capitalize;
    color: #d2d0db; }
    @media all and (max-width: 768px) {
      .mainnavbar .navbar-nav .nav-link,
      .mainnavbar .navbar-nav .active > .nav-link {
        font-size: 1.4rem; } }
  .mainnavbar .navbar-nav .nav-link:focus,
  .mainnavbar .navbar-nav .nav-link:active,
  .mainnavbar .navbar-nav .nav-link:hover,
  .mainnavbar .navbar-nav .active > .nav-link {
    color: #ffffff;
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff, 0 0 50px #fff, 0 0 60px #fff; }
  @media all and (max-width: 576px) {
    .mainnavbar .navbar-nav {
      margin-top: 1rem;
      padding-left: 1rem; } }
  @media all and (min-width: 576px) {
    .mainnavbar .navbar-nav {
      margin-top: 1rem;
      padding-left: 1rem; } }
  @media all and (min-width: 992px) {
    .mainnavbar .navbar-nav {
      margin: 0px; }
      .mainnavbar .navbar-nav .nav-item {
        margin-left: 2.625rem; } }
  .mainnavbar .navbar-toggler {
    color: #2583ff;
    border-color: inherit;
    padding: 0px 0.375rem; }
  @media all and (max-width: 576px) {
    .mainnavbar .navbar-toggler-icon {
      padding: 0.45rem 0.313rem;
      font-size: 2rem; } }
  @media all and (min-width: 576px) {
    .mainnavbar .navbar-toggler-icon {
      padding: 0.4rem 0.313rem;
      font-size: 1.5rem; } }

.footer ul {
  margin-bottom: 3rem; }
  .footer ul li {
    margin-bottom: 1.5rem;
    text-transform: capitalize; }
    .footer ul li:last-child {
      margin-bottom: 0px; }
    .footer ul li h4 {
      font-weight: bold;
      text-transform: uppercase;
      font-size: 1rem;
      color: #ffffff;
      letter-spacing: 2px; }
    .footer ul li a, .footer ul li a:link, .footer ul li a:visited {
      color: #656565;
      font-size: 15px; }
      .footer ul li a:hover, .footer ul li a:link:hover, .footer ul li a:visited:hover {
        text-decoration: underline; }

.footer .copyright .logo1 {
  position: relative;
  z-index: 1;
  opacity: 0.8; }

.footer .copyright .logo2 {
  transform: translateX(-23px); }

.footer .copyright .logo3 {
  transform: translateX(-20px); }

.cloud-host .web-hosting-info {
  margin-bottom: 3.125rem; }

@media all and (max-width: 576px) {
  .cloud-host-content {
    margin-bottom: 4rem; } }

@media all and (min-width: 576px) {
  .cloud-host-content {
    margin-bottom: 4rem; } }

@media all and (min-width: 768px) {
  .cloud-host-content {
    margin-bottom: 0px; } }

.cloud-host-content-img {
  height: 3.938rem;
  width: 3.938rem;
  padding: 0.938rem;
  border-radius: 50%;
  background-color: #f3f9fa;
  margin-bottom: 1.063rem; }
  .cloud-host-content-img img {
    height: 100%;
    width: 100%; }

.cloud-host-content .pri-heading {
  font-size: 1.5rem;
  margin-bottom: 1.125rem; }

.cloud-host .standard-img img {
  height: 100%;
  width: 100%; }

.control-panel .pri-heading {
  margin-bottom: 5rem;
  color: #ffffff; }

.control-panel-info-img {
  height: 2.625rem;
  width: 2.625rem;
  margin: 0 auto; }

.control-panel-info-content h4 {
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 1.313rem;
  text-transform: capitalize; }

.control-panel-info-content .para {
  color: #7b858b;
  margin-bottom: 3rem; }

.control-panel img {
  height: 100%;
  width: 100%; }

.feedback .pri-heading {
  margin-bottom: 1.438rem; }

.cloud-host {
  padding-top: 11.25rem; }

.control-panel {
  padding: 6.75rem 0px 15.625rem;
  background-color: #000000;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 82%); }

.feedback {
  padding: 3.125rem 0px 13.063rem; }

.footer {
  padding: 5rem 0px;
  background-color: #232323; }
