@charset "UTF-8";
/* CSS Document */

.slidecontainer{
    overflow-x: hidden;
    width: 100%;
    margin: 0 auto;
  }
 .slidecontainer #carouselController{
      display: flex;
      justify-content: center;
      width: 100%;
    }
 .slidecontainer #carouselController .button{
        width: 0.5rem;
        height: 0.5rem;
        margin: 0 .5rem;
        border-radius: 50%;
        border: solid 2px #ccc;
        cursor: pointer;
      }
 .slidecontainer #carouselController .active{
          background-color: #bbb;
        }
 .slidecontainer .content-carousel{
      display: flex;
    }
 .slidecontainer .content{
        width: 100%;
        padding-left: 0;
        transition-duration: .5s;
        position: relative;
        left: 0%;

        /* ---------- not important stuff ---------- */
     overflow-y: hidden;
        height: 450px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: .0 0 2rem 0;
      }
 .slidecontainer .content h2{
          text-align: center;
          color: #fff;
          font-size: 300%;
          margin: 1rem 0;
        }
/*******
 .slidecontainer .first{
        border: solid 5px #314755;
      }
 .slidecontainer .second{
        border: solid 5px #AA076B;
      }
 .slidecontainer .third{
        border: solid 5px #E36209;
      }******/
 .slidecontainer h3{
      color: #fff;
      margin-top: 2rem;
    }
 .slidecontainer p{
      color: #fff;
      margin: 0;
    }
 .slidecontainer a{
      color: #ECC200;
      text-decoration: none;
    }
 .slidecontainer a:hover{
        text-decoration: underline;
      }