/*INITIALIZE*/
:root {
    --COLOR: #264293;
}
#cc_div .left{
    transform: none !important;
    -webkit-transform: none !important; 
}

/*Header nav*/

.logo {
	width: 150px;
}
    .menu ul{
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
.menu li{
  display: inline-block;
  margin: 0 15px;
}
.menu a{
  text-decoration: none;
  color: #fff;
  display: block;
  position: relative;
}

.menu a.nav-link{
    padding-bottom: 15px !important;
}

.menu a.nav-link::before{
  content: "";
  width: 100%;
  height: 4px;
  position: absolute;
  left: 0;
  bottom: 0;
  background: #fff;
  transition: 0.5s transform ease;
  transform: scale3d(0,1,1);
  transform-origin: 0 50%;
}
.menu a.nav-link:hover::before{
  transform: scale3d(1,1,1);
}
.menu-1 a.nav-link::before{
  background: #F8B049;
  transform-origin: 100% 50%;
}


.menu-1 a.nav-link:hover::before{
  transform-origin: 0 50%;
}

/*Header nav end*/

   .post-navigation {
    display: ńone;
   }

    .bg-blue{
        background-color: #264293;
    }

    .bg-light-blue{
        background-color: #B5DFF2;
    }

    .bg-light-lightblue{
        background: #E4F4FA;
    }


    .bg-white{
        background: #FFFFFF;
    }

    li {
        color: #264293;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
    }

    ul {
        color: #264293;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
    }


    ol {
        color: #264293;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
    }



    h5 {
        color: #264293;
    }

    h6 {
        color: #264293;
    }
    
    h1{
        font-style: normal;
        font-weight: 700;
        font-size: 90px;
        line-height: 1.4em;
        color: #264293;
        font-family: 'Spline Sans', sans-serif;
    }

    .headline-1{
        font-style: normal;
        font-weight: 700;
        font-size: 90px;
        line-height: 1.4em;
        color: white;
        font-family: 'Spline Sans', sans-serif;
    }


    h2{
        font-style: normal;
        font-weight: 700;
        font-size: 45px;
        line-height: 1.4em;
        color: #264293;
        font-family: 'Spline Sans', sans-serif;
    }


    .headline-2{
        font-style: normal;
        font-weight: 700;
        font-size: 45px;
        line-height: 1.4em;
        color: white;
        font-family: 'Spline Sans', sans-serif;
    }

    h3{
        font-style: normal;
        font-weight: 700;
        font-size: 24px;
        line-height: 1.4em;
        color: #264293;
        font-family: 'Spline Sans', sans-serif;
    }

    h4{
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 1.4em;
        color: #264293;
        font-family: 'Spline Sans', sans-serif;
    }

    .headline-3{
        font-style: normal;
        font-weight: 700;
        font-size: 24px;
        line-height: 1.4em;
        color: white;
        font-family: 'Spline Sans', sans-serif;
    }

    span{
        font-style: normal;
        font-weight: 400;
        font-size: 20px;
        line-height: 1.4em;
        color: #71C6F0;
        font-family: 'Spline Sans', sans-serif;
    }

    p{
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 150%;
        color: #324994;
        font-family: 'Manrope', sans-serif;
    }

    input[type="text"], 
    input[type="email"], 
    input[type="url"], 
    input[type="password"], 
    input[type="search"], 
    input[type="number"], 
    input[type="tel"], 
    input[type="range"], 
    input[type="date"], 
    input[type="month"], 
    input[type="week"], 
    input[type="time"], 
    input[type="datetime"], 
    input[type="datetime-local"], 
    input[type="color"], 
    textarea {
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        color: #324994;
        font-family: 'Manrope', sans-serif;
        padding: 15px 30px;
    }

    .wpcf7-not-valid-tip {
        color: #dc3232;
        font-size: 15px !important;
        font-weight: normal;
        display: block;
        padding-top: 5px;
    }

    .wpcf7-list-item {
        display: inline-block;
        margin: 0px 0px 0px 0em !important;
    }

    [type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0;
    height: 30px !important;
    width: 30px !important;
    }

    span.wpcf7-list-item-label{
        top: -8px;
        position: relative;
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        color: #324994;
        font-family: 'Manrope', sans-serif;
        padding-left: 10px;
    }


    .white-paragraph{
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 150%;
        color: white !important;
        font-family: 'Manrope', sans-serif;
    }

    .content-page ol li{
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        color: #324994;
        font-family: 'Manrope', sans-serif;
    }


    figcaption {
        font-style: italic;
        font-weight: 400;
        font-size: 16px;
        color: #324994;
        font-family: 'Manrope', sans-serif;
    }


    .btn-primary{
        justify-content: center;
        align-items: center;
        padding: 16px 32px;
        gap: 10px;
        background: #F8B049;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        line-height: 150%;
        color: white;
        text-decoration: none;
        border: none;
        display: inline-block;
    }

    .btn-primary:hover{
        background-color: #fdab35;
        border: none;
    }


    .btn-secondary{
        justify-content: center;
        align-items: center;
        padding: 16px 32px;
        gap: 10px;
        background-color: #FFFFFF !important;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        line-height: 150%;
        color: #324994;
        text-decoration: none;
        display: inline-block;
        border: none;
    }

    .btn-secondary:hover{
        background-color: #B5DFF2 !important;
        color: #324994;
        border: none;
    }

    a:visited.btn-secondary{
        color: #324994;
    }

    .btn-secondary:active:focus{
        border: none !important;
    }



    .btn-dark-blue{
        justify-content: center;
        align-items: center;
        padding: 16px 32px;
        gap: 10px;
        background-color: #264293 !important;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        line-height: 150%;
        color: white;
        text-decoration: none;
        display: inline-block;
        border: none;
    }

    .btn-dark-blue:hover{
        background-color: #18368f !important;
        color: white;
        border: none;
    }


    .btn-light-blue{
        justify-content: center;
        align-items: center;
        padding: 16px 32px;
        gap: 10px;
        background-color: #B5DFF2 !important;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        line-height: 150%;
        color: #264293;
        text-decoration: none;
        display: inline-block;
        border: none;
    }

    .btn-light-blue:hover{
        background-color: #8fcfec !important;
        border: none;   
        color: #264293;
    }


    a {
        color: #F8B049;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
    }

    a:hover {
        color: #fdab35;
    }

    a.link-white {
        color: white !important;
        text-decoration: none;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        display: inline-block;
    }

    a.link-white:hover {
        color: white !important;
    }


    a.link-light-blue {
        color: #1DB4DB !important;
        text-decoration: none;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
    }

    a.link-light-blue:hover {
        color: #1DB4DB;
    }

    .hero-header{
         background-image: url("/wp-content/themes/streamcircle/assets/resources/hero-bg.svg");
         min-height: 525px;
         background-color: #2c4395;
    }

	.cta-section {
		background-image: url(/wp-content/themes/streamcircle/assets/resources/hero-bg.svg);
		min-height: 400px;
		background-color: #2c4395;
	}


    .hero-header h1{
        margin: 0px;
    }

    .hero-header-content{
        padding: 170px 0px;
    }

    .solution-card{
        padding: 30px;
        min-height: 400px;
        margin: 20px;
    }

    .solution-card img{
        max-width: 50%;
        padding-bottom: 15px;
    }

    .television-image{
        top: -212px;
        position: relative;
    }

    .card-module{
        padding: 50px 100px;
    }

    .navbar-custom {
        background-color: var(--COLOR);;
    }

    .nav-link { 
        padding: 1rem 1rem;
    }

    .navbar-toggler{
        width: 47px;
        height: 34px;
        background-color: var(--COLOR);;
        border:none;
    }
    .navbar-toggler .line{
        width: 100%;
        float: left;
        height: 2px;
        background-color: white;
        margin-bottom: 5px;
    }

    .nav-link{
        color: white;
        text-decoration: none;
        font-family: 'Manrope', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 20px;
    }
    .navbar-nav{
        padding: 20px  55px;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        margin-right: 51px;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        padding: 0px;
    }

    .navbar-nav a{
        color: white !important;
    }

    .button{
        background: #F8B049;
        padding: 12px 44px;
        font-family: 'Manrope', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 20px;
        line-height: 24px;
        color: var(--COLOR);
        text-decoration: none;
    }

    .footer{
        background-color: #264293;
        padding-top: 150px;
    }


    .footer ul{
        list-style-type: none;
        margin: 0;
        padding: 0;
    }


    .footer ul li a{
        font-family: 'Manrope', sans-serif;
        color: white;
        font-style: normal;
        font-weight: 800;
        font-size: 18px;
        line-height: 1.8;
        text-decoration: none;
    }

    .footer ul li a: hover{
        color: #F8B049 !important;
    }

    .footer .link-white{
        font-family: 'Spline Sans', sans-serif;
        font-weight: 700;
        font-size: 24px;
    }



    .fa {
        color: white;
        padding-right: 25px;
    }


    .nav-link:focus, .nav-link:hover {
        color: #6FDBDB;
    }

    a:hover {
        color: #6FDBDB;
    }
    .button:hover{
        color: white;
        background-color: #33cbcb;
    }


    .bg-left{
        /*padding: 60px 0px;*/
        padding: 0px 0px 60px 0px;
        background-color: #264293;
    }

    .bg-left h1{
        color: white;
        font-size: 100px;
        line-height: 1;
    }

    .bg-left p{
        color: white;
        font-size: 24px;
    }

    h2{
        color: #264293;
        font-size: 40px;
    }
   

    .bg-right{
         padding: 60px 0px;
        background-color: #B5DFF2;
    }

    .footer-line{
        padding-top: 100px;
    }

    .header-image{
        width: auto;
        padding: 70px;
    }

    .footer a:visited{
        color: white;
    }


    .footer-demo a{
        font-size: 40px;
        color: white;
        text-decoration: none;
    }

    .navbar-brand{
        padding-left: 50px;
    }

    .post, .page {
        margin: 0 0 0em !important;
    }

    #integrated-modules{
        background: #E4F4FA;
    }

    .intro-modules{
        padding-bottom: 241px;
    }

    .intro-television img{
       width: 100%;
    }
    .intro-wrap {
        margin-top: -241px;
    }
    #solutions{
        padding-top: 120px;
        margin-bottom: -200px;
    }




    .right-timeline{
         background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline.svg);
        background-repeat: no-repeat;
        background-position: left;
        background-size: contain;
        background-position-x: -12px;
    }

    .left-timeline{
         background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline.svg);
        background-repeat: no-repeat;
        background-position: right;
        background-size: contain;
        background-position-x: 101.5%;
    }

    .page-timeline{
        background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline-page.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        backface-visibility: hidden;
    }

    .line-solutions{
         background-image: url("/wp-content/themes/streamcircle/assets/resources/line-bg.svg");
         background-repeat: no-repeat;
         background-position: center;
         background-size: contain;
         backface-visibility: hidden;
         padding: 40px 0px;
    }

    .book-demo #container-image{
        background-image: url("/wp-content/themes/streamcircle/assets/resources/book-demo-image.png");
        background-repeat: no-repeat;
        background-position: center;
        height: 480px;
    }

    .book-demo{
         padding: 180px 0;
         background-color: #E4F4FA;
    }

    .book-demo-text{
        padding: 140px 0px;
    }



    .post-frames{
        background-image: url("/wp-content/themes/streamcircle/assets/resources/timelines-post-frames.svg");
        background-repeat: no-repeat;
        background-position: center;
    }

    .intro-wrap-post {
        margin-top: -570px;
        margin-bottom: 200px;
    }



    .intro {
      font-size:16px;
      max-width:500px;
      margin:0 auto;
    }
    .intro p {
      margin-bottom:0;
    }

    .people {
      padding:50px 0;
    }
    .item {
      margin-bottom:30px;
    }

    .item .box {
      text-align:center;
      background-repeat:no-repeat;
      background-size:cover;
      background-position:center;
      height:470px;
      position:relative;
      overflow:hidden;
    }

    .item .cover {
      position:absolute;
      top:0;
      left:0;
      width:100%;
      height:100%;
      background-color: rgb(0 9 38 / 50%);
      transition:opacity 0.15s ease-in;
      opacity:0;
      padding-top:350px;
      color:#fff;
      text-shadow:1px 1px 1px rgba(0,0,0,0.15);
    }

    .item:hover .cover {
      opacity:1;
    }


    .cover h3.name{
        color: white;
        opacity: 1;
        font-family: 'Spline Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 24px;
    }

    .cover p.title{
        color: white;
        opacity: 1;
        padding: 0px;
        margin-bottom: 0px;
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 400;
        font-size: 20px;
    }

    .blue-content {
        background-color: #B5DFF2;
        padding: 120px;
        top: -120px;
        position: relative;
    }

    .blue-content-post {
        background-color: #B5DFF2;
        padding: 0px 120px 560px 120px;
        top: -120px;
        position: relative;
    }

    .sc-post-date{
        padding: 50px 0px 20px 0px;
    }


    .content-page {
        padding: 70 0px;
    }

    .logo-references img{
        background-color: #264293;
        padding: 30px 50px;
        max-height: 90px;
    }

    .bg-highlights{
        padding: 90px;
        background-color: #264293;
        color: white;
    }

    .highlights-content{
        padding-left: 90px;
    }



    .bg-highlights p{
        color:white;
    }


    .bg-highlights ul{
        color: white !important;
    }

    .bg-highlights li{
        color: white !important;
        margin: 30px 0px;
    }

    .references-section{
        padding-bottom: 100px;
    }

    ul, ol {
    margin: 1.2em 0 1.2em 0e !important
    }


    .about-references{
        margin: 0px 0px 50px 0px;
    }

    .solutions-image{
        position: relative;
        bottom: -653px;
        margin-top: -438px;
    }

    input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea{
        width: 100%;
        border: none;
    }
    
    button, input[type="button"], input[type="reset"], input[type="submit"]{
        justify-content: center;
        align-items: center;
        padding: 16px 32px;
        gap: 10px;
        
        font-family: 'Manrope';
        font-style: normal;
        font-weight: 800;
        font-size: 16px;
        line-height: 150%;
        color: white;
        text-decoration: none;
        display: inline-block;
        border: none;
    }

    .wpcf7-form-control-wrap{
        width: 100%;
    }

    .wpcf7 label{
        width: 100%;
    }

    /*swiper start*/
