@font-face {
    font-family: 'Bemio Italic';
    src: url(fonts/bemio_italic.eot);
    src: url(fonts/bemio_italic.ttf) format('truetype');
    font-weight: 400;
    font-style: normal
}
* {
    margin: 0;
    padding: 0
}
body {
    color: #020202;
    font-family: Lato, sans-serif;
    font-size: 17px;
    position: relative!important;
    background: #ccf6fe;

}
h2, #faq h1 {
    color: #c20430;
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 30px
}
h2.minor {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: .75em
}
p {
    line-height: 1.365em;
    margin-bottom: 1.216em
}
a {
    color: #020202
}
a:hover {
    color: #c20430
}
.section {
    position: relative;
    overflow: hidden;
    width: 100%;
    top: 8px
}
section>.container {
    padding-top: 140px;
    padding-bottom: 80px;
    overflow: hidden;
}


#client-portal a:link,
#client-portal a:visited {
    color: #c20430
}
#client-portal>.btn-large {
    float: right;
    margin-top: -15px
}
.news {
    background: #fff;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 40px;
    box-shadow: 0 0 7px 1px rgba(0, 0, 0, .1)
}
.resources {
    margin-top: 40px;
    margin-bottom: 40px
}
.close-modal {
    display: none;
    position: absolute;
    width: 100%;
    height: 7000px
}
.close-modal.showing {
    display: block
}
.btn {
    -webkit-transition: all 320ms ease-out;
    transition: all 320ms ease-out;
    border-radius: 4px;
    display: inline-block;
    padding: 8px 12px;
    background: #c20430;
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    text-decoration: none;
    text-align: center;
    line-height: normal;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    position: relative;
    border: none;
}



.btn:hover {
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}
.btn:after {
    position: absolute;
    top: 0;
    left: 0;
    content: ' ';
    height: 100%;
    width: 100%
}
.btn:hover {
    background: #a9032a;
    color: #fff
}
.btn:active {
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    background: #9a0326;
    color: #eee;
    -webkit-transform: scale(.98) translate(0, 1px);
    transform: scale(.98) translate(0, 1px)
}
.btn.blue {
    background: #ccf6fe;
    color: #000;
}
.btn.blue:hover {
    background: #a9032a;
    color: #fff;
}
.btn.blue:active {
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    background: #9a0326;
    color: #eee;
    -webkit-transform: scale(.98) translate(0, 1px);
    transform: scale(.98) translate(0, 1px)
}
.btn-large {
    background: #c0dbe3;
    font-family: Lato, sans-serif;
    font-size: 32px;
    padding: 6px 8px;
    border-radius: 7px;
    text-decoration: none;
    color: #fff
}
.btn-large:hover {
    background: #c20430
}
.btn-large:active {
    background: #a9032a
}
.ctrl {
    position: absolute;
    top: 50%;
    margin: -21px -39px;
    z-index: 5;
    width: 868px
}
.ctrl:after,
.ctrl:before {
    display: table;
    content: "";
    line-height: 0
}
.ctrl:after {
    clear: both
}
.ctrl .next,
.ctrl .prev {
    list-style: none;
    float: right
}
.ctrl .next a,
.ctrl .prev a {
    -webkit-transition: all 320ms ease-out;
    transition: all 320ms ease-out;
    position: relative;
    width: 40px;
    height: 40px;
    background: #c20430;
    color: #fff;
    text-align: center;
    line-height: 40px;
    font-size: 44px;
    display: block;
    text-decoration: none
}
.ctrl .next a:hover,
.ctrl .prev a:hover {
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}
.ctrl .next a:after,
.ctrl .prev a:after {
    position: absolute;
    top: 0;
    left: 0;
    content: ' ';
    height: 100%;
    width: 100%
}

.ctrl .next a:active,
.ctrl .prev a:active {
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    background: #9a0326;
    color: #eee;
    -webkit-transform: scale(.966);
    transform: scale(.966);
    opacity: .9
}
.ctrl .prev {
    float: left
}
.ctrl .hidden a {
    -webkit-transform: scale(.1);
    transform: scale(.1);
    opacity: 0;
    pointer-events: none
}
.red-emph {
    font-size: 26px;
    font-weight: 400;
    color: #c20430
}
.col-half {
    float: left;
    padding-left: 30px;
    width: 470px
}
.col-half:first-of-type {
    padding-left: 0
}
.col-third-wrapper {
    
    max-width: 790px
}
.col-third-wrapper .col-third {
	width: 100%;
	margin-bottom: 20px;
}

@media(min-width: 768px){
	.col-third-wrapper .col-third {
	    float: left;
	    padding-left: 38px;
	    width: 33.33%;
	    border-left: 1px dotted #c20430;
	    margin-bottom:0;
	}
}

.col-third-wrapper .col-third:first-of-type {
    border-left: none;
    padding-left: 0;
}
.tooltip {
    -webkit-transition: all 140ms ease-in;
    transition: all 140ms ease-in;
    box-shadow: 0 0 1px 1px rgba(255, 255, 255, .6), 3px 3px 7px rgba(10, 10, 10, .33);
    position: absolute;
    background: #fefdfe;
    padding: 17px;
    opacity: 0;
    cursor: default;
    pointer-events: none
}
.tooltip:hover {
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}
.show .tooltip,
.tooltip.show {
    opacity: 1;
    -webkit-transform: scale(1)!important;
    transform: scale(1)!important;
    cursor: auto;
    pointer-events: auto
}
.tooltip:before {
    width: 42px;
    height: 28px;
    background: url(img/tooltip-pip.png) bottom center no-repeat;
    position: absolute;
    top: -27px;
    left: 40px;
    z-index: 5;
    content: " "
}
.tooltip .inner {
    border: 1px dotted #c20430;
    padding: 21px;
    position: relative
}
.tooltip .close {
    -webkit-transition: all 320ms ease-out;
    transition: all 320ms ease-out;
    position: absolute;
    top: 7px;
    right: 7px;
    text-align: center;
    width: 22px !important;
    height: 22px !important;
    line-height: 22px;
    background: #c20430;
    color: #fff;
    text-decoration: none
}
.tooltip .close:hover {
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}
.tooltip .close:hover {
    font-weight: 700
}
.tooltip .close:active {
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    background: #9a0326;
    -webkit-transform: scale(.93);
    transform: scale(.93)
}
.tooltip h2 {
    color: #c20430;
    font-family: Lato, sans-serif;
    font-weight: 400;
    font-size: 24px;
    margin-bottom: .365em
}
#main-header {
    height: 149px;
    background: url(img/TOP_NAVIGATION_CLOUD_REPEAT.png) top center repeat-x;
    background-image: url(img/TOP_NAVIGATION_CLOUD_REPEAT.png), url(img/TOP_NAVIGATION_CLOUD_REPEAT.png);
    background-position: 50px top, 562px top;
    background-repeat: repeat-x
}

