/* 
    Document   : Theme style
    Description:
        This css contains all needed classes to style the website
    
    Main color:         Blue            #999999
    Secondary color:    Orange          #333333

*/

body { background: #ffffff; }
.art_link { cursor: pointer; }
.btn-yellow { background: #ffaa00; color: #fff; }
.btn-yellow:hover { color: #fff; font-weight: bold; }
.tbl_art { margin-bottom: 10px; }
.img_howto { border: 1px solid #ffaa00; margin: 10px; }

/* HEADER */
#div_header { background: #428bca; margin-bottom: 0px; }
#div_header_container {}
#header_box { margin: 10px; }
#h3_header_logo { margin: 26px 0 0 10px;}
#a_header_logo { color: #FFFFFF; text-decoration: none; }

/* NAVIGATION --> see navigation.css */
#div_navigation { }
#div_navigation_container { background: #ffffff; height: 85px; }
.nav { background: #ffffff; }

/* OPTIONBAR */
#ul_optionbar { margin: 0; }
#ul_optionbar li { color: #666666; text-decoration: underline; cursor: pointer; padding-right: 15px; }

/* LANGUAGE SELECTOR */
#ul_lang_select {}
#ul_lang_select li { padding: 10px; }
#ul_lang_select li:hover { background: #eeeeee; }

/* LOGO */
#img_logo { width: 400px; margin-top: -25px; }

/* CONTENT */
#div_content {}
#div_content_container {}
#myContentBucket { min-height: 550px; }
#div_content { min-height: 400px; padding-top: 0px; }
.div_data_section { padding-top: px; }

/* FOOTER */
#div_footer { background: #999999; color: #ffffff; padding-top: 15px; border-top: 0px solid #428bca; min-height: 75px;}
#div_footer_container {  }

/* DATA BLOCKS DEFAULT */
.adv_data_block { margin-bottom: 15px; }
.adv_data_block_default { background: #FFFFFF; border-radius: 2px; padding: 5px;  }
.adv_row { }

/* LOGIN */
#login_error_message { color: #d80000; }
.btn_load_logout { }
.btn_load_login_modal { }

/* BASKET */
#row_basket { margin-top: 15px; }

/* General */
.div_data_block { padding: 15px 10px; }
.h4_title { color: #333333; }

/* Product detail page */
.tbl_prod_details { width: 100%; }
.tbl_prod_details td { padding: 5px 10px 5px 15px; }
.tbl_prod_details td.title { color: #0066ff; vertical-align: top; min-width: 25%; }
.tbl_prod_details td.title2 { color: #666666; vertical-align: top; font-weight: bold; text-align: left; }

/* Product Filter */
#div_products_filter_left { background: #eeeeee; margin-top: 40px; padding: 10px; font-size: 0.9em; }

/* ART */
.container_art { padding-top: 20px; }
.art_series_icon { border: 1px solid #fa0; padding: 10px; margin: 0px; cursor: pointer; text-decoration: none; color: #666666; font-size: 1.4em; text-align: center; }
.art_series_icon:hover { text-decoration: none; background: #ffaa00; color: #FFF; }
.a_art { text-decoration: none; }
.art_series_icon_active { background: #fa0; color: #FFFFFF; }
.art_series_display_1 { border: 1px solid #EEE; border-radius: 4px; background: #eee; padding: 15px; }
.art_series_display_2 { border: 1px solid #EEE; border-radius: 4px; background: #fff; padding: 15px; }
.div_result_game { border-radius: 4px; background: #EEEEEE; }
#modal_game_result_disp-dialog { width: 80%; }
	
@media (min-width: 1200px) {
    /* General */
    img.img-responsive { display: table-cell; max-width: 100%; }
    #modal_game_result_disp-dialog { width: 60%; }
    /* Header */
    #site_navbar { height: 85px; border-bottom: 2px solid #ffaa00; padding-top: 15px; }
    /* TITLE BAR */
    #div_title { background: #FFAA00; color: #FFFFFF; font-weight: bold; height: 55px; padding-top: 6px; padding-left: 25px; font-size: 1.8em; margin-top: 85px; }
    #div_title_container {  }
}
@media (min-width: 980px) and (max-width: 1199px) {
    /* General */
    img.img-responsive { display: table-cell; max-width: 100%; }
    /* Header */
    #site_navbar { height: 120px; border-bottom: 2px solid #ffaa00; padding-top: 15px; }
    /* TITLE BAR */
    #div_title { background: #FFAA00; color: #FFFFFF; font-weight: bold; height: 55px; padding-top: 6px; padding-left: 25px; font-size: 1.8em; margin-top: 120px; }
    #div_title_container {  }
    ul.navbar-nav { margin-top: 20px; }
}
@media (min-width: 768px) and (max-width: 979px) {
    /* General */
    img.img-responsive { display: table-cell; max-width: 35%; min-width: 250px; }
    /* Header */
    #site_navbar { height: 120px; border-bottom: 2px solid #ffaa00; padding-top: 15px; }
    /* TITLE BAR */
    #div_title { background: #FFAA00; color: #FFFFFF; font-weight: bold; height: 55px; padding-top: 6px; padding-left: 25px; font-size: 1.8em; margin-top: 120px; }
    #div_title_container {  }
    #bs-example-navbar-collapse-1 { padding-top: 20px; }

}
@media (max-width: 767px) {
    /* General */
    img.img-responsive { display: table-cell; max-width: 35%; }
    /* Navigation */
    ul.nav > li { border: 1px solid #eeeeee; padding-right: 20px; min-width: 250px; }
    #modal_game_result_disp-dialog { width: 95%; }
    .div_result_game { padding-top: 15px; }
    /* Header */
    #site_navbar { height: 85px; border-bottom: 2px solid #ffaa00; padding-top: 15px; }
    /* TITLE BAR */
    #div_title { background: #FFAA00; color: #FFFFFF; font-weight: bold; height: 55px; padding-top: 6px; padding-left: 25px; font-size: 1.8em; margin-top: 85px; }
    #div_title_container {  }
}
@media (max-width: 480px) {
    /* General */
    img.img-responsive { display: table-cell; max-width: 35%; }
    /* Navigation */
    ul.nav > li { border: 2px solid #FFAA00; padding-right: 20px; min-width: 250px; }
    #img_logo { width: 240px; margin-top: -10px; }
    #modal_game_result_disp-dialog { width: 95%; }
    .div_result_game { padding-top: 15px; }
    /* Header */
    #site_navbar { height: 85px; border-bottom: 2px solid #ffaa00; padding-top: 15px; }
    /* TITLE BAR */
    #div_title { background: #FFAA00; color: #FFFFFF; font-weight: bold; height: 55px; padding-top: 6px; padding-left: 25px; font-size: 1.8em; margin-top: 85px; }
    #div_title_container {  }

}