/************************************************* STYLESHEET ************************************************** 1. Main HTML 2. Columns 3. Utility Classes 3.1 Button 3.2 Clearfix 4. Global Browser Overrides 4.1 Internet Explorer 6 and Below 4.2 Internet Explorer and Below 4.3 Internet Explorer Only *************************************************/ /************************************************* 1. Main HTML *************************************************/ body { background: #0b2533 url(../images/body-background.png) repeat-x; color: #ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 22px; line-height: 1em; text-align: center; padding: 30px 0 0 0; } a { text-decoration: underline; color: #ffffff; } a:hover { text-decoration: none; } h1 { text-transform: capitalize; font-size: 32px; margin-bottom: 7px; width: 1500px; } h3 { text-transform: capitalize; font-size: 21px; margin-bottom: 28px; padding-left: 26px; background: transparent url(../images/tv.png) no-repeat; cursor: pointer; } h2 { text-transform: capitalize; font-size: 32px; margin-top: 75px; margin-bottom: 20px; } p { margin-bottom: 16px; } span.highlight-red { color: #f6464f; } span.highlight-black { color: #000000; } #live-love-lead { width: 805px; text-align: left; margin: 0 auto; overflow: hidden; } .error { color: #ffdc52; visibility: hidden; display: none; font-size: 16px; margin-bottom: 16px; } .on { visibility: visible; display: block; } .live-love-lead-logo { display: block; background: transparent url(../images/live-love-lead-logo.png) no-repeat; width: 323px; height: 448px; } .live-love-lead-video { float: right; margin-top: 130px; display: block; background: transparent url(../images/video.png) no-repeat; width: 203px; height: 335px; } .live-love-lead-video a { float: right; display: block; width: 203px; height: 117px; } .chick-fil-a-logo { display: inline-block; background: transparent url(../images/chick-fil-a-logo.png) no-repeat; width: 56px; height: 27px; position: relative; top: -5px; } input, textarea { outline-style: none; } form { width: 1000px; } /************************************************* 2. Columns *************************************************/ #live-love-lead-success { font-family: Verdana, Arial, Helvetica, sans-serif; display: block; margin: 0; font-size: 12px; padding: 7px 14px; background-color: #fbfa92; border: 3px solid #f7f535; color: #E1363C; } #live-love-lead-success-container { height: 40px; } #live-love-lead-success-container span { display: block; height: 1px; width: 1px; margin: 0; padding: 0; float: left; } #live-love-lead-success p { margin-bottom: 0; } #live-love-lead-success p strong { font-size: 18px; } #live-love-lead-success p a { text-decoration: underline; } #left-image { display: block; float: left; width: 325px; margin-right: 35px; margin-top: 28px; } #left-form { display: block; float: left; width: 325px; padding-bottom: 50px; margin-top: 20px; } #right-form { display: block; float: left; width: 445px; margin-right: 35px; margin-top: 20px; } #header { padding: 0; height: 133px; background: #0B2533 url(../images/live-love-lead-logo-small.png) no-repeat; margin-bottom: 10px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; } * html #header { width: 805px; } .header-c1 { display: block; float: left; width: 580px; overflow: hidden; } .header-c2 { display: block; float: left; width: 221px; overflow: hidden; } .large-chick-fil-a-logo { display: block; float: left; width: 201px; height: 101px; background: url(../images/large-chick-fil-a-logo.png) no-repeat; margin: 15px 0 0 0; padding: 0; } #header h1 { padding-left: 140px; padding-top: 34px; font-size: 34px; } * html #header h1 { padding-top: 30px; } .invite-friend { display: block; margin: 0 0 30px; background: transparent url(../images/send-your-friends-a-free-ticket.png) no-repeat; width: 100%; height: 58px; width: 200px; cursor: pointer; padding: 0; } .invite-friend:hover { background: transparent url(../images/send-your-friends-a-free-ticket.png) no-repeat 0 -58px; } #live-love-lead-video { margin-bottom: 30px; } #left-form p.see-dan-cathy { font-size: 18px; } #right-form p.date, #right-form p.time { margin-bottom: 0; } #right-form p.instructions { font-size: 16px; margin-bottom: 16px; } #left-form p.date, #right-form p.time { margin-bottom: 2px; } #left-form p.instructions { font-size: 16px; margin-bottom: 16px; } #left-form p { font-size: 16px; margin-bottom: 16px; } .ticket-success-header { font-size: 22px; margin-bottom: 16px; } #right-form .input-name { margin-bottom: 16px; margin-top: 4px; } #right-form .input-name span { color: #269fa8; font-size: 16px; margin-bottom: 1px; } #right-form .input-name div input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background-small.png) no-repeat; width: 121px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-name div.error { margin: 0 0 0 12px; } #right-form .input-name div.first-name { float: left; display: block; width: 143px; margin-right: 6px; } #right-form .input-name div.last-name { float: left; display: block; width: 143px; } #right-form .input-email { margin-bottom: 16px; } #right-form .input-email span { color: #269fa8; font-size: 16px; margin-bottom: 1px; } #right-form .input-email div input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-email div.error { margin: 0 0 0 12px; } #right-form .input-submit { margin-bottom: 0; } #right-form .input-submit div { color: #0b2533; text-transform: capitalize; } #right-form .input-submit input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/submit-input-background.png) no-repeat; width: 214px; height: 37px; text-align: right; cursor: pointer; } #right-form .input-submit input:hover { background: transparent url(../images/submit-input-background.png) no-repeat -213px 0; } #right-form ul { margin-left: 1.5em; font-size: 16px; margin-bottom: 16px; } #right-form #footer {} /* Form Tags */ #registration-form { font-size: 16px; /*height: 400px;*/ margin: 0; padding: 0; } #registration-form form { width: 445px; } #registration-form .ticket-event-loader { height: 400px; } #registration-form .errors { display: block; float: left; color: #ffdc52; font-size: 16px; margin-bottom: 16px; margin-left: 80px; } #registration-form label { display: block; float: left; width: 80px; margin: 0; padding: 7px 0 0 0; } #registration-form #lost-ticket-title { margin-bottom: 14px; } *:first-child+html #registration-form label { padding: 4px 0 0 0; } * html #registration-form label { padding: 4px 0 0 0; } *:first-child+html #registration-form select { position: relative; top: 3px; } * html #registration-form select { position: relative; top: 3px; } #registration-form input { display: block; float: left; width: 353px; margin: 0; padding: 0; } #registration-form select { display: block; float: left; width: 360px; margin: 0 0 -2px 0; padding: 0; height: 22px; } *:first-child+html #registration-form input { color: #000000 !important; } *html #registration-form input { color: #000000 !important; } *:first-child+html #registration-form select { color: #000000 !important; } *html #registration-form select { color: #000000 !important; } #registration-form button { margin: 10px 0 10px 80px; } #registration-form .lost-ticket-message { margin-right: 6px; } #registration-form .lost-ticket { margin-left: 80px; margin-top: 30px; } /*#registration-form .lost-ticket a { border-bottom: 1px solid #ffffff; }*/ #registration-form .lost-ticket a:hover { border: none; } #registration-form .mobile-container { margin-bottom: 16px !important; } #registration-form .address-container { margin-bottom: 16px !important; } #registration-form input#address { width: 353px; margin: 0 6px 6px 0; } #registration-form input#city { width: 1px; margin: 0 6px 0 80px; } #registration-form select#state { width: 75px; margin: 0 6px -2px 0; } #registration-form input#zip { width: 85px; margin: 0 6px 0 0; } #registration-form .fields-help { display: block; float: left; width: 80px; margin: 0; padding: 0; } #registration-form #venue-field { display: block; float: left; margin: 0 0 10px 0; padding: 0; width: 100%; } #registration-form #venue-field label { padding-top: 2px; } #registration-form #venue-field #venue-container { display: block; float: left; width: 353px; font-size: 14px; } #registration-form #venue-field #venue-container div { margin: 0 0 6px 0; } #registration-form #venue-field #venue-container input { display: block; float: left; width: 15px; margin: 1px 12px 0 0; padding: 0; } #registration-form #venue-field #venue-container label { display: block; float: left; width: 325px; padding: 0; } #registration-form .volunteer { display: block; float: left; width: 100%; font-size: 14px; padding: 5px 0 0 80px !important; } /*#registration-form .volunteer div { margin: 0 0 6px 0; }*/ #registration-form .volunteer input { visibility: visible; margin: 1px 12px 0 0; padding: 0; width: 15px; display: inline; float: none; } #registration-form .volunteer input[type=hidden] { display: none !important; visibility: hidden !important; } #registration-form .volunteer label { margin: 0; padding: 7px 0 0; width: 200px; display: inline; float: none; } * html #registration-form .volunteer input { margin: 1px 6px 0 0 !important; } /*#registration-form .volunteer { display: block; float: left; width: 430px; font-size: 14px; padding: 5px 0 0 0 !important; } #registration-form .volunteer div { margin: 0 0 6px 0; } #registration-form .volunteer input { display: block; visibility: visible; float: left; margin: 1px 12px 0 80px; padding: 0; width: 15px; } #registration-form .volunteer input[type=hidden] { display: none !important; visibility: hidden !important; } #registration-form .volunteer label { display: block; float: left; margin: 0; padding: 7px 0 0; width: 200px; } * html #registration-form .volunteer input { margin: 1px 6px 0 40px !important; }*/ #registration-form .name-container input, #registration-form .email-container input, #registration-form .mobile-container input, #registration-form .lost-ticket-form input#email { width: 271px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; height: 13px; padding: 9px 71px 5px 11px; } #registration-form .address-container input#address { width: 271px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; height: 13px; padding: 9px 71px 5px 11px; } #registration-form .address-container input#city { width: 91px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background-city.png) no-repeat; height: 13px; padding: 9px 11px 5px 11px; } #registration-form .address-container select#state { width: 93px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background-state.png) no-repeat; height: 30px; padding: 8px 6px 8px 11px; } #registration-form .address-container input#zip { width: 52px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background-zip.png) no-repeat; height: 13px; padding: 9px 11px 5px 11px; } #registration-form .age-container select, #registration-form .gender-container select { width: 292px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; height: 30px; padding: 8px 6px 8px 11px; } #registration-form .form-field { margin-bottom: 6px; padding: 0; } #registration-form form div:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } #registration-form form div { display: inline-block; } /* \*/ * html #registration-form form div { height: 1%; } #registration-form form div { display: block; } /* */ #registration-form:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } #registration-form { display: inline-block; } /* \*/ * html #registration-form { height: 1%; } #registration-form { display: block; } /* */ *:first-child+html #registration-form .address-container input#address { width: 210px; } * html #registration-form .address-container input#address { width: 210px; } /* { background-image: none; background-color: #155a5e; border: 1px solid #0b3134; } */ *:first-child+html #registration-form .address-container input#address { background-image: none; background: #ffffff; } *:first-child+html #registration-form .address-container input#city { background-image: none; background: #ffffff; } *:first-child+html #registration-form .address-container input#zip { background-image: none; background: #ffffff; } *:first-child+html #registration-form .name-container input, *:first-child+html #registration-form .email-container input, *:first-child+html #registration-form .mobile-container input { background-image: none; background: #ffffff; width: 210px; } *:first-child+html #registration-form .address-container select#state { height: 30px; } *:first-child+html #registration-form .age-container select, *:first-child+html #registration-form .gender-container select { height: 30px; } * html #registration-form .address-container input#address { background-image: none; background: #ffffff; } * html #registration-form .address-container input#city { background-image: none; background: #ffffff; } * html #registration-form .address-container input#zip { background-image: none; background: #ffffff; } * html #registration-form .name-container input, * html #registration-form .email-container input, * html #registration-form .mobile-container input { background-image: none; background: #ffffff; width: 210px; } * html #registration-form .address-container select#state { height: 30px; } *:first-child+html #registration-form .age-container select, *:first-child+html #registration-form .gender-container select { height: 30px; } * html #registration-form form { width: 440px; overflow: hidden; } * html #registration-form form { width: 435px; overflow: hidden; } * html #live-love-lead { width: 900px; } * html #registration-form .errors { margin-left: 40px !important; } * html #registration-form button { margin-left: 40px !important; } * html #registration-form input#city { margin-left: 40px !important; } * html .form-field-clear { display: none !important; visibility: hidden !important; } /* * html #registration-form .lost-ticket { margin-top: 10px; } */ #pass-along { margin-top: 28px; margin-left: 80px; padding-bottom: 150px; } #registration-form .required-field label { color: #f6464f !important; font-weight: bold !important; } /*#right-form .input-1-name, #right-form .input-2-email, #right-form .input-3-age, #right-form .input-4-address1, #right-form .input-5-mobile, #right-form .input-6-how { margin-bottom: 16px; } #right-form .input-1-name span, #right-form .input-2-email span, #right-form .input-3-age span, #right-form .input-4-address1 span, #right-form .input-5-mobile span, #right-form .input-6-how span { color: #269fa8; font-size: 16px; margin-bottom: 1px; } #right-form .input-1-name div input, #right-form .input-2-email div input, #right-form .input-4-address1 div input, #right-form .input-5-mobile div input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-3-age div select { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 292px; height: 35px; padding: 8px 7px 12px 11px; margin-bottom: 0; } #right-form .input-6-how div input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/textarea-input-background.png) no-repeat; width: 270px; height: 67px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-4-address1 div input, { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-4-address1 div div.city input, { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-4-address1 div div.state select, { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 0; } #right-form .input-4-address1 div div.zip input, { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/text-input-background.png) no-repeat; width: 270px; height: 13px; padding: 9px 11px 5px 11px; margin-bottom: 5px; } #right-form .input-1-name div.error, #right-form .input-2-email div.error, #right-form .input-3-age div.error, #right-form .input-4-address1 div.error, #right-form .input-5-mobile div.error, #right-form .input-6-how div.error { margin: 0 0 0 12px; }*/ /*#right-form .input-name { margin-bottom: 7px; }*/ /*#right-form .input-submit input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/submit-input-background.png) no-repeat; width: 163px; height: 15px; padding: 10px 26px 12px 26px; text-align: right; }*/ /*#right-form .input-submit input { font-family: Arial, Helvetica, sans-serif; display: block; color: #ffffff; border: none; background: transparent url(../images/submit-input-background.png) no-repeat; width: 215px; height: 37px; padding: 10px 26px 12px 26px; text-align: right; }*/ /* TICKET */ body#ticket { background-image: none; background-color: #FFFFFF; color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif; } #ticket h1 { display: block; float: left; width: 498px; height: 78px; background: url(../images/admit-one.png) no-repeat; margin: 0; } #ticket h2 { text-align: left; font-size: 13px; margin: 0 0 11px 0; line-height: 13px; color: #949598; } #ticket h3 { font-size: 29px; margin: 0 0 3px 0; line-height: 24px; font-weight: normal; } #ticket h4 { font-size: 29px; margin: 0 0 13px 0; line-height: 24px; font-weight: normal; } #ticket h5 { font-size: 26px; margin: 0; line-height: 21px; color: #949598; font-weight: normal; } #ticket #live-love-lead-info p { text-align: left; font-family: Arial, Helvetica, sans-serif; font-size: 33px; margin: 0 0 15px 0; line-height: 23px; font-weight: bold; } #ticket #live-love-lead-info p.paragraph-2 { font-size: 33px; margin-bottom: 23px; line-height: 23px; } #live-love-lead-header { margin: 0 auto; text-align: left; width: 812px; height: 90px; } #live-love-lead-ticket { margin: 0 auto; text-align: left; width: 800px; border: 6px solid #949598; } #live-love-lead-ticket * { text-transform: uppercase; } #live-love-lead-footer { margin: 0 auto 21px; text-align: left; width: 812px; text-align: right; font-size: 9px; } #live-love-lead-ticket #live-love-lead-info, #live-love-lead-ticket #live-love-lead-details, #live-love-lead-ticket #live-love-lead-barcode { display: block; float: left; padding: 15px; } #live-love-lead-ticket #live-love-lead-info { width: 770px; border-bottom: 5px solid #bcbdc0; text-align: right; } #live-love-lead-ticket #live-love-lead-details-barcode { width: 800px; display: block; float: left; } #live-love-lead-ticket #live-love-lead-details { padding: 7px 15px; width: 520px; border-right: 5px solid #bcbdc0; } #live-love-lead-ticket #live-love-lead-barcode { padding: 7px 0; width: 245px; text-align: center; } #live-love-lead-ticket #live-love-lead-barcode img { margin-bottom: 4px; } #live-love-lead-ticket #live-love-lead-barcode p span { font-size: 16px; margin: 0 0 5px 0; line-height: 14px; } #live-love-lead-ticket #live-love-lead-barcode p { font-size: 24px; margin: 14px 0 0 0; line-height: 9px; } #gmap-error { color: red; } .row-1, .row-2, .row-3, .row1-col1, .row1-col2, .row2-col1, .row2-col2 { display: block; float: left; } .row-1 { width: 770px; } .row-2 { width: 770px; height: 109px; } *html .row-2 { overflow: hidden; } .row-3 { width: 770px; } .row1-col1 { width: 471px; } .row1-col2 { width: 109px; } .row2-col1 { width: 471px; } .row2-col2 { width: 109px; height: 108px; } *html .row2-col2 { overflow: hidden; } #ticket img.lll-logo { position: relative; top: -180px; } #registration-form button.submitting { border: none; background: transparent url(../images/throbber.gif) center center no-repeat; } #registration-form button.submitting span { visibility: hidden !important; } .right-form-content-off { display: none; visibility: hidden; } .right-form-content-on { display: block; visibility: visible; } #pass-along { cursor: pointer; display: block; float: left; width: 231px; height: 75px; background: transparent url(../images/pass-along.png) no-repeat; } #live-love-lead-details h3 { padding-left: 0 !important; } #live-love-lead-number { text-align: right; width: 800px; margin: 10px auto 10px; height: 50px; } *:first-child+html #live-love-lead-number { text-align: left; } *html #live-love-lead-number { text-align: left; } #map_wrapper { clear: both; width: 810px; margin: 0px auto; padding-bottom: 16px; font-size: 12px; page-break-before: always; } #map_wrapper h2 { font-size: 18px; } #map_wrapper p { text-align: left; font-size: 12px; } #directions { float: left; width: 275px; height: 500px; text-align: left; } #directions form { width: auto; } #directions form input { width: 235px; } #map_canvas { float: left; width: 525px; height: 500px; } .address-info { text-align:left; line-height: 18px; } /************************************************* 3. Utility Classes *************************************************/ /* 3.1 Button */ button, .button { font-weight: normal; background-color: #7293c6; color: #ffffff; border: 1px solid #ffffff; font-family: Georgia, "Times New Roman", Times, serif; padding: 6px 13px 4px; line-height: 130%; font-size: 16px; cursor: pointer; display: block; float: left; text-decoration: none; } button:hover, a.button:hover { background-color: #7293c6; } button { background-color: #e1363c; } button:hover { background-color: #e1363c; } button img, a.button img { border: medium none; float: none; height: 16px; margin: 0 3px -3px 0 !important; padding: 0; width: 16px; } /* 3.2 Clearfix */ .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } /* \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* */ /************************************************* 4. Global Browser Overrides *************************************************/ /* 4.1 Internet Explorer 6 and Below */ * html h1 { width: 100%; } * html form { width: 100%; } /* 4.2 Internet Explorer 7 and Below */ *:first-child+html #right-form .input-email div input { padding: 7px 11px 7px 11px; } * html #right-form .input-email div input { padding: 7px 11px 7px 11px; } *:first-child+html #right-form .input-name div input { padding: 7px 11px 7px 11px; } * html #right-form .input-name div input { padding: 7px 11px 7px 11px; } *:first-child+html .chick-fil-a-logo { top: -2px; } * html .chick-fil-a-logo { top: -2px; } /* 4.3 Internet Explorer 7 Only */