@media only screen and (min-width:1001px) and (max-width:1500px) {.content-care-in ul li:nth-child(3) {padding: 22px 43px 18px 60px } .society-rt .ui-highlight .ui-state-default:before {top: 40px; left: -97px } .society-rt .ui-highlight .ui-state-default:after {border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #000; top: 20px; left: 14% } .society-lt h2 {font-size: 29px } } @media only screen and (min-width:768px) and (max-width:1000px) {.banner-con, .banner-in, .header-in, nav, nav ul {width: 100% } .menu-con nav {display: block } .menu-con, nav {display: none } .header-in {padding: 26px 0 0; display: inline-block; clear: none } .logo {margin: 0 } nav {padding: 0; background: #5ac3e3; display: none; margin-right: 0!important } .content-company-lt p br, .content-company-rt, .product-rt, nav ul li, nav ul li a {display: block } nav ul li {float: none; margin: 0 } nav ul li a {text-align: center; padding: 9px 0; color: #fff } nav ul li a.active {color: #fff } nav ul li a:hover {color: #494949; text-decoration: underline } .banner .bx-wrapper .bx-viewport, .banner img {height: 424px } .banner-in p {margin: 21px 18px 0 0; padding: 10px 21px 9px 18px; width: 456px; font-size: 22px; line-height: 33px; letter-spacing: 0 } .banner-in p.slide1 {padding: 10px 25px 7px 18px; width: 456px; font-size: 24px; line-height: 32px } .banner-in p.slide2 {padding: 16px 24px 11px; width: 447px; font-size: 24px; line-height: 23px } .banner-in p.slide2 span {font-size: 20px; line-height: 23px; margin: 0 0 11px } .agenda-note h2, .society-award-rt p {line-height: 26px } .content-company-in {width: 94%; padding: 33px 0 36px; text-align: center } .product-rt h2, .product-rt p {text-align: left } .content-company-lt {width: 100%; display: block; float: none; text-align: left } .nutri-mas {width: 100% } .content-company-rt {float: none; width: 43%; padding: 8px 0 19px; position: static; margin: 0 auto } .content-company-rt img {width: 100%; height: auto } .content-product-in {width: 94%; padding: 29px 0 39px } .product-rt {width: 100%; float: none } .product-rt p {padding: 0 2% 0 0 } .certify-logo, .content-care-in ul li, .content-care-in ul li span, .footer-btm, .product-con, .sector p {text-align: center } .product-con {position: static } .product-lt {display: inline-block; width: 565px; height: 276px } #hex3 {top: 9px; left: 40.7% } #hex2 {top: 38px; left: 16.4% } #hex1 {top: 127px; left: 1.3% } #hex4 {top: 112px; left: 37.4% } #hex5 {top: 132px; right: 1%; left: auto } #hex6 {top: 42px; right: 15.8% } .product-rt ul {width: 100%; margin: 0 } .product-rt ul li a {padding: 15px 30% 11px } .product-rt ul li:nth-child(2) a {padding: 25px 37% 23px } .product-rt ul li:nth-child(4) a {padding: 24px 38% 23px } .content-news {width: 93%; padding: 33px 0 32px; position: relative } .content-news ul li {width: 335px!important; margin: 0 28px 0 0!important } .nutrition-in {width: 93%; margin: 0 auto 30px } .nutrition-in h2 {margin: 0 0 8px } .nutrition-in p {margin: 24px 0 0; padding: 0 } .nutrition-rgt {padding: 0 0 0 6% } .mass1 {margin: 21px 0 0 } .content-care-in {width: 93% } .content-care-in ul {float: none } .content-care-in ul li span {display: block; float: none } .content-care-in ul li a {display: block; float: none; margin: 0 } .content-care-in ul li a img {display: block; float: none; text-align: center; margin: 0 auto 4px } .product-rt ul li {width: 33.2% } .content-news ul li h3 {padding: 0 } .content-care-in ul li {padding: 21px 0 0; width: 33.2%; height: 104px } .content-care-in ul li:nth-child(2), .content-care-in ul li:nth-child(3) {padding: 22px 0 0 } .content-care {padding: 0 0 57px } .footer-in {width: 93%; padding: 37px 0 20px } .footer-details {width: 100%!important; margin: 0 4% 27px 0 } .footer-details:nth-child(2) {margin: 0 0 47px } .logo-footer {float: right!important; margin-right: 7% } .foot-info {width: 100% } .footer-details p {margin: 0 0 17px } .foot-info input {width: 58.9% } .foot-info input.button {width: 38%; float: left } .data {width: 100%; display: block; float: none } .footer-details a, .footer-details span {display: inline-block; float: left } .footer-details a {margin: 15px 0 0 19px } .footer-btm ul {display: inline-block!important; float: none!important; width: auto; margin: 0 0 13px } .footer-top {padding: 0 0 55px } .content-news .bx-wrapper {max-width: 701px!important } .bx-wrapper img {width: 100%; height: auto } .footer-btm ul li, .footer-btm ul li a {font-size: 15px } .content-news .bx-wrapper, .content-news .bx-wrapper .bx-viewport {position: static } .content-news .bx-controls-direction {top: 58px } #mobile_menu {display: block; float: right; margin: 18px 5% 0 0 } .mission-lt, .society-lt, .society-rt {display: block; float: none } .banner .bx-wrapper .bx-viewport ul li {height: 500px; overflow: hidden } .banner img {width: 1500px!important; height: auto; margin: 0 0 0 -51% } .banner .bx-wrapper img {max-width: 1500px } .agenda-note-main {width: 100% } .agenda-note-con {margin: 0 10% 0 0; width: 147px } .agenda-note h2 {font-size: 26px } .agenda-note small img {width: 47%; margin: 0 auto } .main-nav-in {width: 94% } .content-society-in {width: 100%; padding: 36px 0 0 } .society-lt {width: 94%; margin: 0 auto 38px } .society-info {width: 100% } .society-award-lt, .society-award-rt {width: 48% } .society-award-lt img {width: 100%; height: auto } .award-info small {font-size: 27px } .society-rt {width: 94%; margin: 0 auto } .society-rt-top {width: 48.4%; display: inline-block; float: left; margin: 0 } .society-rt-btm {width: 39%; display: inline-block; float: right; padding: 28px 4.5% 40px; margin: 0; min-height: 199px } .calender-tool {width: 100% } .society-rt .ui-datepicker .ui-datepicker-header {padding: 9px 0 } .society-rt .ui-datepicker .ui-datepicker-title {font-size: 29px } .society-rt .ui-widget-content .ui-state-default {font-size: 17px; padding: 3px 2px 0 1px!important } .tool {top: 44px; right: auto; left: -172% } .tool a {background: url(../images/tool-bg1.png) no-repeat; top: -11px; left: 0; width: 21px; height: 12px } .society-rt-btm ul li:nth-child(4) a, .society-rt-btm ul li:nth-child(5) a {display: none } .certify-logo ul, .gallery {display: inline-block } .content-society-in a.back {margin: 104px auto 0 } .society-rt .ui-datepicker td .tool a {background: url(../images/tool-bg1.png) no-repeat!important; width: 20px; height: 21px } .society-rt-btm ul li a {padding: 0 3% 0 0 } .society-rt .ui-highlight .ui-state-default:before {top: 40px; left: -97px } .society-rt .ui-highlight .ui-state-default:after {border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #000; top: 20px; left: 14% } .agenda-meet, .agenda-sector {width: 100% } .mass-info ul {width: 96.8% } .sector p {padding: 9px 16% 7px; line-height: 19px } .agenda-sector img {height: auto } .mass-info {margin: 31px 0 0 } .mass-info h3 {margin: 0 0 12px } .gallery {width: 48%; float: right } .gallery ul li {width: 31.7% } .gallery ul li a img {width: 100%; height: auto } .gallery ul li:nth-child(3), .gallery ul li:nth-child(6) {margin-right: 0!important } .gallery ul li:nth-child(2), .gallery ul li:nth-child(4) {margin: 0 8px 8px 0!important } .noticia-pad {padding: 38px 0 65px } .compania-block {width: 94%; margin: 0 auto 49px } .block-lt {width: 49% } .block-lt p {padding: 0 0 18px; min-height: 164px } .compania-product {width: 94%; margin: 0 auto 32px } .certify-in {width: 94% } .certify-in p {padding: 0 } .hero {height: auto; margin: 37px 0 35px } .hero-carousel-nav li.prev {left: 0!important; bottom: 142px!important } .hero-carousel-nav li.next {right: -9px!important; bottom: 142px!important } .hero-carousel article img {width: 100%; height: auto } .hero-carousel article {height: 303px!important } .hero-ban img {opacity: 1px!important; background: 0 0 } .hero-carousel-nav {left: 0!important; margin-left: 0!important; width: 100%!important } .agenda-note h3 {font-size: 21px; line-height: 21px } .agenda-ban {overflow: hidden; height: 331px } .agenda-ban img {width: 1643px; height: auto; margin: 0 0 0 -41% } .content-mission-in {width: 94%; padding: 17px 0 42px } .mission-lt {width: 100%; margin: 0 0 33px } .mission-rt, .organize-lt {margin: 0 auto; text-align: center; display: block; float: none } .content-organize-in {width: 94% } .organize-rt {display: block; float: none; width: 100%; text-align: left } .content-courage-in, .project-d-in {width: 94% } .project-d-in ul li {line-height: 20px; padding: 0 13% 0 27px; margin: 0 0 16px } .proj1 {padding: 0 0 30px } .organize-rt p {padding: 0 } .content-courage-in p {line-height: 25px; padding: 0 2% 0 0; margin: 0 0 22px } .courage-rt {display: block; margin: 27px auto 0; float: none; text-align: center } .content-courage-in ul {width: 100%; margin: 25px 0 0 } .content-courage-in ul li p {padding: 0 2% 0 0 } .content-courage-in ul li {margin: 0 0 25px } .content-courage-in ul li:nth-child(2), .content-courage-in ul li:nth-child(2) p, .content-courage-in ul li:nth-child(3), .content-courage-in ul li:nth-child(4), .content-courage-in ul li:nth-child(4) p {padding: 0 } .content-diverse-in {width: 94%; margin: 0 auto 37px } .content-diverse-in p {padding: 0 3% 0 0 } .content-public-in {width: 94%; margin: 0 auto 33px } .content-care-in ul li a.host {margin: 0 } .agenda-ban img.sub1 {margin: 0 0 0 -67% } .content-texture-in {width: 94%; padding: 37px 0 0 } .texture-info {width: 94%; padding: 13px 0 0 } .texture-info ul {width: 100% } .texture-info ul li {width: 48.5%; padding: 0 0 15px } .texture-info ul li img {height: auto; width: 100%; margin: 0 0 15px } .texture-top a {width: 72px } .texture-top a span {font-size: 0; background: url(../images/ver-bg.png) left center no-repeat; display: inline-block; width: 9px; height: 8px } .texture-info ul li p {padding: 0 0 10px; min-height: 94px } .texture-toggle-in {width: 94% } .texture-toggle-in ul li {margin: 0 0 13px; width: 97% } .grade-items, .main-nav-in ul li a.alit1 {display: none } .grade {width: 94%; margin: 0 auto 17px } .grade-lt img {width: 100%; height: auto } .grade-lt {width: 48%; margin: 0 4% 0 0 } .grade-rt {width: 100%; margin: 0; display: block } .grade-rt p {margin: 0 0 11px } .grade-rt ul {width: 40%; margin: 0 } .grade-info ul {width: 100% } .grade-info {width: 100%; margin: 26px 0 0 } .grade-info a.down {margin: 21px 0 0 } .wide-info-in {width: 94%; padding: 38px 0 35px } .range-in {width: 94% } .range-top {width: 100% } .range-btm {width: 94%; padding: 23px 0 20px 5% } .benifit h3 {padding: 0 0 10px; margin: 0 0 15px } .benifit ul li br {display: none } .benifit {display: block; float: none; margin: 0 5% 35px 0 } .content-spice-in {width: 94%; padding: 0 0 66px } .content-spice-in p {padding: 0 2% 0 0 } .content-spice-in ul {width: 100%; margin: 0 } .content-spice-in ul li {width: 48%; margin: 0 3% 0 0 } .spice-info {width: 100% } .spice-info-lt {width: 100%; display: block; float: none!important; margin: 0 0 16px } .spice-info-lt img {width: 100%; height: auto } .spice-info-rt {width: 100%; display: block; float: none } .spice-info-rt p {padding: 0 2% 14px 0; margin: 0; min-height: 91px } .range-top ul li {width: 21%; height: 54px } .range-top ul li:nth-child(2) {width: 33% } .range-top ul li:nth-child(3) {width: 22%; height: 54px } .range-top ul li:nth-child(4) {width: 23.5% } .analyst, .analyst-tab, .analyst-tab ul.rate1, .analyst-tab ul.rate2, .analyst-tab ul.rate3 {width: 100% } .grade-rt ul li {margin: 0 15px 4px 0 } .grade-info ul li {margin: 0!important } .analyst {margin: 0 auto 12px } .analyst-tab {margin: 0 } .analyst-tab ul {display: inline-block; float: none; width: 100%; margin: 0 0 14px } .analyst-tab ul li {width: 12.35% } .analyst-tab ul.rate5 li {width: 16.5% } .discription2_in, .range-tab2-list {width: 100% } .range-tab2-list ul {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2 } .discription_lft, .discription_rt {display: block; float: none } .product_discription {width: 80%; margin: 17px 0 0 4%; padding: 0; float: left } .discription ul {margin: 0 0 20px } .tab4-code ul li {width: 24.8% } .discription, .wide-list ul {display: block; float: none } } @media only screen and (min-width:658px) and (max-width:767px) {.banner-con, .banner-in, .header-in, nav, nav ul {width: 100% } .menu-con nav {display: block } .menu-con, nav {display: none } .header-in {padding: 26px 0 0; display: inline-block; clear: none } .logo {margin: 0 0 0 3.5% } #mobile_menu {display: block; float: right; margin: 18px 5% 0 0 } nav {padding: 0; background: #5ac3e3; display: none; margin-right: 0!important } .content-company-lt p br, .content-company-rt, .product-rt, nav ul li, nav ul li a {display: block } nav ul li {float: none; margin: 0 } nav ul li a {text-align: center; padding: 9px 0; color: #fff } nav ul li a.active {color: #fff } nav ul li a:hover {color: #494949; text-decoration: underline } .banner-in p {margin: 21px 18px 0 0; padding: 10px 21px 5px 18px; width: 456px; font-size: 22px; line-height: 33px; letter-spacing: 0 } .banner-in p.slide1 {padding: 12px 25px 7px 18px; width: 456px; font-size: 24px; line-height: 32px } .banner-in p.slide2 {padding: 14px 24px 10px; width: 447px; font-size: 24px; line-height: 23px } .banner-in p.slide2 span {font-size: 20px; line-height: 23px; margin: 0 0 11px } .content-company-in {width: 94%; padding: 33px 0 36px; text-align: center } .product-rt h2, .product-rt p {text-align: left } .content-company-lt {width: 100%; display: block; float: none; text-align: left } .nutri-mas {width: 100% } .content-company-rt {float: none; width: 43%; padding: 8px 0 19px; position: static; margin: 0 auto } .content-company-rt img {width: 100%; height: auto } .content-product-in {width: 94%; padding: 29px 0 39px } .product-rt {width: 100%; float: none } .product-rt p {padding: 0 2% 0 0 } .certify-logo, .content-care-in ul li, .footer-btm, .product-con {text-align: center } .product-con {position: static } .product-lt {display: inline-block; width: 565px; height: 276px } #hex3 {top: 9px; left: 40.7% } #hex2 {top: 38px; left: 16.4% } #hex1 {top: 127px; left: 1.3% } #hex4 {top: 112px; left: 37.4% } #hex5 {top: 132px; right: 1%; left: auto } #hex6 {top: 42px; right: 15.8% } .product-rt ul {width: 100%; margin: 0 } .product-rt ul li a {padding: 15px 30% 11px } .product-rt ul li:nth-child(2) a {padding: 25px 37% 23px } .product-rt ul li:nth-child(4) a {padding: 24px 38% 23px } .content-news {width: 94%; padding: 33px 0 32px; position: relative } .content-news ul li {width: 287px!important; margin: 0 21px 0 0!important } .nutrition-in {width: 93%; margin: 0 auto 30px } .nutrition-in h2 {margin: 0 0 8px } .nutrition-in p {margin: 24px 0 0; padding: 0 } .nutrition-rgt {padding: 0 0 0 6% } .mass1 {margin: 21px 0 0 } .content-care-in {width: 93% } .content-care-in ul {float: none } .content-care-in ul li span {display: block; float: none; text-align: center } .content-care-in ul li a {display: block; float: none; margin: 0 } .product-rt ul li {width: 33.2% } .content-news ul li h3 {padding: 0 } .content-care-in ul li {padding: 21px 0 0; width: 33.2%; height: 120px } .content-care-in ul li:nth-child(2), .content-care-in ul li:nth-child(3) {padding: 22px 0 0 } .content-care {padding: 0 0 57px } .footer-in {width: 93%; padding: 37px 0 20px } .logo-footer {float: right!important; margin-right: 7% } .footer-details {width: 100%!important; margin: 0 4% 27px 0 } .footer-details:nth-child(2) {margin: 0 0 47px } .foot-info {width: 100% } .footer-details p {margin: 0 0 17px } .foot-info input {width: 58.5% } .foot-info input.button {width: 38%; float: left } .data {width: 100%; display: block; float: none } .footer-details a, .footer-details span {display: inline-block; float: left } .footer-details a {margin: 15px 0 0 19px } .footer-btm ul {display: inline-block!important; float: none!important; width: auto; margin: 0 0 13px } .society-lt, .society-rt {display: block; float: none } .footer-top {padding: 0 0 55px } .content-news .bx-wrapper {max-width: 601px!important } .footer-btm ul li, .footer-btm ul li a {font-size: 15px } .content-news .bx-wrapper, .content-news .bx-wrapper .bx-viewport {position: static } .content-news .bx-controls-direction {top: 58px } .agenda-note-main {width: 100% } .agenda-note-con {margin: 0 10% 0 0; width: 154px } .agenda-note h2 {font-size: 22px; line-height: 26px; margin: 0 0 15px } .agenda-note small img {width: 52%; margin: 0 auto } .main-nav-in {width: 94% } .content-society-in {width: 100%; padding: 36px 0 0 } .society-lt {width: 94%; margin: 0 auto 38px } .society-info {width: 100% } .society-award-lt, .society-award-rt {width: 48% } .society-award-lt img {width: 100%; height: auto } .award-info small {font-size: 27px } .society-rt {width: 94%; margin: 0 auto } .society-rt-top {width: 48.4%; display: inline-block; float: left; margin: 0 } .society-rt-btm {width: 39%; display: inline-block; float: right; padding: 28px 4.5% 40px; margin: 0 } .calender-tool {width: 100% } .society-rt .ui-datepicker .ui-datepicker-header {padding: 9px 0 } .society-rt .ui-datepicker .ui-datepicker-title {font-size: 29px } .society-rt .ui-widget-content .ui-state-default {font-size: 17px } .tool {top: 45px; right: auto; left: -162% } .society-rt .ui-datepicker td .tool a {background: url(../images/tool-bg1.png) no-repeat!important; top: -11px; left: 33%; width: 21px; height: 12px } .society-rt-btm ul li:nth-child(4) a, .society-rt-btm ul li:nth-child(5) a {display: none } .content-society-in a.back {margin: 61px auto 0 } .society-rt .ui-highlight .ui-state-default:before {top: 40px; left: -97px } .society-rt .ui-highlight .ui-state-default:after {border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #000; top: 20px; left: 14% } .agenda-meet, .agenda-sector {width: 100% } .mass-info ul {width: 96% } .gallery {width: 48%; display: inline-block; float: right } .gallery ul li a, .mission-lt {display: block } .gallery ul li {width: 31.4% } .gallery ul li a img {width: 100%; height: auto } .gallery ul li:nth-child(3), .gallery ul li:nth-child(6) {margin-right: 0!important } .gallery ul li:nth-child(2), .gallery ul li:nth-child(4) {margin: 0 8px 8px 0!important } .noticia-pad {padding: 38px 0 65px } .compania-block {width: 94%; margin: 0 auto 49px } .block-lt {width: 49% } .block-lt p {padding: 0 0 18px; min-height: 164px } .compania-product {width: 94%; margin: 0 auto 32px } .certify-in {width: 94% } .certify-in p {padding: 0; line-height: 24px } .certify-logo ul {display: inline-block } .agenda-note h3 {font-size: 25px; line-height: 25px } .hero {height: auto; margin: 37px 0 35px } .hero-carousel-nav li.prev {left: 0!important; bottom: 142px!important } .hero-carousel-nav li.next {right: -9px!important; bottom: 142px!important } .hero-carousel article img {width: 90%; height: auto } .hero-carousel article {height: 303px!important } .hero-ban img {opacity: 1px!important; background: 0 0 } .hero-carousel-nav {left: 0!important; margin-left: 0!important; width: 100%!important } .agenda-ban {overflow: hidden; height: 331px } .agenda-ban img {width: 1526px; height: auto; margin: 0 0 0 -41% } .content-mission-in {width: 94%; padding: 17px 0 42px } .mission-lt {width: 100%; float: none; margin: 0 0 33px } .mission-rt, .organize-lt {margin: 0 auto; text-align: center; display: block; float: none } .content-organize-in {width: 94% } .organize-rt {display: block; float: none; width: 100%; text-align: left } .project-d-in {width: 94% } .project-d-in ul li {line-height: 20px; padding: 0 13% 0 27px; margin: 0 0 16px } .proj1 {padding: 0 0 30px } .organize-rt p {padding: 0 } .banner .bx-wrapper .bx-viewport ul li {height: 400px!important; overflow: hidden } .banner img {width: 1200px!important; height: auto; margin: 0 0 0 -51% } .banner .bx-wrapper img {max-width: 1200px!important } .content-courage-in {width: 94% } .content-courage-in p {line-height: 25px; padding: 0 2% 0 0; margin: 0 0 22px } .courage-rt {display: block; margin: 27px auto 0; float: none; text-align: center } .content-courage-in ul {width: 100%; margin: 25px 0 0 } .content-courage-in ul li p {padding: 0 2% 0 0 } .content-courage-in ul li {margin: 0 0 25px } .content-courage-in ul li:nth-child(2), .content-courage-in ul li:nth-child(2) p, .content-courage-in ul li:nth-child(3), .content-courage-in ul li:nth-child(4), .content-courage-in ul li:nth-child(4) p {padding: 0 } .content-diverse-in {width: 94%; margin: 0 auto 37px } .content-diverse-in p {padding: 0 3% 0 0 } .content-public-in {width: 94%; margin: 0 auto 33px } .content-care-in ul li a.host {margin: 0 } .content-care-in ul li a img {display: block; float: none; margin: 0 auto 15px } .content-texture-in {width: 94%; padding: 37px 0 0 } .texture-info {width: 94%; padding: 13px 0 0 } .texture-info ul {width: 100% } .texture-info ul li {width: 48.5%; padding: 0 0 15px } .texture-info ul li img {height: auto; width: 100%; margin: 0 0 15px } .texture-top a {width: 72px } .texture-top a span {font-size: 0; background: url(../images/ver-bg.png) left center no-repeat; display: inline-block; width: 9px; height: 8px } .texture-info ul li p {padding: 0 0 10px; min-height: 94px } .texture-toggle-in {width: 94% } .texture-toggle-in ul {margin: 0 } .texture-toggle-in ul li {margin: 0 0 13px; width: 97% } .texture-toggle-in ul li a {width: auto } .grade-items, .main-nav-in ul li a.alit1, .texture-toggle-in ul li a br {display: none } .grade-lt, .grade-rt {display: block; float: none } .grade {width: 94%; margin: 0 auto 30px } .grade-lt img {width: 100%; height: auto } .grade-lt {width: 100%; margin: 0 0 5px } .grade-rt {width: 100%; margin: 0 } .grade-rt p {margin: 0 0 11px } .grade-rt ul {width: 100%; margin: 0 } .grade-info ul {width: 100% } .grade-info {width: 100%; margin: 7px 0 0 } .grade-info a.down {margin: 30px 0 0 } .wide-info-in {width: 94%; padding: 38px 0 30px } .wide-info-in ul {margin: 0 23px 15px 0 } .range-in {width: 94%; padding: 24px 0 0 } .range-btm, .range-top {width: 100%; border: none } .range-btm {padding: 0 0 20px!important } .benifit h3 {padding: 0 0 10px; margin: 0 0 15px } .benifit ul li br {display: none } .benifit, .content-spice-in ul li, .spice-info-lt, .spice-info-rt {display: block; float: none } .benifit {margin: 0 5% 35px 0 } .content-spice-in {width: 94%; padding: 27px 0 66px } .content-spice-in p {padding: 0 2% 0 0 } .content-spice-in ul {width: 100%; margin: 0 } .content-spice-in ul li {width: 100%; margin: 0 0 50px } .spice-info {width: 100% } .spice-info-lt {width: 100%; margin: 0 0 16px } .spice-info-lt img {width: 100%; height: auto } .spice-info-rt {width: 100% } .spice-info-rt p {padding: 0 2% 14px 0; margin: 0; min-height: 91px } .range-top ul li {width: 21% } .range-top ul li:nth-child(2) {width: 33% } .range-top ul li:nth-child(3) {width: 22%; height: 54px } .range-top ul li:nth-child(4) {width: 22% } .grade-rt ul li {margin: 0 2% 9px 0 } .refer {display: inline-block; text-align: left; margin: 0 } .refer .grade-top span {display: block } .grade-top span {display: none } .grade-top h2 {display: block; float: none } .grade-info ul li {width: 100%; margin: 0 0 1px } .grade-info ul li label {display: inline-block; padding: 11px 0; width: 50%; float: left; line-height: 22px } .grade-info ul li span {display: inline-block; padding: 14px 0; width: 50%; float: left } .grade-info ul li:nth-child(2), .grade-info ul li:nth-child(3), .grade-info ul li:nth-child(4) {width: 100% } .wide-info-in h4 {margin: 0 0 22px } .range-btm a {display: inline-block; color: #fff; text-transform: uppercase; padding: 6px 0; font: 400 18px/21px FuturaLT-CondensedLight } h2.resp-accordion {padding: 10px } .range .resp-arrow {margin: 9px 0 0 } .benifit ul li a {line-height: 18px; padding: 0 } .range .resp-tab-active {padding: 10px 15px!important } .range h2.resp-tab-active span.resp-arrow {border: none!important; background: url(../images/accord-hover.png) no-repeat!important } .range h2.resp-tab-active {background: #70b852!important } .wide-info-in ul li a br {display: block } .range .resp-tab-content {padding: 27px 0 0 } .pop1 {width: 85%; height: auto } .analyst {width: 100% } .analyst-tab {width: 100%; margin: 0 } .analyst-tab ul {display: block; float: none; width: 100% } .analyst-tab ul li, .analyst-tab ul li.gram111 {width: 100%; display: table } .analyst-tab ul li {float: none; margin: 0 0 1px } .analyst-tab ul li label {width: 50%; text-align: left; padding: 10px 5%; height: auto; margin: 0; display: table-cell; vertical-align: middle; float: none } .analyst-tab ul li label br {display: none } .analyst-tab ul li.gram1, .analyst-tab ul li.gram10, .analyst-tab ul li.gram11, .analyst-tab ul li.gram12, .analyst-tab ul li.gram13, .analyst-tab ul li.gram14, .analyst-tab ul li.gram2, .analyst-tab ul li.gram3, .analyst-tab ul li.gram4, .analyst-tab ul li.gram5, .analyst-tab ul li.gram6, .analyst-tab ul li.gram7, .analyst-tab ul li.gram8, .analyst-tab ul li.gram9 {width: 100%; display: table } .analyst-tab ul li small {width: 50%; display: table-cell; padding: 0; height: 0; vertical-align: middle; float: none; font-size: 15px } .analyst-tab ul.rate5 li, .range-tab2-list {width: 100% } .analyst-tab ul.rate1, .analyst-tab ul.rate2, .analyst-tab ul.rate3, .analyst-tab ul.rate4 {width: 100%; display: table } .analyst-tab ul.rate4 li label {height: 41px; padding: 0 5% } .analyst-tab ul.rate5 li label {height: 39px; padding: 0 5% } .tab2_head {display: none } .range-tab2-list ul {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1 } .range-tab2-list ul li {width: 89% } .discription_lft {width: 100%; float: none } .discription2_in {width: 100% } .discription2_in img {width: 15%; height: auto; margin: 0 6% 0 0 } .product_discription {width: auto; float: none } .product_discription h3 {padding: 0 0 9px; margin: 23px 0 37px; width: 77%; float: left } .tab4-code ul {width: 100%; display: block } .tab4-code ul li {display: table; width: 100%; margin: 0 0 1px } .tab4-code ul li label {display: table-cell; vertical-align: middle; padding: 10px 5%; height: auto; text-align: left; width: 50%; font-size: 19px } .tab4-code ul li small {font-size: 14px; height: 45px; display: table-cell; vertical-align: middle; padding: 0 } .range-tab1, .range-tab2, .range-tab3, .range-tab4 {width: 90%; margin: 0 auto } .benifit ul li {margin: 0 0 13px } .benifit ul li a {font-size: 15px } .range h2.resp-accordion a {text-transform: uppercase!important } .wide-list ul {display: block; float: none } } @media only screen and (max-width:657px) {.banner-in, .header-in, nav, nav ul {width: 100% } #hex2 img, #hex4 img {left: -2px; width: 98px } .banner-in p.slide2, .main-nav-in ul li a {letter-spacing: 1px } .menu-con nav {display: block } .menu-con, nav {display: none } .header-in {padding: 26px 0 0; display: inline-block; clear: both } .logo {margin: 0 0 0 3.5% } #mobile_menu {display: block; float: right; margin: 18px 5% 0 0 } nav {padding: 0; background: #5ac3e3; display: none; margin-right: 0!important } .content-company-lt p br, .content-company-rt, .product-rt, nav ul, nav ul li, nav ul li a {display: block } nav ul {float: none } nav ul li {float: none; margin: 0 } nav ul li a {text-align: center; padding: 9px 0; color: #fff } nav ul li a.active {color: #fff } nav ul li a:hover {color: #494949; text-decoration: underline } .banner-in p.slide2 span {line-height: 24px; margin: 0 0 3px } .content-company-in {width: 94%; padding: 33px 0 36px; text-align: center } .content-company-lt {width: 100%; display: block; float: none; text-align: left } .nutri-mas {width: 100% } .content-company-rt {float: none; width: 47%; padding: 8px 0 32px; position: static; margin: 0 auto } .content-company-rt img {width: 100%; height: auto } .content-product-in {width: 94%; padding: 29px 0 39px } .product-rt {width: 100%; float: none } .product-rt h2 {text-align: left; font-size: 32px } .product-rt p {text-align: left; padding: 0 2% 0 0; margin: 0 0 27px } .product-con {position: static; text-align: center } .product-lt {width: 417px; height: 228px; margin: 0 0 29px } #hex1, #hex3, #hex5 {width: 80px; height: 80px } #hex2, #hex4, #hex6 {width: 95px; height: 95px } #hex3 {top: 45px; left: 40.6% } #hex2 {top: 79px; left: 17.8% } #hex1 {top: 132px; left: .3% } #hex4 {top: 128px; left: 38.8% } #hex5 {top: 132px; right: 1%; left: auto } #hex6 {top: 77px; right: 18% } #hex2 img {top: 6px; height: auto } #hex6 img {top: 5px; left: -1px; width: 98px; height: auto } #hex4 img {top: 5px; height: auto } #color3 span {padding: 33px 0 0; width: 97px; left: -25px; font-size: 14px } .product-rt ul {width: 100%; margin: 0 } .product-rt ul li a {padding: 15px 23% 11px; font-size: 19px } .product-rt ul li:nth-child(2) a {padding: 25px 0 23px } .product-rt ul li:nth-child(4) a {padding: 24px 0 23px } .content-news {width: 94%; padding: 33px 0 32px; position: relative } .content-news ul li {width: 210px!important; margin: 0 10px 0 0!important } .nutrition-in {width: 93%; margin: 0 auto 30px } .nutrition-in h2 {margin: 0 0 8px } .nutrition-in p {margin: 24px 0 0; padding: 0; line-height: 25px } .nutrition-rgt {padding: 0; width: 52%; margin: 0 auto; float: none } .nutrition-rgt img {width: 100%; height: auto } .mass1 {margin: 21px 0 0 } .content-care-in {width: 93% } .content-care-in ul {float: none } .content-care-in ul li span {text-align: left } .content-care-in ul li a img {margin: 0 19px 0 0 } .content-care-in ul li a {margin: 0; font-size: 17px; line-height: 40px; width: 227px; text-align: left } .banner-in p.slide2, .certify-logo, .content-care-in ul li, .footer-btm, .footer-btm ul li {text-align: center } .content-news ul li img {width: 100%; height: auto } .product-rt ul li {width: 33% } .content-news ul li h3 {padding: 0; font-size: 19px } .content-care-in ul li {padding: 16px 0 0; width: 100%; display: inline-block; float: none; border-bottom: solid 1px #eaeaea; border-right: none; height: 63px } .content-care-in ul li:nth-child(2), .content-care-in ul li:nth-child(3) {padding: 16px 0 0 } .content-care {padding: 0 0 27px; display: block } .footer-in {width: 94%; padding: 37px 0 20px } .logo-footer {float: right!important; margin-right: 7% } .footer-details {width: 100%!important; margin: 0 0 39px; display: block; float: none } .foot-info {width: 100%; margin: 0 auto } .footer-details p {margin: 0 0 17px; padding: 0 } .foot-info input {width: 59.6% } .foot-info input.button {width: 38%; float: left } .data, .footer-btm ul li, .footer-details a, .footer-details span {display: block; float: none } .data {width: 100% } .footer-details a {margin: 15px 0 0 } .footer-top {padding: 0 0 45px } .content-news .bx-wrapper {max-width: 436px!important } .content-company-lt h2 {font-size: 32px; line-height: 32px } #color1 span {font-size: 12px; line-height: 15px; padding: 30px 0 0; width: 97px; left: -24px } #color5 span {left: -25px; padding: 32px 0 0; font-size: 13px } #color5 span em {font-size: 10px } .content-news h2 {font-size: 36px } .content-news ul li p {font-size: 15px; min-height: 106px } .nutri-mas a {padding: 7px 0 6px; font-size: 13px; line-height: 13px } .footer-details h2 {font-size: 22px } .footer-btm ul li {font-size: 14px; background: 0 0; margin: 0 0 11px } .footer-btm ul li a {font-size: 14px } .footer-btm ul {display: block!important; float: none!important; width: auto; margin: 0 0 20px } .content-news .bx-wrapper, .content-news .bx-wrapper .bx-viewport {position: static } .content-news .bx-controls-direction {top: 58px } .banner .bx-wrapper .bx-viewport {min-height: 250px!important; height: auto!important } .banner .bx-wrapper .bx-pager.bx-default-pager a, .banner .bx-wrapper .bx-pager.bx-default-pager a.active, .banner .bx-wrapper .bx-pager.bx-default-pager a:hover {background-size: 100% auto; width: 14px; height: 15px; margin: 0 3px } .banner .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {bottom: 10px } .banner-con {width: 100% } .banner-in {margin: 18px 0 0 } .banner-in p, .banner-in p.slide1 {margin: 0; padding: 10px 8% 39px; width: 84%; font-size: 15px; line-height: 23px; text-align: center; letter-spacing: 1px } .content-company-lt p.salud12, .nutrition-in p.salud11, .product-lt {display: none } .society-award-lt, .society-award-rt, .society-lt, .society-rt {display: block; float: none } .banner .bx-wrapper .bx-viewport ul li {height: 329px; overflow: hidden } .banner img {width: 1000px; height: auto; margin: 0 0 0 -68% } .banner .bx-wrapper img {max-width: 1000px } .banner-in p, .banner-in p.slide1, .banner-in p.slide2 {width: 89%; margin: 0 4% 0 0; padding: 14px 2% 13px; font-size: 18px; line-height: 24px } .banner-in p.slide2 span {font-size: 18px } .agenda-note-main {width: 100% } .agenda-note h2 {font-size: 36px; margin: 0 0 32px } .main-nav-in {width: 94% } .content-society-in {width: 100%; padding: 26px 0 0 } .society-lt {width: 94%; margin: 0 auto 38px } .society-info {width: 100% } .society-award-lt {width: 100%; margin: 0 auto 16px } .society-award-rt {width: 100% } .society-award-lt img {width: 100%; height: auto } .award-info small {font-size: 27px } .society-rt {width: 96%; margin: 0 auto } .society-rt-top {width: 100%; margin: 0 auto 18px } .society-rt-btm {width: 80%; padding: 28px 10% 30px; margin: 0 } .calender-tool {width: 100% } .society-rt .ui-datepicker .ui-datepicker-header {padding: 9px 0 } .society-rt .ui-datepicker .ui-datepicker-title {font-size: 29px } .society-rt .ui-widget-content .ui-state-default {font-size: 17px } .society-rt .ui-datepicker td .tool a {background: url(../images/tool-bg1.png) no-repeat!important; top: -11px; left: 33%; width: 21px; height: 12px } .society-rt-btm ul li:nth-child(4) a, .society-rt-btm ul li:nth-child(5) a {display: none } .content-society-in a.back {margin: 62px auto 0 } .society-info h2 {font-size: 23px; line-height: 29px!important; padding: 0 0 5px!important } .society-rt .ui-datepicker table {width: 98%; margin: 0 auto } .society-rt .ui-datepicker td {padding: 2px 10px } .society-rt .ui-datepicker td a {margin: 0 auto; display: block; float: none } .tool {right: auto; top: 46px; left: -167% } .society-rt .ui-highlight .ui-state-default:before {top: 40px; left: -97px } .society-rt .ui-highlight .ui-state-default:after {border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #000; top: 20px; left: 14% } .salud, .salud .nutrition-rgt {display: block } .nutrition-rgt {display: none } .content-company-lt p {font-size: 16px!important } .agenda-meet, .agenda-sector {width: 100% } .mass-info ul {width: 96%; padding: 22px 0 12px 23px } .gallery {width: 100%; margin: 35px 0 0 } .gallery ul li:nth-child(3), .gallery ul li:nth-child(6) {margin-right: 0!important } .gallery ul li:nth-child(2), .gallery ul li:nth-child(4) {margin-right: 8px!important } .gallery ul li a {display: block } .gallery ul li {width: 32.1% } .noticia-pad {padding: 38px 0 39px!important } .gallery ul li a img {width: 100%; height: auto } .society-lt h2 {font-size: 30px } .agenda-meet p {margin: 0 0 12px; font-size: 16px } .main-nav-in ul li {margin: 0 8px 9px 0 } .cboxPhoto {width: 100%!important; height: auto!important } #cboxMiddleLeftt {width: 96%!important } .agenda-meet-lt {display: none } .block-lt, .mass-info ul li, .mission-lt {display: block; float: none } .agenda-meet p.cong:first-letter {font-size: 40px; line-height: 40px } .mass-info ul li {margin: 0 0 10px } .compania-block {width: 94% } .block-lt {width: 100%; margin: 0 0 36px } .block-lt p {padding: 0 0 34px; min-height: 0 } .compania-block {margin: 0 auto 49px } .compania-product {width: 94%; margin: 0 auto 32px } .certify-in {width: 94% } .certify-in p {padding: 0 } .certify-logo ul {display: inline-block } .agenda-ban {overflow: hidden; height: 279px } .agenda-ban img {margin: 0 0 0 -54%; height: auto; width: 1450px } .agenda-note-con {margin: 0; width: 100%; float: none } .agenda-note small img {width: 14%; margin: 0 auto } .block-lt img {width: 47%; height: auto } .hero {height: auto; margin: 37px 0 35px } .hero-carousel-nav li.prev {left: 0!important; bottom: 142px!important } .hero-carousel-nav li.next {right: -9px!important; bottom: 142px!important } .hero-carousel article img {width: 83%; height: auto } .hero-carousel article {height: 303px!important } .hero-ban img {opacity: 1px!important; background: 0 0 } .hero-carousel-nav {left: 0!important; margin-left: 0!important; width: 100%!important } .content-mission-in {width: 94%; padding: 17px 0 35px } .mission-lt {width: 100%; margin: 0 0 33px } .mission-rt, .organize-lt {margin: 0 auto; text-align: center; display: block; float: none } .mission-rt img {width: 70%; height: auto } .content-organize-in {width: 94%; padding: 39px 0 47px } .organize-lt img {width: 70%; height: auto } .organize-rt {display: block; float: none; width: 100%; text-align: left } .project-d-in {width: 94% } .project-d-in ul li {line-height: 20px; padding: 0 13% 0 27px; margin: 0 0 16px } .proj1 {padding: 0 0 30px } .product-fruit {overflow: hidden; height: 315px } .product-fruit img {width: 1410px; height: auto; margin: 0 0 0 -120% } .main-nav {display: none } .organize-rt p {padding: 0 } .project-d-in p {font-size: 15px; line-height: 23px } ww .content-courage-in {width: 94%; padding: 25px 0 16px } .content-courage-in p {padding: 0; margin: 0 0 24px } .courage-rt {display: block; margin: 20px auto 0; float: none; text-align: center } .content-courage-in ul {width: 100%; margin: 27px 0 0 } .content-courage-in ul li p {padding: 0; line-height: 23px } .content-courage-in ul li {margin: 0 0 20px } .content-courage-in ul li:nth-child(2), .content-courage-in ul li:nth-child(2) p, .content-courage-in ul li:nth-child(3), .content-courage-in ul li:nth-child(4), .content-courage-in ul li:nth-child(4) p {padding: 0 } .content-diverse-in {width: 94%; margin: 0 auto 37px; padding: 42px 0 20px } .content-diverse-in p {padding: 0 3% 0 0 } .content-public-in {width: 94%; margin: 0 auto 24px } .content-care-in ul li a.host {margin: 0 } .agenda-ban img.sub1 {margin: 0 0 0 -67% } .content-courage-in h2 {font-size: 34px } .courage-rt img {width: 88%; height: auto } .content-diverse-in h2 {font-size: 34px; margin: 0 0 24px } .content-public-in h2 {margin: 0 0 15px; padding: 0 0 6px; line-height: 34px } .content-texture-in {width: 94%; padding: 29px 0 0 } .texture-info {width: 94%; padding: 22px 0 0 } .texture-info ul {width: 100% } .texture-info ul li img {height: auto; width: 100%; margin: 0 0 17px } .texture-top a {width: 72px } .texture-top a span {font-size: 0; background: url(../images/ver-bg.png) left center no-repeat; display: inline-block; width: 9px; height: 8px } .texture-info ul li p {padding: 0; min-height: 0 } .content-texture-in h2 {margin: 0 0 17px } .content-texture-in p {line-height: 23px; margin: 0 0 26px } .content-texture-in ul li {padding: 2px 0 0 28px; margin: 0 0 12px } .texture-info ul li {width: 100%; display: block; float: none; padding: 0 0 28px } .texture-toggle-in {width: 94% } .texture-toggle-in ul {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1 } .texture-toggle-in ul li {margin: 0 0 13px; width: 97%; padding: 0 0 0 19px } .grade-items, .main-nav-in ul li a.alit1, .texture-toggle-in ul li a br {display: none } .grade-lt, .grade-rt, .wide-info-in ul {float: none; display: block } .grade {width: 94%; margin: 0 auto 30px } .grade-lt img {width: 100%; height: auto } .grade-lt {width: 100%; margin: 0 0 5px } .grade-rt {width: 100%; margin: 0 } .grade-rt p {margin: 0 0 11px } .grade-rt ul {width: 100%; margin: 0 } .grade-info ul {width: 100% } .grade-info {width: 100%; margin: 7px 0 0 } .grade-info a.down {margin: 30px 0 0 } .wide-info-in {width: 94%; padding: 38px 0 30px } .wide-info-in ul {width: auto } .range-in {width: 94%; padding: 24px 0 0 } .range-btm, .range-top {width: 100%; border: none } .range-btm {padding: 0 0 20px!important } .benifit h3 {padding: 0 0 10px; margin: 0 0 15px } .benifit ul li br {display: none } .benifit, .content-spice-in ul li, .spice-info-lt, .spice-info-rt {display: block; float: none } .benifit {margin: 0 5% 35px 0 } .content-spice-in {width: 94%; padding: 27px 0 66px } .content-spice-in p {padding: 0 2% 0 0 } .content-spice-in ul {width: 100%; margin: 0 } .content-spice-in ul li {width: 100%; margin: 0 0 50px } .spice-info {width: 100% } .spice-info-lt {width: 100%; margin: 0 0 16px } .spice-info-lt img {width: 100%; height: auto } .spice-info-rt {width: 100% } .spice-info-rt p {padding: 0 2% 14px 0; margin: 0; min-height: 91px } .range-top ul li {width: 21% } .range-top ul li:nth-child(2) {width: 33% } .range-top ul li:nth-child(3) {width: 22%; height: 54px } .range-top ul li:nth-child(4) {width: 22% } .grade-rt ul li {margin: 0 2% 9px 0 } .refer {display: inline-block; text-align: left; margin: 0 } .refer .grade-top span {display: block } .grade-top span {display: none } .grade-top h2 {display: block; float: none } .grade-info ul li {width: 100%; margin: 0 0 1px } .grade-info ul li label {display: inline-block; padding: 11px 0; width: 50%; float: left; line-height: 22px } .grade-info ul li span {display: inline-block; padding: 14px 0; width: 50%; float: left } .grade-info ul li:nth-child(2), .grade-info ul li:nth-child(3), .grade-info ul li:nth-child(4) {width: 100% } .wide-info-in h4 {margin: 0 0 22px } .range-btm a {display: inline-block; color: #fff; padding: 6px 0; font: 400 18px/21px FuturaLT-CondensedLight } h2.resp-accordion {padding: 10px } .range .resp-arrow {margin: 9px 0 0 } .benifit ul li a {line-height: 18px; padding: 0 } .range .resp-tab-active {padding: 10px 15px!important } .range h2.resp-tab-active span.resp-arrow {border: none!important; background: url(../images/accord-hover.png) no-repeat!important } .range h2.resp-tab-active {background: #70b852!important } .range .resp-tab-content {padding: 27px 0 0 } .pop1 {width: 85%; height: auto } .range h2.resp-accordion a {text-transform: uppercase!important } .analyst {width: 100% } .analyst-tab {width: 100%; margin: 0 } .analyst-tab ul {display: block; float: none; width: 100% } .analyst-tab ul li, .analyst-tab ul li.gram111 {width: 100%; display: table } .analyst-tab ul li {float: none; margin: 0 0 1px } .analyst-tab ul li label {width: 50%; text-align: left; padding: 10px 5%; height: auto; margin: 0; display: table-cell; vertical-align: middle; float: none } .analyst-tab ul li label br {display: none } .analyst-tab ul li.gram1, .analyst-tab ul li.gram10, .analyst-tab ul li.gram11, .analyst-tab ul li.gram12, .analyst-tab ul li.gram13, .analyst-tab ul li.gram14, .analyst-tab ul li.gram2, .analyst-tab ul li.gram3, .analyst-tab ul li.gram4, .analyst-tab ul li.gram5, .analyst-tab ul li.gram6, .analyst-tab ul li.gram7, .analyst-tab ul li.gram8, .analyst-tab ul li.gram9 {width: 100%; display: table } .analyst-tab ul li small {width: 50%; display: table-cell; padding: 0; height: 0; vertical-align: middle; float: none; font-size: 15px } .analyst-tab ul.rate5 li, .range-tab2-list {width: 100% } .analyst-tab ul.rate1, .analyst-tab ul.rate2, .analyst-tab ul.rate3, .analyst-tab ul.rate4 {width: 100%; display: table } .analyst-tab ul.rate4 li label {height: 41px; padding: 0 5% } .analyst-tab ul.rate5 li label {height: 39px; padding: 0 5% } .tab2_head {display: none } .range-tab2-list ul {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1 } .range-tab2-list ul li {width: 89% } .discription_lft {width: 100%; float: none } .discription2_in {width: 100% } .discription2_in img {width: 23%; height: auto; margin: 0 6% 0 0 } .product_discription {width: auto; float: none } .product_discription h3 {padding: 0 0 9px; margin: 27px 0 41px; width: 70%; float: left } .tab4-code ul {width: 100%; display: block } .tab4-code ul li {display: table; width: 100%; margin: 0 0 1px } .tab4-code ul li label {display: table-cell; vertical-align: middle; padding: 10px 5%; height: auto; text-align: left; width: 50%; font-size: 19px } .tab4-code ul li small {font-size: 14px; height: 45px; display: table-cell; vertical-align: middle; padding: 0 } .range-tab1, .range-tab2, .range-tab3, .range-tab4 {width: 90%; margin: 0 auto } .benifit ul li {margin: 0 0 13px } .benifit ul li a {font-size: 15px } .formation {display: none } .blue_list, .green_list, .orange_list, .pink_list, .red_list, .yellow_list {display: block } .texture-toggle-main a.tog {background: #494949!important } .texture-toggle {margin: 17px 0 0 } .wide-info-in ul li a br {display: none } .wide-list, .wide-list ul {display: block; float: none } } @media only screen and (max-width:479px) {.header-in {width: 100%; padding: 34px 0 0; display: inline-block; clear: both } #mobile_menu, .content-company-lt p br, .content-company-rt, .product-rt, nav ul li, nav ul li a {display: block } #mobile_menu {float: right; margin: 11px 6px 0 0 } header {padding: 0 0 29px } .logo {margin: 0 0 0 3.5%; width: 51% } .banner-con, .banner-in, nav, nav ul {width: 100% } nav {padding: 0; background: #5ac3e3; margin-right: 0!important } nav ul li {float: none; margin: 0 } nav ul li a {text-align: center; padding: 9px 0; color: #fff } nav ul li a.active {color: #fff } nav ul li a:hover {color: #494949; text-decoration: underline } .banner-in {margin: 20px 0 0 } .banner-in p.slide2 span {line-height: 24px; margin: 0 0 1px; letter-spacing: 1px; text-align: center } .content-company-in {width: 94%; padding: 26px 0 } .content-company-lt {width: 100%; display: block; float: none } .nutri-mas {width: 100% } .content-company-rt {float: none; width: 66%; padding: 8px 0 27px; position: static; margin: 0 auto } .content-company-rt img {width: 100%; height: auto } .content-product-in {width: 94%; padding: 31px 0 42px } .product-rt {width: 100%; float: none } .product-rt h2 {font-size: 32px; padding: 0; margin: 0 0 28px } .product-rt p {padding: 0; margin: 0 0 28px; line-height: 23px; font-size: 15px } .product-con {position: static; text-align: center } .product-lt {width: 290px; height: 252px; margin: 0 0 29px } #hex1, #hex3, #hex5 {width: 80px; height: 80px } #hex2, #hex4, #hex6 {width: 82px; height: 82px } #hex3 {top: 132px; left: 12.6% } #hex2 {top: 41px; left: 10.8% } #hex1 {top: 0; left: 37.3% } #hex4 {top: 85px; left: 36.8% } #hex5 {top: 173px; right: 35%; left: auto } #hex6 {top: 130px; right: 9% } #hex2 img {top: 5px; left: -1.6px; width: 85px; height: auto } #hex6 img {top: 4px; left: -2px; width: 85px; height: auto } #hex4 img {top: 4px; left: -1px; width: 85px; height: auto } #color3 span {padding: 32px 0 0; width: 100px; left: -27px; font-size: 13px } .product-rt ul {width: 95%; margin: 0 auto } .product-rt ul li a {padding: 14px 23% 12px; font-size: 21px; line-height: 22px } .product-rt ul li:nth-child(2) a {padding: 26px 0 22px } .product-rt ul li:nth-child(4) a {padding: 27px 0 21px } .product-rt ul li a img {width: 92px; height: auto } .content-news {width: 94%; padding: 26px 0 36px; position: relative } .content-news ul li {margin: 0 10px 0 0!important; width: 280px!important } .nutrition-in {width: 94%; margin: 0 auto 58px } .nutrition-in h2 {margin: 0 0 28px; padding: 0 0 6px } .nutrition-in p {margin: 24px 0 0; padding: 0; line-height: 23px; font-size: 15px } .nutrition-rgt {padding: 0; width: 93%; float: none; margin: 0 auto } .nutrition-rgt img {width: 100%; height: auto } .mass1 {margin: 26px 0 0 } .content-care-in {width: 94%; text-align: center } .content-care-in ul {float: none } .content-care-in ul li span {margin: 0 15px 0 0; text-align: left; display: inline-block } .content-care-in ul li a {margin: 0; font-size: 16px; line-height: 44px; width: 217px; text-align: left } .content-news ul li img {width: 100%; height: auto; margin: 0 0 16px } .product-rt ul li {width: 49.6%!important; margin: 0 1px 1px 0!important } .content-news ul li h3 {padding: 0; font-size: 20px; line-height: 25px } .content-care-in ul li {padding: 18px 0 0!important; width: 100%!important; text-align: center; display: block; float: none!important; border-right: none; border-bottom: solid 1px #eaeaea!important; height: 59px } .content-care-in ul li:nth-child(2), .content-care-in ul li:nth-child(3) {padding: 22px 0 0 } .content-care {padding: 0 0 27px; display: block } .logo-footer {float: right!important; margin-right: 7% } .footer-in {width: 94%; padding: 37px 0 15px; text-align: left } .banner-in p, .banner-in p.slide2, .footer-btm, .footer-btm ul li {text-align: center } .footer-details {width: 100%!important; margin: 0 0 19px; display: block; float: none } .foot-info {width: 100%; margin: 0 auto } .footer-details p {margin: 0 0 24px; padding: 0; font-size: 15px } .foot-info input {width: 58.4% } .foot-info input.button {width: 38%; float: left } .data, .footer-details a, .footer-details span {display: block; float: none } .data {width: 100% } .footer-details span {font-size: 27px; font-weight: 700 } .footer-details a {margin: 8px 0 0 } .footer-btm ul {display: block!important; float: none!important; width: auto; margin: 0 0 23px } .footer-top {padding: 0 0 35px } .content-news .bx-wrapper {max-width: 285px!important } .banner-in p {letter-spacing: 1px } .banner-in p.slide1 {text-align: center; letter-spacing: 1px } .content-company-lt h2 {font-size: 32px; line-height: 32px } #color1 span {font-size: 12px; line-height: 15px; padding: 29px 0 0; width: 100px; left: -26px } #color5 span {left: -34px; padding: 33px 0 0; font-size: 13px; width: 112px } #color5 span em {font-size: 10px } .content-news h2 {font-size: 36px } .content-news ul li p {font-size: 15px; padding: 0 0 14px; min-height: 0 } .nutri-mas a {padding: 7px 0 6px; font-size: 15px; line-height: 14px } .footer-details h2 {font-size: 24px } .banner .bx-wrapper .bx-pager.bx-default-pager a, .banner .bx-wrapper .bx-pager.bx-default-pager a.active, .banner .bx-wrapper .bx-pager.bx-default-pager a:hover {background-size: 100% auto; width: 14px; height: 15px; margin: 0 3px } .banner .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {bottom: 10px } .content-company-lt p {line-height: 23px; padding: 0; font-size: 15px!important } .footer-btm ul li, .footer-btm ul li a {font-size: 15px; line-height: 15px } .content-news .bx-wrapper .bx-viewport {height: 300px!important } .footer-btm ul li {display: block; float: none; background: 0 0; margin: 0 0 7px; padding: 0 } .content-news .bx-wrapper, .content-news .bx-wrapper .bx-viewport {position: static } .content-news .bx-controls-direction {top: 46px } .banner .bx-wrapper .bx-viewport {min-height: 197px!important; height: auto!important } .salud, .salud .nutrition-rgt {display: block } .content-company-lt p.salud12, .nutrition-in p.salud11, .nutrition-rgt, .product-lt {display: none } .banner .bx-wrapper .bx-viewport ul li {height: 262px; overflow: hidden } .banner img {width: 800px; height: auto; margin: 0 0 0 -95% } .banner-in p, .banner-in p.slide1, .banner-in p.slide2 {width: 89%; margin: 0 4% 0 0; padding: 14px 2% 13px; line-height: 24px } .banner .bx-wrapper img {max-width: 800px } .banner-in p, .banner-in p.slide1 {font-size: 17px } .banner-in p.slide2 {letter-spacing: 1px; font-size: 15px } .banner-in p.slide2 span {font-size: 15px } .logo a img {width: 100%; height: auto } .menu-con nav {display: block } .menu-con, nav {display: none } .society-rt .ui-datepicker td {padding: 2px 3px } .agenda-note h2 {font-size: 36px } .main-nav-in ul li a {font-size: 12px } .society-info h2 {font-size: 20px; line-height: 29px; padding: 0 0 5px } .society-award-rt p {padding: 0 } .society-rt-btm h2 {font-size: 23px } .society-lt {width: 94% } .society-rt .ui-highlight .ui-state-default:before {top: 40px; left: -90px } .society-rt .ui-highlight .ui-state-default:after {border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #000; top: 20px; left: 14% } .agenda-sector {width: 100%; margin: 0 0 25px } .agenda-meet {width: 100%; text-align: left; margin: 0 auto } .mass-info ul {width: 100%; padding: 23px 0 8px } .gallery {width: 100%; margin: 35px 0 12px } .gallery ul li:nth-child(3), .gallery ul li:nth-child(6) {margin-right: 8px!important } .gallery ul li a {display: block } .gallery ul li {width: 48.3% } .noticia-pad {padding: 24px 0 26px!important } .gallery ul li a img {width: 100%; height: auto } .society-lt h2 {font-size: 28px; margin: 0 0 18px; line-height: 30px } .agenda-meet p {margin: 0 0 23px; font-size: 15px; line-height: 23px } .main-nav-in ul li {margin: 0 8px 9px 0; background: url(../images/nav-arr.png) right 6px no-repeat } .main-nav-in ul li a {line-height: 18px } .sector p {font-size: 14px } .mass-info ul li {display: block; float: none; text-align: left; margin: 0 0 18px 7% } .agenda-meet-lt, .main-nav {display: none } .certify-logo, .courage-rt {text-align: center } .mass-info h3 {margin: 0 0 8px } .gallery h2 {margin: 0 0 18px } .gallery ul li:nth-child(2), .gallery ul li:nth-child(4), .gallery ul li:nth-child(6) {margin-right: 0!important } .agenda-meet p.cong:first-letter {font-size: 23px; margin: -8px 0 0; line-height: 30px; font-weight: 700; padding: 0 } .mass-info {margin: 20px 0 0 } .compania-block {width: 94% } .block-lt {width: 100%; display: block; float: none; margin: 0 0 24px } .block-lt p {padding: 0 0 34px; min-height: 0; font-size: 15px; line-height: 23px } .compania-block {margin: 0 auto } .compania-product {width: 94%; margin: 0 auto 24px } .certify-in {width: 94% } .certify-in p {padding: 0 } .certify-logo ul {display: inline-block } .agenda-ban {overflow: hidden; height: 279px } .agenda-ban img {margin: 0 0 0 -114%; height: auto; width: 1450px } .agenda-note-con {margin: 0; width: 100%; float: none } .agenda-note small img {width: 25%; margin: 0 auto } .block-lt img {width: 63%; height: auto } .hero {height: auto; margin: 37px 0 30px } .hero-carousel-nav li.prev {left: 0!important; bottom: 140px!important } .hero-carousel-nav li.next {right: -9px!important; bottom: 140px!important } .compania-product h2 {font-size: 30px; line-height: 33px; padding: 0 0 3px; margin: 0 0 14px } .certify-in h2 {margin: 0 0 22px } .certify-in p {line-height: 24px; margin: 0 0 20px; font-size: 15px } .certify-in ul li {line-height: 22px; background: url(../images/check-bg.png) left 7px no-repeat; margin: 0 18px 0 0 } .compania-product p, .content-courage-in p, .content-diverse-in p, .mission-lt p, .organize-rt p {line-height: 23px; font-size: 15px } .hero-carousel article img {width: 74%; height: auto } .product-fruit {overflow: hidden; height: 267px } .product-fruit img {width: 1019px; height: auto; margin: 0 0 0 -120% } .mission-rt img, .organize-lt img {width: 100%; height: auto } .organize-rt p {padding: 0; margin: 0 0 22px } .compania-product p {padding: 0 } .content-compania {padding: 29px 0 15px } .content-courage-in {width: 94%; padding: 25px 0 16px } .content-courage-in p {padding: 0 3% 0 0; margin: 0 0 24px } .content-courage-in ul li p, .content-courage-in ul li:nth-child(2), .content-courage-in ul li:nth-child(2) p, .content-courage-in ul li:nth-child(3), .content-courage-in ul li:nth-child(4), .content-courage-in ul li:nth-child(4) p {padding: 0 } .courage-rt {display: block; margin: 20px auto 0; float: none } .content-courage-in ul {width: 100%; margin: 27px 0 0 } .content-courage-in ul li {margin: 0 0 20px } .content-diverse-in {width: 94%; margin: 0 auto 37px; padding: 42px 0 20px } .content-diverse-in p {padding: 0 3% 0 0 } .content-public-in {width: 94%; margin: 0 auto 24px } .content-care-in ul li a.host {margin: 0 } .agenda-ban img.sub1 {margin: 0 0 0 -67% } .content-courage-in h2 {font-size: 30px } .courage-rt img {width: 88%; height: auto } .content-courage-in p small {font-size: 15px } .content-diverse-in h2 {font-size: 30px; margin: 0 0 24px } .content-diverse-in p em, .content-diverse-in p small {font-size: 15px } .content-public-in h2 {margin: 0 0 15px; padding: 0 0 6px; line-height: 34px; font-size: 32px } .content-texture-in {width: 94%; padding: 29px 0 0 } .texture-info {width: 94%; padding: 22px 0 0 } .texture-info ul {width: 100% } .texture-info ul li img {height: auto; width: 100%; margin: 0 0 17px } .texture-top a {width: 72px } .texture-top a span {font-size: 0; background: url(../images/ver-bg.png) left center no-repeat; display: inline-block; width: 9px; height: 8px } .texture-info ul li p {padding: 0; min-height: 0; font-size: 15px } .content-texture-in h2 {margin: 0 0 17px } .content-texture-in p {font-size: 15px; line-height: 23px; margin: 0 0 26px } .content-texture-in ul li {padding: 2px 0 0 28px; margin: 0 0 12px; font-size: 15px; line-height: 19px } .texture-info ul li {width: 100%; display: block; float: none; padding: 0 0 28px } .grade-items, .main-nav-in ul li a.alit1, .texture-toggle-in ul li a br {display: none } .texture-toggle-in ul li a {word-break: break-all; width: auto; font-size: 15px } .texture-toggle-in ul li {padding: 0 0 0 15px } .texture-toggle-in ul li small {margin: 0 12px 0 0; font-size: 15px } .grade-lt, .grade-rt {display: block; float: none } .grade {width: 94%; margin: 0 auto 30px } .grade-lt img {width: 100%; height: auto } .grade-lt {width: 100%; margin: 0 0 5px } .grade-rt {width: 100%; margin: 0 } .grade-rt p {margin: 0 0 11px } .grade-rt ul {width: 100%; margin: 0 } .grade-info ul {width: 100% } .grade-info {width: 100%; margin: 7px 0 0 } .grade-info a.down {margin: 30px 0 0 } .wide-info-in {width: 94%; padding: 38px 0 30px } .wide-info-in ul {margin: 0 } .range-in {width: 94%; padding: 24px 0 0 } .range-btm, .range-top {width: 100%; border: none } .range-btm {padding: 0 0 20px!important } .benifit h3 {padding: 0 0 10px; margin: 0 0 15px } .benifit ul li br {display: none } .benifit, .content-spice-in ul li, .spice-info-lt, .spice-info-rt {display: block; float: none } .benifit {margin: 0 5% 35px 0 } .content-spice-in {width: 94%; padding: 27px 0 66px } .content-spice-in p {padding: 0 2% 0 0 } .content-spice-in ul {width: 100%; margin: 0 } .content-spice-in ul li {width: 100%; margin: 0 0 50px } .spice-info {width: 100% } .spice-info-lt {width: 100%; margin: 0 0 16px } .spice-info-lt img {width: 100%; height: auto } .spice-info-rt {width: 100% } .spice-info-rt p {padding: 0 2% 14px 0; margin: 0; min-height: 91px } .range-top ul li {width: 21% } .range-top ul li:nth-child(2) {width: 33% } .range-top ul li:nth-child(3) {width: 22%; height: 54px } .range-top ul li:nth-child(4) {width: 22% } .grade-rt ul li {margin: 0 3% 9px 0 } .refer {display: inline-block; text-align: left; margin: 0 } .refer .grade-top span {display: block } .grade-top span {display: none } .grade-top h2 {display: block; float: none } .grade-info ul li {width: 100%; margin: 0 0 1px } .grade-info ul li label {display: inline-block; padding: 11px 0; width: 50%; float: left; line-height: 22px } .grade-info ul li span {display: inline-block; padding: 14px 0; width: 50%; float: left } .grade-info ul li:nth-child(2), .grade-info ul li:nth-child(3), .grade-info ul li:nth-child(4) {width: 100% } .wide-info-in h4 {margin: 0 0 22px } .range-btm a {display: inline-block; color: #fff; padding: 6px 0; font: 400 18px/21px FuturaLT-CondensedLight } h2.resp-accordion {padding: 10px } .range .resp-arrow {margin: 9px 0 0 } .benifit ul li a {line-height: 18px; padding: 0 } .range .resp-tab-active {padding: 10px 15px!important } .range h2.resp-tab-active span.resp-arrow {border: none!important; background: url(../images/accord-hover.png) no-repeat!important } .range h2.resp-tab-active {background: #70b852!important } .range .resp-tab-content {padding: 27px 0 0 } .pop1 {width: 85%; height: auto } .range-tab1, .range-tab2, .range-tab3, .range-tab4 {width: 90%; margin: 0 auto } .benifit ul li {margin: 0 0 13px } .benifit ul li a, .discription ul li h5, .discription ul li span, .range-tab4 p, .range-tab4 p span {font-size: 15px } .product_discription h3 {padding: 0 0 9px; margin: 14px 0 32px; width: 70%; float: left } .wide-info-in ul li a {width: 78% } } @media only screen and (min-width:410px) and (max-width:479px) {.banner .bx-wrapper .bx-viewport ul li {height: 326px; overflow: hidden } .banner img {width: 1000px; height: auto; margin: 0 0 0 -79% } .banner .bx-wrapper img {max-width: 1000px } } @media only screen and (min-width:595px) and (max-width:657px) {.banner .bx-wrapper .bx-viewport ul li {height: 329px; overflow: hidden } .banner img {width: 1000px; height: auto; margin: 0 0 0 -43% } .banner .bx-wrapper img {max-width: 1000px } .banner-in p {width: 89%; margin: 0 4% 0 0; padding: 14px 2% 13px; font-size: 18px; line-height: 25px } } @media only screen and (min-width:1024px) {nav {display: block!important } } /* MEDIA QUERIES SERVILIA */ @media only screen and (min-width: 768px) and (max-width:1000px) {.srv-product-con{width:705.94px; margin:auto; padding-top:20px; } .srv-cont-gama, .srv-add-block, .srv-cont-img{height:113px; } .srv-v-centrado a{font-size:16px; } } @media only screen and (min-width: 658px) and (max-width:767px) {.srv-add-block{display:none; } .srv-product-con{width:602.53px; margin:auto; padding-top:20px; } .srv-cont-gama{width:48%; height:143px; margin-bottom: 9px; } .srv-cont-img{height:143px; } .srv-last{margin-right:1.5%; } } @media only screen and (max-width:657px) {.srv-add-block{display:none; } .srv-product-con{width:360px; padding-top:20px; margin:auto; } .srv-cont-gama{width:100%; height:178px; margin-bottom: 9px; margin-right:0px; } .srv-cont-img{height:173px; } .srv-last{margin-right:0%; } } @media all and (min-width:997px) {.srv-tabcontent .srv-valores {width: 12% } } @media all and (max-width:996px) and (min-width:500px) {.srv-tabcontent .srv-valores div {width: 25%!important } } @media all and (max-width:996px) {.srv-tabcontent .srv-valores {width: 96%!important } .srv-contenedor-imagen {display: none } #srv-calculadora-valores-nutricionales .srv-selector label {font-size: 13px; min-height: 34px } #srv-detalles .srv-detalles div:not(.srv-valores-totales-d)>.srv-valores {height: 36px } } @media all and (max-width:780px) {#srv-detalles #srv-desglose label {font-size: 10px!important } .srv-detalles-cabecera {height: 35px } } @media all and (max-width:730px) {.srv-totales>div>div {width: 33%!important; font-size: 1.1em } } @media all and (max-width:600px) {#srv-detalles {display: none } .srv-totales>div>div {width: 50%!important; font-size: 1.1em } } @media all and (max-width:548px) {.srv-tabcontent {padding: 15px 7px } .srv-valores-totales-d {float: left; width: calc(100% + 7px); margin-left: -7px } } @media all and (max-width:512px) {#srv-calculadora-valores-nutricionales .srv-selector label {width: 41% } } @media all and (max-width:500px) {.srv-valores-totales-d .srv-valores div, .srv-valores>div {width: 33%!important } } @media all and (max-width:420px) {.srv-valores-totales-d .srv-valores div {width: 50%!important } #srv-predefinidos label {margin: auto auto 10px; width: 92%; text-align: center } }@media only screen and (max-width:640px){.srv-cta-img-640{display:block } .srv-cta-img{display:none } }