﻿       
/* SHOPPINGLIST DIALOG
------------------------------------------------ */

#shoppinglist-dialog .inner-body 
{
    padding: 4px 10px 1px 10px;
}

    #shoppinglist-dialog .left-col
    {
        float: left;
        width: 481px;
    }
    #shoppinglist-dialog .right-col
    {
        float: left;
        margin-left: 10px;
        width: 291px;
    }
    #shoppinglist-dialog .headline-bar
    {
        background-image: url('/IMG/dialog/shoppinglist-headline-bar.png');
        background-repeat: repeat-x;
        font-size: 10px;
        height: 39px;
        margin-bottom: 2px;
        padding: 11px;
    }
        #shoppinglist-dialog .headline-bar img.icon
        {
            float: left;
            padding-right: 10px;
        }
        #shoppinglist-dialog .headline-bar h4
        {
            font-size: 12px;
            margin: 6px 0 2px;
        }
            #shoppinglist-dialog .headline-bar div img
            {
                padding-left: 5px;
                vertical-align: text-top;
            }
        #shoppinglist-dialog .list
        {
            height: 268px;
            overflow: auto;
            padding: 0 10px 0 0;
        }
        
        #shoppinglist-dialog img.loading-image
        {   
            display: block;
            margin: 100px auto 0 auto;
        }
        
        /* Ingredients */
        
            #shoppinglist-dialog .list ul.week li.proto
            {
                display: none;
            }
            #shoppinglist-dialog .list ul.week li.day
            {
                background-color: #9ab16f;
                background-image: url('/IMG/dialog/shoppinglist-day-bottom.png');
                background-repeat: no-repeat;
                background-position: bottom;
                margin-bottom: 10px;
                text-align: left;
                width: 456px;
            }
                #shoppinglist-dialog .list ul.week li.day h5
                {
                    background-image: url('/IMG/dialog/shoppinglist-day-header.png');
                    color: #fff;
                    font-size: 12px;
                    height: 22px;
                    padding: 10px 0 0 8px;
                }
                #shoppinglist-dialog .list ul.week li.day .recipe
                {
                    font-size: 11px;
                    padding: 10px 10px 15px 10px;
                }
                #shoppinglist-dialog .list ul.week li.day .recipe .recipe-title
                {
                    font-weight: bold;
                }
                    #shoppinglist-dialog .list ul.week li.day .recipe-image
                    {
                        display: block;
                        float: left;
                        margin-right: 10px;
                    }
                    #shoppinglist-dialog .list ul.week li.day .recipe ul
                    {
                        float: left;
                    }
                    #shoppinglist-dialog .list ul.week ul.ingredients li 
                    {
                        margin-bottom: 5px;
                    }
                    #shoppinglist-dialog .list ul.week ul.ingredients li .add-item img
                    {
                        padding-right: 5px;
                        vertical-align: bottom;
                    }
                    
        /* Shopping list items */
        
        #shoppinglist-dialog .right-col .list
        {
            background-color: #d3ddc1;
            height: 248px;
            padding: 10px 0 10px 6px;
        }
            #shoppinglist-dialog .right-col .list li
            {
                margin-bottom: 5px;
            }
                #shoppinglist-dialog .right-col .list li img
                {
                    padding-right: 3px;
                    vertical-align: middle;
                }
                #shoppinglist-dialog .right-col .list li input, #shoppinglist-dialog .right-col .list li textarea
                {
                    color: #333;
                    font-family: Trebuchet MS, Verdana, Sans-Serif;
                    font-size: 11px;
                    padding: 2px;
                    width: 85%;
                }
                #shoppinglist-dialog .right-col .list li textarea
                {
                    height: 80px;
                    margin-left: 18px;
                }
                #shoppinglist-dialog .right-col .list li textarea, li.new-item input
                {
                    color: #999 !important;
                }
        .shopping-items .proto
        {
            display: none;
        }

        
/* PRINT DIALOG
------------------------------------------------ */

#print-dialog .inner-body
{
    text-align: center;
}
    #print-dialog .col
    {
        float: left;
        width: 50%;
    }
    #print-dialog label
    {
        display: block;
        margin: auto;
        text-align: left;
        width: 98px;
    }
        #print-dialog label img
        {
            padding-bottom: 4px;
        }

/* SEND DIALOG
------------------------------------------------ */

