.oatCampaignBox{margin:20px auto;max-width:960px}.oatCampaignBox>header h2{margin-bottom:20px;font-size:32px;color:#4b4b4b;text-align:center}.oatCampaignBox>header .textblock{font-size:18px;color:#6a6a6a;text-align:center;margin-bottom:30px}@media (min-width:768px){.oatCampaignBox{margin-top:60px;margin-bottom:60px}.oatCampaignBox>header h2{font-size:44px}}.oatCampaign{position:relative}.oatCampaign a{text-decoration:none}.oatCampaign>.col1{margin-bottom:20px}.oatCampaign>.col1 .messageContainer{background:#E5F6E4}.oatCampaign>.col1 .messageContainer .message{height:180px;padding:20px;color:#3b9d2d;text-align:center;box-sizing:border-box}.oatCampaign>.col1 .messageContainer .message>.wrap{height:100%;display:flex;flex-direction:column;justify-content:center}.oatCampaign>.col1 .messageContainer .message .heading{font-size:21px;font-weight:700;margin-bottom:6px}.oatCampaign>.col1 .messageContainer .message .textblock{font-size:15px;line-height:1.15em;margin:0;font-family:ProximaNovaSoft}.oatCampaign>.col1 .messageContainer .message .image{width:72px;overflow:hidden;margin:0 auto 15px;text-align:center;position:relative;display:none}.oatCampaign>.col1 .messageContainer .message .image .graphic{padding-top:100%;background:#ffe9c9;border-radius:50%}.oatCampaign>.col1 .messageContainer .message .image img{max-height:60%;display:inline-block;vertical-align:middle;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.oatCampaign>.col1 .messageContainer .message .image .fibreCount,.oatCampaign>.col1 .messageContainer .message:not(.intro){display:none}.oatCampaign>.col1 .messageContainer .message.bad{background:#fff1ea}.oatCampaign>.col1 .messageContainer .message.good{background:#edfed7}@media (min-width:830px){.oatCampaign>.col1 .messageContainer .message{padding:40px 25px}.oatCampaign>.col1 .messageContainer .message .heading{font-size:28px}.oatCampaign>.col1 .messageContainer .message .textblock{font-size:22px}.oatCampaign>.col1 .messageContainer .message .image{width:100px}}@media (min-width:700px){.oatCampaign>.col1 .messageContainer .message{height:100%}.oatCampaign>.col1 .messageContainer .message .image{display:block}.oatCampaign>.col1 .messageContainer{height:100%}}.oatCampaign>.col1 .progressBar{padding-right:50px;position:relative;background:#DDEEDC}.oatCampaign>.col1 .progressBar .indicatorSlider{position:absolute;left:-14px;width:100%;top:0}.oatCampaign>.col1 .progressBar .indicator{background:#69be28;min-width:105px;height:27px;position:absolute;left:15px;top:-50px;color:#fff;font-size:14px;padding:3px 7px 3px 30px;box-sizing:border-box;font-family:ProximaNovaSoft;white-space:nowrap;box-shadow:2px 3px 4.65px .35px rgba(0,0,0,.12);border-radius:4px}.oatCampaign>.col1 .progressBar .actions .lnkReset a:after,.oatCampaign>.col2 .ingredientList .ingredient .image:before{font-family:alpro-webfont;font-weight:400;font-style:normal;speak:none;text-decoration:inherit;text-transform:none;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center}.oatCampaign>.col1 .progressBar .indicator:before{content:"";position:absolute;background:url(/img/layout/campaigns/oat_campaign/oat-desktop.png) left top no-repeat;background-size:100% auto;width:12px;height:37px;left:10px;top:4px}.oatCampaign>.col1 .progressBar .indicator:after{content:"";display:block;width:0;height:0;border-style:solid;border-width:2px 3.5px 0;border-color:#69be28 transparent transparent;position:absolute;bottom:-2px;left:7px}.oatCampaign>.col1 .progressBar .indicator img{position:absolute;left:9px;top:15%;height:65%}.oatCampaign>.col1 .progressBar .bar{height:50px;position:relative}.oatCampaign>.col1 .progressBar .bar:after{content:"";background:url(/img/layout/campaigns/oat_campaign/grid-mobile.png) left bottom repeat-x;position:absolute;left:9px;right:6px;top:-20px;height:12px}.oatCampaign>.col1 .progressBar .items{white-space:nowrap;overflow:hidden}.oatCampaign>.col1 .progressBar .item{height:50px;line-height:50px;display:inline-block;width:25%;background:red;vertical-align:top;text-align:center;overflow:hidden;box-sizing:border-box;border-right:1px solid #f9dcae}.oatCampaign>.col1 .progressBar .item img{max-height:60%;vertical-align:middle;display:inline-block}.oatCampaign>.col1 .progressBar .actions .lnkReset{position:absolute;right:0;top:0;bottom:0;width:50px}.oatCampaign>.col1 .progressBar .actions .lnkReset a{display:block;width:100%;height:100%;background:#69be28;color:#fff;font-size:11px;text-align:center;box-sizing:border-box;padding-top:30px;line-height:.8}.oatCampaign>.col1 .progressBar .actions .lnkReset a:after{content:"\f125";line-height:1;position:absolute;left:0;right:0;top:8px;font-size:18px}@media (min-width:700px){.oatCampaign>.col1 .progressBar .indicator{min-width:140px;height:45px;padding:8px 10px 8px 40px;font-size:18px;top:-90px}.oatCampaign>.col1 .progressBar .indicator:after{border-width:4px 7px 0;bottom:-4px}.oatCampaign>.col1 .progressBar .indicator img{left:12px}.oatCampaign>.col1{position:absolute;left:0;top:0;bottom:0;width:43%;padding-bottom:75px;margin-bottom:0;z-index:5}.oatCampaign>.col1 .progressBar{position:absolute;left:0;right:0;bottom:0;padding-right:75px}.oatCampaign>.col1 .progressBar .bar{height:75px}.oatCampaign>.col1 .progressBar .item{height:75px;line-height:75px}.oatCampaign>.col1 .progressBar .actions .lnkReset{width:75px}.oatCampaign>.col1 .progressBar .actions .lnkReset a{padding-top:48px;font-size:14px;line-height:.8}.oatCampaign>.col1 .progressBar .actions .lnkReset a:after{font-size:26px;top:16px}}@media (min-width:980px){.oatCampaign>.col1 .progressBar .indicator{padding-left:40px}.oatCampaign>.col1 .progressBar .indicator:before{width:20px;left:12px;top:auto}}.oatCampaign>.col2{position:relative}.oatCampaign>.col2 .ingredientList{padding-bottom:35px;position:relative}.oatCampaign>.col2 .ingredientList>.main>.ingredient{max-width:100px}.oatCampaign>.col2 .ingredientList .ingredient{padding:8px 10px;box-sizing:border-box;cursor:pointer;position:relative;vertical-align:top}.oatCampaign>.col2 .ingredientList .ingredient .image{margin:0 auto;text-align:center;position:relative}.oatCampaign>.col2 .ingredientList .ingredient .image:before{content:"\f10d";line-height:1;color:#69be28;font-size:20px;position:absolute;top:50%;left:0;right:0;margin-top:-6px;z-index:3;opacity:0;transition:opacity .2s linear}.oatCampaign>.col2 .ingredientList .ingredient .image:after{content:"";background:rgba(255,255,255,.75);position:absolute;left:0;right:0;top:0;bottom:0;z-index:2;opacity:0;transition:opacity .2s linear}.oatCampaign>.col2 .ingredientList .ingredient.jActive .image:after,.oatCampaign>.col2 .ingredientList .ingredient.jActive .image:before{opacity:1}.oatCampaign>.col2 .ingredientList .ingredient .image .graphic{padding-top:100%;border-radius:50%;overflow:hidden;background:red}.oatCampaign>.col2 .ingredientList .ingredient .image img{max-height:60%;display:inline-block;vertical-align:middle;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1}.oatCampaign>.col2 .ingredientList .ingredient .label{color:#78848e;font-family:ProximaNovaSoft;font-size:11px;line-height:1.15em;min-height:2.25em;text-align:center;margin-top:8px}.oatCampaign>.col2 .ingredientList>footer .slick-arrow:after,.oatCampaign>.col2 .ingredientList>footer .slick-next:after{font-family:alpro-webfont;line-height:1;font-weight:400;font-style:normal;speak:none;text-decoration:inherit;text-transform:none;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.oatCampaign>.col2 .ingredientList .ingredient .fibreCount{position:absolute;left:-6px;top:6px;background:url(/img/layout/campaigns/oat_campaign/oat.png) 4px 50% no-repeat #69be28;color:#fff;font-size:11px;padding:3px 4px 3px 20px;border-radius:3px;z-index:4;opacity:0;transition:opacity .2s linear}.oatCampaign>.col2 .ingredientList .ingredient.jActive .fibreCount{opacity:1}@media (min-width:481px){.oatCampaign>.col2 .ingredientList .ingredient .label{font-size:14px}}@media (min-width:700px){.oatCampaign>.col2 .ingredientList .ingredient{padding:15px 15px 0}.oatCampaign>.col2 .ingredientList .ingredient .label{margin-top:12px}.oatCampaign>.col2 .ingredientList .ingredient .image:before{font-size:30px;margin-top:-15px}.oatCampaign>.col2 .ingredientList .ingredient .fibreCount{font-size:14px;left:-10px}}@media (min-width:830px){.oatCampaign>.col2 .ingredientList .ingredient .image{width:100px}}.oatCampaign>.col2 .ingredientList>footer{width:130px;margin:0 auto;padding:0 30px;position:relative;box-sizing:border-box}.oatCampaign>.col2 .ingredientList>footer .slick-arrow{display:block;border:none;padding:0 0 0 23px;overflow:hidden;background:#69be28;border-radius:50%;width:0;height:23px;cursor:pointer;position:absolute;top:0;margin-top:0}.oatCampaign>.col2 .ingredientList>footer .slick-arrow:after{content:"\f104";display:block;position:absolute;left:-1px;right:0;top:8px;text-align:center;font-size:8px;color:#fff}.oatCampaign>.col2 .ingredientList>footer .slick-arrow.slick-disabled{opacity:.4;display:block!important}.oatCampaign>.col2 .ingredientList>footer .slick-next:after{left:0;right:-1px;content:"\f105"}.oatCampaign>.col2 .ingredientList>footer .slick-next{right:0}.oatCampaign>.col2 .ingredientList>footer .slick-prev{left:0}.oatCampaign>.col2 .ingredientList>footer .slick-dots{text-align:center;height:21px;line-height:23px}.oatCampaign>.col2 .ingredientList>footer .slick-dots li{display:inline-block;vertical-align:middle;margin:0 5px}.oatCampaign>.col2 .ingredientList>footer .slick-dots li button{display:block;width:0;height:7px;padding:0 0 0 7px;overflow:hidden;background:#d2ebbe;border:none;border-radius:50%;cursor:pointer}.oatCampaign>.col2 .ingredientList>footer .slick-dots li.slick-active button{background:#69be28}@media (min-width:700px){.oatCampaign>.col2 .ingredientList>footer{position:static}.oatCampaign>.col2 .ingredientList>footer .slick-arrow{padding-left:36px;height:36px;top:50%;margin-top:-56px}.oatCampaign>.col2 .ingredientList>footer .slick-prev{left:20px}.oatCampaign>.col2 .ingredientList>footer .slick-next{right:20px}.oatCampaign>.col2 .ingredientList>footer .slick-arrow:after{top:12px;font-size:11px}.oatCampaign>.col2 .ingredientList>footer .slick-dots li button{padding-left:10px;height:10px}.oatCampaign>.col2 .ingredientList{padding-left:65px;padding-right:65px;padding-bottom:0}}.oatCampaign>.col2 .actions{position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(255,255,255,.5);z-index:4;text-align:center;padding:8px 20px;display:none}.oatCampaign>.col2 .actions .lnkReset a{display:block;margin:0 auto;max-width:340px;box-sizing:border-box;padding:14px 6px;font-size:15px;color:#fff;font-family:ProximaNovaSoft;font-weight:700;background:#3f9c35;text-transform:uppercase}.oatCampaign>.col2 .actions .lnkPlayAgain{display:none}@media (min-width:700px){.oatCampaign>.col2 .actions .lnkReset{position:absolute;left:0;right:0;top:50%;margin-top:-62px}.oatCampaign>.col2 .actions .lnkReset a{font-size:20px;padding:12px;width:75%}.oatCampaign>.col2{margin-left:43%}}@media (min-width:986px){.oatCampaign{max-width:960px;margin-left:auto;margin-right:auto}}