#logo {
    text-indent: -9999px;
    overflow: hidden;
    width: 213px;
    height: 46px;
    background: url(img/logo.png) center no-repeat;
    background-size: contain;
}

#main-header .btn {
	margin-right: 3px;
}

@media (max-width: 400px) {
	#main-header .btn {
		padding: 6px;
	}
	
	#main-header .btn svg {
		display:none;
	}
}

@media (min-width: 500px) {
	#main-header .btn {
		min-width: 75px;
	}
}

@media (min-width: 992px) {
	.navbar-expand-lg {
		margin-left: -15px;
		margin-right: -15px;
	}
}

.wp-social-link a,
.wp-social-link a:active,
.wp-social-link a:hover,
.wp-social-link a:visited,
.wp-social-link svg {
    color: currentColor;
    fill: currentColor;
}

.wp-social-link {
	padding-top: .4rem;
    width: 24px;
    height: 24px;
}

.wp-social-link-facebook {
    color: #1977f2;
}

.wp-social-link-twitter {
    color: #21a1f3;
}

.wp-social-link-instagram {
    color: #f00075;
}

.wp-social-link-linkedin {
    color: #0577b5;
}

.wp-social-link > a {
    transition: all 320ms ease-out;
}

.wp-social-link > a:hover,
.wp-social-link > a:focus {
    transition: all .1s ease-out;
    transform: scale(1.2);
}


#main-nav .navlink {
    -webkit-transition: all 220ms ease-out;
    transition: all 220ms ease-out;
    font-size: 15px;
    text-decoration: none;
    position: relative;
    text-shadow: 2px 2px 6px #fff, -2px -2px 6px #fff
}
#main-nav .navlink:hover {
    -webkit-transition: all 80ms ease-in;
    transition: all 80ms ease-in
}
#main-nav .navlink::after,
#main-nav .navlink::before {
    -webkit-transition: all 220ms ease-out;
    transition: all 220ms ease-out;
    margin: -1px -3px;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 130%;
    height: 180%;
    background: rgba(255, 255, 255, .9);
    border-radius: 50%;
    content: '';
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(.2);
    transform: translateX(-50%) translateY(-50%) scale(.2);
    z-index: -1
}
#main-nav .navlink::after:hover,
#main-nav .navlink::before:hover {
    -webkit-transition: all 80ms ease-in;
    transition: all 80ms ease-in
}
#main-nav .navlink::after {
    margin: 7px 8px;
    width: 110%;
    height: 110%;
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(7deg) scale(.8);
    transform: translateX(-50%) translateY(-50%) rotate(7deg) scale(.8)
}
#main-nav .nav-link.active,
#main-nav .nav-link:hover {
    color: #c20430
}
#main-nav .site .active a::after,
#main-nav .site .active a::before,
#main-nav .navlink:hover::after,
#main-nav .navlink:hover::before {
    opacity: 1;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1)
}
#main-nav .social .facebook a,
#main-nav .social .instagram a,
#main-nav .social .twitter a {
    text-indent: -9999px;
    overflow: hidden;
    background: url(img/social-icons.png) top left no-repeat;
    width: 31px;
    height: 31px;
    margin-left: 12px
}
#main-nav .social .facebook a {
    background-position: -31px 0;
    width: 30px
}
#main-nav .social .twitter a {
    background-position: top right;
    width: 30px
}


@media(max-width: 991px){
	.navbar-nav {
		background: #fff;
		padding: 20px;
	}
	
	.wp-social-link {
		display:inline-block;
		width: 20%;
		margin: 2%;
		float: left;
	}
}



.section-about #main-nav .about,
.section-contact #main-nav .contact,
.section-flavours #main-nav .flavours,
.section-home #main-nav .home,
.section-packing #main-nav .packing,
.section-products #main-nav .products,
.section-services #main-nav .services {
    color: #c20430
}
#home {
    background: url(img/HOME_BANNER_IMAGE_SLICE.jpg) 0 1px;
}

@media(max-width: 992px){
 	#home {
 		padding-top: 100px !important;
 	}
 }

#home #carousel li {
    width: 100%
}
#home #carousel li img {
    margin: auto
}
#home #carousel .intro-banner {
    background: url(img/HOME_BANNER_IMAGE_SLICE.jpg) 0 1px
}
#home #carousel .environmental-banner {
    background: #ccf6fe
}
#faq {
	padding-top: 250px;
	padding-bottom: 50px;
}


#client-portal {
}

#client-portal.success .title,
#client-portal.success .upper-nav {
    display: none
}
#client-portal h3 {
    font-family: 'Bemio Italic', sans-serif;
    text-transform: uppercase;
    font-size: 1.6em;
    color: #c20430;
    margin-top: 50px;
}

#client-portal .news h3 {
	margin-top:0;
}

@media (max-width: 767px) {
	#client-portal .news h3 {
		font-size: 1em;
		hyphens: auto;
	}
}


