html, body{
    height: 100%;
    width: 100%;
}
body{
    background-color: #fbe055;
    margin: 0px;
    font-family: Arial;
    font-size: 100%;
    color: #000000;
}
#main{
    margin: 0 auto;
    width: 100%;
    max-width: 1100px;
    height: 100%;
    max-height: 600px;
    background-color: #fbe055;
    display: block;
    position: relative;
    border: 10px solid #804f28;
    border-radius: 10px;
}
#content{
    width: 100%;
    height: 100%;
    display: block;
    /*background-color: rgba(255, 0, 0, 0.3);*/
}
.page{
    display: none;
}
.pageContent{
    margin: 0px;
    width: 100%;
    height: 600px;
    display: block;
    oveflow: hidden;
}
.pageContent *:first-child{
    margin-top: 0px !important;
}
.button{
    cursor: pointer;
    -moz-user-select:none;
    -webkit-user-select:none;
}
.button:hover{
    -webkit-filter: saturate(2);
    -webkit-filter: brightness(1.1);
    filter: brightness(1.1);
    filter: saturate(220%);
}
.button:active{
    -webkit-filter: saturate(3);
    filter: saturate(330%);
}
.center{
    margin: 0 auto;
}

h2{
    text-align: center;
    padding-top: 20px;
}
h3{
    text-align: center;
    font-size: 18px;
    padding-left: 20px;
    padding-right: 20px;
}
.carusel{
    margin: 0 auto;
    width: 600px;
    height: 120px;
    display: block;
    overflow: hidden;
    position: relative;
}
.navi{
    width: 38px;
    height: 38px;
    background-color: #D0D0D0;
    display: block;
    cursor: pointer;
}
.yellowbtn {
    -moz-box-shadow:inset 0px 1px 0px 0px #f9eca0;
    -webkit-box-shadow:inset 0px 1px 0px 0px #f9eca0;
    box-shadow:inset 0px 1px 0px 0px #f9eca0;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffda33), color-stop(1, #ebe007) );
    background:-moz-linear-gradient( center top, #ffda33 5%, #ebe007 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffda33', endColorstr='#ebe007');
    background-color:#ffda33;
    -webkit-border-top-left-radius:6px;
    -moz-border-radius-topleft:6px;
    border-top-left-radius:6px;
    -webkit-border-top-right-radius:6px;
    -moz-border-radius-topright:6px;
    border-top-right-radius:6px;
    -webkit-border-bottom-right-radius:6px;
    -moz-border-radius-bottomright:6px;
    border-bottom-right-radius:6px;
    -webkit-border-bottom-left-radius:6px;
    -moz-border-radius-bottomleft:6px;
    border-bottom-left-radius:6px;
    text-indent:0;
    border:3px solid #000000;
    display:inline-block;
    color:#000000;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    font-style:normal;
    height:30px;
    line-height:30px;
    width:100px;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #ded17c;
    letter-spacing: -1px;
}
.yellowbtn:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f2ab1e), color-stop(1, #f0c911) );
    background:-moz-linear-gradient( center top, #f2ab1e 5%, #f0c911 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2ab1e', endColorstr='#f0c911');
    background-color:#f2ab1e;
}.yellowbtn:active {
     position:relative;
     top:1px;
 }