/**********************************************************************************
    File name:      base.css
    Description:    Styles describing general layout for main parts of the site;
                    such as header, footer, body, and general components.
    Index:
        1. $general styles
        2. $framework overrides
        3. $header
        4. $breadcrumb
        5. $media-queries
            a) x-small
            b) sm, md, lg

    Color Palette:

        HEX         RGB(A)                  Name    
        ------------------------------------------------
        #FFF        rgb(255,255,255)        white
        #333        rgb(051,051,051)        gray
        #000        rgb(000,000,000)        black

        #C00000     rgb(194,000,000)        red dark

        #FFC422     rgb(255,200,036)        orange light
        #FFAE00     rgb(255,179,000)        orange medium
        #FF4800     rgb(255,077,000)        orange dark

        #33CFEB     rgb(051,207,235)        blue light
        #00B3D2     rgb(000,179,210)        blue medium
        #0099CC     rgb(000,153,204)        blue dark

        #4FBED2     rgb(081,191,210)        blue turquoise light
        #04768A     rgb(004,118,139)        blue turquoise dark

        #B0D000     rgb(177,209,000)        green light
        #92A700     rgb(143,168,000)        green medium 
        #667900     rgb(104,122,000)        green dark 
                    rgba(143,168,000, 0.5)  green medium transparent 

**********************************************************************************/