#client-portal h3 + h4 {
    font-size: 1.4em;
    color: #c20430;
    margin: 20px 0;
    font-weight: bolder

}

#client-portal h4 {
    font-size: 20px;
    margin-bottom: 20px
}
#client-portal h5 {
    color: #c20430;
    font-weight: bolder
}
#client-portal img {
    margin-bottom: 20px
}

#client-portal .btn-large, #client-portal .btn {
    background: #c20430;
    text-decoration: none;
    color: #fff !important;
    font-weight: 300;
    font-size: 1.1em;
    padding: 15px 30px;
    border: none;
    float:right;
    text-align: center;
}

@media (max-width: 767px){

	#client-portal .btn-large, #client-portal .btn {
		clear: both;
		float:none;
		display: block;
		
	}
}

#client-portal ul {
    margin-left: 6px;
    color: #c20430
}
#client-portal ul>li {
    list-style: none
}
#client-portal ul a {
    margin-bottom: 14px;
    display: inline-block
}
#client-portal ul a:before {
    display: inline-block;
    content: url(/template/style/img/document-file-pdf.svg);
    height: 25px;
    width: 25px;
    margin-right: 15px;
    vertical-align: text-bottom
}
#client-portal .error {
    padding: 8px 16px;
    border: 2px solid #c20430;
    color: #c20430;
    background: #fff;
    margin-top: 18px
}
#client-portal .form-message-fail {
    display: none
}
#client-portal .login {
    background: #fff;
    padding: 20px;
    margin: 40px auto;
    box-shadow: 0 0 7px 1px rgba(0, 0, 0, .1);
    width: 90%;
    max-width: 500px;
}



#client-portal .login:after,
#client-portal .login:before {
    display: table;
    content: "";
    line-height: 0
}
#client-portal .login:after {
    clear: both
}
#client-portal .login .btn {
    float: right;  
}
#client-portal .login-box {
    width: 100%;
    margin: 0 auto 20px;
}
#client-portal .login-box th,
#client-portal .login-box td{
	padding-bottom: 20px;
}

#client-portal .login-box th {
    text-align: right;
    width: 30%;
    font-weight: 400;
    padding-right: 15px;
}
#client-portal .login-box input[type=text],
#client-portal .login-box input[type=email],
#client-portal .login-box input[type=password] {
    width: 100%;
    border: 2px solid #c20430;
    font-size: 16px;
    font-weight: 400;
    text-align: left
}
#client-portal .form-message-success {
    display: none
}
#client-portal .form-message-success h2 {
    font-family: 'Bemio Italic', sans-serif
}
#client-portal .form-message-success p {
    font-size: 20px;
    padding: 30px 8px;
    max-width: 80%
}
table {
    width: 100%
}
fieldset {
    border: none
}
thead>tr>th {
    color: #c20430;
    text-align: center;
    padding: 10px;
    border-bottom: 1px dotted rgba(194, 4, 48, .2)
}
.flavourName {
    text-align: left;
    font-weight: 400;
    padding: 15px 10px;
    color: #c20430;
    border-bottom: 1px dotted rgba(194, 4, 48, .2)
}


@media (max-width: 767px) {

	fieldset.news {
		padding: 10px;
	}


	thead>tr>th {
		padding: 10px 7px;
		font-size: 15px;
	}
	
	thead>tr>th.product-category,
	.flavourName {
		padding-left: 0 !important;
		font-size: 15px;
		hyphens: auto;
	}

	fieldset>table>tbody>tr>td {
		padding: 10px 7px;
	}

}


fieldset>table>tbody>tr>td {
    border-bottom: 1px dotted rgba(194, 4, 48, .2);
    border-left: 1px dotted rgba(194, 4, 48, .2);
    padding: 10px;
    text-align: center;
    color: #CCC;
    height: 40px
}
legend {
    display: inline;
    color: #c20430
}
th.product-category {
    text-align: left
}
input[type=text],
input[type=email],
input[type=password],
input[type=number] {
    border: 1px solid rgba(194, 4, 48, .55);
    padding: 2px;
    width: 50px;
    font-weight: 700;
    text-align: center;
    font-size: 16px
}

@media(max-width: 767px) {
	input[type=number] {
		width: 30px;
	}
}

tr.primary>td>input.primary,
tr.secondary>td>input.secondary {
    border: 2px solid rgba(194, 4, 48, .7)
}
input[type=text]:focus,
input[type=number]:focus {
    border: 1px solid rgba(194, 4, 48, .7);
    box-shadow: 0 0 5px rgba(194, 4, 48, .4)!important
}
input[type=text]:disabled,
input[type=number]:disabled {
    background: #f1f1f2;
    border: 1px solid #f1f1f2;
    color: #f1f1f2
}
.notes {
    color: #c20430
}
.notes textarea {
    width: 100%;
    margin-top: 16px
}

tr.primary>th,
tr.secondary>th {
    font-weight: 900
}
tr.primary>th.flavourName::after,
tr.secondary>th.flavourName::after {
    content: url(img/checkmark.svg);
    padding-left: 12px;
    display: inline-block;
    width: 25px;
    vertical-align: middle
}
#about {
    background: #ede2ea url(/template/style/img/ABOUTUS_BACKGROUND.jpg) bottom right no-repeat;
    background-size: contain;
} 

@media(max-width: 767px){
	#about {
		padding-bottom: 120px;
	}
	
	.col-12 + .col-12 {
		padding-top: 50px;
	}
}

