/*@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:700);*/

html,
body{
    /*nav設定*/
    /*min-width: 1200px;*/
    /*width: 100vw;*/
    /*height: 100vh;*/
    /*overflow: hidden;*/
    /*overflow-x: hidden;*/
    /*margin: 0;*/
    font-family: "Microsoft YaHei","Microsoft JhengHei";
    /*font-family: Microsoft JhengHei;*/
    /*transition:width 2s;*/
    /*-moz-transition:width 2s; /* Firefox 4 */*/
    /*-webkit-transition:width 2s; /* Safari and Chrome */*/
    /*-o-transition:width 2s; /* Opera */*/
    /*transform:scale(1.2);*/
    /*transition: all 200ms ease-out;*/
}

body{
    /*overflow-y: hidden;*/
}

a{
    /*text-decoration:none;*/
}



#content1{
    height: 100vh;
    /*background: url('http://tutoriales.anaislab.com/img/background.jpg')no-repeat 0 0;*/
    /*background-image: url("images/A0.jpg");*/
    background-size: 100%;
    background-repeat: no-repeat;
    /*margin: 0;*/
    
    /*position: fixed;*/
    position: relative;
    z-index: -999;
    animation: fadein 4s;
    -moz-animation: fadein 4s; /* Firefox */
    -webkit-animation: fadein 4s; /* Safari and Chrome */
    -o-animation: fadein 4s; /* Opera */
    transform:scale(1.05);

}

@keyframes fadein {
    from {
        transform:scale(1);
        opacity:0.6;
    }
    to {
        transform:scale(1.05);
        opacity:1;
    }
}

#content2 {
    /*margin: 0;*/
    /*margin-top: 50px;*/
    /*padding-top: 80px;*/
    z-index: 100;
    height: 500px;
    background: #fff;
    position: relative;
    font-size: 40px;
    text-align: center;
    font-family: 'Josefin Sans', sans-serif;
}
#content2 .context2 {
    padding-top: 12%;
}

#content2 .welcometoRBT {
    padding-left: 2%;
    width: 100%;
    text-align: center;
    position: absolute;
    top: -10%;
    /*animation-iteration-count: 1;*/
    /*animation: rabbit 4s;*/
}

#content2 .welcometoRBT img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 50%;
}

p{
    color: #A4A4A4;
    font-size: 18px;
    font-family: Microsoft JhengHei;
    font-weight: bold;    
}

.context p {
    /*color: #A4A4A4;*/
    /*color: #000;*/
    /*font-size: 18px;*/
    /*font-family: Microsoft JhengHei;*/
    /*font-weight: bold; */
    margin: 0;
    padding: 2px;
}

.karl-hr {
    margin: 0;
    padding: 0;
}

.karl-hr2 {
    /*margin-top: 20px;*/

    margin: 20px 0;
    /*padding: 0;*/
}

#content3 {
    /*margin: 0;*/
    /*z-index: 100;*/
    /*height: 500px;*/
    /*background-image: url("images/A0.png");*/
    /*position: relative;*/
    /*font-size: 40px;*/
    /*text-align: center;*/
    padding-left: 10%;
    padding-right:10%;
    /*background-color: #f00;*/
}

.content3L {
    /*background-color: #0f0;*/
    /*margin: 0;*/
    z-index: 100;
    height: 500px;
    /*background-image: url("dist/image/A0.png");*/
    position: relative;
    font-size: 40px;
    text-align: center;
}

.content3L .menu {
    /*background-color: #00f;*/
    /*background-color: #FAFAFA;*/
    /*display: block;*/
    float: left;
    width: 40%;
    height: 100%;
    /*left: 0;*/
    
    position: relative;
}

.content3L .menu .context {
    width: 100%;
    padding-left: 35%;
    padding-top: 10px;
    text-align: left;
}

