﻿/***********************/
/* GENERAL HTML STYLES */
/***********************/
*{margin:0}
html, body{height:100%; width:100%; background-color:#f2f2f2}
html,body,tr,td,div,p,span{font-family:'Roboto', sans-serif}
a, a:active, a:visited, a:link{text-decoration:none;color:#006391}
a:hover{text-decoration:none;color:#972525}
a.subnote_link,a.subnote_link:link,a.subnote_link:active,a.subnote_link:visited{font-size:11px; color:#6b6b6b}
a.subnote_link:hover{text-decoration:none;color:#383838}
h1, h2, h3, h4, h5, h6 {font-family:sans-serif}
h1{color:#636466;font-size:18px; font-weight:normal; padding:0 0 10px 0;margin:0}
h2{font-size:17px;text-decoration:none; font-weight:normal;color:#666; }
h3{font-size:16px;font-weight: 700;padding:0 0 4px 0;margin:0; color:#333}
h4{font-size:15px;font-weight: 700; text-decoration:underline;padding:2px 0 2px 0; color:#666}
.hr1{width: 100%;height: 2px;border-bottom: dashed 4px #f4f4f4; margin-top:10px; margin-bottom:10px}
h5.col-title {font-size:12px !important}

.ul1{list-style-type:lower-greek; padding:2px 0 2px 15px}
.ul2{list-style-type: disc; padding:2px 0 2px 15px}
.ul3{list-style-type: none; padding:2px 0 2px 30px}
.ul3 li{ list-style-image:url(/design/icon_tick3.png); vertical-align:top}
ul.no-styles{list-style-type:none;margin:0;padding:0;line-height:30px}
.col1{width:660px; float:left; padding:0; vertical-align:top}
.col2{width:320px;float:left; margin:0 0 0 20px; vertical-align:top}
.col2_container {margin:0 15px 0 15px}
.col3{width:260px; float:left; margin: 0; vertical-align:top}
.col4{width:730px; float:left; padding-left:10px; vertical-align:top}
.clear_both{clear:both}
.text-center {
    text-align: center
}
.full-width{
    width:100% !important
}
.table-responsive tr {
    width: 100% !important
}
.table td, .table th {
    padding: .20rem;
}
.table {
    margin-bottom: 0px !important;
}
.grey {
    color: #333 !important
}
.text-medium {font-size:14px !important}
/***********************/
/* CARD STYLES  */
/***********************/
.card {
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #eee !important;
    border-radius: .50rem !important;
}
.card-header h4 {
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    padding: 0;
    margin-bottom:0 !important;
    color: #006391;
}
select option{
    color:#333 !important;
    background-color:#fff !important
}
/***********************/
/* MASTER PAGE STYLES  */
/***********************/
.ph_page_container {width:100%;height:100%}
.page-center{max-width:1440px;margin:0 auto}
#ph_main {
    width: 100%;
    margin-top: 15px
}
/* HEADER */
a.basket-link, .basket-link {
    color: #972525 !important;
    font-weight: 700
}

#ph_header {
    width: 100%;
    min-height: 40px;
    margin-top: 20px;
}
.full-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.home-register {
    width: 290px;
    height: 87px;
    display: block;
    margin: 140px 0 0 5%;
    float: left;
        position:relative
}
.home-login {
    display: block;
    margin: 10px 0 0 5%;
    float: left;
    position: relative
}
#menu-bar {
    width: 100%;
    min-height: 40px;
    line-height: 35px;
    background-color: #000;
    color: #fff;
    border-bottom: solid 1px #f4f4f4;
}
#phh_social{max-width:250px; float:right}
.phh_w1 {
    font-size: 20px;
    color: #000
}
.phh_w2 {
    font-size: 16px;
    color: #00558c
}
.ph_profile_box{height:73px;width:390px; margin:4px 0 3px 0; padding-left:10px; padding-right:5px; float:left; line-height:18px}
.ph_profile_box a {color: #fff;font-weight: 700}
.breadcrumbs {
    padding:5px;line-height:24px;background-color:#fff
}
.breadcrumbs, .breadcrumbs a {
    font-size: 14px !important;
    color: #006391 !important
}
.line-header {
    overflow: hidden;
    text-align: center
}

    .line-header:before, .line-header:after {
        background-color: #b9cadc;
        content: "";
        display: inline-block;
        height: 1px;
        position: relative;
        vertical-align: middle;
        width: 50%;
    }

    .line-header:before {
        right: 0.5em;
        margin-left: -50%
    }

    .line-header:after {
        left: 0.5em;
        margin-right: -50%
    }
h3.line-header {
    font-size: 20px !important;
    color: #1d2227;
}
.smartmenu li:nth-child(2) {
    background-color: #01578f !important;
}

.smartmenu ul > li a {
    min-width: 100%;
}
.smartmenu ul > li a {
    line-height: 32px !important;
}
.smartmenu ul > li {
    min-height: 32px !important;
}
.smartmenu {
    font-size:16px !important
}
@media (min-width: 1000px) and (max-width: 1200px) {
    .smartmenu {
        font-size: 15px !important
    }
    #ph_header {
        margin-top: 15px;
    }
    .phh_w1 {
        font-size: 17px;
        color: #000
    }

    .phh_w2 {
        font-size: 14px;
        color: #00558c
    }
}
@media (min-width: 768px) and (max-width: 999px) {
    .smartmenu {
        font-size: 14px !important
    }
    #ph_header {
        margin-top: 10px;
    }
    .phh_w1 {
        font-size: 16px;
        color: #000
    }

    .phh_w2 {
        font-size: 13px;
        color: #00558c
    }
}
@media (min-width: 576px) and (max-width: 767px) {
    .smartmenu {
        font-size: 13px !important
    }
    #ph_header {
        margin-top: 5px;
    }
    .phh_w1 {
        font-size: 15px;
        color: #000
    }

    .phh_w2 {
        font-size: 13px;
        color: #00558c
    }
}
@media (max-width: 575px) {
    .phh_w1 {
        font-size: 14px;
        color: #000
    }

    .phh_w2 {
        font-size: 12px;
        color: #00558c
    }
    #ph_header {
        margin-top: 3px;
    }
    #phh_social {
        max-width: 200px;
        float: unset !important;
        text-align:center;
        margin:0 auto;
        width:200px;
        padding: 5px 0 0 0
    }
    .box-ph-callcenter {
        text-align:center
    }
        .box-ph-callcenter img {
            margin:0 auto
        }
        .box-ph-logo {
            text-align: center;
            margin: 5px 0 5px
        }
    .box-ph-center {
        text-align: center;
        font-size:13px
    }
    #sitelogo {
        max-width: 200px;
        margin: 0 auto
    }
    .smartmenu {
        font-size: 12px !important
    }
        .smartmenu > li > a, .smartmenu > li.sm-responsive-toggle > span {
            font-weight: normal;
            padding: 0 6px;
            line-height: 30px;
        }
        .smartmenu > li {
            display: block;
            vertical-align: top;
            float: left;
            height: 30px;
        }
}
    /***********************/
    /* FOOTER STYLES       */
    /***********************/
    .footer {
        background-color: #2a2d26;
        width: 100%;
        min-height: 100px;
        border-top: solid 5px #d7decd
    }

        .footer a, .footer div ul li a {
            color: #fff;
            cursor: pointer
        }

            .footer a:hover, .footer div ul li a:hover {
                color: #f3f3f3
            }

        .footer p, .footer span {
            color: #fff
        }

        .footer h3 {
            font-size: 20px;
            color: #0392e1;
            line-height: 50px
        }

        .footer ul {
            list-style: none;
            margin: 0;
            padding: 0
        }

        .footer li {
            line-height: 26px;
            font-size: 14px
        }

            .footer li a {
                color: #fff !important
            }

                .footer li a:hover {
                    color: #f3f3f3 !important
                }

        .footer .links {
            margin-bottom: 25px
        }

    .cc-btn {
        background-color: #0054AD !important;
    }

    .copyrights {
        padding: 10px 0 10px;
        background-color: #333;
        color: #fff;
        font-size: 12px;
        text-align: center
    }

        .copyrights a, .copyrights a:link {
            font-size: 12px;
            color: #80837c
        }

    .hr-footer {
        width: 100%;
        border-bottom: 1px solid #c49800;
        padding: 10px
    }
    /***********************/
    /* BANNERS             */
    /***********************/
    .col_text, .col_text p, .col_text div, .col_text span, .col_text a {
        font-size: 11px !important
    }
    /***********************/
    /* MAIN PAGE           */
    /***********************/
    .items_paging, .main_page_container {
        width: 730px
    }

    .main_page_container {
        float: left
    }

    .page_text_container {
        padding: 0;
    }

    h2.ph_col_title {
        margin-top: 25px;
        margin-left: 60px;
        color: #636363;
        font-size: 18px;
        font-style: italic;
        background-color: Transparent
    }

    .col_title {
        margin-top: 14px;
        margin-left: 60px;
        color: #636363;
        font-size: 18px;
        font-style: italic
    }

    .bonuscard {
        font-weight: 700;
        font-size: 18px;
        color: #00c316
    }

    .nobonuscard {
        color: #666
    }
    /***********************/
    /* HYPERLINKS          */
    /***********************/
    .active_page, a.active_page, a.active_page:active, a.active_page:visited, a.active_page:link {
        text-decoration: none;
        color: #333;
        font-weight: 700;
        font-size: 16px
    }

        a.active_page:hover {
            text-decoration: none;
            color: #666
        }

    .inactive_page, a.inactive_page, a.inactive_page:active, a.inactive_page:visited, a.inactive_page:link {
        text-decoration: none;
        color: #999;
        font-weight: normal;
        font-size: 14px
    }

        a.inactive_page:hover {
            text-decoration: none;
            color: #000
        }
    /***********************/
    /* LABELS - MESSAGES   */
    /***********************/
    #page_message {
        z-index: 1500;
        width: 300px;
        max-height: 100px;
        display: block;
        position: fixed;
        left: 5px;
        bottom: 5px
    }

    .box_error {
        background: #fdcccc url(/design/icon_error.png) no-repeat left;
        border: solid 1px #fb8181;
        color: #a70f0f
    }

    .box_warning {
        background: #fff7d9 url(/design/icon_warning.png) no-repeat left;
        border: solid 1px #f8e295;
        color: #db9d09
    }

    .box_success {
        background: #e3fdde url(/design/icon_success.png) no-repeat left;
        border: solid 1px #b7ffa9;
        color: #178801
    }

    .box_error, .box_warning, .box_success {
        width: 100%;
        font-weight: bold;
        min-height: 40px;
        font-size: 14px;
        padding: 7px 7px 7px 45px;
        position: absolute;
        z-index: 1000
    }

    .subnote {
        color: #333;
        font-size: 14px
    }

    .notice_text {
        color: #f25601;
        font-size: 12px
    }

    .items_norecords {
        color: #f02d00;
        font-weight: 700
    }

    .special-offer {
        color: #ff5e00;
        font-weight: 700
    }
    /***********************/
    /* NEWS                */
    /***********************/
    .line_1 {
        width: 100%;
        min-height: 50px;
        vertical-align: top;
        float: left
    }

    .line_2 {
        width: 100%;
        min-height: 50px;
        vertical-align: top;
        float: left
    }

    .article_title, .article_title:active, .article_title:link, .article_title:visited {
        color: #000;
        font-size: 14px;
        font-weight: 700
    }

        .article_title:hover {
            color: #972525
        }

    .article_desc {
        font-weight: normal;
        font-size: 13px;
        color: #333
    }

    .article_date {
        color: #666;
        font-size: 13px;
        font-style: italic
    }
    /***********************/
    /* FORM ELEMENTS       */
    /***********************/
    .white_loading {
        font-size: 14px;
        font-weight: 700;
        color: #fff
    }

    .frm_nostyles {
        border: 0px;
        margin: 0;
        padding: 0
    }

    .frm_legend, .frm_legend_2 {
        font-size: 12px;
        color: #595959;
        text-align: right;
        vertical-align: top;
        padding-right: 10px
    }

    .frm_legend_req, .frm_legend_req_2 {
        font-size: 12px;
        color: #000;
        text-align: right;
        font-weight: 700;
        padding-right: 10px
    }

    .frm_legend_locked {
        font-size: 12px;
        color: #a82800;
        text-align: right;
        vertical-align: top;
        font-weight: 700;
        padding-right: 10px
    }

    .frm_data, .frm_data_2 {
        font-size: 11px;
        text-align: left;
        vertical-align: top
    }

    .txtbox2 {
        color: #666;
        font-size: 11px;
        padding: 3px
    }

    .txtbox, .selbox {
        border: thin solid #333;
        background-color: #fff;
        font-size: 12px;
        padding: 3px;
        color: #333
    }

    .form_fieldset {
        border: solid 1px #333;
        background-color: #fff;
        width: 480px;
        height: auto;
        padding-top: 5px;
        padding-bottom: 5px;
        margin-bottom: 2px
    }

    .fieldset_legend {
        padding-left: 5px;
        color: #595959;
        font-size: 16px
    }

    .page_large_icon {
        width: 180px;
        height: 180px;
        border: none
    }
    /* AJAX POPUP */
    .callout_popup {
        width: 260px
    }

        .callout_popup div, .callout_popup td {
            border: solid 1px #ccc;
            background-color: #fff
        }

        .callout_popup .ajax__validatorcallout_popup_table {
            display: none;
            border: none;
            background-color: transparent;
            padding: 0
        }

        .callout_popup .ajax__validatorcallout_popup_table_row {
            vertical-align: top;
            height: 100%;
            background-color: transparent;
            padding: 0
        }

        .callout_popup .ajax__validatorcallout_callout_cell {
            width: 20px;
            height: 100%;
            text-align: right;
            vertical-align: top;
            border: none;
            background-color: transparent;
            padding: 0
        }

        .callout_popup .ajax__validatorcallout_callout_table {
            height: 100%;
            border: none;
            background-color: transparent;
            padding: 0
        }

        .callout_popup .ajax__validatorcallout_callout_table_row {
            background-color: transparent;
            padding: 0
        }

        .callout_popup .ajax__validatorcallout_callout_arrow_cell {
            padding: 8px 0 0 0;
            text-align: right;
            vertical-align: top;
            font-size: 1px;
            border: none;
            background-color: transparent
        }

            .callout_popup .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv {
                font-size: 1px;
                position: relative;
                left: 1px;
                border-bottom: none;
                border-right: none;
                border-left: none;
                width: 15px;
                background-color: transparent;
                padding: 0
            }

                .callout_popup .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv div {
                    height: 1px;
                    overflow: hidden;
                    border-top: none;
                    border-bottom: none;
                    border-right: none;
                    padding: 0;
                    margin-left: auto
                }

        .callout_popup .ajax__validatorcallout_error_message_cell {
            font-family: Arial;
            font-size: 13px;
            padding: 3px;
            border-right: none;
            border-left: none;
            width: 100%;
            color: #ff6600;
            font-weight: 700
        }

        .callout_popup .ajax__validatorcallout_icon_cell {
            width: 16px;
            padding: 1px;
            border-right: none
        }

        .callout_popup .ajax__validatorcallout_close_button_cell {
            vertical-align: top;
            padding: 0;
            text-align: right;
            border-left: none
        }

            .callout_popup .ajax__validatorcallout_close_button_cell .ajax__validatorcallout_innerdiv {
                border: none;
                text-align: center;
                width: 10px;
                padding: 2px;
                cursor: pointer
            }
    /***********************/

    /*** set the width and height to match your images **/
    #banner_rotator {
        position: relative;
        height: 60px
    }

        #banner_rotator div {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 8;
            opacity: 0.0;
            height: 60px;
            background-color: #fff
        }

            #banner_rotator div.active {
                z-index: 10;
                opacity: 1.0
            }

            #banner_rotator div.last-active {
                z-index: 9
            }

            #banner_rotator div img {
                height: 60px;
                display: block;
                border: 0;
                margin-bottom: 10px
            }

    /*AutoComplete flyout */
    .completionList {
        border: solid 1px #444444;
        margin: 0;
        padding: 2px;
        height: 150px;
        width: 250px;
        overflow: auto;
        background-color: #fff;
        font-size: 12px;
        text-align: left
    }

    .listItem {
        color: #1C1C1C;
        font-size: 12px;
        text-align: left
    }

    .itemHighlighted {
        background-color: #5f5f5f;
        color: #fff;
        font-size: 12px;
        text-align: left
    }

    .fa-blue, a.fa-blue {
        color: #006391 !important
    }

    .fa-red, a.fa-red {
        color: #972525 !important
    }

    .text-big {
        font-size: 18px !important
    }