#about .hours table {
    margin-bottom: 1.7em;
    border-collapse: collapse;
    width: 100%
}
#about .hours td,
#about .hours th {
    padding: 4px 0;
    line-height: 1.5em;
    font-weight: 400;
    border-bottom: 1px solid #877e83;
    vertical-align: bottom
}
#about .hours th {
    text-align: left
}
#about .hours td {
    text-align: right;
    width: 114px
}
#about .hours caption {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: .75em;
    text-align: left;
    caption-side: top;
}
#about .tooltip {
    left: 260px;
    bottom: 40px
}
#about .tooltip:before {
    display: none
}
#about .tooltip .info {
    font-size: 14px
}
#about #news {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none
}
#about #news:target .tooltip {
    pointer-events: all;
    opacity: 1
}
#about #newsButton {
    padding-left: 24px
}
#about #newsButton .title {
    background: #f8fafc;
    font-family: Lato, sans-serif;
    display: block;
    margin: -6px -8px -6px 30px;
    line-height: 3.1;
    padding: 6px 16px;
    font-size: .45em;
    color: #020202;
    float: right;
    border-radius: 0 14px 14px 0;
    width: 200px;
    text-align: left
}
#about-statement {
    margin-bottom: 1.216em;
    font-weight: 400
}
#products {
    background: #f3f4f7 url(/template/style/img/PRODUCTS.jpg) bottom right no-repeat;
    background-size: contain;
}

@media(max-width: 767px) {
	#products {
	    background-size: cover;
	}
}

#products .cor-logo {
    float: right;
    width: 113px;
    height: 75px;
    background: url(img/COR_DAIRY_FARMERS.png) no-repeat;
    background-size: 100%;
    margin-top: 10px;
}

#products ul {

}

#products ul {
    margin: auto;
    max-width: 623px;
    display: block;
    overflow: hidden;
    padding-bottom: 350px;
}

@media(min-width: 768px) {
	#products ul {
	    padding-bottom: 400px;
	}
}



#products .product {
    list-style: none;
    float: left;
    margin: 60px 0 0 45px;
    position: relative
}
#products .product h2 {
    font-family: 'Bemio Italic', Lato, sans-serif
}
#products .product:first-of-type {
    margin-left: 0
}
#products .product>a {
    border-radius: 50%;
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    width: 122px;
    height: 122px;
    background: center no-repeat #c0dbe3;
    box-shadow: 0 0 1px #c0dbe3 inset;
    -webkit-transition: background 180ms ease-out, box-shadow .4s ease-out, -webkit-transform 140ms ease-in, opacity 140ms ease-in;
    -webkit-transition: background 180ms ease-out, box-shadow .4s ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, transform 140ms ease-in, opacity 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, transform 140ms ease-in, opacity 140ms ease-in, -webkit-transform 140ms ease-in
}
#products .product>a:hover,
#products .product.show > a {
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, -webkit-transform 140ms ease-in, opacity 140ms ease-in;
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 140ms ease-in, opacity 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 140ms ease-in, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    background-color: #c20430;
    box-shadow: 0 0 14px #c20430 inset
}
#products .product>a:active {
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, -webkit-transform 35ms linear, opacity 35ms linear;
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 35ms linear, -webkit-transform 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 35ms linear, -webkit-transform 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 35ms linear, opacity 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 35ms linear, opacity 35ms linear, -webkit-transform 35ms linear;
    opacity: .88;
    -webkit-transform: scale(.97);
    transform: scale(.97)
}

#products .tooltip {
	margin-top: 20px;
}

@media(min-width: 768px){

	#products .tooltip {
	    top: 170px;
	    margin-top:0;
	    width: 306px;
	}
}

@media(max-width: 767px){
	#products ul {
		position: relative 
	}
	
	#products .product {
		position: static;
		margin-left: 0;
		width: 25%;
		text-align: center;
	}
	
	#products .product a{
		width: 56px;
		height: 56px;
	}

	#products .tooltip {
		right: 0;
		width: 100%;
	}
	
	#products .tooltip:before {
		display:none;
	}
	
	#products .tooltip a.btn {
		width: auto;
		height: auto;
	}
}

#products .tooltip .info ul {
    margin-bottom: 1em
}
#products .tooltip .info ul li {
    margin-left: 1.25em;
    list-style: disc;
    font-weight: 300;
    line-height: 1.65;
    font-size: 18px
}
#products .frozen-dessert .tooltip,
#products .sundeas .tooltip {
	right: 0;
}
#products .frozen-dessert .tooltip:before,
#products .sundeas .tooltip:before {
	left: auto;
	right: 40px;
}

#products .ice-cream>a {
    background-image: url(img/product_ice-cream.png);
    background-position: center 45%;
    background-size:80%;
}
#products .ice-cream .inner:after,
#services .custom_dreams .inner:after {
    background: url(img/DAIRY_STAMP_ICON.png) bottom right no-repeat;
    background-size: 40px;
    content: '';
    width: 40px;
    height: 41px;
    position: absolute;
    bottom: 18px;
    right: 18px;
}
#products .novelties>a {
    background-image: url(img/product_novelties.png);
    background-position: center 45%;
    background-size:80%;
}
#products .sandwiches>a {
    background-image: url(img/product_sandwiches.png);
    background-position: center 45%;
    background-size:50%;
}
#products .sundeas>a {
    background-image: url(img/product_sundaes.png);
    background-position: center 48%;
    background-size:80%;
}
#products .frozen-dessert>a {
    background-image: url(img/product_frozen-dessert.png);
    background-size:80%;
}
#product-statement {
    font-size: 17px;
    font-weight: 300;
    margin-bottom: 1.216em
}
.upper-nav {
    float: right
}

#flavours {
    background: url(img/FLAVOURS_Background_REPEAT.jpg) top repeat-x #eddcca;
}