.content3L .menu .COW {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3L .menu .COW img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3L .menu .BEEF {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: right;
    position: absolute;
    /*top: -10%;*/

    /*top: 60%;*/
    bottom: 10%;
    /*left: 10%;*/
    right: 60%;
    /*left: 20PX;*/
    /*top: -10%;*/
    animation: shake 4s;
    animation-iteration-count:2;

}

.content3L .menu .BEEF:hover {
    animation: shake 4s;
    /*animation: rabbit 4s;*/
    animation-iteration-count:infinite;
}


@keyframes shake {
    0%, 100% {transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
    20%, 40%, 60%, 80% {transform: translateX(10px);}
}

.content3L .menu .BEEF img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3L .menu .foodword01 {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: right;
    /*text-align: center;*/
    position: absolute;
    top: -10%;
    /*padding: 0;*/
    /*top: 60%;*/
    /*bottom: 0;*/
    /*left: 10%;*/
    right: 25%;
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3L .menu .foodword01 img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 70%;
}

.content3L .Spoon {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: right;
    /*text-align: center;*/
    position: absolute;
    top: -70%;
    /*padding: 0;*/
    /*top: 60%;*/
    /*bottom: 0;*/
    /*left: 10%;*/
    right: 0;
    /*left: 20PX;*/
    /*top: -10%;*/
    animation: shakeTD 4s;
    animation-iteration-count:2;
}

.content3L .Spoon:hover {
    animation: shakeTD 4s;
    /*animation: rabbit 4s;*/
    animation-iteration-count:infinite;
}

@keyframes shakeTD {
    0%, 100% {transform: translateY(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateY(-10px);}
    20%, 40%, 60%, 80% {transform: translateY(10px);}
}

.content3L .Spoon img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3L .menuimage {
    /*display: block;*/
    float: right;
    width: 60%;
    height: 100%;
    /*left: 30%;*/
    position: relative;
    /*background-color: #f00;*/
    text-align: right;
    /*background-image: url("dist/image/A0.png");*/
    /*margin: 0 auto;*/
}

.content3L .menuimage img{
    /*width: 100%;*/
    /*margin: auto;*/
    /*padding-right: 10%;*/
    height: 100%;
}

.content3R {
    /*background-color: #0f0;*/
    /*margin: 0;*/
    z-index: 100;
    height: 500px;
    /*background-image: url("dist/image/A0.png");*/
    position: relative;
    font-size: 40px;
    text-align: center;
}

.content3R .menu {
    /*background-color: #00f;*/
    /*background-color: #FAFAFA;*/
    /*display: block;*/
    float: right;
    max-width: 40%;
    min-width: 40%;
    /*width: 40%;*/
    height: 100%;
    /*left: 0;*/
    
    position: relative;
}

.content3R .menu .context {
    width: 100%;
    padding-left: 35%;
    padding-top: 10px;
    text-align: left;
}

.content3R .menu .foodword02 {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: center;
    /*text-align: right;*/
    position: absolute;
    margin: 0 auto;
    /*background-color: #0f0;*/
    /*bottom: 0;*/
    right: 15%;
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3R .menu .foodword02 img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
    /*text-align: center;*/
}

.content3R .fruit {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    /*text-align: center;*/
    /*text-align: center;*/
    position: absolute;
    /*top: -70%;*/
    /*padding: 0;*/
    top: 0;
    /*bottom: 0;*/
    left: -35%;
    /*right: 0;*/
    /*left: 20PX;*/
    /*top: -10%;*/
    animation: fruit 4s;
    /*animation: rabbit 4s;*/
    animation-iteration-count:2;
}

.content3R .fruit:hover {
    animation: fruit 4s;
    /*animation: rabbit 4s;*/
    animation-iteration-count:infinite;
}

@keyframes fruit {
    0%, 100% {
        /*transform: translateY(0);*/
        
        transform-origin:center;
        transform:rotate(0deg);

    }
    10%, 30%, 50%, 70%, 90% {
        
        transform-origin:center;
        transform:rotate(10deg);
        /*transform: translateY(-10px);*/
    }
    20%, 40%, 60%, 80% {
        transform-origin:center;
        transform:rotate(-10deg);
        /*transform: translateY(10px);*/
    }
}



.content3R .fruit img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}


.content3R .menuimage {
    /*display: block;*/
    float: left;
    max-width: 60%;
    /*width: 60%;*/
    height: 100%;
    /*left: 30%;*/
    position: relative;
    text-align: left;
    /*background-color: #f00;*/
    /*background-image: url("dist/image/A0.png");*/
    /*margin: 0 auto;*/
}

.content3R .menuimage img{
    /*width: 100%;*/
    /*margin: auto;*/
    /*padding-right: 10%;*/
    height: 100%;
}

.content3L .menu .KIWI {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    text-align: right;
    position: absolute;
    /*top: -10%;*/

    /*top: 60%;*/
    bottom: -20%;
    /*left: 10%;*/
    right: 5%;
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3L .menu .KIWI img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 100%;
}

.content3L .fruit {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    /*text-align: center;*/
    /*text-align: center;*/
    position: absolute;
    /*top: -70%;*/
    /*padding: 0;*/
    top: -15%;
    /*bottom: 0;*/
    left: 35%;
    /*right: 0;*/
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3L .fruit img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3L .JUICE {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    /*text-align: center;*/
    /*text-align: center;*/
    position: absolute;
    /*top: -70%;*/
    /*padding: 0;*/
    top: 25%;
    /*bottom: 0;*/
    right: -15%;
    /*left: 35%;*/
    /*right: 0;*/
    /*left: 20PX;*/
    /*top: -10%;*/
    animation: shake 4s;
    animation-iteration-count:2;
}

.content3L .JUICE:hover {
    animation: shake 4s;
    /*animation: rabbit 4s;*/
    animation-iteration-count:infinite;
}

.content3L .JUICE img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 70%;
}

.content3M {
    padding: 100px 0 ;
    /*background-color: #0f0;*/
    /*margin: 0;*/
    /*z-index: 100;*/
    /*height: 500px;*/
    /*background-image: url("dist/image/A0.png");*/
    position: relative;
    /*font-size: 40px;*/
    text-align: center;
}

.content3M .karl-pic {
    display:inline;
    /*width: 300px;*/
    margin: 0 10px;
    /*max-width: 500px;*/
    /*height: 500px;*/
    /*background-color: #f00;*/
    
    /*height: 300px;*/
}

.content3M .karl-pic img{
    width: 300px;
    /*width: 100%;*/
    box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
    border: 2px solid #666;
}

.content3M .mashroom {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    /*text-align: center;*/
    /*text-align: center;*/
    position: absolute;
    /*top: -70%;*/
    /*padding: 0;*/
    /*top: -40%;*/
    bottom: -20%;
    /*left: 35%;*/
    right: 20%;
    /*left: 20PX;*/
    /*top: -10%;*/
}

.content3M .mashroom img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3M .VEG {
    /*padding-left: 2%;*/
    /*width: 100%;*/
    /*text-align: center;*/
    /*text-align: center;*/
    position: absolute;
    /*top: -70%;*/
    /*padding: 0;*/
    /*top: -50%;*/
    bottom: -40%;
    right: 0;
    /*left: 35%;*/
    /*right: 0;*/
    /*left: 20PX;*/
    /*top: -10%;*/
    z-index: 99;
}

.content3M .VEG img {
    /*position: absolute;*/
    /*top: 20%;*/
    width: 80%;
}

.content3buttom {
    padding: 100px 0 ;
    /*background-color: #0f0;*/
    /*margin: 0;*/
    /*z-index: 100;*/
    /*height: 500px;*/
    /*background-image: url("dist/image/A0.png");*/
    /*position: relative;*/
    /*font-size: 40px;*/
    text-align: center;
}

.content3buttom div img{
    /*box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);*/
    /*border: 2px solid #666;*/
    /*padding: 0;*/
    /*margin: 0;*/
}

.content3buttom .restaurant01 {
    background: url('../../images/restaurant01.png');
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center;
}
.content3buttom .restaurant01:hover {
    opacity: 0.8;
}
.content3buttom .joinus01 {
    background: url('../../images/joinus01.png');
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center;
}
.content3buttom .joinus01:hover {
    opacity: 0.8;
}
.content3buttom .ourstore01 {
    background: url('../../images/ourstore01.png');
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center;
}
.content3buttom .ourstore01:hover {
    opacity: 0.8;
}

.content3buttom div {
    width: 100%;
    height: 400px;
    
    
}
.content3buttom div div{
    /*margin: auto 0;*/
    height: 50px;
    padding-top: 120px;
    /*padding: 120px 0 0 0;*/
    font-size: 40px;
    color: #fff;
    /*vertical-align: middle;*/
    /*background-color: #f00;*/
    /*vertical-align: middle;*/
    /*background-color: #f00;*/
}

.content3buttom div p{
    padding-top: 10px;
    font-size: 20px;
    color: #fff;
}


.footer {
    background-color: #7C9E40;
    padding: 50px 0;
    /*margin: 0;*/
    /*margin-top: 50px;*/
    /*padding-top: 80px;*/
    /*z-index: 100;*/
    /*height: 100px;*/
    /*background: #fff;*/
    /*position: relative;*/
    /*font-size: 40px;*/
    color: #fafafa;
    text-align: center;
    font-family: 'Josefin Sans', sans-serif;
}


/*#content:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #61b2d8;
    background: -moz-linear-gradient(-45deg, #61b2d8 0%, #f9a4f2 100%);
    background: -webkit-linear-gradient(-45deg, #61b2d8 0%, #f9a4f2 100%);
    background: linear-gradient(135deg, #61b2d8 0%, #f9a4f2 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#61b2d8', endColorstr='#f9a4f2', GradientType=1);
    opacity: 0;
    z-index: 100;
}*/
/*#content2 h1 {
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
    font-size: 80px;
    line-height: 120px;
    top: 32%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    z-index: 99;
    width: 100%;
    text-align: center;
    font-family: 'Josefin Sans', sans-serif;
    border: 12px solid #fff;
    mix-blend-mode: overlay;
    width: 80%;
}*/

#rabbitL {
    z-index: 999;
    /*position: fixed;*/
    position: absolute;
    margin-top: -130px;
    margin-left: 75%;
    width: 200px;
    height: 200px;
    /*background: #f00;*/
    
    opacity: 1;
    background: url("images/rabbitL.png");
    background-size: contain;


    /*/background-color: #f00;*/
    /*/z-index: 1;*/
    /*/transform:rabbit 2s;*/
    animation-iteration-count: 1;
    animation: rabbit 4s;
    -moz-animation: rabbit 4s; /* Firefox */
    -webkit-animation: rabbit 4s; /* Safari and Chrome */
    -o-animation: rabbit 4s; /* Opera */
    /*/animation-delay: 3s;*/
}



#rabbitR {
    z-index: 999;
    /*position: fixed;*/
    position: absolute;
    margin-top: -130px;
    margin-left: 25%;
    width: 200px;
    height: 200px;
    /*background: #f00;*/
    
    opacity: 1;
    background: url("images/rabbitR.png");
    background-size: contain;
  

    /*background-color: #f00;*/
    /*z-index: 1;*/
    /*transform:rabbit 2s;*/
    animation-iteration-count: 1;
    animation: rabbit 4s;
    -moz-animation: rabbit 4s; /* Firefox */
    -webkit-animation: rabbit 4s; /* Safari and Chrome */
    -o-animation: rabbit 4s; /* Opera */
    /*animation-delay: 3s;*/
}

