body {
    font-family: sans-serif, arial, helvetica;
}
/* Navigaton bullets styles
 * --------------------------------------- */
 #pp-nav li .active span, .pp-slidesNav .active span {
    background: #bbb;
}
#pp-nav span, .pp-slidesNav span {
    border-color: #bbb !important;
}
/* Sections
	 * --------------------------------------- */
 .section {
    background-attachment: fixed;
    background-size: auto 30%;
    background-position: 1% 96%;
    background-repeat: no-repeat;
}
#section1 {
 
}
#section2 {
    background-image: url(../img/sct1.png);
}
#section3 {
 background-image: url(../img/sct2.png);
 }
#section4 {
    background-image: url(../img/sct3.png);
    background-position: 109% 19%;
}
#section5 .content {
    top: 100%;
    position: absolute;
    left: 0;
}
/* Arrow
	 * --------------------------------------- */
 #arrow {
    width: 100%;
    height: 50px;
    text-align: center;
    cursor: pointer;
    position: fixed;
    bottom: 0;
    left: 0;
    border: 0;
    outline: 0;
    z-index: 100;
    color: #BBB;
    background: transparent;
    -moz-transition: all 0.2s cubic-bezier(0.7, 0.01, 0.3, 1);
    -o-transition: all 0.2s cubic-bezier(0.7, 0.01, 0.3, 1);
    -webkit-transition: all 0.2s cubic-bezier(0.7, 0.01, 0.3, 1);
    transition: all 0.2s cubic-bezier(0.7, 0.01, 0.3, 1);
    font: 36px Heiti, 'Lucida Grande', Arial;
    font-weight: bold;
}
#arrow span {
    display: inline-block;
    position: relative;
    top: -18px;
    -moz-transition: all 0.7s cubic-bezier(0.7, 0.01, 0.3, 1);
    -o-transition: all 0.7s cubic-bezier(0.7, 0.01, 0.3, 1);
    -webkit-transition: all 0.7s cubic-bezier(0.7, 0.01, 0.3, 1);
    transition: all 0.7s cubic-bezier(0.7, 0.01, 0.3, 1);
}
#arrow:hover {
    background: #fff;
}
#arrow:hover span {
    top: 0;
    color: #FFF;
}
/* Intro texts
	 * --------------------------------------- */

 .intro {
    position: absolute;
    top: 150px;
    text-align: right;
    width: 100%;
    right:17px; 
}

.intro h1 {
    font-size: 5em;
    font-weight: bold;
    color: #000;
    text-transform: uppercase; 
}
@media screen and (max-width: 414px){
.intro h1 {
    font-size: 1.6em;
}
}
.intro h2 {
    font-size: 1.5em;
    font-weight: bold;
    color: #000;
    text-transform: uppercase;
    padding-left:65%;
}

.intro3{
    position: absolute;
    top: 391px;
    width: 100%;
}
.intro3 h1 {
    font-size: 5em;
    font-weight: bold;
    color: #000;
    text-transform: uppercase; 
    padding-left: 80px;
}

.intro3 h2 {
    font-size: 1.5em;
    font-weight: bold;
    color: #000;
    text-transform: uppercase;
    padding-left: 81px;
    padding-right: 65%;
}

.intro5{
    position: absolute;
    top: 25%;
    text-align: right;
    width: 100%;
    right:17px; 
    line-height: 1.4
}

.intro5 h2 {
    font-size: 2.2em;
    font-weight: bold;
    color: #000;
    padding-left: 80px;
}

#section4 .intro {
    color: #000;
}
/* Content page
	 * --------------------------------------- */
 .header {
    padding-top: 80px;
    text-align: center;
}
.header h1 {
    font-size: 2em;
    font-weight: bold;
    color: #fff;
}
.header p {
    color: #f2f2f2;
    font-size: 1.7em;
}
.page {
    width: 71%;
    margin: 60px auto;
    background:white;
    padding: 60px;
    -webkit-box-sizing: border-box;
    /* Safari<=5 Android<=3 */
    -moz-box-sizing: border-box;
    /* <=28 */
    box-sizing: border-box;
}
.page p {
    font-style: 12px;
    margin: 20px 0 0 0;
    line-height: 1.35em;
    color: #333;
}
#rightLogo {
position: absolute;
top: -35px;
right: -189px;
z-index: 100;
}
#rightLogo img{
width: 45%;
}
#leftLogo {
position: absolute;
top: -30px;
left: 15px;
z-index: 100;
}
#leftLogo img{
width:40%;
}
#addy{
  color: #000;
  font-size:.8em;
  position: absolute;
bottom: 18.1em;
left: -13.5em;
float: left;
z-index: 100;
transform: rotate(90deg);
 -webkit-transform: rotate(90deg); /* Safari/Chrome */
 -moz-transform: rotate(90deg); /* Firefox */
 -o-transform: rotate(90deg); /* Opera */
 -ms-transform: rotate(90deg); /* IE 9 */
}
#copy{
position: absolute;
bottom: 16px;
right: 17em;
z-index: 100;
font-size: .8em;
color:#000;
}
#mail{
position: absolute;
bottom: 16px;
right: 17px;
z-index: 100;
font-size: .8em;
color:#000;
}
.pushmenu { /*this is the nav*/
  background: #444;
  text-align: center;
  width: 300px;
  height: 100%;
  top: 0;
  z-index: 1000;
  position: fixed;
}

.pushmenu h3 {
  color: #f1f1f1;
  font-size: 1.3em;
  font-weight: 400;
  padding: 15px 25px;
  margin: 0;
  background: #333;
  height: 16px;
}

.links {
  list-style-type: none;
  padding: 0;
  margin: 0 0 0 25%;
  width: 50%;
}

.links li { margin-top: 30px; }

.links li a {
  position: relative;
  display: block; /* drops the nav vertically*/
  color: #f1f1f1;
  font-size: 1.3em;
  font-weight: 400;
  text-decoration: none;
  padding: 14px;
}

.links li a:after {
  content: '';
  display: block;
  position: absolute;
  left: 20px;
  bottom: -5px;
  width: 0;
  height: 4px;
  background-color: #f1f1f1;
  -webkit-transition: width 0.3s ease;
  -moz-transition: width 0.3s ease;
  transition: width 0.3s ease;
}

.links li a:hover:after { width: 70%; }

.links li a:active { color: #dbdbdb; }

.pushmenu-left { left: -300px; }

.pushmenu-left.pushmenu-open { left: 0; }

.pushmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}

.pushmenu-push-toright { left: 300px; }

/*Transition*/

.pushmenu, .pushmenu-push {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#nav_list {
  background: url(icon_nav.png) no-repeat left top;
  cursor: pointer;
  height: 27px;
  width: 33px;
  text-indent: -99999em;
}

nav-list.active { background-position: -331px top; }

.buttonset {
  height: 16px;
  padding: 10px 20px 20px;
}

section.content {
  padding: 10px 20px;
}