.slider {
  max-width: 1300px;
  margin: 0 auto;
}

.swiper-container {
  padding-bottom: 20px;
}

.swiper-scrollbar {
  background: #d6d6d6;
}

.swiper-slide{
  text-align: center;
}

.swiper-slide img{
  background-color:#264293;
  padding: 50px 50px;
  margin: 20 20px;
}

.swiper-scrollbar-drag{
    background-color: #264293;
    border-radius: 15px;
    background-image: url(wp-content/themes/streamcircle/assets/resources/scrollbar.svg);
    background-size:  cover;
    width: 170px !important;
}

.swiper-container-horizontal > .swiper-scrollbar {
    border-radius: 0;
    height: 31px;
    width: 100%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.swiper-scrollbar {
    background-image: url(wp-content/themes/streamcircle/assets/resources/line-references.svg);
    background-size:  cover;
    padding: 0px 30px;
}

.swiper-scrollbar {
    background-color: #e4f4fa;
}


.swiper-wrapper{
    height: auto;
}

    /*Swiper end*/


/*Slider*/
.slider {
  max-width: 1300px;
  margin: 0 auto;
}

.swiper-container {
  padding-bottom: 20px;
}

.swiper-scrollbar {
  background: #d6d6d6;
}

.swiper-slide{
  text-align: center;
}

.swiper-slide a{
    text-decoration: none;
}

.swiper-slide img{
  background-color: #B5DFF2;
  padding: 50px 50px;
  margin: 20 20px;
  max-height: 45px;
}

.swiper-slide-active img{
  background-color:#264293;
}


.swiper-slide img:hover{
  background-color:#264293;
}

.swiper-scrollbar-drag{
    background-color: #264293;
    border-radius: 15px;
    background-image: url(wp-content/themes/streamcircle/assets/resources/scrollbar.svg);
    background-size:  cover;
    width: 170px !important;
}

.swiper-container-horizontal > .swiper-scrollbar {
    border-radius: 0;
    height: 31px;
    width: 100%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.swiper-scrollbar {
    background-image: url(wp-content/themes/streamcircle/assets/resources/line-references.svg);
    background-size: cover;
    background-repeat: no-repeat;
    padding: 0px 25px;
}

.swiper-scrollbar {
    background-color: #e4f4fa;
}


.swiper-wrapper{
    height: auto;
}
/*Slider end*/




/*Frames*/
    .header {
        overflow: hidden;
    }
    /* .bg-left {
        overflow: hidden;
    }*/

    .frames-left:after {
        content: "";
        background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline_frames_half_1.svg);
        background-size: cover;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }

    .frames-right:after {
        content: "";
        background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline_frames_half_2.svg);
        background-size: cover;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }

    .frames-slide-in:after {
        animation-duration: 8s;
        animation-name: frames-slide-in;
        animation-fill-mode: forwards;
    }

    @keyframes frames-slide-in {
        from {
            transform: translateX(-7.5%);
        }

        to {
            transform: translateX(0);
        }
    }

    @media only screen and (max-width: 767px) {
      @keyframes frames-slide-in {
          from {
              transform: translateX(-15%);
          }

          to {
              transform: translateX(0);
          }
      }
    }

    .timeline-playhead {
        top: 0px;
        left: 0px;
        height: 100%;
        transform-origin: center;
        transform: translateX(-50%);
        z-index: 100;
    }

    .playhead-slide-in {
        animation-delay: 0s;
        animation-duration: 3s;
        animation-name: playhead-slide-in;
        animation-fill-mode: forwards;
    }

    @keyframes playhead-slide-in {
        from {
            left: 0;
        }

        to {
            left: calc(100%);
            transform: translateX(-50%);
        }
    }

    .top-layer {
        z-index: 50;
        padding: 0px 30px;
    }
    .bg-color {
        background-color: lightblue;
        background-image: linear-gradient(#E4F4FA 0 50%, #264293 50% 100%);
        padding: 60px 0 120px 0;
        overflow: hidden;
    }

    .overlay-left:after {
        content: "";
        background-color: #E4F4FA;
        background-size: cover;
        width: 25%;
        height: calc(50% + 30px);
        position: absolute;
        top: 0;
        left: 0;
    }

    .overlay-right:before {
        content: "";
        background-color: #264293;
        background-size: cover;
        width: 25%;
        height: calc(50% - 30px);
        position: absolute;
        right: 0;
        bottom: 0;
    }

    .frames:before {
        content: "";
        background-image: url(/wp-content/themes/streamcircle/assets/resources/timeline_frames.svg);
        background-size: cover;
        background-position: center center;
        width: 100%;
        height: 120%;
        position: absolute;
        top: -10%;
        left: 0;
        z-index: 50;
    }

  @media only screen and (max-width: 767px) {
      .frames:before {
          width: 200%;
          background-position: top center;
      }
  }


  .hero-post{
    width: 225px;
    height: 130px;
    background-size: cover;
    border-right: 10px solid #f8b049;
    box-shadow: inset 2000px 0 0 0 rgb(1 11 46 / 50%); 
    z-index: 1;
    position: relative;
    text-align: center;
  }

   .hero-post h4{
    color: white;
    font-size: 20px;
    font-weight: bold;
   }


    .hero-post a{
        color: #71c6f0 !important;
        font-size: 14px;
        text-decoration: none;
    }

    .hero-post-content{
        margin: 0;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        padding: 20px;
    }


/*Frames end*/


   .playhead-slide-in {
        /* EDIT */
        animation-duration: 4s;
    }

    .header-img {
         width: 100%;
         height: 100%;
         overflow: hidden;
     }

     .header-img-part {
         position: absolute;
         height: 100%;
         top: 0;
         left: 0;
     }

     .from-left-in {
         animation-duration: 1s;
         animation-name: from-left-in;
         animation-fill-mode: both;
     }

     @keyframes from-left-in {
         from {
             transform: translateX(-100%);
         }

         to {
             transform: translateX(0);
         }
     }

     .from-right-in {
         animation-duration: 1s;
         animation-name: from-right-in;
         animation-fill-mode: both;
     }

     @keyframes from-right-in {
         from {
             transform: translateX(-100%);
         }

         to {
             transform: translateX(0);
         }
     }

     .from-bottom-in {
         animation-duration: 1s;
         animation-name: from-bottom-in;
         animation-fill-mode: both;
     }

     @keyframes from-bottom-in {
         from {
             transform: translateY(100%);
         }

         to {
             transform: translateY(0);
         }
     }

     .from-top-in {
         animation-duration: 1s;
         animation-name: from-top-in;
         animation-fill-mode: both;
     }

     @keyframes from-top-in {
         from {
             transform: translateY(-100%);
         }

         to {
             transform: translateY(0);
         }
     }

     .in-1 {
         animation-delay: 0.2s;
     }

     .in-2 {
         animation-delay: 0.4s;
     }

     .in-3 {
         animation-delay: 0.6s;
     }

     .in-4 {
         animation-delay: 0.8s;
     }

     .in-5 {
         animation-delay: 1.0s;
     }

     .in-6 {
         animation-delay: 1.2s;
     }

     .in-7 {
         animation-delay: 1.4s;
     }

     .in-8 {
         animation-delay: 1.6s;
     }

     .in-9 {
         animation-delay: 1.8s;
     }

     .bg-right {
         padding: 0 0;
     }

    .nav-links a{
        text-decoration:none;
    }

    .arrow-navigation{
        padding-bottom: 50px;
    }


    .nav-title-post{
        color: #264293;
        font-size: 20px;
        font-family: 'Spline Sans', sans-serif;
        font-weight: bold;
        text-decoration: none;
    }
    .nav-text{
        margin: 5px 45px;
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        color: #71C6F0;
        font-family: 'Spline Sans', sans-serif;
    }


    .arrow {
      border: solid #264293;
      border-width: 0 4px 4px 0;
      display: inline-block;
      margin: 0px 10px;
      padding: 7px;
    }

    .right {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
    }

    .left {
      transform: rotate(135deg);
      -webkit-transform: rotate(135deg);
    }

    .nav-title-post >br {
    display:none;
    }
    .icon-arrow{
        display: inline-block;
    }


    .post-wrap{
        margin-top: -560px;
        margin-bottom: 100px;
        overflow: hidden;
    }

    .post-space{
        padding-bottom: 60px !important;
        margin-bottom: -60px;
    }




/*MOBILE RESOLUTION MAX 600px*/
@media only screen and (max-width: 600px) {
    .navbar-nav {
        text-align: center;
    }
    .navbar-expand-lg .navbar-nav .nav-link {
        margin-right: 0px ;
    }

    .button{
        padding: 12px 24px;
    }

    .card-module {
    padding: 50px 20px;
    }

    .highlights-content {
    padding-left: 20px;
    padding-top: 40px;
    }


}


@media only screen and (min-width: 576px){



}

/* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
@media only screen and (min-width:280px) and (max-width:480px)  { 

    .bg-left h1 {
    color: white;
    font-size: 80px;
    line-height: 1;
    }

    .headline-1 {
    font-size: 50px;
    padding: 20px;
    }

    .hero-header {
    min-height: auto;
    }

    .hero-header-content {
    padding: 150px 0px;
    }

    h1 {
    margin: 0.37em 0;
    }

    .navbar-brand {
    padding-left: 20px;
    }

    .card-module {
    padding: 50px 20px;
    }

    .header-image {
    width: auto;
    padding: 20px;
    }
    #intro-modules {
    padding-bottom: 270px;
    }

    .order:nth-child(2n) .ordering-content:first-child {
    order: 2 !important;
    }
    .blue-content {
    padding: 30px;
    }
    .page-timeline{
        background-image: none;
    }
    .menu li {
    display: block;
    }


    .intro-wrap-post {
    margin-top: -160px;
    margin-bottom: 90px;
    }

    .highlights-content {
    padding-left: 20px;
    padding-top: 40px;  
    }

    .post-navigation .nav-links {
    display: inline-block !important;
    width: 100%;
    }
    .blue-content-post{
    padding: 0px 30px 244px 30px;
    top: 0px;
    }
    .post-wrap {
    margin-top: -215px;
    }

    .post-space {
    margin-bottom: 30px;
    }
}

/* smartphones, Android phones, landscape iPhone */
@media only screen and (min-width:481px) and (max-width:600px) { 

    h1 {
    margin: 0.327em 0;
    }

    .navbar-brand {
    padding-left: 20px;
    }


    .card-module {
        padding: 10px 10px;
    }

    #intro-modules {
    padding-bottom: 270px;
    }

    .order:nth-child(2n) .ordering-content:first-child {
    order: 2 !important;
    }
    .page-timeline{
        background-image: none;
    }
    .menu li {
    display: block;
    }

    .highlights-content {
    padding-left: 20px;
    padding-top: 40px;
    }

    .post-navigation .nav-links {
    display: inline-block !important;
    width: 100%;
    }
    .blue-content-post{
    padding: 0px 30px 244px 30px;
    top: 0px;
    }
    .post-wrap {
    margin-top: -215px;
    }

    .post-space {
    margin-bottom: 30px;
    }

}

     

/* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */
@media only screen and (min-width:601px) and (max-width:800px)  { 

    .navbar-brand {
    padding-left: 20px;
    }

    h1 {
    margin: 0.37em 0;
    }

    .card-module {
    padding: 50px 20px;
    }

    .order:nth-child(1n) .ordering-content:second-child {
    order: 2 !important;
    }

    .bg-left h1 {
    font-size: 80px !important;
    }

    .page-timeline{
        background-image: none;
    }

.menu li {
    display: block;
    }
    .highlights-content {
    padding-left: 20px;
    padding-top: 40px;  
    }

    .post-navigation .nav-links {
    display: inline-block !important;
    width: 100%;
    }
    .blue-content-post{
    padding: 0px 30px 244px 30px;
    top: 0px;
    }
    .post-wrap {
    margin-top: -215px;
    }

}

/* tablet, landscape iPad, lo-res laptops ands desktops */
@media only screen and (min-width:801px) and (max-width:1024px) { 

    .card-module {
        padding: 10px 10px;
    }

    .bg-left h1 {
    font-size: 80px;
    }

    .nav-link {
    margin-right: 15px !important;
    }

    .page-timeline{
       background-image: none;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
    margin-right: 5px;
    }

    .highlights-content {
    padding-left: 20px; 
    }

}

/* big landscape tablets, laptops, and desktops */
@media only screen and (min-width:1025px) and (max-width:1280) {

    .navbar-expand-lg .navbar-nav .nav-link {
    margin-right: 10px;
    }

    .navbar-nav {
    padding: 20px 0px;
    }
}

/* hi-res laptops and desktops */
@media only screen and (min-width:1281px) and (max-width:1366px) {

    .nav-link {
    margin-right: 30px !important;
    }
}

button, input[type="button"], input[type="reset"], input[type="submit"] {
	background: #264293;
}