@keyframes rabbit {
    0% {
        /*transform:scale(1);*/
        
        opacity:0;
    }
    80% {
        opacity: 0;
    }
    90% {
        margin-top: 0px;
        /*transform:scale(1.05);*/
        opacity:1;
        /*transform-origin:right bottom;*/
        /*transform:rotate(-8deg);*/
    }
    92% {
        /*transform:scale(1.05);*/
        opacity:1;
        transform-origin:right bottom;
        transform:rotate(-8deg);
    }
    100% {
        margin-top: -130px;
        /*transform:scale(1.05);*/
        opacity:1;
        transform-origin:right bottom;
        transform:rotate(8deg);
    }
}


nav {
    /*min-width: 1400px;*/
    /*position: fixed;*/
    /*width: 100%;*/
    /*margin-top: 0px;*/
    /*padding: 35px 0;*/
    /*text-align: center;*/
    /*font-family: Raleway;*/
    
    /*z-index: 999;*/
}
.nav-1 {
  /*background: #3fa46a;*/
  /*background: rgba(63,164,106,0.5);*/
  /*box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);*/
  /*z-index: 9999;*/
}
.nav-2 {
  /*background: #3fa46a;*/
  /*background: rgba(255,255,255,1);*/
  /*box-shadow: 2px 2px 8px rgba(128, 163, 63, 0.5);*/
  /*z-index: 9999;*/
}