#flavours .ctrl {
    position: absolute;
    top: 50%;
    right: 40px;
    margin-top: -48px;
    z-index: 5;
    width: 40px;
    height: 92px;
    z-index: 20;
}
#flavours .ctrl:after,
#flavours .ctrl:before {
    display: table;
    content: "";
    line-height: 0
}
#flavours .ctrl:after {
    clear: both
}
#flavours .ctrl .next a,
#flavours .ctrl .prev a {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}
#flavours .ctrl .next a:active,
#flavours .ctrl .prev a:active {
    -webkit-transform: rotate(90deg) scale(.966);
    transform: rotate(90deg) scale(.966)
}
#flavours .ctrl .next {
    margin-top: 13px
}
#flavours .ctrl .prev {
    float: right
}
#flavours .ctrl .disabled a,
#flavours .ctrl.hidden a {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: .3;
    pointer-events: none;
    cursor: default;
}
#flavours .ctrl.hidden a {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0
}
#flavours #flavoursBg {
    background: url(img/FLAVOURS_Background_REPEAT.jpg) top repeat-x;
    height: 1088px;
    width: 130%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

#flavours .filter {
    width: 148px;
    margin: 0 auto;
}
#flavours nav {
    clear: both
}

#flavours label {
	margin-right: 6px;
}
#flavours select { 
	display: inline-block;
	margin: 0;
}

#flavours nav ul.categories {
	display: none;
}


@media(min-width: 1023px) {

	#flavours nav ul.categories {
	    display: block;
	    font-size: 12px;
	}
	
	#flavours select,
	#flavours label {
		display: none;
	}
}




}

#flavours .btn.two-line {
    padding: 3px;
    line-height: 1;
    height: 25px
}
#flavours #ingredients-btn {
    float: right
}
#flavours .categories {
    margin: 20px 0 5px;
}
#flavours .categories:after,
#flavours .categories:before {
    display: table;
    content: "";
    line-height: 0
}
#flavours .categories:after {
    clear: both
}
#flavours .categories li {
    list-style: none;
    float: left;
    width: 158px;
    margin-bottom: 8px;
}
#flavours #flavour-model {
    opacity: 0;
    position: absolute;
    background: url(img/COR_DAIRY_ICON.png) 498px 98% no-repeat rgba(255, 255, 255, .94);
    background-size: 6%;
    width: 100%;
    max-width: 600px;
    z-index: 500;
    padding: 48px 30px;
    pointer-events: none;
    box-shadow: 4px 4px 12px rgba(0, 0, 0, .4);
    top: 20px;
}

@media(min-width: 767px) {
	#flavours #flavour-model {
	    top: 50%;
	    left: 50%;
	    margin: -30% -269px;
	}
}
#flavours #flavour-model.show {
    -webkit-transition: all 180ms ease-in;
    transition: all 180ms ease-in;
    opacity: 1;
    pointer-events: auto
}
#flavours #flavour-model.show:hover {
    -webkit-transition: all 140ms ease-out;
    transition: all 140ms ease-out
}
#flavours #flavour-model .info {
    -webkit-transition: all 180ms ease-in;
    transition: all 180ms ease-in;
    display: block;
    width: 100%;
}
#flavours #flavour-model .info:hover {
    -webkit-transition: all 140ms ease-out;
    transition: all 140ms ease-out
}
#flavours #flavour-model .info.hide {
    opacity: 0
}
#flavours #flavour-model .close {
    -webkit-transition: all 320ms ease-out;
    transition: all 320ms ease-out;
    position: absolute;
    top: 12px;
    right: 9px;
    text-align: center;
    width: 22px;
    height: 22px;
    line-height: 22px;
    background: #c20430;
    color: #fff;
    text-decoration: none
}
#flavours #flavour-model .close:hover {
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out
}
#flavours #flavour-model .close:hover {
    font-weight: 700
}
#flavours #flavour-model .close:active {
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    background: #9a0326;
    -webkit-transform: scale(.93);
    transform: scale(.93)
}
#flavours #flavour-model h2 {
    font-weight: 400;
    font-size: 26px
}

#flavours #flavour-model .left-column img {
	margin: 0 auto 40px auto;
	display: block;
}

@media (min-width: 768px) {

	#flavours #flavour-model .left-column {
	    float: left;
	    width: 48%;
	    min-height: 282px;
	}

	#flavours #flavour-model .left-column img {
		width: 100% !important;
		max-width: 233px;
		height: auto !important; 
		margin: 0;
	}


	#flavours #flavour-model .right-column {
	    float: right;
	    width: 48%;
	    height: auto
	}
}
#flavours #flavour-model .right-column .notices {
    text-indent: -9999px;
    list-style-type: none;
    margin-top: 20px
}
#flavours #flavour-model .right-column .notices li {
    background-size: 100%;
    background-repeat: no-repeat;
    width: 48px;
    height: 59px;
    float: left;
    margin-right: 10px
}
#flavours #flavour-model .right-column .notices .peanut-free {
    background-image: url(img/PEANUT_FREE_ICON.png)
}
#flavours #flavour-model .right-column .notices .wheat-free {
    background-image: url(img/WHEAT_FREE_ICON.png)
}
#flavours #flavour-model .right-column .notices .soy-free {
    background-image: url(img/SOY_FREE_ICON.png)
}
#flavours #flavour-model .right-column .notices .canadian-dairy{
    background-image: url(img/DAIRY_STAMP_ICON.png)
}
#flavours #flavour-model .right-column .flavour-description ul {
    list-style-position: inside
}
#flavours #flavour-model .flavour-description {
    font-weight: 300
}
#flavours .categories li .active {
    font-weight: 700
}
#flavours .cat-platinum_dreams .active {
    background-color: #ededef;
    color: #686875
}
#flavours .cat-golden_dreams .active {
    background-color: #dfba69;
    color: #664d16
}
#flavours .cat-silver_dreams .active {
    background-color: silver;
    color: #414141
}
#flavours .cat-bronze_dreams .active {
    background-color: #e69e2f;
    color: #2a1c05
}
#flavours .cat-light_dreams .active {
    background-color: #dcf7f3;
    color: #1e8374
}
#flavours .cat-frozen_dessert .active {
    background-color: #c4d6e2;
    color: #345469
}
#flavours .cat-sherbet_dreams .active {
    background-color: #f5a2a2;
    color: #720c0c
}
#flavours .cat-yogurt_dreams .active {
    background-color: #fcfbe3;
    color: #85800e
}
#flavours .cat-lactose_free .active {
    background-color: #feb89f;
    color: #832401
}
#flavours .cat-sundae_dreams .active {
    background-color: #c4d5b3;
    color: #445831
}
#flavours .cat-sandwiches .active {
    background-color: #cead82;
    color: #3a2b17
}
#flavours .cat-novelties .active {
    background-color: #d4b2e7;
    color: #582575
}
#flavours .flavours {
    position: relative;
    margin: 0 0 30px;
}

