a.dialogue {} a.button { display: inline-block; line-height: 20px; height: 20px; padding: 0px 10px 0px 10px; margin-top: 4px; background-color: #2C2C2C; border-radius: 15px; color: #ffe03a; cursor: pointer } a.button:hover, #hm_links a.button:hover {color: #FFFFFF} .contentMiddle {float:left;padding:0px} /********************* CATEGORIES MENU *****************************/ #shopCategories {float:left;width:143px;} #shopCategories ul {margin:0px;padding:0px} #shopCategories li {list-style:none;margin:0px;padding:0px;border-bottom:1px solid #7c478c} #shopCategories li a {width:133px;display:block;padding:5px;background-color:#f3eff5;color:#7e4a8d} #shopCategories li a:hover {background-color:#d9cadd;color:#8b5d99} /******************** RIGHT COLUMN BOXES *******************************/ .rightSide {float:left;margin-left:20px} .rightSide .sideBox {width:162px;border:1px solid #7c478c;padding:10px;margin-bottom:20px} .rightSide .sideBox h3 {margin-bottom:10px} /******************** RIGHT COLUMN BOXES *******************************/ #specials_img {width:176px; height:238px; border:1px solid #cecece;margin-bottom:10px;} #normal_price {padding-left:10px; float:left; text-decoration: line-through; color:#FD8300; font-size:1.33em; font-weight:bold; font-family: Arial, Verdana, Helvetica, sans-serif;} #special_price {padding-left:10px; float:left; color:#E61725; font-size:1.33em; font-weight:bold; font-family: Arial, Verdana, Helvetica, sans-serif;} #specials_descp {padding-left:10px; padding-top:10px; padding-bottom:10px;font-weight:bold; font-size:1.17em; font-family: arial, verdana, helvetica, sans-serif;} .specials_thumb {padding-left:10px; padding-bottom:10px;} /********************* SHOPPPING CART SIDE BOX *************************/ #shoppingCart {height:80px;position:relative} #shoppingCart .links {position:absolute;bottom:5px;left:10px;width:163px;} #shoppingCart .links .left {float:left} #shoppingCart .links .right {float:right} /********************* SPECIALS SIDE BOX *****************************/ #shopSpecials ul {padding:0px;margin:0px} #shopSpecials li {list-style:none} /********************* PRODUCTS LIST *******************************/ .products4 {overflow: hidden;padding:0px 0px 10px 0px;width:110%; width: calc( 133.3% - 232px);} .products3 {overflow: hidden;padding:0px 0px 10px 0px;width:110%; width: calc( 150% - 357px);} .product {float:left;margin:10px 18px 0px 0px;text-align:center;} .products4 .columns4 { overflow: hidden;width:174px;height:297px; margin:10px calc( 25% - 174px) 0px 0px; } .products3 .columns3 { overflow: hidden;width:238px;height:354px; margin:10px calc( 33.3% - 238px) 0px 0px; } @media screen and (max-width: 740px) { .products3 { width: calc(200% - 476px); } .products3 .columns3 { width:238px;height:354px; margin:10px calc( 50% - 238px) 0px 0px; } } @media screen and (max-width: 498px) { .products3 { width: calc(200% - 348px); } .products3 .columns3 { width:174px;height:297px; margin:10px calc( 50% - 174px) 0px 0px; } .products3 .columns3 img.productThumb { width: 172px; height: auto } } @media screen and (max-width: 720px) { .products4 { width: calc(150% - 261px); } .products4 .columns4 { width:174px;height:297px; margin:10px calc( 33.3% - 174px) 0px 0px; } } @media screen and (max-width: 544px) { .products4 { width: calc(200% - 348px); } .products4 .columns4 { width:174px;height:297px; margin:10px calc( 50% - 174px) 0px 0px; } } @media screen and (max-width: 360px) { .products4 { width: calc(200% - 300px); } .products4 .columns4 { width:150px;height:297px; margin:10px calc( 50% - 150px) 0px 0px; } .products4 .columns4 img.productThumb { width: 150px; height: auto } .products3 { width: calc(200% - 300px); } .products3 .columns3 { width:150px;height:297px; margin:10px calc( 50% - 150px) 0px 0px; } .products3 .columns3 img.productThumb { width: 150px; height: auto } .products4 .right-ws, .products3 .right-ws { padding-right: 10px } } /*.products .wrapcolumn { margin-right: 0px }*/ .product .thumb {min-height:164px;border:1px solid #efeeee;} .product .thumb img {border-width:0px;} .product .info {height:35px; padding-top:8px; padding-bottom:10px; text-align:left; color:#2C2C2C; font-weight:bold; font-size:1.17em; font-family:arial, verdana, helvetica, sans-serif;} .product .actions {margin-top:10px;} .product {} .price {color:#2C2C2C;text-align:left; font-weight:bold; font-size:1.17em; font-family:arial, verdana, helvetica, sans-serif;} #details_cart_strip .price { color: #ffe03a } #details_cart_strip a.button { background-color: #ffe03a; color: #2C2C2C; margin-top: 0px; font-weight: bold } #details_cart_strip #prod_qty { color: #ffe03a; } span.strike {text-decoration:line-through;color:#2C2C2C;} .special {color:#e61725;} #cart_checkout_container a.button {min-width: 6em; text-align: center} /********************* PRODUCT DISPLAY ****************************/ #product {position:relative;float:left;width:510px;} #product .links {text-align:center;position:absolute;bottom:10px;width:610px} #product .links a {font-weight:bold} #product .links .left {float:left} #product .links .right {float:right} #product .form {margin-top:20px} #product .form .label {width:80px; color:#000000;} #product .form .buttons {margin-left:80px} #product .form label {font-weight:bold} #product .form input.number {width:50px} #product .image {float:left;width:300px} #product .info {float:left;margin-left:10px;} #imageMenu {width:180px;overflow:hidden;margin:10px auto} #imageMenu ul {margin:0;padding:0} #imageMenu li {margin:0;padding:0 5px;float:left;list-style:none} #mainImage {position:relative;width:300px;height:200px} #imgMain {position:absolute;left:0;top:0;z-index:2} #imgMain2 {position:absolute;left:0;top:0;z-index:1} .checkout {width:610px;margin-left:20px;} /********************* STAGES MENU **************************************/ .stages {margin:5px 0px 0px 0px; width:130px; float:right;} .stages ul {padding:0px; float:left; margin:0;} .stages li {display:block; background-color: #2C2C2C; width:26px; height:26px; list-style:none; float:left; color:#ffffff;border-radius:13px} .stages li:not(:first-child) { margin-left: 3px } .stages li.selected { background-color: #656565; } .stages li a {display:block; line-height: 26px;color:#ffffff;width: 100%; height: 26px; text-align: center} .stages li span {display:block; line-height: 26px;color:#ffffff;width: 100%; height: 26px; text-align: center} .stages li a:hover, .stages li a.selected, .stages li span.selected {color:#ffffff; width:26px; height:26px;} .secure {float:right} /********************* SHOPPING CART *********************/ .shoppingCart {width:510px;} .shoppingCart .cartItem {padding:5px;margin-bottom:20px} .shoppingCart .cartItem .field {float:left;margin-left:10px;width:80px} .shoppingCart .cartItem .thumb {margin-left:0px;border:1px solid #7c478c;width:40px} .cartItem .productName {} .cartItem input.number {width:30px;font-size:0.83em;height:12px} .cartItem .value {margin-top:3px;display:block} #shopPopupImage {border:1px solid #7c478c} #cart_checkout_container {max-width:724px;width: 100%;margin-top:20px; padding-bottom:20px; margin-right: auto; margin-left: auto} #cart_header_row {max-width:724px;width: 100%; margin-bottom:1px; height:20px; border-bottom:1px dotted #0c5396;} #hd_item {float:left;padding-left:10px;min-width: 85px;max-width:204px; width: 28%; width: calc( 29% - 10px ); color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #hd_price {float:left;max-width:65px;min-width: 50px; width: 8.9%; text-align:center;color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #hd_quantity {float:left;max-width:62px; min-width: 32px; width:7.2%; text-align:center;color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #hd_subtotal {float:left;max-width:85px; min-width: 52px; width: 11.7%; text-align:left;color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #hd_customise {float:right;max-width:88px; min-width: 65px; width: 14%; text-align:center;color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #clear_cart_header_titles {clear:both;} #cart_checkout_container #prod_item {min-width: 85px;max-width:204px; width: 28%; width: calc( 29% - 10px );} #cart_checkout_container #prod_price { max-width:65px;min-width: 50px; width: 8.9%; padding-left:0px; } #cart_checkout_container #prod_qty { max-width:62px; min-width: 32px; width:7.2%; padding-left:0px; } #cart_checkout_container #prod_subtotal {max-width:85px; min-width: 52px; width: 11.7%;padding-left:0px;text-align:left;} #cart_checkout_container #prod_edit { max-width:88px; min-width: 65px; width: 14%; } #cart_custom_item_list .custom_item { float: left; max-width: 331px; min-width: 167px; width: 44%; width: calc( 45%-10px) } #cart_custom_item_list .custom_item_note { float: left; } #prod_item {float:left;padding-left:10px; width: 16% ;max-width:195px;color:#003875; font-weight:normal; font-family:arial, verdana, helvetica, sans-serif;} #prod_price {float:left;padding-left:15px;width:315px;text-align:left;color:#003875; font-weight:normal; font-family:arial, verdana, helvetica, sans-serif; margin-top: -5px} #prod_price a { color: #FFF } #prod_qty {padding-left:10px;font-size:1.17em; float:left;width:62px;text-align:center;color:#003875; font-weight:bold; font-family:arial, verdana, helvetica, sans-serif;} #details_cart_strip {max-width:744px;width: 99%; width: calc( 100% - 5px );height: 38px; margin-left:auto; margin-right:auto; padding: 15px 5px 0px 0px; background: #656565 ;background: linear-gradient( #2C2C2C, #656565); } #prod_subtotal {float:left;width:85px;text-align:center;color:#003875; font-weight:normal; font-family:arial, verdana, helvetica, sans-serif;} #prod_edit {float:right;width: 25%;max-width:103px;text-align:center;color:#003875; font-weight:normal; font-family:arial, verdana, helvetica, sans-serif;} #prod_edit input[type=image] { width: 90%; height: auto } @media screen and (max-width: 800px) { #prod_price { width: 150px; padding-bottom: 15px } #prod_item { width: 10%; min-width: 55px } #details_cart_strip { height: auto } } @media screen and (max-width: 431px) { #prod_price { margin-top: 3px; padding-left: 10px } #prod_qty { text-align:left; } #prod_edit { float: left; padding-bottom: 15px; margin-left: 15px } } #cart_contents_box {padding-top:10px;padding-bottom:10px;margin-bottom:1px;border-bottom:1px solid #003875;} #cart_footer_text {max-width:724px;width: 100%; height:40px; border-top:3px solid #0c5396;border-bottom: 1px dotted #0c5396;} #nz_price_info {padding-top:12px; padding-left:10px; float:left;color:#0c5396;font-size:0.92em; } #cart_update_button {padding-top:3px; padding-right:10px;float:right;color:#0c5396; } #cart_footer_buttons {border-bottom: 1px dotted #0c5396; height:38px;} #cont_shop_button {float:left; padding-left:10px; padding-top:3px; padding-bottom:3px;} #empty_cart_button {float:left; padding-left:10px; padding-top:3px; padding-bottom:3px;} #checkout_button {float:right; padding-right:10px; padding-top:3px; padding-bottom:3px;} #cart_custom_item_list {color:#003875; padding-top:10px;} #cart_custom_item_list li {list-style:none; line-height:18px; margin:0; padding:0px;margin-left:-25px;} #clear_buttons {clear:both;} input.qty_number {width:21px;height:15px;color:#003875; font-family:arial, verdana, helvetica, sans-serif; font-size:0.92em;} .extra {width:100%; border:none;} .label_extra {color:#003875; padding-top:10px;font-weight:bold;font-family:arial, verdana, helvetica, sans-serif; font-size:1em;} legend {color:#003875;} fieldset label.error { display: block; color: red } /******************** CUSTOMER DETAILS ********************/ .customerDetails .box {max-width:704px;width:94%; width:calc( 96.5% - 20px); padding:10px;float:left;border:1px solid #003875;margin-top:10px;} .customerDetails .box legend {font-size:1.17em;font-weight:bold} .customerDetails .left {margin-right:20px} .customerDetails .top {} .customerDetails .top .box {height:150px} .customerDetails .bottom {margin-top:20px} .customer_detail_field {float:left;color:#000000;width:80px;font-family:arial, verdana, helvetica, sans-serif; font-size:0.92em;} .customer_detail_entry {float:left;color:#000000;font-family:arial, verdana, helvetica, sans-serif; font-size:0.92em;} #clear_customer_entry {clear:both;} #payment_button {border-top:1px dotted #003875; border-bottom:1px dotted #003875;} .payment_button_img {padding-top:3px; padding-bottom:3px;} /******************** ORDER CONFIRMATION ******************/ .orderConfirmation legend {font-weight:bold;color:#003875;font-family:arial, verdana, helvetica, sans-serif;font-size:1.17em;} .orderConfirmation td, .orderConfirmation th {text-align:left} .orderConfirmation .col1 {width:250px;} .orderConfirmation .col2 {width:100px;text-align:right} .orderConfirmation .col3 {width:100px;text-align:right} .orderConfirmation .col4 {width:100px;text-align:right;} .orderConfirmation .colspan3 {width:450px;} .orderConfirmation fieldset {padding:10px;margin-bottom:10px; color:#000000;} .orderConfirmation .total {padding:0px 14px;margin-bottom:10px;font-weight:bold; color:#003875;} .orderConfirmation label {font-weight:bold; color:#000000;} /*********************** PAYMENT *************************/ #payment {margin:0px; padding:10px;} .details_left_col {max-width:240px; min-width: 145px; width: 40%; float:left;} .details_right_col {max-width:240px; min-width: 145px; width: 40%; float:right;} .customerDetails select { width: 200px } .customerDetails textarea { width: 90% } @media screen and (max-width: 555px) { .details_right_col { float:left;} .customerDetails select, .customerDetails input[type=text] { width: 135px } } /*********************** Product Details *************************/ #hm_feature_container {width:511px;padding:0px 0px 0px 8px;} .option_group_text {max-width:110px;width: 20%;float: left;} #main_product_container {max-width:751px; width: 100%; border-bottom:0px solid #c8c8c8;margin-top:10px;margin-left:auto; margin-right:auto; } #main_product_left_col {width:268px; float:left; height:240px;padding-bottom:0px;} #color_options {width:268px; float:left;} #color_options img {margin-left:5px;} #main_product_image {position:relative; width:268px; float:left;} #clear_product_image {clear:both;} #main_prod_desc_container {border-top: 1px solid #ccc; max-width:751px; width: 100%; margin-left:auto; margin-right:auto;padding-top:10px;color:#000000;font-family:arial, verdana, helvetica, sans-serif; line-height:1.5em;} #prod_desc_left_col {margin-top:5px; max-width:204px; width: 40%; width: calc( 50% - 16px ); float:left;border-right:1px solid #c8c8c8;padding:0px 10px 0px 5px;min-height:80px;} #prod_desc_right_col {margin-top:5px; max-width:270px; width:50%; float:right;} #prod_included_col {max-width:270px; width:100%; float:right; text-align:left; padding-bottom:10px;} #prod_included_col ul {margin:0; padding:0; list-style: none;} #prod_included_col li {width:190px; list-style: outside;margin-left:15px;font-family:Arial, Verdana, Helvetica, sans-serif; font-size:1em;} #prod_specs_col {width:76%; float:right; text-align:left;} #prod_specs_col ul {margin:0; padding:0; list-style: none;} #prod_specs_col li {width:190px; list-style: outside;margin-left:15px;font-family:Arial, Verdana, Helvetica, sans-serif; font-size:1em;} #prod_desc {font-family:arial, verdana, helvetica, sans-serif; border-bottom: 1px dotted #c8c8c8;} #slide_show_images ul {margin:0; padding:0; list-style: none;} #slide_show_images li {float: left; padding: 3px; cursor: pointer } #specs_header {color:#003875; font-weight: bold; font-size:1.17em; font-family:arial, verdana, helvetica, sans-serif;} #specs_header2 {color:#003875; font-weight: bold; font-size:1.17em; font-family:arial, verdana, helvetica, sans-serif; padding-top:10px;} #color_option_box {width:186px;float:right;} #bdg_color_options {width:186px; height:37px; background-image: url(/images/color_options_bdg.png); background-repeat: no-repeat;} #options_container {width:184px;border-left:1px solid #c8c8c8;border-right:1px solid #c8c8c8;border-bottom:1px solid #c8c8c8;font-family:arial, verdana, helvetica, sans-serif;font-size:0.92em; color:#000000;} .color_option_button {margin-top:10px;margin-bottom:10px; margin-left:10px;} .options_header {color:#003875;font-family:arial, verdana, helvetica, sans-serif;font-size:1.17em; font-weight:bold; padding-top:10px; padding-left:10px;} #youtube_container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: auto; width: 100%; max-width:751px; overflow: hidden; } #youtube_container iframe, #youtube_container object, #youtube_container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } - See more at: http://avexdesigns.com/responsive-youtube-embed/#sthash.I3GrfV7I.dpuf /*********** Options Styles --------------------------------*/ .newscontainer2 {width: 506px;margin: 0;position:relative;} h2.newstrigger2 { padding: 5px 0 0 5px; margin: 0 0 0 0; z-index:999; max-width:746px; width: 98%; width: calc( 100% - 10px ); line-height: 30px; font-size:1em; font-weight: normal; float: left; font-weight: bold; background-image: url(/images/collapse_strip_bdg.png); background-repeat: repeat-x; } h2.storeregion_header { padding: 5px 0 0 25px; margin: 0 0 0 0; z-index:999; width:720px; line-height: 30px; font-size:1em; font-weight: normal; float: left; font-weight: bold; background-image: url(/images/storeregion_title_bg.png); background-repeat: repeat-x; } h2.storeregion_header_active{ background-image: url(/images/storeregion_title_active2_bg.png); color: #FFFFFF; } .storeregion {margin: 0px 0px 2px 0px} .regioncontainer {width: 100%;margin: 0;position:relative;} div.store_details { margin: 5px } div.store_details iframe {border-radius: 5px; width: 100% } .storeregion_container { margin:3px 3px 0px 3px; padding: 0px 0px 0px 10px; font-size:0.92em; width:727px; clear: both; background-color: #fcfcfc; font-family: arial, verdana, helvetica, sans-serif; position: relative; border-bottom:1px solid #ececec; border-left:1px solid #ececec; border-right:1px solid #ececec; } .staff_name_tag { width: auto; position:relative; top:28px; float: right; color:#003875; font-family: Arial, Verdana, Helvetica, san-serif; font-weight: bold; font-size:1em; margin-right:5px; z-index:0; } h2.newstrigger2 a { text-decoration: none; width:500px; z-index:999; display: block; margin: 5px 0 0 0px; color:#003875; font-size:1.17em; font-family: arial, verdana, helvetica, sans-serif; text-transform: uppercase; } h2.newstrigger2 a:hover {color: #003875;} h2.newsactive2 {background-image: url(/images/collapse_strip_bdg.png); background-repeat: repeat-x;color:#003875;} .newstoggle_container2 { margin:0px; padding: 0; background: url(/images/toggle_block_stretch.gif) repeat-y left top; overflow: hidden; font-size:0.92em; width:750px; clear: both; background-color: #fcfcfc; font-family: arial, verdana, helvetica, sans-serif; position: relative; border-bottom:1px solid #ececec; border-left:1px solid #ececec; border-right:1px solid #ececec; } .newstoggle_container2 .newsblock {padding: 0px;background: no-repeat left bottom;} .newstoggle_container2 .newsblock p {padding: 0px 0;margin: 0px 0;} .view_options {float:right;padding-right:10px;} /*********** Add Extra's Styles --------------------------------*/ #main_extras_container {max-width:740px; width: 97.3%; width: calc(100% - 20px); margin-top:10px;margin-left:auto; margin-right:auto;} #hd_extras {max-width:740px;width: 100%; height:37px; background-image: url(/images/hd_extra_bdg.png); background-repeat: no-repeat;} #title_extras {color:#003875; font-weight: bold; font-size:1.17em; font-family:arial, verdana, helvetica, sans-serif;padding-top:10px;padding-left:10px;} #extras_content {max-width:738px; width: 99%; width: calc( 100% - 2px ); border-left:1px solid #c8c8c8;border-right:1px solid #c8c8c8;border-bottom:1px solid #c8c8c8;} #extras_list_content {padding:10px; border-bottom: 1px dotted #003875; max-width:718px;width:92%; width: calc( 100% - 20px ); margin-left:auto; margin-right:auto;margin-bottom:10px;} #checkbox {float:left; width:20px;} #extras_qty {float:left; width:25px;} #extras_thumb {float:left;text-align: center;padding-left:10px; padding-right:10px;} #extras_item {float:left; width:150px;font-size:0.92em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #clear_extras {clear: both;} #action_links_container {max-width:506px; width: 95%; height:30px;margin-top:10px;} #button_back {float:left;} #button_continue {float:right;} /*********** Review Summary Styles --------------------------------*/ #review_image {width:480px; height:200px; margin-left:auto; margin-right:auto;border-bottom:1px solid #c8c8c8;text-align: center;} #review_image img {padding-top:20px;} #clear_image {clear: both;} #summary_container {width:480px;margin-left:auto; margin-right:auto;padding-top:10px;padding-bottom:10px;} #summary_color {width:80px;float:left; font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_item_color {float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_seat {width:80px;float:left;float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_item_seat {float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_paddle {width:80px;float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_item_paddle {float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_extras {width:80px;float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #summary_item_extras {float:left;font-size:1em; font-family:arial, verdana, helvetica, sans-serif;color:#000000;} #clear_item_summary {clear:both;height:10px;} #summary_item_extras ul {list-style:none;margin:0; padding:0;} #summary_item_extras li {line-height:22px;}