/* all  sizes */
@media screen {
    /**********************************************************************************/
    /* $general styles
    /**********************************************************************************/
    html {overflow-x:hidden;}
    body {
        position:relative;
        background-color:#FCFCFC;
        font-family: Oswald, sans-serif; 
    }

    #body .required {
        border: 1px solid #FF0000;
        box-shadow: 1px 1px 3px rgba(200, 0, 0, .40);
        outline: none;
        opacity: 1;
    }

    #body .success {
        display: none;
        margin-bottom: 15px;
        padding:10px;
        border: 2px solid #9ACC9A;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        text-align: center;
        -webkit-box-shadow: 1px 1px 2px rgba(20, 100, 2, .40);
        box-shadow: 1px 1px 2px rgba(20, 100, 20, .40);
    }
    
    #body .success h3 { 
        margin: 0px;
        color: #5D9E5D; 
    }

    /**********************************************************************************/
    /* $framework overrides
    /**********************************************************************************/
    .form-control {
        border:1px solid #999;
        -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
        -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;
    }
    .form-control:focus {
       border:1px solid rgb(200, 27, 2);
       -moz-box-shadow: inset 0 1px 1px #D81E05, 0 0 8px #D81E05;
       -webkit-box-shadow: inset 0 1px 1px #D81E05, 0 0 8px #D81E05;
       box-shadow: inset 0 1px 1px #D81E05, 0 0 8px #D81E05;
    }

    .input-group .form-control,
    .input-group .form-control:first-child,
    .input-group .form-control:last-child {
        -webkit-border-radius:4px; 
        -moz-border-radius:4px; 
        border-radius:4px;
    }

    /* extending bootstrap */
    .inline-item {
        display:inline-block;
        height:30px; max-height:30px;
        padding:6px 0px; margin:0;
        color:#333; font-size:12px;
    }
    .column {
        float:left;
        width:auto;
    }
    .column + .column {margin-left:10px;}


    /**********************************************************************************/
    /* $header
    /**********************************************************************************/
    header {}
    header > .navbar-default { /*.navbar-default*/
        position: relative;
        border-bottom: 2px solid #808080;        
        background: #D81E05; 
        background: -moz-linear-gradient(top,  #d81e05 25%, #B31B00 100%); 
        background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#d81e05), color-stop(100%,#B31B00)); 
        background: -webkit-linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
        background: -o-linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
        background: -ms-linear-gradient(top,  #d81e05 25%,#B31B00 100%);  
        background: linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
        -pie-background: linear-gradient(#d81e05, #B31B00);
        -webkit-box-shadow: #808080 2px 2px 2px;
        -moz-box-shadow: #808080 2px 2px 2px;
        box-shadow: #808080 2px 2px 2px;
    }
    header nav > .container {
        width:auto; max-width:960px;
        padding:0;
    }

    header .navbar {
        border: none;
        margin-bottom:0;
    }
    header .navbar-header {
        margin:0;
        border:none;
        background:none;
    }
    header .navbar-toggle {
        border: none; outline:none;
    }
    header .navbar-form {
        margin: 0;
        border: none;
        -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;
    }
    header .navbar-brand {
        padding: 4px 20px;
    }
    header .navbar-brand img {
        width: auto;
        height: 32px;
    }

    header form[role="search"] {width:100%;}
    header form[role="search"] > .input-group {width:70%;}
    header form[role="search"] > .btn {
        width: 40px;
        margin-left: 5px;
        background: url("../images/ics-search-16.png") no-repeat center -8px #FFC422;
    }
    header form[role="search"] .dropdown-menu {min-width:100%;}

    header .language {width:50%; margin-left:5%;}
    header .logIn {
        display:inline-block;
        height:26px;
        padding:0 0 0 5%;
        color:#FFF; font-family: Lato, sans-serif; font-size:14px; font-weight:300;
        line-height:1.6; vertical-align:top;
    }


    /**********************************************************************************/
    /* $breadcrumb
    /**********************************************************************************/
    #breadcrumb {
        max-width: 960px;
        margin:0 auto; margin-bottom:20px;
    }
    #breadcrumb .breadcrumb { 
        overflow:hidden;
        margin: 0px auto; 
        border: 0px none; 
        background: none; 
        background: url("../Images/bullet-accordion-orange.png") no-repeat scroll 7px center transparent; 
        white-space:nowrap; text-overflow:ellipsis;
    }
    #breadcrumb .breadcrumb li { 
        display:inline;
        color:#333;
        font-family: Lato, sans-serif; font-size:14px;
    }


    /**********************************************************************************/
    /* layout sub classes
    /**********************************************************************************/

    /* multilevel-menu */
    .multilevel-menu {
        position:absolute; top:4px; left:4px; z-index:100;
        width:180px;
        margin-left:15px;
    }
    .multilevel-menu h2 {
        padding:7px 41px; margin:0 0 1px 0;
        background-color:rgba(104,122,000, 0.9);
        color:#FFF;
        font-family:'Oswald', sans-serif; font-size:22px; font-weight:300;  
        cursor:pointer;
    }
    .multilevel-menu ul {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0;
        list-style-type:none;
    }
    .multilevel-menu a { 
        display:block; overflow:hidden;
        width:inherit; height:auto;   
        padding:8px 20px;     
        color:#FFF; font-family: Lato, sans-serif; font-weight:400;
        text-overflow:ellipsis; white-space:nowrap;
    }
    .multilevel-menu a:link,
    .multilevel-menu a:visited,
    .multilevel-menu a:link:hover,
    .multilevel-menu a:active {text-decoration:none;}
    .multilevel-menu .sub-menu {display:none;}

    .multilevel-menu > ul {width:100%;}
    .multilevel-menu > ul li {
        position:relative;
        width:inherit;
        padding:0; margin:0; margin-bottom:1px;
    }
    .multilevel-menu > ul > li > a {
        background-image:url("../Images/bullet-bread.png");
        background-repeat:no-repeat;
        background-position:10px center;
        background-color:rgba(104,122,000, 0.7);
    }
    .multilevel-menu > ul > li:hover > a {
        background-color:rgba(143,168,000, 0.75);
    }

    .multilevel-menu .sub-menu {
        position:absolute; left:100%; top:0px;
        margin:0px; 
    }
    .multilevel-menu .sub-menu li {
        margin:0px; 
        background-image:none;
        background-color:rgba(143,168,000, 0.75);
    }
    .multilevel-menu > ul li:hover .sub-menu {display:block;}
    .multilevel-menu .sub-menu li:hover {background-color:rgba(104,122,000, 0.9);}

    /* collapsible-menu */
    .collapsible-menu {border-top:1px solid #E2E2E2;}
    .collapsible-menu .panel {
        display:block;
        padding:0; margin:0;
        background:initial;
        border:none;
        -moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
    }
    .collapsible-menu .panel + .panel {margin:0;}
    .collapsible-menu .panel-heading {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0;
    }
    .collapsible-menu .panel-title { 
        position:relative;
        padding:10px; padding-left:0; margin:0;
        border-top:1px solid #FFF; border-bottom:1px solid #E2E2E2; border-right:1px solid #E2E2E2; 
    }
    .collapsible-menu .panel-title:after {display:table; clear:both; content:" ";}
    .collapsible-menu .panel-title > * { 
        display:inline-block; float:left;
        padding:0; margin:0;
        width:auto; height:16px;
        color:#FF6900; font-weight:700; font-size:15px; 
        cursor:pointer; 
    }
    .collapsible-menu .panel-title .icon {
        width:15px;
        padding:0; margin:0; margin-left:5px;
        background-image:url("../Images/bullet-accordion-orange-active.png");
        background-repeat:no-repeat;
        background-attachment:scroll;
        background-position:center center;
        background-color:transparent; 
        content:' '
    }
    .collapsible-menu .panel-title .icon.collapsed {
        background-image:url("../Images/bullet-accordion-orange.png");
    }
    .collapsible-menu .panel-title .icon + a {
        margin-left:5px;
	color:#FF4800; font-family:'Lato', sans-serif; font-weight:700; font-size:15px; 
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: 192px;
    }
    .collapsible-menu .panel-collapse {
        width:auto;
        padding:0; margin:0;
        border:none;
        
    }
    .collapsible-menu .panel-collapse .panel-body {
        display:block;
        width:auto;
        padding:0 10px; margin:0;
        background:#DEDEDE;
        border:none;
    }
    .collapsible-menu .panel-heading + .panel-collapse .panel-body {
        border-top:1px solid #BABABA;
        border-bottom:1px solid #BABABA;
    }
    .collapsible-menu .panel-body > ul {
        display:block;
        width:auto;
        padding:0; padding-left:24px; margin:0;
        border:none;
    }
    .collapsible-menu .panel-body > ul > li {
        display:block; 
        margin:15px 0; 
        font-family:'Lato', sans-serif;
    }
    .collapsible-menu .panel-body > ul > li a {
        color:#333; font-size: 12px; font-weight:400;
    }

    /* no-borders */
    .collapsible-menu.no-borders .panel-title {
        padding-left:10px;
        border-color: transparent;
        color:#999;
    }
    .collapsible-menu.no-borders .panel-title .icon {display:none;}
    .collapsible-menu.no-borders .panel-title .icon + a {
        color:inherit;
        font-size:14px;
    }
    .collapsible-menu.no-borders .panel:last-child {
        -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none;
    }
    .collapsible-menu.no-borders .panel-heading {background:#F7F7F7;}

    /* section-lead */
    .section-lead {
        display:block;
        width:auto;
        padding:0; padding-top:30px; margin:0;
        font-family:'Lato', sans-serif;
    }
    .section-lead > .row {margin:0;}
    .section-lead > .row > div {margin:0;}
    .section-lead h1 {
        padding:0; margin:0; margin-bottom:20px;
        color:#FF4800; font-size:32px; font-weight:700;
        text-align:left;
    }
    .section-lead .banner {
        padding:0; margin:0; margin-bottom:20px;
        -moz-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        -webkit-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
    }
    .section-lead .banner figure {
        display:block;
        width:auto; height:auto;
        padding:4px; margin:0;
        border:none;
        outline:none;
        background:#FFF;
    }
    .section-lead .banner img {
        display:block;
        width:100%; max-width:100%; height:auto; min-height:100px;
        padding:0; margin:0;
        background:none transparent;
        border:none;
        outline:none;
    }
    .section-lead .description {
        margin:0; margin-bottom:40px;
    }
    .section-lead .description h1 {
        padding:0; margin:0;
        color:#000; font-size:28px; font-weight:700;
        text-align:left;
    }
    .section-lead .description h2 {
        padding:0; margin:0;
        color:#000; font-size:24px; font-weight:700;
        text-align:left;
    }
    .section-lead .description h3 {
        padding:0; margin:0;
        color:#000; font-size:20px; font-weight:700;
        text-align:left;
    }
    .section-lead .description h4 {
        padding:0; margin:0;
        color:#000; font-size:16px; font-weight:700;
        text-align:left;
    }
    .section-lead .description p {
        margin:0; margin-bottom:20px;
        color:#333; font-size:15px; font-weight:500;
        text-align:left;
    }

    /* results-gallery */
    .results-gallery {
        display:block;
        width:auto;
        padding:0; padding-top:30px; margin:0; margin-bottom:40px;
        border-top:1px solid #E2E2E2;
        font-family:'Lato', sans-serif;
    }
    .results-gallery > .row {margin:0;}
    .results-gallery > .row > div {margin:0;}
    .results-gallery h2 {
        padding:0; margin:0; margin-bottom:20px;
        color:#FF4800; font-size:28px; font-weight:700;
        text-align:left;
    }
    .results-gallery h2 + ul,
    .results-gallery ul.row {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0; margin-bottom:20px;
        list-style-type:none;
    }
    .results-gallery li {height: 242px;}
    .results-gallery article {
        margin-bottom:20px;
        text-align:center;
    }
    .results-gallery article figure {
        padding:0; margin:0; margin-bottom:10px;
        text-align:inherit;
    }
    .results-gallery article figure a {
        display:inline-block;
        width:auto; height:auto;
        padding:0; margin:0 auto;
        -moz-box-shadow:    0px 4px 10px 0px rgba(051,051,051,0.3);
        -webkit-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        box-shadow:         0px 4px 10px 0px rgba(051,051,051,0.3);
    }
    .results-gallery article figure img {
        max-width:100%;
    }
    .results-gallery article .name {text-align:inherit;}
    .results-gallery article .name a {
        color:#FF4800; font-size:15px; font-weight:500;
        display: block; 
        overflow: hidden; 
        height: 64px; 
        max-height: 64px; 
    }


    /* section-contents */
    .section-contents {
        display:block;
        padding:0; margin:0; margin-bottom:40px;
        font-family: Lato, sans-serif;
    }
    .section-contents > .row {
        padding:0; margin:0;
    }
    .section-contents h1 {
        padding:0; margin:0; margin-bottom:10px;
        color:#000; font-size:28px; font-weight:700;
        text-align:left;
    }
    .section-contents h2 {
        padding:0; margin:0; margin-bottom:10px;
        color:#000; font-size:24px; font-weight:700;
        text-align:left;
    }
    .section-contents h3 {
        padding:0; margin:0; margin-bottom:10px;
        color:#000; font-size:20px; font-weight:700;
        text-align:left;
    }
    .section-contents h4 {
        padding:0; margin:0; margin-bottom:10px;
        color:#000; font-size:16px; font-weight:700;
        text-align:left;
    }
    .section-contents p {
        margin:0; margin-bottom:10px;
        color:#333; font-size:14px; font-weight:500;
        text-align:left;
    }

    /* product-info */
    .product-info {
        padding:0; margin:0; margin-bottom:40px;
        list-style-type:none;
        font-family: Lato, sans-serif;
    }
    .product-info > h4 {
        font-family: Lato, sans-serif; font-size:14px;
    }
    .product-info > h1 {
        font-family:inherit; font-weight:700; font-size:34px;
    }
    .product-info figure {
        padding:0; margin:0; margin-bottom:20px;
    }
    .product-info figure img {
        max-width:100%;
        -moz-box-shadow:    0px 4px 10px 0px rgba(051,051,051,0.3);
        -webkit-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        box-shadow:         0px 4px 10px 0px rgba(051,051,051,0.3);
    }
    .product-info .product-description {
        color:#333;
        font-family:inherit;
        text-align:justify;
    }

    /* product-ingredients */
    .product-ingredients {
        display:block;
        padding:0; margin:0; margin-bottom:40px;
        font-family: Lato, sans-serif;
    }
    .product-ingredients h2 {color:#04768A;}
    .product-ingredients p {
        color:#333; font-family:inherit; font-size:14px; font-weight:500;
        text-align:left;
    }

    /* product-allergens */
    .product-allergens {
        display:block;
        padding:0; margin:0; margin-bottom:40px;
        font-family: Lato, sans-serif;
    }
    .product-allergens h2 {color:#4FBED2;}
    .product-allergens p {
        color:#333; font-family:inherit; font-size:14px; font-weight:500;
        text-align:left;
    }

    /* nutritional-facts */
    .nutritional-facts {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0; margin-bottom:40px;
    }
    .nutritional-facts img {
        display:block;
        width:auto; height:auto; max-width:100%;
        padding:0; margin:0 auto;
    }

    .section-contents .nutritional-facts h2 {
        font-family:Helvetica, Arial, sans-serif; font-weight:500; font-size:20px;
    }

    /* portions */
    .portions {
        padding:0; margin:0; margin-bottom:20px;
        list-style-type:none;
        font-family: Lato, sans-serif;
    }
    .portions p {
        display:block;
        width:auto;
        padding:0; margin:0 0 10px;
    }
    .portions li {
        display:block;
        width:auto;
        padding:0; margin:0;
    }
    .portions li > * {
        width:auto;
        padding:0; margin:0;
        color:#333; font-size:13px; font-weight:400; 
    }
    .portions label {font-weight:700;}
    .portions span {color:#0099CC; padding-left:5px;}

    /* rating-recipe */
    .rating-recipe-container {
        display:inline-block; 
        padding:0; margin:0; margin-bottom:20px;
    }
    .rating-recipe-container > * {float:left;}
    .rating-recipe-container .rating-recipe {margin:0px 5px 0px 10px;}
    .rating-recipe-container .rating-recipe img {padding: 0px;}

    /* related-items */
    .related-items {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0; margin-bottom:40px;
    }
    .related-items h2 {color:#B0D000;}
    .related-items ul {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0;
        list-style-type:none;
    }
    .related-items li {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0;
    }
    .related-items article {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0; margin-bottom:10px;
    }
    .related-items article figure {
         /*row properties*/
         padding:0; margin:0;
        border:none; background:none transparent;
    }
    .related-items article figure a {
        display:inline-block;
        width:auto; height:auto;
        padding:0; margin:0 auto;
        -moz-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        -webkit-box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
        box-shadow: 0px 4px 10px 0px rgba(051,051,051,0.3);
    }
    .related-items article figure img {max-width:100%; width: 100%; }
    .related-items article p {
        /*row properties*/
        margin-bottom:10px;
    }
    .related-items article a {color:#FF4800;}
    .related-items .view-more {
        display:block;
        width:auto;
        color:#FF4800; text-align:center;
    }

    /* recipe-finder */
    .recipe-finder {
        padding:0; margin:0;
        border:1px solid #CCC;
        color:#333; font-family:Lato, sans-serif; font-size:12px;
    }
    .recipe-finder h2 {
        padding:20px 15px; margin:0; margin-bottom:10px;
        background-color:#FFF;
        color:#667900; font-family:'Oswald',sans-serif; font-size:23px; font-weight:400;
    }
    .recipe-finder h2 + p {
        padding:0 15px; margin:0; margin-bottom:10px;
    }
    .recipe-finder form {
        padding:0 15px; margin:0;
    }
    .recipe-finder .form-group > label {
        color:#667900; font-size:14px;
    }
    .recipe-finder .form-group > div {
        display:block; position:relative;
        width:auto; height:auto;
        padding:0; margin:0; padding-right:40px;
    }
    
    .recipe-finder .form-group select {margin:0 50px 0 0;}
    .recipe-finder .form-control {
        height:32px;
        padding:4px 12px;
    }
    .recipe-finder .form-group .btn-default.search {
        position:absolute; top:0; right:0;
        width:34px;
        background:url("../images/ics-search-16.png") no-repeat scroll center -9px #FFC422;
    }
    .recipe-finder .form-group .btn-default.submit {
        margin-bottom:20px;
        border:1px solid #FFF;
        background:#FFC422;
        -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; 
        -moz-box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5); -webkit-box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5); box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5); 
        color:#FFF; font-size:16px; font-family:'Lato',sans-serif; font-weight:600;  
    }


    /**********************************************************************************/
    /* controls sub classes
    /**********************************************************************************/
    /* $read-more button */
    .read-more {
        display:block;
        width:auto; padding:0;
        text-align: center;
    }
    .read-more a, 
    .read-more button,
    .read-more input {
        position:relative; 
        padding:3px 25px; 
        border:1px solid #FFF;
        background:rgba(051,051,051,0.5) ;
        -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; 
        -moz-box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5);
        -webkit-box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5);
        box-shadow:0px 4px 3px -2px rgba(051,051,051,0.5); 
        color:#FFF; font-size:12px; font-family:'Lato',sans-serif; font-weight:600;  
    }
    .read-more.orange-md a,
    .read-more.orange-md button,
    .read-more.orange-md input {background:#FFAE00;}
    .read-more.green-lt a,
    .read-more.green-lt button,
    .read-more.green-lt input {background:#B0D000;}
    .read-more.blue-dk a,
    .read-more.blue-dk button,
    .read-more.blue-dk input {background:#0099CC;}
    .read-more.blue-lt a,
    .read-more.blue-lt button,
    .read-more.blue-lt input {background:#33CFEB;}
    .read-more.red-dk a,
    .read-more.red-dk button,
    .read-more.red-dk input {background:#C00000;}
    .read-more.red-md a,
    .read-more.red-md button,
    .read-more.red-md input {background:#F00000;}

    body #body section p.read-more a:hover,
    body #body section input[type="submit"]:hover {
        text-decoration: none;
        border: 1px solid #CCCCCC;
        opacity: .7;
    }

    /* cooking-time */
    .cooking-time {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0;
        list-style-type:none;
        color:#333; font-family:Lato, sans-serif; font-size:12px;
    }
    .cooking-time li {
        display:inline-block; float:left;
        width:25%; height:auto; min-height:65px;
        padding:0 5px; margin:0;
        list-style-type:none;
    }
    .cooking-time li label {margin:0;}
    .cooking-time li figure {
        display:block;
        width:45px; height:auto;
        padding:0; margin:0 auto;
        text-align:center;
    }
    .cooking-time li figure a {
        display:inline-block;
        width:auto; height:auto;
        padding:0; margin:0 auto;
        cursor:pointer;
    }
    .cooking-time li figure img {
        display:block;
        width:35px; height:auto; max-width:100%;
        padding:0; margin:0;
    }
    .cooking-time li figure a:hover img {width:40px;}
    .cooking-time li figcaption {text-align:center;}
    .cooking-time li.selected {
        padding-top:1px;
        border-radius:6px;
        -moz-box-shadow:inset 0px 0px 6px -1px rgba(051,051,051,0.3); -webkit-box-shadow:inset 0px 0px 6px -1px rgba(051,051,051,0.3); box-shadow:inset 0px 0px 6px -1px rgba(051,051,051,0.3);
    }
    
    .cooking-time li.selected a img {width:40px;}

    /* favorite-recipes */
    .favorite-recipes.carousel  {
        font-family:'Lato', sans-serif;
    }
    .favorite-recipes.carousel h3 {
        padding:0; margin:0 0 20px 0;
        color:#0097C9; font-family:'Lato', sans-serif;  font-weight:600; font-size:24px;
    }
    .favorite-recipes.carousel .carousel-inner > .item {text-align:center;}
    .favorite-recipes.carousel .carousel-inner > .item > img {margin:0 auto 20px;}
    .favorite-recipes.carousel .carousel-inner > .item h4 {
        padding:0; margin:0 0 20px 0;
        color:#0097C9; font-family:'Lato', sans-serif; font-weight:600; font-size:24px;
    }
    .favorite-recipes.carousel .carousel-inner > .item p {
        padding:0; margin:0 0 20px 0;
        color:#333; font-family:'Lato', sans-serif; font-weight:400; 
    }
    .favorite-recipes.carousel .carousel-control {
        opacity:1;
        height:50%;
        background:none;
        filter:none;
    }
    .favorite-recipes.carousel .carousel-control .glyphicon {
        width:32px;height:32px;
        padding:3px;
        background:#000;
        color:#DEFF00;
	top: 80px;
    }
    .favorite-recipes.carousel .carousel-control .glyphicon.glyphicon-chevron-right {
        /*background: transparent url(../Images/next-horizontal.png) no-repeat 0 0;*/
    }
    .favorite-recipes.carousel .carousel-control .glyphicon.glyphicon-chevron-left {
        /*background: transparent url(../Images/prev-horizontal.png) no-repeat 0 0;*/
    }

    /* most-popular */
    .most-popular {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0 0 20px 0;
        font-family:'Lato', sans-serif;
    }
    .most-popular h3 {
        padding:0; margin:0 0 10px 0;
        color:#B0D000; font-family:inherit; font-weight:600; font-size:24px;
    }
    .most-popular ul {
        display:block;
        width:auto; height:auto;
        padding:0; margin:0 0 20px 0;
        list-style-type:none;
    }
    .most-popular li {
        display:block; 
        padding:0 0 5px 25px; margin:0 0 10px;
        background:url("../Images/back-li-right.png") left center no-repeat; 
    }
    .most-popular li a { 
        color:#555555; font-size:13px;
    }
    .most-popular li a:hover {text-decoration: none;}

    /* $modal */
    .modal {}
    .modal-dialog {}
    .modal-content { 
        background-color: #F3F3F3;
    }
    .modal-header {
        padding:0; margin:0;
        background-color:#92A700;
    }
    .modal-header h4 {
        display:block;
        padding:12px 0 10px 88px; margin:0;
        color:#FFF; font-family:'Oswald', sans-serif; font-weight:400; font-size:30px;
        text-transform:uppercase;
        line-height:1;
    }
    .modal-header figure {
        display:block; 
        position:absolute; left:0; top:0;
        padding:10px 0 10px 18px; margin:0;
    }
    .modal-header .close {
        opacity:1;
        margin-top: -18px;
        margin-right: -18px;
    }
    .modal-header .close:hover {opacity:1;}
    .modal-body {
        font-family:'Lato', sans-serif;
    }
    .modal-body p {
        color:#333;
        font-family:inherit;
    }
    .modal-body p {}
    .modal.no-footer .modal-body {padding-bottom:40px;}
    .modal.no-footer .modal-footer {display:none;}

    /* $modal overrides */
    .modal.sign-in .modal-body {
        padding-left:60px; padding-right:60px;
    }
    .modal.sign-in .modal-body p,
    .modal.email-recipe p {
        margin-bottom:20px;
        font-size:14px;
    }
    .modal.sign-in .control-label.column {
        width:100px;
        text-align:right;
    }
    .modal.register .column {
        width:36%;
    }
    .modal.register .control-label.column {
        width:30%;
        text-align:right;
    }
    .modal.rate-recipe {}
    .modal.rating-review .modal-body {
        overflow-y:auto;
        max-height: 400px;
    }

    .modal.rating-review .modal-body > div:first-child {
        text-align: center;
    }

    .modal.rating-review .modal-body .average-rating-container p {
        display: inline-block;
    }

    .modal.rating-review .modal-body ul li {
        list-style: none;
    }

    .modal.rating-review .modal-body ul li h4 {
        color: #04768a;
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 5px;
    }

    .modal.rating-review .modal-body .rating-recipe-related {
        margin-left: 10px;
    }

    /*Overrides email recipe modal */
    .modal.email-recipe .modal-body {
        padding: 10px 30px;
    }

    .modal.email-recipe .modal-body .form-group label {
        width: 200px;
        text-align: right;
    }

    .modal.email-recipe .modal-body .form-group label + input {
        margin-left: 10px;
    }

    .modal.email-recipe .modal-body .form-group textarea {
        max-width: 100%;
        width: 100%;
        height: 80px;
        max-height: 120px;
    }

    .modal.email-recipe .modal-footer {
        margin: 0px;
        text-align: center;
        border: 0px none;
    }

    .modal.email-recipe .modal-footer p {
        display: inline-block;
        margin: 10px;
        font-size: 12px;
        font-weight: 500;
        font-family: "Helvetica Neue", Helvetica, sans-serif, Arial;
    }

}

/* x-small */
@media screen and (max-width: 767px) {

    body {margin-top:60px;}


    /**********************************************************************************/
    /* $framework overrides
    /**********************************************************************************/
    /* $modal */
    .modal-body {text-align:center;}
    .modal-header h4 {
        overflow:hidden;
        padding-top:18px; padding-bottom:18px;
        font-size:18px;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    /* extending bootstrap */
    .column {
        display:block;
        float:none; clear:both;
        width:100%;
    }
    .column + .column {margin:0;}


    /**********************************************************************************/
    /* $header
    /**********************************************************************************/
    header:first-child {
        display:block; position:fixed; top:0px; z-index:100;
        width:100%; padding:0; margin:0;
    }
    header > .navbar-default {
        margin:0;
        background:#FFF;
    }
    header .navbar-header {
        padding:6px 15px;
        /*background: #B0D000;
        background: -moz-linear-gradient(top, #B0D000 0%, #92A700 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#B0D000), color-stop(100%,#92A700));
        background: -webkit-linear-gradient(top, #B0D000 0%,#92A700 100%);
        background: -o-linear-gradient(top, #B0D000 0%,#92A700 100%);
        background: -ms-linear-gradient(top, #B0D000 0%,#92A700 100%);
        background: linear-gradient(top, #B0D000 0%,#92A700 100%);*/
        background: #D81E05; 
        background: -moz-linear-gradient(top,  #d81e05 25%, #B31B00 100%); 
        background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#d81e05), color-stop(100%,#B31B00)); 
        background: -webkit-linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
        background: -o-linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
        background: -ms-linear-gradient(top,  #d81e05 25%,#B31B00 100%);  
        background: linear-gradient(top,  #d81e05 25%,#B31B00 100%); 
       -pie-background: linear-gradient(#d81e05, #B31B00);
    }
    header .navbar-brand img {margin-top:4px;}

    header .navbar-default .navbar-toggle {background:#921903;}
    header .navbar-default .navbar-toggle:hover, 
    header .navbar-default .navbar-toggle:focus {background:#921903;}
    header .navbar-default .navbar-toggle .icon-bar {background-color:#FFF;}

    header .navbar-default .navbar-toggle.collapsed {background:none transparent;}
    header .navbar-default .navbar-toggle.collapsed:hover {background:#921903;}
    header .navbar-default .navbar-toggle.collapsed .icon-bar {background-color:#000;}

    header .navbar-default .navbar-collapse {
        position:relative; overflow-y:auto;
        width:auto; padding:0px 0 10px; margin:0; 
        border-top-color:#921903;
        background-color: rgba(200, 27, 2, 0.2);
    }
    header .navbar-default .navbar-collapse > .row {width:100%; padding:0; margin:0;}
    header .navbar-default .navbar-collapse > .row > div {width:100%; padding:0; margin:0;}
    header .navbar-default .navbar-collapse > .row > div .navbar-form {width:auto; padding:0; margin:0;}

    .navbar-default .navbar-nav > .active > a, 
    .navbar-default .navbar-nav > .active > a:hover, 
    .navbar-default .navbar-nav > .active > a:focus {background-color: #92A700;}

    header .navbar-default .navbar-collapse > .row:first-child > div:first-child + div {
        display:block; top:0;
        padding:10px 8.75%; 
    }
    header form[role="search"] {position:relative;}
    header form[role="search"] > .input-group {
        display:block;
        width:auto; margin-right:38px;
    }
    header form[role="search"] > .btn {
        position:absolute; right:0; top:0;
        width:34px; height:34px;
    }
    header select.language {
        width:100%;
        margin:0;
    }
    header .logIn {
        display:block;
        width:auto; height:auto;
        padding:5px 0; margin:2px 0;
    }

    #gruma-nav .col-search > div > div + div {
        padding-top:10px; padding-bottom:10px;
        text-align:center;
    }
    #gruma-nav .col-search > div > div + div a + a {padding-left:10px;}

    header .navbar-default .navbar-collapse .col-menu-options {border-top:1px solid #D81E05;}
    header .navbar-default .navbar-collapse .col-menu-options ul.navbar-form {
        overflow:hidden;
        margin:15px 8.75%;
        border:1px solid #D81E05; 
        -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;
    }
    header .navbar-default .navbar-collapse .col-menu-options li {border-top:1px solid #D81E05;}
    header .navbar-default .navbar-collapse .col-menu-options li:first-child {border-top:none;}
    header .navbar-default .navbar-collapse .col-menu-options li a {
        padding:10px 15px;
        color:#D81E05;
        font-size:14px; font-weight:500;
        text-align:left; text-transform:uppercase;
    }
    header .navbar-default .navbar-collapse .col-menu-options li a:hover {
        background:#D81E05;
        color:#FFF;
    }

    header .navbar-default .navbar-collapse > .row:first-child .col-company {
        display:block; bottom:0;
        padding:20px 8.75%;
        border-top:1px solid #921903;
        background:#921903;
    }
    header .navbar-default .navbar-collapse .col-company ul {display:table;}
    header .navbar-default .navbar-collapse .col-company li {
        display:table-cell;
        width:33.33%;
    }
    header .navbar-default .navbar-collapse .col-company li a {
        padding:0px 5px;
        color:#FFF;
        font-size:12px; font-weight:500;
        text-align:center; text-transform:capitalize;
    }


    /**********************************************************************************/
    /* $footer
    /**********************************************************************************/
    footer {display:block;}
    footer .row {padding:0; margin:0;}

    footer .footer-content {background: #D81E05;}
    footer .footer-content nav {padding:0; margin:0;}
    footer .footer-content > .row > div {padding:0; margin:0;}
    footer .footer-content > .row > div:first-child a {
        display:block;
        width: auto; padding:20px 15px;
        text-align: center;
    }
    footer .footer-content img {width:auto; height:40px;}

    footer .footer-copyright {
        background:#A51900;
        -moz-box-shadow:inset 0 0 6px -2px #000; -webkit-box-shadow:inset 0 0 6px -2px #000; box-shadow:inset 0 0 6px -2px #000;
        font-family: Lato, sans-serif;
    }
    footer .footer-copyright > .row > div {
        display:block;
        padding:0;
    }
    footer .footer-copyright > .row > div > p {
        width:auto; padding:0; margin:20px 0 10px; 
        color:#FFF; font-weight:500; font-size:12px;
        text-transform:none; text-align:center; 
        vertical-align:middle;
    }
    footer .footer-copyright > .row > div > p a {padding:10px;}
    footer .footer-copyright > .row > div:first-child > p {
        border-right:1px solid #FFF; 
        text-align:right;
    }
    footer .footer-copyright > .row > div:first-child + div > p {text-align:left;}
    footer .footer-copyright > .row > div:first-child + div + div {
        float:left; clear:both;
        padding:0; margin:0; 
    }
    footer .footer-copyright > .row > div:first-child + div + div p {
        padding:0 0 5px; margin:0;
        font-size:10px; font-weight:bold;
    }

    /* footer overrides */
    footer ul {
        padding:0; margin:0;
        list-style-type: none;
    }
    footer ul li,
    footer ul li.col-xs-12 {
        display:block;
        padding:0; margin:0;
        list-style-type: none;
        border-top:1px solid #A51900;
    }
    
    footer ul li a {
        display:block;
        width:auto; padding:10px 15px;
        color:#FFF; font-family:'Oswald', sans-serif; font-weight:300; font-size:17px;
        text-align:center; text-transform:uppercase; line-height:24px;
    }

    footer a:link,
    footer a:hover,
    footer a:active {
        color:#FFF; 
        text-decoration:none;
    }
    footer a:hover {text-decoration:underline;}

    footer nav a:link {text-decoration:none;}
    footer nav a:hover, 
    footer nav a:active {background:#A51900;}


    /**********************************************************************************/
    /* layout sub classes
    /**********************************************************************************/
    
    /* carousel */
    .carousel, .carousel.slide {min-height:120px;}
    .carousel .item img {
        /*width:100%; height:auto;*/
    }

    /* multilevel-menu */
    .multilevel-menu {
        position:static;
        width:100%;
        padding:0; margin:0; padding-top:1px; margin-bottom:40px;
    }
    .multilevel-menu h2 {
        padding:18px;
        background-color:rgba(104,122,000, 0.9);
        text-align:center;
    }
    .multilevel-menu > ul > li > a {padding:12px 20px; background-color:rgba(104,122,000, 0.9);}
    .multilevel-menu > ul > li:hover > a {background-color:rgba(104,122,000, 1);}
    .multilevel-menu .sub-menu {
        display:block; position:static;
        padding:0; margin:0;
        border-top:1px solid rgba(104,122,000, 0.75); border-bottom:1px solid rgba(104,122,000, 0.75);
    }
    .multilevel-menu .sub-menu li {background-color:rgba(104,122,000, 0.7);}
    .multilevel-menu .sub-menu li a {text-indent:10px;}

    /* collapsible-menu */
    .collapsible-menu.panel-group {border-left: 1px solid #E2E2E2;}

    /*section-lead*/
    .section-lead h1 {text-align:center;}
    .section-lead h2 {text-align:center;}
    .section-lead h3 {text-align:center;}
    .section-lead h4 {text-align:center;}
    .section-lead h5 {text-align:center;}
    .section-lead p {text-align:center; font-size:15px;}

    /*results-gallery*/
    .results-gallery h2 {text-align:center;}
    .results-gallery ul.row {margin-bottom: 20px;}

    /* section-contents */
    .section-contents h1 {text-align:center;}
    .section-contents h2 {text-align:center;}
    .section-contents h3 {text-align:center;}
    .section-contents h4 {text-align:center;}
    .section-contents p {text-align:center;}

    /* product-info */
    .product-info > .row {margin:0;}
    .product-info > .row {margin:0;}
    .product-info > h1 {font-size:30px;}
    .product-info figure {text-align:center;}

    /* product-ingredients */
    .product-ingredients {}
    .product-ingredients h2 {text-align:center;}
    .product-ingredients p {text-align:justify; font-size:15px;}

    /* product-allergens */
    .product-allergens {}
    .product-allergens h2 {text-align:center;}
    .product-allergens p {text-align:center; font-size:15px;}

    /* nutritional-facts */
    .nutritional-facts {text-align:center;}
    .section-contents .nutritional-facts h2 {text-align:center;}

    /* related-items */
    .related-items h2 {
        margin-bottom:10px;
        text-align:center; 
    }
    .related-items article {text-align:center;}
    .related-items article figure {margin-bottom:10px;}
    .related-items article a {text-align:center;}
    .related-items article p {text-align:center; font-size:15px;}

    /* most-popular */
    .most-popular {margin:0 0 40px 0;}

    /**********************************************************************************/
    /* controls sub classes
    /**********************************************************************************/
    /* read-more button */
    .read-more {
        display:block;
        width:auto; padding:0;
        text-align:center;
    }
    .read-more a, .read-more button, .read-more input {
        display:block;
        width:80%; 
        padding:6px; margin:0 auto;
        font-size:16px; font-weight:400;
    }

    /* favorite-recipes */
    .favorite-recipes.carousel {margin:0 0 40px 0;}

    /* $modal overrides */
    .modal.sign-in .modal-body {padding:20px;}
    .modal.sign-in .control-label.column {
        width:auto;
        text-align:center;
    }
}

/* sm, md, lg */
@media (min-width: 768px) {

    /**********************************************************************************/
    /* bootstrap extended sub classes
    /**********************************************************************************/
    /* col-flex */
    .col-flex-1, .col-flex-2, .col-flex-3, .col-flex-4, .col-flex-5, .col-flex-6, 
    .col-flex-7, .col-flex-8, .col-flex-9, .col-flex-10, .col-flex-11 {float:left;}

    .col-flex-1, .col-flex-2, .col-flex-3, .col-flex-4, .col-flex-5, .col-flex-6, 
    .col-flex-7, .col-flex-8, .col-flex-9, .col-flex-10, .col-flex-11 {
        position:relative;
        min-height:1px; 
        padding-left:15px; padding-right:15px;
    }

    /* col-flex-6 */
    .col-flex-6 {width:auto; max-width:50%;}

    /* general */
    
    /**********************************************************************************/
    /* $header
    /**********************************************************************************/
    #gruma-nav .row.clearfix:first-child {position:relative; z-index: 10;}
    #gruma-nav .row.clearfix:first-child + .row.clearfix {position:relative; z-index:9;}
    #gruma-nav .row.clearfix:first-child + .row.clearfix + .row.clearfix {position:relative; z-index:8;}

    #gruma-nav .col-company .nav.navbar-nav {padding:0;}
    #gruma-nav .col-company,
    #gruma-nav .col-search {
        background:#FFC422;
        -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;
        -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;
        -webkit-box-shadow: #A51900 2px 2px 2px; -moz-box-shadow: #A51900 2px 2px 2px; box-shadow: #A51900 2px 2px 2px;
    }
    #gruma-nav .col-company {padding:5px 3px;}
    #gruma-nav .col-company li {padding:5px 0px;}
    #gruma-nav .col-company li a,
    #gruma-nav .col-search li a {
        height:16px;   
        padding:0 20px 0 0; border-right:1px solid #FFF; 
        color:#FFF; font-family:'Lato', sans-serif; font-size:13px; font-weight:700; 
        line-height:1.05;
    }

    header .navbar-default .navbar-collapse > .row:first-child > div:first-child + div {
        display:block; top:0;
        padding:5px 0; 
    }
    header form[role="search"] {
        position:relative;
        padding:0;
    }
    header form[role="search"] > .input-group {
        display:block; float:none !important;
        width:auto; margin-right:38px;
    }
    header form[role="search"] > .btn {
        position:absolute; top:0; right:0;
        width:34px; height:34px;
        background: url("../images/ics-search-16.png") no-repeat scroll center -12px #FFC422;
    }
    header form[role="search"] .form-control {
        height:26px;
        padding:4px 12px;
        font-family:Oswald, sans-serif; font-size:13px;
    }
    header select.form-control {
        float:left;
        height:26px;
        padding:1px 12px;
        font-family:Oswald, sans-serif; font-size:13px;
    }

    #gruma-nav .col-search > .row {padding:0; margin:0;}
    #gruma-nav .col-search > .row > div {padding-right:0;}
    #gruma-nav .col-search > div > div + div {
        padding:0;
        text-align:left;
    }
    #gruma-nav .col-search > div > div + div a + a {padding-left:10px;}

    #gruma-nav .col-company .navbar-form {width:100%;}
    #gruma-nav .col-company .navbar-form li a {text-align:center;}

    /* logo */
    header .navbar-default .navbar-collapse > .row:first-child + .row {
        position:relative; top:0;
        max-width:960px; height:70px;
        margin:0 auto;
    }
    header .navbar-default .navbar-collapse > .row:first-child + .row a {
        display:block; position:relative; top:-57px;
        width:21.506%; height:164px;
        padding:0; margin:0 auto;
    }
    header .navbar-default .navbar-collapse > .row:first-child + .row a img {
        display:block; position:absolute; bottom:1px;
        width:100%; max-width:200px; height:auto;
        margin:0 auto;
    }

    /* menu-options */
    header .col-menu-options {padding:0;}
    header .col-menu-options .navbar-nav {
        display:block; position:relative;
        width:100%;
    }
    header .col-menu-options .navbar-nav > li {
        display:inline-block; position:relative; float:left; overflow:hidden;
        width:13%;
        padding:0 3px; margin:0px;
    }
    header .col-menu-options .navbar-nav > li:nth-child(3) {margin:0px 22% 0px 0px;}

    header .col-menu-options .navbar-nav > li > a { 
        padding:20px 0px 8px; 
        border:0px none;
        color:#FFF; font-family:'Oswald', sans-serif; font-weight:300; font-size:18px;
        text-transform:uppercase; text-align:center;
    }
    header .col-menu-options .navbar-nav > li > a:link,
    header .col-menu-options .navbar-nav > li > a:hover,
    header .col-menu-options .navbar-nav > li > a:active {color:#FFF;}
    header .col-menu-options .navbar-nav > li > a:hover {       
        background: #d81e05; 
        background: -moz-linear-gradient(top,  #d81e05 0%, #a6021f 100%); 
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d81e05), color-stop(100%,#a6021f)); 
        background: -webkit-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -o-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -ms-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d81e05', endColorstr='#a6021f',GradientType=0 );  
        color:#FFF;
    }
    header .col-menu-options .navbar-nav > li > a:active {        
        background: #d81e05; 
        background: -moz-linear-gradient(top,  #d81e05 0%, #a6021f 100%); 
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d81e05), color-stop(100%,#a6021f)); 
        background: -webkit-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -o-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -ms-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d81e05', endColorstr='#a6021f',GradientType=0 );  
    }
    
    header .nav a.active { 
        background: #d81e05; 
        background: -moz-linear-gradient(top,  #d81e05 0%, #a6021f 100%); 
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d81e05), color-stop(100%,#a6021f)); 
        background: -webkit-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -o-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: -ms-linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        background: linear-gradient(top,  #d81e05 0%,#a6021f 100%); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d81e05', endColorstr='#a6021f',GradientType=0 );   
    }


    /**********************************************************************************/
    /* $footer
    /**********************************************************************************/
    footer {
        display:block;        
        background: #D81E05;
    }
    footer > div > .row {
        max-width:960px;
        padding:0; margin:0 auto;
    }

    footer .footer-content nav {padding:0;}
    footer .footer-content nav ul {padding:20px 0;}
    footer .footer-content nav ul li {border:none;}
    footer .footer-content > .row {position:relative;}
    footer .footer-content > .row > div {position:absolute;}
    footer .footer-content > .row > div:first-child a {
        display:block;
        width:auto; padding:20px 15px;
        text-align:center;
    }
    footer .footer-content img {width:auto; height:40px;}
    
    footer .footer-copyright {        
        background: #A51900;
        -moz-box-shadow:inset 0 0 6px -2px #000; -webkit-box-shadow:inset 0 0 6px -2px #000; box-shadow:inset 0 0 6px -2px #000;
        font-family: Lato, sans-serif;
    }
    footer .footer-copyright > div {max-width:800px;}
    footer .footer-copyright > .row > div {padding:0;}
    footer .footer-copyright > .row > div > p {
        width:auto; height:auto; padding:0; margin:20px 0;
        border-left:1px solid #FFF;
        color:#FFF; font-weight:500; font-size:12px;
        text-transform:none; text-align:center; 
        vertical-align:top; line-height:12px;
    }
    footer .footer-copyright > .row > div > p > * {
        display:inline;
        padding:0; margin:0;
        color:inherit; font-weight:inherit; font-size:inherit;
        line-height:inherit; vertical-align:inherit;
    }
    footer .footer-copyright > .row > div > p label {padding-left:10px;}
    footer .footer-copyright > .row > div:first-child > p {
        padding-right:15px;
        border-left:none;
        text-align:right;
    }
    footer .footer-copyright > .row > div:first-child + div + div p {
        padding-left:15px;
        text-align: left;
    }
    footer .footer-copyright > .row > div:first-child + div + div p span {display:inline !important;}


    /* footer overrides */
    footer ul {
        padding:0; margin:0;
        list-style-type: none;
    }
    footer ul li {
        display:block;
        padding:0; margin:0;
        list-style-type: none;
        border-top:1px solid #667900;
    }
    footer ul li a {
        display:block;
        width:auto; padding:10px 15px;
        color:#FFF; font-family:'Oswald', sans-serif; font-weight:300; font-size:17px;
        text-align:center; text-transform:uppercase; line-height:24px;
    }

    footer a:link,
    footer a:hover,
    footer a:active {
        color:#FFF; 
        text-decoration:none;
    }
    footer a:hover {text-decoration:underline;}

    footer nav a:link {text-decoration:none;}
    footer nav a:hover, 
    footer nav a:active { background: #A51900; }


    /**********************************************************************************/
    /* #body
    /**********************************************************************************/
    #breadcrumb + div {min-height:600px;}


    /**********************************************************************************/
    /* sub classes
    /**********************************************************************************/

    /***********************************
    ********* Mission Foods ***********
    ***********************************/
    section #my-mission { position: fixed; right: 0; top: 147px; width: auto; height: auto; z-index: 110; cursor: pointer; }
    section #my-mission img { border: 0px none; }
    #my-mission-cont { display: block; position: fixed; right: -550px; top: 146px; width: 280px; z-index: 101; }
    #my-mission-cont .logo-my-mission { position: absolute; }
    #my-mission-cont .content-my-mission { width: 100%; margin: 10px 0px; }
    #my-mission-cont .content-my-mission .left-my-mission-content { width: 34%; }
    #my-mission-cont .content-my-mission .right-my-mission-content { width: 100%; margin: 0px 40px 0px 0px; }
    #my-mission-cont .content-my-mission .title-my-mission { padding: 2px 0 4px 15px; background-color: #748807; }
    #my-mission-cont .content-my-mission .title-my-mission h2 { color: #ffffff; font-family: 'Oswald',sans-serif; font-size: 24px; font-weight: 400; }
    #my-mission-cont .content-my-mission .register { padding: 8px; background-color: #ffffff; }
    #my-mission-cont .content-my-mission .register .avatar { padding: 3px 3px 0; border: 1px solid #d3d3d3; border-top: none; -webkit-box-shadow: #3f3f3f 1px 1px 2px; -moz-box-shadow: #3f3f3f 1px 1px 2px; box-shadow: #3f3f3f 1px 1px 2px; height: 65px; position: relative; }
    #my-mission-cont .content-my-mission .register .sign-in { margin: -2px 0 0 10px; }
    #my-mission-cont .content-my-mission .register .sign-in p { color: #879636; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; }
    #my-mission-cont .content-my-mission .register .sign-in p a { color: #879636; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; text-decoration: underline; }
    #my-mission-cont .content-my-mission .register .sign-in h2 { margin: 20px 0 0; color: #5c6c06; font-family: 'Oswald',sans-serif; font-size: 22px; font-weight: 300; }
    #my-mission-cont .content-my-mission .join { background: url("../Images/bck-join.jpg") repeat-x scroll 0 0 transparent; height: 138px; padding: 13px 25px 0 32px; }
    #my-mission-cont .content-my-mission .join h3 { color: #ffffff; font-size: 22px; font-family: 'Lato', sans-serif; font-weight: 400; text-align: center; }
    #my-mission-cont .content-my-mission .join p { color: #ffffff; font-size: 12px; font-family: 'Lato', sans-serif; font-weight: 400; text-align: justify; }
    #my-mission-cont .content-my-mission .join p.register-link { margin: 8px 0 0; text-align: center; }
    #my-mission-cont .content-my-mission .join p.register-link a { color: #ffffff; border: 1px solid #ffffff; font-size: 14px; font-family: 'Lato', sans-serif; font-weight: 700; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow: #4c4a48 2px 2px 2px; -moz-box-shadow: #4c4a48 2px 2px 2px; box-shadow: #4c4a48 2px 2px 2px; background-color: #b1d100; position: relative; padding: 4px 25px; }
    #my-mission-cont .content-my-mission .finder { background-color: #ffffff; padding: 3px 37px 4px 19px; border-bottom: 1px solid #e0e0e0; }
    #my-mission-cont .content-my-mission .finder h2 { color: #5c6c06; font-family: 'Oswald',sans-serif; font-size: 23px; font-weight: 400; }
    #my-mission-cont .content-my-mission .form-cont { background-color: #f3f3f3; padding-top: 12px; }
    #my-mission-cont .content-my-mission .form-cont p { color: #666666; font-size: 12px; font-family: 'Lato', sans-serif; font-weight: 400; margin: 0px 20px 5px; }
    #my-mission-cont .content-my-mission .form-cont ul { margin: 0px 0px 10px 0px; }

    #my-mission-cont .content-my-mission .form-cont form .left-form-my-mission { border-right: 1px solid #ffffff; width: 49%; }
    #my-mission-cont .content-my-mission .form-cont form .right-form-mi-mission { border-left: 1px solid #e0e0e0; width: 49%; padding-bottom: 1px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form { padding: 5px 7px 5px 20px; overflow: hidden; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p { margin: 0px 0px 5px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p label { color: #5c6c06; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p input.text { max-width: 60%; width: 169px; height: 22px; border: 1px solid #d4d4d4; border-top: none; background:  url("../Images/back-input.jpg") repeat-x; color: #888888; font-size: 12px; font-family: 'Lato', sans-serif; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p input.submit { border: none; height: 22px; width: 22px; background: url("../Images/search-button.png") no-repeat; margin: 0 0 0 5px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p select { height: auto; color: #888888; font-size: 12px; font-family: 'Lato', sans-serif; float: left; margin: 2px 7px 0 0; width: 170px; }

    #my-mission-cont .content-my-mission .form-cont form .div-form p span a.ui-selectmenu,
    #my-mission-cont .content-my-mission .form-cont form .div-form p span a.ui-selectmenu, 
    #my-mission-cont .content-my-mission .form-cont form .div-form p span a.ui-selectmenu { -webkit-box-shadow: #b7b7b7 0 2px 3px 0px ; -moz-box-shadow: #b7b7b7 0 2px 3px 0px ; box-shadow: #b7b7b7 0 2px 3px 0px ; }
    #my-mission-cont .content-my-mission .form-cont form .div-form p .ui-state-default,
    #my-mission-cont .content-my-mission .form-cont form .div-form p .ui-widget-content .ui-state-default, 
    #my-mission-cont .content-my-mission .form-cont form .div-form p .ui-widget-header .ui-state-default, 
    #container .content_bottom .left_column .recipe_finder form .content-form p .ui-state-default, 
    #products .content-products .column-product .descrip-column p .ui-state-default { background: #FFFFFF; float: left; max-width: 80%; height: 22px; }

    #my-mission-cont .content-my-mission .form-cont form .div-form p span { float: left; cursor: auto; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li {  float: left; margin-right: 11px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li:hover, 
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li.selected { margin-bottom: -20px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li:hover a img,
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li.selected a img { width: 50px; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li:hover p span, 
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li.selected p span { font-size: 14px; font-weight: 700; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li.last { margin-right: 0; }
    #my-mission-cont .content-my-mission .form-cont form .div-form ul li p { margin-bottom: 5px; text-align: center; }

    #my-mission-cont .content-my-mission .form-cont form .div-form ul li p span { color: #888888; font-family: 'Lato',sans-serif; font-size: 12px; font-weight: 400; float: none; }
    #my-mission-cont .content-my-mission .form-cont form div.submit { margin: 0; height: 45px; text-align: center; }
    #my-mission-cont .content-my-mission .form-cont form .submit input { margin: 5px 19px 5px 0; color: #ffffff; border: 1px solid #ffffff; font-family: 'Lato', sans-serif; font-size: 16px; font-weight: 700; background-color: #FFC422 /*#b1d100*/; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow: #4c4a48 0px 4px 3px -2px; -moz-box-shadow: #4c4a48 0px 4px 3px -2px; box-shadow: #4c4a48 0px 4px 3px -2px; position: relative; padding: 3px 31px; }
    #my-mission-cont .content-my-mission .foot-my-mision { padding: 3px 14px 5px; background-color: #ff6600; }
    #my-mission-cont .content-my-mission .foot-my-mision p { color: #ffffff; font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700; }
    #my-mission-cont .content-my-mission .foot-my-mision p a { color: #ffffff; font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 700; margin-left: 5px; }

    #my-mission-Recipe { display: block; position: fixed; right: -550px; top: 146px; width: 550px; z-index: 101; }
    #my-mission-Recipe .logo-my-mission { position: absolute; }
    #my-mission-Recipe .content-my-mission { width: 100%; margin: 10px 0px; }
    #my-mission-Recipe .content-my-mission .left-my-mission-content { width: 34%; }
    #my-mission-Recipe .content-my-mission .right-my-mission-content { width: 100%; margin: 0px 40px 0px 0px; }
    #my-mission-Recipe .content-my-mission .title-my-mission { padding: 2px 0 4px 15px; background-color: #748807; }
    #my-mission-Recipe .content-my-mission .title-my-mission h2 { color: #ffffff; font-family: 'Oswald',sans-serif; font-size: 24px; font-weight: 400; }
    #my-mission-Recipe .content-my-mission .register { padding: 8px; background-color: #ffffff; }
    #my-mission-Recipe .content-my-mission .register .avatar { padding: 3px 3px 0; border: 1px solid #d3d3d3; border-top: none; -webkit-box-shadow: #3f3f3f 1px 1px 2px; -moz-box-shadow: #3f3f3f 1px 1px 2px; box-shadow: #3f3f3f 1px 1px 2px; height: 65px; position: relative; }
    #my-mission-Recipe .content-my-mission .register .sign-in { margin: -2px 0 0 10px; }
    #my-mission-Recipe .content-my-mission .register .sign-in p { color: #879636; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; }
    #my-mission-Recipe .content-my-mission .register .sign-in p a { color: #879636; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; text-decoration: underline; }
    #my-mission-Recipe .content-my-mission .register .sign-in h2 { margin: 20px 0 0; color: #5c6c06; font-family: 'Oswald',sans-serif; font-size: 22px; font-weight: 300; }
    #my-mission-Recipe .content-my-mission .join { background: url("../Images/bck-join.jpg") repeat-x scroll 0 0 transparent; height: 138px; padding: 13px 25px 0 32px; }
    #my-mission-Recipe .content-my-mission .join h3 { color: #ffffff; font-size: 22px; font-family: 'Lato', sans-serif; font-weight: 400; text-align: center; }
    #my-mission-Recipe .content-my-mission .join p { color: #ffffff; font-size: 12px; font-family: 'Lato', sans-serif; font-weight: 400; text-align: justify; }
    #my-mission-Recipe .content-my-mission .join p.register-link { margin: 8px 0 0; text-align: center; }
    #my-mission-Recipe .content-my-mission .join p.register-link a { color: #ffffff; border: 1px solid #ffffff; font-size: 14px; font-family: 'Lato', sans-serif; font-weight: 700; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow: #4c4a48 2px 2px 2px; -moz-box-shadow: #4c4a48 2px 2px 2px; box-shadow: #4c4a48 2px 2px 2px; background-color: #b1d100; position: relative; padding: 4px 25px; }
    #my-mission-Recipe .content-my-mission .finder { background-color: #ffffff; padding: 3px 37px 4px 19px; border-bottom: 1px solid #e0e0e0; }
    #my-mission-Recipe .content-my-mission .finder h2 { color: #5c6c06; font-family: 'Oswald',sans-serif; font-size: 23px; font-weight: 400; }
    #my-mission-Recipe .content-my-mission .form-cont { background-color: #f3f3f3; padding-top: 12px; }
    #my-mission-Recipe .content-my-mission .form-cont p { color: #666666; font-size: 12px; font-family: 'Lato', sans-serif; font-weight: 400; margin: 0px 20px 5px; }
    #my-mission-Recipe .content-my-mission .form-cont ul { margin: 0px 0px 10px 0px; }

    #my-mission-Recipe .content-my-mission .form-cont form .left-form-my-mission { border-right: 1px solid #ffffff; width: 49%; }
    #my-mission-Recipe .content-my-mission .form-cont form .right-form-mi-mission { border-left: 1px solid #e0e0e0; width: 49%; padding-bottom: 1px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form { padding: 5px 7px 5px 20px; overflow: hidden; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p { margin: 0px 0px 10px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p label { color: #5c6c06; font-size: 13px; font-family: 'Lato', sans-serif; font-weight: 400; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p input.text { max-width: 60%; width: 169px; height: 22px; border: 1px solid #d4d4d4; border-top: none; background:  url("../Images/back-input.jpg") repeat-x; color: #888888; font-size: 12px; font-family: 'Lato', sans-serif; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p input.submit { border: none; height: 22px; width: 22px; background: url("../Images/search-button.png") no-repeat; margin: 0 0 0 5px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p select { height: auto; color: #888888; font-size: 12px; font-family: 'Lato', sans-serif; float: left; margin: 2px 7px 0 0; width: 170px; }

    #my-mission-Recipe .content-my-mission .form-cont form .div-form p span a.ui-selectmenu,
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p span a.ui-selectmenu, 
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p span a.ui-selectmenu { -webkit-box-shadow: #b7b7b7 0 2px 3px 0px ; -moz-box-shadow: #b7b7b7 0 2px 3px 0px ; box-shadow: #b7b7b7 0 2px 3px 0px ; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p .ui-state-default,
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p .ui-widget-content .ui-state-default, 
    #my-mission-Recipe .content-my-mission .form-cont form .div-form p .ui-widget-header .ui-state-default, 
    #container .content_bottom .left_column .recipe_finder form .content-form p .ui-state-default, 
    #products .content-products .column-product .descrip-column p .ui-state-default { background: #FFFFFF; float: left; max-width: 80%; height: 22px; }

    #my-mission-Recipe .content-my-mission .form-cont form .div-form p span { float: left; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li {  float: left; margin-right: 11px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li:hover, 
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li.selected { margin-bottom: -20px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li:hover a img,
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li.selected a img { width: 50px; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li:hover p span, 
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li.selected p span { font-size: 14px; font-weight: 700; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li.last { margin-right: 0; }
    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li p { margin-bottom: 5px; text-align: center; }

    #my-mission-Recipe .content-my-mission .form-cont form .div-form ul li p span { color: #888888; font-family: 'Lato',sans-serif; font-size: 12px; font-weight: 400; float: none; }
    #my-mission-Recipe .content-my-mission .form-cont form div.submit { margin: 0; height: 45px; text-align: center; }
    #my-mission-Recipe .submit input { margin: 5px 19px 5px 0; color: #ffffff; border: 1px solid #ffffff; font-family: 'Lato', sans-serif; font-size: 16px; font-weight: 700; background-color: #b1d100; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow: #4c4a48 0px 4px 3px -2px; -moz-box-shadow: #4c4a48 0px 4px 3px -2px; box-shadow: #4c4a48 0px 4px 3px -2px; position: relative; padding: 3px 31px; }
    #my-mission-Recipe .content-my-mission .foot-my-mision { padding: 3px 14px 5px; background-color: #ff6600; }
    #my-mission-Recipe .content-my-mission .foot-my-mision p { color: #ffffff; font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700; }
    #my-mission-Recipe .content-my-mission .foot-my-mision p a { color: #ffffff; font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 700; margin-left: 5px; }

    #shadow-mymission { display: none; background: url("../Images/back-detail.png") repeat scroll 0 0 transparent; left: 0; padding: 160px 0; position: fixed; top: 0; width: 100%; height: 100%; z-index: 100; }
    #timeList2 {list-style-type:none;}

}