.logo {
    /*position: relative;*/
    /*position: absolute;*/
    /*margin: 0px;*/
    /*padding: -35px;*/
    /*margin: -35px 0;*/
    /*margin-top: -35px;*/
    /*margin-left: -55px;*/
    /*margin: -24px;*/
    /*height: 80px;*/
}

.link {
    /*transition: 0.4s;*/
    /*font-size: 18px;*/
    /*text-decoration: none;*/
    /*font-family: arial;*/
    /*font-family: Microsoft JhengHei;*/
    /*font-weight: bold;*/
    /*background: url(/path/to/logo.png) */
    /*padding: 0 20px;*/
    /*margin: 0 10px;*/
}
.linkcolor-1{
    /*color: #ffffff;*/
}

.linkcolor-2{
    /*color: #80A33F;*/
}

#link-1{
    /*margin-left: 50px;*/
}
#link-2:hover {

  /*background: url("images/M0.png") no-repeat center center ;*/
  /*height: 40px;*/

  /*background-color: #ffffff;*/
  /*opacity: 0;*/
  /*color: rgba(63,164,106,0);*/
  /*color: #3fa46a;*/
  /*padding: 24px 50px;*/

  /*background-size: 210px 70px;*/
  /*background-size: contain;*/
}







/*Mountains*/

