body {
    -webkit-font-smoothing:antialiased;
}
.static-content blockquote {
    color:#f0a900;
    font-style:italic;
    font-size:28px;
    margin-left: 22px;
    margin-bottom: 1.2em;
}                    
.static-content p {
    margin-bottom: 0.5em; 
    line-height:1.3em;
}                    
.static-content p.instructions {
    font-family:'lato',sans-serif; 
    color:#999; 
    line-height:1.5em;
}                    
.static-content-header {
    font-size:2em; 
    margin:0 auto 1.5em auto; 
    font-family: 'LondonTwo', sans-serif; 
    color:#f0a900; 
    letter-spacing:0px; 
    text-transform: uppercase; 
    height:auto; 
    line-height:1.2em;
}                    
.static-content h3 {
    font-family: Garamond, 'Garamond Regular', serif;
    font-size:28px; color:#f0a900; 
    text-transform:uppercase; 
    margin:0 0 20px 0; 
    letter-spacing:2px;
}                    
.static-content h4 {
    font-family: Garamond, 'Garamond Regular', serif;
    font-size:20px; 
    font-style: italic;
    font-weight:bold;
    color:#402020;
    margin-bottom:1%;   
    letter-spacing:2px;
} 
/*Top Banner*/         
#slideshow{
    height:auto;
}
#slideshow .flex-prev {
    left:-70px;
}
#slideshow .flex-next {
    right:-70px;
}  
#slideshow img {
    z-index: 0;
    position: relative;
}
#banner {
    width: 100%;
    background-image: url("/images/almondtoffee_banner.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 2%;
}
#banner img {
    width: 0;
    visibility: hidden;
}
#banner_copy {
    width: 25%;
    padding-left: 68.5%;
}
#banner_copy h2 {
    color: #402020;
    font-size: 25px;
    text-align: center;
    padding-top: 34%;
}
#banner_copy hr {
    width:16%;
    border-top:2px solid #9E5E2B;
    background-color:#9E5E2B; 
}
#banner_copy h3 {
    color: #402020;
    font-size: 24px;
    padding-top: 2%;
    padding-left: 13%;
    padding-right: 13%;
    font-style: italic;
    text-align: center;
}
#banner_copy #banner_button {
    width: 70%;
    padding-left: 15%;
    padding-right: 15%;
    padding-top: 7%;
    padding-bottom: 10%; 
    visibility: visible;
}
.hero-article {
    text-align:center;
}                    
.hero-article .static-content-header {
    text-align:left;
}                    
.hero-article .featured-image img {
    width:100% !important; 
    height:auto !important;
}                    
.hero-article .columns {
    width:100%;
    text-align:left; 
    overflow:hidden;
    display: inline-block;
} 
/*Subscribe form*/
.hero-article #subscribeform {
    width: 100%;
    padding-top: 4%;
    padding-bottom: 4%;
}
.formheader {
    width: 32%;
}
.formheader h2 {
    font-size: 30px;
    color: #402020;
    padding-left:0%;
    text-align: right;
}
.formheader h3 {
    font-size: 20px;
    color: #9E5E2B; 
    font-style: italic;
    padding-top: 3%;
    text-align: right;
}
#mc_embed_signup {
    padding-left:37%;
    width: 70%;
    margin-top: -8%;
}
#mc-embedded-subscribe-form input{
    vertical-align: middle;
    width: 20%;
    margin: 2% 10px 5px 0;
    padding: 10px;
    background-color: #fff;
    border: none;
    border-bottom: 1px solid #9E5E2B;
    font-size: 18px;
    font-style: normal;
    text-align: left;
}
#mc-embedded-subscribe-form  #mce-EMAIL {
    width: 25%;
}
#mc-embedded-subscribe-form #mc-embedded-subscribe {
    width: 10%;
    border: 1px solid #9E5E2B;
    color: #9E5E2B;
    font-family:'lato', sans-serif; 
    font-size:12px; 
    margin-top: -6%; 
    margin-left:79%; 
    padding: 0.5% 2%;
    text-align: center;
}
::placeholder {
    color: #9E5E2B;
    font-style: italic;
    font-family: Garamond, 'Garamond Regular', serif;
}
.required {
    color: #402020;
    font-family: Garamond, 'Garamond Regular', serif;
    font-style: italic;
}
.response {
    font-size: 25px;
    padding-left: 22%;
    padding-top: 4%;
}
#mc_embed_signup div.mce_inline_error {
    background-color: #9E5E2B;
    margin-right: 44%;
}
/*Almond Toffee section*/
.hero-article #toffee_section {
    position: static;
    z-index: 0;
    background-color: #F5E8CD;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.hero-article #toffee_section img {
    width: 90%;
    padding-left: 5%;
    padding-top: 8%;
    padding-bottom: 8%;
}
.hero-article #toffee_section #toffee_copy {
    padding-top: 5%;
    padding-right: 4%;
    margin-left: 0;
    margin-right: 0;
}
.hero-article #toffee_section #toffee_copy #toffee_branch{
    width: 100%;
    padding-left: 5%;
    padding-top: 44%;
    padding-bottom: 0;
}
.hero-article #toffee_section h4 {
    color: #402020;
    margin-top: -109%;
    font-family:'lato',sans-serif; 
    font-size: 12px;
}
.hero-article #toffee_section h2 {
    color: #402020;
    font-size: 27px;
    padding-top: 2%;
}
.hero-article #toffee_section h3 {
    color: #fece5f;  
    font-size: 25px;
    font-style: italic;
    text-align: center;
    padding-top: 1%;
    padding-bottom: 0;
}
.hero-article #toffee_section hr {
    width:10%;
    margin-left: 0;
    border-top:2px solid #9E5E2B;
    background-color:#9E5E2B; 
}
.hero-article #toffee_section p {
    color: #402020;
    font-size: 21px;
    padding-top: 5%;
    padding-right: 2%;
    padding-left: 0%;
}
.hero-article #toffee_section .section_button {
    width: 40%;
    padding-left: 0%;
    padding-right: 34%;
    padding-top: 11%;
    padding-bottom: 0%; 
}
/*3 Images*/    
.hero-article #tripleImg img {
    width:90%;
    margin-top:-33%;
    padding-left: 4%;
}
.hero-article #tripleColumn, .hero-article #tripleImg {
    padding-left: 0;
    padding-right: 0;
    padding-top: 0%;
}
.hero-article #tripleImg {
    margin-bottom: 7%;
    margin-top: 0;
    position: relative;
    z-index: 1;
}
.hero-article #tripleColumn::after, .hero-article #tripleImg::after {
    content: "";
    clear: both;
    display:table;
}
.hero-article .columns .triColumn1, .hero-article .columns .triColumn2, 
.hero-article .columns .triColumn3, .hero-article .columns .triImg1,
.hero-article .columns .triImg2, .hero-article .columns .triImg3 {
    width:25%;
    margin-left:0;  
    margin-right:0;
    padding-top: 14%;
    padding-right: 1%;
    float: left;
}
.hero-article .columns .triImg1,.hero-article .columns .triImg2, 
.hero-article .columns .triImg3 {
    padding-left: 5%;
    padding-right: 2%;
} 
.hero-article #tripleImg a {
    text-decoration: none;
}
.hero-article #tripleImg h2 {
    color: #402020;
    font-size: 25px;
    text-align: center;
    padding-top: 5%;
}
/*Confections section*/
.hero-article #confection_section {
    position: static;
    z-index: 0;
    background-color: #F5E8CD;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.hero-article #confection_section img {
    width: 90%;
    padding-left: 5%;
    padding-top: 8%;
    padding-bottom: 8%;
}
.hero-article #confection_section #confection_img {
    margin-left: 0;
    margin-right: 0;
}
.hero-article #confection_section #confection_copy {
    padding-top: 5%;
    padding-left: 4%;
}
.hero-article #confection_section #desktop_confection {
    visibility: visible;
}
.hero-article #confection_section #mobile_confection {
    visibility: hidden;
    width: 0;
}
.hero-article #confection_section #confection_copy #confection_branch{
    width: 89%;
    padding-left: 16%;
    padding-top: 40%;
    padding-bottom: 0;
}
.hero-article #confection_section h4 {
    color: #402020;
    margin-top: -106%;
    font-family:'lato',sans-serif; 
    font-size: 12px;
}
.hero-article #confection_section h2 {
    color: #402020;
    font-size: 27px;
    padding-top: 2%;
}
.hero-article #confection_section h3 {
    color: #fece5f;  
    font-size: 25px;
    font-style: italic;
    text-align: center;
    padding-top: 1%;
    padding-bottom: 0;
}
.hero-article #confection_section hr {
    width:10%;
    margin-left: 0;
    border-top:2px solid #9E5E2B;
    background-color:#9E5E2B; 
}
.hero-article #confection_section p {
    color: #402020;
    font-size: 21px;
    padding-left: 0%;
    padding-right: 0%;
    padding-top: 5%;
}
.hero-article #confection_section .section_button {
    width: 40%;
    padding-left: 0%;
    padding-right: 34%;
    padding-top: 11%;
    padding-bottom: 0%; 
}
.hero-article .columns img {
    width:65%;
    padding-left:2%;
    padding-top:2%;
}              
.hero-article .columns .column {
    float:left; 
    width:45%;
}        
.hero-article .columns .column:nth-child(2) {
    margin-left: 4%; 
    margin-right: 4%;
}                    
.hero-article .columns .column:last-child {
    float:right;
}                    
.hero-article .columns .column img {
    max-width:150% !important; 
    height:auto !important;
}   
.hero-article .columns .column p {
    font-size:20px;
    color:#402020;
    line-height: normal;
}
#giftlink {
    width:100%;
    margin-top:4%;
    padding-top:7%;
    padding-bottom:8%;
    background-image: url("/images/truffle_calltoaction_banner.jpg");
    background-repeat: no-repeat;
    background-size: contain;
}
#giftlink .button {
    padding-left:41%;
    padding-right:41%;
    padding-top:2%;
}
#footer {
    margin-top:-2%;
}               
@media screen and (max-width: 1366px) {
    .container {
        padding:0 4%;
    }
    #slideshow {
        height:auto;
        width: 1150px;
    }
    #slideshow .flex-next {
        right: -45px;
    }
    #slideshow .flex-prev {
        left: -45px;
    }
    #bannerbutton {
        margin-top: -2%;
    }
    .hero-article #tripleImg {
        width:90%;
        padding-left:2%;
    }
    .hero-article #tripleImg img {
        width:95%;
        margin-top:-26%;
    }
    #phone-number {
        margin-left:10%;
    }
}
@media screen and (max-width: 1206px) {
    #slideshow {
        width: auto;
    }
    #banner {
        padding-bottom: 0;
    }
    #banner_copy h2 {
        font-size: 22px;
    }
    #banner_copy h3 {
        font-size: 18px;
        padding-left: 11%;
        padding-right: 11%;
    }
    #banner_copy #banner_button {
        width: 65%;
        padding-left: 17%;
        padding-right: 17%;
        padding-top: 9%; 
    }
    .formheader h2 {
        font-size: 26px;
    }
    .formheader h3 {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        font-size: 10px;
    }
    .hero-article #toffee_section h4, .hero-article #confection_section h4 {
        font-size: 10px;
    }
    .hero-article #toffee_section h2, .hero-article #confection_section h2 {
        font-size: 24px;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 19px;
    }
    .hero-article #tripleImg h2 {
        font-size: 20px;
    }
    #phone-number {
        margin-left:8%;
    }
}
@media screen and (max-width: 1024px) {
    #banner_copy #banner_button {
        padding-top: 5%;
    }
    .formheader h2 {
        font-size: 24px;
    }
    .formheader h3 {
        font-size: 15px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 14px;
    }
    #mc-embedded-subscribe-form #mce-EMAIL {
        width: 20%;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        font-size: 8px;
        margin-left: 77%;
    }
    .hero-article #toffee_section h2, .hero-article #confection_section h2 {
        font-size: 22px;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 16px;
    }
    .hero-article #tripleImg h2 {
        font-size: 17px;
    }
    #giftlink .button {
        padding-left:37%;
        padding-right:37%;
    }
    #phone-number {
        margin-left:2%;
    }
}
@media screen and (max-width: 960px) {
    .hero-desktop {
        display: block;
    }
    #banner {
        width: 100%;
        background-image: none;
    }
    #banner img {
        width: 60%;
        padding-left: 20%;
        padding-right: 20%;
        visibility: visible;
        position: relative;
        z-index: 0;
    }
    #banner #mobile_banner {
        width: 100%;
        padding: 0;
    }
    #banner #mobile_banner_color {
        width: 90%;
        padding-left: 5%;
        padding-right: 5%;
        height: 400px;
    }
    #banner_copy {
        margin-top: -55%;
        padding-left: 25%;
        width: 50%;
        position: relative;
        z-index: 1;
    }
    #banner_copy h2 {
        font-size: 43px;
        padding-top: 31%;
    }
    #banner_copy h3 {
        font-size: 33px;
        padding-left: 5%;
        padding-right: 5%;
    }
    #banner_copy #banner_button {
        padding-top: 10%;
    }
    .hero-article #subscribeform {
        padding-top: 5%;
    }
    .formheader {
        width: 80%;
        padding-left: 10%;
        padding-right: 10%;
    }
    .formheader h2 {
        font-size: 32px;
        padding-left:0;
        text-align: center;
    }
    .formheader h3 {
        font-size: 22px;
        text-align: center;
    }
    #mc_embed_signup {
        width: 80%;
        padding-left: 15%;
        padding-right: 5%;
        margin-top: 0%;
    }
    #name {
        padding-left: 0%;
    }
    #mc-embedded-subscribe-form input {
        font-size: 22px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        font-size: 13px;
        width: 12%;
    }
    .hero-article #toffee_section img {
        width: 70%;
        padding-left: 15%;
        padding-right: 15%;
        padding-bottom: 4%;
    }
    .hero-article #toffee_section #toffee_copy {
        padding-top: 0;
        margin-bottom: 0;
    }
    .hero-article #toffee_section #toffee_copy #toffee_branch {
        width: 60%;
        padding-left: 33%;
        padding-top: 30%;
        position: relative;
        z-index: 0;
    }
    .hero-article #toffee_section h4 {
        font-size: 13px;
        margin-top: 0;
        padding-left: 15%;
        position: absolute;
        z-index: 1;
    }
    .hero-article #toffee_section h2 {
        font-size: 24px;
        padding-left: 15%;
        padding-top: 3%;
        position: absolute;
    }
    .hero-article #toffee_section hr {
        position: absolute;
        width: 5%;
        margin-top: 6%;
        margin-left: 15%;
    }
    .hero-article #toffee_section p {
        font-size: 22px;
        padding-left: 15%;
        padding-top: 10%;
        padding-right: 20%;
        position: absolute;
    }
    .hero-article #toffee_section .section_button {
        width: 20%;
        padding-left: 18%;
        padding-top: 0%;
        margin-top: -24%;
    }
    .hero-article #tripleImg {
        width: 100%
    }
    .hero-article #tripleImg .buttons {
        padding-left: 0;
    }
    .hero-article .columns .triImg1, .hero-article .columns .triImg2,
    .hero-article .columns .triImg3 {
        width: 31%;
        padding-left: 1%;
        padding-right: 1%;
    }
    .hero-article #confection_section img {
        width: 70%;
        padding-left: 15%;
        padding-right: 15%;
    }
    .hero-article #confection_section #confectionImg {
        visibility: visible;
        width: 60%;
        padding-left: 20%;
        padding-right: 20%;
    }
    .hero-article #confection_section #confection_img {
        margin-bottom: -16%;
    }
    .hero-article #confection_section #confection_copy {
        width: 100%;
        padding-bottom: 0;
        padding-left: 0;
        margin-bottom: 0;
    }
    .hero-article #confection_section #desktop_confection {
        visibility: hidden;
        width: 0;
    }
    .hero-article #confection_section #mobile_confection {
        visibility: visible;
        width: 70%;
        padding-left: 15%;
        padding-right: 15%;
    }
    .hero-article #confection_section #confection_copy #confection_branch {
        width: 60%;
        padding-left: 33%;
        padding-top: 22%;
        position: relative;
        z-index: 0;
    }
    .hero-article #confection_section h4 {
        font-size: 13px;
        margin-top: 79%;
        padding-left: 12%;
        position: absolute;
        z-index: 1;
    }
    .hero-article #confection_section h2 {
        font-size: 24px;
        padding-left: 12%;
        padding-top: 82%;
        position: absolute;
    }
    .hero-article #confection_section hr {
        position: absolute;
        width: 5%;
        margin-top: 85%;
        margin-left: 12%;
    }
    .hero-article #confection_section p {
        font-size: 22px;
        padding-left: 12%;
        padding-top: 89%;
        padding-right: 20%;
        position: absolute;
    }
    .hero-article #confection_section .section_button {
        width: 20%;
        padding-left: 14%;
        padding-top: 7%;
        margin-top: -30%;
    }
    .hero-article .columns img {
        padding-left:0;
        width:100%;
    }
    .hero-article .columns .column img {
        width:100%; 
        height:auto !important; 
        float:left; 
        margin-right: 1em;
    }                             
    .hero-article .columns .column:nth-child(even) img {
        float:left; 
        margin-right: 0;
    }                             
    .hero-article .columns .column {
        float:none; 
        width:100%; 
        clear:both; 
        margin-bottom: 2em; 
        overflow:hidden; 
    }           
    .hero-article .columns .column:nth-child(2) {
        margin-left: 0; 
        margin-right: 0;
    }                             
    .hero-article .columns .column:last-child {
        border-bottom:none;
    }  
    #giftlink .button {
        padding-left:35%;
        padding-right:35%;
    }
    #footer {
        margin-top:0;
    }
}      
@media screen and (max-width: 850px) {
    #banner_copy {
        width: 56%;
        padding-left: 21%;
        margin-top: -55%;
    }
    #banner_copy h2 {
        padding-top: 17%;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        width: 13%;
        margin-top: -9%;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 21px;
    }
}
@media screen and (max-width: 780px) {
    #banner #mobile_banner_color {
        height: 300px;
    }
    #banner_copy {
        width: 70%;
        padding-left: 15%;
    }
    #banner_copy h2 {
        font-size: 35px;
        padding-top: 19%;
    }
    #banner_copy hr {
        width: 10%;
    }
    #banner_copy h3 {
        font-size: 27px;
    }
    #banner_copy #banner_button {
        width: 50%;
        padding-left: 25%
    }
    #mc_embed_signup {
        width: 100%;
        padding-left: 5%;
        padding-right: 0;
    }
    .hero-article #tripleImg {
        margin-top: -7%;
    }
    .hero-article #tripleImg h2{
        font-size: 18px;
    }
    .hero-article #tripleImg img {
        width:100%;
        margin-top:-6%;
    }
    .hero-article #toffee_section #toffee_copy #toffee_branch {
        padding-top: 35%;
    }
    .hero-article #toffee_section h4, .hero-article #confection_section h4 {
        font-size: 11px;
    }
    .hero-article #toffee_section h2, .hero-article #confection_section h2 {
        font-size: 20px;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 18px;
    }
    .hero-article .columns #toffeecolumn2 p, .hero-article .columns #confectioncolumn1 p, 
    .hero-article .columns #toffeecolumn2 a #toffeecolumn2button{
        padding-left:12%;
    }
    .hero-article #toffee_section .section_button,
    .hero-article #confection_section .section_button {
        width: 23%;
    }
    .hero-article #confection_section #confection_copy #confection_branch {
        padding-top: 28%;
    }
    #giftlink .button {
        padding-left:34%;
        padding-right:34%;
    }
}
@media screen and (max-width: 630px) {
    #banner #mobile_banner_color {
        height: 250px;
    }
    #banner_copy {
        margin-top: -49%;
    }
    #banner_copy h2 {
        font-size: 30px;
        padding-top: 8%;
    }
    #banner_copy h3 {
        font-size: 22px;
    }
    #banner_copy #banner_button {
        width: 40%;
        padding-left: 30%;
        padding-right: 30%;
    }
    .hero-article #tripleImg {
        width:100%;
        padding-left:0;
    }
    .hero-article #tripleImg h2{
        font-size: 14px;
    }
    .hero-article #toffee_section h2,
    .hero-article #confection_section h2 {
        font-size: 17px;
    }
    .hero-article #toffee_section p,
    .hero-article #confection_section p {
        font-size: 15px;
    }
    .formheader h2 {
        font-size: 27px;
    }
    .formheader h3 {
        font-size: 21px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        width: 14%;
        font-size: 13px;
        margin-left: 43%;
        margin-top: 2%;
    }
    #mc_embed_signup {
        padding-left:0;
    } 
    #mc-embedded-subscribe-form #mce-FNAME, #mc-embedded-subscribe-form #mce-LNAME,
    #mc-embedded-subscribe-form #mce-EMAIL {
        width: 100%;
        margin-left: 0;
        text-align: center;
    }
    .hero-article #confection_section #confection_copy #confection_branch {
        padding-top: 31%;
    }
    #giftslink .button {
        padding-left:30%;
        padding-right:30%;
    }
}
@media screen and (max-width: 550px) {   
    #banner #mobile_banner_color {
        height: 200px;
    }   
    #banner_copy {
        width: 80%;
        margin-top: -47%;
        padding-left: 10%;
    }
    #banner_copy h2 {
        font-size: 23px;
    }
    #banner_copy h3 {
        font-size: 20px;
    }
    .hero-article #tripleImg h2 {
        font-size: 12px;
    }
    .hero-article #toffee_section #toffee_copy #toffee_branch {
        padding-top: 42%;
    }
    .hero-article #toffee_section h2 {
        font-size: 15px;
        padding-top: 4%;
    }
    .hero-article #toffee_section h3, .hero-article #confection_section h3 {
        font-size: 22px;
    }   
    .hero-article #toffee_section hr {
        margin-top: 7%;
    }
    .formheader h2 {
        font-size: 24px;
        padding-left:0;
    }
    .formheader h3 {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        width: 16%;
        font-size: 11px;
        margin-left: 43%;
    }
    #mc_embed_signup {
        padding-left:0;
    } 
    #mc-embedded-subscribe-form #mce-FNAME, #mc-embedded-subscribe-form #mce-LNAME,
    #mc-embedded-subscribe-form #mce-EMAIL {
        width: 100%;
        margin-left: 0;
    }
    .hero-article #confection_section #confection_copy #confection_branch {
        padding-top: 45%;
    }
    .hero-article #confection_section h2 {
        font-size: 15px;
        padding-top: 84%;
    }
    .hero-article #confection_section hr {
        margin-top: 86%;
    }
    .giftlink {
        margin-top: 10%;
    }
    #giftlink .button {
        padding-left:27%;
        padding-right:27%;
    }
}
@media screen and (max-width: 430px) {
    #banner #mobile_banner_color {
        height: 150px;
    }
    #banner_copy h2 {
        font-size: 20px;
    }
    #banner_copy h3 {
        font-size: 17px;
    }
    #banner_copy #banner_button {
        padding-top: 5%;
    }
    .hero-article #toffee_section img, 
    .hero-article #confection_section #confectionImg, 
    .hero-article #confection_section #mobile_confection {
        width: 80%;
        padding-left:10%;
        padding-right: 10%;
    }
    .hero-article #toffee_section #toffee_copy #toffee_branch {
        padding-top: 53%;
    }
    .hero-article #toffee_section h4,
    .hero-article #confection_section h4 {
        padding-left: 12%;
    }
    .hero-article #confection_section h4 {
        padding-top: 5%;
        padding-left: 9%;
    }
    .hero-article #toffee_section h2 {
        font-size: 15px;
        padding-left: 12%;
        padding-top: 5%;
    }
    .hero-article #confection_section h2 {
        font-size: 15px;
        padding-left: 9%;
        padding-top: 89%;
    }
    .hero-article #toffee_section hr,
    .hero-article #confection_section hr {
        margin-left: 12%;
    }
    .hero-article #confection_section hr {
        margin-top: 92%;
        margin-left: 9%;
    }
    .hero-article #toffee_section p,
    .hero-article #confection_section p {
        font-size: 14px;
        padding-left: 12%;
    }
    .hero-article #confection_section p {
        padding-top: 96%;
        padding-left: 9%;
    }
    .hero-article #toffee_section .section_button,
    .hero-article #confection_section .section_button {
        width: 32%;
        padding-left: 14%;
    }
    .hero-article #confection_section .section_button {
        padding-left: 11%;
    }
    .hero-article #tripleImg h2 {
        font-size: 11px;
    }
    .hero-article #subscribeform {
        padding-top: 0;
    }
    .formheader h2 {
        font-size: 20px;
    }
    .formheader h3 {
        font-size: 18px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        font-size: 10px;
    }
    #giftlink .button {
        padding-left:25%;
        padding-right:25%;
        padding-top: 0;
    }
}
@media screen and (max-width: 370px) {
    .hero-article .columns .column {
        margin-bottom: 1em; 
    } 
    #banner_copy h2 {
        padding-top: 3%;
    }
    .hero-article #toffee_section #toffee_copy #toffee_branch {
        padding-top: 67%;
    }
    .hero-article #toffee_section h2, .hero-article #confection_section h2 {
        font-size: 14px;
    }
    .hero-article #toffee_section h3, .hero-article #confection_section h3 {
        font-size: 18px;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 14px;
    }
    .hero-article #toffee_section .section_button {
        margin-top: -26%
    }
    .hero-article #confection_section #confection_copy #confection_branch {
        padding-top: 55%;
    }
    .formheader h2 {
        font-size: 22px;
    }
    .formheader h3 {
        font-size: 16px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 14px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        font-size: 9px;
    }
}
@media screen and (max-width: 320px) {
    #banner_copy {
        margin-top: -54%;
    }
    #banner_copy h2 {
        font-size: 18px;
    }
    #banner_copy h3 {
        font-size: 14px;
    }
    .hero-article #toffee_section h4, .hero-article #confection_section h4 {
        font-size: 9px;
    }
    .hero-article #toffee_section h2, .hero-article #confection_section h2 {
        font-size: 12px;
    }
    .hero-article #toffee_section p, .hero-article #confection_section p {
        font-size: 11px;
    }
    .formheader h2 {
        font-size: 18px;
    }
    .formheader h3 {
        font-size: 14px;
    }
    #mc-embedded-subscribe-form input {
        font-size: 12px;
    }
    #mc-embedded-subscribe-form #mc-embedded-subscribe {
        width: 19%;
    }
    .hero-article #tripleImg h2 {  
        font-size: 9px;
    }
}