a{color: #333; text-decoration: none;}
a:hover { text-decoration: none; color: #f36;}
#main{margin-top: 93px; }

.vertical, .text, .img{position:absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.container {width: 100%;max-width: 900px;margin: 0 auto;padding:0 10px;}

/* sections */
.section .img, .section .text, .section-odd .img, .section-odd .text {width:50%; text-align:center;}
.section .img, .section.section-odd .text{left: 0; right: auto;}
.section .text, .section.section-odd .img {right: 0; left: auto;}
.section img{max-width: 300px; max-height: 500px;}
.section .container{ color: #fff; font-size: 30px; position: relative; font-weight: 100; line-height: 1.5;}
.section h2 { color: #000; font-size: 40px; margin-bottom: 20px;}

@media (max-width: 600px) {
  #main{margin-top: 50px; }
  .section h2{ font-size:25px; }
  .section .container{ font-size: 16px; }
  .section .img, .section .text, .section-odd .img, .section-odd .text {
    position: static; top: 0;width: 100%;-webkit-transform: translateY(0); transform: translateY(0);margin-bottom: 20px;
  }
  .section .img img {
    max-height: 200px;
  }
}

/* header */
#header{text-align: right; position: fixed; top: 0; z-index: 9999; width: 100%; background:#fff; height: 93px; line-height: 93px;}
#header h1{float: left;}
#header h1 a{margin-left: 0;}
#header a{display: inline-block; margin-left: 30px;}
#header img{height: 53px; position: relative; top: 20px;}

@media (max-width: 600px) {
  #header{height: 50px; line-height: 50px; font-size: 12px;}
  #header a{margin-left: 5px;}
  #header img{height: 30px; position: relative; top: 10px;}
}

#p1{background: #F94E7B;}
#p1 .text{text-align: left;padding-left:50px;}
#p1 .text img{position:relative;margin-top:-30px;}
[href="#p6"]{border: 2px solid #fff; padding: 10px 30px; font-size: 20px;color:#fff;border-radius:3px;}
@media (max-width: 600px) {
  #p1 .text{text-align: center;padding-left:0;}
  #p1 .text img{position:relative;margin-top:0;width:89px;}
  #p6 table{ width: 80%; }
  #p7 .container { width: 60%; }
  [href="#p6"]{font-size: 16px;padding: 8px 14px;}
}

#p2{ background: #4D9DFF;}
#p3{ background: #FFC466;}
#p4{ background: #3CD6A2;}
#p5{ background: #9358FF;}
#p6{ background: #ecf0f1; color: #333; text-align: center;}
#p6 table{table-layout: fixed; width: 100%; max-width: 480px; margin: 0 auto; color: #333;}
#p6 img{border:1px solid #aaa; padding: 20px; background:#fff;max-width:90%;}
#p7{ background: #F94E7B;text-align: center;}

/* overwrite tooltip */
.fp-tooltip{color: #fff;}
#fp-nav span, .fp-slidesNav span{border-color: #fff;}
#fp-nav li .active span, .fp-slidesNav .active span{background: #fff;}