html, body {height: 100%;}

html {display: table;
    margin: auto;}

body {display: table-cell;
     vertical-align: middle;}

body{background-image: url(images/caketi.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-size: cover;}

@font-face{src: url(fonts/GreatVibes-Regular.ttf);
    font-family: GV;}

@font-face{src: url(fonts/Stalemate-Regular.ttf);
    font-family: stale}

@font-face{src: url(fonts/FjordOne-Regular.ttf);
    font-family: fo}

.rfb{background-color:#c45e62;
        border-radius: 25px;
        border: 1px solid #c45e62;
        height: 20%;
        width: 50%;
        padding: 5px;
        text-align: center;
        position: absolute;
        left: 300px;
        top: 50px;
        z-index: 1;
        font-family: 'GV'; color: #ff9598;
        font-size: 30px;
        vertical-align: middle;
        line-height: 35px;}

.navi{background-color:#f9f8f8;
        border-radius: 25px;
        border: 1px solid #f9f8f8;
        height: 10%;
        width: 20%;
        text-align: center;
        position: absolute;
        left: 25px;
        top: 190px;
        z-index: 1;
        font-family: 'fo'; color: #ff9598;
        font-size: 20px;
        text-align: center;
        vertical-align: middle;
        line-height: 10px;}

.nav{background-color:#2b1a25;
        border-radius: 25px;
        border: 1px solid #2b1a25;
        height: 25%;
        width: 20%;
        text-align: center;
        position: absolute;
        left: 25px;
        top: 260px;
        z-index: 1;
        font-family: 'fo';
        font-size: 15px;
        text-align: left;
        vertical-align: middle;
        line-height: 22px;}

a:link{color:#f9f8f8};
a:hover{color:#ff9598;}
a:visited{color:#ff9598;}

.stamps{background-color:#c45e62;
        border-radius: 25px;
        border: 1px solid #c45e62;
        height: 52%;
        width: 20%;
        text-align: center;
        position: absolute;
        left: 1000px;
        top: 150px;
        z-index: 1;
        font-family: 'fo'; color: #f9f8f8;
        font-size: 20px;
        text-align: center;
        vertical-align: middle;
        line-height: 20px;}

#saku{float: left;
      margin-right: 15px;
      position: absolute;
      left: 160px;
      top: 195px;
      z-index: 2;}

#saaa{float: left;
    margin-right: 15px;}

.intro{background-color:#f9f8f8;
        border-radius: 25px;
        border: 1px solid #f9f8f8;
        padding: 15px;
        height: 42%;
        width: 42%;
        text-align: justify;
        position: absolute;
        left: 410px;
        top: 190px;
        z-index: 1;
        font-family: 'fo'; color: #2b1a25;
        font-size: 15px;
        vertical-align: middle;
        line-height: 20px;}

.about{background-color:#2b1a25;
        border-radius: 25px;
        border: 1px solid #2b1a25;
        height: 10%;
        width: 30%;
        text-align: center;
        position: absolute;
        left: 850px;
        top: 460px;
        z-index: 1;
        font-family: 'fo'; color: #ff9598;
        font-size: 20px;
        text-align: center;
        vertical-align: middle;
        line-height: 10px;}

.me{background-color:#c45e62;
        border-radius: 25px;
        border: 1px solid #c45e62;
        padding: 15px;
        height: 52%;
        width: 27.5%;
        text-align: center;
        position: absolute;
        left: 850px;
        top: 530px;
        z-index: 1;
        font-family: 'fo'; color: #f9f8f8;
        font-size: 15px;
        text-align: center;
        vertical-align: middle;
        line-height: 20px;}

.me2{background-color:#c45e62;
        border-radius: 25px;
        border: 1px solid #c45e62;
        padding: 0px;
        height: 23%;
        width: 20%;
        text-align: center;
        position: absolute;
        left: 950px;
        top: 697px;
        z-index: 1;
        font-family: 'fo'; color: #f9f8f8;
        font-size: 15px;
        text-align: center;
        vertical-align: middle;
        line-height: 20px;}

.duo{background-color:#f9f8f8;
        border-radius: 25px;
        border: 1px solid #f9f8f8;
        padding: 15px;
        height: 80%;
        width: 58%;
        text-align: justify;
        position: absolute;
        left: 60px;
        top: 440px;
        z-index: 1;
        font-family: 'fo'; color: #2b1a25;
        font-size: 15px;
        text-align: left center;
        vertical-align: middle;
        line-height: 20px;}

#roll{float: right;
      margin-right: 15px;
      position: absolute;
      left: 670px;
      top: 650px;
      z-index: 2;}

.imgcolor{filter:hue-rotate(120deg)}

#q{float: right;
      margin-right: 15px;
      position: absolute;
      left: 1070px;
      top: 865px;
      z-index: 2;}

#ao3{float: right;
      margin-right: 15px;
      position: absolute;
      left: 1120px;
      top: 865px;
      z-index: 2;}

#tum{float: right;
      margin-right: 15px;
      position: absolute;
      left: 1190px;
      top: 865px;
      z-index: 2;}

#divide{float: right;
        margin-right: 15px;
        position: absolute;
        left: 5px;
        top: -50px;
        z-index: 2;}

#flow{float: right;
      margin-right: 15px;
      position: absolute;
      left: 947.5px;
      top: -20px;
      z-index: 2;}

#tea{float: right;
     margin-right: 15px;
     position: absolute;
     left: 250px;
     top: 50px;
     z-index: 2;}

#cat{float: right;
     margin-right: 15px;
     position: absolute;
     left: -35px;
     top: 600px;
     z-index: 2;
     transform: scaleX(-1);}

#field{float: right;
      margin-right: 15px;
      position: absolute;
      left: 0px;
      top: 890px;
      z-index: 2;}