/*================================ variables=======================================*/
/*========= COLORS =======*/
/*========= FONT FAMILY =======*/
@import "https://fonts.googleapis.com/css?family=Noto+Sans|Ubuntu";
/*================================ end variables=======================================*/
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  background-color: #BDBDBD;
  font-family: "Ubuntu", sans-serif, "Helvetica Neue", Arial, Verdana, sans-serif; }

.container {
  width: 90%;
  max-width: 700px;
  margin: auto;
  height: 100%;
  /* --------------------------------------- */
  /* ----- Slider Info */
  /* --------------------------------------- */
  /* --------------------------------------- */
  /* ----- social  media */
  /* --------------------------------------- */ }
  .container .wrapper {
    background-color: #ffffff;
    border-radius: 5px;
    margin: 40px 0;
    width: 100%;
    overflow: hidden;
    z-index: 1000;
    /* --------------------------------------- */
    /* ----- Slider Banner */
    /* --------------------------------------- */ }
    .container .wrapper .slider-banner {
      overflow: hidden;
      z-index: 1000;
      position: relative; }
      .container .wrapper .slider-banner .banner {
        width: 100%;
        position: relative; }
        .container .wrapper .slider-banner .banner img {
          vertical-align: top;
          width: 100%;
          position: absolute;
          top: 0;
          left: 100%; }
      .container .wrapper .slider-banner .arrow-banner {
        font-size: 35px;
        line-height: 35px;
        color: rgba(33, 33, 33, 0.6);
        position: absolute;
        top: 62%;
        z-index: 1100; }
        .container .wrapper .slider-banner .arrow-banner:hover {
          color: #212121; }
      .container .wrapper .slider-banner .prev {
        left: 12px; }
      .container .wrapper .slider-banner .next {
        right: 12px; }
  .container .slider-info {
    text-align: center;
    overflow: hidden;
    padding: 20px 0;
    position: relative; }
    .container .slider-info .arrow-slider {
      font-size: 35px;
      line-height: 35px;
      color: #D32F2F;
      position: absolute;
      top: 40%;
      z-index: 1000; }
      .container .slider-info .arrow-slider:hover {
        color: #F44336; }
    .container .slider-info .prev {
      left: 20px; }
    .container .slider-info .next {
      right: 20px; }
    .container .slider-info .information {
      width: 100%; }
      .container .slider-info .information article {
        width: 100%;
        overflow: hidden;
        position: relative; }
        .container .slider-info .information article .slide {
          background-color: #ffffff;
          width: 100%;
          position: absolute;
          left: 100%;
          padding: 20px 80px; }
          .container .slider-info .information article .slide .name {
            font-size: 38px;
            line-height: 38px;
            color: #212121;
            margin-bottom: 15px; }
          .container .slider-info .information article .slide .job {
            color: #F44336;
            margin-bottom: 12px; }
          .container .slider-info .information article .slide .site {
            color: #BDBDBD;
            text-decoration: none; }
            .container .slider-info .information article .slide .site:hover {
              color: #D32F2F; }
      .container .slider-info .information .dots {
        width: 100%; }
        .container .slider-info .information .dots span {
          width: 14px;
          height: 14px;
          display: inline-block;
          margin: 0 10px;
          border-radius: 50%;
          background-color: #BDBDBD; }
        .container .slider-info .information .dots .active {
          background-color: #D32F2F; }
  .container .social-media {
    text-align: center;
    padding: 20px 0; }
    .container .social-media a {
      display: inline-block;
      font-size: 20px;
      width: 50px;
      height: 50px;
      padding: 14px 0;
      border-radius: 50%;
      color: #ffffff;
      margin: 0 10px;
      background-color: #BDBDBD; }
      .container .social-media a:hover {
        background-color: #F44336; }

/*# sourceMappingURL=style.css.map */