#flavours .flavours .viewport {
    position: relative;
    height: 470px;
    overflow: hidden;
    z-index: 10
}

@media(min-width: 768px) {
	#flavours .flavours .viewport {
	    height: 632px;
	}
}


#flavours .flavours #flavour-container {
    -webkit-transition: all 320ms ease-out;
    transition: all 320ms ease-out;
    position: absolute;
    top: 0;
    left: 0;
    margin: -6px;
    margin-top: -5px
}
#flavours .flavours #flavour-container:after,
#flavours .flavours #flavour-container:before {
    display: table;
    content: "";
    line-height: 0
}
#flavours .flavours #flavour-container:after {
    clear: both
}
#flavours .flavours .flavour-col {
    width: 158px;
    height: 632px
}
#flavours .flavours .flavour,
#flavours .flavours .intro {
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    width: 150px;
    height: 150px;
    border: 1px solid #fff;
    background-color: #c0dbe3;
    background-size: cover;
    background-position: center;
    list-style: none;
    display: none;
    margin: 8px 0 0 8px;
    box-shadow: 0 0 30px rgba(20, 20, 20, .15);
    position: relative;
    float: left
}
#flavours .flavours .flavour:hover,
#flavours .flavours .intro:hover {
    -webkit-transition: all 80ms ease-in;
    transition: all 80ms ease-in
}
#flavours .flavours .flavour.active,
#flavours .flavours .intro.active {
    opacity: .8;
    -webkit-transition: all 35ms linear;
    transition: all 35ms linear;
    -webkit-transform: scale(.96);
    transform: scale(.96)
}
#flavours .flavours .flavour>img,
#flavours .flavours .intro>img {
    position: absolute;
    top: 0;
    left: 0
}
#flavours .flavours .flavour[data-promotion] .banner,
#flavours .flavours .intro[data-promotion] .banner {
    background-repeat: no-repeat;
    width: 150px;
    height: 28px;
    display: block;
    position: relative;
    top: 0
}
[data-promotion=new] .banner {background-image: url(img/NEW_ICON.jpg)}
[data-promotion=improved] .banner {background-image: url(img/IMPROVED_ICON.jpg)}
[data-promotion="limited time"] .banner {background-image: url(img/LIMITED_TIME_ICON.jpg)}
[data-promotion=seasonal] .banner {background-image: url(img/SEASONAL_ICON.jpg)}
[data-promotion=foty] .banner {background-image: url(img/FOTY_ICON.jpg)}
#flavours .flavours .flavour>a,
#flavours .flavours .intro>a {
    box-sizing: border-box;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    display: block;
    width: 150px;
    height: 150px;
    text-decoration: none;
    text-align: center;
    font-family: Lato, sans-serif;
    font-size: 24px;
    text-shadow: 0 0 16px #fff;
    color: #c20430;
    padding: 10px;
    opacity: 0;
    background: rgba(255, 255, 255, .8);
    position: absolute;
    line-height: initial;
    top: 0
}
#flavours .flavours .flavour>a:hover,
#flavours .flavours .intro>a:hover {
    -webkit-transition: all 80ms ease-in;
    transition: all 80ms ease-in
}
#flavours .flavours .flavour>a:hover,
#flavours .flavours .intro>a:hover {
    opacity: 1;
    box-shadow: 0 0 60px 14px rgba(255, 255, 255, .6) inset
}
#flavours .flavours .flavour.intro>a,
#flavours .flavours .intro.intro>a {
    display: none
}
#flavours .flavours .flavour .btn,
#flavours .flavours .intro .btn {
    margin: 12px 4px;
    font-family: Lato, sans-serif;
    position: absolute;
    bottom: 8px;
    left: 9px;
}
#flavours .flavours .flavour .info,
#flavours .flavours .intro .info {
    display: none
}
#flavours footer div {
    font-size: 18px;
    height: 30px;
    line-height: 27px;
    float: left
}
#flavours footer .btn {
    display: inline-block;
    margin: -2px 20px
}

