/*.tyvek_design{width: 1360px;*/
/*    margin: auto;*/
/*    float: none;}*/
.shopping_page .tyvek_design_middle .front_message {
    font-size: 42px;
    padding-left: 0; 
}
.m-b-10 {
    margin-bottom: 10px;
}
.shopping_page table.msg_table tr.t_w_2 td span.free_band {
    width: 100%;
    color: #0a2c79;
    font-weight: 500;
    float: left;
    height: auto;
    margin: 10px 0 0 0;
}

.shopping_page .fabric_table .front_message { font-size: 38px; }
@media (min-width: 1200px) and (max-width: 1300px) {
    .fabric_table, .shopping_page .fabric_table { font-size: 32px; } 
}
@media (min-width: 768px) and (max-width: 1199px) {
    .fabric_table .front_message, .shopping_page .fabric_table .front_message{ font-size: 22px; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
    .tyvek_message .common_clipart_font_etc .common_input_area {
        margin: 0 30px;
    }
    .shopping_page .tyvek_design_middle .front_message {
        font-size: 24px
    }
    .tyvek_design table { width: 100%; }
}

@media(min-width: 768px) and (max-width: 991px) {
    #wristbands_step_three .front_back_table,
    #wristbands_step_three .inside_table,
    #wristbands_step_three .continue_table {
        font-size: 24px !important;
        height: auto !important;
    }
    .shopping_page .wristbands_design_area table .front_message, 
    .shopping_page .wristbands_design_area table .back_message, 
    .shopping_page .wristbands_design_area table .inside_message, 
    .shopping_page .wristbands_design_area table .continue_message {
        font-size: 24px !important;
    }
    .front_art .art_left_img, 
    .front_art .art_right_img, 
    .back_art .art_left_img, 
    .back_art .art_right_img,
    .continue_art .art_left_img, 
    .continue_art .art_right_img {
        width: 20px !important;
    }
    
    .tyvek_design table { width: 100%; }
    .tyvek_design_middle .front_message {
        font-size: 24px;
    }
    .tyvek_message .common_input_area {
        margin: 0;
        width: 435px;
    }
    
    .fabric_table .front_message {
        font-size: 42px;
    }
    .qtyPollBox>.fabric_qty_poll {
        width: 205px;
        float: left;
        margin: 0 0 15px 15px;
    }
    
    .optional_clipart li button:first-child {
        width: 80px;
        height: 80px;
    }
    .common_customize_box > p, .common_input_area > p, .common_input_area ul button {
        font-size: 12px;
    }
    .optional_clipart ul li p,
    .optional_clipart button  {
        width: 80px;
    }
    .optional_clipart ul li p {
        font-size: 14px;
    }
    .removeclipart {
        font-size: 10px !important;
    }
    #sclipartshowhide, #feclipartshowhide, #bsclipartshowhide, #beclipartshowhide, #csclipartshowhide, #ceclipartshowhide {
        width: 80px;
    }
    
    
}

