body
{
    margin: 0;
    padding:0;
}


/* **************************************************************************** */
/* Recipe Card 3x5 and 4x6 */
/* **************************************************************************** */

        div {
            font-family: arial;
        }
        
        /* ************************************************************** */
        /* Recipe Card Frame 4 x 6 */
        div.CardFrameFourBySix
        {
            width: 432px;
            height: 288px;
            background: url(../images/RecipeCards/RecipeCard_4x6_front.gif) no-repeat 0% 0%;
            overflow: hidden;
        }
        div.FourBySixBack
        {
            background: url(../images/RecipeCards/RecipeCard_4x6_back.gif) no-repeat 0% 0% !important;
        }
        /* ************************************************************** */
        /* Recipe Card Frame 3 x 5 */
        div.CardFrameThreeByFive
        {
            border-bottom: solid 1px #000;
            width: 360px;
            height: 216px;
            background: url(../images/RecipeCards/RecipeCard_3x5.gif) no-repeat 0% 0%;
            overflow: hidden;
        }        
        
        
            /* Container of the Recipe Name Exclusive for the 4x6 */
            div.CardFrameFourBySix div.RecipeName
            {
                margin-top: 25px;
                height: 32px;
                width: 432px;
                overflow: hidden;
            }
            
            /* Container of the Recipe Name Exclusive for the 3x5 */
            div.CardFrameThreeByFive div.RecipeName
            {
                margin-top: 0px;
                height: 32px;
                width: 360px;
                overflow: hidden;
            }

            /* Inner Container of the Recipe Name for vertical alignment Exclusive for the 4x6 */
            div.CardFrameThreeByFive table.RecipeName,
            div.CardFrameFourBySix table.RecipeName
            {
                height: 32px;
                width: 100%;
            }

            div.CardFrameThreeByFive table.RecipeName td,
            div.CardFrameFourBySix table.RecipeName td
            {
                vertical-align: middle;
                padding-left: 130px;
                padding-right: 5px;
                font-size: 11px;
                font-weight: bold;
                text-align: right;
                line-height: 12px;
            }
            
            div.FourBySixBack table.RecipeName td
            {
                padding-left: 5px !important;
                text-align: left;
            }

            /* Table Cell override for the 3x5 Exclusive for the 3x5 */
            div.CardFrameThreeByFive table.RecipeName td
            {
                padding-left: 50px;
            }
            
           
            /* Container of the Serving Size */
            div.CardFrameThreeByFive div.ServingSize,
            div.CardFrameFourBySix div.ServingSize
            {
                font-size: 9px;
                /*font-weight: bold;*/
                text-align: right;
                height: 15px;
                margin-bottom: 0px;
                padding-right: 5px;
            }
            
            div.FourBySixBack div.ServingSize
            {
                text-align: left;
                padding-left: 5px;
            }
            
            /* Override for 3x5 */
            div.CardFrameThreeByFive div.ServingSize
            {
                margin-bottom: 15px;
            }                        
                        
            div.CardFrameThreeByFive div.ServingSize b,
            div.CardFrameFourBySix div.ServingSize b
            {
                font-size: 9px;
            }
            
            /* Container of the Marketing link at the bottom of the card */
            div.CardFrameThreeByFive div.Marketing,
            div.CardFrameFourBySix div.Marketing
            {
                font-size: 9px;
                text-align: right;
                padding-right: 5px;
                overflow: hidden;
            }
            div.CardFrameThreeByFive div.Marketing a,
            div.CardFrameFourBySix div.Marketing a
            {
                text-decoration: none;
                font-size: 9px;
                color: red;
            }
            
            /* Container of the Directions view of the card */
            div.CardFrameThreeByFive div.DirectionsArea,
            div.CardFrameFourBySix div.DirectionsArea
            {
                font-size: 11px;
                font-weight: bold;
                padding: 0px 10px 10px 10px;
                height: 172px;
                overflow: hidden;
            }
            
            /* Override for 3x5 */
            div.CardFrameThreeByFive div.DirectionsArea
            {
                height: 132px;
            }
            
            div.CardFrameFourBySix div.DirectionsArea div.Directions
            {
                font-size: 9px;
                padding: 0px;
            }
            div.CardFrameThreeByFive div.DirectionsArea div.Directions
            {
                font-size: 8px;
                padding: 0px;
            }

            div.CardFrameFourBySix div.DirectionsArea div.Directions span
            {
                /*color: red;*/
                font-size: 11px;
            }
            
            div.CardFrameThreeByFive div.DirectionsArea div.Directions span
            {
                /*color: red;*/
                font-size: 10px;
            }            
            /* Container of the Ingredients view of the card */
            div.CardFrameThreeByFive div.IngredientsArea,
            div.CardFrameFourBySix div.IngredientsArea
            {
                font-size: 11px;
                font-weight: bold;
                padding: 10px;
                height: 172px;
                overflow: hidden;
            }
            
            /* Override for 3x5 */
            div.CardFrameThreeByFive div.IngredientsArea
            {
                height: 132px;
            }
            
            div.CardFrameThreeByFive div.IngredientsArea div.Label,
            div.CardFrameFourBySix div.IngredientsArea div.Label
            {
                width: 110px;
                text-align: right;
                float: left;
            }
            
            div.CardFrameThreeByFive div.IngredientsArea div.Ingredients,
            div.CardFrameFourBySix div.IngredientsArea div.Ingredients
            {
                font-size: 9px;
                padding: 0px;
                width: 292px;
                float: right;
            }
            
            /* Override for 3x5 */
            div.CardFrameThreeByFive div.IngredientsArea div.Ingredients
            {
                width: 222px;
                font-size: 8px;
            }

            div.CardFrameThreeByFive div.IngredientsArea div.Ingredients span,
            div.CardFrameFourBySix div.IngredientsArea div.Ingredients span
            {
                /*color: red;*/
                font-size: 11px;
            }            
            
            div.CardFrameThreeByFive div.IngredientsArea div.Ingredients span
            {
                font-size: 9px;
            }