#flavours .disclaimer {
    color: #6b645c
}
#services {
    background: #e0ebef;
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, #fff), color-stop(100%, #c1dce4)) #c1dce4;
    background: -webkit-radial-gradient(center, ellipse contain, #fff 0, #c1dce4 100%) #c1dce4;
    background: -webkit-radial-gradient(closest-side ellipse at center, #fff 0, #c1dce4 100%) #c1dce4;
    background: radial-gradient(closest-side ellipse at center, #fff 0, #c1dce4 100%) #c1dce4;
    background-image: url(/template/style/img/services-bg.png);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#c1dce4', GradientType=1);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: contain;
}

#services .services .service .btn {
    left: 50%;
    margin-left: -62px;
    font-size: 12px;
    margin-top: 10px;
}
#services ul.services {
    margin: auto;
    max-width: 790px;
    display: block;
    padding-bottom: 400px;
    overflow: hidden;
}
#services .service {
    list-style: none;
    float: left;
    margin: 60px 0 0 45px;
    position: relative
}
#services .service h2 {
    font-family: 'Bemio Italic', Lato, sans-serif
}
#services .service:first-of-type {
    margin-left: 0
}
#services .service>a {
    border-radius: 50%;
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    width: 122px;
    height: 122px;
    background: center no-repeat #c20430;
    background-size: 85%;
    box-shadow: 0 0 14px #c20430 inset;
    -webkit-transition: background 180ms ease-out, box-shadow .4s ease-out, -webkit-transform 140ms ease-in, opacity 140ms ease-in;
    -webkit-transition: background 180ms ease-out, box-shadow .4s ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, transform 140ms ease-in, opacity 140ms ease-in;
    transition: background 180ms ease-out, box-shadow .4s ease-out, transform 140ms ease-in, opacity 140ms ease-in, -webkit-transform 140ms ease-in
}
#services .service>a:hover,
#services .service.show > a {
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, -webkit-transform 140ms ease-in, opacity 140ms ease-in;
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 140ms ease-in, opacity 140ms ease-in;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 140ms ease-in, opacity 140ms ease-in, -webkit-transform 140ms ease-in;
    background-color: #fff;
    box-shadow: 0 0 1px #666 inset
}
#services .service>a:active {
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, -webkit-transform 35ms linear, opacity 35ms linear;
    -webkit-transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 35ms linear, -webkit-transform 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, opacity 35ms linear, -webkit-transform 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 35ms linear, opacity 35ms linear;
    transition: background 110ms ease-in, box-shadow 130ms ease-out, transform 35ms linear, opacity 35ms linear, -webkit-transform 35ms linear;
    opacity: .88;
    -webkit-transform: scale(.97);
    transform: scale(.97)
}
#services .service.restaurant_needs > a {
    background-image: url(../img/services/restaurant_needs_thumb.png?v=1);
}
#services .service.restaurant_needs > a:hover,
#services .service.restaurant_needs.show > a {
    background-image: url(../img/services/restaurant_needs_thumb_hover.png);
}

#services .service.health_care > a {
    background-image: url(../img/services/health_care_thumb.png?v=1);
}
#services .service.health_care > a:hover,
#services .service.health_care.show > a {
    background-image: url(../img/services/health_care_thumb_hover.png);
}

#services .service.custom_dreams > a {
    background-image: url(../img/services/custom_dreams_thumb.png?v=1);
}
#services .service.custom_dreams > a:hover,
#services .service.custom_dreams.show > a {
    background-image: url(../img/services/custom_dreams_thumb_hover.png);
}

#services .service.catering > a {
    background-image: url(../img/services/catering_thumb.png?v=1);
}
#services .service.catering > a:hover,
#services .service.catering.show > a {
    background-image: url(../img/services/catering_thumb_hover.png);
}

#services .service.freezer_program > a {
    background-image: url(../img/services/freezer_program_thumb.png?v=1);
}
#services .service.freezer_program > a:hover,
#services .service.freezer_program.show > a {
    background-image: url(../img/services/freezer_program_thumb_hover.png);
}
#services .tooltip {
    top: 173px;
    max-width: 676px;
    -webkit-transform: scale(.4) translate(-34px, -150px);
    transform: scale(.4) translate(-34px, -150px)
}

#services .service:nth-child(2) .tooltip {left: -147px}
#services .service:nth-child(2) .tooltip:before {left: 187px}

#services .service:nth-child(3) .tooltip {left: -294px}
#services .service:nth-child(3) .tooltip:before {left: 334px}

#services .service:nth-child(4) .tooltip {left: -441px}
#services .service:nth-child(4) .tooltip:before {left: 481px}

#services .service:nth-child(5) .tooltip {left: -588px}
#services .service:nth-child(5) .tooltip:before {left: 628px}

@media (min-width: 768px) {
	#services .tooltip .info {
	    column-count: 2;
	}
}


@media(max-width: 789px){
	#services ul {
		position: relative 
	}
	
	#services .service {
		position: static;
		margin-left: 0;
		width: 20%;
		text-align: center;
	}
	
	#services .service a{
		width: 50px;
		height: 50px;
	}

	#services .tooltip {
		right: 0;
		left: 0 !important;
		width: 100%;
	}
	
	#services .tooltip:before {
		display:none;
	}
	
	#services .tooltip a.btn {
		width: auto;
		height: auto;
	}
}



#services .tooltip .info ul {
    margin-bottom: 1em
}
#services .tooltip .info ul li {
    margin-left: 1.25em;
    list-style: disc;
    font-weight: 300;
    line-height: 1.65;
    font-size: 18px
}

#service-statement {
    font-size: 17px;
    font-weight: 300;
    margin-bottom: 50px
}
#service-statement ul {
    margin-bottom: 1.216em
}
#service-statement ul li {
    list-style: none;
    margin-bottom: .5em;
    position: relative;
    padding-left: 20px;
}
#service-statement ul li:before {
    content: "\2022";
    color: #c20430;
    font-size: .9em;
    position: absolute;
    top: 0;
    left: 0;
}
#service-statement strong {
    font-weight: 400
}
#packing {
    background: #fbfbfb url(/template/style/img/CO_PACKING.jpg) bottom right no-repeat;
    background-size: contain;
}

@media(max-width: 992px){
	#packing {
		padding-bottom: 500px;
	}
}

@media(max-width: 767px){
	#packing {
		padding-bottom: 250px;
	}
}