#send-dialog form
{
    color: #333;
}
    #send-dialog fieldset.message-type
    {
        margin-bottom: 10px;
    }
    #send-dialog label
    {
        display: block;
        float: left;
        line-height: 1.7em;
        margin-right: 10px;
        text-align: right;
        width: 100px;
    }
    #send-dialog .fields label
    {
        display: inline;
        float: none;
    }
    #send-dialog div.section
    {
        margin-bottom: 8px;
    }
    #send-dialog div.fields
    {
        float: right;
        width: 280px;
    }
    #send-dialog .input-text
    {
        border-top: 1px solid #848484;
        border-right: 1px solid #c6c6c6;
        border-bottom: 1px solid #e5e5e5;
        border-left: 1px solid #c3c3c3;
        color: #666;    
        font-size: 11px;    
    }
    #send-dialog input.input-text
    {
        height: 14px;
        width: 100%;
    }
    #send-dialog textarea
    {
        font-family: Trebuchet MS, Verdana, Sans-Serif;
        height: 60px;
        margin-bottom: 1em;
        width: 100%;
    }
    
    #send-dialog .remark
    {
        color: #666;
        margin: 4px 0 4px 0;
    }
    
    #send-dialog .closing-remark
    {
        margin: 14px 0 4px 0;
        text-align: center;
    }

    #send-email
    {
        display: block;
    }
       #send-sms
    {
        display: none;
    }
    #confirm
    {
        display: none;
        text-align: center;
    }
        #confirm img
        {
            display: block;
            margin: 20px auto 20px auto;
        }
        #confirm .thank-you
        {
            font-size: 22px;
            margin-bottom: 0.5em;
        }
        #confirm p
        {
            margin-bottom: 4em;
        }
    .invalid-field 
    {
        border: 1px solid Red !important;
    }

        
/* WIZARD DIALOG
------------------------------------------------ */

#wizard-dialog .inner-body
{
    height: 198px;  
    overflow:hidden;
    padding: 10px 0 10px 10px;
}

#wizard-dialog #suggestions li
{
    background-image: url('/IMG/dialog/wizard-day-back.png');
    height: 200px;
    padding-top: 8px;
}
    #wizard-dialog #suggestions li .button
    {
        display: block;
        margin: auto;
        width: 106px;
    }
    #wizard-dialog #suggestions li.proto
    {
        display: none;
    }
    #wizard-dialog #suggestions li p
    {
        height: 70px;
        margin: 10px;
    }
    #wizard-dialog img.loading-image
    {   
        display: block;
        margin: 80px auto 0 auto;
    }
    

/* ARCHIVE DIALOG
------------------------------------------------ */


#archive-dialog .inner-body
{
    height: 300px;
    overflow: auto;
    padding: 0;
}
    #archive-dialog .bottom .button
    {
        float: right;
    }
#archive-dialog .scroll-body
{    
}

#archive-dialog img.loading-image
{   
    display: block;
    margin: 100px auto 0 auto;
}

#archive-dialog ul.weeks
{
    margin: 10px;
}
    #archive-dialog ul.weeks li.week
    {
        background-color: #f0f0f0;
        margin-bottom: 10px;
    }
    #archive-dialog ul.weeks li .week
    {
        padding: 10px 10px 0 10px;
    }
    #archive-dialog ul.weeks li.proto
    {
    	display: none;
    }
    #archive-dialog ul.weeks li .week-bottom
    {
        background: transparent url('/IMG/dialog/bottom-gradient-left.png') no-repeat left top;
        margin-top: -3px;
        padding-left: 7px;
    }
        #archive-dialog ul.weeks li .week-bottom div
        {
            background: transparent url('/IMG/dialog/bottom-gradient-right.png') no-repeat right top;
            height: 13px;
        }
        
        #archive-dialog ul.weeks li .week .left
        {
            float: left;
            width: 128px;
        }
        #archive-dialog ul.weeks li .week .button
        {
            margin: 10px 0 0 0;
            width: 118px;
        }
        #archive-dialog .days 
        {
            float: left;
        }
            #archive-dialog .days li
            {
                color: #101010;
                height: 16px;
            }
                #archive-dialog .days .label
                {
                    float: left;
                    text-align: right;
                    width: 55px;
                }
                #archive-dialog .days .recipe
                {
                    float: left;
                    margin-left: 10px;
                    width: 340px;
                }
                
                #archive-dialog .paging
                {
                    padding-top: 6px;
                }

