/* ========================================
   == Layout
      -- contains page layout 
         and general styles
   ======================================== */
/*---- COMMON STYLES ----*/
* {
    margin: 0;
    padding: 0;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-weight: 900;
    line-height: 125%;
}

    * a { outline: none; }
    
        * a:link, * a:visited { color: #CCC; text-decoration: underline; }
        
        * a:hover, * a:active { color: #FFF; text-decoration: none; }

body { margin: 0 0 8px 0; }

.clear {
    margin: 0;
    padding: 0;
    width: 0;
    height: 0;
    clear: both;
}

.registration {
    font-size: 80%;
    vertical-align: text-top;
    color: inherit !important;
}

.italic { font-style: italic; }
.bold { font-weight:bold; }
	

.leftMargin { margin-left: 36px !important; }

#page {
    margin: 0 auto;
    width: 955px;
}

/*---- START CONTENT CONTAINER ----*/
#content_container {
    margin: 12px 0 0 0;
    font-size: 12px;
    color: #CCC;
    width: 953px;
    border: 1px solid #183B03;
}

    #content_container #content {
        height: 502px;
        background-image: url(/MurphyOilSoap/US/EN_v2/images/common/content_background.jpg);
        background-repeat: no-repeat;
        background-position: top center;
    }
    
        /*-- left column --*/
        #content_container #content #left { float: left; height: 502px; text-align: center; }
        
            #content_container #content #left #ViewIngredients { margin: -20px 0 0 0; padding: 0; width: 155px; text-align: left; font-size: 11px; }
            
                #content_container #content #left #ViewIngredients p { margin: 0 0 12px 0; padding: 0 8px 0 12px; }
                
            #content_container #content #left #ViewIngredients #ingredientButton { margin: 0; text-align: center; }
            
            #content_container #content #left #BuyNow { margin: 12px 0 0 0; text-align: center; }
            
            #content_container #content #left #backButton { margin: 12px 0 0 0; text-align: center; }
        /*-- main column --*/
        #content_container #content #main { height: 502px !important; }
        
            #content_container #content #main h2.section {
                margin: 0 0 12px 0;
                padding: 13px 0 0 0;
                font-size: 15px;
                color: #999;
            }
            
            /*-- column control --*/
            #content_container #content #main #single_column {}
            
            #content_container #content #main #two_column { width: 397px; float: left; }
            
            #content_container #content #main #two_column .jScrollPaneContainer { margin: 0 24px 0 0; float: left !important; }
            
            /*-- scrollable content --*/
            #content_container #content #main #single_column #scrollable { width: 701px; }
            
            #content_container #content #main #two_column #scrollable { width: 381px; }
            
                #content_container #content #main #scrollable h3.headline {
                    margin: 0 0 18px 0;
                    font-size: 18px;
                    color: #FFF;
                    max-width: 380px;
                }
				
				#content_container #content #main #scrollable h3.subheadline {
                    padding-top:15px;
					margin: 0 0 7px 0;
                    font-size: 14px;
                    color: #FFF;
                    max-width: 380px;
                }
                
                    /* extends class registration (IE FIX) */
                    #content_container #content #main #scrollable h3.headline .registration { color: #FFF }
                
                #content_container #content #main #scrollable h4 { margin: 0; font-size: 13px; clear: both; }
                #content_container #content #main #scrollable h4.emphasis { font-style:italic; }
                #content_container #content #main #scrollable h4.underline { text-decoration:underline; }
                
                #content_container #content #main #scrollable p { margin: 0; padding: 0 0 8px 0; clear: both; }
				
                #content_container #content #main #scrollable p .small_link { font-size:10px; }
				
				#content_container #content #main #scrollable .answer { display:none; margin-top:4px; margin-bottom:10px; }
				
				#content_container #content #main #scrollable a:link, a:visited { color: #CCC; text-decoration: underline; }
        
				#content_container #content #main #scrollable a:hover, a:active { color: #CCC; text-decoration: underline;  }

				
                #content_container #content #main #scrollable ul {
                    margin: 0 40px 40px 0;
                    padding: 0;
                    list-style: none;
                }
                
                #content_container #content #main #scrollable ul li {
                    margin: 0 0 3px 0;
                    padding: 0 0 0 8px;
                    background-image: url(/MurphyOilSoap/US/EN_v2/images/common/grey_bullet.gif);
                    background-repeat: no-repeat;
                    background-position: 0 6px;
                }
                
                    #content_container #content #main #scrollable ul li.column_list_title { padding: 0 0 0 2px; background-image: none; }
                
                    /*-- multi-column list --*/
                    #content_container #content #main #scrollable ul.column_list { float: left; }
                    
                        #content_container #content #main #scrollable ul.column_list li.column_list_title { padding: 0 0 0 2px; background-image: none; }
                
                #content_container #content #main #scrollable ol { margin: 0 40px 40px 18px; *margin-left: 22px; }
                
                
                
            /*-- right column --*/
            #content_container #content #main #product_video { width: 338px; float: left; }

/*---- END CONTENT CONTAINER ----*/