#packing>.inner {
    height: 800px
}
img.brc {
    float: right;
	@media (min-width:769px) {
	    position: relative;
	    left: 320px;
	    top: 5px;
	}
}
p.img-p {
    margin: 0;
}
#packing-statement {
    font-weight: 400;
    margin-top: 12px
}
#contact {
    
    background: #e0ebef;
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, #fff), color-stop(100%, #c1dce4)) #c1dce4;
    background: -webkit-radial-gradient(center, ellipse contain, #fff 0, #c1dce4 100%) #c1dce4;
    background: -webkit-radial-gradient(closest-side ellipse at center, #fff 0, #c1dce4 100%) #c1dce4;
    background: radial-gradient(closest-side ellipse at center, #fff 0, #c1dce4 100%) #c1dce4;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#c1dce4', GradientType=1);
    background-position: 50% center;
    background-size: 50% 100%;
    background-repeat: no-repeat;
    position: relative;
}

#contact .col-third {
    height: 136px
}
#contact dl {
    line-height: 1.5;
    margin-bottom: -20px
}
#contact dl dt {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #c20430
}
#contact dl dd {
    font-size: 13px;
    font-weight: 300;
    margin-bottom: 20px
}
#contact .phone-numbers {
    margin-bottom: 40px
}
#contact .phone-numbers li {
    list-style: none;
    font-weight: 300;
    font-size: 14px;
    line-height: 1.4
}
#contact #gmap {
    display: block;
    height: 320px;
    overflow: hidden;
    position: relative;
    clear:both;
    margin: 20px -15px 0;
}
#contact #gmap img {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -1274px
}
#contact #dream-team {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

#contact #dream-team:before {
    display:none;
}


@media ( min-width:767px ) {

	#contact #dream-team {
	    max-width: 600px;
	    bottom: 360px;
	    left: 50%;
	    margin: 0 -300px;
	    z-index: 10;
	    -webkit-transform: scale(.4) translate(-120px, -150px);
	    transform: scale(.4) translate(-120px, -150px);
    	}


}


#contact #dream-team table {
    width: 100%;
    margin-top: 14px
}
#contact #dream-team .name {
    font-weight: 700;
}

@media(max-width: 767px) {

	#contact #dream-team td {
		display: block;
	}

	#contact #dream-team td.name {
		margin-top: 10px;
	}
}

#contact-statement {
    font-size: 17px;
    font-weight: 300;
    margin-bottom: 66px
}
#main-footer {
    background: #c20430;
    color: #fff;
    text-transform: uppercase
}

#main-footer>.inner {
    padding-top: 0;
    line-height: 32px;
    padding: 0 20px 2px;
}

#main-footer a, #main-footer a:hover {
    color: #fff;
}
.bx-wrapper {
    position: relative;
    margin: auto;
    padding: 0
}
.bx-wrapper img {
    max-width: 100%;
    display: block
}
.bx-wrapper .bx-controls-auto,
.bx-wrapper .bx-pager {
    position: absolute;
    bottom: 26px;
    width: 100%
}
.bx-wrapper .bx-loading {
    min-height: 50px;
    background: url(img/bx_loader.gif) center center no-repeat #fff;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2000
}
.bx-wrapper .bx-pager {
    text-align: center;
    font-size: .85em;
    font-family: Arial;
    font-weight: 700;
    color: #666;
    padding-top: 20px
}
.bx-wrapper .bx-controls-auto .bx-controls-auto-item,
.bx-wrapper .bx-pager .bx-pager-item {
    display: inline-block
}
.bx-wrapper .bx-pager.bx-default-pager a {
    background: #c67c97;
    text-indent: -9999px;
    display: block;
    width: 14px;
    height: 14px;
    margin: 0 4px;
    outline: 0;
    border-radius: 7px
}
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:hover {
    background: #c20430
}
.bx-wrapper .bx-prev {
    left: 10px;
    background: url(img/controls.png) no-repeat 0 -32px
}
.bx-wrapper .bx-next {
    right: 10px;
    background: url(img/controls.png) no-repeat -43px -32px
}
.bx-wrapper .bx-prev:hover {
    background-position: 0 0
}
.bx-wrapper .bx-next:hover {
    background-position: -43px 0
}
.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    outline: 0;
    width: 32px;
    height: 32px;
    text-indent: -9999px;
    z-index: 9999
}
.bx-wrapper .bx-controls-direction a.disabled {
    display: none
}
.bx-wrapper .bx-controls-auto {
    text-align: center
}
.bx-wrapper .bx-controls-auto .bx-start {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 11px;
    outline: 0;
    background: url(img/controls.png) -86px -11px no-repeat;
    margin: 0 3px
}
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:hover {
    background-position: -86px 0
}
.bx-wrapper .bx-controls-auto .bx-stop {
    display: block;
    text-indent: -9999px;
    width: 9px;
    height: 11px;
    outline: 0;
    background: url(img/controls.png) -86px -44px no-repeat;
    margin: 0 3px
}
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:hover {
    background-position: -86px -33px
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
    text-align: left;
    width: 80%
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
    right: 0;
    width: 35px
}
.bx-wrapper .bx-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #666\9;
    background: rgba(80, 80, 80, .75);
    width: 100%
}
.bx-wrapper .bx-caption span {
    color: #fff;
    font-family: Arial, sans-serif;
    display: block;
    font-size: .85em;
    padding: 10px
}
#accordion {
    margin: auto;
    width: 100%
}
#accordion ul {
    list-style: none;
    margin: 0;
    padding: 0
}
.accordion {
    display: none
}
.accordion:target {
    display: block
}

#accordion ul li {
	padding: 10px 0;
}

#accordion ul li a {
    text-decoration: none;
    display: block;
    padding: 4px 0
}
.accordion {
    padding: 4px 0px;
}
#accordion ul li h2 {
    display: inline-block;
    color: #000;
    margin-bottom: 10px;
    font-size: 1.2em;
    -webkit-transition: all 220ms ease-out;
    transition: all 220ms ease-out
}
#accordion ul li h2:after {
    content: ' ';
    display: inline-block;
    width: 23px;
    height: 30px;
    background: url(img/arrow.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    margin-left: 8px;
    margin-bottom: -5px
}
#accordion ul li.show .accordion,
#accordion ul li:target .accordion {
    display: block
}
#accordion ul a:hover h2,
#accordion ul li.show h2,
#accordion ul li:target h2 {
    -webkit-transition: all 80ms ease-in;
    transition: all 80ms ease-in;
    color: #c20430
}
#accordion ul li.show h2:after,
#accordion ul li:target h2:after {
    background-position: top right
}
.accordion {
    background: 0 0;
    color: #020202
}