@charset "utf-8";

/*ANIMATION*/
@keyframes hover {
0%{opacity:1;}
100%{opacity:0.5;}
}



/*MORE_BTN*/
.inviewfadeInBtn {
opacity:0;
transition:0.5s;
transition-delay:0.5s;
}

.fadeInBtn {
opacity:1;
}

.inviewfadeInBtnBg {
width:0;
height:0;
/*background:rgba(0,68,45,0.6);*/
background:rgba(0,68,45,0.8);
}

.fadeInBtnBg {
-webkit-animation:btn_open 0.5s ease forwards;
animation:btn_open 0.5s ease forwards;
}

@keyframes btn_open {
0%{width:0; height:0;}
50%{width:50px; height:50px; border-radius:10vw;}
100%{width:100%; height:50px; border-radius:10vw;}
}

@keyframes more_btn_hover {
0%{opacity:1;}
100%{opacity:0.5;}
}



/*COMPARISON*/
.inviewfadeInModel_65v {
}

.fadeInModel_65v {
-webkit-animation:model_65v 1.5s ease forwards;
animation:model_65v 1.5s ease forwards;
}

.inviewfadeInModel_75v {
opacity:0;
}

.fadeInModel_75v {
opacity:1;
-webkit-animation:model_75v 0.5s ease forwards;
animation:model_75v 0.5s ease forwards;
}

@keyframes model_65v {
0%{transform:translate(-100%,100%);}
100%{transform:translate(0,0);}
}

@keyframes model_75v {
0%{transform:translate(-100%,100%);}
100%{transform:translate(0,0);}
}

@keyframes model_85v {
0%{transform:translate(-100%,100%);}
100%{transform:translate(0,0);}
}

@keyframes model_95v {
0%{transform:translate(-100%,100%);}
100%{transform:translate(0,0);}
}



/*FADE IN LINE*/
.inviewfadeInLine.after {
}

.fadeInLine:after {
-webkit-animation:underline 1s ease forwards;
animation:underline 1s ease forwards;
}

@keyframes underline {
0%{width:1%;}
100%{width:100%;}
}

.underline:after {
content:"";
width:10%;
height:2px;
background:#00442d;
position:absolute;
left:0;
bottom:-5px;
margin:auto;
display:block
}



/*DESIGN*/
.inviewfadeInPhoto1 {
width:49%;
height:300px;
background:url(../images/comparison_about_photo2.jpg) center no-repeat;
background-size:120%;
transition:1.5s;
}

.fadeInPhoto1 {
width:49%;
height:300px;
background:url(../images/comparison_about_photo2.jpg) center no-repeat;
background-size:130%;
}

.inviewfadeInPhoto2 {
width:49%;
height:300px;
background:url(../images/comparison_about_photo3.jpg) center no-repeat;
background-size:120%;
transition:1.5s;
}

.fadeInPhoto2 {
width:49%;
height:300px;
background:url(../images/comparison_about_photo3.jpg) center no-repeat;
background-size:130%;
}



/*MOVIE*/
.inviewStartMovie {
    opacity:0;
    }
    
    .StartMovie {
    opacity:1;
    }


/*INVIEW*/
.inviewfadeInUp {
    opacity:0;
    transform:translate(0,30%);
    transition:0.7s ease;
    }
    
    .fadeInUp {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInRight {
    opacity:0;
    transform:translate(20%,0);
    transition:0.7s ease;
    }
    
    .fadeInRight {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInDown {
    opacity:0;
    transform:translate(0,-20%);
    transition:0.7s ease;
    }
    
    .fadeInDown {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInLeft {
    opacity:0;
    transform:translate(-20%,0);
    transition:0.7s ease;
    }
    
    .fadeInLeft {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeIn {
    opacity:0;
    transition:0.7s ease;
    }
    
    .fadeIn {
    opacity:1;
    }
    
    .inviewfadeInDownLeft {
    opacity:0;
    transform:translate(-20%,-20%);
    transition:0.7s ease;
    }
    
    .fadeInDownLeft {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInDownRight {
    opacity:0;
    transform:translate(20%,-20%);
    transition:0.7s ease;
    }
    
    .fadeInDownRight {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInUpLeft {
    opacity:0;
    transform:translate(-20%,20%);
    transition:0.7s ease;
    }
    
    .fadeInUpLeft {
    opacity:1;
    transform:translate(0, 0);
    }
    
    .inviewfadeInUpRight {
    opacity:0;
    transform:translate(20%,20%);
    transition:0.7s ease;
    }
    
    .fadeInUpRight {
    opacity:1;
    transform:translate(0, 0);
    }