@import url('https://fonts.googleapis.com/css2?family=Baloo+Tammudu+2:wght@500;600;700;800&display=swap');
@font-face {font-family: 'Amalfi Coast';font-style: normal;font-weight: 400;src: local('Amalfi Coast'), url('../font/Amalfi Coast.woff') format('woff');}
/*general*/
*,*:focus{outline:none !important;box-shadow:none !important;}
.mh-fs{min-height:100vh;}
.mw-fitcontent{max-width:fit-content;}
.top0{top:0;}
.h-fitcontent{height:fit-content;}
body{font-family: 'Baloo Tammudu 2', sans-serif;font-weight:700;}
.handwriting{font-family: 'Amalfi Coast',serif;}
.no-event{user-select:none !important;pointer-events:none !important;}
/*bootstrap*/
.no-gutters { margin-right: 0; margin-left: 0; }
.no-gutters>.col,
.no-gutters>[class*=col-] { padding-right: 0; padding-left: 0; }
.btn { border-radius: 10px; font-weight: 900; line-height: 1; padding: 20px 20px 10px; }
.btn.btn-choice { background: #222; color: #fff; }
.btn.btn-choice.active,
.btn.btn-choice:hover { background: #469d06; color: #fff; }
.btn.btn-choice > span { margin: -8px 6px 0 0; line-height: 0; display: inline-block; font-size: 15px; }
.btn.btn-cta { padding: 0; color:#222; font-size: 20px; margin: 0 7px; line-height: 0; width: 50px; height: 50px; display: inline-flex; align-items: center; justify-content: center; background: #fff; box-shadow: 0 3px 20px rgba(0,0,0,0.2) !important; }
.btn.btn-cta.hide { opacity:0 !important; user-select:none !important; pointer-events:none !important; display:inline-flex !important; }
.custom-radio .custom-control-input:checked~.custom-control-label::before { background-color: #222; }
.custom-control-input:focus~.custom-control-label::before { box-shadow:none; }
.modal-backdrop { background: #fff; }
/*section*/
.section { height: 100vh; display: flex; align-items: center; }
/*home*/
#home { background-image: url(/site/theme/assets/img/bg-home-tiny.jpg); background-repeat: no-repeat; background-size: cover; background-position: right bottom; overflow-x:hidden; }
#home:before{content:"";position:absolute;top:0;right:0;width:100%;height:100vh;user-select:none;pointer-events:none;background: -moz-linear-gradient(left,  rgba(0,0,0,0) 26%, rgba(0,0,0,0.8) 88%);background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 26%,rgba(0,0,0,0.8) 88%);background: linear-gradient(to right,  rgba(0,0,0,0) 26%,rgba(0,0,0,0.8) 88%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#99292826',GradientType=1 );-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#home h1.title { font-family: 'Baloo Tammudu 2'; font-weight: 900; color: #fff; font-size: 30px; letter-spacing: 4px; margin: 0; user-select:none; pointer-events:none;-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0.3s;animation-delay:0.3s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#home h1.title .handwriting { letter-spacing: 0; font-size: 120px; font-weight: 400; display: block; margin: 0 0 -5px -90px; color:#fff;}
#home .content-button-wrapper{-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0.3s;animation-delay:0.3s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#home .content-button-wrapper .btn{font-size:12px; margin:15px 0 -15px;}
#home .description { font-size: 12px; font-weight: 900; color: #fff; user-select:none; pointer-events:none;-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0.6s;animation-delay:0.6s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#home .description .line { border-bottom: 1px solid; margin: 0 -15px 7px -15px; }
#home .finder-list { margin:0 -15px 0 0; padding:30px 0 60px; -webkit-animation-name:fadeInRight;animation-name:fadeInRight;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#home .finder-list .swiper-slide{width:240px;}
#home .finder-list .finder-item { display: block; margin:15px 30px 0 0;  transition:.3s ease;-moz-transition:.3s ease;-webkit-transition:.3s ease;}
#home .finder-list .finder-item:hover { margin-top:0; margin-bottom:15px; transition:.3s ease;-moz-transition:.3s ease;-webkit-transition:.3s ease;}
#home .finder-list .finder-item a { display: block; border-radius: 10px; overflow: hidden; height: 325px; width: 210px; background: #fff; position:relative; }
#home .finder-list .finder-item a .title { position: absolute; bottom: 0; background: #fff; width: 100%; padding: 20px 15px 12px; color: #222222; line-height: 1.1; font-size:16px; }
#home .finder-list .finder-item a img { width: 100%; height: 100%; object-fit: cover; }
#contentModal .modal-body > p:last-child{margin-bottom:0;}
#contentModal .modal-body a{color:#222;}
/*question*/
#question { background-image: url(/site/theme/assets/img/bg-question-tiny.jpg); background-repeat: no-repeat; background-size: cover; background-position: top center; overflow-x:hidden; }
#question:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; background: url(/site/theme/assets/img/pattern-question.png) repeat-x center bottom;background-size: contain; height: 100vh; z-index: 0; -webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#question #question-wrapper{display: flex; flex-direction: column; justify-content: space-between; align-items: center;min-height:100vh; text-align: center;position:relative;z-index:2;}
#question #question-wrapper .top { width: calc(100% + 30px); margin: 0; }
#question #question-wrapper .top .percent { height: 8px; width: 100%; background: rgba(34,34,34,0.8); display: block; }
#question #question-wrapper .top .percent span{ height: 100%; width: 20%; background: #439208; display: block; }
#question #question-wrapper .bottom { width: 100%; padding:30px 20px; -webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#question #question-wrapper .bottom .finder-title { line-height: 1; padding-top: 5px; font-size: 11px; font-weight: 900; letter-spacing: 1px; opacity: 0.8; user-select:none; pointer-events:none; text-align:center;}
#question #question-wrapper .middle { padding-top: 150px; }
#question #question-wrapper .middle .title { font-size: 35px; font-weight: 900; margin: 0 0 30px; color: #fff !important; background: #222; display: inline-block; border-radius: 10px; padding: 25px 25px 0; user-select:none; pointer-events:none; -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#question #question-wrapper .middle .title .title-description { font-size: 13px; line-height: 14px; margin: 0 auto 10px; max-width: fit-content; text-align:center; }
#question #question-wrapper .middle .choices { -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#question #question-wrapper .middle .choices .btn-choice { margin: 0 3px 15px; display: inline-flex;align-items: center;position: relative;flex-direction: column;}
#question #question-wrapper .middle .choices .btn-choice .choice-product-count { font-size: 10px; letter-spacing: 1px; opacity: 0.8; }
#question #question-wrapper .middle .choices .btn.btn-choice.active > span { margin: 0; line-height: 0; display: flex; font-size: 15px; position: absolute; top: 0; left: 0; align-items: center; justify-content: center; width: 100%; height: 100%; }
#question #question-wrapper .middle .choices .btn-choice .choice-image { display: block; margin: -10px 0 20px; border-radius: 10px 10px 0 0; overflow: hidden; }
#question #question-wrapper .middle .choices .btn-choice .choice-image img { height: 70px; width: 100%; display: block; max-width: none; object-fit: scale-down; margin: 0; }
#question #question-wrapper .middle .choices .btn-choice.active > div { opacity: 0.3; }
#question #question-wrapper .middle .choices .btn-choice.active:before { content: "\f00c"; position: absolute; left: 0; top: 0; font-family: 'FontAwesome'; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 20px; }
#question.multiplechoice-question #question-wrapper .middle .choices .btn-choice.active > div { opacity:1; }
#question #question-wrapper .middle #next-button-wrapper { height: 50px; margin: 15px 0 0 0;}
#question #question-wrapper .middle #next-button-wrapper #next-button-visibility { -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#question #question-wrapper .middle #next-button-wrapper .btn-next {display: inline-flex;align-items: center;}
#question #question-wrapper .middle #next-button-wrapper .btn-next span { line-height: 1.2; margin-right: 5px; }
#question #question-wrapper .middle #next-button-wrapper button { margin: 5px; }
#question #question-wrapper .middle #next-button-wrapper button i { margin: -8px 10px 0 0; }
/*result*/
#result { background-image: url(/site/theme/assets/img/bg-question-tiny.jpg); background-repeat: no-repeat; background-size: cover; background-position: top center; overflow-x:hidden; }
#result:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; background: url(/site/theme/assets/img/pattern-result.png) repeat-x center bottom;background-size: contain; height: 100vh; z-index: 0; -webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#result #result-wrapper{display: flex; flex-direction: column; justify-content: space-between; align-items: center;min-height:100vh; text-align: center;position:relative;z-index:2;}
#result #result-wrapper .top { width: calc(100% + 30px); margin: 0; }
#result #result-wrapper .top .percent { height: 8px; width: 100%; background: rgba(34,34,34,0.8); display: block; }
#result #result-wrapper .top .percent span{ height: 100%; width: 100%; background: #439208; display: block; }
#result #result-wrapper .bottom { width: 100%; padding:30px 20px; -webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#result #result-wrapper .bottom .finder-title { line-height: 1; padding-top: 5px; font-size: 11px; font-weight: 900; letter-spacing: 1px; opacity: 0.8; user-select:none; pointer-events:none; }
#result #result-wrapper .bottom #again { width: auto; align-items: center; justify-content: center; padding: 0 15px; }
#result #result-wrapper .bottom #again span { font-size: 15px; padding: 7px 0 0 7px; }
#result #result-wrapper .bottom #again i { transform: rotateY(180deg); }
#result #result-wrapper .middle { padding-top: 150px; width:100%;}
#result #result-wrapper .middle > .title { font-size: 35px; font-weight: 900; margin: 0 0 30px;  user-select:none; pointer-events:none; -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#result #result-wrapper .middle .product-filter {-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:.6s;animation-delay:.6s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#result #result-wrapper .middle .product-list { width:calc(100% + 30px); margin-left:-15px; -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both; }
#result #result-wrapper .middle .product-list .product-item { cursor:pointer; width: 200px; height: 200px; padding-top: 50px; background: #fff; border-radius: 10px; box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important; display: block; margin:80px 15px 30px; transition:.3s ease;-moz-transition:.3s ease;-webkit-transition:.3s ease;}
#result #result-wrapper .middle .product-list .product-item:hover { margin-top:70px; margin-bottom:40px; transition:.3s ease;-moz-transition:.3s ease;-webkit-transition:.3s ease;box-shadow: 0 15px 20px rgba(0,0,0,0.2) !important;}
#result #result-wrapper .middle .product-list .product-item .img { width: 100%; height: 165px; overflow: hidden; display: block; margin: -110px 0 20px 0; text-align: center; }
#result #result-wrapper .middle .product-list .product-item .img img { width: 100%; height: 100%; object-fit: contain; }
#result #result-wrapper .middle .product-list .product-item .info { text-align:left; padding: 0 30px;}
#result #result-wrapper .middle .product-list .product-item .info .brand { font-size: 11px; opacity: 0.8; color: #222; margin:0 0 5px;}
#result #result-wrapper .middle .product-list .product-item .info .brand img { height: 10px; }
#result #result-wrapper .middle .product-list .product-item .info .title { font-size: 16px; color: #222; line-height: 1;height: 49px; overflow: hidden; padding-top: 5px; margin: -5px 0 0 0;}
#result #result-wrapper .middle .product-list .product-item .button { text-align:center; margin: 5px 0 0;}
#result #result-wrapper .middle .product-list .product-item .button .btn { padding: 20px 13px 10px; line-height: 0; font-size: 13px; display:none; margin: auto;}
#result #result-wrapper .middle .product-list .swiper-slide {width: 230px; display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
#result #result-wrapper .middle .product-list .swiper-slide-collapse { display: none !important; }
#result #resultDetails {-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:1.3s;animation-delay:1.3s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#result #resultDetails #resultDetailsTitle { cursor: pointer; font-size: 13px; letter-spacing: 2px; }
#result #resultDetails #resultDetailsContent { text-align: left; height: 15vh; overflow-y: auto; width: 100%; overflow-x: hidden; }
#result #resultDetails #resultDetailsContent #steps ul { list-style: none; }
#result #resultDetails #resultDetailsContent #steps ul > li { position: relative; border-left: 3px solid #222; padding: 0 0 0 10px; }
#result #resultDetails #resultDetailsContent #steps ul > li:before { content: ""; width: 10px; height: 10px; display: block; position: absolute; background: #dc3545; border-radius: 100%; left: -7px; top: 0; }
#result #resultDetails #resultDetailsContent #steps ul > li:first-child { padding-top: 15px; }
#result #resultDetails #resultDetailsContent #steps ul > li:first-child:before { top: 15px; }
#result #resultDetails #resultDetailsContent #steps ul > li .question { font-size: 14px; }
#result #resultDetails #resultDetailsContent #steps ul > li .answers { font-size: 11px; padding: 0 0 10px; margin: -2px 0 0 0; }
#result #resultDetails #resultDetailsContent #steps ul > li:last-child .answers { padding: 0 0 5px; }
#result #resultDetails #resultDetailsContent table { font-size: 12px; }
#result #resultDetails #resultDetailsContent table td { padding: 7px; vertical-align: middle; }
#result #resultWhatsappButton { margin: 30px auto; -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:1.3s;animation-delay:1.3s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#result #resultWhatsappButton a { display: inline-block; background: #4dc247; color: #fff; border-radius: 7px; padding: 10px 20px 5px; line-height: 1; font-size: 16px; text-decoration: none; }
#result #resultWhatsappButton a i { font-size: 22px; vertical-align: middle; margin: 0 3px 3px 0; }
#result #resultShare { margin: 30px auto; -webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:1.5s;animation-delay:1.5s;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#result .swiper-button-next,
#result .swiper-button-prev {filter: grayscale(1);transform: scale(0.5);padding: 70px;top: calc(50% - 40px);margin: 0 -30px;}
#result .swiper-button-disabled { opacity:0; }
/*product-detail*/
#product-detail .modal-header {border:none;}
#product-detail .brand { font-size: 13px; }
#product-detail .brand-logo img {height:20px;margin-bottom:15px; }
#product-detail .title { font-size: 28px; line-height:1; }
#product-detail .description { font-size: 12px; margin:20px 0; }
#product-detail .featured {}
#product-detail .featured > div{display:flex; align-items: baseline;}
#product-detail .featured .featured-title { font-size: 12px;white-space: nowrap;}
#product-detail .featured .featured-title:after { content: ": "; }
#product-detail .featured .featured-value { font-size: 12px; padding-left: 5px; line-height: 1;}
/*#product-detail .featured .featured-value span { width: 12px; height: 12px; border-radius: 100%; border: 1px solid #222; display: inline-block; margin: 0 0 0 -1px; }
#product-detail .featured .featured-value span.active { background:#222; }*/
#product-detail .btn-buy {margin-top:40px; font-size: 20px; background: #469d06; color: #fff; padding: 20px 40px 10px; }
#product-detail .gallery img{margin:auto;display:block;}
#product-detail .modal-content{border:none;box-shadow:0 0 60px rgba(0,0,0,0.2) !important;}
/*alert*/
#alert-wrapper{ cursor: pointer; position: fixed; right: 0; z-index: 9999; top: 0; margin-top: 22px; margin-right: 15px; max-width: 300px; }
/*404*/
#NotFound { width: 100%; align-items: center; justify-content: center; background: #f3c9a9; flex-direction: column; user-select:none; pointer-events:none;}
#NotFound h1 { font-size: 100px; font-weight: 900; top: calc(50% - 170px); position: absolute; left: 0; width: 100%; text-align: center; color: #5c5c5c; }
#NotFound img.img-fluid { width: 40%; }#NotFound img.img-fluid { width: 300px; }





@media (max-width: 1024px){
    #home h1.title { font-size: 20px !important; }
}

@media (max-width: 768px) {

}
@media (max-width: 767px) {
    #home h1.title .handwriting { margin: 0 0 45px 0; }
    #result #result-wrapper .middle{padding-top:120px;}
    #result #result-wrapper .middle .product-list .product-item { height: 220px;}
    #result #result-wrapper .middle .product-list .product-item .info .title{height:60px;}
    #result #result-wrapper .middle .product-list .product-item .button .btn { display:block; }
    #result #result-wrapper .middle .product-filter { overflow-x: auto; white-space: nowrap; overflow-y: hidden; font-size: 13px; }
    #result #result-wrapper .middle .product-filter .custom-control-label::before { width: 10px; height: 10px; left: -15px;}
    #result #result-wrapper .middle .product-filter .custom-control-label::after { width: 10px; height: 10px; left: -15px; top: 4px; }
    #result #result-wrapper .middle .product-filter .custom-control-inline { margin-right: 4px; }
    #result #result-wrapper .middle .title { margin-bottom: 10px; }

    #question #question-wrapper .middle .choices .btn-choice { padding: 4px 10px; font-size: 13px !important;}
    #question #question-wrapper .middle .choices .btn-choice .choice-image { margin: 0 0 5px; }
    #question #question-wrapper .middle .choices .btn-choice .choice-image img {height: 33px;}

    #question #question-wrapper .middle #next-button-wrapper #next-button-visibility:not(.collapse) { display: flex; width: 100vw; justify-content: center; }
    #question #question-wrapper .middle #next-button-wrapper button { margin: 5px; font-size: 14px; white-space: pre-line; height: 50px; max-width: 50%; padding: 15px 20px 5px; align-items: center; display: flex; flex-direction: column; justify-content: center; }
    #question #question-wrapper .middle #next-button-wrapper button i { display: none; }
}
@media (max-width: 600px) {

}
@media (max-width:575px){
    #question #question-wrapper .bottom .finder-title,
    #result #result-wrapper .bottom .finder-title{margin-bottom:30px;}
    #question #question-wrapper .bottom,
    #result #result-wrapper .bottom { position: fixed; bottom: 0; pointer-events:none; }
    #question #question-wrapper .bottom a,
    #result #result-wrapper .bottom a,
    #question #question-wrapper .bottom button,
    #result #result-wrapper .bottom button{ pointer-events:auto; }
    #question #question-wrapper .middle,
    #result #result-wrapper .middle { padding-top: 0; }
    #question #question-wrapper,
    #result #result-wrapper { justify-content: space-around; }
    #question #question-wrapper .top,
    #result #result-wrapper .top { position: fixed; top: 0; left: 0; }
}
@media (max-width:568px){
    /*iphone5*/
}
@media (max-width:559px){
}
@media (max-width:533px){
    /*lumia520*/
}
@media (max-width:480px){
    /*n9,iphone4*/
    #home h1.title { letter-spacing:0 !important;}
    #question #question-wrapper .bottom,
    #result #result-wrapper .bottom { padding: 30px 0; }
    #question #question-wrapper .middle .title { font-size: 25px !important;padding-top: 20px; }
    #result #result-wrapper .middle .title { font-size: 16px !important; }

    #question #question-wrapper .bottom .btn.btn-cta,
    #result #result-wrapper .bottom .btn.btn-cta { width: 40px !important; height: 40px !important; font-size: 14px !important; }
    #result #result-wrapper .middle .product-list .product-item{height:220px;}

    #question #question-wrapper .middle .choices .btn-choice { font-size: 13px !important; width: 100px; height: 100px; display: inline-flex; justify-content: center; }
    #question #question-wrapper .middle .choices .btn-choice .choice-title { display: block; white-space: normal; }

}
@media (max-width:414px){
    /*iphone6plus,iphone7plus,iphone8plus*/
    #question:after { height: 150vh; top: -30vh; }
}
@media (max-width:412px){
    /*nexus5x,nexus6p*/
}
@media (max-width:411px){
    /*pixel2*/
}
@media (max-width:384px){
    /*l70*/
}
@media (max-width:375px){
    /*iphone6,iphone7,iphone8,iphonex*/
    #home h1.title .handwriting {font-size: 50px !important; margin: 0 0 20px 0;}
}
@media (max-width:360px){
    /*note3,note2,s3,s5,lumia550,lumia950*/
}
@media (max-width:320px){
    /*lumia520,iphone4,iphone5*/
}


@media (max-height: 800px){
    #result #resultShare { margin-bottom: 0; }
    #result #resultWhatsappButton { margin-top: 0; }
    #result #result-wrapper .middle {padding-top: 40px;}
    #result #result-wrapper .middle h1.title { font-size: 25px !important; margin-bottom: 0 !important; }
    #result #result-wrapper .bottom { padding: 15px 20px; }
    #result #result-wrapper .middle .product-list .product-item { height: 170px; }
    #result #result-wrapper .middle .product-list .product-item .img { height: 130px !important; }
    #result #result-wrapper .middle .product-list .product-item .info .title { font-size: 15px !important; }
    #result #result-wrapper .middle .product-list .product-item .button { text-align: center; margin: -15px auto 0; }
}

@keyframes blinker {
    50% { opacity: 0; }
}

@keyframes loader {
    0% {
        background-color: rgba(165, 165, 165, 0.1);
    }
    50% {
        background-color: rgba(165, 165, 165, 0.3);
    }
    100% {
        background-color: rgba(165, 165, 165, 0.1);
    }
}

@-webkit-keyframes loader {
    0% {
        background-color: rgba(165, 165, 165, 0.1);
    }
    50% {
        background-color: rgba(165, 165, 165, 0.3);
    }
    100% {
        background-color: rgba(165, 165, 165, 0.1);
    }
}