.pelangi {
    color: white;
    background: linear-gradient(45deg, #f22613, #f89406, #26a65b, #5868ec, #f54e80, #f7ca18, #d2527f);
    background-size: 500% 500%;
    -webkit-animation: ignielGradient 12s ease infinite;
    -moz-animation: ignielGradient 12s ease infinite;
    animation: ignielGradient 12s ease infinite;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
    @-webkit-keyframes ignielGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
    }
    @-moz-keyframes ignielGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
    }
    @keyframes ignielGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
    }  
    .furi {
    font-family: -apple-system, BlinkMacSystemFont, "segoe ui", Verdana, Roboto, "helvetica neue", Arial, sans-serif, "apple color emoji";
    font-size: 14px;
    /*margin: 0;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat:  no-repeat;
    background-attachment: fixed;
    background: #1FA2FF;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #A6FFCB, #12D8FA, #1FA2FF);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #A6FFCB, #12D8FA, #1FA2FF); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  
    }

.fona {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Verdana, Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji";
    font-size: 14px;

    background-image: linear-gradient(
        rgba(255, 255, 255, 0.1), 
        rgba(255, 255, 255, 0.1)
    ),
    url('../../../images/company/background_nias4.jpg');
    /* background-image: url('../../../images/company/background_nias2.jpg'); */

    background-size: cover;
    background-position: right bottom;
    background-repeat: no-repeat;
    background-attachment: fixed;

    color: #333;
}

  
    .box-konten {
      width: 100%;
      min-height: 750px;
      padding: 25px;
      border: 1px solid white;
      border-radius: 10px;
      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
      background-color: navy;
      /* background: -webkit-linear-gradient(to right, #1FA2FF, #12D8FA, #1FA2FF); 
    background: linear-gradient(to right, #1FA2FF, #12D8FA, #1FA2FF);  */
      font-family: Arial, Helvetica, sans-serif;
      /* text-align: center; */
      color:white;
      line-height : 1.1;
    }
  
    .box-kiri {
      width: 100%;
      height: 460px;
      padding: 25px;
      border: 1px solid white;
      border-radius: 10px;
      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
      background-color: #556B2F;
      /* background: -webkit-linear-gradient(to right, #1FA2FF, #12D8FA, #1FA2FF); 
    background: linear-gradient(to right, #1FA2FF, #12D8FA, #1FA2FF);  */
      font-family: Arial, Helvetica, sans-serif;
      text-align: center;
      color:white;
      line-height : 1.1;
    }
    .box-kiri-judul {
      font-size: 38px;
    }
    .box-kiri-nomor {
      font-size: 270px;
      font-weight: bold;
      text-shadow: 2px 2px 4px white;
    }
    .box-kiri-poli {
      font-size: 60px;
      font-weight: bold;
    }
  
    .box-kanan {
      width: 100%;
      height: 460px;
      padding: 25px;
      border: 1px solid white;
      border-radius: 10px;
      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
      background-color: navy;
      /* background: -webkit-linear-gradient(to right, #1FA2FF, #1FA2FF, #1FA2FF); 
    background: linear-gradient(to right, #1FA2FF, #1FA2FF, #1FA2FF);  */
      font-family: Arial, Helvetica, sans-serif;
      color:white;
      line-height : 1.1;
      
    }
  
    .box-kanan-judul {
      font-size: 20px;
      font-weight: bold;
      line-height : 1;
      text-align: center;
    }
    .box-kanan-nomor {
      font-size: 250px;
      font-weight: bold;
      text-shadow: 2px 2px 4px white;
    }
    .box-kanan-poli {
      font-size: 50px;
      font-weight: bold;
    }
    .box-kanan-data {
      font-size: 25px;
      /* font-weight: bold; */
      line-height : 1;
      /* text-shadow: 2px 2px 5px gold; */
      
  
    }
  
  
  @import url('https://fonts.googleapis.com/css?family=Lobster');
  @font-face {
    font-family: 'ModernPictogramsNormal';
    src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot");
    src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot?#iefix") format("embedded-opentype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.woff") format("woff"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.ttf") format("truetype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.svg#ModernPictogramsNormal") format("svg");
    font-weight: normal;
    font-style: normal;
  }
  /* line 13, ../sass/screen.scss */
  body {
    /* background: url("http://www.vancouverad.com/bgimg/img/noise_pattern_with_crosslines.png") repeat; */
    font-family: helvetica, arial, sans-serif;
  }
  
  /* line 17, ../sass/screen.scss */
  #wrapper {
    max-width: 1200px;
    margin: 10px auto 0 auto;
    text-align: center;
  }
  
  /* line 22, ../sass/screen.scss */
  .cool_btn1 {
    width: 240px;
    height: 240px;
    margin: 15px 15px 15px 15px;
    position: relative;
    -webkit-border-radius: 250px;
    -moz-border-radius: 250px;
    -ms-border-radius: 250px;
    -o-border-radius: 250px;
    border-radius: 250px;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
    background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
    background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
    background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
    background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
    display: inline-block;
  }
  /* line 31, ../sass/screen.scss */
  .cool_btn1 h1 {
    text-align: center;
    font-size: 80px;
    margin: 35px 0 0 0;
    color: #333;
    text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
    font-family: 'Lobster', cursive;
    font-weight: normal;
    line-height: 1;
  }
  /* line 40, ../sass/screen.scss */
  .cool_btn1 h1 i {
    display: block;
    font-style: normal;
    font-size: 14px;
    font-weight: bold;
    font-family: helvetica, arial, sans-serif;
    text-shadow: none;
  }
  /* line 49, ../sass/screen.scss */
  .cool_btn1 h2 {
    font-family: 'ModernPictogramsNormal', Arial, sans-serif;
    font-weight: bold;
    text-align: center;
    font-size: 30px;
    line-height: 1;
    margin: 25px 0 0 0;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
    color: #fafafa;
  }
  /* line 49, ../sass/screen.scss */
  .cool_btn1 h3 {
    font-family: 'ModernPictogramsNormal', Arial, sans-serif;
    font-weight: bold;
    text-align: center;
    font-size: 18px;
    line-height: 1;
    margin: 10px 0 0 0;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
    color: #cecece;
  }
  
  .boxupdate h3 {
    font-family: 'ModernPictogramsNormal', Arial, sans-serif;
    margin: 50px 0 0 0;
    position: relative;
    width: 40%;
    height: 100%;
    padding: 5px 5px 5px 5px;
    border: 0px solid white;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    background-color: #1FA2FF;
    /* background: -webkit-linear-gradient(to right, #1FA2FF, #1FA2FF, #1FA2FF); 
  background: linear-gradient(to right, #1FA2FF, #1FA2FF, #1FA2FF);  */
    font-family: Arial, Helvetica, sans-serif;
    color:white;
    line-height : 1.1;
    display: inline-block;
  }
  
  /* line 60, ../sass/screen.scss */
  .cool_btn1:after {
    content: "";
    width: 250px;
    height: 250px;
    display: block;
    position: absolute;
    left: -5px;
    top: -5px;
    z-index: -1;
    -webkit-border-radius: 250px;
    -moz-border-radius: 250px;
    -ms-border-radius: 250px;
    -o-border-radius: 250px;
    border-radius: 250px;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #cecece), color-stop(100%, #e7e7e7));
    background-image: -webkit-linear-gradient(#cecece, #e7e7e7);
    background-image: -moz-linear-gradient(#cecece, #e7e7e7);
    background-image: -o-linear-gradient(#cecece, #e7e7e7);
    background-image: linear-gradient(#cecece, #e7e7e7);
     -webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
    -moz-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
  }
  
  /* -------------------
  Transitions
  -------------------- */
  /* line 76, ../sass/screen.scss */
  .cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green, .cool_btn1.red, .cool_btn1.purple, .cool_btn1.maroon {
    -webkit-transition-property: all;
    -moz-transition-property: all;
    -o-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
  }
  
  /* -------------------
  Colors
  -------------------- */
  .cool_btn1.blue {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
  }
  .cool_btn1.blue h1 {
    color: #4265A3;
  }
  .cool_btn1.blue h2 {
    color: #1E3261;
  }
  
  
  .cool_btn1.teal {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
  }
  .cool_btn1.teal h1 {
    color: #149EDB;
  }
  .cool_btn1.teal h2 {
    color: #0C6186;
  }
  
  
  .cool_btn1.orange {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
  }
  .cool_btn1.orange h1 {
    color: #e27619;
  }
  .cool_btn1.orange h2 {
    color: #AC5509;
  }
  
  
  .cool_btn1.green {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
  }
  .cool_btn1.green h1 {
    color: #00a01e;
  }
  .cool_btn1.green h2 {
    color: #006312;
  }
  
  .cool_btn1.red {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #ff3300), color-stop(100%, #cc3300));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #ff3333 50%, #cc3300);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #ff3333 50%, #cc3300);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #ff3333 50%, #cc3300);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #ff3333 50%, #cc3300);
  }
  .cool_btn1.red h1 {
    color: #ff6633;
  }
  .cool_btn1.red h2 {
    color: #993300;
  }
  
  .cool_btn1.purple {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #cc33ff), color-stop(100%, #cc33cc));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #cc33ff 50%, #cc33cc);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #cc33ff 50%, #cc33cc);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #cc33ff 50%, #cc33cc);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #cc33ff 50%, #cc33cc);
  }
  .cool_btn1.purple h1 {
    color: #9900cc;
  }
  .cool_btn1.purple h2 {
    color: #990099;
  }
  
  .cool_btn1.maroon {
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #800000), color-stop(100%, #A52A2A));
    background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #800000 50%, #A52A2A);
    background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #800000 50%, #A52A2A);
    background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #800000 50%, #A52A2A);
    background-image: linear-gradient(#d5d5d5, #ffffff 50%, #800000 50%, #A52A2A);
  }
  .cool_btn1.maroon h1 {
    color: #990000;
  }
  .cool_btn1.maroon h2 {
    color: #cc3333;
  }
  
  /* -------------------
  Hover States
  -------------------- */
  /* line 123, ../sass/screen.scss */
  .cool_btn1.orange:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
  }
  
  /* line 128, ../sass/screen.scss */
  .cool_btn1.teal:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
  }
  
  /* line 133, ../sass/screen.scss */
  .cool_btn1.blue:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
  }
  
  /* line 138, ../sass/screen.scss */
  .cool_btn1.green:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
  }
  
  .cool_btn1.red:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 51, 51, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 51, 51, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 51, 51, 0.8);
  }
  
  .cool_btn1.purple:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 0, 204, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 0, 204, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 0, 204, 0.8);
  }
  
  .cool_btn1.maroon:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 51, 51, 0.8);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 51, 51, 0.8);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(204, 51, 51, 0.8);
  }
  
  /* -------------------
  Media Queries
  -------------------- */
  /* @media screen and (max-width: 860px) {
    #wrapper {
      width: 700px;
    }
  }
  @media screen and (max-width: 740px) {
    #wrapper {
      width: 480px;
    }
  }
  @media screen and (max-width: 440px) {
    #wrapper {
      width: 370px;
      text-align: center;
    }
  } */
  