@media(max-width: 767px) {
    /**** wristband *****/
    .wristbands_design_area.one_four_cus table, 
    div.wristbands_design_area.one_four_cus table td {
        height: 30px !important;
    }
    .wristbands_design_area.one_two_cus table, 
    div.wristbands_design_area.one_two_cus table td {
        height: 40px !important;
    }
    .wristbands_design_area.three_four_cus table, 
    div.wristbands_design_area.three_four_cus table td {
        height: 50px !important;
    }
    .wristbands_design_area.one_cus table, 
    div.wristbands_design_area.one_cus table td {
        height: 60px !important;
    }
    
    #wristbands_step_three .front_back_table,
    #wristbands_step_three .inside_table,
    #wristbands_step_three .continue_table,
    #wristbands_step_three .upload_table {
        font-size: 11px !important;
        font-weight: 400;
        height: auto !important;
    }

    #wristbands_step_three .common_step_box,
    #wristbands_step_three .wristbands_design_area{
        padding: 0;
        height: auto;
    }  
    .wristbands_select_msg_type ul {
        margin: 0 0 0 10px;
    }
    .wristbands_select_msg_type .common_select_button label>span {
        padding: 3px 0 0 35px;
    }
    .shopping_page .wristbands_design_area table .front_message, 
    .shopping_page .wristbands_design_area table .back_message, 
    .shopping_page .wristbands_design_area table .inside_message, 
    .shopping_page .wristbands_design_area table .continue_message {
        font-size: 10px !important;
    }
    .front_art .art_left_img, 
    .front_art .art_right_img, 
    .back_art .art_left_img, 
    .back_art .art_right_img,
    .continue_art .art_left_img, 
    .continue_art .art_right_img {
        width: 30px !important;
    }
    
    /**** tyvek *****/
    
    .shopping_page .tyvek_design_middle .front_message {
        font-size: 24px
    }
    
    .shopping_page table .tyvek_design .front_message {
        padding-left: 0;
    }
    .shopping_page .tyvek_design_middle span {
        margin: 0;
    }
    
    /*.tyvek_design_middle {
        font-size: 24px;
        height: 42px;
    }

    .tyvek_design table {
        height: 42px;
    }
    */
    .tyvek_design table { width: 100%; }
    .tyvek_design table, 
    .tyvek_design table td {
        height: 30px !important;
    }
    .tyvek_design_middle, .tyvek_design_middle .front_message {
        font-size: 14px !important;
        font-weight: 500;
    }
    
    .tyvek_design .tyvek_design_left img {
        height: 30px !important;
    }
    
    .tyvek_design_middle .front_message {
        margin-left: 0;
        margin-right: 0;
    }
    .tyvek_design_middle {
        padding-left: 10px;
    }
    
    .tyvek_select_msg_type .common_select_button li {
        margin-bottom: 7px;
    }
    
    .tyvek_select_msg_type .common_select_button label>span {
        padding: 5px 0 0 35px;
    }
    
    
    .tyvek_input > div {
        width: 100%;
    }
    .tyvek_message .front_input_box, 
    .tyvek_message .back_input_box {
        display: block;
    }

    .tyvek_message .common_clipart_font_etc .common_input_area {
        width: 100%;
        margin: 0 0 15px 0;
    }

    .tyvek_message .tyvek_input input, .tyvek_input select {
        width: 100%;
        display: block;
        margin: 0 0 10px 0;
    }

    .tyvek_message .tyvek_input select {
        height: initial;
        font-size: 24px;
    }
    .tyvek_message .common_end, .common_start {
        float: none;
        margin: auto;
        clear: both;
    }

    .tyvek_message .common_input_area ul>li {
        float: none;
        width: 100%;
        margin-bottom: 10px;
        padding: 0;
    }
    /**** fabric *****/
    .fabric_table .front_message {
        font-size: 24px;
    }
    .fabric_table, .fabric_table td {
        height: 40px;
    }
    
    .fabric_table, .fabric_table td {
        height: 40px;
    }
    .fabric_table .art_left_img, 
    .fabric_table .art_right_img,
    .shopping_page .fabric_table .art_left_img,
    .shopping_page .fabric_table .art_right_img{
        margin: 0 2px 0 2px;
    }
    .fabric_table .front_message { font-size: 20px; }
    .shopping_page .fabric_table .front_message { font-size: 16px; }
    .fabric_table td, .shopping_page .fabric_table td { padding-left: 0; padding-right: 0; }
    .fabric_select_msg_type .common_select_button label>span {
        padding: 5px 0 0 30px;
    }
    .fabric_select_msg_type {
        margin-bottom: 10px;
    }
    .qtyPollBox>.fabric_qty_poll  {
        width: 132px;
        padding-top: 5px;
    }
    /******* lanyard ********/
    .lanyard_type_select {
        margin-bottom: 15px;
    }
    .lanyard_type_select form .radio-inline {
        height: 35px;
        font-size: 18px;
        padding: 8px 16px 6px 40px;
        width: 125px;
        margin: 0 10px 0 0;
    }
    .lanyard_type_select form .radio-inline span::before {
        top: 8px;
    }
    .lanyard_type_select form .radio-inline input:checked ~ span::after {
        top: 11px;
    }
    
    /**** others *****/
    
    .common_select_button label::before {
        width: 25px;
        height: 25px;
    }

    .common_select_button label.active_art::after {
        width: 19px;
        height: 19px;
        top: 3px;
        left: 3px;
    }
    
    .front_input_box, .back_input_box {
        width: 100%;
    }

    .front_input_box.common_input_area, 
    .back_input_box.common_input_area {
        margin-bottom: 10px;
    }
    .front_input_box.common_input_area ul, 
    .back_input_box.common_input_area ul {
        margin-top: 10px;
    }

    .common_customize_box > p, .common_input_area > p, .common_input_area ul button {
        font-size: 14px;
    }

    .common_input_area ul>li:last-child button {
        padding-right: 25px;
    }

    .common_input_area ul button>span.picked_color_bg {
        width: 30px;
    }

    .optional_clipart>div {
        width: 100%;
        margin-bottom: 10px;
    }
    .optional_clipart ul, 
    .optional_clipart h4 {
        float: none;
        margin: 0 auto;
    }
    .wfd.optional_clipart {
        display: block;
    }

    .inside_input_box .common_input_area {
        width: 100%;
    }

    .inside_input_box .optional_clipart_img {
        width: 100%;
    }
    .add_quantity {
        width: 100%;
        font-size: 16px;
    }
    button.btn.btn-default.add_to_cart {
        font-size: 24px;
        height: 50px;
    }
    .common_select_type .common_select_button {
        height: auto;
    }
    .upload-title {
        padding: 5px 10px;
        font-size: 14px !important;
    }
    .hideimprintcolor h2 {
        font-size: 15px;
    }
    
    
    
    
    
}

@media (max-width: 520px) { 
    .fabric_table .front_message{ font-size: 12px;} 
    .shopping_page .fabric_table .front_message{ font-size: 10px;} 
}

@media (max-width: 375px) {
    
    .qtyPollBox>div {
        width: 150px;
        margin: 10px 0 10px 15px;
    }
    .art_img {
        margin-top: 20px;
    }
    li.art_add {
        float: none;
        margin: auto;
    }
    
    .common_step_box h4 {
        font-size: 10px;
    }
    
    .wristbands_design_area table td span {
        margin: 0;
    }
    
    .shopping_page .wristbands_design_area table .front_message, 
    .shopping_page .wristbands_design_area table .back_message, 
    .shopping_page .wristbands_design_area table .inside_message, 
    .shopping_page .wristbands_design_area table .continue_message {
        font-size: 10px !important;
    }
    
    .fqp_img {
        width: 96px;
        margin: 5px auto;
        margin-top: 5px;
    }
    
    .qtyPollBox>.fabric_qty_poll  {
        width: 140px;
        padding-top: 5px;
    }
    .fabric_table .front_message{ font-size: 35px;} 
    .shopping_page .fabric_table .front_message{ font-size: 7px;} 
}
@media (max-width: 320px) {
    .optional_clipart li button:first-child {
        width: 80px;
        height: 80px;
    }
    .upload-title {
        padding: 5px 10px;
        font-size: 10px !important;
    }
    
    .inside_input_box .common_select_button label {
        font-size: 12px;
    }
    .qtyPollBox>.fabric_qty_poll {
        width: 115px;
    }
    .fabric_table .front_message{ font-size: 8px;}
}