@charset "utf-8";
/* CSS Document */
body { background-color:#f0f0f0;}
.bg-main { background-color: #f0f0f0;}
@font-face {font-family: 'wawa';src: url('fonts/wawa.ttf');}
.nncn { font-family: wawa,arial;} 
.owl-cate .item {width: 250px;padding: 12px 4px 8px 4px;border: 3px solid #F8C0BF; background-color: #fff;}
.owl-cate .item:hover {color:white; background-color: #F8C0BF;}
.owl-cate .item .text {color:black;}
.owl-cate .item .text p {line-height:20px;margin-bottom: 6px; font-weight:bold;}
.owl-cate .item .text .nncn {font-size: large; letter-spacing: 2px;color:#8e8e8e;}
.owl-cate .item .text .nnen {color:#8e8e8e;}
.section-cate {background-color: #ffffff;}
.owl-carousel .owl-stage-outer{ z-index:999999}
.topping-fix {border: 3px solid #F8C0BF;}
.topping-fix:hover {background-color: #F8C0BF;}
.owl-menu .item-menu{box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.1);}
.section-content { border-top: 3px solid #fff2f2;}
.topping-fix a { font-size: large; font-weight: bold; padding: 4px 30px;}
.owl-menu .group-text .name {font-size: large;line-height: 14px; color:black;}
.owl-menu .group-text .name .nncn {color:#8e8e8e;}
.owl-menu .group-text .name .nnen {color:#8e8e8e;}
.owl-menu .group-text .price {font-size: large;font-weight: bold;}
.section-content {margin-top: 0px;}
.btn-prev , .btn-next{z-index:999999999;}
.owl-cate .owl-nav .btn-next, .owl-cate .owl-nav .btn-prev {background-color: #F8C0BF;color: #fff;}
.owl-cate .owl-nav {height: 0px;z-index: 99999999;}
@media(max-width: 414px){
.item-menu .group-text .name .nnvi, .item-menu .group-text .name .nnen, .item-menu .group-text .name .nncn , .item-menu .group-text .price {font-size: small;}
}
@media(min-width: 991px){
}

@media(min-width: 767px) and (max-width: 1200px){
.owl-cate .item {width: 250px;padding: 12px 4px 8px 4px;border: 3px solid #F8C0BF; background-color: #fff;}
.owl-cate .item:hover {color:white; background-color: #F8C0BF;}
.owl-cate .item .text {color:black;}
.owl-cate .item .text p {line-height:20px;margin-bottom: 6px; font-weight:bold;}
.owl-cate .item .text .nncn {font-size: large; letter-spacing: 2px;color:#8e8e8e;}
.owl-cate .item .text .nnen {color:#8e8e8e;}
.section-content {padding-top: 2px;}
.owl-menu .owl-nav .btn-prev, .owl-menu .owl-nav .btn-next {width: 50px;height: 150px;-webkit-border-radius: 10%;}
.owl-cate .owl-nav .btn-prev, .owl-cate .owl-nav .btn-next {width: 32px;height: 70px;-webkit-border-radius: 10%;}
}

@media(max-width: 768px){
.bg-main{margin-left: 10px;}
.topping-fix {right: -72px;}
.section-content {margin-top: 100px !important;}
.container {max-width: 720px !important;padding: 10px 0px 10px 0px;}
.owl-cate .owl-nav .btn-prev, .owl-cate .owl-nav .btn-next {background-color: #f8c0bf;color: #fff;}
.owl-cate .item {width: 221px;}
.owl-cate .owl-nav .btn-prev, .owl-menu .owl-nav .btn-prev {left: -25px;}
.owl-cate .owl-nav .btn-next, .owl-menu .owl-nav .btn-next {right: -42px;}
}

@media(max-width: 420px){
.owl-cate .item {width: 250px;padding: 12px 4px 8px 4px;border: 3px solid #F8C0BF; background-color: #fff;}
.container {max-width: 420px !important;padding: 0px 0px 10px 0px;}
.owl-cate .owl-nav .btn-prev, .owl-menu .owl-nav .btn-prev {left: 0px;}
.owl-cate .owl-nav .btn-next, .owl-menu .owl-nav .btn-next {right: 10px;}
.owl-menu .owl-nav {z-index: 999999;}
.section-content {margin-top: 0px !important;}
.owl-menu .group-text .name .nnvi, .owl-menu .group-text .name .nncn, .owl-menu .group-text .name .nnen{height:43px; line-height:26px;font-size: medium; height:25px;}
.owl-carousel .owl-item img {width: 95%; margin: auto;}
.section-cate { padding-bottom: 0px;}
}

@media(max-width: 375px){
.section-content .container {margin-top:-18px !important;}
.owl-cate .item {padding: 2px;}
.owl-menu .group-text .name .nnvi, .owl-menu .group-text .name .nncn, .owl-menu .group-text .name .nnen{font-size: small; height:20px !important;line-height:18px !important;}
.owl-carousel .owl-item img {width: 90%;margin: auto;}
.section-cate { padding-bottom: 0px;}
}