/*.layer.mountain {
    width: 100%;
    height: 100%;
    background-size: cover!important;
    position: absolute;
    left: 0;
    top: 0;
}*/
/*.layer.mountain.one {
    background: url('http://tutoriales.anaislab.com/img/layer1.png')no-repeat left bottom;
    z-index: 10;
}
.layer.mountain.two {
    background: url('http://tutoriales.anaislab.com/img/layer3.png')no-repeat 0 0;
    z-index: 8;
}
.layer.mountain.three {
    background: url('http://tutoriales.anaislab.com/img/layer4.png')no-repeat 0 0;
    z-index: 6;
}*/
/*Cloud*/

.layer.cloud img,.layer.text img {
    position: absolute;
    opacity: 0;

    /*right: 0;*/
    /*animation-name: cloud;*/
    /*animation-iteration-count: infinite;*/
}


.layer.cloud.one img {
    /*往左跑*/
    /*bottom: 0;*/
    top:-30%;
    z-index: 9;
    /*background: url("t01.png") no-repeat center 80px ;*/
  
    /*background-image: url("t01.png");*/
    /*background-size: auto;*/
    width: 150%;
    height: 150%;
    /*animation-name: cloud1;*/
    /*animation-iteration-count: 1;*/
    /*animation-duration: 6s;*/
    /*animation-fill-mode: forwards;*/
    /*animation-timing-function: ease-out;*/
}


.layer.cloud.two img {
    /*往右跑*/
    /*bottom: 120px;*/
    top:-20%;
    /*bottom: 0;*/
    z-index: 7;
    width: 150%;
    height: 150%;
    /*background: url("t02.png") no-repeat center 80px ;*/
    /*animation-name: cloud2;*/
    /*animation-iteration-count: 1;*/
    /*animation-duration: 2s;*/
    /*animation-timing-function: ease-in;*/
}