h5.header-back
{
    background: transparent url('/IMG/dialog/header-back-left.png') no-repeat left top;
    font-size: 12px;
    padding-left: 6px;
}
    h5.header-back span
    {
        background: transparent url('/IMG/dialog/header-back-right.png') no-repeat right top;
        display: block;
        height: 32px;
        line-height: 32px;
        padding-left: 2px;
    }
    
/* NEWSLETTER DIALOG
------------------------------------------------ */

#newsletter-dialog form
{
    color: #333;
}
    #newsletter-dialog h4 {
        color: #333333;
        font-size: 17px;
        margin: 10px 0 40px;
    }
    #newsletter-dialog label
    {
        display: block;
        float: left;
        line-height: 1.7em;
        margin-right: 10px;
        text-align: right;
        width: 60px;
    }
    #newsletter-dialog div.section
    {
        margin-bottom: 8px;
    }
    #newsletter-dialog div.fields
    {
        float: right;
        /*margin-right: 20px;*/
        width: 300px;
    }
    #newsletter-dialog .input-text
    {
        border-top: 1px solid #848484;
        border-right: 1px solid #c6c6c6;
        border-bottom: 1px solid #e5e5e5;
        border-left: 1px solid #c3c3c3;
        color: #666;    
        font-size: 11px;    
    }
    #newsletter-dialog input.input-text
    {
        height: 14px;
        width: 100%;
    }
    #newsletter-dialog .remark
    {
        color: #666;
        margin: 4px 0 4px 0;
    }
    
    #newsletter-dialog .closing-remark
    {
        color: #333333;
        margin: 50px -5px 4px;
    }    
        #newsletter-dialog .closing-remark a {
            color: #b3230d;
        }
        
    #newsletter-dialog .reply
    {
        display: none;
        text-align: center;
    }
        #newsletter-dialog .reply img
        {
            display: block;
            margin: 20px auto 20px auto;
        }
        #newsletter-dialog .reply .thank-you
        {
            font-size: 22px;
            margin-bottom: 0.5em;
        }
        #newsletter-dialog .reply p
        {
            margin-bottom: 4em;
        }
        #newsletter-dialog #newsletter-close {
            display: none;
        }
        
        
        /*Newsletter dialog quick*/
       
    #newsletter-dialog-quick h4 {
        color: #333333;
        font-size: 17px;
        margin: 10px 0 40px;
    }
    #newsletter-dialog-quick label
    {
        display: block;
        float: left;
        line-height: 1.7em;
        margin-right: 10px;
        text-align: right;
        width: 60px;
    }
    #newsletter-dialog-quick div.section
    {
        margin-bottom: 8px;
    }
    #newsletter-dialog-quick div.fields
    {
        float: right;
        /*margin-right: 20px;*/
        width: 300px;
    }
    #newsletter-dialog-quick .input-text
    {
        border-top: 1px solid #848484;
        border-right: 1px solid #c6c6c6;
        border-bottom: 1px solid #e5e5e5;
        border-left: 1px solid #c3c3c3;
        color: #666;    
        font-size: 11px;    
    }
    #newsletter-dialog-quick input.input-text
    {
        height: 14px;
        width: 100%;
    }
    #newsletter-dialog-quick .remark
    {
        color: #666;
        margin: 4px 0 4px 0;
    }
    
    #newsletter-dialog-quick .closing-remark
    {
        color: #333333;
        margin: 50px -5px 4px;
    }    
        #newsletter-dialog-quick .closing-remark a {
            color: #b3230d;
        }
        
    #newsletter-dialog-quick .reply
    {
        display: none;
        text-align: center;
    }
        #newsletter-dialog-quick .reply img
        {
            display: block;
            margin: 20px auto 20px auto;
        }
        #newsletter-dialog-quick .reply .thank-you
        {
            font-size: 22px;
            margin-bottom: 0.5em;
        }
        #newsletter-dialog-quick .reply p
        {
            margin-bottom: 4em;
        }
        #newsletter-dialog-quick #newsletter-close {
            display: none;
        }
        
        #newsletter-dialog-quick .top div 
        {
            background:url("/IMG/dialog/top-right-generic.png") no-repeat scroll right center transparent;
            height:54px;
            }
