@import url('https://fonts.googleapis.com/css?family=Abril+Fatface|Homemade+Apple|Open+Sans:300i,400,400i,700,800');

body {  margin: 0;  padding: 0; font-family: futura-pt, sans-serif; background-color: #fff !important;}
.rw {
  margin: 0 auto;
  height: 280px;
  max-width:800px;
  position: relative;
  display:block;
  overflow: hidden;
}

p{font-family:"minion-pro"; line-height: 1.6;}
.round{
width: 80px;
height: 50px;
display: block;
margin: 25px 0 0 20px;
float: right;
background: #FF6699;
border-radius: 100%;
padding-top:30px;
text-align: center;
color:#fff;
}
.round2{
width: 80px;
height: 50px;
display: block;
margin: 0 0 0 20px;
float: right;
background: #FF6699;
border-radius: 100%;
padding-top:30px;
text-align: center;
color:#fff;
}
.round2 i{
margin-top: -8px;
font-size: 25px;
}
span { font-size: 18px; line-height: 1.6;  display: block; padding: 15px; color:#7B7B7B; letter-spacing: 1.26px;}
.imgr{display: block;
margin: 15px 0 0 20px;
float: right;}
.fin{background: #FFEBF2; padding: 10px; margin: 0 15px;}
.fin p {font-size: 16px;}
.layout{  
width: 100%;
top: 0;
}
svg{  width: 100%;height: 100%;}
#night-content{ opacity: 1;}
.inner-shadow{  fill: none;}
.circle {
  padding: 10px;
  border-radius: 200px;
  display: inline-block;
  height: 200px;
  width: 200px; 
  text-align:center;
  color:#fff;
  overflow:hidden;
}
.circles {  transform: rotate(-40deg);}
.circles2 { transform: rotate(-25deg);}
ul li .date{line-height: 1; margin: 10px auto 0 auto; z-index: 999; position: absolute; left:0; right:0; color:#fff; font-weight:bold;}
ul li .date a.day{font-size:80px;  display:block; }
.circle use {  fill: none;}
.circle text {  fill: white; font-size:8px; font-family: futura-pt, sans-serif; font-weight:bold; }
ul {padding:0; margin:0; display:inline-block; list-style:none; }
ul li.icn{list-style:none; display: inline-block; margin: 0 15px 20px 15px;}
ul li.rel{list-style:none;  float: left; margin: 0 10px;position: relative;}
ul li.icn img{ width:100%;}

.center{text-align:center;}
h1{ letter-spacing: 3px;margin-top:20px; color:#000; padding: 0; font-size:40px; line-height:1.2;
}
.btn{
background: #FF66991A 0% 0% no-repeat padding-box;
border: 1px solid #FF6699;
opacity: 1;
text-align: center;
font: Demi Futura PT;
letter-spacing: 1.4px;
color: #FF6699;
text-transform: uppercase;
text-decoration: none;
padding: 5px 15px;
margin: 15px 0 20px 0 !important;
display: inline-block;
font-size: 14px;
font-weight: 600;
}
a.by{ color: #FF6699; margin: 20px 0 !important; padding: 0 15px; letter-spacing: 2px; display: block;font-size: 11px;}
.ln{padding: 10px 0; border-bottom: 8px solid #f27796; width:80%;   margin: 10px auto 40px auto; position:relative;}
h3 a{ line-height: 1.6; padding-bottom: 10px;}
h3{ font-size:22px; padding: 15px 15px 0 15px; color:#FF6699; text-align: center; letter-spacing: 2px; margin: 0; text-decoration:uppercase; z-index: 9999; position:relative; font-weight:800; }
h2{ font-size: 20px; padding: 0 15px; font-weight:bold; text-decoration:uppercase; z-index: 9999; position:relative; margin: 10px 0; letter-spacing:1px;}
h4{  font-weight:bold; text-decoration:uppercase; z-index: 9999; position:relative; margin: 10px 0; letter-spacing:2px; font-size:18px;}

.side-nav{z-index: 9999; position:relative;}
.sub-headline{ font-size:18px;}
.content{width: 100%; margin: 0 auto; max-width: 600px;}
button{text-decoration:uppercase; background:none; float:right; font-weight:bold; border:0; color:#888;  }
button a{ text-decoration:none; font-size:15px !important; color:#000 !important; padding: 0;}
.black {  background-color:#000; z-index: 999;position: relative;}
.black  a{ color:#fff;}
.white{background:#fff; position:relative}
.gray { background-color:#fff;  position: relative; font-size: 19px;}
.ft {  
background-color:#000; 
z-index: 999;
color: #fff; 
font-size:16px;
position: relative;
text-align:left;
padding-left: 30px;
display:block;
max-width: 850px;
margin: -15px auto 0 auto !important;
}
.section2 > div > p:nth-child(odd)::first-letter {

}
ul.num > li {
display: inline-block;
}
ul.num > li > p{
display: inline-block;
padding: 0;
margin: 0;
font-family: futura-pt, sans-serif;
font-size: 17px;
}
ul.num > li > div{
display: inline-block;
padding: 0;
margin: 0;
font-family: futura-pt, sans-serif;
font-size: 17px;
}
ul.num > li > p > a {
width: 30px;
height: 30px;
display: inline-block;
  background: #FFEBF2;
border-radius: 100%;
text-align: center;
justify-content: center;
align-items: center;
display: flex;
float: left;
margin-right: 10px;
margin-bottom: 10px;
  color:#FF6699;
}
ul.num > li > div > a {
width: 30px;
height: 30px;
display: inline-block;
  background: #FFEBF2;
border-radius: 100%;
text-align: center;
justify-content: center;
align-items: center;
display: flex;
float: left;
margin-right: 10px;
margin-bottom: 35px;
  color:#FF6699;
}
ul.num > li > div:nth-child(odd)::first-letter {

}
.in{padding: 0 15px;}
.section1 { text-align: center;}
.head{ position:relative; text-align: center;  max-width:880px; margin:0 auto;  display:block; }
.head img{ width:100%; display:block; }
section {max-width:800px; margin: 0 auto 15px auto; padding: 0 0 15px 0; }
.banner p b{ font-family: futura-pt, sans-serif; padding: 10px 0; display: block; font-weight: 500;}
.in p b{ font-family: futura-pt, sans-serif; padding: 10px 0; display: block; font-weight: 500;}
.section2 > p:nth-child(odd)::first-letter {

}

.headline { font-size: 50px; line-height:auto; }
.ta {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  opacity: 0;
  transition: all .2s ease-in;
}
.ti {
  text-align: center;
  margin: 0 auto;
  opacity: 0;
  transition: all .2s ease-in;
}

.hand, .women, .vote, .stop {max-width: 800px; margin: 0 auto;}
.parallaxParent { height: 300px; }
.parallaxParent > * {
  height: 120%;
  position: relative;
  top: -50%;
}


.line{  height:10px; width:500px; margin: 0 auto; overflow:hidden; }
.lines{  background-image: url("../img/line.svg");  background-repeat: repeat-x; background-position: center top; margin: 0 -15px; background-size:100%;}
.lq {z-index:999; position:relative;}
.banner__heading {
  text-align: center;
  font-size: 3rem;
  letter-spacing: 10px;
}
.form_select{display:block; max-width:680px; clear:both; margin:0 auto;}
.form_select_produk {display:block; width:100%; clear:both;}
.radioholder { cursor: pointer; display:inline-block; padding: 20px; background-color: #f3c5b0; border-radius:5px;}
.radioholder a.plh{ margin: 5px; margin-left: 60px; display:inline-block; text-align: left;}
.activeradioholder {color: #000; background-image: url('http://supereightstudio.com/img/radio_tick.png'); }
.radioholder .tick {  
  background-size: 100%;
  position:absolute;
    height:40px; width:40px;
  background-image: url('../img/x.svg');
  background-repeat: no-repeat; background-position: center center;
  }

.radioholder .desc { clear:both; text-align: left; display:block;  line-height: 100%; padding-right: 10px; }
.activeradioholder .tick {
  background-image: url('../img/check.svg');
  background-repeat: no-repeat; background-position: center center;
  background-size: 100%;
  position:absolute;
}
.radioholder:hover {}
.radioholder:hover .tick {  background-image: url('../img/check.svg'); background-repeat: no-repeat; background-position: center center; }
.activeradioholder:hover {}
.activeradioholder:hover .tick {}
.footer{color:#fff;text-align:center; position:relative; max-width:880px; width: 100%; margin:0 auto; background:#000; display:inline-block;}
.footer a{color:#333; text-decoration:none; font-weight:bold;}
.banner p { font-size:19px; margin: 0; line-height: 1.6; display:block; padding-bottom:20px; padding: 0 15px; }
.banner { position:relative;}
.banner a { }
ul li .date img{ margin-top: 10px; opacity: 0.5;  filter: alpha(opacity=50); }

@media screen and (max-width: 600px){
  
  
  .circle {
  padding: 1px;
  border-radius: 100px;
  display: inline-block;
  height: 100px;
  width: 100px; 
  text-align:center;
  color:#fff;
  overflow:hidden;
}

ul li .date{ line-height: 1; margin: 5px auto 0 auto; z-index: 999; position: absolute; left:0; right:0; color:#fff; font-weight:bold;}
ul li .date a.day{font-size:40px;   }
.circle use {  fill: none;}
ul li .date img{width:20px; margin-top: 2px;}
ul li.rel{list-style:none; float: left; margin: 0 5px;position: relative;}
ul li.rel{list-style:none;  float: left; margin: 0 5px;position: relative;}
  
.line{  width:100%;}
.banner .ti img{ width:100%; }
.rw {
  margin: 0 auto;
  height: 150px;
  max-width:300px;
  position: relative;
  display:block;
  overflow: hidden;
  font-weight:800;letter-spacing: 3px;
}

.wrapper {
  margin: 0 auto;
  max-width:100%;
  position: absolute;
  display:block;
  left: -100px;
    
  font-weight:800;letter-spacing: 3px;
}
.wrapper2 {
  margin: 40px auto 0 auto;
  max-width:100%;
  position: absolute;
  display:block;
  left: -80px;
}
.wrapper svg {
-webkit-animation: rotate 10s linear infinite;
animation: rotate 10s linear infinite;
width: 500px;
height: 500px;
}
.wrapper2 svg {
-webkit-animation: rotate2 10s linear infinite;
animation: rotate2 10s linear infinite;
width: 460px;
height: 460px;
}
.wrapper svg .circle-text {
  font-size: 45px;
  width: 100%;
  fill: #e20e7c;
  font-weight:800 !important;letter-spacing: 3px !important;
}
.wrapper2 svg .circle-text2 {
  font-size: 45px;
  width: 100%;
  fill: #e20e7c;
  font-weight:800;letter-spacing: 3px;
}
  
h1{ padding: 5px 15px; font-size:28px; font-weight:bold; line-height:1.2; letter-spacing: 1.96px}
button{font-size:15px;}
button a{ font-size:15px !important; padding: 0 !important; }
section { }
.content{width: 100%; margin: 20px auto;  padding: 0px; margin: 0 auto;}
.section1, .banner { padding: 0;}
.section2 { letter-spacing: 0.5px;  }

.banner p {   line-height: 1.5;}
.banner a { margin: 0; }
.head img{ width:100%;}
.footer .element3{max-width: 280px; margin: 0 auto;}
.footer .element3 img{width:75%;}
.footer img{width:100%;}
.radioholder .tick {
    background-size: 100%;
    height: 40px;
    width: 40px;
}
 .radioholder { margin: 5px; }
.s-1-inner{
  width: 100%;
  margin: 20px auto 0 auto;  
  padding-top: 50px;
}

.section2 {
  padding: 20px auto; 
  display:block;

  letter-spacing: 1px;
  margin-bottom: -50px;
}

.s-1-inner a {
  padding: 10px 8px;
}
.s-2-inner a {
  padding: 10px 8px;
}
.s-3-inner a {
  padding: 10px 8px;
}}


