/*!
 * font families
 */

@font-face {
    font-family: 'Programme';
    src: url(../fonts/programme/programme-normal.woff2) format('woff2'),
         url(../fonts/programme/programme-normal.woff) format('woff');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'Programme Light';
    src: url(../fonts/programme/programme-light.woff2) format('woff2'),
         url(../fonts/programme/programme-light.woff) format('woff');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'Antenna';
    src: url(../fonts/antenna/69e03e4b-d31e-4a31-b803-d31679c0e921-3.woff) format('woff');
    font-style: normal;
    font-weight: normal
}

.is-family-programme-light {
    font-family: 'Programme Light' !important;
    font-size: 1.10rem !important;
    font-style: normal;
}

.is-family-programme {
    font-family: 'Programme' !important;
    font-size: 1.05rem !important;
    font-style: normal;
}

.is-family-antenna {
    font-family: 'Antenna' !important;
    font-size: 1.10rem !important;
    font-style: normal;
}

/*!
 * button
 */

.cloudomators-button {
    background-color: #ffffff;
    border-color: #007eff;
    color: #007eff;
}

.cloudomators-button:hover, .cloudomators-button.is-hovered, .cloudomators-button:focus, .cloudomators-button.is-focused {
    background-color: #007eff;
    border-color: #ffffff;
    color: #ffffff;
}

/*!
 * toast stuff
 */
.toast {
    height: 26px;
    margin-right: 10px;
}

/*!
 * new project
 */

body {
    background-color: #007eff;
    color: #ffffff;
    margin:0
}

.cloudomators-is-bg-blue {
    background-color: #007eff !important;
}

.cloudomators-is-text-white {
    color: #ffffff !important;
}

.cloudomators-found-us {
    border-left: 0.5px solid;
    border-color: #ffffff;
    position: relative;
}

.cloudomators-main-info {
    border-left: 0.5px solid;
    border-color: #ffffff;
    position: relative;
}

.cloudomators-is-link {
    color: #ffffff !important;
    background-color: #007eff !important;
}

.cloudomators-is-link-story {
    color: #007eff !important;
    background-color: #ffffff !important;
}

.cloudomators-is-link-story:hover {
    color: #ffffff !important;
    background-color: #007eff !important;
}

.cloudomators-scrollable {
    overflow-x : hidden;
    overflow-y : auto;
    max-height: 190px;
    overflow: overlay;
}

/*!
 * cloudomators-typewriter
 */

 .cloudomators-typewriter-container{
    height: 100%;
    display: flex;
    justify-content: left;
    align-items: left;
  }

.cloudomators-typewriter h2 {
    overflow: hidden; /* Ensures the content is not revealed until the animation */
    border-right: .15em solid #ffffff; /* The typwriter cursor */
    white-space: nowrap; /* Keeps the content on a single line */
    margin: 0 auto; /* Gives that scrolling effect as the typing happens */
    letter-spacing: .15em; /* Adjust as needed */
    animation:
      typing 3.5s steps(40, end),
      blink-caret 2s step-end infinite;
  }

  /* The typing effect */
  @keyframes typing {
    from { width: 0 }
    to { width: 100% }
  }

  /* The cloudomators-typewriter cursor effect */
  @keyframes blink-caret {
    from, to { border-color: transparent }
    50% { border-color: #ffffff; }
  }

.cloudomators-input {
    background-color: #ebe5e5;
    border-color: #ffffff;
    color: #007eff !important;
}