@media screen and (min-width: 960px) {
    .layer.cloud img,.layer.text img {
         animation-iteration-count: infinite;
    }
    .layer.cloud.one img {
        animation-name: cloud1;
        animation-iteration-count: 1;
        animation-duration: 6s;
        /*animation-fill-mode: forwards;*/
        animation-timing-function: ease-out;
    }
    .layer.cloud.two img {
        /*往右跑*/
        /*bottom: 120px;*/
        /*background: url("t02.png") no-repeat center 80px ;*/
        animation-name: cloud2;
        animation-iteration-count: 1;
        animation-duration: 2s;
        animation-timing-function: ease-in;
    }
}
/*.layer.cloud.three img {
    z-index: 5;
    bottom: 40%;
    bottom: 300px;
    animation-iteration-count: 1;
    animation-duration: 2s;
    animation-timing-function: ease-out;
}*/
@keyframes cloud1 {
    0%,0.5% {
        opacity: 1;
        /*right: 10%;*/
        transform: translateY(0px);
        /*bottom: 0%;*/
    }
    100% {
        /*right: 150%;*/
        /*bottom: :100%;*/
        transform: translateY(-1000px);
        opacity:0.6; 
    }
}
@keyframes cloud2 {
    from {
        opacity: 1;
        left: 10%;
    }
    to {
        left: 150%;
        opacity:0.6; 
    }
}

.layer.text.one{
    width: 100%;
    height: 10px;

    /*text-align: center;*/
    /*background: #f00;*/
}


.layer.text.one img {
    /*position: absolute;*/
    /*margin: auto;*/
    /*text-align: center;*/
    left: 6%;
    top: 9%;
    /*background: #0f0;*/
    /*bottom: 50%;*/
    /*right: 55%;*/
    z-index: 9;
    width: 90%;
    /*width: 300px;*/
    /*height: 50%;*/
    opacity: 1;
    /*background: url("t01.png") no-repeat center 80px ;*/
  
    /*background-image: url("t01.png");*/
    /*background-size: auto;*/

    /*jump  */
    /*-webkit-animation: jump 1.5s ease 0s infinite normal ;*/
    animation: jump 1.5s ease 0.7s infinite normal ;
    /*jump end*/

    /*animation-name: textup;*/
    animation-iteration-count: 1;
    /*animation-duration: 8s;*/
    /*/animation-fill-mode: forwards;*/
    /*animation-timing-function: ease-out;*/
}

@media screen and (max-width: 1280px) {
    .layer.text.one img {
        left: 0;
        top:0;
        width: 100%
    }
}

@media screen and (max-width: 480px) {
    .layer.text.one img {
        left: 0;
        top:0;
        width: 100%
    }
}
.layer.text.two img {
    bottom: 23%;
    left: 55%;
    z-index: 9;
    width: 300px;
    /*height: 50%;*/
    opacity: 1;
    /*background: url("t01.png") no-repeat center 80px ;*/
  
    /*background-image: url("t01.png");*/
    /*background-size: auto;*/

    /*jump  */
    /*-webkit-animation: jump 1.5s ease 0s infinite normal ;*/
    animation: jump 1.5s ease 0s infinite normal ;
    /*jump end*/

    /*animation-name: textdown;*/
    animation-iteration-count: 1;
    /*animation-duration: 8s;*/
    /*/animation-fill-mode: forwards;*/
    /*animation-timing-function: ease-out;*/
}

@keyframes textup {
    0% {
        opacity: 1;
        right: 45%;
        /*bottom: 100px;*/
    }
    15%{
        opacity: 1;
    }
    25% {
        opacity: 1;
        right: 45%;
    }
    75% {
        /*right: 100%;*/
        opacity:0; 
    }
    100% {
        right: 100%;
        opacity:0; 
    }
}
@keyframes textdown {
    0% {
        opacity: 1;
        left: 45%;
        /*bottom: 100px;*/
    }
    15%{
        opacity: 1;
    }
    25% {
        opacity: 1;
        left: 45%;
    }
    75% {
        /*right: 100%;*/
        opacity:0; 
    }
    100% {
        left: 100%;
        opacity:0; 
    }
}

@-webkit-keyframes jump {
  0%{
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  20%{
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40%{
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  50%{
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  60%{
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
  80%{
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100%{
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes jump {
  0%{
    transform: translateY(0);
  }
  20%{
    transform: translateY(0);
  }
  40%{
    transform: translateY(-30px);
  }
  50%{
    transform: translateY(0);
  }
  60%{
    transform: translateY(-15px);
  }
  80%{
    transform: translateY(0);
  }
  100%{
    transform: translateY(0);
  }
}