/* Welcome to Compass. * In this file you should write your main styles. (or centralize your imports) * Import this file using the following HTML or equivalent: * */ /** * Base styles & blocks */ @font-face { font-family: 'Lato-Hairline'; src: url("fonts/lato-hairline.eot"); src: local("Lato Hairline"), local("Lato-Hairline"), url("fonts/lato-hairline.eot?#iefix") format("embedded-opentype"), url("fonts/lato-hairline.woff") format("woff"), url("fonts/lato-hairline.ttf") format("truetype"), url("fonts/lato-hairline.svg#lato") format("svg"); font-weight: 200; font-style: normal; } @font-face { font-family: 'Lato-HairlineItalic'; src: url("fonts/lato-hairlineitalic.eot"); src: local("Lato Hairline Italic"), local("Lato-HairlineItalic"), url("fonts/lato-hairlineitalic.eot?#iefix") format("embedded-opentype"), url("fonts/lato-hairlineitalic.woff") format("woff"), url("fonts/lato-hairlineitalic.ttf") format("truetype"), url("fonts/lato-hairlineitalic.svg#lato") format("svg"); font-weight: 200; font-style: italic; } @font-face { font-family: 'Lato-Light'; src: url("fonts/lato-light.eot"); src: local("Lato Light"), local("Lato-Light"), url("fonts/lato-light.eot?#iefix") format("embedded-opentype"), url("fonts/lato-light.woff") format("woff"), url("fonts/lato-light.ttf") format("truetype"), url("fonts/lato-light.svg#lato") format("svg"); font-weight: 300; font-style: normal; } @font-face { font-family: 'Lato-LightItalic'; src: url("fonts/lato-lightitalic.eot"); src: local("Lato Light Italic"), local("Lato-LightItalic"), url("fonts/lato-lightitalic.eot?#iefix") format("embedded-opentype"), url("fonts/lato-lightitalic.woff") format("woff"), url("fonts/lato-lightitalic.ttf") format("truetype"), url("fonts/lato-lightitalic.svg#lato") format("svg"); font-weight: 300; font-style: italic; } @font-face { font-family: 'Lato'; src: url("fonts/lato-regular.eot"); src: local("Lato Regular"), local("Lato-Regular"), url("fonts/lato-regular.eot?#iefix") format("embedded-opentype"), url("fonts/lato-regular.woff") format("woff"), url("fonts/lato-regular.ttf") format("truetype"), url("fonts/lato-regular.svg#lato") format("svg"); font-weight: 400; font-style: normal; } @font-face { font-family: 'Lato-Italic'; src: url("fonts/lato-italic.eot"); src: local("Lato Italic"), local("Lato-Italic"), url("fonts/lato-italic.eot?#iefix") format("embedded-opentype"), url("fonts/lato-italic.woff") format("woff"), url("fonts/lato-italic.ttf") format("truetype"), url("fonts/lato-italic.svg#lato") format("svg"); font-weight: 400; font-style: italic; } @font-face { font-family: 'Lato-Bold'; src: url("fonts/lato-bold.eot"); src: local("Lato Bold"), local("Lato-Bold"), url("fonts/lato-bold.eot?#iefix") format("embedded-opentype"), url("fonts/lato-bold.woff") format("woff"), url("fonts/lato-bold.ttf") format("truetype"), url("fonts/lato-bold.svg#lato") format("svg"); font-weight: 700; font-style: normal; } @font-face { font-family: 'Lato-BoldItalic'; src: url("fonts/lato-bolditalic.eot"); src: local("Lato Bold Italic"), local("Lato-BoldItalic"), url("fonts/lato-bolditalic.eot?#iefix") format("embedded-opentype"), url("fonts/lato-bolditalic.woff") format("woff"), url("fonts/lato-bolditalic.ttf") format("truetype"), url("fonts/lato-bolditalic.svg#lato") format("svg"); font-weight: 700; font-style: italic; } @font-face { font-family: 'Lato-Black'; src: url("fonts/lato-black.eot"); src: local("Lato Black"), local("Lato-Black"), url("fonts/lato-black.eot?#iefix") format("embedded-opentype"), url("fonts/lato-black.woff") format("woff"), url("fonts/lato-black.ttf") format("truetype"), url("fonts/lato-black.svg#lato") format("svg"); font-weight: 900; font-style: normal; } @font-face { font-family: 'Lato-BlackItalic'; src: url("fonts/lato-blackitalic.eot"); src: local("Lato Black Italic"), local("Lato-BlackItalic"), url("fonts/lato-blackitalic.eot?#iefix") format("embedded-opentype"), url("fonts/lato-blackitalic.woff") format("woff"), url("fonts/lato-blackitalic.ttf") format("truetype"), url("fonts/lato-blackitalic.svg#lato") format("svg"); font-weight: 900; font-style: italic; } /** * Font family */ .font-arial, .box .content, .box .link, #navbar-search input[type=text], #navbar-search-sm input[type=text], #footer-navbar a, .page-search-bar #pageSearchForm input, #recommend .solution, #recommend .product, #tailored-solutions .solution, #tailored-solutions .product, .service-box .service-box-wrapper .content ul, .account-detail .detail, .billing-links-box .billing-row a, .investor-relations #menu .item, .investor-relations #menu .panel-title, .investor-relations #menu .panel-body, .management-structure section .structure-image .structure-note, .billing-section .billing-info-row label, .billing-section .billing-info-row .value, #search-result-content .search-total, #search-result-content .searchResult .row-title, #search-result-content .searchResult .row-content, .page-my-accounts .box-mobile .box-content .content .user-ID, .page-my-accounts .box-mobile .box-content .content a, .page-my-profile .box-content .title .btn-edit, .page-my-profile .form-group label, .page-my-profile .form-group .form-control, .page-my-profile .form-group .display-value, .faq-accordian .panel, #page-about-hkt .banner-wrapper .banner-text, #page-about-hkt .release-item, #about-hkt-press-information .page-detail, #about-hkt-press-information .filter-section label, .page-my-bill .filter-section label, .page-my-bill .spinner-top-col label, #financial-results .content-area .filter-section label, .individual-service-profile .form-group label, .individual-service-profile .form-group .form-control, .individual-service-profile .form-group .display-value, .page-my-profile-edit-mode .box-content .title .btn-edit, .page-my-profile-edit-mode .form-group label, .page-my-profile-edit-mode .form-group .form-control, .page-my-profile-edit-mode .form-group .display-value { font-family: Arial, sans-serif; font-weight: normal; } .font-arial-bold, .modal-dialog .close, .box .box-row-wrapper .content h2, .service-box .service-box-wrapper .content h2, .info-block .header h2, .info-block .content h2, .management-structure section .header, .service-plan-info-box .detail h2, .box-with-link .link, #search-result-content .modal.faq-detail .modal-dialog .modal-content .label-q, #page-sitemap #sitemap .category .title, #page-sitemap #sitemap .category .services a, .page-my-profile h2, .faq-accordian .panel .panel-heading .label-q, .individual-service-profile .box-account-toggle h2, .page-my-profile-edit-mode h2 { font-family: Arial, sans-serif; font-weight: bold; } .font-lato, .welcome-message .user-name, .nav-tabs li a, #customer-services .related-content .directory .link-label, #board-and-mgt .drop-down-item, #individual-profile .page-sub-title { font-family: "Lato", Arial, sans-serif; } .font-lato-black, #hkt-navbar-collapse .navbar-nav li .has-badge .badge, #page-sitemap #sitemap .category .hotline .hotline-number, #service-relocation .hotline .title, #service-relocation .hotline .hotline-number { font-family: "Lato-Black", Arial, sans-serif; } .font-lato-bold, .page-title, .box .title a, .live-chat-img .chat, .live-chat-img .link, .page-content-after-login #live-chat-img .chat, .page-content-after-login #live-chat-img .link, #header-navbar #hkt-navbar-toggle .icon-bar-text, #hkt-navbar-collapse .navbar-nav > li a, .welcome-message h3, .box-wrapper .box-link-label, .box-cta-wrapper .box-link-label, #chat a .title, #download a .title, #coverage-map a .title, .service-box .service-box-wrapper .header h2, .box-sidebar .box-row-wrapper .title h2, .account-detail .header h2, .share-performance .header h2, .related-links-list .header h2, .management-structure .header, .update-bill-information-wrapper #live-chat-img .chat, .update-bill-information-wrapper #live-chat-img .link, .service-plan-info-box .header h2, .box-with-link h2, .product-box h3, #live-chat-link p, #live-chat-link a span, #home-grid-row .grid-title, #home-grid-row .grid-title-mobile, #home-grid-row .link-title, #home-grid-row #grid-welcome #form-search textarea, #home-grid-row #grid-welcome #form-search .btn-clean, #smart-living .title, .page-myhkt-registerLogin h2, .page-myhkt-registerLogin h3, #infotainment .title, #e-smart-health .title, #home-phone .title, #at-the-office .box-wrapper .box .title a, .detail-card .detail-header a, .operation-box .operation-content h2, #for-your-home .title, #internet .title, #hkt-premier .title, #customer-services .title, #consumer-support .title, .page-myhkt-landing h2, .page-myhkt-landing .box-login-blue .listing-wrap .title, .page-myhkt-landing .box-login-white .listing-wrap .title, #about-hkt-milestone .sidebar-links .header, #awards .sidebar-links .header, .page-my-bill .live-chat-img .chat, .page-my-bill .live-chat-img .link, #investor-relations .header h2, #product-detail-now-tv #linkHeader, #home-automation #linkHeader, #home-automation .boxes-col > h2, #content-scenario-details h2, #individual-product-landing h2, #stores-and-showrooms .accordian .panel .panel-heading span.text, #stores-and-showrooms .others h2, .individual-service-profile h2, .individual-service-profile .box-content .title .btn-edit { font-family: "Lato-Bold", Arial, sans-serif; } /** * Font sets */ .font-general, .page-search-bar #pageSearchForm input, .pagination, #at-the-office #intro-text, .detail-card .detail-content, .detail-card .detail-more a, .operation-box .operation-content p, .page-my-profile .checkbox-label-left, .page-my-profile .box-account-toggle .description, .page-my-profile .box-account-toggle .form-group > label, #hkt-premier .content-area .content-wrapper, #consumer-support .content-area .content .text, .individual-service-profile .checkbox-label-left, .individual-service-profile .box-account-toggle .description, .individual-service-profile .box-account-toggle .form-group > label, .page-my-profile-edit-mode .checkbox-label-left, .page-my-profile-edit-mode .box-account-toggle .description, .page-my-profile-edit-mode .box-account-toggle .form-group > label { font-size: 110%; } @media (min-width: 768px) { .font-general, .page-search-bar #pageSearchForm input, .pagination, #at-the-office #intro-text, .detail-card .detail-content, .detail-card .detail-more a, .operation-box .operation-content p, .page-my-profile .checkbox-label-left, .page-my-profile .box-account-toggle .description, .page-my-profile .box-account-toggle .form-group > label, #hkt-premier .content-area .content-wrapper, #consumer-support .content-area .content .text, .individual-service-profile .checkbox-label-left, .individual-service-profile .box-account-toggle .description, .individual-service-profile .box-account-toggle .form-group > label, .page-my-profile-edit-mode .checkbox-label-left, .page-my-profile-edit-mode .box-account-toggle .description, .page-my-profile-edit-mode .box-account-toggle .form-group > label { font-size: 140%; } } .font-form-title, .page-myhkt-registerLogin h2, .page-myhkt-landing h2 { font-size: 130%; } @media (min-width: 768px) { .font-form-title, .page-myhkt-registerLogin h2, .page-myhkt-landing h2 { font-size: 200%; } } .font-detail-content, #stores-and-showrooms .page-detail, #stores-and-showrooms .account-detail .header h2, #stores-and-showrooms .account-detail .detail label, #stores-and-showrooms .account-detail .detail .value, .font-form-label, .form label, .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .form-subtitle, .font-form-field, .form .form-control, .page-my-profile .myhkt-service-info .list-services li a, .page-myhkt-landing .content, .page-myhkt-landing .box-login-white .listing-wrap ul li a, .individual-service-profile .myhkt-service-info .list-services li a, .page-my-profile-edit-mode .myhkt-service-info .list-services li a, .font-collapse-panel-title, .faq-accordian .panel .panel-heading h4 a { font-size: 120%; } @media (min-width: 768px) { .font-detail-content, #stores-and-showrooms .page-detail, #stores-and-showrooms .account-detail .header h2, #stores-and-showrooms .account-detail .detail label, #stores-and-showrooms .account-detail .detail .value, .font-form-label, .form label, .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .form-subtitle, .font-form-field, .form .form-control, .page-my-profile .myhkt-service-info .list-services li a, .page-myhkt-landing .content, .page-myhkt-landing .box-login-white .listing-wrap ul li a, .individual-service-profile .myhkt-service-info .list-services li a, .page-my-profile-edit-mode .myhkt-service-info .list-services li a, .font-collapse-panel-title, .faq-accordian .panel .panel-heading h4 a { font-size: 140%; } } .font-form-note, .store-info span, .form .form-note, #consumer-electronics #network-devices .content p, #consumer-electronics #ip-cam .content p, #consumer-electronics #wearable-gadgets .content p, #consumer-electronics #smart-gadgetry .content p, #consumer-electronics #home-appliances .content p, #consumer-electronics .empty-box .content p, #consumer-electronics #network-devices .link a span, #consumer-electronics #ip-cam .link a span, #consumer-electronics #wearable-gadgets .link a span, #consumer-electronics #smart-gadgetry .link a span, #consumer-electronics #home-appliances .link a span, #consumer-electronics .empty-box .link a span { font-size: 110%; } @media (min-width: 768px) { .font-form-note, .store-info span, .form .form-note, #consumer-electronics #network-devices .content p, #consumer-electronics #ip-cam .content p, #consumer-electronics #wearable-gadgets .content p, #consumer-electronics #smart-gadgetry .content p, #consumer-electronics #home-appliances .content p, #consumer-electronics .empty-box .content p, #consumer-electronics #network-devices .link a span, #consumer-electronics #ip-cam .link a span, #consumer-electronics #wearable-gadgets .link a span, #consumer-electronics #smart-gadgetry .link a span, #consumer-electronics #home-appliances .link a span, #consumer-electronics .empty-box .link a span { font-size: 130%; } } .font-block-content, .box-with-link p, .box-with-link .link, #product-detail-now-tv .page-detail, #product-detail-now-tv .more-details span, #product-detail-now-tv .more-details a, #service-reloc-form .custom-form .privacy-statement span, #stores-and-showrooms .others .link-icon, #email-registration-form .custom-form .privacy-statement span, .font-media-list-detail { font-size: 110%; } @media (min-width: 768px) { .font-block-content, .box-with-link p, .box-with-link .link, #product-detail-now-tv .page-detail, #product-detail-now-tv .more-details span, #product-detail-now-tv .more-details a, #service-reloc-form .custom-form .privacy-statement span, #stores-and-showrooms .others .link-icon, #email-registration-form .custom-form .privacy-statement span, .font-media-list-detail { font-size: 120%; } } .font-lato-to-arial, #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a { font-family: "Lato", Arial, sans-serif; } @media (min-width: 768px) { .font-lato-to-arial, #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a { font-family: Arial, sans-serif; } } .font-lato-to-arial-bold, #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a .item-text { font-family: "Lato", Arial, sans-serif; } @media (min-width: 768px) { .font-lato-to-arial-bold, #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a .item-text { font-family: Arial, sans-serif; font-weight: bold; } } .font-lato-bold-to-lato-black, #home-grid-row .grid-title, #home-grid-row .link-title { font-family: "Lato-Bold", Arial, sans-serif; } @media (min-width: 768px) { .font-lato-bold-to-lato-black, #home-grid-row .grid-title, #home-grid-row .link-title { font-family: "Lato-Black", Arial, sans-serif; } } .font-arial-to-lato-bold, .investor-relations #menu .menu-title { font-family: Arial, sans-serif; } @media (min-width: 768px) { .font-arial-to-lato-bold, .investor-relations #menu .menu-title { font-family: "Lato-Bold", Arial, sans-serif; } } .font-arial-bold-to-lato-bold, .operation-box .operation-link { font-family: Arial, sans-serif; font-weight: bold; } @media (min-width: 768px) { .font-arial-bold-to-lato-bold, .operation-box .operation-link { font-family: "Lato-Bold", Arial, sans-serif; font-weight: normal; } } @media (max-width: 768px) { h3 { font-size: 180%; } } h2 { color: #006ea5 !important; } h3 { color: #006ea5 !important; } /** * Mixins */ html { -ms-overflow-style: scrollbar; } body { background-color: #fff; font-size: 100%; font-family: Arial, sans-serif; } *, *:active, *:focus { outline: 0 !important; } a, a:hover, a:focus { cursor: pointer; text-decoration: none; } /** * Page wrap */ .page-header, #page-header-bottom, #page-footer, .page-content-wrap { min-width: 320px; } .page-header { padding: 0; border: none; margin: 0; } .container-fluid-limit { min-width: 320px; max-width: 960px; position: relative; } .page-content-wrap { #background-color: #e5e5e5; } .page-content { background-color: #fff; margin-bottom: 10px; } @media (min-width: 768px) { .page-content { margin-bottom: 32px; padding-bottom: 16px; } } .padding-reset { padding: 0; } .row-reset, #stores-and-showrooms .others h2 { margin: 0; } .row-gutter-2 { margin-left: -1px; margin-right: -1px; } .row-gutter-2 .col-gutter-2 { padding-left: 1px; padding-right: 1px; } .row-gutter-8 { margin-left: -4px; margin-right: -4px; } .row-gutter-8 .col-gutter-8 { padding-left: 4px; padding-right: 4px; } .row-gutter-10 { margin-left: -5px; margin-right: -5px; } .row-gutter-10 .col-gutter-10 { padding-left: 5px; padding-right: 5px; } .row-gutter-16 { margin-left: -8px; margin-right: -8px; } .row-gutter-16 .col-gutter-16 { padding-left: 8px; padding-right: 8px; } .row-gutter-20 { margin-left: -10px; margin-right: -10px; } .row-gutter-20 .col-gutter-20 { padding-left: 10px; padding-right: 10px; } .row-gutter-30 { margin-left: -15px; margin-right: -15px; } .row-gutter-30 .col-gutter-30 { padding-left: 15px; padding-right: 15px; } /* ------------------------------ COMMON ------------------------------ */ /*.breadcrumb-wrapper, .page-title, .carousel-wrapper, .box-line { padding: 0 5px; }*/ .carousel-wrapper { margin-bottom: 15px; } @media (min-width: 768px) { .carousel-wrapper { /*margin-bottom: 30px;*/ margin-bottom: 10px; } } .box-line { /*.divider {*/ height: 2px; background-color: #178be2; width: 100%; /*}*/ } .page-title { color: #006ea5; font-size: 220%; margin: 7px 0 14px; } @media screen and (min-width: 768px) { .page-title { font-size: 280%; margin: 0 0 15px 0; } } #consumer-electronics .page-title, #service-relocation .page-title, #stores-and-showrooms .page-title, #awards .page-title, #email-alert-reg .page-title, #text-and-visuals .page-title, #text-and-single-visual .page-title, #text-and-multiple-visuals .page-title, #why-hkt .page-title, #corporate-social-responsibility .page-title { font-size: 180%; } @media screen and (min-width: 768px) { #consumer-electronics .page-title, #service-relocation .page-title, #stores-and-showrooms .page-title, #awards .page-title, #email-alert-reg .page-title, #text-and-visuals .page-title, #text-and-single-visual .page-title, #text-and-multiple-visuals .page-title, #why-hkt .page-title, #corporate-social-responsibility .page-title { font-size: 260%; } } .page-banner img { width: 100%; } .page-logo { margin: 10px 0 20px 0; } .text-n-visual .article-content h6 + div, .article-detail h6 + div, #awards .content-area .page-detail, #awards .content-area .filter label, #awards .content-area .filter .date-filter .custom-input-select .btn, #awards .content-area .filter .date-filter .custom-input-select ul.dropdown-menu li a span, #awards .content-area .awards-list-wrapper .awards-list .font-block-content, #awards .content-area .awards-list-wrapper .awards-list .box-with-link p, .box-with-link #awards .content-area .awards-list-wrapper .awards-list p, #awards .content-area .awards-list-wrapper .awards-list .box-with-link .link, .box-with-link #awards .content-area .awards-list-wrapper .awards-list .link, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .page-detail, #product-detail-now-tv #awards .content-area .awards-list-wrapper .awards-list .page-detail, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .more-details span, #product-detail-now-tv .more-details #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .more-details a, #product-detail-now-tv .more-details #awards .content-area .awards-list-wrapper .awards-list a, #awards .content-area .awards-list-wrapper .awards-list #service-reloc-form .custom-form .privacy-statement span, #service-reloc-form .custom-form .privacy-statement #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .awards-list-wrapper .awards-list #stores-and-showrooms .others .link-icon, #stores-and-showrooms .others #awards .content-area .awards-list-wrapper .awards-list .link-icon, #awards .content-area .awards-list-wrapper .awards-list #email-registration-form .custom-form .privacy-statement span, #email-registration-form .custom-form .privacy-statement #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .other-links-wrapper .the-other-links .box-other-link .link a, #awards .content-area .desk-other-links .the-other-links .box-other-link .link a, #email-alert-reg .page-detail, #email-registration-form .custom-form .info, #email-registration-form .custom-form .form-label, #email-registration-form .custom-form .custom-label, #email-registration-form .custom-form input[type="text"], #corporate-social-responsibility .page-detail, #corporate-social-responsibility .activities-links .box-other-link .link a, #corporate-social-responsibility .activities-links .other-activities .box-with-link p, #corporate-social-responsibility .activities-links .other-activities .box-with-link .link { font-size: 110%; } @media screen and (min-width: 768px) { .text-n-visual .article-content h6 + div, .article-detail h6 + div, #awards .content-area .page-detail, #awards .content-area .filter label, #awards .content-area .filter .date-filter .custom-input-select .btn, #awards .content-area .filter .date-filter .custom-input-select ul.dropdown-menu li a span, #awards .content-area .awards-list-wrapper .awards-list .font-block-content, #awards .content-area .awards-list-wrapper .awards-list .box-with-link p, .box-with-link #awards .content-area .awards-list-wrapper .awards-list p, #awards .content-area .awards-list-wrapper .awards-list .box-with-link .link, .box-with-link #awards .content-area .awards-list-wrapper .awards-list .link, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .page-detail, #product-detail-now-tv #awards .content-area .awards-list-wrapper .awards-list .page-detail, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .more-details span, #product-detail-now-tv .more-details #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .awards-list-wrapper .awards-list #product-detail-now-tv .more-details a, #product-detail-now-tv .more-details #awards .content-area .awards-list-wrapper .awards-list a, #awards .content-area .awards-list-wrapper .awards-list #service-reloc-form .custom-form .privacy-statement span, #service-reloc-form .custom-form .privacy-statement #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .awards-list-wrapper .awards-list #stores-and-showrooms .others .link-icon, #stores-and-showrooms .others #awards .content-area .awards-list-wrapper .awards-list .link-icon, #awards .content-area .awards-list-wrapper .awards-list #email-registration-form .custom-form .privacy-statement span, #email-registration-form .custom-form .privacy-statement #awards .content-area .awards-list-wrapper .awards-list span, #awards .content-area .other-links-wrapper .the-other-links .box-other-link .link a, #awards .content-area .desk-other-links .the-other-links .box-other-link .link a, #email-alert-reg .page-detail, #email-registration-form .custom-form .info, #email-registration-form .custom-form .form-label, #email-registration-form .custom-form .custom-label, #email-registration-form .custom-form input[type="text"], #corporate-social-responsibility .page-detail, #corporate-social-responsibility .activities-links .box-other-link .link a, #corporate-social-responsibility .activities-links .other-activities .box-with-link p, #corporate-social-responsibility .activities-links .other-activities .box-with-link .link { font-size: 140%; } } .related-content a { color: #666; text-decoration: none; } .related-content a .link-icon { color: #1d8fe4; } .related-content .line { padding: 0; margin: 7px 0; } @media screen and (min-width: 768px) { .related-content .line { padding: 0 5px; } } .related-content .line .divider { width: 100%; height: 1px; background-color: #dadada; } .blue-divider { height: 2px; background-color: #178be2; margin-top: 20px; margin-bottom: 20px; float: left; width: 100%; } /* ------------------------------ COMMON - BOX ------------------------------ */ .box { padding: 9px 0; } @media screen and (min-width: 768px) { .box { padding: 5px 4px; /*height: 247px;*/ } .box .line { padding: 0 10px; } .box .divider { margin-top: 10px; margin-bottom: 15px; width: 100%; height: 2px; background-color: #178be2; } } .box > .row { position: relative; height: 100%; /* ---------------- BORDER CORNER ------------------ */ } @media screen and (min-width: 768px) { .box > .row { padding-top: 25px; padding-bottom: 20px; } } @media screen and (min-width: 768px) { .box:not(.for-your-home-landing):not(.box-store) > .row { padding-top: 5px; } } .box > .row .border-content-box, .box > .row .border-top-left, .box > .row .border-top-right, .box > .row .border-bot-left, .box > .row .border-bot-right { position: absolute; } .box > .row .border-top-left, .box > .row .border-top-right, .box > .row .border-bot-left, .box > .row .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; } .box > .row .border-content-box, .box > .row .border-top-left, .box > .row .border-top-right { top: 0; } .box > .row .border-bot-left, .box > .row .border-bot-right { bottom: 0; } .box > .row .border-content-box, .box > .row .border-top-left, .box > .row .border-bot-left { left: 0; } .box > .row .border-top-right, .box > .row .border-bot-right { right: 0; } .box > .row .border-content-box { width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; } .box > .row .border-top-left { background-position: 0 0; } .box > .row .border-top-right { background-position: -10px 0; } .box > .row .border-bot-left { background-position: 0 -10px; } .box > .row .border-bot-right { background-position: -10px -10px; } .box .title, .box .content, .box .link { z-index: 3; } @media screen and (min-width: 768px) { .box .title { left: 0; padding: 0 10px; line-height: inherit; } } @media screen and (min-width: 768px) { .box:not(.box-mobile):not(.small-box):not(.box-store):not(.box-brand-logo):not(.for-your-home-landing):not(.box-company-profile):not(.box-at-the-office) .title { //height: 87px; height: 63px; } .box-at-the-office .title { height: 30px; } } .box .title img { margin: auto; max-height: 35px; width: auto; } @media screen and (min-width: 768px) { .box .title img { margin: 0; /* min-height: 35px; */ } } .box .title a { color: #03437e; font-size: 170%; text-decoration: none; line-height: 30px; /*height: 30px;*/ vertical-align: middle; } @media screen and (min-width: 768px) { .box .title a { line-height: 24px; } } @media screen and (min-width: 768px) { .box:not(.box-mobile):not(.small-box):not(.box-store):not(.box-brand-logo):not(.for-your-home-landing):not(.box-company-profile) .title a { position: absolute; bottom: 0px; } } .box .title .text { padding: 0; } @media screen and (min-width: 768px) { .box .title .text { text-align: center; } } .box .content { line-height: 75px; } @media screen and (min-width: 768px) { .box .content { font-size: 140%; left: 0; padding: 0 10px; color: #666; line-height: 20px; } } .box .link { font-size: 150%; line-height: 30px; text-align: right; margin-top: 25px; } @media screen and (min-width: 768px) { .box .link { margin-top: 25px; padding: 0 10px; color: #666; text-align: left; font-weight: bold; } .box .link .text { padding: 0; } } .box .link-at-office-left { margin-top: 0px; } .box .link a .text { color: #666; } @media screen and (min-width: 768px) { .box .link a .longtext { font-size: 80%; } } .box .link .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 11px; display: inline-block; margin-right: 15px; margin-left: 8px; } @media screen and (min-width: 768px) { .box .link .link-icon { line-height: 25px; margin-right: 0; margin-left: 8px; } } .box .link .link-icon-new-window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; width: 13px; height: 13px; display: inline-block; /*margin-right: 18px;*/ margin-right: 5px; } /* ------------------------------ COMMON - BOX - AT THE OFFICE (see ele-box-atTheOffice.scss) ------------------------------ */ /* ------------------------------ COMMON - BOX - STORE ------------------------------ */ .box-store > .row { height: 100%; } @media screen and (min-width: 768px) { .box-store > .row { padding-top: 30px; } } .box-store .title a { line-height: 35px; } @media screen and (min-width: 768px) { .box-store .title a { line-height: 25px; } } @media screen and (min-width: 768px) { .box-store .title { margin-top: 15px; } } .box-store .content { line-height: 35px; } .box-store .content img { width: 24px; margin: 0 auto; /*min-height: 25px; min-width: 22px; max-height: 38px; max-width: 29px;*/ } @media screen and (min-width: 768px) { .box-store .content img { display: block; margin: auto; width: 38px; /*max-height: 69px; max-width: 53px;*/ } } .box-store .link { margin-top: 10px; text-align: center; } @media (min-width: 768px) { .box-store .link .link-icon { margin: 0; } } /* ------------------------------ COMMON - BOX - MOBILE W/ BORDER ------------------------------ */ .box-mobile { padding: 5px 4px; } .box-mobile .title a { display: block; width: 100%; } .box-mobile > .row { position: relative; padding-top: 25px; padding-bottom: 20px; } .box-mobile > .row .title { padding: 0 5px; } @media screen and (min-width: 768px) { .box-mobile > .row .title { //padding: 0 20px; padding: 15px 20px; } } .box-mobile > .row .link { padding: 0; } @media screen and (min-width: 768px) { .box-mobile > .row .link { padding: 0 10px; } } /* ------------------------------ COMMON - ONLINE STORE BOX ------------------------------ */ .online-store-box .box-store .row { margin: 0; } .online-store-box .box-store .row .title { padding: 0; } /* ------------------------------ COMMON - DROPDOWN ------------------------------ */ .custom-input-select { position: relative; } .custom-input-select.open .dropdown-toggle { box-shadow: none; } .custom-input-select.open > .btn-default.dropdown-toggle { background: #fff; border-color: #ccc; } .custom-input-select button { margin-left: 3px; height: 32px; border-left: none; border-right: none; z-index: 5; } .custom-input-select button:hover, .custom-input-select button:focus, .custom-input-select button:active, .custom-input-select button.active { background: #fff; border-color: #ccc; } .custom-input-select .dropdown-menu.open { width: 101%; } .custom-input-select .border-side-left, .custom-input-select .border-side-right { position: absolute; height: 32px; width: 7px; z-index: 8; top: 0; } .custom-input-select .border-side-left { left: 0; } .custom-input-select .border-side-right { right: -3px; } .custom-input-select .custom-dropdown-arrow { width: 11px; height: 6px; display: inline-block; background: url(../img/arrow-dropdown-11x6.png) right center no-repeat; } /* ------------------------------ COMMON - DATE DROPDOWN ------------------------------ */ .contact-links-dropdown-wrapper, .custom-dropdown-wrapper, .date-dropdown-wrapper { display: inline-block; width: 100%; } .contact-links-dropdown, .custom-dropdown, .date-dropdown { position: relative; margin-top: 15px; } .contact-links-dropdown label, .custom-dropdown label, .date-dropdown label { font-size: 120%; font-family: Arial; font-weight: normal; float: left; line-height: 32px; padding-right: 10px; } @media screen and (min-width: 768px) { .contact-links-dropdown label, .custom-dropdown label, .date-dropdown label { font-size: 140%; } } .contact-links-dropdown .dropdown, .custom-dropdown .dropdown, .date-dropdown .dropdown { padding: 0; } .contact-links-dropdown .dropdown button, .custom-dropdown .dropdown button, .date-dropdown .dropdown button { background: #fff; width: 100%; text-align: left; color: #666; height: 32px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; position: relative; box-shadow: none; } .contact-links-dropdown .dropdown .placeholder-visible-xs, .custom-dropdown .dropdown .placeholder-visible-xs, .date-dropdown .dropdown .placeholder-visible-xs { display: inline-block; } @media screen and (min-width: 768px) { .contact-links-dropdown .dropdown .placeholder-visible-xs, .custom-dropdown .dropdown .placeholder-visible-xs, .date-dropdown .dropdown .placeholder-visible-xs { display: none; } } .contact-links-dropdown .dropdown .placeholder, .custom-dropdown .dropdown .placeholder, .date-dropdown .dropdown .placeholder { font-family: Arial; } .contact-links-dropdown .dropdown .border-side-left, .contact-links-dropdown .dropdown .border-side-right, .custom-dropdown .dropdown .border-side-left, .custom-dropdown .dropdown .border-side-right, .date-dropdown .dropdown .border-side-left, .date-dropdown .dropdown .border-side-right { position: absolute; height: 32px; width: 7px; z-index: 1; top: 0; } .contact-links-dropdown .dropdown .border-side-left, .custom-dropdown .dropdown .border-side-left, .date-dropdown .dropdown .border-side-left { left: -1px; } .contact-links-dropdown .dropdown .border-side-right, .custom-dropdown .dropdown .border-side-right, .date-dropdown .dropdown .border-side-right { right: -1px; } .contact-links-dropdown .dropdown .dropdown-menu, .contact-links-dropdown .dropdown .btn, .custom-dropdown .dropdown .dropdown-menu, .custom-dropdown .dropdown .btn, .date-dropdown .dropdown .dropdown-menu, .date-dropdown .dropdown .btn { font-size: 100%; } /* ------------------------------ COMMON - LIVE CHAT ------------------------------ */ .live-chat-img { height: 77px; width: 230px; /*background: url("../img/live-chat-image.png") no-repeat center;*/ background: url("../img/live-chat-bg-small-image.png") no-repeat center; float: right; border-bottom: 1px solid #cdcdcd; margin-top: -30px; position: relative; } .live-chat-img .chat, .live-chat-img .link { font-size: 120%; } .live-chat-img .chat { color: #fff; position: absolute; top: 19px; left: 26px; } .live-chat-img .link { position: absolute; color: #004c92; bottom: 17px; left: 16px; padding-right: 8px; background: url(../img/arrow-darkblue-4x8.png) no-repeat right; } /* ------------------------------ COMMON - CAROUSEL ------------------------------ */ .carousel-slider .carousel-indicators { bottom: -5px; } .carousel-slider .carousel-indicators li { background: url(../img/carousel-indicator-xs.png) left center no-repeat; width: 8px; height: 8px; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } @media screen and (min-width: 768px) { .carousel-slider .carousel-indicators li { background: url(../img/carousel-indicator.png) left center no-repeat; width: 16px; height: 16px; } } .carousel-slider .carousel-indicators li.active { background-position: -9px 0; } @media screen and (min-width: 768px) { .carousel-slider .carousel-indicators li.active { background-position: -18px 0; } } .carousel-slider .carousel-inner { background-color: #e0e0e0; } .carousel-slider .carousel-inner img { width: 100%; } .carousel-slider .carousel-control { margin: auto; width: 25px; height: 25px; background: none; background-color: #fff; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); opacity: 0.4; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control { width: 41px; height: 41px; } } .carousel-slider .carousel-control.left, .carousel-slider .carousel-control.right { background-repeat: no-repeat; background-position: center; } .carousel-slider .carousel-control.left { background-image: url(../img/arrow-slider-left.png); } .carousel-slider .carousel-control.right { background-image: url(../img/arrow-slider-right.png); } .carousel-slider .carousel-control .glyphicon-chevron-left { left: 60%; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control .glyphicon-chevron-left { left: 45%; } } .carousel-slider .carousel-control .glyphicon-chevron-right { right: 65%; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control .glyphicon-chevron-right { right: 55%; } } .carousel-slider .carousel-control .glyphicon-chevron-left:before, .carousel-slider .carousel-control .glyphicon-chevron-right:before { content: ""; } .carousel-slider .carousel-control span { color: #808285; line-height: 0; font-size: 13px; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control span { line-height: 29px; font-size: 18px; } } /* ------------------------------ BATCH 2 ------------------------------ */ /*.image-wrapper { img { margin: auto; } }*/ /* ------------------------------ COMMON - DIVIDER ------------------------------ */ .divider-light-blue, .box-with-link h2 { border-bottom: 2px solid #178be2; } .divider-dark-blue { border-bottom: 2px solid #13598e; } /* ------------------------------ COMMON - MARGIN ------------------------------ */ .margin-left-reset { margin-left: 0; } .margin-left-15 { margin-left: 15px; } .margin-right-reset { margin-right: 0; } .margin-left-15 { margin-left: 15px; } .margin-top-5, #consumer-electronics .page-logo, #stores-and-showrooms .page-logo { margin-top: 5px; } .margin-top-10 { margin-top: 10px; } .margin-top-15 { margin-top: 15px; } .margin-top-20 { margin-top: 20px; } .margin-top-30 { margin-top: 30px; } .margin-bottom-5, #home-automation #lightingBox .content img, #home-automation #curtainBox .content img, #home-automation #temperatureControlBox .content img, #home-automation #homeMonitoringBox .content img, #home-automation #homeTheaterBox .content img, #home-automation .empty-box .content img, #consumer-electronics #network-devices .content img, #consumer-electronics #ip-cam .content img, #consumer-electronics #wearable-gadgets .content img, #consumer-electronics #smart-gadgetry .content img, #consumer-electronics #home-appliances .content img, #consumer-electronics .empty-box .content img { margin-bottom: 5px; } .margin-bottom-10 { margin-bottom: 10px; } .margin-bottom-15 { margin-bottom: 15px; } .margin-bottom-20 { margin-bottom: 20px; } .margin-top-bot-5 { margin-top: 5px; margin-bottom: 5px; } .margin-top-bot-10 { margin-top: 10px; margin-bottom: 10px; } .margin-top-bot-15 { margin-top: 15px; margin-bottom: 15px; } .margin-top-bot-20 { margin-top: 20px; margin-bottom: 20px; } .margin-side-10 { margin-left: 10px; margin-right: 10px; } /* ------------------------------ COMMON - PADDING ------------------------------ */ .padding-reset { padding: 0; } .padding-left-reset { padding-left: 0; } .padding-right-reset { padding-right: 0; } .padding-right-5 { padding-right: 5px; } .padding-right-10 { padding-right: 10px; } .padding-box { padding-left: 0; padding-right: 10px; } .padding-top-5 { padding-top: 5px; } .padding-top-10 { padding-top: 10px; } .padding-top-15 { padding-top: 15px; } .padding-top-30 { padding-top: 30px; } .padding-bottom-5 { padding-bottom: 5px; } .padding-bottom-10 { padding-bottom: 10px; } .padding-bottom-15 { padding-bottom: 15px; } .padding-bottom-20 { padding-bottom: 20px; } .padding-bottom-40 { padding-bottom: 40px; } .padding-top-bot-3 { padding-top: 3px; padding-bottom: 3px; } .padding-top-bot-5 { padding-top: 5px; padding-bottom: 5px; } .padding-top-bot-10 { padding-top: 10px; padding-bottom: 10px; } .padding-top-bot-15, .box-with-link .link { padding-top: 15px; padding-bottom: 15px; } .padding-left-5, .store-info .map-redirect { padding-left: 5px; } .shop-map-redirect { padding-left: 5px; } .padding-left-10 { padding-left: 10px; } .padding-right-5 { padding-right: 5px; } .padding-side-reset { padding-left: 0; padding-right: 0; } .padding-side-1 { padding-left: 1px; padding-right: 1px; } .padding-side-2 { padding-left: 2px; padding-right: 2px; } .padding-side-5, #page-corporate-governance .investor-relations #menu { padding-left: 5px; padding-right: 5px; } .padding-side-10, #page-corporate-governance .management-structure .header, #page-corporate-governance .management-structure .detail, #page-corporate-governance .related-links-list .header, #page-corporate-governance .related-links-list .information-link { padding-left: 10px; padding-right: 10px; } .padding-right-15 { padding-right: 15px; } .padding-side-12 { padding-left: 12px; padding-right: 12px; } .padding-side-15, #stores-and-showrooms .accordian .panel .panel-body > div { padding-left: 15px; padding-right: 15px; } .padding-side-20 { padding-left: 20px; padding-right: 20px; } .padding-side-30 { padding-left: 30px; padding-right: 30px; } .padding-5 { padding: 5px; } /* ------------------------------ COMMON - FONT ------------------------------ */ .font-family-arial-bold { font-family: Arial, sans-serif; font-weight: bold; } /* ------------------------------ COMMON - BORDER ------------------------------ */ .border-top-light-grey { border-top: 1px solid #dadada; } .border-bottom-light-grey { border-bottom: 1px solid #dadada; } .border-top-bot-light-grey { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; } .border-light-grey { border: 1px solid #dadada; } /* ------------------------------ COMMON - BACKGROUND ------------------------------ */ .bg-lighter-grey, #stores-and-showrooms .accordian .panel .panel-body .odd { background-color: #f5f5f5; } /* ------------------------------ BATCH 3 ------------------------------ */ /* ------------------------------ COMMON - HEADER ------------------------------ */ .block-header, .box-with-link h2 { font-size: 170%; color: #03437e; } @media screen and (min-width: 768px) { .block-header, .box-with-link h2 { font-size: 180%; } } .block-sub-header { font-size: 130%; color: #03437e; } @media screen and (min-width: 768px) { .block-sub-header { font-size: 140%; } } /* ------------------------------ COMMON - ANCHOR ------------------------------ */ a.link-label, a .link-label { color: #666; } .searchHKT-results { display: none; position: absolute; min-height: 300px; background: #FFF; z-index: 999; border: 2px solid #cccccc; width: 300px; padding: 15px 15px 0 15px; } @media (min-width: 768px) { .searchHKT-results { right: 105px; } } @media (min-width: 992px) { .searchHKT-results { right: 40px; } } .searchHKT-results .search-heading { color: #002a73; font-size: 140%; font-weight: bold; } .searchHKT-results p { color: inherit; font-size: 120%; } .searchHKT-results .keyword { color: #1d8fe3; font-weight: bold; } .searchHKT-results #common-searches { padding-bottom: 8px; border-bottom: 1px solid #ccc; } .searchHKT-results #recommended-results { margin: 0 -15px 0 -15px; padding: 15px; background-color: #f5f5f5; } .searchHKT-results #recommended-results a { color: inherit; } .searchHKT-results #recommended-results a .results:hover, .searchHKT-results #recommended-results a .results:hover .result-title { color: #002a73; } .searchHKT-results #recommended-results a .results .result-title { margin-bottom: 0; color: #1d8fe3; font-weight: bold; } .tablet-search-form { display: none; width: 102%; margin-left: -30px; background-color: #1b2a46; clear: both; } .tablet-search-form #navbar-search-sm .search-input { width: 100%; } .tablet-search-form #navbar-search-sm .submit-search { float: right; margin-top: -26px; margin-right: -23px; border-radius: 0; background: url(../img/btn-header-search.png) no-repeat white; } /* ------------------------------------------ TAB/ACCORDION -------------------------------------------- */ #tabs ul.nav-tabs li { z-index: 1; } #tabs ul.nav-tabs li a { font-family: "Lato-bold"; } #tabs ul.nav-tabs li .tab-indicator { background: url(../img/grey-right-arrow-6x11.png) no-repeat center right; } #tabs ul.nav-tabs li.active .tab-indicator { background: url(../img/grey-down-arrow-11x6.png) no-repeat center right; } /* ------------------------------------------ CTA BUTTONS (submit, confirm, cancel, etc.) -------------------------------------------- */ .btn-cta { background: url(../img/btn-img.png) center top no-repeat; width: 91px; height: 33px; margin-top: 10px; margin-right: 2px; text-align: center; color: #fff; font-size: 14px; font-weight: bold; } .btn-arrow-cta { background: url(../img/btn-arrow.png) center top no-repeat; width: 33px; height: 33px; margin-top: 10px; } .btn-cta-inactive { background: url(../img/btn-img-inactive.png) center top no-repeat; } .btn-arrow-cta-inactive { background: url(../img/btn-arrow-inactive.png) center top no-repeat; } input[type=submit] { -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; border-top-right-radius: 0; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; } .submit-btn-group input { margin-top: 0; } .submit-btn-group .btn-cta, .submit-btn-group .btn-arrow-cta { border: 0 none; min-width: 0; padding: 0; } .btn-custom { margin-bottom: 0; cursor: pointer; } .btn-custom input, .btn-custom div, .btn-custom a { -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; border-top-right-radius: 0; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; border-top-right-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; background: #188ce3; margin-right: 2px; color: #fff; font-weight: bold; font-size: 14px; padding-left: 15px; padding-right: 15px; } .btn-custom input:hover, .btn-custom input:focus, .btn-custom div:hover, .btn-custom div:focus, .btn-custom a:hover, .btn-custom a:focus { color: #fff; } .btn-custom a:hover, .btn-custom a:active, .btn-custom a:visited, .btn-custom a:link { color: #fff; } .btn-custom span { background: #188ce3 url(../img/btn-arrow-right.png) center no-repeat; width: 33px; height: 34px; border: none; display: block; -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; border-top-right-radius: 0; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; } .btn-custom.darker-btn a, .btn-custom.darker-btn span, .btn-custom.darker-btn div { background-color: #03437e; } @media screen and (-webkit-min-device-pixel-ratio: 0) { .btn-custom span { height: 33px; } } a.link-label, a .link-label { color: #003399; } a.link-label:hover, a .link-label:hover { color: #188ce3; border-bottom: 2px solid #188ce3; } @media (min-width: 768px) { .page-content-after-login .page-title { float: left; } } .page-content-after-login #live-chat-img { height: 77px; width: 230px; background: url("../img/live-chat-image.png") no-repeat center; background: url("../img/live-chat-bg-small-image.png") no-repeat center; float: right; border-bottom: 1px solid #cdcdcd; margin-top: -30px; position: relative; } .page-content-after-login #live-chat-img .chat, .page-content-after-login #live-chat-img .link { font-size: 120%; } .page-content-after-login #live-chat-img .chat { color: #fff; position: absolute; top: 19px; left: 26px; } .page-content-after-login #live-chat-img .link { position: absolute; color: #004c92; bottom: 17px; left: 16px; padding-right: 8px; background: url(../img/arrow-darkblue-4x8.png) no-repeat right; } #header-navbar { border: 0 none; } @media (min-width: 768px) { #header-navbar { background: #03437e; } } #header-navbar #navbar-bg-fix { position: absolute; width: 100%; background: #03437e; top: 90px; height: 50px; overflow: hidden; } #header-navbar #navbar-dropdown-bg-fix { position: absolute; top: 140px; width: 100%; background: #1b2a46; } @media (min-width: 768px) { #header-navbar #header-padding { padding-right: 0; margin: 0; padding-left: 0; max-width: 100%; } } #header-navbar .navbar-header { overflow: hidden; height: 45px; } @media (min-width: 768px) { #header-navbar .navbar-header { background-color: #fff; width: 100%; height: 90px; margin: auto; float: none; padding-left: 15px; position: relative; } } @media (min-width: 768px) { #header-navbar .navbar-header .navbar-header-content { height: 100%; position: absolute; max-width: 960px; width: 100%; top: 0; left: 0; margin: auto; padding-left: 15px; right: 0; } } #header-navbar #hkt-navbar-toggle { border-color: #e1e1e8; font-size: 13px; padding: 5px 9px; margin: 8px 9px 0; } #header-navbar #hkt-navbar-toggle #hkt-navbar-toggle-fix { margin-top: 2px; } #header-navbar #hkt-navbar-toggle .icon-bar { background-color: #03437e; width: 16px; margin: 2px 5px 0 0; } .header-my-hkt { background: url(../img/sprite-page-toolbar.png) no-repeat; display: block; height: 31px; margin-top: 7px; background-position: 0 -52px; width: 78px; } @media (min-width: 768px) { .header-my-hkt { margin: 30px 30px 0 0; background-position: 0 0; width: 101px; } } @media (min-width: 992px) { .header-my-hkt { margin-right: 10px; } } #header-site-logo { display: block; margin: 13px 0 0 15px; width: 40%; float: left; } @media (min-width: 768px) { #header-site-logo { margin: 28px 0 0 0; } } #header-site-logo img { height: 23px; } @media (min-width: 768px) { #header-site-logo img { height: 40px; } } #hkt-navbar-collapse { background-color: #03437e; } @media (min-width: 768px) { #hkt-navbar-collapse { max-width: 960px; margin: auto; } } #hkt-navbar-collapse ul { margin-top: 0; margin-bottom: 0; } #hkt-navbar-collapse a { cursor: pointer; } #hkt-navbar-collapse a.active, #hkt-navbar-collapse a:hover { background-color: #1b2a46 !important; } #hkt-navbar-collapse a.dropdown-toggle-link { position: absolute; top: 0; left: 0; right: 48px; z-index: 1; } @media (min-width: 768px) { #hkt-navbar-collapse a.dropdown-toggle-link { position: relative; } } #hkt-navbar-collapse a.dropdown-toggle-link.active, #hkt-navbar-collapse a.dropdown-toggle:hover { background-color: transparent !important; } @media (min-width: 768px) { #hkt-navbar-collapse a.dropdown-toggle-link.active, #hkt-navbar-collapse a.dropdown-toggle:hover { background-color: #1b2a46 !important; } } #hkt-navbar-collapse a .glyphicon, #hkt-navbar-collapse .dropdown-toggle-button { display: block; float: right; font-size: 12px; line-height: 48px; text-align: center; width: 48px; height: 48px; margin: -15px 0; } #hkt-navbar-collapse .dropdown-toggle-button { background: #1d568b; } #hkt-navbar-collapse .navbar-nav { /** * 1st level menu items */ /** * 2nd level menu items */ } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav { margin-left: -27px; padding-left: 15px; } } #hkt-navbar-collapse .navbar-nav li .item-text { float: left; padding-left: 14px; position: relative; } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li .item-text { float: none; padding-left: 0; } } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li .has-badge { padding-right: 24px; } } #hkt-navbar-collapse .navbar-nav li .has-badge .badge { background: url(../img/badge-cs-after-login.png) center center no-repeat transparent; font-size: 10px; width: 20px; padding: 5px; margin-left: 8px; -webkit-border-radius: 0 0; -moz-border-radius: 0 / 0; border-radius: 0 / 0; } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li .has-badge .badge { position: absolute; top: -10px; left: 100%; margin-left: 2px; } } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li.dropdown { position: static; } } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li.dropdown .dropdown-menu { width: 100%; background-color: #1b2a46; border: 0 none; padding: 20px 32px; max-width: 960px; left: 0; right: 0; margin-left: auto; margin-right: auto; -webkit-border-radius: 0 0; -moz-border-radius: 0 / 0; border-radius: 0 / 0; } } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav li.dropdown .dropdown-menu > li { width: 25%; float: left; } } @media (min-width: 992px) { #hkt-navbar-collapse .navbar-nav li.dropdown .dropdown-menu > li { width: 20%; } } #hkt-navbar-collapse .navbar-nav li.dropdown .dropdown-menu > li.clearfix { width: 100%; margin: 5px 0; } #hkt-navbar-collapse .navbar-nav li.dropdown.open > a { background-color: #1b2a46 !important; } #hkt-navbar-collapse .navbar-nav li a.dropdown-toggle { overflow: hidden; margin: 0 9px 0; padding-top: 15px; padding-bottom: 15px; } #hkt-navbar-collapse .navbar-nav > li a { background-color: transparent; color: #fff; margin: 4px 9px; padding: 11px 0; font-size: 16px; line-height: 20px; overflow: hidden; } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav > li a { overflow: auto; margin: 0; padding: 15px 14px; } } #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a { margin: 4px 9px; padding: 4px 0; line-height: 20px; font-size: 14px; } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a { white-space: normal; margin: 0; padding: 1px 6px; color: #ccc; font-size: 14px; line-height: 24px; } #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a.active, #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a:hover { background-color: #03437e !important; } } #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a .item-text { padding-left: 23px; } @media (min-width: 768px) { #hkt-navbar-collapse .navbar-nav > li .dropdown-menu > li > a .item-text { color: #fff; font-size: 14px; padding: 3px 0; } } #hkt-navbar-collapse .navbar-nav .divider { border-top: 1px solid #fff; margin: 0 9px; } /** * Navbar Search */ #navbar-search, #navbar-search-sm { margin: 12px 57px 12px 0; padding: 0; } @media (min-width: 992px) { #navbar-search, #navbar-search-sm { margin-right: 0; } } #navbar-search input[type=text], #navbar-search input[type=submit], #navbar-search-sm input[type=text], #navbar-search-sm input[type=submit] { vertical-align: middle; height: 26px; } #navbar-search input[type=text], #navbar-search-sm input[type=text] { background-color: transparent; color: #fff; font-size: 13px; border: 1px solid #fff; padding: 2px 6px; width: 130px; } #navbar-search input[type=text]::-webkit-input-placeholder, #navbar-search-sm input[type=text]::-webkit-input-placeholder { color: #ccc; } #navbar-search input[type=text]:-moz-placeholder, #navbar-search-sm input[type=text]:-moz-placeholder { color: #ccc; } #navbar-search input[type=text]::-moz-placeholder, #navbar-search-sm input[type=text]::-moz-placeholder { color: #ccc; } #navbar-search input[type=text]:-ms-input-placeholder, #navbar-search-sm input[type=text]:-ms-input-placeholder { color: #ccc; } #navbar-search input[type=submit], #navbar-search-sm input[type=submit] { background: url(../img/btn-header-search.png) center center no-repeat white; margin-left: -4px; border: 0 none; padding: 0; width: 26px; } @media screen and (min-width: 992px) { #navbar-search input[type=submit], #navbar-search-sm input[type=submit] { background: url(../img/btn-header-search.png) center center no-repeat white; } } @media screen and (min-width: 768px) { #navbar-search input [type=submit].sm-search-btn, #navbar-search-sm input [type=submit].sm-search-btn { background: url(../img/active-btn-header-search.png) center center no-repeat white; } } /** * Page Toolbar */ .page-toolbar { background-color: #1b2a46; margin: 0 -15px; } @media (min-width: 768px) { .page-toolbar { position: fixed; top: 110px; right: 0; width: 40px; margin: 0; z-index: 1030; } } @media (min-width: 768px) { .page-toolbar.no-share { top: 127px; } } .page-toolbar .item { float: left; width: 20%; text-align: center; } @media (min-width: 768px) { .page-toolbar .item { float: none; width: 100%; } } .page-toolbar .item a { padding: 14px 10px; display: block; } @media (min-width: 768px) { .page-toolbar .item a { padding: 0; } } .page-toolbar .item a img { height: 14px; } @media (min-width: 480px) { .page-toolbar .item a img { /*height: 21px;*/ } } @media (min-width: 768px) { .page-toolbar .item a img { width: 25px; padding: 11px 0; height: auto; } } .page-toolbar .item.item-lang a img { height: 12px; } @media screen and (min-width: 768px) { .page-toolbar .item.item-lang a img { padding: 14px 0; width: 25px; height: auto; } } @media screen and (min-width: 768px) { .page-toolbar .item.item-chat a img { padding: 9px 0; } } .page-toolbar .item.item-share a img { width: 12px; } @media screen and (min-width: 768px) { .page-toolbar .item.item-share a img { margin: -2px 0; width: auto; height: 44px; } } .page-toolbar .item.item-font-size a img { height: 12px; } @media screen and (min-width: 768px) { .page-toolbar .item.item-font-size a img { padding: 13px 0; width: 25px; height: auto; } } .page-toolbar #item-share-list a.dropdown-toggle.active, .page-toolbar #item-share-list a.dropdown-toggle:hover, .page-toolbar #item-share-list.open > a.dropdown-toggle { background-color: #03437e !important; } .page-toolbar #item-share-list ul { position: relative; left: -200%; padding-top: 10px; height: 51px; border: none; border-bottom: 5px solid #fff; border-radius: 0; background-color: #03437e; } @media screen and (min-width: 768px) { .page-toolbar #item-share-list ul { position: absolute; top: 0; left: -150px !important; margin: 0; padding: 11px 5px; min-width: 150px; width: 150px !important; height: 85px; border: none; box-shadow: none; z-index: 1030; } } .page-toolbar #item-share-list ul li { float: left; padding-left: 3px; } @media screen and (min-width: 768px) { .page-toolbar #item-share-list ul li { padding: 0; width: 35px !important; height: 35px; } } .page-toolbar #item-share-list ul li a { padding: 0; } .page-toolbar #item-share-list ul li a:hover { background-color: #03437e !important; } .page-toolbar #item-share-list ul li a img { display: block; margin: auto; /*width: 55%; height: auto;*/ width: 23px; height: 23px; } @media screen and (min-width: 768px) { .page-toolbar #item-share-list ul li a img { padding: 0; width: 25px; height: 25px; } } .page-toolbar #item-chat-list a.dropdown-toggle.active, .page-toolbar #item-chat-list a.dropdown-toggle:hover, .page-toolbar #item-chat-list.open > a.dropdown-toggle { background-color: #03437e !important; } .page-toolbar #item-chat-list.open > ul { visibility: hidden; } @media screen and (min-width: 768px) { .page-toolbar #item-chat-list.open > ul { visibility: visible; } } @media screen and (min-width: 768px) { .page-toolbar #item-chat-list ul { position: absolute; top: 0; left: -163px; margin: 0; width: 163px; height: 68px; border: none; border-radius: 0; box-shadow: none; background-color: #03437e; z-index: 1030; } } .page-toolbar #item-chat-list ul li a { font-weight: bold; color: #fff; } .page-toolbar #item-chat-list ul li a:hover { background-color: #03437e !important; } @media screen and (min-width: 768px) { .page-toolbar #item-chat-list ul .separator { margin-left: 15px; width: 80%; background: url(../img/sprite-page-toolbar-separator.png); } } .page-toolbar .separator { height: 2px; background: url(../img/sprite-page-toolbar-separator.png) no-repeat; background-position: center center; } #page-toolbar-after-login .item { float: left; width: 25%; } @media (min-width: 768px) { #page-toolbar-after-login .item { float: none; width: 100%; } } #hkt-navbar-collapse.nav-footer { margin-bottom: 5px; } #hkt-navbar-collapse.nav-footer .navbar-nav { padding: 0 15px; } #hkt-navbar-collapse.nav-footer .navbar-nav li .item-text { padding-left: 24px; } #hkt-navbar-collapse.nav-footer .navbar-nav li .glyphicon-chevron-right { text-align: left; width: 33px; } #hkt-navbar-collapse.nav-footer .navbar-nav li.footer-back-to-top a { text-align: center; } #hkt-navbar-collapse.nav-footer .navbar-nav li.footer-back-to-top a .glyphicon { display: inline; float: none; line-height: 1; } #hkt-navbar-collapse.nav-footer #page-toolbar-after-login-footer .item { width: 50%; } @media (min-width: 768px) { #hkt-navbar-collapse.nav-footer #page-toolbar-after-login-footer .item { width: 100%; } } #page-footer { line-height: 30px; } @media (min-width: 768px) and (max-width: 991px) { #page-footer { margin-left: 20px; margin-right: 20px; } } #page-footer #copyright { color: #8b9295; font-size: 110%; line-height: 1.4; padding: 8px 15px; } @media (min-width: 768px) { #page-footer #copyright { padding: 8px 0; } } @media (min-width: 768px) { #page-footer .footer-row { border-top: 2px solid #ccc; /*padding-top: 20px;*/ padding: 20px 0; } } #footer-navbar { padding-top: 1px; padding-bottom: 1px; margin: 0; background: #03437e; } @media (min-width: 768px) { #footer-navbar { background: transparent; padding-left: 0; } } @media (min-width: 768px) { #footer-navbar li { display: inline-block; padding: 0; } #footer-navbar li.separator { margin: 0 12px; } } #footer-navbar a { color: #cccccc; font-size: 120%; } @media (min-width: 768px) { #footer-navbar a { color: #3c91cd; font-size: 110%; } } @media (min-width: 768px) { #footer-site-logo { padding-right: 0; } } /** * Shared elements */ .dropdown { position: relative; } .dropdown .dropdown-menu { width: 100%; } .dropdown .dropdown-icon { background: url(../img/arrow-dropdown-11x6.png) right center no-repeat; position: absolute; top: 0; right: 15px; width: 11px; height: 100%; } .dropdown-corner-fix .dropdown-toggle, .dropdown-corner-fix .dropdown-toggle:focus, .dropdown-corner-fix .dropdown-toggle:hover { background-color: #fff !important; } .dropdown-corner-fix .dropdown-toggle { position: relative; -webkit-appearance: none; outline: none; } .dropdown-corner-fix .border-top-left, .dropdown-corner-fix .border-top-right, .dropdown-corner-fix .border-bottom-left, .dropdown-corner-fix .border-bottom-right { background: url(../img/sprite-round-corners.png) no-repeat #eef3f9; position: absolute; width: 10px; height: 10px; } .dropdown-corner-fix .border-top-left, .dropdown-corner-fix .border-top-right { top: 0; } .dropdown-corner-fix .border-bottom-left, .dropdown-corner-fix .border-bottom-right { bottom: 0; } .dropdown-corner-fix .border-top-left, .dropdown-corner-fix .border-bottom-left { left: 0; } .dropdown-corner-fix .border-top-right, .dropdown-corner-fix .border-bottom-right { right: 0; } .dropdown-corner-fix .border-top-left { background-position: 0 0; } .dropdown-corner-fix .border-top-right { background-position: -20px 0; } .dropdown-corner-fix .border-bottom-left { background-position: 0 -20px; } .dropdown-corner-fix .border-bottom-right { background-position: -20px -20px; } .breadcrumb { margin: 0; padding: 10px 0; font-size: 110%; border: 0; } .breadcrumb > li + li:before { font-weight: normal; padding: 0 10px; } .breadcrumb .active { font-weight: bold; } .carousel-slider .carousel-indicators { bottom: -5px; } .carousel-slider .carousel-indicators li { background: url(../img/carousel-indicator-xs.png) left center no-repeat; width: 8px; height: 8px; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } @media screen and (min-width: 768px) { .carousel-slider .carousel-indicators li { background: url(../img/carousel-indicator.png) left center no-repeat; width: 16px; height: 16px; } } .carousel-slider .carousel-indicators li.active { background-position: -9px 0; } @media screen and (min-width: 768px) { .carousel-slider .carousel-indicators li.active { background-position: -18px 0; } } .carousel-slider .carousel-inner { background-color: #e0e0e0; } .carousel-slider .carousel-inner img { width: 100%; } .carousel-slider .carousel-control { margin: auto; width: 25px; height: 25px; background: none; background-color: #fff; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); opacity: 0.4; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control { width: 41px; height: 41px; } } .carousel-slider .carousel-control .glyphicon-chevron-left { left: 60%; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control .glyphicon-chevron-left { left: 45%; } } .carousel-slider .carousel-control .glyphicon-chevron-right { right: 65%; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control .glyphicon-chevron-right { right: 55%; } } .carousel-slider .carousel-control span { color: #808285; line-height: 0; font-size: 13px; } @media screen and (min-width: 768px) { .carousel-slider .carousel-control span { line-height: 29px; font-size: 18px; } } /* ELEMENT - WELCOME MESSAGE */ .welcome-message, .welcome-message > * { line-height: 24px; } @media (min-width: 768px) { .welcome-message, .welcome-message > * { line-height: 33px; } } .welcome-message > * { vertical-align: middle; } .welcome-message { float: right; width: 100%; padding: 4px 0 8px; } @media (min-width: 768px) { .welcome-message { float: none; padding: 0; position: absolute; top: -120px; right: 10px; } } .welcome-message h3, .welcome-message .user-name { font-size: 12px; } @media (min-width: 768px) { .welcome-message h3, .welcome-message .user-name { font-size: 16px; } } .welcome-message h3 { float: left; margin: 0 4px 0 0; color: #006ea5; } .welcome-message .user-icon { height: 14px; margin: 4px 6px 0 0; } @media (min-width: 768px) { .welcome-message .user-icon { height: 20px; margin: 6px 10px 0 0; } } .welcome-message .user-name { color: #666; } .welcome-message .btn-logout { margin: 0 0 0 10px; } @media (min-width: 768px) { .welcome-message .btn-logout { margin-left: 20px; } } .welcome-message .btn-logout img { float: left; height: 24px; } @media (min-width: 768px) { .welcome-message .btn-logout img { height: 33px; } } .navbar-header .welcome-message { display: none; } @media (min-width: 768px) { .navbar-header .welcome-message { top: 26px; display: block; } } @media (min-width: 768px) { .page-content-wrap .welcome-message { display: none; } } .page-search-bar { background-color: #ebebeb; } .page-search-bar #pageSearchForm { overflow: hidden; margin: 4px 0 4px 8px; } @media (min-width: 768px) { .page-search-bar #pageSearchForm { margin: 10px 0 10px 10px; } } .page-search-bar #pageSearchForm .form-group { margin-bottom: 0; width: 70%; } .page-search-bar #pageSearchForm input { background-color: #fff; border: 0 none; height: 20px; padding-top: 1px; padding-bottom: 1px; color: #666; } .page-search-bar #pageSearchForm input::-webkit-input-placeholder { color: #666; } .page-search-bar #pageSearchForm input:-moz-placeholder { color: #666; } .page-search-bar #pageSearchForm input::-moz-placeholder { color: #666; } .page-search-bar #pageSearchForm input:-ms-input-placeholder { color: #666; } @media (min-width: 768px) { .page-search-bar #pageSearchForm input { height: 28px; padding-top: 3px; padding-bottom: 3px; } } .page-search-bar #pageSearchForm input[type=text] { padding-left: 5px; width: 100%; } .page-search-bar #pageSearchForm input[type=submit] { width: 20px; background: url(../img/btn-mag-glass-r1.png) no-repeat white; background-position: 3px 3px; } @media (min-width: 768px) { .page-search-bar #pageSearchForm input[type=submit] { width: 28px; background-position: 3px -20px; } } .nav-tabs { border: 0 none; padding: 0 8px; } @media (min-width: 768px) { .nav-tabs { border-bottom: 3px solid #a6bcc9; padding: 0 0 0 2px; } } .nav-tabs li { width: 100%; margin-bottom: 5px; } @media (min-width: 768px) { .nav-tabs li { width: auto; margin-bottom: -1px; } } .nav-tabs li a { color: #fff; font-size: 16px; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; margin-right: 0px; padding: 5px 15px; } @media (min-width: 768px) { .nav-tabs li a { margin-right: 2px; } } @media (min-width: 992px) { .nav-tabs li a { padding: 5px 30px; } } .nav-tabs > li > a, .nav-tabs > li > a:hover, .nav-tabs > li > a:focus { color: #fff; background-color: #a6bcc9; border-color: #a6bcc9; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: #006ea5; border-color: #006ea5; } .nav-tabs li .tab-indicator { background: url(../img/arrow-7x13.png) center center no-repeat; width: 13px; height: 13px; display: none; vertical-align: middle; } @media (min-width: 768px) { .nav-tabs li .tab-indicator { display: inline-block; margin: 0 0 3px 10px; } } .nav-tabs li.active .tab-indicator { background: url(../img/grey-down-arrow-7x13.png) center center no-repeat; } @media (min-width: 768px) { .nav-tabs li.link-pull-right { float: right; } } .nav-tabs li.link-pull-right a, .nav-tabs li.link-pull-right a:hover { border-color: #a6bcc9; background-color: #fff; color: #666; } @media (min-width: 768px) { .nav-tabs li.link-pull-right a, .nav-tabs li.link-pull-right a:hover { border-bottom: 3px; padding-left: 17px; padding-right: 17px; } } .nav-tabs li.link-pull-right .tab-indicator { background: url(../img/arrow-blue-6x11.png) center center no-repeat; } .modal-dialog .close { background: url(/assets/HKTCorpsite/img/modal-close-btn.png) right -58px no-repeat transparent; color: #fff; font-size: 14px; padding: 2px 22px 2px 2px; margin-bottom: 2px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; text-shadow: none; text-decoration: none; } .modal-dialog .modal-content { background-color: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .modal-dialog #modal-loading-bar { display: block; margin: 30px auto; } .pagination { /** * See 'Pagination' section of bootstrap/_variables.scss */ } @media (min-width: 768px) { .pagination { text-align: center; } } /* ------------------------------ BOX TEMPLATE (recommended for you, SMEs, Enterprise, Products and solutions) ------------------------------ */ .box-wrapper { padding: 0 15px; } .box-wrapper .box-item { padding: 0 2px; position: relative; margin-bottom: 10px; } @media (min-width: 768px) { .box-wrapper .box-item { padding: 0 10px; margin-bottom: 20px; } } .box-wrapper .box-content { position: relative; } .box-wrapper .box-link { text-decoration: none; outline: none; display: block; } .box-wrapper .box-cover-photo img { width: 100%; } .box-wrapper .box-link-label { font-size: 11px; color: #03437e; padding-left: 10px; padding: 8px 0 8px 10px; position: relative; } .box-wrapper .box-link-label > .r-arrow { color: #1d8fe3; position: absolute; right: 10px; top: 7px; font-size: 14px; } @media (min-width: 768px) { .box-wrapper .box-link-label > .r-arrow { top: 10px; } } @media (min-width: 768px) { .box-wrapper .box-link-label { font-size: 16px; } } .box-wrapper .border-content-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; } .box-wrapper .border-top-left, .box-wrapper .border-top-right, .box-wrapper .border-bot-left, .box-wrapper .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; position: absolute; } .box-wrapper .border-top-left { background-position: 0 0; top: 0; left: 0; } .box-wrapper .border-top-right { background-position: -10px 0; top: 0; right: 0; } .box-wrapper .border-bot-left { background-position: 0 -10px; bottom: 0; left: 0; } .box-wrapper .border-bot-right { background-position: -10px -10px; bottom: 0; right: 0; } @media (min-width: 768px) { .box-wrapper { padding: 0 40px; margin-top: 30px; } } @media (min-width: 992px) { .box-wrapper { padding: 0 10px; } } .box .box-row-wrapper { margin: 0; position: relative; z-index: 1; } .box .box-row-wrapper .title a { display: block; border-bottom: 2px solid #178be2; padding-bottom: 5px; position: relative; z-index: 3; } .box .box-row-wrapper .title a .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; width: 6px; height: 11px; display: inline-block; position: absolute; top: 10px; right: 20px; } @media screen and (min-width: 768px) { .box .box-row-wrapper .title a .link-icon { display: none; } } .box .box-row-wrapper .content { margin-top: 15px; } .box .box-row-wrapper .content h2 { font-size: 100%; margin: 0 0 5px 0; } @media screen and (min-width: 768px) { .box-cta-wrapper { padding: 0 30px; } } @media screen and (min-width: 992px) { .box-cta-wrapper { padding: 0 5px; } } .box-cta-wrapper .box-item { margin: 0; padding: 0; } @media screen and (min-width: 768px) { .box-cta-wrapper .box-item { padding: 10px; } } .box-cta-wrapper .box-line { border-top: 2px solid #178be2; } .box-cta-wrapper .box-link-label { color: #03437e; text-decoration: none; padding: 13px 10px; font-size: 160%; } @media screen and (min-width: 768px) { .box-cta-wrapper .box-link-label { font-size: 20px; padding: 13px 15px; } } .box-cta-wrapper .box-link-label .link-label { width: 90%; float: left; } @media screen and (min-width: 768px) { .box-cta-wrapper .box-link-label .link-label { line-height: 1; } } .box-cta-wrapper .box-link-label .link-icon { background: url(../img/arrow-blue-6x11.png) center center no-repeat transparent; width: 13px; height: 13px; margin-top: 5px; float: right; /*@media screen and (min-width: $screen-sm) { margin-top: 9px; }*/ } .box-cta-wrapper .box-link-label .link-icon.link-icon-new-window { background: url(../img/icon-new-window-13x13.png) center center no-repeat transparent; } /* ------------------------------ DOWNLOAD ------------------------------ */ #chat a, #download a, #coverage-map a { color: #03437e; text-decoration: none; line-height: 48px; padding: 5px 0; display: block; overflow: hidden; } @media screen and (min-width: 768px) { #chat a, #download a, #coverage-map a { padding: 20px 3px 10px 0; } } @media screen and (min-width: 992px) { #chat a, #download a, #coverage-map a { padding-top: 13px; } } #chat a .icon, #chat a .title, #download a .icon, #download a .title, #coverage-map a .icon, #coverage-map a .title { float: left; } #chat a .icon, #download a .icon, #coverage-map a .icon { width: 48px; } #chat a .title, #download a .title, #coverage-map a .title { font-size: 17px; padding-left: 15px; } #chat a .link-icon, #download a .link-icon, #coverage-map a .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; font-size: 14px; float: right; width: 6px; height: 48px; margin-right: 14px; } @media screen and (min-width: 768px) { #chat a .link-icon, #download a .link-icon, #coverage-map a .link-icon { margin-right: 0; } } #chat a .link-icon-new-window, #download a .link-icon-new-window, #coverage-map a .link-icon-new-window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; width: 13px; height: 13px; margin-right: 10px; font-size: 14px; float: right; display: inline-block; margin-top: 17px; margin-left: 5px; } @media screen and (min-width: 768px) { #chat a .link-icon-new-window, #download a .link-icon-new-window, #coverage-map a .link-icon-new-window { margin-right: 0; } } #recommend .title h2 { color: #006ea5; } /* ------------------------------ TAILORED SOLUTIONS ------------------------------ */ #recommend, #tailored-solutions { margin-top: 20px; padding: 0; color: #666; } @media screen and (min-width: 768px) { #recommend, #tailored-solutions { padding: 0 5px; } #recommend span, #tailored-solutions span { color: #015db1; padding-right: 5px; } } @media screen and (min-width: 992px) { #recommend, #tailored-solutions { margin-top: 15px; } } #recommend > div, #tailored-solutions > div { padding: 0; } #recommend .title, #tailored-solutions .title { /*padding: 0 0 15px 26%;*/ padding-bottom: 15px; text-align: center; font-size: 170%; color: #333; } @media screen and (min-width: 768px) { #recommend .title, #tailored-solutions .title { /*padding: 0;*/ padding-bottom: 0; text-align: left; } } #recommend .solution a, #recommend .product a, #tailored-solutions .solution a, #tailored-solutions .product a { color: #666; text-decoration: none; font-size: 140%; } #recommend .solution .link-icon, #recommend .product .link-icon, #tailored-solutions .solution .link-icon, #tailored-solutions .product .link-icon { color: #1d8fe3; } #recommend .solution .link-icon-new-window, #recommend .product .link-icon-new-window, #tailored-solutions .solution .link-icon-new-window, #tailored-solutions .product .link-icon-new-window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; width: 13px; height: 13px; display: inline-block; margin-right: 7px; } @media screen and (min-width: 768px) { #recommend .product a, #tailored-solutions .product a { padding-left: 17px; background: url(../img/arrow-bullet.png) left center no-repeat; } } #recommend .line, #tailored-solutions .line { padding: 0; margin: 7px 0; } @media screen and (min-width: 768px) { #recommend .line, #tailored-solutions .line { padding: 0 5px; } } #recommend .line .divider, #tailored-solutions .line .divider { /*margin: 0;*/ width: 100%; height: 1px; background-color: #dadada; } /* ------------------------------ SPINNER ELEMENT ------------------------------ */ .spinner { position: relative; } .spinner input { border: 0; height: 20px; background-color: #fff; background: url(../img/spinner-gradiant-bg.png) no-repeat; padding-left: 10px; float: left; color: #666; } .spinner .btn-wrapper { float: left; width: 21px; height: 22px; position: relative; background: url(../img/spinner-btn-bg.png) no-repeat; } .spinner .select-up, .spinner .select-down { width: 18px; height: 8px; float: left; background-color: transparent; border: 0; font-size: 8px; padding: 0; color: #000; } /* Batch 2 Elements*/ .online-enquiry-form form .blue-box { font-size: 12px; background-color: #eef3f9; overflow: hidden; } .online-enquiry-form form .blue-box h4 { padding-top: 10px; padding-bottom: 15px; } .online-enquiry-form form .blue-box .radio .label-wrapper { margin: 0; } .online-enquiry-form form .blue-box .radio input[type="radio"] { margin-top: 0; } .online-enquiry-form form .blue-box select { width: 100%; } .online-enquiry-form form .blue-box .indicator { color: red; } .online-enquiry-form form .blue-box .form-control { border-radius: 3px; border: none; } .online-enquiry-form form .blue-box .custom-padding-r { padding-right: 4px; } .online-enquiry-form form .blue-box .custom-padding-l { padding-left: 4px; } .online-enquiry-form form .blue-box .btnz-group { /*float: right;*/ /*@media screen and (min-width: $screen-sm) { float: none; }*/ } .online-enquiry-form form .blue-box .btnz-group a { /* buttons spacing */ margin-left: 10px; } .online-enquiry-form form .blue-box .btnz-group a .btn-image { height: 30px; width: 101px; } .online-enquiry-form form .blue-box .btnz-group input[type=submit].submit-form-btn { margin-left: 10px; display: block; width: 101px; height: 30px; border: none; background: url(../img/submit-btn-101x30.png) right top no-repeat; } .online-enquiry-form form .blue-box textarea { resize: none; } .online-enquiry-form form .blue-box .privacy-statement { /*@media screen and (min-width: $screen-sm) { text-align: right; } @media screen and (min-width: $screen-md) { padding-top: 30px; padding-bottom: 20px; } @media screen and (min-width: '697px') and (width: '698px') { text-align: right; padding-top: 30px; padding-bottom: 20px; }*/ } .online-enquiry-form form .blue-box .privacy-statement.text { text-align: right; padding-top: 30px; padding-bottom: 20px; } .online-enquiry-form form .blue-box .privacy-statement span.link-label { padding-top: 1px; padding-left: 15px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; color: #666; } .online-enquiry-form form .blue-box .privacy-statement span.link-label:hover { border: none; } .online-enquiry-form form .blue-box .tip { padding-bottom: 20px; } .online-enquiry-form form .blue-box .form-label { margin-top: 5px; } .online-enquiry-form form .blue-box .col-2 { margin-top: 10px; /*@media screen and (min-width: '697px') and (max-width: '698px') { width: 16.66667%; }*/ } .online-enquiry-form form .blue-box .col-2.wid-02 { width: 16.66667%; } .online-enquiry-form form .blue-box .col-3 { /*@media screen and (min-width: '697px') and (max-width: '698px') { width: 25%; }*/ } .online-enquiry-form form .blue-box .col-3.wid-03 { width: 25%; } .online-enquiry-form form .blue-box .col-4 { /*@media screen and (min-width: '697px') and (max-width: '698px') { width: 33.33333%; }*/ } .online-enquiry-form form .blue-box .col-4.wid-04 { width: 33.33333%; } .online-enquiry-form form .blue-box .col-5 { /*@media screen and (min-width: '697px') and (max-width: '698px') { width: 41.66667%; }*/ } .online-enquiry-form form .blue-box .col-5.wid-05 { width: 41.66667%; } .online-enquiry-form form .blue-box .col-9 { /*@media screen and (min-width: '697px') and (max-width: '698px') { width: 75%; }*/ } .online-enquiry-form form .blue-box .col-9.wid-09 { width: 75%; } .online-enquiry-form form .blue-box .col-9.radio { margin-top: 0; } .product-feature-list ul { list-style-image: url("../img/bullet-feature.png"); } .sidebar-links .header { color: #000; font-size: 140%; } @media screen and (min-width: 992px) { .sidebar-links .header { padding-top: 0; } } .sidebar-links .line { height: 1px; background-color: #dadada; } .sidebar-links .item-list .item { font-size: 140%; } .sidebar-links .item-list .item a { color: #666; } .app-list-wrapper .application-list .application-wrapper .application img { margin: auto; } .app-list-wrapper .application-list .application-wrapper .application .name { color: #a9a9a9; } .app-list-wrapper .more-applications div .text { color: #666; } .service-store-box { position: relative; /* -- CARD BORDERS -- */ } .service-store-box .wrapper { position: relative; z-index: 3; } .service-store-box .wrapper .image { position: absolute; top: 0; bottom: 0; right: 0; height: 30px; margin: auto; } .service-store-box .text a { color: #03437e; font-size: 170%; } .service-store-box a .icon { width: 30px; height: 30px; } .service-store-box .border-content-card, .service-store-box .border-top-left, .service-store-box .border-top-right, .service-store-box .border-bot-left, .service-store-box .border-bot-right { position: absolute; } .service-store-box .border-top-left, .service-store-box .border-top-right, .service-store-box .border-bot-left, .service-store-box .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; } .service-store-box .border-content-card, .service-store-box .border-top-left, .service-store-box .border-top-right { top: 0; } .service-store-box .border-bot-left, .service-store-box .border-bot-right { bottom: -11; } .service-store-box .border-content-card, .service-store-box .border-top-left, .service-store-box .border-bot-left { left: 0; } .service-store-box .border-top-right, .service-store-box .border-bot-right { right: 0; } .service-store-box .border-content-card { width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; } .service-store-box .border-top-left { background-position: 0 0; } .service-store-box .border-top-right { background-position: -10px 0; } .service-store-box .border-bot-left { background-position: 0 -10px; } .service-store-box .border-bot-right { background-position: -10px -10px; } /* ------------------------------ SERVICE PLAN BOX ------------------------------ */ .service-box { margin-bottom: 20px; } .service-box .service-box-wrapper { position: relative; padding: 15px 15px 20px 15px; } .service-box .service-box-wrapper .header { border-bottom: 2px solid #178be2; } .service-box .service-box-wrapper .header h2 { font-size: 170%; color: #03437e; margin: 10px 0; } @media screen and (min-width: 768px) { .service-box .service-box-wrapper .header h2 { font-size: 180%; } } .service-box .service-box-wrapper .header img { margin-bottom: 10px; width: auto; position: relative; z-index: 4; } .service-box .service-box-wrapper .content { margin-bottom: 20px; position: relative; z-index: 3; } .service-box .service-box-wrapper .content h2 { font-size: 120%; margin: 15px 0 5px 0; } .service-box .service-box-wrapper .content ul { padding-left: 15px; } .service-box .service-box-wrapper .content ul li { margin-bottom: 5px; } .service-box .service-box-wrapper .content p { font-size: 120%; } @media screen and (min-width: 768px) { .service-box .service-box-wrapper .content h2, .service-box .service-box-wrapper .content ul, .service-box .service-box-wrapper .content p { font-size: 140%; } } .service-box .service-box-wrapper .link { border-top: 1px solid #ccc; padding: 5px 10px; border-bottom: 1px solid #ccc; position: relative; z-index: 5; } .service-box .service-box-wrapper .link a { display: block; outline: none; text-decoration: none; font-weight: bold; font-size: 120%; color: #666; position: relative; } .service-box .service-box-wrapper .link .text { padding-right: 10px; } @media screen and (min-width: 768px) { .service-box .service-box-wrapper .link .text { font-size: 120%; } } .service-box .service-box-wrapper .link .link-icon { display: inline-block; width: 13px; height: 13px; background: url(../img/icon-new-window-13x13.png) no-repeat; position: absolute; top: 3px; } .service-box .service-box-wrapper .link .link-icon.arrow { background: url(../img/arrow-blue-6x11.png) right center no-repeat; } .service-box .service-box-wrapper .button { margin-top: 20px; } .service-box .service-box-wrapper .button a { display: block; outline: none; text-align: center; position: relative; z-index: 10; } .service-box .service-box-wrapper .button a img { height: 30px; width: auto; } .service-box .border-top-left, .service-box .border-top-right, .service-box .border-bot-left, .service-box .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; position: absolute; } .service-box .border-content-box { width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; position: absolute; left: 0; top: 0; } .service-box .border-top-left { background-position: 0 0; left: 0; top: 0; } .service-box .border-top-right { background-position: -10px 0; top: 0; right: 0; } .service-box .border-bot-left { background-position: 0 -10px; left: 0; bottom: 0; } .service-box .border-bot-right { background-position: -10px -10px; right: 0; bottom: 0; } /* ------------------------------ INFO BLOCK ELEMENT ------------------------------ */ .info-block-container { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; margin-bottom: 15px; } .info-block { margin: 0; padding: 15px 0 5px 0; } .info-block .header h2 { margin: 0 0 5px 0; font-size: 120%; } @media (min-width: 768px) { .info-block .header h2 { font-size: 140%; } } .info-block .header img { width: auto; margin-bottom: 10px; } .info-block .content h2 { font-size: 120%; margin: 0 0 5px 0; } .info-block .content ul { padding-left: 15px; } .info-block .content img { width: auto; max-width: 100%; margin-bottom: 10px; } @media (min-width: 768px) { .info-block .content { font-size: 140%; } } .info-block.lighter-grey { background-color: #f5f5f5; } /* ------------------------------ ELEMENT - SIDBAR BOX ------------------------------ */ .box-sidebar .box-row-wrapper { margin: 0; padding: 0 15px; } .box-sidebar .box-row-wrapper .title { padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #ccc; position: relative; z-index: 3; } .box-sidebar .box-row-wrapper .title h2 { font-size: 160%; color: #333; margin: 0; } @media (min-width: 768px) { .box-sidebar .box-row-wrapper .title h2 { font-size: 180%; } } .box-sidebar .box-row-wrapper .content { margin-top: 10px; padding: 0; font-size: 140%; } .box-sidebar .box-row-wrapper .content ul { padding-left: 0; list-style: none; } .box-sidebar .box-row-wrapper .border-content-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; } .box-sidebar .box-row-wrapper .border-top-left, .box-sidebar .box-row-wrapper .border-top-right, .box-sidebar .box-row-wrapper .border-bot-left, .box-sidebar .box-row-wrapper .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; position: absolute; } .box-sidebar .box-row-wrapper .border-top-left { background-position: 0 0; top: 0; left: 0; } .box-sidebar .box-row-wrapper .border-top-right { background-position: -10px 0; top: 0; right: 0; } .box-sidebar .box-row-wrapper .border-bot-left { background-position: 0 -10px; bottom: 0; left: 0; } .box-sidebar .box-row-wrapper .border-bot-right { background-position: -10px -10px; bottom: 0; right: 0; } /* ------------------------------ ELEMENT - ACCOUNT DETAIL ------------------------------ */ .account-detail .header h2 { font-size: 170%; color: #03437e; margin: 10px 0; } .account-detail .header img { width: auto; } .account-detail .header a { display: block; text-decoration: none; } .account-detail .detail { font-size: 120%; margin-top: 25px; } .account-detail .detail .detail-row { padding-bottom: 10px; overflow: hidden; } @media (min-width: 768px) { .account-detail .detail .detail-row { padding-bottom: 0; } } .account-detail .detail .detail-row label { width: 15%; min-width: 90px; margin-right: 20px; float: left; } @media (min-width: 768px) { .account-detail .detail .detail-row label { min-width: 115px; } } .account-detail .detail .detail-row .value { float: left; } @media (min-width: 768px) { .account-detail .detail { font-size: 140%; } } /* ------------------------------ ELEMENT - BILLING LINKS ------------------------------ */ .billing-links-box { margin: 0; } .billing-links-box .col-left, .billing-links-box .col-right { padding: 0; } .billing-links-box .billing-row { padding: 8px 10px; border-bottom: 1px solid #dadada; } .billing-links-box .billing-row a { font-size: 140%; display: block; color: #666; text-decoration: none; } .billing-links-box .billing-row .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; width: 13px; height: 13px; display: inline-block; margin-right: 15px; } @media screen and (min-width: 768px) { .billing-links-box .billing-row .link-icon.window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; } } @media screen and (min-width: 768px) { .billing-links-box .billing-row { padding: 3px 0; border-bottom: 0; } } .page-detail { font-size: 120%; } @media (min-width: 768px) { .page-detail { font-size: 140%; } } .download-application-mobile { position: relative; } .download-application-mobile a .text { color: #03437e; font-size: 140%; } .download-application-mobile a .arrow-right { position: absolute; top: 33.33333%; right: 15px; } .service-store-box-mobile .text a { color: #03437e; font-size: 170%; } .service-store-box-mobile .icon { width: 29px; height: 29px; } .product-image img { display: block; margin: 5px auto; } /*@import 'ele-page-logo';*/ .channel-info .header { color: #03437e; font-size: 140%; } .channel-info .information-list ul { margin-bottom: 0; } /*@import 'ele-unbordered-box';*/ .contact-details .name { color: #002c71; } .contact-links a { color: #666; } .contact-links .link-image-wrapper { padding-top: 1px; } @media screen and (min-width: 768px) { .contact-links .link-label-wrapper { padding-left: 0; } } .contact-links .header { color: #002c71; } .media-list-box .media-link-wrapper .image-wrapper a { position: relative; display: block; height: 25px; } .media-list-box .media-link-wrapper .image-wrapper img { min-width: 16px; width: 16px; height: auto; } .media-list-box .media-link-wrapper .image-wrapper .mp4-icon { width: 19px; } .media-list-box .media-link-wrapper .image-wrapper .pdf-icon { height: auto; } @media screen and (min-width: 768px) { .media-list-box .media-link-wrapper .image-wrapper { margin-left: 20px; } } .media-list-box .media-link-wrapper .date a, .media-list-box .media-link-wrapper .detail a { color: #666; } @media screen and (min-width: 768px) { .media-list-box .media-link-wrapper .detail { margin-top: -18px; } } @media screen and (min-width: 992px) { .media-list-box .media-link-wrapper .detail { padding-left: 16%; } } /* MEDIA LIST WITH TITLE */ .media-list-box-with-title .media-link-wrapper { margin-top: 15px; } .media-list-box-with-title .media-link-wrapper:first-child { margin-top: 35px; } .media-list-box-with-title .media-link-wrapper .font-media-list-detail { color: inherit; } .media-list-box-with-title .media-link-wrapper .font-media-list-detail .guide-title { font-weight: bold; } .share-performance .header { border-bottom: 2px solid #13598E; } .share-performance .header h2 { font-size: 170%; color: #03437e; } @media screen and (min-width: 768px) { .share-performance .header h2 { font-size: 180%; } } @media (min-width: 768px) { .share-performance .stock { padding-left: 15px; padding-right: 15px; } } .share-performance .stock .stock-name, .share-performance .stock .stock-code { font-size: 160%; } @media screen and (min-width: 768px) { .share-performance .stock .stock-name, .share-performance .stock .stock-code { font-size: 150%; } } .share-performance .current-rate { position: relative; } @media (min-width: 768px) { .share-performance .current-rate { padding-left: 15px; padding-right: 15px; } } .share-performance .current-rate .currency-symbol { position: absolute; top: 20%; font-size: 180%; } @media screen and (min-width: 768px) { .share-performance .current-rate .currency-symbol { font-size: 160%; } } .share-performance .current-rate .currency-label { font-size: 170%; } @media screen and (min-width: 768px) { .share-performance .current-rate .currency-label { font-size: 150%; } } .share-performance .current-rate .amount { color: #000; font-size: 680%; } @media screen and (min-width: 768px) { .share-performance .current-rate .amount { font-size: 560%; } } .share-performance .inflation-rate { color: #fff; font-size: 220%; font-weight: bold; background-color: #008000; } @media screen and (min-width: 768px) { .share-performance .inflation-rate { font-size: 190%; } } .share-performance .rate-detail .rate-label, .share-performance .rate-detail .rate { font-size: 120%; } @media screen and (min-width: 768px) { .share-performance .rate-detail .rate-label, .share-performance .rate-detail .rate { font-size: 140%; } } .share-performance .rate-detail .rate { font-weight: bold; } .related-links-list .header h2 { color: #03437e; font-size: 170%; } @media screen and (min-width: 768px) { .related-links-list .header h2 { font-size: 180%; } } .related-links-list .arrow-bullet { padding-top: 2px; } .related-links-list a { color: #666; position: relative; z-index: 10; } .investor-relations { /* -- Right menu css -- */ } .investor-relations .line { height: 1px; background-color: #dadada; } .investor-relations #menu { padding: 0; color: #666; font-size: 14px; /* -- Bootstrap collaspe css -- */ } .investor-relations #menu .item { margin: 10px; overflow: hidden; } @media (min-width: 768px) { .investor-relations #menu .item { margin: 0; } } @media (min-width: 992px) { .investor-relations #menu .item { margin: 10px; } } .investor-relations #menu .item a { color: #666; text-decoration: none; } .investor-relations #menu .item-img { padding: 0 0; width: 5%; } @media (min-width: 768px) { .investor-relations #menu .item-img { padding-left: 10px; } } @media (min-width: 992px) { .investor-relations #menu .item-img { padding: 0 0; } } .investor-relations #menu .item-text { padding: 0 0; margin-top: 1px; } @media (min-width: 768px) { .investor-relations #menu .item-text { padding-left: 10px; } } @media (min-width: 992px) { .investor-relations #menu .item-text { padding: 0 0; } } .investor-relations #menu ul.menu-list { list-style-type: none; } .investor-relations #menu .border-side { padding: 0 0; height: 40px; width: 9px; } .investor-relations #menu .border-left { padding: 0 0; width: 3%; } .investor-relations #menu .border-mid { width: 94%; background-image: url("../img/border-mid.png"); background-size: auto 40px; padding: 12px 0; height: 40px; } @media (min-width: 768px) { .investor-relations #menu .border-mid { background-image: none; background-size: 0 0; height: auto; } } .investor-relations #menu .border-right { padding: 0 0; width: 3%; } @media (min-width: 768px) { .investor-relations #menu .menu-title { margin: 30px 0 10px 0; padding: 0 25px; font-size: 20px; color: #000; } } .investor-relations #menu .menu-title .arrow { padding-top: 5px; width: 13px; } .investor-relations #menu .panel { margin: 5px 20px; } .investor-relations #menu .panel-title { font-size: 14px; color: #666; background-color: auto; margin: 0 0; } .investor-relations #menu .panel-body { padding: 0; margin: 0 20px; font-size: 14px; } @media (min-width: 768px) { .investor-relations #menu .panel-body { margin: 0 -4px; } } .investor-relations #menu .panel-heading { padding: 0 0; } .media-list-box-plain .media-link-wrapper .image-wrapper img { min-width: 16px; width: 16px; height: auto; } .media-list-box-plain .media-link-wrapper .image-wrapper .mp4-icon { width: 19px; } .media-list-box-plain .media-link-wrapper .detail a { color: #666; } .media-list-box-with-image .header { color: #03437e; } .management-structure .header { color: #03437e; font-size: 160%; border-bottom: 2px solid #13598E; padding-bottom: 5px; margin-bottom: 15px; } @media screen and (min-width: 768px) { .management-structure .header { font-size: 180%; margin-bottom: 20px; } } .management-structure section .header { font-size: 120%; color: #666; border: none; margin-bottom: 0; margin-top: 15px; padding-bottom: 0; } @media screen and (min-width: 768px) { .management-structure section .header { margin-top: 20px; font-size: 140%; } } .management-structure section .structure-image { margin-top: 15px; } .management-structure section .structure-image img { display: block; margin: auto; max-width: 100%; } .management-structure section .structure-image .structure-note { font-size: 90%; color: #999; padding-bottom: 25px; text-align: center; } @media screen and (min-width: 768px) { .management-structure section .structure-image .structure-note { font-size: 120%; } } @media screen and (min-width: 768px) { .management-structure section .structure-image { margin-top: 20px; } } .management-structure #group-detail .modal-dialog { margin: 150px 25px 25px; min-width: 270px; } @media screen and (min-width: 768px) { .management-structure #group-detail .modal-dialog { margin: 150px auto auto; } } .management-structure #group-detail .modal-dialog .modal-content .block-header, .management-structure #group-detail .modal-dialog .modal-content .box-with-link h2, .box-with-link .management-structure #group-detail .modal-dialog .modal-content h2 { padding-top: 3px; padding-bottom: 2px; } .media-list-box-date-head .media-link-wrapper { padding: 5px 0; } .media-list-box-date-head .media-link-wrapper.lighter-blue { background-color: #bde2fd; } .content-template-list-border { border-bottom: 1px solid #dadada; } .content-template-list .title { color: #002c71; font-size: 120%; } @media (min-width: 768px) { .content-template-list .title { font-size: 140%; } } .sms-activation-form form .blue-box { background-color: #bde2fd; overflow: hidden; } @media (max-width: 768px) { .sms-activation-form form .blue-box .padding-reset { padding-left: 15px; padding-right: 15px; } } @media (max-width: 768px) { .sms-activation-form form .blue-box .padding-right-reset { padding-right: 15px; } } .sms-activation-form form .blue-box .btn-group { float: right; /*input[type=submit].submit-form-btn { margin-left: 10px; display: block; width: 101px; height: 30px; border: none; background: url(../img/submit-btn-101x30.png) right top no-repeat; }*/ } @media (min-width: 768px) { .sms-activation-form form .blue-box .btn-group { float: none; } } .sms-activation-form form .blue-box .btn-group a { /* buttons spacing */ } .sms-activation-form form .blue-box .btn-group a .btn-image { /*height: 33px; width: 115px;*/ height: 30px; width: 101px; } .sms-activation-form form .blue-box .btn-group .btn-custom a { padding: 6px 10px; } .sms-activation-form form .blue-box .btn-group .btn-custom input { padding: 6px 12px; } /* PAGES - forgot password, reset password & payment */ .page-forgot-password, .reset-password, .payment { margin-bottom: 30px; } @media screen and (min-width: 768px) { .page-forgot-password, .reset-password, .payment { padding-bottom: 40px; } } .forgot-login-form form .blue-box, .reset-password-form form .blue-box, .payment-form form .blue-box { background-color: #eef3f9; overflow: hidden; } @media (min-width: 768px) { .forgot-login-form form .blue-box .input-block > .font-form-label, .forgot-login-form form .blue-box .form .input-block > label, .form .forgot-login-form form .blue-box .input-block > label, .forgot-login-form form .blue-box .page-myhkt-registerLogin .input-block > h3, .page-myhkt-registerLogin .forgot-login-form form .blue-box .input-block > h3, .forgot-login-form form .blue-box .page-myhkt-registerLogin .input-block > .form-subtitle, .page-myhkt-registerLogin .forgot-login-form form .blue-box .input-block > .form-subtitle, .reset-password-form form .blue-box .input-block > .font-form-label, .reset-password-form form .blue-box .form .input-block > label, .form .reset-password-form form .blue-box .input-block > label, .reset-password-form form .blue-box .page-myhkt-registerLogin .input-block > h3, .page-myhkt-registerLogin .reset-password-form form .blue-box .input-block > h3, .reset-password-form form .blue-box .page-myhkt-registerLogin .input-block > .form-subtitle, .page-myhkt-registerLogin .reset-password-form form .blue-box .input-block > .form-subtitle, .payment-form form .blue-box .input-block > .font-form-label, .payment-form form .blue-box .form .input-block > label, .form .payment-form form .blue-box .input-block > label, .payment-form form .blue-box .page-myhkt-registerLogin .input-block > h3, .page-myhkt-registerLogin .payment-form form .blue-box .input-block > h3, .payment-form form .blue-box .page-myhkt-registerLogin .input-block > .form-subtitle, .page-myhkt-registerLogin .payment-form form .blue-box .input-block > .form-subtitle { padding-top: 10px; padding-bottom: 10px; } } .forgot-login-form form .blue-box .radio label, .reset-password-form form .blue-box .radio label, .payment-form form .blue-box .radio label { padding-left: 0; width: 40%; margin-right: 0; } @media screen and (min-width: 768px) { .forgot-login-form form .blue-box .radio label, .reset-password-form form .blue-box .radio label, .payment-form form .blue-box .radio label { padding-left: 20px; } } @media screen and (min-width: 768px) { .forgot-login-form form .blue-box .form-control + .form-note, .reset-password-form form .blue-box .form-control + .form-note, .payment-form form .blue-box .form-control + .form-note { padding-left: 0; } } .forgot-login-form form .blue-box .radio-btn, .reset-password-form form .blue-box .radio-btn, .payment-form form .blue-box .radio-btn { float: left; margin-right: 5px; width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } @media screen and (min-width: 768px) { .forgot-login-form form .blue-box .radio-label, .reset-password-form form .blue-box .radio-label, .payment-form form .blue-box .radio-label { margin-top: 0; } } .forgot-login-form form .blue-box :checked + span.radio-btn, .reset-password-form form .blue-box :checked + span.radio-btn, .payment-form form .blue-box :checked + span.radio-btn { background-position: left center; } .forgot-login-form form .blue-box label.radio-option:hover, .reset-password-form form .blue-box label.radio-option:hover, .payment-form form .blue-box label.radio-option:hover { cursor: pointer; } .forgot-login-form form .blue-box :disabled, .reset-password-form form .blue-box :disabled, .payment-form form .blue-box :disabled { color: #acacac; } .forgot-login-form form .blue-box .help a, .reset-password-form form .blue-box .help a, .payment-form form .blue-box .help a { font-weight: bold; color: #003399; } .forgot-login-form form .blue-box .help a:hover, .reset-password-form form .blue-box .help a:hover, .payment-form form .blue-box .help a:hover { color: #188ce3; border-bottom: 1px solid #188ce3; } .forgot-login-form form .blue-box .btn-group, .reset-password-form form .blue-box .btn-group, .payment-form form .blue-box .btn-group { float: right; } @media screen and (min-width: 768px) { .forgot-login-form form .blue-box .btn-group, .reset-password-form form .blue-box .btn-group, .payment-form form .blue-box .btn-group { float: none; padding-bottom: 40px; } } .forgot-login-form form .blue-box .btn-group a, .reset-password-form form .blue-box .btn-group a, .payment-form form .blue-box .btn-group a { /* buttons spacing */ margin-left: 10px; } .forgot-login-form form .blue-box .btn-group .btn-image, .reset-password-form form .blue-box .btn-group .btn-image, .payment-form form .blue-box .btn-group .btn-image { height: 30px; width: 101px; } .forgot-login-form form .blue-box .btn-group input[type=submit].confirm-form-btn, .forgot-login-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn, .reset-password-form form .blue-box .btn-group input[type=submit].confirm-form-btn, .reset-password-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn, .payment-form form .blue-box .btn-group input[type=submit].confirm-form-btn, .payment-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn { margin-left: 10px; display: block; width: 101px; height: 30px; border: none; } .forgot-login-form form .blue-box .btn-group input[type=submit].confirm-form-btn, .reset-password-form form .blue-box .btn-group input[type=submit].confirm-form-btn, .payment-form form .blue-box .btn-group input[type=submit].confirm-form-btn { background: url(../img/confirm-btn-101x30.png) right top no-repeat; } .forgot-login-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn, .reset-password-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn, .payment-form form .blue-box .btn-group input[type=submit].inactive-submit-form-btn { background: url(../img/inactive-submit-btn-101x30.png) right top no-repeat; } .forgot-login-form form .blue-box .custom-dropdown-wrapper .custom-dropdown, .reset-password-form form .blue-box .custom-dropdown-wrapper .custom-dropdown, .payment-form form .blue-box .custom-dropdown-wrapper .custom-dropdown { margin-top: 0; } .forgot-login-form form .blue-box .custom-dropdown-wrapper .custom-dropdown .dropdown, .reset-password-form form .blue-box .custom-dropdown-wrapper .custom-dropdown .dropdown, .payment-form form .blue-box .custom-dropdown-wrapper .custom-dropdown .dropdown { width: 100%; } .forgot-login-form form .blue-box .inactive-label, .reset-password-form form .blue-box .inactive-label, .payment-form form .blue-box .inactive-label { color: #bcbcbc; } /******** PAYMENT **********/ .payment-form form .blue-box :disabled { color: #666; } .payment input:disabled { color: #666; } @media screen and (min-width: 992px) { .payment .page-title { margin-bottom: 35px; } } .page-payment-content-wrap .page-toolbar-general { top: 100px; } .page-payment-content-wrap .live-chat-img { margin-top: -77px; margin-bottom: 15px; } @media screen and (min-width: 992px) { .page-payment-content-wrap .live-chat-img { left: -25%; margin-top: -95px; } } .billing-information-form form .blue-box { margin-bottom: 10px; padding-top: 15px; padding-bottom: 15px; background-color: #bde2fd; overflow: hidden; } @media (min-width: 768px) { .billing-information-form form .blue-box { margin-bottom: 5px; padding-bottom: 25px; padding-left: 5px; padding-right: 5px; } } @media (min-width: 768px) { .billing-information-form form .blue-box .dropdown { padding-bottom: 30px; } } .billing-information-form form .blue-box .dropdown button { background-color: #fff; width: 100%; text-align: left; color: #666; padding-right: 36px; } .billing-information-form form .blue-box .dropdown button .dropdown-icon { right: 30px; } .billing-information-form form .blue-box .dropdown-holder { position: relative; } .billing-information-form form .blue-box .dropdown-holder .dropdown-icon { right: 10px; } .billing-information-form form .blue-box .dropdown-holder .dropdown-menu { margin-top: 5px; } .billing-information-form form .blue-box .btn-group { float: right; margin-top: 20px; } .billing-information-form form .blue-box .btn-group.custom-input-select { margin-top: 0; } @media (min-width: 768px) { .billing-information-form form .blue-box .btn-group { float: none; } } .billing-information-form form .blue-box .btn-group a { padding-left: 10px; } .billing-information-form form .blue-box .btn-group a .btn-image { /*height: 32px; width: 100px;*/ height: 30px; width: 101px; /*@media (min-width: $screen-md){ width: 110px; }*/ } .billing-information-form form .blue-box .btn-group input[type=submit].update-form-btn { margin-left: 10px; display: block; width: 101px; height: 30px; border: none; background: url(../img/update-btn-101x30.png) right top no-repeat; } .billing-information-form form .padding-reset { padding: 0; } .billing-information-form form .control-label { margin: 0; font-weight: normal; font-size: 13px; } @media (max-width: 768px) { .billing-information-form form .margin-top-bot-10 { margin-bottom: 0; } } .bill-sample-text { color: #acacac; margin: 0px; line-height: 25px; } @media (min-width: 768px) { .bill-note { margin-bottom: 20px; } } .update-bill-information-wrapper #live-chat-img { height: 77px; width: 230px; /*background: url('../img/live-chat-image.png') no-repeat center;*/ background: url("../img/live-chat-bg-small-image.png") no-repeat center; float: right; border-bottom: 1px solid #cdcdcd; margin-top: -30px; position: relative; } .update-bill-information-wrapper #live-chat-img .chat, .update-bill-information-wrapper #live-chat-img .link { font-size: 120%; } .update-bill-information-wrapper #live-chat-img .chat { color: #fff; position: absolute; top: 19px; left: 26px; } .update-bill-information-wrapper #live-chat-img .link { position: absolute; color: #004c92; bottom: 17px; left: 16px; padding-right: 8px; background: url(../img/arrow-darkblue-4x8.png) no-repeat right; } /* ------------ BANNER -------------- */ .banner-wrapper { position: relative; } .banner-wrapper .banner-image img { width: 100%; } .banner-wrapper .banner-text { background-color: #03437e; padding: 15px; } @media (min-width: 768px) { .banner-wrapper .banner-text { position: absolute; top: 20%; left: 5%; } } .banner-wrapper .banner-text a { text-decoration: none; color: #fff; } .banner-wrapper .banner-text .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; padding-left: 15px; } /* ------------------------------ SERVICE PLAN DETAIL ELEMENT ------------------------------ */ .service-plan-info-box .header { border-bottom: 2px solid #178be2; } .service-plan-info-box .header h2 { font-size: 170%; color: #03437e; margin: 10px 0; } .service-plan-info-box .detail { margin-top: 15px; padding: 0; } .service-plan-info-box .detail h2 { margin: 15px 0 5px 0; } .service-plan-info-box .detail ul { padding-left: 15px; } .service-plan-info-box .detail h2 { font-size: 100%; } /* ------------------------------ BILLING SECTION ------------------------------ */ .billing-section { border: 10px solid #eef3f9; padding: 10px; } .billing-section .intro-text { font-size: 140%; margin-bottom: 20px; display: block; } .billing-section .billing-info-row { margin-bottom: 5px; } .billing-section .billing-info-row label, .billing-section .billing-info-row .value { font-size: 120%; } @media screen and (min-width: 768px) { .billing-section .billing-info-row label, .billing-section .billing-info-row .value { font-size: 140%; } } .billing-section .billing-info-row label { min-width: 80px; } @media screen and (min-width: 768px) { .billing-section .billing-info-row label { min-width: 90px; } } .billing-section .billing-info-row .value { padding-left: 15px; } @media screen and (min-width: 768px) { .billing-section .billing-info-row .value { padding-left: 20px; } } @media screen and (min-width: 768px) { .billing-section .billing-info-row { margin-bottom: 15px; } } @media screen and (min-width: 768px) { .billing-section { padding: 20px; } } /* Batch 3 Elements */ .box-with-link { position: relative; } .box-with-link h2 { position: relative; z-index: 3; } .box-with-link .header { height: 60px; padding-top: 15px; padding-bottom: 10px; } .box-with-link .header .title { float: left; margin-top: 13px; } .box-with-link p { position: relative; z-index: 4; } .box-with-link .link { position: relative; z-index: 5; } .box-with-link .link a { color: #666666; position: relative; z-index: 2; } .box-with-link .link-icon { background: url(../img/arrow-blue-6x11.png) left center no-repeat; width: 6px; height: 11px; display: inline-block; vertical-align: middle; margin-left: 2px; } .box-with-link .border-content-box, .box-with-link .border-top-left, .box-with-link .border-top-right, .box-with-link .border-bot-left, .box-with-link .border-bot-right { position: absolute; } .box-with-link .border-top-left, .box-with-link .border-top-right, .box-with-link .border-bot-left, .box-with-link .border-bot-right { width: 10px; height: 10px; z-index: 2; background: url(../img/border-corner.png) no-repeat; } .box-with-link .border-content-box, .box-with-link .border-top-left, .box-with-link .border-top-right { top: 0; } .box-with-link .border-bot-left, .box-with-link .border-bot-right { bottom: 0; } .box-with-link .border-content-box, .box-with-link .border-top-left, .box-with-link .border-bot-left { left: 0; } .box-with-link .border-top-right, .box-with-link .border-bot-right { right: 0; } .box-with-link .border-content-box { width: 100%; height: 100%; z-index: 1; border: 1px solid #e6e6e6; } .box-with-link .border-top-left { background-position: 0 0; } .box-with-link .border-top-right { background-position: -10px 0; } .box-with-link .border-bot-left { background-position: 0 -10px; } .box-with-link .border-bot-right { background-position: -10px -10px; } .box-other-link .link { font-size: 130%; } .box-other-link .link a { color: #666666; } .box-other-link .arrow-holder { width: 10px; } .box-other-link .arrow-holder .arrow-bullet { padding-top: 2px; } @media (min-width: 768px) { .box-other-link .arrow-holder .arrow-bullet { padding-top: 4px; } } .box-other-link .link-icon { background: url(../img/arrow-blue-dotted-5x9.png) left center no-repeat; width: 6px; height: 25px; display: inline-block; margin-right: 2px; } .usage-record .used-bar { width: 50%; background: #e5e5e5; /* Old browsers */ background: -moz-linear-gradient(left, #e5e5e5 0%, #7db9e8 76%, #71b7fd 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e5e5e5), color-stop(76%, #7db9e8), color-stop(100%, #71b7fd)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, #e5e5e5 0%, #7db9e8 76%, #71b7fd 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, #e5e5e5 0%, #7db9e8 76%, #71b7fd 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, #e5e5e5 0%, #7db9e8 76%, #71b7fd 100%); /* IE10+ */ background: linear-gradient(to right, #e5e5e5 0%, #7db9e8 76%, #71b7fd 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#71b7fd',GradientType=1 ); /* IE6-9 */ } .usage-record .usage-bar { width: 100%; color: #03437e; border: 1px solid #e6e6e6; } .usage-record .usage-bar-indicator img { margin: auto; display: block; } @media screen and (min-width: 768px) { .usage-record .used { float: left; } } @media screen and (min-width: 768px) { .usage-record .unused { float: right; } } .product-box .prod-thumbnail { border: none; text-align: center; } .product-box .prod-thumbnail .price { margin-top: 15px; margin-bottom: 15px; font-size: 130%; font-weight: bold; } .product-box .prod-thumbnail .view-more { margin-bottom: 15px; font-size: 130%; } .product-box .prod-thumbnail .view-more a { color: #666666; } .product-box .prod-thumbnail .view-more .link-icon { background: url(../img/arrow-blue-6x11.png) left center no-repeat; width: 6px; height: 11px; display: inline-block; margin-right: 2px; } .product-box h3 { margin: 0; text-align: center; color: black; line-height: 24px; font-size: 180%; } .bs-product-slider { /*.carousel-indicators li{ border:solid 1px gray; } .carousel-indicators .active{ background-color: gray; width:10px; height:10px; }*/ } .bs-product-slider .item { text-align: center; } .bs-product-slider .carousel-indicators { bottom: 0; } .bs-product-slider .carousel-indicators li { background: url(../img/carousel-indicator-xs.png) left center no-repeat; width: 8px; height: 8px; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } @media screen and (min-width: 768px) { .bs-product-slider .carousel-indicators li { background: url(../img/carousel-indicator.png) left center no-repeat; width: 16px; height: 16px; } } .bs-product-slider .carousel-indicators li.active { background-position: -9px 0; } @media screen and (min-width: 768px) { .bs-product-slider .carousel-indicators li.active { background-position: -18px 0; } } .bs-product-slider .carousel-control.right, .bs-product-slider .carousel-control.left { background: transparent; } .bs-product-slider .carousel-control.right .glyphicon-bg-right, .bs-product-slider .carousel-control.left .glyphicon-bg-right { background-color: #e5e5e5; width: 100%; height: 12%; padding-top: 12px; position: absolute; right: 5px; } @media screen and (min-width: 768px) { .bs-product-slider .carousel-control.right .glyphicon-bg-right, .bs-product-slider .carousel-control.left .glyphicon-bg-right { width: 35%; height: 14%; padding-top: 10px; } } .bs-product-slider .carousel-control.right .glyphicon-bg-left, .bs-product-slider .carousel-control.left .glyphicon-bg-left { background-color: #e5e5e5; width: 100%; height: 12%; padding-top: 12px; position: absolute; left: 5px; } @media screen and (min-width: 768px) { .bs-product-slider .carousel-control.right .glyphicon-bg-left, .bs-product-slider .carousel-control.left .glyphicon-bg-left { width: 35%; height: 14%; padding-top: 12px; } } .bs-product-slider .carousel-inner { padding-bottom: 40px; } /* ------------------------------------- ELEMENT - LIVE CHAT LINK --------------------------------------- */ #live-chat-link { position: relative; float: right; width: 222px; height: 117px; } #live-chat-link p { position: absolute; top: 5%; left: 10%; color: #fff; font-size: 120%; } #live-chat-link p b { color: #99ccff; } #live-chat-link a { position: absolute; top: 70%; left: 9%; } #live-chat-link a span { color: #004c92; font-size: 110%; } #live-chat-link img { width: 218px; height: 117px; } #live-chat-link .link-icon { width: 4px; height: 8px; display: inline-block; background: url(../img/arrow-darkblue-4x8.png) right center no-repeat; } /* Element local-search-results */ .local-search-results .col-head { padding: 10px 0 10px 0; border-top: 1px solid #b7b7b7; border-bottom: 1px solid #b7b7b7; background-color: #e5e5e5; font-weight: bold; } .local-search-results .result-row { padding-top: 15px; padding-bottom: 15px; } .local-search-results .result-row a { color: inherit; } .local-search-results .pagination-holder { padding-left: 0; padding-right: 0; border-top: 1px solid #b7b7b7; margin-top: 25px; } .local-search-results .pagination-holder .pagination { margin: 10px 0 10px 0; } @media (min-width: 768px) { .local-search-results .pagination-holder .pagination { margin: 30px 0 20px 0; } } .local-search-results .pagination-holder .pagination li > a { padding: 6px 10px; } @media (min-width: 768px) { .local-search-results .pagination-holder .pagination li > a { padding: 6px 18px; } } @media (min-width: 992px) { .local-search-results .pagination-holder .pagination li > a { padding: 6px 20px; } } /* Element International Search Results */ .international-search-results .col-head { padding: 5px 0 20px 0; border-top: 1px solid #b7b7b7; border-bottom: 1px solid #b7b7b7; background-color: #e5e5e5; font-weight: bold; } @media (min-width: 768px) { .international-search-results .col-head { padding: 7px 0 7px 0; } } .international-search-results .result-row { padding-top: 5px; padding-bottom: 5px; } @media (min-width: 768px) { .international-search-results .result-row { padding-top: 7px; padding-bottom: 7px; } } .international-search-results .result-row a { color: inherit; } @media (min-width: 768px) { .international-search-results .result-row .result-info { padding-right: 10px; } } /* ------------------------------------- ELEMENT - STORE INFORMATION --------------------------------------- */ .store-info .margin-neg-left-10, .store-info .content-wrapper { margin-left: -10px; } .store-info .name span { color: #442b7f; } .store-info .preview span { font-size: 100%; } @media screen and (min-width: 768px) { .store-info .preview span { font-size: 110%; } } @media screen and (min-width: 768px) { .store-info .content-wrapper { margin-left: 0; } } .store-info .modal-dialog { margin: 150px auto 25px; } @media screen and (min-width: 768px) { .store-info .modal-dialog { margin: 150px auto auto; } } .store-info .map-redirect .map-tooltip { width: 17px; height: 17px; display: block; background: url(../img/map-tooltip-17x17.png) right center no-repeat; } @media screen and (min-width: 768px) { .store-info .map-redirect .map-tooltip { width: 19px; height: 19px; background: url(../img/map-tooltip-19x19.png) right center no-repeat; } } .shop-map-redirect .map-tooltip { width: 17px; height: 17px; display: block; background: url(../img/map-tooltip-17x17.png) right center no-repeat; } @media screen and (min-width: 768px) { .shop-map-redirect .map-tooltip { width: 19px; height: 19px; background: url(../img/map-tooltip-19x19.png) right center no-repeat; } } /*Batch 4 Elements */ /* Element Job Opportunities */ .job-opportunities .col-head { color: #012c71; font-weight: bold; padding-left: 0; padding-right: 0; } .job-opportunities p { margin: 0; } @media (min-width: 768px) { .job-opportunities .custom-padding-left { padding-left: 20px; } } .job-opportunities .header-label { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; padding: 5px 0 5px 0; } .job-opportunities .job-results-holder { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; padding-bottom: 20px; } @media (min-width: 768px) { .job-opportunities .job-results-holder { border-top: 0; } } .job-opportunities .job-results-holder .row-jobs { padding-top: 10px; } .job-opportunities .job-results-holder .row-jobs a { color: inherit; } .job-opportunities .job-results-holder .row-jobs a .mobile-label { padding-left: 10px; padding-right: 0; color: #012c71; font-weight: bold; } .job-opportunities .job-results-holder .row-jobs a .mobile-job-result { margin-bottom: 10px; } .job-opportunities .pagination-holder { padding-left: 10px; } .job-opportunities .pagination-holder li > a, .job-opportunities .pagination-holder li > span { padding: 5px 10px; } @media (min-width: 768px) { .job-opportunities .pagination-holder li > a, .job-opportunities .pagination-holder li > span { padding: 5px 18px; } } @media (min-width: 768px) { .job-opportunities .pagination-holder { margin-top: 10px; } } /* ELEMENT SIDEBAR DROPDWON RELATED LINKS */ #sidebar-dropdown-related-links .select-sidebar-detail-list { padding-left: 0; padding-right: 0; margin-bottom: 20px; } #sidebar-dropdown-related-links #sidebar-holder { padding-left: 0; font-size: 130%; } #sidebar-dropdown-related-links #sidebar-holder #sidebar-title { border-bottom: 1px solid #ccc; padding: 5px 0 10px 10px; font-size: 140%; font-weight: bold; } #sidebar-dropdown-related-links #sidebar-holder .sidebar-subheader { color: #012c71; font-weight: bold; } #sidebar-dropdown-related-links #sidebar-holder #sidebar-list { list-style-image: url(../img/arrow-blue-dotted-5x9.png); margin-left: -28px; } #sidebar-dropdown-related-links #sidebar-holder #sidebar-list li { padding-bottom: 8px; } #sidebar-dropdown-related-links #sidebar-holder #sidebar-list li a { color: inherit; } /* Element Share Details */ #share-details .share-detail-header { border-bottom: 1px solid #dadada; margin-bottom: 10px; } #share-details .share-detail-header .share-stock-reference { font-weight: bold; margin-bottom: 5px; } #share-details .share-detail-header .share-stock-datetime { margin-bottom: 5px; } #share-details .share-details-holder .details-row { padding: 10px 0 10px 0; } #share-details .share-details-holder .details-row .share-label { font-weight: bold; } #share-details .share-details-holder .details-row p { margin: 0; } #share-details #note { border-top: 1px solid #dadada; padding-top: 10px; margin-top: 15px; } /* Element Stock Price History */ #stock-price-history #stock-history-heading { font-weight: bold; border-bottom: 1px solid #dadada; margin-bottom: 20px; } @media (min-width: 768px) { #stock-price-history #stock-history-heading { padding-bottom: 10px; } } #stock-price-history #stock-history-heading .col-xs-12 { padding-left: 0; } #stock-price-history .date-gap { margin-bottom: 20px; } #stock-price-history .date-gap .form-holder { padding-left: 0; padding-right: 0; } @media (min-width: 768px) { #stock-price-history .date-gap .form-holder .select-start, #stock-price-history .date-gap .form-holder .select-end { padding-right: 0; } } #stock-price-history .date-gap .form-holder .select-date-gap { margin-bottom: 5px; margin-top: 5px; } #stock-price-history .date-gap .form-holder .show-data-btn { background: url(../img/show-data-btn.png) no-repeat; width: 124px; height: 31px; border: 0; margin-top: 10px; float: right; } @media (min-width: 768px) { #stock-price-history .date-gap .form-holder .show-data-btn { margin-top: 24px; float: left; } } @media (min-width: 992px) { #stock-price-history .no-padding-left { padding-left: 0; } } #stock-price-history .header-label { font-weight: bold; padding-bottom: 5px; border-bottom: 1px solid #dadada; } #stock-price-history p { margin: 10px 0 10px 0; } @media (min-width: 768px) { #stock-price-history p { margin: 0; } } #stock-price-history .stock-history-holder .mobile-label { font-weight: bold; } #stock-price-history .stock-history-holder .row-stock-history { border-top: 1px solid #dadada; margin-bottom: 10px; } @media (min-width: 768px) { #stock-price-history .stock-history-holder .row-stock-history { border-top: none; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0; } } #stock-price-history .stock-history-holder .bg-lighter-grey, #stock-price-history .stock-history-holder #stores-and-showrooms .accordian .panel .panel-body .odd, #stores-and-showrooms .accordian .panel .panel-body #stock-price-history .stock-history-holder .odd { background-color: #FFF; } @media (min-width: 768px) { #stock-price-history .stock-history-holder .bg-lighter-grey, #stock-price-history .stock-history-holder #stores-and-showrooms .accordian .panel .panel-body .odd, #stores-and-showrooms .accordian .panel .panel-body #stock-price-history .stock-history-holder .odd { background-color: #f5f5f5; } } #stock-price-history .stock-history-holder .mobile-bg-grey { background-color: #f5f5f5; } @media (min-width: 768px) { #stock-price-history .stock-history-holder .mobile-bg-grey { background: none; } } #stock-price-history .stock-history-holder .stocks-date { float: right; } @media (min-width: 768px) { #stock-price-history .stock-history-holder .stocks-date { float: left; } } #stock-price-history .info-by { margin-top: 20px; padding-top: 10px; border-top: 1px solid #dadada; } /* Element Performance Graph */ #performance-graph .redraw-form .input-holder { padding-left: 3px; padding-right: 3px; } @media (min-width: 768px) { #performance-graph .redraw-form .input-holder { padding-left: 0; padding-right: 0; margin-right: 13px; } } @media (min-width: 992px) { #performance-graph .redraw-form .input-holder { margin-right: 10px; } } #performance-graph .redraw-form .input-holder .layer-input { padding: 0; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: none; text-align: center; height: 32px; } #performance-graph .redraw-form .input-holder .input-gray { background: #cccccc; } #performance-graph .redraw-form .select-type-time { padding-right: 5px; } @media (min-width: 768px) { #performance-graph .redraw-form .select-type-time { padding-right: 15px; } } #performance-graph .redraw-form .no-padding-left { padding-left: 0; } @media (min-width: 768px) { #performance-graph .redraw-form .form-select-layer { padding-right: 30px; } } #performance-graph .redraw-form .redraw-btn-holder { padding-right: 0; margin-top: 20px; } @media (min-width: 768px) { #performance-graph .redraw-form .redraw-btn-holder { padding-right: 15px; } } #performance-graph .redraw-form .redraw-btn-holder .redraw-btn { background: url(../img/redraw-btn.png) no-repeat; width: 124px; height: 31px; border: none; } #performance-graph .redraw-form .note-holder { margin-top: 20px; font-size: 95%; } @media (min-width: 768px) { #performance-graph .redraw-form .note-holder { font-size: 88%; } } @media (min-width: 992px) { #performance-graph .redraw-form .note-holder { font-size: 82%; } } /* ------------------------------ ELEMENT - TEXT AND VISUALS -------------------------------- */ .text-n-visual .image-block, .text-n-visual .image-block-min, .text-n-visual .article-img, .text-n-visual .article-img-min, .text-n-visual .caption { display: block; margin: auto; width: 278px; } .text-n-visual .image-block, .text-n-visual .image-block-min { background-color: #ccc; } #corporate-social-responsibility .text-n-visual .image-block, .text-n-visual .image-block-min { background-color: transparent; } .text-n-visual .image-block span, .text-n-visual .image-block-min span, .awards-list .image-block .text-n-visual span { display: block; color: #fff; } .text-n-visual .image-block { height: 209px; } .text-n-visual .image-block span { padding-top: 32%; } .text-n-visual .article-img { max-height: 209px; } .text-n-visual .image-block-min { height: 209px; } .text-n-visual .image-block-min span { padding-top: 33%; } .text-n-visual .article-img-min { max-height: 209px; } @media screen and (min-width: 768px) { .text-n-visual .caption { font-size: 110%; } } @media screen and (min-width: 992px) { .text-n-visual .article-content { padding-top: 0; } } .text-n-visual .article-content h6 { margin-bottom: 0; } @media screen and (min-width: 992px) { .text-n-visual .article-content h6 { margin-top: 0; } } .text-n-visual .article-content h6.header { margin-bottom: 5px; padding-bottom: 5px; font-size: 160%; color: #13598e; } @media screen and (min-width: 768px) { .text-n-visual .article-content h6.header { font-size: 190%; } } .text-n-visual .content-video { margin: auto; width: 80%; } @media screen and (min-width: 992px) { .text-n-visual .content-video { margin: 0 5px; } } /* ------------------------------ ELEMENT - OTHER LINKS V2 -------------------------------- */ .the-other-links .header { color: black; font-size: 110%; } @media screen and (min-width: 768px) { .the-other-links .header { text-align: left; font-size: 190%; } } .the-other-links .link-icon { height: 11px; } /* ------------------------------ ELEMENT - AWARD LIST -------------------------------- */ .awards-list .text-n-visual .article-img-min, .text-n-visual .awards-list .article-img-min, .awards-list .text-n-visual .image-block-min, .text-n-visual .awards-list .image-block-min, .awards-list .image-block, .awards-list .article-img, .awards-list .caption { display: block; margin: auto; width: 215px; } .awards-list .text-n-visual .image-block-min, .text-n-visual .awards-list .image-block-min, .awards-list .image-block{ /*background-color: #ccc;*/ } .text-n-visual .image-block .awards-list span, .awards-list .text-n-visual .image-block-min span, .text-n-visual .image-block-min .awards-list span, .awards-list .image-block span { display: block; color: #fff; } .awards-list .image-block { height: 260px; } @media screen and (min-width: 768px) { .awards-list .image-block { margin: 0; } } .awards-list .image-block span { padding-top: 55%; padding-left: 30px; } .awards-list .article-img { max-height: 260px; } @media screen and (min-width: 768px) { .awards-list .article-img { margin: 0; } } .awards-list .caption { font-size: 80%; } @media screen and (min-width: 768px) { .awards-list .caption { margin: 0; font-size: 110%; } } /* --------------------------- ELEMENT - ARTICLE DETAIL ----------------------------- */ .article-detail h6 { font-size: 180%; color: #13598e; } @media screen and (min-width: 768px) { .article-detail h6 { font-size: 200%; } } /* ----------------------------------- ELEMENT - TELEPHONE LINE PRICING ------------------------------------- */ .tele-line-price .header { background-color: #e5e5e5; border-top: 1px solid #b7b7b7; border-bottom: 1px solid #b7b7b7; } @media (min-width: 768px) { .tele-line-price .charge-value { padding-left: 40px; } } .tele-line-price .service-charge-label { padding-left: 5px; } @media (min-width: 768px) { .tele-line-price .service-charge-label { padding-left: 15px; } } .tele-line-price .service-removal-label { padding-left: 20px; } @media (min-width: 768px) { .tele-line-price .service-removal-label { padding-left: 35px; } } /* ------------------------------ ELEMENT - DISCOUNT SCHEME -------------------------------- */ .discount-scheme .discount-row { padding: 5px; } .discount-scheme .discount-table div { text-align: center; } .discount-scheme .discount-table .cell { height: 130px; padding-top: 50px; } .discount-scheme .discount-table .right-border { border-right: 1px solid #b7b7b7; } .discount-scheme .discount-table .left-border { border-left: 1px solid #b7b7b7; } .discount-scheme .discount-table .top-border { border-top: 1px solid #b7b7b7; } .discount-scheme .discount-table .bottom-border { border-bottom: 1px solid #b7b7b7; } .discount-scheme .discount-table .row1-col3 { height: 35px; padding-top: 6px; } .discount-scheme .discount-table .row1-col3-subr1, .discount-scheme .discount-table .row1-col3-subr2, .discount-scheme .discount-table .row1-col3-subr3 { height: 95px; padding-top: 35px; } .discount-scheme .discount-table .row2-col3-subr1, .discount-scheme .discount-table .row2-col3-subr2, .discount-scheme .discount-table .row2-col3-subr3 { height: 130px; } .discount-scheme .discount-table .row2-col3-subr2, .discount-scheme .discount-table .row2-col3-subr3 { padding-top: 35px; } .discount-scheme .discount-table .row2-col2-subr1, .discount-scheme .discount-table .row2-col2-subr2, .discount-scheme .discount-table .row2-col2-subr3, .discount-scheme .discount-table .row2-col2-subr4 { height: 65px; } .discount-scheme .discount-table .row2-col2-subr1 { padding-top: 12px; } .discount-scheme .discount-table .row2-col2-subr2 { padding-top: 20px; } .discount-scheme .discount-table .row2-col2-subr3, .discount-scheme .discount-table .row2-col2-subr4 { padding-top: 20px; } .discount-scheme .discount-table .gray-bg { background: #f5f5f5; } /* ------------------------- ELEMENT - COVERAGE MAP --------------------------- */ @media screen and (min-width: 768px) { .coverage-map { position: relative; } } .coverage-map .filters .custom-input-select .btn.selectpicker { width: 99%; } .coverage-map .filters .custom-input-select .border-side-right { right: 0; } .coverage-map .filters .custom-input-select .dropdown-menu.open { width: 100%; } @media screen and (min-width: 768px) { .coverage-map .filters .form-control.address { background: url(../img/btn-mag-glass-r1.png) no-repeat right 10px white; } } .coverage-map .filters .suggestion-list-wrapper { display: none; } @media screen and (min-width: 768px) { .coverage-map .filters .suggestion-list-wrapper { position: absolute; top: 34px; right: 15.333333%; width: 60%; z-index: 105; } } @media screen and (min-width: 992px) { .coverage-map .filters .suggestion-list-wrapper { right: 7.2%; } } .coverage-map .filters .suggestion-list-wrapper .suggestion-list { border: 1px solid #ccc; background-color: #fff; } .coverage-map .filters .suggestion-list-wrapper .suggestion-list a.link-label:hover { color: #03437e; } .coverage-map .filters .suggestion-list-wrapper .suggestion-list .tip { color: #ccc; } .coverage-map .coverage-area { position: relative; } .coverage-map .coverage-area .toggle-services { height: 40px; border: 1px solid black; } @media screen and (min-width: 768px) { .coverage-map .coverage-area .toggle-services { position: absolute; bottom: 10px; left: 10px; z-index: 100; } } .coverage-map .coverage-area .map-area { height: 260px; border: 1px solid red; background-color: white; } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area { height: 360px; } } .coverage-map .coverage-area .map-area .map-marker { position: absolute; bottom: 80px; z-index: 100; } .coverage-map .coverage-area .map-area .map-marker .popover { width: 165px; } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area .map-marker .popover { width: 260px; } } .coverage-map .coverage-area .map-area .map-marker .popover .divider { border: 1px solid; } .coverage-map .coverage-area .map-area .map-marker .popover .divider { border-color: #ccc; } .coverage-map .coverage-area .map-area .map-marker .popover .divider.header { border-color: #f9a13a; } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area .map-marker .popover .now-tv .text { padding-top: 6px; } } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area .map-marker .popover .netvigator .image-wrapper { padding-top: 0; } } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area .map-marker .popover .netvigator .text { padding-top: 10px; } } @media screen and (min-width: 768px) { .coverage-map .coverage-area .map-area .map-marker .popover .links > div { padding-top: 10px; } } .coverage-map .coverage-area .map-area .map-marker .popover .links .link-label { padding-left: 8px; background: url(../img/arrow-blue-5x9.png) no-repeat; } .coverage-map #service-enquiry-modal { min-width: 300px; } .coverage-map #service-enquiry-modal .modal-content { background-color: #ccc; } .coverage-map #service-enquiry-modal .modal-content .nav-tabs { padding: 0; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs { border: none; } } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li { margin: 0; background: url(../img/mobile-tab-indicator.png) no-repeat; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs li { width: 48%; } } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li a { padding-left: 40px; line-height: 22px; color: #007ab6; border: none; background: none; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs li a { margin: 0; padding: 5px 0; text-align: center; color: #fff; background-color: #007ab6; } } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.tab-indicator { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 13px solid #007ab6; background-color: #03437e; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.tab-indicator { border-top: 16px solid transparent; border-bottom: 16px solid transparent; border-left: 20px solid #007ab6; border-right: none; } } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.active { background: url(../img/mobile-tab-indicator-active.png) no-repeat; } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.active a { color: #03437e; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.active a { color: #fff; background-color: #03437e; } } .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.active + .tab-indicator { border-top: 13px solid #03437e; background-color: #007ab6; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content .nav-tabs li.active + .tab-indicator { border-top: 16px solid transparent; border-left: 20px solid #03437e; background-color: #007ab6; } } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio { margin-top: 15px; margin-bottom: 5px; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label { padding: 0; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label { padding-left: 20px; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label .radio-btn { width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label .radio-btn { display: none; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label .radio-btn-selected { background-position: left center; } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label .custom-label { margin-top: 5px; margin-left: 5px; display: inline-block; vertical-align: top; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label .custom-label { margin: 0; display: block; vertical-align: middle; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label input[type="radio"] { display: none; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio label input[type="radio"] { margin-top: 0; display: block; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio .label-wrapper { margin: 0; } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .radio .label-wrapper label { font-size: 120%; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group { padding-right: 10px; } } @media screen and (min-width: 992px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group { padding-right: 15px; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group a { /* buttons spacing */ margin-left: 10px; } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group a .btn-image { height: 30px; width: 101px; } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group input[type=submit].submit-form-btn { margin-left: 10px; display: block; width: 116px; height: 35px; border: none; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group input[type=submit].submit-form-btn { width: 101px; height: 30px; } } .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group input[type=submit].submit-form-btn { background: url(../img/submit-btn-mobile.png) right top no-repeat; } @media screen and (min-width: 768px) { .coverage-map #service-enquiry-modal .modal-content #service-enquiry-form .btnz-group input[type=submit].submit-form-btn { background: url(../img/submit-btn-101x30.png) right top no-repeat; } } /*Batch 4.2 Elements */ /* ELEMENT APPLICATION */ @media (min-width: 768px) { .applications .header { padding-top: 8px; } } .applications .header .title { margin-top: 0; font-size: 88%; } @media (min-width: 768px) { .applications .header .title { font-size: 110%; } } .applications .has-padding-top { padding-top: 30px !important; } .applications .app-list-box { padding: 5px; } .applications .app-list-box .app-img { width: 100%; } @media (min-width: 768px) { .applications .app-list-box .app-img { width: 85%; } } .applications .platform-download-link { z-index: 5; } /* ELEMENT SERVICE PLANS */ .ele-service-plans h2.header { border-bottom: 2px solid #CCC; padding-top: 0; } .ele-service-plans .sub-heading, .ele-service-plans .service-content { margin-bottom: 0; } .ele-service-plans .feature-list { padding-left: 15px; font-size: 110%; } .ele-service-plans .feature-list li { padding-top: 5px; } @media (min-width: 768px) { .ele-service-plans .feature-list { font-size: 120%; padding-left: 20px; } } .ele-service-plans .link { padding-top: 5px; padding-bottom: 15px; border-top: 1px solid #CCC; } /* ELEMENT OPERATOR CARD */ .operator-card .box-mobile .content { padding: 0 20px; } .operator-card .box-mobile .row { padding-top: 15px; } @media (min-width: 768px) { .operator-card .box-mobile .row .title { height: 50px; } } @media (min-width: 768px) { .operator-card .box-mobile .row .title img { max-height: 50px; } } .operator-card .box-mobile .row .link .text { padding-left: 13px; } .operator-card .box-mobile .row .link .link-icon { margin-top: 14px; } @media (min-width: 150px) { .operator-card .box-mobile .row .link .link-icon { margin-top: 21px; margin-right: 2px; } } @media (min-width: 360px) { .operator-card .box-mobile .row .link .link-icon { margin-top: 8px; margin-right: 8px; } } @media (min-width: 768px) { .operator-card .box-mobile .row .link .link-icon { margin-top: 10px; } } .operator-card .box-mobile .row .border { height: 1px; background-color: #CCC; width: 100%; } /** * Pages */ #page-header-bottom { background: url(../img/home-grid-gradient-top.png) 0 0 repeat-x; width: 100%; height: 6px; } #home-grid-container { position: relative; background-color: #fff; padding: 0 0 16px; overflow-x: hidden; } #home-grid-container .grey-bar { background-color: #e7e7e7; position: absolute; top: 0; bottom: 0; width: 20px; height: 100%; z-index: 1; } #home-grid-container .grey-bar.grey-bar-left { left: 0; } #home-grid-container .grey-bar.grey-bar-right { right: 0; } #home-grid-row { /*margin: 0 -24px;*/ margin: 0 -4px; } @media (min-width: 768px) { #home-grid-row { margin: 0 -4px 33.33333%; } } @media (min-width: 992px) { #home-grid-row { margin-bottom: 0; } } #home-grid-row > .divider { border-top: 1px solid #03437e; margin: 0 3%; width: 94%; float: left; } #home-grid-row .grid { color: #fff; padding: 4px; position: relative; } #home-grid-row .grid .embed-responsive { padding-bottom: 100%; } #home-grid-row .grid a, #home-grid-row .grid a:hover { text-decoration: none; } #home-grid-row .grid .full-width { width: 100%; } @media (min-width: 1000px) { #home-grid-row .grid .full-width { width: auto; } } #home-grid-row .grid .arrow { width: 15px; height: 13px; padding: 0 0 0 8px; } #home-grid-row .grid-title, #home-grid-row .link-title { color: #fff; font-size: 13px; } @media (min-width: 768px) { #home-grid-row .grid-title, #home-grid-row .link-title { min-height: 31px; } } #home-grid-row .grid-title-mobile { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #03437e; font-size: 160%; line-height: 22px; margin: 15px 25px 15px 23px; } #home-grid-row .grid-title { background: url(../img/grid-link-bg.png) transparent; font-size: 150%; text-align: right; min-height: 24px; padding: 4px 8px; position: absolute; left: 0; right: 0; bottom: 0; z-index: 990; } @media (min-width: 768px) { #home-grid-row .grid-title { font-size: 160%; } } #home-grid-row .grid-title .arrow { height: 12px; } @media (min-width: 768px) { #home-grid-row .grid-title .arrow { height: 13px; } } #home-grid-row #grid-cta-links .row { margin: 0 -4px; } #home-grid-row #grid-cta-links .cta-link { padding: 0 4px; } @media (min-width: 768px) { #home-grid-row #grid-cta-links .cta-link .embed-responsive { padding-bottom: 33.33333%; } } #home-grid-row #grid-cta-links .cta-link .embed-responsive-item { padding: 15% 0 10%; } @media (min-width: 768px) { #home-grid-row #grid-cta-links .cta-link .embed-responsive-item { padding: 4% 0; } } @media (min-width: 768px) { #home-grid-row #grid-cta-links .cta-link .img-responsive, #home-grid-row #grid-cta-links .cta-link .link-title { float: left; } } #home-grid-row #grid-cta-links .cta-link .img-responsive { padding: 0 24% 4%; width: 100%; } @media (min-width: 768px) { #home-grid-row #grid-cta-links .cta-link .img-responsive { padding: 0 4%; width: auto; height: 100%; } } #home-grid-row #grid-cta-links .cta-link .link-title { font-size: 16px; text-align: center; } @media (min-width: 768px) { #home-grid-row #grid-cta-links .cta-link .link-title { padding: 8% 0; } } #home-grid-row #grid-cta-links #link-live-chat .embed-responsive-item { background-color: #34cccd; } #home-grid-row #grid-cta-links #link-download-apps .embed-responsive-item { background-color: #1a83cb; } #home-grid-row #grid-cta-links #link-retail-location .embed-responsive-item { background-color: #ff6600; } #home-grid-row #grid-hkt-premier, #home-grid-row #grid-about-hkt { color: #03437e; } #home-grid-row #grid-hkt-premier .embed-responsive, #home-grid-row #grid-about-hkt .embed-responsive { padding-bottom: 52px; } @media (min-width: 768px) { #home-grid-row #grid-hkt-premier .embed-responsive { padding-bottom: 100%; } } #home-grid-row #grid-about-hkt .divider { border-top: 1px solid #03437e; margin: 0 auto; width: 95.4%; } @media (min-width: 768px) { #home-grid-row #grid-about-hkt .embed-responsive { padding-bottom: 50%; } } #home-grid-row #grid-welcome { overflow: hidden; max-height: 140px; position: relative; } @media (min-width: 768px) { #home-grid-row #grid-welcome { position: absolute; padding: 4px 0.25%; max-height: 100%; } } @media (min-width: 992px) { #home-grid-row #grid-welcome { /*left: 254px; padding: 4px 8px;*/ left: 239px; padding: 4px; } } #home-grid-row #grid-welcome .embed-responsive { /*padding-bottom: 29.6%;*/ padding-bottom: 140px; } @media (min-width: 768px) { #home-grid-row #grid-welcome .embed-responsive { padding-bottom: 202%; } } @media (min-width: 992px) { #home-grid-row #grid-welcome .embed-responsive { padding-bottom: 476px; } } #home-grid-row #grid-welcome .embed-responsive-item { background-color: #00427b; } #home-grid-row #grid-welcome .title-group, #home-grid-row #grid-welcome .img-group { float: left; } @media (min-width: 768px) { #home-grid-row #grid-welcome .title-group, #home-grid-row #grid-welcome .img-group { float: none; } } #home-grid-row #grid-welcome .title-group { margin: 17px 0; width: 40%; margin-left: 5%; /*font-size: 16px; line-height: 18px;*/ font-size: 160%; line-height: 1.15; color: white; } @media (min-width: 480px) { #home-grid-row #grid-welcome .title-group { /*font-size: 18px; line-height: 22px;*/ font-size: 180%; margin: 25px 0 25px 15%; } } @media (min-width: 768px) { #home-grid-row #grid-welcome .title-group { /*font-size: 24px; line-height: 28px;*/ font-size: 240%; width: auto; margin: 17px; } } #home-grid-row #grid-welcome .img-group img { max-height: 140px; } @media (min-width: 768px) { #home-grid-row #grid-welcome .img-group img { max-height: auto; } } #home-grid-row #grid-welcome #form-search { margin: 0 17px; } @media screen and (min-width: 768px) { #home-grid-row #grid-welcome #form-search { position: relative; } } #home-grid-row #grid-welcome #form-search textarea { resize: none; border: 0; background-color: #1b2a46; color: #fff; font-size: 170%; padding: 10px 12px; } #home-grid-row #grid-welcome #form-search textarea::-webkit-input-placeholder { color: #fff; } #home-grid-row #grid-welcome #form-search textarea:-moz-placeholder { color: #fff; } #home-grid-row #grid-welcome #form-search textarea::-moz-placeholder { color: #fff; } #home-grid-row #grid-welcome #form-search textarea:-ms-input-placeholder { color: #fff; } #home-grid-row #grid-welcome #form-search .btn-clean { background: url(../img/arrow-7x13.png) right center no-repeat; border: 0 none; padding: 0 15px 0 0; font-size: 130%; } @media screen and (min-width: 768px) { #home-grid-row #grid-welcome #form-search .btn-clean { position: absolute; right: 10px; bottom: 5px; } } #home-grid-row #grid-promo { position: relative; } @media (min-width: 768px) { #home-grid-row #grid-promo { position: absolute; bottom: 16px; left: 0; } } @media (min-width: 992px) { #home-grid-row #grid-promo { position: relative; bottom: 0; } } /* ------------------------------- SEARCH RESULT --------------------------------- */ #home-search { position: absolute; top: 0; width: 100%; } #home-search #home-search-wrapper { position: relative; } #home-search #home-search-wrapper .home-search-result { position: absolute; top: 320px; margin-left: 19px; z-index: 991; } @media screen and (min-width: 992px) { #home-search #home-search-wrapper .home-search-result { margin-left: 20px; } } #home-search #home-search-wrapper .home-search-result .searchHKT-results { display: none; top: 32px; left: 0; } .modal.interim-announcement .modal-dialog { border: 15px solid #eef3f9; min-width: 295px; top: 25px; } @media screen and (min-width: 768px) { .modal.interim-announcement .modal-dialog { width: 620px; top: 245px; } } @media screen and (min-width: 992px) { .modal.interim-announcement .modal-dialog { top: 225px; } } .modal.interim-announcement .modal-content { border: none; box-shadow: none; } .modal.interim-announcement .close { background-image: url("/assets/HKTCorpsite/img/modal-close-btn-alt.png"); color: #999; } .webcast-announcement { padding: 10px; } .webcast-announcement > div { padding: 0; } @media screen and (min-width: 768px) { .webcast-announcement.done .heading { padding-top: 0; } } .webcast-announcement.done .additional-info { font-family: lato-bold; font-size: 130%; padding: 15px 0 5px; } @media screen and (min-width: 768px) { .webcast-announcement.done .additional-info { font-size: 150%; padding: 20px 0 15px; } .webcast-announcement.done .additional-info .row > div + div { margin: 0; padding-top: 5px; } } .webcast-announcement.done .additional-info img { margin: auto; } .webcast-announcement.ongoing .content { font-family: lato-bold; font-size: 280%; padding: 5px 0; } @media screen and (min-width: 768px) { .webcast-announcement.ongoing .content { font-size: 410%; padding: 7px 0; } } .webcast-announcement.ongoing img.wave { height: 50px; margin: auto; } @media screen and (min-width: 768px) { .webcast-announcement.ongoing img.wave { height: 75px; } } .webcast-announcement.ongoing .resolution-opts { padding: 20px 0 25px; } .webcast-announcement.ongoing .resolution-button { max-width: 200px; margin: auto; /*background: url("../img/btn-img-long-mobile.png") no-repeat; height: 32px; width: 200px; border: 0; margin-top: 10px; margin-right: 2px; margin-left: 3px; text-align: left; color: #fff; font-size: 14px; font-weight: bold; padding-left: 12px;*/ } @media screen and (min-width: 768px) { .webcast-announcement.ongoing .resolution-button { max-width: 100%; } } .webcast-announcement.ongoing .resolution-button.higher { margin-left: 10px; } @media screen and (min-width: 768px) { .webcast-announcement.ongoing .divider { padding: 0 10px; } } @media screen and (min-width: 768px) { .webcast-announcement.ongoing .additional-info { padding: 10px; } } .webcast-announcement.upcoming .img-container, .webcast-announcement.upcoming .content { display: inline-block; vertical-align: middle; float: none; } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .img-container { padding: 0; width: 10%; } } .webcast-announcement.upcoming .img-container img { max-height: 50px; margin: auto; } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .img-container img { max-height: 70px; } } .webcast-announcement.upcoming .img-container img.left-wave { margin-right: 0; } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .img-container img.left-wave { margin-right: 5px; } } .webcast-announcement.upcoming .img-container img.right-wave { margin-left: 0; } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .img-container img.right-wave { margin-left: 5px; } } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .main-content-container { padding: 0 10px 20px; } } .webcast-announcement.upcoming .content { width: 64%; font-size: 210%; } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .content { font-size: 190%;/*300 > 200*/ width: 78.66667%; } } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .divider { padding: 0 10px; } } @media screen and (min-width: 768px) { .webcast-announcement.upcoming .additional-info { padding: 10px; } } .webcast-announcement .heading { font-size: 170%; /*color: #03437e;*/ font-family: lato-bold; padding: 5px 5px 10px; } @media screen and (min-width: 768px) { .webcast-announcement .heading { font-size: 230%;/*200> 300*/ } } .webcast-announcement .content, .webcast-announcement .additional-info { color: #666; font-family: arial; } .webcast-announcement .content { font-size: 220%; padding: 10px 0; } .webcast-announcement .content sup, .webcast-announcement .content .subscript { font-size: 60%; } .webcast-announcement .additional-info { padding-top: 5px; font-size: 110%; } @media screen and (min-width: 768px) { .webcast-announcement .additional-info { font-size: 120%; } } .webcast-announcement .divider .line { border-top: 2px solid #a6bcc9; } /* ------------------------------ SMART LIVING ------------------------------ */ #smart-living { /*margin-top: 15px; margin-bottom: 30px;*/ } #smart-living .row { margin: 0; } #smart-living .row h1.page-title { margin-left: -15px; } @media screen and (min-width: 768px) { #smart-living .row.content-area { margin-top: 38px; } } @media screen and (min-width: 992px) { #smart-living .row.content-area { margin-top: 24px; } } #smart-living .content-area > div { padding: 0; } /* ------------------------------ Page - HKT Register Login ------------------------------ */ .page-myhkt-registerLogin .live-chat-img { border-bottom: transparent; margin-top: -43px; background: url("../img/live-chat-bg-small-image.png") no-repeat center; position: relative; height: 77px; } .page-myhkt-registerLogin .live-chat-img .chat { color: #fff; position: absolute; top: 19px; left: 26px; font-size: 120%; } .page-myhkt-registerLogin .live-chat-img .link { position: absolute; color: #004c92; bottom: 18px; left: 16px; padding-right: 8px; background: url(../img/arrow-darkblue-4x8.png) no-repeat right 5px; font-size: 120%; } .page-myhkt-registerLogin .page-title { margin: 0 0 30px 0; } .page-myhkt-registerLogin .modal-dialog p { font-size: 120%; } .page-myhkt-registerLogin .modal-body { margin: 20px; margin-bottom: 0; padding: 0; padding-top: 15px; } .page-myhkt-registerLogin .modal-footer { padding: 20px; padding-top: 0; border: 0; } .page-myhkt-registerLogin .modal-footer a { float: right; } @media (min-width: 480px) { .page-myhkt-registerLogin .modal-footer a { float: none; display: inline-block; } } .page-myhkt-registerLogin .modal-footer a div { width: 100px; } /*********************************************/ /* The three IDs are used for the light box */ /*********************************************/ #general-conditions, #privacy-policy, #collection-statement { background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.6); /* displays which lightbox is to be displayed */ } #general-conditions:target, #privacy-policy:target, #collection-statement:target { display: block; } #general-conditions .modal-dialog, #privacy-policy .modal-dialog, #collection-statement .modal-dialog { height: 80%; } #general-conditions .modal-dialog .modal-content, #privacy-policy .modal-dialog .modal-content, #collection-statement .modal-dialog .modal-content { height: 100%; padding: 10px 15px; overflow: auto; /* CONDITION T&C styles */ /* POLICY T&C styles */ /* STATEMENT T&C styles */ } #general-conditions .modal-dialog .modal-content h2, #privacy-policy .modal-dialog .modal-content h2, #collection-statement .modal-dialog .modal-content h2 { color: #014288; margin: 0; } #general-conditions .modal-dialog .modal-content hr, #privacy-policy .modal-dialog .modal-content hr, #collection-statement .modal-dialog .modal-content hr { border-color: #d7d7d7; margin: 10px 0; } #general-conditions .modal-dialog .modal-content .category, #general-conditions .modal-dialog .modal-content .subcategory, #general-conditions .modal-dialog .modal-content .division, #privacy-policy .modal-dialog .modal-content .category, #privacy-policy .modal-dialog .modal-content .subcategory, #privacy-policy .modal-dialog .modal-content .division, #collection-statement .modal-dialog .modal-content .category, #collection-statement .modal-dialog .modal-content .subcategory, #collection-statement .modal-dialog .modal-content .division { margin-bottom: 10px; padding: 0 10px; font-size: 120%; } @media screen and (min-width: 768px) { #general-conditions .modal-dialog .modal-content .category, #general-conditions .modal-dialog .modal-content .subcategory, #general-conditions .modal-dialog .modal-content .division, #privacy-policy .modal-dialog .modal-content .category, #privacy-policy .modal-dialog .modal-content .subcategory, #privacy-policy .modal-dialog .modal-content .division, #collection-statement .modal-dialog .modal-content .category, #collection-statement .modal-dialog .modal-content .subcategory, #collection-statement .modal-dialog .modal-content .division { font-size: 140%; } } #general-conditions .modal-dialog .modal-content .category span.item, #general-conditions .modal-dialog .modal-content .subcategory span.item, #general-conditions .modal-dialog .modal-content .division span.item, #privacy-policy .modal-dialog .modal-content .category span.item, #privacy-policy .modal-dialog .modal-content .subcategory span.item, #privacy-policy .modal-dialog .modal-content .division span.item, #collection-statement .modal-dialog .modal-content .category span.item, #collection-statement .modal-dialog .modal-content .subcategory span.item, #collection-statement .modal-dialog .modal-content .division span.item { padding-right: 0; } #general-conditions .modal-dialog .modal-content .category span.item + span, #general-conditions .modal-dialog .modal-content .subcategory span.item + span, #general-conditions .modal-dialog .modal-content .division span.item + span, #privacy-policy .modal-dialog .modal-content .category span.item + span, #privacy-policy .modal-dialog .modal-content .subcategory span.item + span, #privacy-policy .modal-dialog .modal-content .division span.item + span, #collection-statement .modal-dialog .modal-content .category span.item + span, #collection-statement .modal-dialog .modal-content .subcategory span.item + span, #collection-statement .modal-dialog .modal-content .division span.item + span { padding-left: 0; } #general-conditions .modal-dialog .modal-content .category, #privacy-policy .modal-dialog .modal-content .category, #collection-statement .modal-dialog .modal-content .category { font-weight: bold; } #general-conditions .modal-dialog .modal-content .division span.item, #privacy-policy .modal-dialog .modal-content .division span.item, #collection-statement .modal-dialog .modal-content .division span.item { padding-left: 0; } #general-conditions .modal-dialog .modal-content .details p, #general-conditions .modal-dialog .modal-content .details span, #privacy-policy .modal-dialog .modal-content .details p, #privacy-policy .modal-dialog .modal-content .details span, #collection-statement .modal-dialog .modal-content .details p, #collection-statement .modal-dialog .modal-content .details span { margin: 0 0 10px; padding: 0 10px; font-size: 120%; } @media screen and (min-width: 768px) { #general-conditions .modal-dialog .modal-content .details p, #general-conditions .modal-dialog .modal-content .details span, #privacy-policy .modal-dialog .modal-content .details p, #privacy-policy .modal-dialog .modal-content .details span, #collection-statement .modal-dialog .modal-content .details p, #collection-statement .modal-dialog .modal-content .details span { font-size: 140%; } } .form { /*select.form-control { padding-left: 2px; padding-right: 2px; }*/ } .form .form-group { margin-bottom: 8px; } .form .radio-btn { float: left; margin-right: 5px; width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } .form .radio-label { margin-top: 5px; display: inline-block; } .form :checked + span.radio-btn { background-position: left center; } .form label.radio-option:hover { cursor: pointer; } .form :disabled { color: #acacac; } @media (min-width: 768px) { .form .optionsRadios { width: 20%; } } @media (min-width: 768px) { .form .loginInfo .form-note { width: 460px; } } .form .accountInfo .accountNo { float: left; width: 89%; } @media (min-width: 440px) { .form .accountInfo .accountNo { width: 92%; } } @media (min-width: 560px) { .form .accountInfo .accountNo { width: 94%; } } @media (min-width: 768px) { .form .accountInfo .accountNo { width: 308px; } } .form .accountInfo .ask-info { width: 18px; height: 18px; background: url(../img/info-img.png) left top no-repeat; float: left; margin-top: 6px; margin-left: 10px; } @media (min-width: 768px) { .form .accountInfo .ask-info { margin-top: 2px; margin-left: 5px; } } .form .accountInfo .form-note { float: left; width: 100%; clear: both; } @media (min-width: 768px) { .form .accountInfo .form-note { width: 460px; float: none; } } .form label { font-weight: normal; /*@media (min-width: $screen-md) { width: 180px; }*/ } @media (min-width: 768px) { .form label { /*width: 145px;*/ width: 180px; } } .form .form-note, .form .form-remarks { display: block; /*@media (min-width: $screen-md) { padding-left: 180px; }*/ } @media (min-width: 768px) { .form .form-note, .form .form-remarks { width: 100%; /*padding-left: 145px;*/ padding-left: 180px; } } .form .form-note { color: #acacac; padding-top: 3px; } .form .form-remarks { padding-top: 15px; color: #666; font-size: 100%; } @media (min-width: 768px) { .form .form-remarks { font-size: 130%; } } .form .form-control { box-shadow: none; position: relative; } .form .form-control:focus { box-shadow: none; } .form .checkbox label { width: 100%; } .form .checkbox label input[type=checkbox] { padding: 0; margin-top: 2px; } .form .radio label { float: none; width: auto; margin-right: 12px; } .form .radio label input[type=radio] { margin-top: 2px; } .form input[type=submit] { border: 0 none; min-width: 0; padding: 0; } .page-myhkt-registerLogin { /* elements */ } @media (min-width: 992px) { .page-myhkt-registerLogin { margin: 0 auto; } } .page-myhkt-registerLogin .tabs-register-login { padding-bottom: 12px; } .page-myhkt-registerLogin .tabs-register-login ul { padding: 0; margin-bottom: 18px; } @media (min-width: 768px) { .page-myhkt-registerLogin .tabs-register-login ul { margin-bottom: 0; border-bottom: 2px solid #a6bcc9; } } @media (min-width: 768px) { .page-myhkt-registerLogin .tabs-register-login ul li { width: 30%; text-align: center; margin-right: 2px; } } .page-myhkt-registerLogin .tabs-register-login ul li a { margin-right: 0; } .page-myhkt-registerLogin .tabs-register-login ul .active { border-bottom: 1px solid #006ea5; } .page-myhkt-registerLogin .form-section { background-color: #eef3f9; overflow: hidden; padding: 15px; margin-bottom: 5px; } .page-myhkt-registerLogin .form-control { height: 30px; padding: 6px; } @media (min-width: 768px) { .page-myhkt-registerLogin .form-control { width: 308px; height: 22px; padding-top: 1px; padding-bottom: 1px; } } .page-myhkt-registerLogin .form-control.form-control-long { width: 100%; } @media (min-width: 768px) { .page-myhkt-registerLogin .form-control.form-control-long { width: 480px; } } @media (min-width: 992px) { .page-myhkt-registerLogin .form-control.form-control-long { width: 470px; } } .page-myhkt-registerLogin .form-control:focus { box-shadow: none; } .page-myhkt-registerLogin h2, .page-myhkt-registerLogin label, .page-myhkt-registerLogin .form-control, .page-myhkt-registerLogin .form-remarks { color: #666; } .page-myhkt-registerLogin h2, .page-myhkt-registerLogin .form-subtitle { margin-bottom: 13px; } @media (min-width: 768px) { .page-myhkt-registerLogin h2, .page-myhkt-registerLogin .form-subtitle { margin-bottom: 26px; } } .page-myhkt-registerLogin h2 { margin-top: 0; } .page-myhkt-registerLogin label { float: none; } @media (min-width: 768px) { .page-myhkt-registerLogin label { float: left; } } .page-myhkt-registerLogin .form-subtitle { display: block; } .page-myhkt-registerLogin .terms-and-conditions { padding: 20px 10px 0; /* a { display: block; display: inline; outline: none; margin-top: 20px; margin-right: 22px; color: #666; } */ } .page-myhkt-registerLogin .terms-and-conditions p, .page-myhkt-registerLogin .terms-and-conditions .title { font-size: 100%; } @media (min-width: 768px) { .page-myhkt-registerLogin .terms-and-conditions p, .page-myhkt-registerLogin .terms-and-conditions .title { font-size: 120%; } } .page-myhkt-registerLogin .terms-and-conditions .title { font-weight: bold; } .page-myhkt-registerLogin .btn-submit { background: url(../img/btn-img.png) center top no-repeat; width: 91px; height: 33px; margin-top: 10px; margin-right: 2px; text-align: center; color: #fff; font-size: 14px; font-weight: bold; } .page-myhkt-registerLogin .btn-arrow { background: url(../img/btn-arrow.png) center top no-repeat; width: 33px; height: 33px; margin-top: 10px; } /* ------------------------------ HKT Search results Login ------------------------------ */ #search-result-content { padding-bottom: 5px; /* Search result category */ } #search-result-content input:focus { border-color: #ccc; box-shadow: none; } #search-result-content input { height: 45px; background: transparent; border: 0; z-index: 10; position: relative; box-shadow: none; margin-left: 5px; } #search-result-content button { width: 100%; text-align: left; color: #666; } #search-result-content button:hover, #search-result-content button:focus { background-color: #fff; } #search-result-content .grey-box { background-color: #ebebeb; overflow: hidden; margin: 0 -5px; } #search-result-content .form-group { margin-bottom: 0px; } #search-result-content .rounded-field { position: absolute; height: 32px; width: 100%; top: 6px; left: 10px; z-index: 0; margin-left: 20px; } #search-result-content .searchButton { z-index: 1; position: absolute; top: 12px; right: -23px; width: 20px; } #search-result-content .search-total { padding-top: 16px; font-size: 130%; } @media screen and (min-width: 768px) { #search-result-content .search-total { padding: 25px 15px; font-size: 140%; border-bottom: 1px solid #ccc; } } #search-result-content .search-line { height: 1px; background-color: #ccc; } #search-result-content .result-box { padding: 18px 0; margin: 0 18px; } #search-result-content .lighter-grey { background-color: #f5f5f5; } #search-result-content .search-icon { padding-left: 30px; padding-right: 5px; } #search-result-content .searchResult { padding-left: 0px; } #search-result-content .searchResult a { color: #666; } #search-result-content .searchResult .row-title, #search-result-content .searchResult .row-content { margin: 0; padding-bottom: 0px; font-size: 130%; } #search-result-content .searchResult .row-title { font-weight: bold; } #search-result-content .modal.faq-detail .modal-dialog { position: relative; margin-top: 33%; } #search-result-content .modal.faq-detail .modal-dialog .modal-content { padding: 20px 15px; } #search-result-content .modal.faq-detail .modal-dialog .modal-content .label-q { color: #666; font-size: 18px; padding-right: 15px; } @media screen and (min-width: 992px) { #search-result-content .modal.faq-detail .modal-dialog .modal-content .label-q { padding: 3px 25px 10px 0; } } #search-result-content .modal.faq-detail .modal-dialog .modal-content p { padding-left: 30px; } @media screen and (min-width: 992px) { #search-result-content .modal.faq-detail .modal-dialog .modal-content p { padding: 5px 25px 5px 40px; } } @media screen and (min-width: 992px) { #search-result-content .modal.faq-detail .modal-dialog .modal-content { padding: 25px 30px; } } #search-result-content .modal.faq-detail .modal-dialog .close { margin-bottom: 8px; } @media screen and (min-width: 768px) { #search-result-content .modal.faq-detail .modal-dialog { margin-top: 15%; } } #search-result-content .nav-tabs { margin-top: 25px; padding: 0; } @media screen and (min-width: 768px) { #search-result-content .nav-tabs { border: none; } } @media screen and (min-width: 768px) { #search-result-content .nav-tabs li { margin-top: 5px; width: 200px; text-align: center; border-bottom: 3px solid #a6bcc9; } } @media screen and (min-width: 768px) { #search-result-content .nav-tabs li a { margin-left: 2px; margin-bottom: -2px; } } @media screen and (min-width: 768px) { #search-result-content .nav-tabs li a { padding: 5px 15px; } } @media (min-width: 768px) { #search-result-content { padding-bottom: 50px; /*.search-total { padding-top: 40px; }*/ } #search-result-content input:focus { border-color: #ccc; box-shadow: none; } #search-result-content input { height: 50px; background: transparent; border: 0; z-index: 10; position: relative; box-shadow: none; } #search-result-content button { width: 100%; text-align: left; color: #666; } #search-result-content button:hover, #search-result-content button:focus { background-color: #fff; } #search-result-content .form-group { margin-bottom: 0; } #search-result-content .rounded-field { position: absolute; height: 30px; width: 100%; top: 10px; left: 10px; z-index: 0; } #search-result-content .searchButton { z-index: 1; position: absolute; top: 15px; right: -25px; width: 20px; } #search-result-content .search-line { height: 1px; background-color: #ccc; margin-left: 15px; } #search-result-content .result-box { padding: 20px 20px; } #search-result-content .lighter-grey { background-color: #f5f5f5; } #search-result-content .search-icon { padding-left: 15px; padding-right: 20px; } #search-result-content .searchResult { padding-left: 0px; } #search-result-content .searchResult .row-title, #search-result-content .searchResult .row-content { margin: 0; padding-bottom: 0px; font-size: 140%; } } /*@media (min-width: $screen-md) { #search-result-content { .search-total { padding-top: 16px; } } }*/ /* ------------------------------ SITEMAP ------------------------------ */ @media (min-width: 768px) and (max-width: 991px) { #page-sitemap { margin-left: 20px; margin-right: 20px; } } #page-sitemap #sitemap { padding-top: 10px; padding-left: 5px; border-top: 1px solid #ccc; padding-bottom: 30px; font-size: 130%; } #page-sitemap #sitemap a { text-decoration: none; color: #666; line-height: 20px; } #page-sitemap #sitemap .category { margin-bottom: 20px; } #page-sitemap #sitemap .category .title { color: #002c71; line-height: 30px; } #page-sitemap #sitemap .category .hotline { margin-bottom: 15px; } #page-sitemap #sitemap .category .hotline .title { color: #666; } #page-sitemap #sitemap .category .hotline .hotline-number { color: #002c71; line-height: 17px; } #page-sitemap #sitemap .category .services { line-height: 24px; margin-bottom: 15px; } #page-sitemap #sitemap .category .services a { color: #4c90cc; } #page-sitemap #sitemap .sitemap-divider { margin-bottom: 10px; height: 1px; background-color: #ccc; } /* ------------------------------ INFOTAINMENT ------------------------------ */ #infotainment .row { margin: 0; } #infotainment .row h1.page-title { margin-left: -15px; } #infotainment .row.content-area { margin-top: 38px; } @media screen and (min-width: 992px) { #infotainment .row.content-area { margin-top: 24px; } } #infotainment .content-area > div { padding: 0; } #infotainment .content-area .box-mobile > .row .title a { text-align: center; } @media screen and (min-width: 768px) { #infotainment .content-area .box-mobile > .row .title a { text-align: left; } } #infotainment .content-area .box-mobile > .row .title a img { display: inline; vertical-align: middle; } /* ------------------------------ E SMART HEALTH ------------------------------ */ #e-smart-health { /*margin-top: 15px; margin-bottom: 30px;*/ /*.box-store .row { padding: 60px 0 50px; }*/ } #e-smart-health .row { margin: 0; } #e-smart-health .row h1.page-title { margin-left: -15px; } @media screen and (min-width: 768px) { #e-smart-health .row.content-area { margin-top: 38px; } } @media screen and (min-width: 992px) { #e-smart-health .row.content-area { margin-top: 24px; } } #e-smart-health .content-area > div { padding: 0; } /* ------------------------------ HOME PHONE ------------------------------ */ #home-phone { /*margin-top: 15px; margin-bottom: 30px;*/ } #home-phone .row { margin: 0; } #home-phone .row h1.page-title { margin-left: -15px; } #home-phone .row.content-area { margin-top: 38px; } @media screen and (min-width: 992px) { #home-phone .row.content-area { margin-top: 24px; } } #home-phone .content-area > div { padding: 0; } #home-phone .content-area .box-mobile > .row .title a { text-align: center; } @media screen and (min-width: 768px) { #home-phone .content-area .box-mobile > .row .title a { text-align: left; } } #home-phone .content-area .box-mobile > .row .title a img { display: inline; vertical-align: middle; } #home-phone .box .link .link-icon { top: 5px; } @media screen and (min-width: 768px) { #home-phone .box .link .link-icon { top: 2px; } } /* ------------------------------ AT THE OFFICE PAGE ------------------------------ */ #at-the-office .carousel-wrapper { margin-bottom: 15px; } @media (min-width: 768px) { #at-the-office .carousel-wrapper { margin-bottom: 25px; } } #at-the-office .box-wrapper { margin-top: 10px; } @media (min-width: 768px) { #at-the-office .box-wrapper { padding: 0 45px; margin-top: 25px; } } @media (min-width: 992px) { #at-the-office .box-wrapper { padding: 0 5px; } } #at-the-office .box-wrapper .box { padding: 10px 10px; border-bottom: 2px solid #ccc; /*.link-icon { position: absolute; top: 10px; right: 25px; z-index: 10; @media (min-width: $screen-sm) { top: 5px; left: 110px; } }*/ } #at-the-office .box-wrapper .box .title a { display: block; text-decoration: none; outline: none; color: #03437e; font-size: 16px; } @media (min-width: 768px) { #at-the-office .box-wrapper .box .title a { font-size: 18px; padding-bottom: 10px; } } #at-the-office .box-wrapper .box .link a { outline: none; text-decoration: none; } @media (min-width: 768px) { #at-the-office .box-wrapper .box { border-bottom: 0; margin-bottom: 40px; padding-top: 0; } #at-the-office .box-wrapper .box .row.box-content { margin: 0; padding: 20px 10px; } #at-the-office .box-wrapper .box .content { min-height: 70px; } } #at-the-office .box-wrapper .box-content { height: auto; } #at-the-office #intro-text { padding: 0 6px; } @media (min-width: 768px) { #at-the-office #intro-text { padding: 0 45px; } } @media (min-width: 992px) { #at-the-office #intro-text { padding: 0 20px; } } .detail-card { margin-bottom: 0; padding-left: 0; padding-right: 0; } .detail-card .detail-header { padding: 15px 10px; position: relative; border-bottom: 2px solid #178be2; } .detail-card .detail-header a { display: block; text-decoration: none; outline: none; color: #03437e; font-size: 170%; } .detail-card .detail-header .detail-icon { position: absolute; width: 40px; height: 40px; top: 0; right: 10px; background: url(../img/sprite-detail-icons.png) no-repeat; } .detail-card .detail-header .detail-icon.enterprise { background-position: 0 0; } .detail-card .detail-header .detail-icon.sme { background-position: -40px 0; } .detail-card .detail-header .detail-icon.public-sector { background-position: -80px 0; } .detail-card .detail-content { padding: 10px; margin-bottom: 20px; min-height: 100px; } .detail-card .detail-more { border-top: 1px solid #ccc; padding: 5px 10px; border-bottom: 1px solid #ccc; } .detail-card .detail-more a { color: #666; display: block; outline: none; text-decoration: none; font-weight: bold; } .detail-card .detail-more a .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 11px; display: inline-block; } @media screen and (min-width: 768px) { .detail-card .detail-more a .link-icon { width: 14px; line-height: 25px; padding-left: 8px; } } @media (min-width: 768px) { .detail-card { padding-left: 10px; padding-right: 10px; margin-bottom: 35px; } } .operation-box { margin-bottom: 0; padding: 0 10px 10px 10px; border-bottom: 2px solid #ccc; } .operation-box .operation-content h2 { color: #03437e; font-size: 16px; } @media (min-width: 768px) { .operation-box .operation-content h2 { font-size: 18px; } } .operation-box .operation-link { display: block; color: #03437e; outline: none; text-decoration: none; padding: 9px 0; position: relative; font-size: 130%; } @media (min-width: 768px) { .operation-box .operation-link { font-size: 160%; } } .operation-box .operation-link .link-icon { /*position: absolute; top: 12px; right: 5px; color: #1d8fe3;*/ background: url(../img/arrow-blue-6x11.png) left center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 11px; float: right; margin-right: 15px; } @media screen and (min-width: 768px) { .operation-box .operation-link .link-icon { height: 25px; margin-right: 0; } } @media (min-width: 768px) { .operation-box { border-bottom: 0; margin-bottom: 35px; } .operation-box .operation-content-wrapper { border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } } /* ------------------------------ SME PAGE - some styles also apply to enterprises page ------------------------------ */ .sme-enterprises #intro-text { font-size: 110%; padding: 0 8px; } @media (min-width: 768px) { .sme-enterprises #intro-text { font-size: 140%; padding: 0 40px; } } @media (min-width: 992px) { .sme-enterprises #intro-text { padding: 0 20px; } } .sme-enterprises a .link-label { color: #03437e; } .sme-enterprises #box-sme-offers .box-cover-photo { background: url(../img/sprite-detail-icons.png) no-repeat; background-position: -40px 0; width: 40px; height: 40px; margin-right: 10px; position: absolute; top: 0; right: 0; } @media (min-width: 768px) { .sme-enterprises #box-sme-offers .box-cover-photo { background-position: -120px 20px; height: 65px; position: relative; margin: 0 auto; } } @media (min-width: 768px) { .sme-enterprises #box-sme-offers .box-link-label { padding-top: 0; padding-bottom: 20px; } .sme-enterprises #box-sme-offers .box-link-label .link-label, .sme-enterprises #box-sme-offers .box-link-label .link-icon { float: none; display: block; margin: 0 auto; } .sme-enterprises #box-sme-offers .box-link-label .link-label { text-align: center; padding: 18px 0; } } /* ------------------------------ PRODUCTS AND SOLUTIONS ------------------------------ */ #products-and-solutions a .link-label { color: #03437e; } /* ------------------------------ ENTERPRISES PAGE ------------------------------ */ #enterprises { /*.box-wrapper { margin-top: 0; @media (min-width: $screen-sm) { margin-top: 25px; } }*/ } #enterprises a .link-label { color: #03437e; } /* ------------------------------ FOR YOUR HOME ------------------------------ */ #for-your-home .row { margin: 0; } #for-your-home .row h1.page-title { margin-left: -15px; } @media screen and (min-width: 768px) { #for-your-home .row.content-area { margin-top: 38px; } } @media screen and (min-width: 992px) { #for-your-home .row.content-area { margin-top: 24px; } } #for-your-home .title .title-icon { //width: 34px; //max-height: 100%; width: auto; height: 28px; float: right; } @media screen and (min-width: 768px) { #for-your-home .title .title-icon { width: auto; height: 28px; } } #for-your-home .title #title-icon-home-phone { width: 20px; margin: 0 7px; } @media screen and (min-width: 768px) { #for-your-home .title #title-icon-home-phone { margin: 0; } } #for-your-home .content-area { /*.main-content { @media screen and (min-width: $screen-md) { margin-left: -5px; } }*/ } #for-your-home .content-area > div { padding: 0; } @media screen and (min-width: 992px) { #for-your-home .content-area { position: relative; } } #for-your-home .content-area .content { padding: 0 17px; } @media screen and (min-width: 768px) { #for-your-home .box { height: 100%; } } @media screen and (min-width: 768px) { #for-your-home .box .title { /*padding: 0 18px;*/ padding: 0 8px; } } @media screen and (min-width: 768px) and (min-width: 768px) { #for-your-home .box .title a { line-height: 30px; } } @media screen and (min-width: 768px) { #for-your-home .box .content { padding: 0; } } @media screen and (min-width: 768px) { #for-your-home .box .content .text { padding: 0 15px; } } @media screen and (min-width: 768px) { #for-your-home .box .link { margin-top: 15px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } } #for-your-home .box .line { padding: 0; } @media screen and (min-width: 768px) { #for-your-home .box .divider { margin-top: 7px; } } @media screen and (min-width: 768px) { #for-your-home .box .box-mobile { height: 70px; } } @media screen and (min-width: 768px) { #for-your-home .box .box-mobile.empty-box { height: 65px; } } #for-your-home .box .box-mobile > .row { padding: 0; min-height: 50px; } @media screen and (min-width: 768px) { #for-your-home .box .box-mobile > .row .title { padding: 0 10px; } } #for-your-home .box .box-mobile > .row .title a { display: block; line-height: 45px; text-align: center; } @media screen and (min-width: 768px) { #for-your-home .box .box-mobile > .row .title a { line-height: 55px; } } #for-your-home .box .box-mobile > .row .title a img { display: inline-block; } #for-your-home .embed-responsive { padding-bottom: 70px; } @media (min-width: 768px) { #for-your-home .embed-responsive { padding-bottom: 33.33333%; } } @media screen and (min-width: 992px) { #for-your-home .embed-responsive { position: absolute; left: 700px; top: 20px; } } #for-your-home .embed-responsive .embed-responsive-item { padding: 25px 0; text-decoration: none; } @media (min-width: 768px) { #for-your-home .embed-responsive .embed-responsive-item { padding: 4% 0; } } #for-your-home .embed-responsive .embed-responsive-item .grid-title-mobile { padding: 0 20px; color: #03437e; font-size: 16px; } #for-your-home .embed-responsive .embed-responsive-item .grid-title-mobile .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 22px; margin-right: 15px; float: right; } @media screen and (min-width: 768px) { #for-your-home .embed-responsive .embed-responsive-item .grid-title-mobile .link-icon { line-height: 25px; margin-right: 0; margin-left: 8px; } } #for-your-home .embed-responsive .embed-responsive-item .grid-title { background: url(../img/grid-link-bg-white.png) transparent; font-size: 16px; color: #03437e; margin: 0 5px; min-height: 24px; padding: 4px 0; position: absolute; left: 0; right: 0; bottom: -1px; z-index: 990; } #for-your-home .embed-responsive .img-responsive { padding: 0 24% 4%; width: 100%; } @media (min-width: 768px) { #for-your-home .embed-responsive .img-responsive { float: left; padding: 0 5px; width: 100%; height: auto; } } @media (min-width: 992px) { #for-your-home .related-content #recommend { /*margin-top: 275px; position: absolute; top: 32%; right: 0;*/ } } #for-your-home #recommend { /*@media (min-width: $screen-md) { padding-right: 0; } .line { @media (min-width: $screen-md) { padding-right: 0; } }*/ } @media screen and (min-width: 768px) { #for-your-home #recommend .title { padding: 0 13px; } } @media screen and (min-width: 768px) { #for-your-home #recommend .product { padding: 0 11px; } } /* ------------------------------ MY ACCOUNTS PAGE ------------------------------ */ .page-my-accounts .live-chat-img { margin-bottom: 15px; } .page-my-accounts .content-area-drop { margin-top: 30px; background: #eef3f9; } @media (min-width: 768px) { .page-my-accounts .content-area-drop .dr-list { padding-left: 10px; } } .page-my-accounts .content-area-drop select { width: 100%; height: 35px; margin-top: 30px; border: none; color: #acacac; } @media (min-width: 768px) { .page-my-accounts .content-area-drop select { width: 360px; } } @media (min-width: 992px) { .page-my-accounts .content-area-drop select { width: 290px; } } @media (min-width: 768px) { .page-my-accounts .content-area-drop { margin: 30px 15px 0 15px; } } .page-my-accounts .content-area { background: #eef3f9; padding-bottom: 20px; } .page-my-accounts .content-area .accts-row { margin: 0; } @media (min-width: 768px) { .page-my-accounts .content-area .accts-row { margin: 0 -15px; } } @media (min-width: 768px) { .page-my-accounts .content-area { margin: 0 15px; } } .page-my-accounts .box-mobile { height: 100%; position: relative; margin-top: 15px; } .page-my-accounts .box-mobile .box-content { width: 100%; float: left; padding-top: 25px; padding-bottom: 30px; background: #fff; } .page-my-accounts .box-mobile .box-content .title a > img { margin: auto 10px; } @media (min-width: 768px) { .page-my-accounts .box-mobile .box-content .title a > img { float: left; min-height: 35px; } } .page-my-accounts .box-mobile .box-content .line { padding: 0 10px; } .page-my-accounts .box-mobile .box-content .line .divider { margin-top: 10px; margin-bottom: 15px; width: 100%; height: 2px; background-color: #178be2; } .page-my-accounts .box-mobile .box-content .content { height: 100%; width: 100%; padding: 0 15px 30px; } .page-my-accounts .box-mobile .box-content .content > h4 { font-size: 14px; font-weight: bold; color: #666; } @media screen and (min-width: 768px) { .page-my-accounts .box-mobile .box-content .content > h4 { float: left; } } .page-my-accounts .box-mobile .box-content .content .user-ID { margin: 0 0 20px; float: left; font-size: 14px; line-height: 14px; color: #666; } @media screen and (min-width: 768px) { .page-my-accounts .box-mobile .box-content .content .user-ID { clear: both; } } .page-my-accounts .box-mobile .box-content .content a { display: block; width: 100%; height: 45px; font-size: 14px; line-height: 48px; text-decoration: none; border-bottom: 1px solid #e1e1e1; } .page-my-accounts .box-mobile .box-content .content a .acct-box-sec-title { color: #666; } .page-my-accounts .box-mobile .box-content .content a .link-icon { background: url(../img/arrow-blue-dotted-5x9.png) right center no-repeat; width: 6px; height: 22px; margin-right: 15px; float: right; margin-top: 13px; } .page-my-accounts .box-mobile .box-content .content a .link-icon-new-window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; width: 13px; height: 13px; display: inline-block; margin-top: 15px; } .page-my-accounts .box-mobile .box-content .content a.empty-sec { border-bottom: none; } @media (min-width: 768px) { .page-my-accounts .box-mobile { margin-top: 10px; padding: 0 5px; } } /* Page - My Profile */ /** * general box LO proposal */ .page-my-profile .page-title { margin: 0 0 30px 0; } .page-my-profile .row-box { margin: 0 4px; padding: 4px 0; } @media (min-width: 768px) { .page-my-profile .tab-content .tab-box { padding: 5px 8px !important; } } .page-my-profile .box { height: auto; padding: 5px 15px; } @media (min-width: 768px) { .page-my-profile .box { padding: 5px 4px; } } .page-my-profile .box .box-content { background-color: #fff; padding: 10px 10px 35px; } @media (max-width: 768px) { .page-my-profile .box .box-content { float: left; padding: 10px 20px 35px; } } @media (max-width: 768px) { .page-my-profile .box .box-content .form-group { float: left; } } @media (max-width: 768px) { .page-my-profile .box .box-content .form-group label { width: 50%; float: left; } } @media (max-width: 768px) { .page-my-profile .box .box-content .form-group span.display-value { width: 50%; } } .page-my-profile .box .box-content .form-group .visible { -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 768px) { .page-my-profile .box .box-content .form-group .visible { width: 50%; } } .page-my-profile .box .title { padding: 0; } @media (max-width: 768px) { .page-my-profile .box .title img { max-height: 29px; } } .page-my-profile .box .divider { border-top: 1px solid #178be2; width: auto; margin: 10px -5px 15px; } @media (min-width: 768px) { .page-my-profile .box .divider { margin: 15px -10px 15px -10px; } } /** * page specific LO */ .page-my-profile h2 { color: #666; font-size: 13px; margin-top: 10px; } @media (min-width: 768px) { .page-my-profile h2 { font-size: 20px; } } .page-my-profile .checkbox-label-left { margin: 0; padding-top: 8px; line-height: 20px; } @media (min-width: 768px) { .page-my-profile .checkbox-label-left { padding: 20px 0 10px; } } .page-my-profile .checkbox-label-left label { padding-left: 0; } .page-my-profile .checkbox-label-left input[type=checkbox] { margin-left: 10px; } .page-my-profile .box-account-toggle h2 { text-align: center; margin-bottom: 18px; } .page-my-profile .box-account-toggle .divider { border-top: 1px solid #ececec; background-color: transparent; margin: 0; } .page-my-profile .box-account-toggle .description { margin-bottom: 18px; text-align: center; } .page-my-profile .box-account-toggle .form-group { overflow: hidden; padding: 0 5px; } @media (min-width: 768px) { .page-my-profile .box-account-toggle .form-group { padding: 0 10px; } } .page-my-profile .box-account-toggle .form-group > label { float: left; font-weight: normal; } .page-my-profile .box-account-toggle .form-group > label.radio-inline { width: auto; margin-left: 10px; } .page-my-profile .box-account-toggle .form-group > label.radio-inline input[type="radio"] { width: auto; } .page-my-profile .box-account-toggle .form-group input[type="radio"] { margin-top: 1px; } @media (min-width: 768px) { .page-my-profile .box-account-toggle .form-group input[type="radio"] { margin-top: 3px; } } .page-my-profile .box-content .title .btn-edit { color: #666; font-size: 11px; margin-left: 18px; padding-left: 14px; } @media (min-width: 768px) { .page-my-profile .box-content .title .btn-edit { font-size: 14px; margin-left: 20px; background: url(../img/arrow-blue-dotted-5x9.png) left center no-repeat; } } .page-my-profile .box-content .title img { margin: 0; } @media (min-width: 768px) { .page-my-profile .box-content .title img { min-height: 0; height: 35px; } } .page-my-profile .form-group { margin: 8px 0; width: 100%; } .page-my-profile .form-group label, .page-my-profile .form-group .form-control, .page-my-profile .form-group .display-value { width: 100%; color: #666; font-size: 11px; } @media (min-width: 768px) { .page-my-profile .form-group label, .page-my-profile .form-group .form-control, .page-my-profile .form-group .display-value { font-size: 14px; width: 80%; } } .page-my-profile .form-group label, .page-my-profile .form-group .display-value { vertical-align: top; } .page-my-profile .form-group .display-value { padding: 5px 5px 5px 0; display: inline-block; } .page-my-profile .form-group .form-control { padding: 5px; } .page-my-profile .form-group .form-control { height: auto; } .page-my-profile .form-group .display-value { padding-top: 0; } .page-my-profile .form-group label { font-weight: bold; width: 100%; } .page-my-profile .dropdown-my-profile, .page-my-profile .box-wrap-my-hkt, .page-my-profile .tab-pane { background: #eef3f9; } .page-my-profile .dropdown-my-profile { margin: 18px 0 0; padding: 10px 10px 0; } .page-my-profile .myhkt-basic-info .box-content { padding: 20px; } .page-my-profile .myhkt-basic-info .info-col { width: 100%; } @media (min-width: 768px) { .page-my-profile .myhkt-basic-info .info-col { width: 50%; } } @media (min-width: 992px) { .page-my-profile .myhkt-basic-info .info-col { width: 40%; } } @media (min-width: 768px) { .page-my-profile .myhkt-basic-info .info-col label { width: 50%; } } @media (min-width: 992px) { .page-my-profile .myhkt-basic-info .info-col label { width: 40%; } } @media (min-width: 768px) { .page-my-profile .myhkt-basic-info .info-col .display-value { width: 50%; } } @media (min-width: 992px) { .page-my-profile .myhkt-basic-info .info-col-right { width: 55%; } } .page-my-profile .myhkt-service-info { margin-top: 30px; padding-bottom: 10px; } @media (max-width: 767px) { .page-my-profile .myhkt-service-info .tabs-account { padding-left: 30px; padding-right: 30px; padding-top: 20px; } } .page-my-profile .myhkt-service-info .tabs-account .nav-tabs { border-bottom: transparent; padding: 0; } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs .class-all { width: 12%; } } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs .class-fix { width: 29%; } } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs .class-net { width: 29%; } } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs .class-common { width: 15%; } } .page-my-profile .myhkt-service-info .tabs-account .nav-tabs li a { margin-right: 2px; } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs li a { text-align: center; } } .page-my-profile .myhkt-service-info .tabs-account .nav-tabs li:last-child a { margin-right: 0; } @media (max-width: 768px) { .page-my-profile .myhkt-service-info .tabs-account .nav-tabs li:last-child a { margin-right: 2px; } } .page-my-profile .myhkt-service-info .allAccountInfo { float: left; margin-top: 10px; margin-bottom: 16px; width: 80%; } @media screen and (min-width: 768px) { .page-my-profile .myhkt-service-info .allAccountInfo { margin-top: 24px; margin-left: 14px; } } .page-my-profile .myhkt-service-info .allAccountInfo .enabled-mark { float: left; margin-left: 8px; height: auto; width: 20px; } .page-my-profile .myhkt-service-info .allAccountInfo label { margin-left: 15px; float: left; font-size: 14px; font-weight: normal; } @media screen and (min-width: 992px) { .page-my-profile .myhkt-service-info .allAccountInfo label { margin-left: 5px; } } .page-my-profile .myhkt-service-info .allAccountInfo .all-account { float: left; margin-top: 4px; margin-left: 8px; } @media screen and (min-width: 992px) { .page-my-profile .myhkt-service-info .box-content .form-group { height: 31px; } } @media screen and (min-width: 768px) { .page-my-profile .myhkt-service-info .box-content .form-group .display-value, .page-my-profile .myhkt-service-info .box-content .form-group input { width: 50%; } } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .box-content .form-group input[type="radio"] { width: auto; } } .page-my-profile .myhkt-service-info .list-services { list-style: none; margin-top: 10px; padding-left: 0; } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .list-services { padding-left: 10px; } } .page-my-profile .myhkt-service-info .list-services li { margin-bottom: 15px; } .page-my-profile .myhkt-service-info .list-services li a { color: #666; padding-left: 20px; background: url(../img/arrow-bullet.png) left center no-repeat; } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .box-content label { width: 40%; } } @media (min-width: 768px) { .page-my-profile .myhkt-service-info .box-content label { width: 50%; } } #page-individual-service { background-color: #fff; } #tabs-individual-service ul { position: relative; margin-top: 18px; } @media (min-width: 768px) { #tabs-individual-service ul { margin: 30px 0 5px; } } #tabs-individual-service ul li.link-pull-right .tab-indicator { background: url(../img/arrow-blue-6x11.png) center center no-repeat; display: inline-block; height: 22px; float: right; } @media (min-width: 768px) { #tabs-individual-service ul li.link-pull-right .tab-indicator { float: none; height: 13px; } } .faq-accordian .panel-heading .accordian-toggle, .faq-accordian .panel-body .accordian-toggle { background: url(../img/faq-accordian-toggle.png) no-repeat; background-position: 0 0; width: 17px; height: 17px; display: block; } .faq-accordian .panel { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .faq-accordian .panel .panel-heading { position: relative; background-color: #ebebeb; padding: 0; -webkit-border-radius: 0 0; -moz-border-radius: 0 / 0; border-radius: 0 / 0; } .faq-accordian .panel .panel-heading h4 { font-size: 100%; } .faq-accordian .panel .panel-heading h4 a { color: #666; text-decoration: none; padding: 16px 27px 16px 10px; display: block; } @media (min-width: 768px) { .faq-accordian .panel .panel-heading h4 a { padding: 16px 37px 16px 20px; } } .faq-accordian .panel .panel-heading h4 .accordian-toggle { position: absolute; top: 15px; right: 10px; } @media (min-width: 768px) { .faq-accordian .panel .panel-heading h4 .accordian-toggle { top: 18px; right: 20px; } } .faq-accordian .panel .panel-heading .label-q { color: #a1a1a1; margin-right: 10px; font-size: 14px; /*font-size: 116%;*/ } @media (min-width: 768px) { .faq-accordian .panel .panel-heading .label-q { font-size: 18px; /*font-size: 130%;*/ margin-right: 20px; } } .faq-accordian .panel.even .panel-heading { background-color: #f5f5f5; } .faq-accordian .panel.expanded .panel-heading, .faq-accordian .panel.expanded .panel-body { background-color: #fff; } .faq-accordian .panel.expanded .panel-heading .accordian-toggle, .faq-accordian .panel.expanded .panel-body .accordian-toggle { background-position: 0 -25px; } .faq-accordian .panel.expanded .panel-heading .label-q { color: #666; } .faq-accordian .panel-body { border: 0 none !important; color: #666; font-size: 120%; font-weight: bold; padding: 0 25px 15px 30px; } @media (min-width: 768px) { .faq-accordian .panel-body { padding-left: 55px; padding-right: 40px; } } .faq-accordian .panel-body a[data-toggle=collapse] { float: right; margin: 10px -15px 0 0; } @media (min-width: 768px) { .faq-accordian .panel-body a[data-toggle=collapse] { margin-right: -20px; } } #page-recommended-for-you #intro-text { font-size: 110%; padding: 0 8px; } @media (min-width: 768px) { #page-recommended-for-you #intro-text { font-size: 140%; padding: 0 40px; } } @media (min-width: 992px) { #page-recommended-for-you #intro-text { padding: 0 20px; } } #page-recommended-for-you a .link-label { color: #03437e; } #page-recommended-for-you .box-cta-wrapper { padding: 0 10px; } @media (min-width: 768px) { #page-recommended-for-you .box-cta-wrapper { padding: 0 30px; } } @media (min-width: 992px) { #page-recommended-for-you .box-cta-wrapper { padding: 0 5px; } } #page-recommended-for-you .box-cta-wrapper .box-item { padding: 10px 5px; } @media (min-width: 768px) { #page-recommended-for-you .box-cta-wrapper .box-item { padding: 10px; } } #page-recommended-for-you .box-cta-wrapper .box-link-label { font-size: 100%; padding: 7px 8px; } @media screen and (min-width: 480px) { #page-recommended-for-you .box-cta-wrapper .box-link-label { font-size: 16px; padding: 13px 10px; } } @media screen and (min-width: 768px) { #page-recommended-for-you .box-cta-wrapper .box-link-label { font-size: 20px; padding: 13px 15px; } } #page-recommended-for-you .box-cta-wrapper .box-link-label .link-label { width: 80%; } @media (min-width: 768px) { #page-recommended-for-you .box-cta-wrapper .box-link-label .link-label { width: 90%; } } #page-recommended-for-you .box-cta-wrapper .box-link-label .link-icon { background: url(../img/arrow-blue-5x9.png) center center no-repeat transparent; width: 9px; height: 9px; margin-top: 3px; float: right; /*@media screen and (min-width: $screen-sm) { margin-top: 9px; }*/ } @media screen and (min-width: 480px) { #page-recommended-for-you .box-cta-wrapper .box-link-label .link-icon { background: url(../img/arrow-blue-6x11.png) center center no-repeat transparent; width: 13px; height: 13px; margin-top: 5px; } } /* ------------------------------ INTERNET ------------------------------ */ #internet { /*margin-top: 15px; margin-bottom: 30px;*/ } #internet .row { margin: 0; } #internet .row h1.page-title { margin-left: -15px; } #internet .row.content-area { margin-top: 38px; } @media screen and (min-width: 992px) { #internet .row.content-area { margin-top: 24px; } } #internet .content-area > div { padding: 0; } @media screen and (min-width: 768px) { #internet .content-area .box-mobile > .row .title { height: 38px; } } #internet .content-area .box-mobile > .row .title a { text-align: center; } @media screen and (min-width: 768px) { #internet .content-area .box-mobile > .row .title a { text-align: left; } } #internet .content-area .box-mobile > .row .title a img { display: inline; vertical-align: middle; } /* ------------------------------ COVERAGE MAP ------------------------------ */ /*#coverage-map { padding-right: 5px; @media screen and (min-width: $screen-sm) { margin-top: 10px; margin-bottom: 10px; padding-left: 5px; } @media screen and (min-width: $screen-md) { margin-top: 10px; } a { color: #03437e; text-decoration: none; } .icon { padding: 0; @media screen and (min-width: $screen-sm) { padding-right: 5px; } } .title, .link { line-height: 45px; @media screen and (min-width: $screen-sm) { padding-right: 0; } } .title { padding-left: 15px; font-size: 17px; font-family: Lato-Bold; } .link { a { color: #1d8fe3; font-size: 14px; } } }*/ /* ------------------------------ HKT PREMIER ------------------------------ */ #hkt-premier .row { margin: 0; } #hkt-premier .row h1.page-title { margin-left: -15px; } #hkt-premier .content-area > div { padding: 0; } @media screen and (min-width: 768px) { #hkt-premier .content-area .content-wrapper { float: left; } } #hkt-premier .content-area .content-wrapper .content { padding: 20px; } @media screen and (min-width: 768px) { #hkt-premier .content-area .store-wrapper { float: right; } } @media screen and (min-width: 992px) { #hkt-premier .content-area .store-wrapper { float: left; } } #hkt-premier .content-area .link-wrapper { padding-top: 25px; } #hkt-premier .content-area .link-wrapper a { text-decoration: none; font-weight: bold; } #hkt-premier .content-area .link-wrapper a .text { color: #666; } #hkt-premier .content-area .link-wrapper a .link-icon { color: #1d8fe2; } #hkt-premier .content-area .link-wrapper a .link-icon-new-window { background: url(../img/icon-new-window-13x13.png) right center no-repeat; width: 13px; height: 13px; display: inline-block; margin-left: 8px; } /* ------------------------------ CUSTOMER SERVICE ------------------------------ */ #customer-services { /*margin-top: 15px; margin-bottom: 30px;*/ } #customer-services .row { margin: 0; } #customer-services .row h1.page-title { margin-left: -15px; } #customer-services .content-area > div { padding: 0; } @media screen and (min-width: 768px) { #customer-services .content-area .my-hkt-wrapper { padding: 0 9px; } } @media screen and (min-width: 992px) { #customer-services .content-area .my-hkt-wrapper { margin-top: 10px; margin-bottom: 5px; } } #customer-services .content-area .my-hkt-wrapper .my-hkt { margin: 20px 0; padding: 0; color: #666; background-color: #eef3f9; } @media screen and (min-width: 768px) { #customer-services .content-area .my-hkt-wrapper .my-hkt { margin: 7px 0; } } #customer-services .content-area .my-hkt-wrapper .my-hkt .text { padding: 15px 10px; font-size: 130%; } #customer-services .content-area .my-hkt-wrapper .my-hkt .links { padding: 5px 0; background-color: #cbdbed; } #customer-services .content-area .my-hkt-wrapper .my-hkt .links div { padding: 5px; text-align: center; } #customer-services .content-area .my-hkt-wrapper .my-hkt .links div img { width: 102px; margin: 0 auto; } @media screen and (min-width: 768px) { #customer-services .content-area .my-hkt-wrapper .my-hkt .links div img { width: 112px; } } #customer-services .content-area .my-hkt-wrapper .my-hkt .links .link-label { font-size: 130%; } #customer-services .content-area .my-hkt-wrapper .my-hkt .links .link-label b { color: #03437e; } #customer-services .content-area .related-content-wrapper { padding: 0 4px; } #customer-services .content-area .box { height: 100%; } #customer-services .content-area .box.consumer-support > .row > div, #customer-services .content-area .box.business-customer-support > .row > div { padding: 0; } #customer-services .content-area .box.consumer-support > .row .title, #customer-services .content-area .box.consumer-support > .row .line, #customer-services .content-area .box.consumer-support > .row .link, #customer-services .content-area .box.business-customer-support > .row .title, #customer-services .content-area .box.business-customer-support > .row .line, #customer-services .content-area .box.business-customer-support > .row .link { padding: 0 4px; } #customer-services .content-area .box.consumer-support > .row .title, #customer-services .content-area .box.business-customer-support > .row .title { padding: 0 20px; /* a#category-cs { background: url(../img/cs-customersupport.png) right bottom no-repeat; } a#category-bcs { background: url(../img/cs-business.png) right bottom no-repeat; }*/ } #customer-services .content-area .box.consumer-support > .row .link .link-wrapper, #customer-services .content-area .box.business-customer-support > .row .link .link-wrapper { padding: 0 4px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } #customer-services .content-area .box .box-mobile > .row { padding: 10px 0; } #customer-services .content-area .box .box-mobile .title { padding: 0 10px; } #customer-services .content-area .box .box-mobile .title a { color: #ccc; } #customer-services .content-area .box .box-mobile .title img { margin: 0 auto; } #customer-services .related-content { padding: 0; } #customer-services .related-content .directory { padding: 5px 20px; } @media screen and (min-width: 992px) { #customer-services .related-content .directory { padding: 5px 15px; } } #customer-services .related-content .directory .link-label { width: 90%; font-size: 130%; color: #666; } #customer-services .related-content .directory .link-label:hover { border: none; } #customer-services .related-content .directory .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 18px; display: inline-block; } @media screen and (min-width: 768px) { #customer-services .related-content .directory .link-icon { line-height: 25px; margin-right: 0; margin-left: 8px; } } @media screen and (min-width: 992px) { #customer-services .related-content .directory .link-icon { line-height: 36px; } } /* ------------------------------ CONSUMER SUPPORT ------------------------------ */ #consumer-support .row { margin: 0; } #consumer-support .row h1.page-title { margin-left: -15px; } #consumer-support .content-area { position: relative; } #consumer-support .content-area > div { padding: 0; } #consumer-support .content-area .content { padding: 0 20px 15px 20px; } #consumer-support .content-area .content a { color: #666; font-weight: bold; } #consumer-support .content-area .box-mobile { min-height: 90px; } @media screen and (min-width: 768px) { #consumer-support .content-area .box-mobile { height: 100%; } } #consumer-support .content-area .box-mobile > .row { /* min-height: 80px; */ } #consumer-support .content-area .box-mobile > .row .title { padding: 0 10px; } #consumer-support .content-area .box-mobile > .row .title a { color: #ccc; text-align: center; } #consumer-support .content-area .box-mobile > .row .title a img { display: inline; vertical-align: baseline; width: auto; } @media screen and (min-width: 768px) { #consumer-support .content-area .box-mobile > .row .title a img { margin: auto; } } #consumer-support .content-area .related-content-wrapper { margin-top: 20px; } @media screen and (min-width: 768px) { #consumer-support .content-area .related-content-wrapper { margin-top: 0; } } @media screen and (min-width: 992px) { #consumer-support .content-area .related-content-wrapper { position: absolute; right: 0; margin-top: -9px; } } #consumer-support .content-area .related-content-wrapper .related-content { /*#chat { margin-bottom: 5px; @media screen and (min-width: $screen-sm) { margin-bottom: 10px; padding-left: 15px; } @media screen and (min-width: $screen-md) { margin-top: 0; } a { font-size: 17px; img.icon { width: 55px; } .link-label { color: #03437e; padding-left: 10px; @media screen and (min-width: $screen-sm) { float: left; } } .link-label, .link-icon { line-height: 50px; } .link-icon { background: url(../img/arrow-blue-6x11.png) right center no-repeat; color: #1d8fe3; font-size: 14px; width: 6px; height: 11px; display: inline-block; margin-right: 15px; float: right; @media screen and (min-width: $screen-sm) { line-height: 25px; margin-right: 0; margin-left: 8px; } @media screen and (min-width: $screen-sm) { float: left; padding-left: 10px; } } } }*/ } #consumer-support .content-area .related-content-wrapper .related-content .hotline { padding-top: 10px; font-size: 16px; } @media screen and (min-width: 768px) { #consumer-support .content-area .related-content-wrapper .related-content .hotline { padding-bottom: 10px; } } #consumer-support .content-area .related-content-wrapper .related-content .hotline b { color: #002c71; } /* ------------------------------ My HKT Landing Page ------------------------------ */ .page-myhkt-landing h2, .page-myhkt-landing .box-login-blue .content { margin-bottom: 13px; } @media (min-width: 768px) { .page-myhkt-landing h2, .page-myhkt-landing .box-login-blue .content { margin-bottom: 26px; } } .page-myhkt-landing .box-login-white .content { margin-bottom: 24px; } .page-myhkt-landing h2 { margin-top: 0; text-align: center; } .page-myhkt-landing .content { display: block; width: 100%; text-align: center; } .page-myhkt-landing .box-login-blue { background-color: #eef3f9; overflow: hidden; padding: 15px; margin-bottom: 5px; margin-top: 15px; /*.forgot-password { color: #666; }*/ } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue { margin-top: 30px; padding-left: 35px; padding-right: 35px; } } @media (min-width: 992px) { .page-myhkt-landing .box-login-blue { margin-top: 10px; } } .page-myhkt-landing .box-login-blue .listing-wrap { margin-bottom: 22px; } .page-myhkt-landing .box-login-blue .listing-wrap .listing { width: 47%; } .page-myhkt-landing .box-login-blue .listing-wrap .listing.vertical-line { width: 53%; border-left: 2px solid #a6bcc9; } .page-myhkt-landing .box-login-blue .listing-wrap .title { font-size: 120%; text-align: center; display: block; } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue .listing-wrap .title { font-size: 160%; } } .page-myhkt-landing .box-login-blue .listing-wrap ul { margin-top: 10px; margin-left: 15px; padding-left: 15px; } .page-myhkt-landing .box-login-blue .listing-wrap ul li { font-size: 120%; } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue .listing-wrap ul li { font-size: 140%; } } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue form { width: 220px; margin: 0 auto; } } .page-myhkt-landing .box-login-blue form .form-control { width: 100%; } .page-myhkt-landing .box-login-blue .login-issue { color: #666; font-size: 120%; line-height: 22px; padding: 15px 0; border-top: 1px solid #d5d4d4; } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue .login-issue { font-size: 140%; line-height: 25px; } } .page-myhkt-landing .box-login-blue .login-issue a, .page-myhkt-landing .box-login-blue .login-issue .label-brand { font-weight: bold; } .page-myhkt-landing .box-login-blue .login-issue a { color: #003399; } .page-myhkt-landing .box-login-blue .login-issue a:hover { color: #188ce3; border-bottom: 2px solid #188ce3; } .page-myhkt-landing .box-login-blue .login-issue .label-brand { color: #03437e; } .page-myhkt-landing .box-login-blue .remember-me label, .page-myhkt-landing .box-login-blue .forgot-password { font-weight: bold; font-size: 110%; } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue .remember-me label, .page-myhkt-landing .box-login-blue .forgot-password { font-size: 120%; } } .page-myhkt-landing .box-login-blue .remember-me { margin: 0; } .page-myhkt-landing .box-login-blue .remember-me input[type=checkbox] { margin-top: 0; } @media (min-width: 768px) { .page-myhkt-landing .box-login-blue .remember-me input[type=checkbox] { margin-top: 1px; } } .page-myhkt-landing .box-login-blue input[type=submit] { background: url(../img/btn-login-102x30.png) right top no-repeat; width: 102px; height: 30px; float: right; display: block; margin: 0 0 25px; border: none; } .page-myhkt-landing .box-login-white { border: 1px solid #a6bcc9; padding: 24px 6px; margin-top: 15px; margin-bottom: 12px; } @media (min-width: 768px) { .page-myhkt-landing .box-login-white { margin-top: 20px; } } @media (min-width: 992px) { .page-myhkt-landing .box-login-white { margin-top: 10px; } } .page-myhkt-landing .box-login-white .listing-wrap .listing { width: 50%; padding: 0 4px; } .page-myhkt-landing .box-login-white .listing-wrap .title { color: #03437e; width: 100%; display: block; text-align: center; padding: 4px 0; margin-bottom: 15px; border-bottom: 2px solid #178be2; font-size: 140%; } @media (min-width: 768px) { .page-myhkt-landing .box-login-white .listing-wrap .title { font-size: 180%; } } .page-myhkt-landing .box-login-white .listing-wrap ul { list-style: none; padding-left: 25px; } @media (min-width: 768px) { .page-myhkt-landing .box-login-white .listing-wrap ul { padding-left: 10px; } } .page-myhkt-landing .box-login-white .listing-wrap ul li { margin-bottom: 5px; } .page-myhkt-landing .box-login-white .listing-wrap ul li a { color: #666; padding-left: 20px; background: url(../img/arrow-bullet.png) left center no-repeat; } /* ------------------------------ Board and Management ------------------------------ */ #board-and-mgt { /* -- Staff list region css -- */ /* -- Drop down menu css -- */ /* -- Nav bar css -- */ /* -- style for teams list (Board of directors & Management team -- */ } #board-and-mgt .staff-cell { font-size: 120%; margin-bottom: 10px; min-height: 115px; } @media (min-width: 768px) { #board-and-mgt .staff-cell { min-height: 110px; margin-bottom: 0; font-size: 140%; } } #board-and-mgt .name { color: #03437e; font-weight: bold; margin-bottom: 0; } #board-and-mgt .pos { color: #666; } #board-and-mgt .border-side { padding: 0 0; height: 40px; width: 9px; } #board-and-mgt .border-left { padding: 0 0; width: 7%; } #board-and-mgt .border-mid { width: 86%; background-image: url("../img/border-mid.png"); background-size: auto 40px; padding: 12px 0; height: 40px; } @media (min-width: 768px) { #board-and-mgt .border-mid { background-image: none; background-size: 0 0; padding: 0 20px; height: auto; } } #board-and-mgt .border-right { padding: 0 0; width: 7%; } #board-and-mgt .menu-title .arrow { padding-top: 5px; width: 13px; } #board-and-mgt #dynamic-wrapper { margin: 14px 8px 0; } #board-and-mgt #dynamic-wrapper a[data-toggle=dropdown] { font-size: 140%; padding: 10px; margin-bottom: 20px; display: block; border: 1px solid #ccc; } #board-and-mgt .drop-down-item { font-size: 14px; color: #666; padding: 5px 30px; } @media (min-width: 768px) { #board-and-mgt .drop-down-item { font-size: 16px; } } #board-and-mgt .nav-tabs { border-bottom-color: #a6bcc9; border-bottom-width: 3px; padding-left: 0; } #board-and-mgt .nav-tabs li { border-left: 1px solid #fff; border-right: 1px solid #fff; } #board-and-mgt .nav-tabs li a { margin-right: 0; } #board-and-mgt .nav-tabs .active { background-color: #006ea5; } #board-and-mgt .nav-tabs .active a { background-color: #006ea5; color: #fff; border-color: #006ea5; } #board-and-mgt .nav-tabs .inactive { background-color: #a6bcc9; } #board-and-mgt .nav-tabs .inactive a { background-color: #a6bcc9; color: #fff; } #board-and-mgt .nav-tabs .inactive a:hover { border-color: #a6bcc9; } @media (min-width: 768px) { #board-and-mgt .tab-content { margin-top: 20px; } #board-and-mgt .tab-pane { padding: 0 10px; } } #board-and-mgt ul.teams-list li a, #board-and-mgt ul.teams-list li.active a { background-color: #fff; } #board-and-mgt ul.teams-list li a:hover, #board-and-mgt ul.teams-list li.active a:hover { cursor: pointer; background-color: #f5f5f5; } @media (min-width: 768px) { #board-and-mgt ul.teams-list li a:hover, #board-and-mgt ul.teams-list li.active a:hover { background-color: inherit; } } @media (min-width: 768px) { #board-and-mgt ul.teams-list li a, #board-and-mgt ul.teams-list li.active a { background-color: inherit; } } @media (min-width: 768px) { #board-and-mgt ul.teams-list li.active a:hover { cursor: default; } } /* ------------------------------ Individual Profile ------------------------------ */ #individual-profile { /* -- Left side css -- */ /* -- Right menu css -- */ /* #menu { padding: 0; color: #666; .product { @extend .font-arial; margin: 10px 10px; overflow: hidden; a { color: #666; text-decoration: none; } } .product-img { padding: 0; width: 5%; } .product-text { padding: 0; margin-top: 1px; } ul.menu-list { list-style-type: none; } .border-side { padding: 0; height: 40px; width: 9px; } .border-left { padding: 0; width: 3%; } .border-mid { width: 94%; background-image: url('../img/border-mid.png'); background-size: auto 40px; padding: 12px 0; height: 40px; @media (min-width: $screen-sm) { background-image: none; background-size: 0; height: auto; } } .border-right { padding: 0; width: 3%; } .menu-title { @extend .font-arial-to-lato-bold; @media (min-width: $screen-sm) { color: #000; font-size: 20px; margin: 30px 0 10px 0; padding: 0 25px; } .arrow { padding-top: 5px; width: 13px; } } */ /* -- Bootstrap collaspe css -- */ /* .panel { margin: 5px 20px; } .panel-title { font-size: 140%; color: #666; background-color: auto; margin: 0; } .panel-body { padding: 0; margin: 0 20px; @media (min-width: $screen-sm) { margin: 0; } font-size: 140%; } .panel-heading { padding: 0; } } */ } #individual-profile .page-title { height: auto; margin-bottom: 10px; } #individual-profile .page-sub-title { color: #666; font-size: 200%; margin-top: 0; margin-bottom: 10px; } #individual-profile #left-wrapper { padding-top: 25px; padding-bottom: 25px; } #individual-profile #left-wrapper #profile-pic-img img { margin: 0 auto; max-height: 250px; width: auto; } #individual-profile #left-wrapper #profile-pic-link { padding-top: 10px; padding-bottom: 10px; text-align: center; font-size: 140%; } #individual-profile #left-wrapper #profile-content { padding-top: 10px; padding-bottom: 10px; color: #666; } @media screen and (min-width: 992px) { #individual-profile #left-wrapper #profile-content { margin-top: -3px; padding-top: 0; } } #individual-profile #left-wrapper #profile-content p { font-size: 140%; } #individual-profile #left-wrapper #bar-cta { font-size: 140%; margin: 20px 0; } @media (min-width: 768px) { #individual-profile #left-wrapper #bar-cta { font-weight: bold; margin: 10px 0; } } #individual-profile #left-wrapper #bar-cta .col-xs-6 { padding: 0; } @media (min-width: 768px) { #individual-profile #left-wrapper #bar-cta { font-weight: bold; font-size: 14px; margin: 10px 0; } #individual-profile #left-wrapper #bar-cta .col-xs-6 { width: 40%; padding: 0 15px; } } #individual-profile #left-wrapper #bar-cta a { color: #666; } #individual-profile #left-wrapper #bar-cta a img { height: 17px; margin-left: 3px; } #individual-profile .line { padding: 0; } #individual-profile .divider { margin: 0; /*width: 100%;*/ height: 1px; background-color: #dadada; } #individual-profile .right-content { margin: 25px 0 10px 0; } @media screen and (min-width: 768px) { #individual-profile .right-content > .row { margin-top: 5px; } } @media screen and (min-width: 992px) { #individual-profile .right-content > .row { margin-top: 0; } } #individual-profile .right-content .investor-relations #menu .panel { margin: 5px -5px; } @media screen and (min-width: 992px) { #individual-profile .right-content .investor-relations #menu .panel-body { margin: 0; } } @media screen and (min-width: 768px) { #individual-profile .right-content .investor-relations #menu .dynamic-title { margin-top: 0; } } @media screen and (min-width: 992px) { #individual-profile .right-content .investor-relations #menu .dynamic-title { margin-bottom: 0; } } @media screen and (min-width: 768px) { #individual-profile .right-content .investor-relations #menu .dynamic-title .menu-title { margin-top: 0; padding: 0 15px; } } @media screen and (min-width: 992px) { #individual-profile .right-content .investor-relations #menu .dynamic-title .menu-title { margin-top: 25px; } } #individual-profile .right-content .investor-relations #menu .menu-list { margin: 0 -10px; } @media screen and (min-width: 768px) { #individual-profile .right-content .investor-relations #menu .menu-list { margin: 0; } } #individual-profile .right-content .investor-relations .divider { background: none; } @media screen and (min-width: 768px) { #individual-profile .right-content { margin: 0; } } @media screen and (min-width: 992px) { #individual-profile .right-content { padding: 0 15px 0 0; margin-top: -3px; } } @media (min-width: 768px) { #individual-profile { /* -- Cancel deafult a hover -- */ .menu-btn: hover; .menu-btn-cursor: default; .menu-btn-text-decoration: none; } #individual-profile #profile-pic-block { float: left; } #individual-profile #outer-row { margin-bottom: 70px; } } @media (min-width: 992px) { #individual-profile #profile-pic-img img { float: none; margin: 0 auto; } } /* ------------------------------ ABOUT HKT ------------------------------ */ #page-about-hkt .banner-wrapper { position: relative; } #page-about-hkt .banner-wrapper .banner-image img { width: 100%; } #page-about-hkt .banner-wrapper .banner-text { background-color: #03437e; padding: 20px 15px; font-size: 130%; } @media (min-width: 768px) { #page-about-hkt .banner-wrapper .banner-text, #page-company-profile .banner-wrapper .banner-text { position: absolute; top: 20%; left: 5%; width: 45%; } } #page-about-hkt .banner-wrapper .banner-text a { text-decoration: none; color: #fff; } #page-about-hkt .banner-wrapper .banner-text .link-icon { color: #1d8fe3; padding-left: 10px; } #page-about-hkt .box-wrapper { margin-top: 10px; } @media (min-width: 768px) { #page-about-hkt .box-wrapper { padding: 0 45px; margin-top: 25px; } } @media (min-width: 992px) { #page-about-hkt .box-wrapper { padding: 0 5px; } } #page-about-hkt .detail-card .detail-header { border-color: #1b2a46; padding: 15px 10px; } @media (min-width: 768px) { #page-about-hkt .detail-card .detail-header { padding: 10px; } } #page-about-hkt .detail-card .detail-header a { position: relative; } #page-about-hkt .detail-card .detail-header a .link-icon { position: absolute; width: 13px; height: 13px; top: 5px; right: 10px; background: url(../img/arrow-blue-6x11.png) right center no-repeat; } @media (min-width: 768px) { #page-about-hkt .detail-card .detail-header a .link-icon { color: #1d8fe3; font-size: 140%; display: inline-block; } } #page-about-hkt .detail-card .detail-content { /*padding: 5px 10px;*/ } #page-about-hkt .release-item { color: #666; display: block; padding: 10px 0; text-decoration: none; } #page-about-hkt .release-item .release-date, #page-about-hkt .release-item .release-content { display: block; } #page-about-hkt .release-item .release-date { font-weight: bold; } #page-about-hkt .release-line { border-top: 1px solid #ccc; margin: 0 -10px; } /* ------------------------------ SERVICE PLAN TEMPLATES ------------------------------ */ #service-individual-plan .content-area, #service-plan .content-area, #service-plan-detail .content-area { margin: 0; } #service-plan .page-title { margin-bottom: 25px; } @media screen and (min-width: 768px) { #service-plan .page-title { margin-bottom: 40px; } } @media screen and (min-width: 768px) { #service-plan .content-area { padding: 0 30px; } } @media screen and (min-width: 992px) { #service-plan .content-area { padding: 0; margin-left: -5px; margin-right: -5px; } } #service-plan .service-box .service-box-wrapper { padding: 15px 14px 20px 14px; } #service-plan .service-box .service-box-wrapper .header { height: 45px; position: relative; } #service-plan .service-box .service-box-wrapper .header img { padding-left: 5px; position: absolute; margin: auto; top: 0; bottom: 15px; } #service-plan .service-box .service-box-wrapper .content { float: left; padding-left: 5px; } #service-plan .service-box .service-box-wrapper .content p { margin-bottom: 20px; } @media screen and (min-width: 768px) { #service-plan .service-box .service-box-wrapper .content p { margin-bottom: 30px; } } @media screen and (min-width: 768px) { #service-plan .service-box .service-box-wrapper .content { min-height: 285px; margin-bottom: 0; } } #service-plan .service-box .service-box-wrapper .link { float: left; width: 100%; } #service-plan .service-box .service-box-wrapper .link .link-icon.link { border: none; } #service-plan .service-box .service-box-wrapper .button { clear: both; margin-top: 0; padding-top: 20px; } @media screen and (min-width: 768px) { #service-plan .service-box { padding: 0 8px; } } @media screen and (min-width: 768px) { #service-individual-plan .content-area { padding: 0 20px; } } @media screen and (min-width: 992px) { #service-individual-plan .content-area { padding: 0; margin-left: -5px; margin-right: -5px; } } @media screen and (min-width: 768px) { #service-individual-plan .service-box-wrapper { padding-bottom: 0; } } #service-individual-plan .service-box-wrapper .link .link-icon.link { border: none; } @media screen and (min-width: 768px) { #service-individual-plan .service-box { padding: 0 8px; } } #service-plan-detail .sidebar-links { margin: 0; } #service-plan-detail .sidebar-links .header { padding: 10px 0; } @media screen and (min-width: 768px) { #service-plan-detail .sidebar-links .header { padding: 10px 15px; } } #service-plan-detail .sidebar-links .item-list .item { padding: 10px 0; } @media screen and (min-width: 768px) { #service-plan-detail .sidebar-links .item-list .item { padding: 10px 15px; } } #service-plan-detail .left-content, #service-plan-detail .right-content { padding: 0; } #service-plan-detail .left-content { margin-bottom: 15px; } @media screen and (min-width: 992px) { #service-plan-detail .left-content { padding-right: 15px; } } @media screen and (min-width: 768px) { #service-plan-detail .online-store-box .box-store .row { min-height: 230px; } } #service-plan-detail .online-store-box .box-store .row .content img { /*margin-top: 25px;*/ margin-bottom: 12px; } @media screen and (min-width: 768px) { #service-plan-detail .online-store-box .box-store .row .content img { margin: 25px auto 0; } } #service-plan-detail .product a { color: #666; text-decoration: none; } #service-plan-detail .box { padding-bottom: 0; } @media screen and (min-width: 768px) { #service-plan-detail .box .box-row-wrapper { min-height: 230px; } } @media screen and (min-width: 768px) { #service-plan-detail .service-plan-info-box { margin-bottom: 30px; } } /* ------------------------------ ABOUT HKT - MILESTONE ------------------------------ */ #about-hkt-milestone .page-detail, #about-hkt-milestone .date-dropdown-wrapper { padding-left: 15px; padding-right: 15px; } #about-hkt-milestone .page-detail .border-side-left, #about-hkt-milestone .date-dropdown-wrapper .border-side-left { left: 1px; } #about-hkt-milestone .page-detail .border-side-right, #about-hkt-milestone .date-dropdown-wrapper .border-side-right { right: -4px; } #about-hkt-milestone .page-detail #year-range, #about-hkt-milestone .date-dropdown-wrapper #year-range { font-size: 120%; } @media screen and (min-width: 768px) { #about-hkt-milestone .page-detail #year-range, #about-hkt-milestone .date-dropdown-wrapper #year-range { font-size: 140%; } } #about-hkt-milestone .page-detail select, #about-hkt-milestone .date-dropdown-wrapper select { height: 32px; font-size: 120%; } @media (min-width: 768px) { #about-hkt-milestone .page-detail { font-size: 140%; } } #about-hkt-milestone .content-area { margin: 0; } #about-hkt-milestone .content-area .left-content, #about-hkt-milestone .content-area .right-content { padding: 0; } @media (min-width: 992px) { #about-hkt-milestone .content-area .left-content { padding-right: 15px; } } @media screen and (min-width: 992px) { #about-hkt-milestone .content-area .right-content { margin-top: -2px; } } #about-hkt-milestone .info-block-container { margin-top: 5px; } @media (min-width: 768px) { #about-hkt-milestone .info-block-container { margin-top: 15px; } } #about-hkt-milestone .sidebar-links .header { text-align: center; font-size: 170%; color: #333; } @media (min-width: 768px) { #about-hkt-milestone .sidebar-links .header { text-align: left; padding-left: 30px; } } #about-hkt-milestone .sidebar-links .item-list { padding-bottom: 28px; } #about-hkt-milestone .sidebar-links .item-list .item { padding: 10px 20px; } #about-hkt-milestone .sidebar-links .item-list .item a img { display: inline !important; } /* ------------------------------ ABOUT HKT - PRESS INFO ------------------------------ */ #about-hkt-press-information .page-detail, #about-hkt-press-information .date-dropdown-wrapper { padding-left: 10px; padding-right: 10px; } #about-hkt-press-information .page-detail { margin-bottom: 20px; } @media (min-width: 768px) { #about-hkt-press-information .page-detail { font-size: 140%; margin-bottom: 30px; } } #about-hkt-press-information .content-area { margin: 0; } #about-hkt-press-information .content-area .left-content, #about-hkt-press-information .content-area .right-content { padding: 0; } @media (min-width: 768px) { #about-hkt-press-information .content-area .left-content { padding-right: 15px; } } @media (min-width: 768px) { #about-hkt-press-information .content-area { margin-top: 40px; } } #about-hkt-press-information .info-block-container { margin-top: 15px; } #about-hkt-press-information .info-block-container .info-block .header, #about-hkt-press-information .info-block-container .info-block .content { padding-left: 10px; padding-right: 10px; } @media (min-width: 768px) { #about-hkt-press-information .info-block-container { padding: 10px 0 50px 0; } } #about-hkt-press-information .filter-section { margin: 0; } #about-hkt-press-information .filter-section label { font-size: 120%; line-height: 12px; padding: 0 10px; margin: 5px 0; float: left; width: 100%; } @media (min-width: 768px) { #about-hkt-press-information .filter-section label { font-size: 140%; line-height: 32px; width: auto; } } #about-hkt-press-information .filter-section .custom-input-select button, #about-hkt-press-information .filter-section .custom-input-select div.dropdown-menu { color: #666666; font-size: 120%; } @media (min-width: 768px) { #about-hkt-press-information .filter-section .custom-input-select button, #about-hkt-press-information .filter-section .custom-input-select div.dropdown-menu { font-size: 140%; } } #about-hkt-press-information .filter-section .custom-input-select div.dropdown-menu ul { color: #666666; font-size: 100%; } @media (min-width: 768px) { #about-hkt-press-information .filter-section .custom-input-select div.dropdown-menu ul { font-size: 100%; } } #about-hkt-press-information .box-sidebar .box-row-wrapper { margin-left: -15px; margin-right: -15px; } #about-hkt-press-information .box-sidebar .box-row-wrapper .title, #about-hkt-press-information .box-sidebar .box-row-wrapper .content { padding-left: 10px; padding-right: 10px; } @media screen and (min-width: 768px) { #about-hkt-press-information .box-sidebar .box-row-wrapper .title, #about-hkt-press-information .box-sidebar .box-row-wrapper .content { padding-top: 0; } } /* ------------------------------ MY BILL PAGE ------------------------------ */ .page-my-bill { margin-bottom: 30px; } @media screen and (min-width: 768px) { .page-my-bill .topLinks { margin-top: 65px; } } .page-my-bill .content-area { padding-left: 10px; padding-right: 10px; } .page-my-bill .blue-divider { height: 3px; margin-top: 0; } @media screen and (min-width: 768px) { .page-my-bill .blue-divider { height: 2px; width: 100%; margin-top: 20px; } } .page-my-bill .filter-section label { font-size: 120%; line-height: 22px; padding: 0 15px; margin: 5px 0; float: left; } @media screen and (min-width: 768px) { .page-my-bill .filter-section label { font-size: 140%; } } .page-my-bill .filter-section .date-col { padding: 0; } .page-my-bill .date-dropdown { margin-top: 0; } .page-my-bill .date-dropdown .dropdown { width: 160px; } .page-my-bill .button-col { margin-top: 30px; margin-bottom: 15px; overflow: hidden; } .page-my-bill .button-col img { width: auto; height: 32px; float: right; margin: 5px 0; } .page-my-bill .button-col .button-row { overflow: hidden; } @media screen and (min-width: 768px) { .page-my-bill .button-col .button-row { width: auto; float: left; } } .page-my-bill .button-col .button-row .btn-custom { float: right; margin-top: 7px; margin-bottom: 7px; margin-left: 0; } @media (min-width: 768px) { .page-my-bill .button-col .button-row .btn-custom { margin-top: 0; margin-bottom: 0; } } @media screen and (min-width: 768px) { .page-my-bill .button-col { overflow: visible; margin-top: 0; } } .page-my-bill .billing-col { padding: 0; margin: 15px 0 20px 0; } .page-my-bill .billing-col img { width: 100%; height: auto; border: 1px solid #dadada; } @media screen and (min-width: 768px) { .page-my-bill .billing-col { padding-left: 15px; } } @media screen and (min-width: 992px) { .page-my-bill .billing-links-box .billing-row .link-icon { margin-right: 5px; } } .page-my-bill .spinner-top-col { margin-top: 10px; } .page-my-bill .spinner-top-col label { font-size: 140%; padding-right: 10px; } .page-my-bill .spinner { width: 155px; } .page-my-bill .spinner select { height: 20px; padding: 0; } .page-my-bill .live-chat-img { height: 77px; width: 230px; background: url("../img/live-chat-bg-small-image.png") no-repeat center; float: right; border-bottom: 1px solid #cdcdcd; margin-top: -30px; position: relative; } .page-my-bill .live-chat-img .chat, .page-my-bill .live-chat-img .link { font-size: 120%; } .page-my-bill .live-chat-img .chat { color: #fff; position: absolute; top: 19px; left: 26px; } .page-my-bill .live-chat-img .link { position: absolute; color: #004c92; bottom: 17px; left: 16px; padding-right: 8px; background: url(../img/arrow-darkblue-4x8.png) no-repeat right; } /* -------------------- COMPANY PROFILE ---------------------- */ @media (min-width: 768px) { #page-company-profile .banner-wrapper { margin-top: 40px; } } #page-company-profile .content-area { padding: 0 15px; margin-bottom: 15px; } @media (min-width: 768px) { #page-company-profile .content-area { padding: 0 40px; } } @media (min-width: 992px) { #page-company-profile .content-area { padding: 0; } } #page-company-profile .box { padding-bottom: 0; } #page-company-profile .box > .box-row-wrapper .title a { padding-left: 15px; padding-right: 15px; border-bottom: 2px solid #03437e; } @media (min-width: 768px) { #page-company-profile .box > .box-row-wrapper .title a { padding-left: 10px; padding-right: 10px; } } @media (min-width: 768px) { #page-company-profile .box > .box-row-wrapper .title { padding: 0; } } @media (min-width: 768px) { #page-company-profile .box > .box-row-wrapper .content p { padding-bottom: 10px; } } @media (min-width: 768px) { #page-company-profile .box > .box-row-wrapper .content { min-height: 245px; } } #page-company-profile .box > .box-row-wrapper .link { border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; } @media (min-width: 768px) { #page-company-profile .box > .box-row-wrapper { padding-left: 10px; padding-right: 10px; } } #financial-results .content-area .content { padding-left: 25px; padding-right: 25px; } #financial-results .content-area .filter-section { padding-left: 10px; padding-right: 10px; border-bottom: 1px solid #dadada; padding-bottom: 15px; } #financial-results .content-area .filter-section label { line-height: 12px; padding: 0; margin: 5px 0; float: left; width: 100%; } @media screen and (min-width: 768px) { #financial-results .content-area .filter-section label { width: auto; margin: 15px 0; padding-right: 15px; } } #financial-results .content-area .filter-section .date-dropdown-wrapper { padding-left: 0; padding-right: 0; } #financial-results .content-area .filter-section .date-dropdown-wrapper .date-dropdown { margin-top: 5px; } @media screen and (min-width: 768px) { #financial-results .content-area .filter-section .date-dropdown-wrapper { width: 25%; margin-left: 10px; height: auto; } } #financial-results .content-area .filter-section .custom-input-select button, #financial-results .content-area .filter-section .custom-input-select div.dropdown-menu { color: #666666; font-size: 120%; } @media (min-width: 768px) { #financial-results .content-area .filter-section .custom-input-select button, #financial-results .content-area .filter-section .custom-input-select div.dropdown-menu { font-size: 140%; } } #financial-results .content-area .filter-section .custom-input-select div.dropdown-menu ul { color: #666666; font-size: 100%; } @media (min-width: 768px) { #financial-results .content-area .filter-section .custom-input-select div.dropdown-menu ul { font-size: 100%; } } #financial-results .content-area .financial-results-content { padding-top: 15px; } #financial-results .content-area .financial-results-content .media-list-box-with-image .text-wrapper { display: none; } #financial-results .content-area .financial-results-content .media-list-box-with-image .header { display: none; } #financial-results .content-area .financial-results-content .media-list-box-with-image .image-block { margin-bottom: 20px; margin-top: 10px; } #financial-results .content-area .financial-results-content .media-list-box-with-image .image-block .image-wrapper { text-align: center; } #financial-results .content-area .financial-results-content .media-list-box-with-image .image-block .image-wrapper img { border: 1px solid #999; box-shadow: 1px 2px 5px #5a5a5a; filter: progid:DXImageTransform.Microsoft.Shadow(color=#5a5a5a,direction=125,strength=4), progid:DXImageTransform.Microsoft.Shadow(color=#5a5a5a,direction=240,strength=2); max-width: 170px; } @media screen and (min-width: 768px) { #financial-results .content-area .financial-results-content .media-list-box-with-image .image-block .image-wrapper img { width: 100%; } } @media screen and (min-width: 768px) { #financial-results .content-area .financial-results-content .media-list-box-with-image .image-block { margin-left: 25px; } } #financial-results .content-area .financial-results-content .media-list-box-with-image .col-sm-8.col-xs-12 { padding-left: 0; padding-right: 0; } #financial-results .content-area .financial-results-content .media-list-box-with-image .col-sm-8.col-xs-12 .col-sm-12.col-xs-12 { padding-left: 0; padding-right: 0; } @media screen and (min-width: 768px) { #financial-results .content-area .financial-results-content .media-list-box-with-image .col-sm-8.col-xs-12 { padding-left: 15px; margin-left: 4%; } } @media screen and (min-width: 992px) { #financial-results .content-area .financial-results-content .media-list-box-with-image .col-sm-8.col-xs-12 { padding-left: 15px; margin-left: 25px; } } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper { position: relative; padding: 5px 10px; } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .image-wrapper img { min-width: 16px; width: 16px; height: auto; } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .image-wrapper .mp4-icon { width: 19px; } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .col-xs-10 { /*position: absolute; top: 0; bottom: 0; right: 0; margin: auto; height: 15px;*/ line-height: 20px; } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper.lighter-blue { background-color: #f5f5f5; } #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .col-xs-2, #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .col-xs-10 { padding: 0; } @media screen and (min-width: 768px) { #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .col-xs-2, #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper .col-xs-10 { padding-right: 15px; } } @media screen and (min-width: 992px) { #financial-results .content-area .financial-results-content .media-list-box-plain .media-link-wrapper { margin-right: 0px; } } @media screen and (min-width: 768px) { #financial-results .content-area .financial-results-content { padding-bottom: 30px; } } @media screen and (min-width: 992px) { #financial-results .content-area .financial-results-content { padding-right: 0; } } #financial-results .content-area .page-detail { padding-left: 10px; padding-right: 10px; } #financial-results .content-area .left-content .email-us-div { border-top: 1px solid #dadada; margin-top: 40px; margin-bottom: 20px; padding-top: 15px; width: 100%; } #financial-results .content-area .left-content .email-us-div p { padding-left: 10px; padding-right: 10px; } @media screen and (min-width: 768px) { #financial-results .content-area .left-content .email-us-div p { margin-left: 10px; padding-left: 0; } } #financial-results .content-area .right-content { padding-left: 25px; padding-right: 25px; } #financial-results .content-area .right-content .investor-relations-heading { padding-top: 10px; padding-bottom: 10px; font-size: 160%; color: #333; } @media screen and (min-width: 768px) { #financial-results .content-area .right-content .investor-relations-heading { float: left; width: 100%; font-size: 180%; } } @media screen and (min-width: 992px) { #financial-results .content-area .right-content .investor-relations-heading { padding-top: 0; } } #financial-results .content-area .right-content .investor-relations h4 { margin-bottom: 0; } @media screen and (min-width: 768px) { #financial-results .content-area .right-content #investor-relations { display: block; } } #financial-results .content-area .right-content .investor-relations #menu .panel { margin: 0; } #financial-results .content-area .right-content .investor-relations #menu .border-left { width: 3%; } @media screen and (min-width: 768px) { #financial-results .content-area .right-content .investor-relations #menu .border-left { width: auto; } } @media screen and (min-width: 560px) { #financial-results .content-area .right-content .investor-relations #menu .border-left { width: auto; } } @media screen and (min-width: 560px) { #financial-results .content-area .right-content .investor-relations #menu .border-right { width: auto; } } #financial-results .content-area .right-content .investor-relations #menu .menu-title { padding-left: 0; } @media screen and (min-width: 768px) { #financial-results .content-area .right-content .investor-relations #menu .menu-title { display: none; } } @media screen and (min-width: 992px) { #financial-results .content-area .right-content .investor-relations #menu .item { line-height: 14px; margin: 5px; } } @media screen and (min-width: 992px) { #financial-results .content-area .right-content { padding: 0; max-width: 225px; } } /* -------------------- CORPORATE GOVERNANCE ---------------------- */ @media screen and (min-width: 768px) { #page-corporate-governance .page-detail { margin-top: 20px; } } #page-corporate-governance .right-content { margin: 25px 0 10px 0; } @media screen and (min-width: 768px) { #page-corporate-governance .right-content > .row { margin-top: 5px; } } @media screen and (min-width: 768px) { #page-corporate-governance .right-content > .row { margin-top: 5px; } } #page-corporate-governance .right-content .investor-relations #menu .panel { margin: 5px 5px; } @media screen and (min-width: 768px) { #page-corporate-governance .right-content { margin: 0; } } @media screen and (min-width: 992px) { #page-corporate-governance .right-content { padding: 0 15px 0 0; margin-top: 15px; } } #page-corporate-governance .management-structure { margin-top: 20px; } #page-corporate-governance .service-box .service-box-wrapper { padding-bottom: 0; } #page-corporate-governance .service-box .service-box-wrapper .header { border-bottom: 2px solid #13598E; } @media screen and (min-width: 768px) { #page-corporate-governance .service-box .service-box-wrapper { padding-top: 10px; } } #page-corporate-governance .service-box .service-box-wrapper .link .text { padding-right: 2px; } @media screen and (min-width: 768px) { #page-corporate-governance .service-box { margin-bottom: 0; } } #page-corporate-governance .investor-relations { margin-bottom: 10px; } #page-corporate-governance .investor-relations #menu { margin-bottom: 0; } @media screen and (min-width: 768px) { #page-corporate-governance .investor-relations #menu .menu-title { padding: 0 15px; margin-top: 0; } } @media screen and (min-width: 992px) { #page-corporate-governance .investor-relations #menu .dynamic-title { margin: 0; } } @media screen and (min-width: 768px) { #page-corporate-governance .investor-relations #board-of-directors, #page-corporate-governance .investor-relations #management-team { display: block; margin: 0 10px; } } @media screen and (min-width: 768px) { #page-corporate-governance .investor-relations .dynamic-wrapper { margin-left: 10px; margin-right: 10px; } } @media screen and (min-width: 768px) { #page-corporate-governance .investor-relations .panel-heading .menu-title { padding: 0 10px; margin-top: 0; } } @media screen and (min-width: 768px) { #page-corporate-governance .investor-relations { margin-top: 30px; } } @media screen and (min-width: 992px) { #page-corporate-governance .investor-relations { margin-top: 0; margin-bottom: 30px; } } @media screen and (min-width: 768px) { #page-corporate-governance .bottom-col { margin-top: 20px; padding: 0 10px; } #page-corporate-governance .bottom-col .col-sm-6 { padding: 5px; } } /* Batch 2 - Pages */ #content-template .filter-section label { color: #666; font-weight: normal; } @media screen and (min-width: 768px) { #content-template .filter-section label { line-height: 32px; margin-right: 15px; padding-top: 5px; } } #content-template .filter-section .custom-input-select button, #content-template .filter-section .custom-input-select div.dropdown-menu { color: #666666; font-size: 120%; } @media (min-width: 768px) { #content-template .filter-section .custom-input-select button, #content-template .filter-section .custom-input-select div.dropdown-menu { font-size: 140%; } } #content-template .filter-section .custom-input-select div.dropdown-menu ul { color: #666666; font-size: 100%; } @media (min-width: 768px) { #content-template .filter-section .custom-input-select div.dropdown-menu ul { font-size: 100%; } } @media screen and (min-width: 768px) { #investor-relations .results, #investor-relations .news { padding: 0 130px; } } @media screen and (min-width: 992px) { #investor-relations .results, #investor-relations .news { padding: 0 15px; } } #investor-relations .cover { position: relative; } #investor-relations .cover .cover-detail { position: absolute; top: 40%; right: 15px; padding-right: 0; } #investor-relations .cover .cover-detail .break-line { display: block; } #investor-relations .header { border-bottom: 2px solid #03437e; } #investor-relations .header h2 { font-size: 170%; color: #03437e; } @media screen and (min-width: 768px) { #investor-relations .header h2 { font-size: 180%; } } #investor-relations .link a { display: block; outline: none; text-decoration: none; font-weight: bold; color: #666; } #investor-relations .link .text { margin-top: 1px; } #investor-relations .link .link-icon { display: inline-block; width: 13px; height: 13px; } @media screen and (min-width: 768px) { #investor-relations .link .link-icon { height: 15px; } } #investor-relations .link .link-icon.arrow { background: url(../img/arrow-blue-6x11.png) right center no-repeat; } @media screen and (min-width: 768px) { #investor-relations .content-template-list .media-list-box .media-link-wrapper .image-wrapper { margin-left: 45px; } } @media screen and (min-width: 768px) { #investor-relations .content-template-list .media-list-box .media-link-wrapper .detail { right: 35px; } } @media screen and (min-width: 992px) { #investor-relations .content-template-list .media-list-box .media-link-wrapper .detail { right: 2%; margin-top: -25px; } } #investor-relations .cover .image-wrapper img { border: 1px solid #999; } /* Page - SMS Activation */ @media (min-width: 768px) { .sms-activation .page-title { margin-bottom: 40px; } } .sms-activation .page-detail { font-size: 100%; } @media screen and (min-width: 768px) { .sms-activation .page-detail { font-size: 120%; } } .sms-activation .sms-activation-form { font-size: 120%; } .sms-activation .sms-activation-form .form-horizontal { padding-left: 15px; padding-right: 15px; } @media (min-width: 992px) { .sms-activation .sms-activation-form .form-horizontal { padding-right: 300px; } } .sms-activation .sms-activation-form .form-horizontal .blue-box { background-color: #eef3f9; margin-bottom: 15px; } .sms-activation .sms-activation-form .form-horizontal .blue-box .form-control { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 0; } .sms-activation .sms-activation-form .form-horizontal .blue-box .click-for-help { padding-top: 30px; } .sms-activation .sms-activation-form .form-horizontal .blue-box .click-for-help .click-here { font-weight: bold; } .sms-activation .sms-activation-form .form-horizontal .blue-box .click-for-help .click-here a { color: inherit; } /* Page - Update Billing Information */ .update-billing-info .fixed-eye-img { margin-bottom: 20px; } .update-billing-info .billing-information-form { padding-left: 15px; padding-right: 15px; } .update-billing-info .billing-information-form form { /* set bg for custom radio button in mobile view */ /* set bg for custom radio button in mobile view */ } .update-billing-info .billing-information-form form .blue-box { background-color: #eef3f9; } .update-billing-info .billing-information-form form .form-control { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 0; } .update-billing-info .billing-information-form form .radio label { padding-left: 35px; } .update-billing-info .billing-information-form form .radio input[type='radio'] { margin-top: 2px; } @media (min-width: 768px) { .update-billing-info .billing-information-form form .radio input[type='radio'] { margin-top: 4px; } } .update-billing-info .billing-information-form form .radio-btn { float: left; margin-right: 5px; margin-left: -20px; width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } .update-billing-info .billing-information-form form .radio-label { margin-top: 0; margin-top: 5px; display: inline-block; } @media screen and (min-width: 768px) { .update-billing-info .billing-information-form form .radio-label { margin-top: 0; } } .update-billing-info .billing-information-form form :checked + span.radio-btn { background-position: left center; } .update-billing-info .billing-information-form form label.radio-option:hover { cursor: pointer; } @media (min-width: 768px) { #contact-us .nav-tabs li { width: 28.33333%; text-align: center; } } #contact-us .tab-pane .text { color: #002c71; } #contact-us .contact-links-dropdown-wrapper .contact-links-dropdown .dropdown { width: 100%; } #contact-us .related-links-list .header h2 { font-size: 120%; } @media screen and (min-width: 768px) { #contact-us .related-links-list .header h2 { font-size: 140%; } } /* ENQUIRY FORM */ @media screen and (min-width: 768px) { #enquiry-form .other-services .other-links { padding-top: 0; } } @media screen and (min-width: 992px) { #enquiry-form .other-services .other-links { padding-top: 10px; padding-left: 25px; } } @media screen and (min-width: 768px) { #enquiry-form .other-services .other-links .contact-links { padding-bottom: 10px; } } @media screen and (min-width: 992px) { #enquiry-form .other-services .other-links .contact-links { padding: 0; } } @media screen and (min-width: 768px) { #enquiry-form .other-services .other-links .contact-links .header { padding-top: 0; } } @media screen and (min-width: 992px) { #enquiry-form .other-services .other-links .contact-links .header { padding-top: 10px; } } #product-detail-now-tv { /*.page-title { img { max-height: 30px; } }*/ /*FOR FEATURES BOX*/ } #product-detail-now-tv .more-details .link-icon { background: url("../img/new-page-icon-11x11.png") no-repeat scroll left center transparent; width: 11px; height: 11px; display: inline-block; vertical-align: middle; margin-left: 2px; } #product-detail-now-tv .more-details .link-label { color: #666; } #product-detail-now-tv .more-details .link-label:hover { border: none; } #product-detail-now-tv #linkHeader { font-size: 170%; padding: 10px; color: #333; margin: 0; text-align: center; } @media screen and (min-width: 768px) { #product-detail-now-tv #linkHeader { text-align: left; font-size: 180%; } } @media screen and (min-width: 992px) { #product-detail-now-tv #linkHeader { padding-top: 0; } } @media screen and (min-width: 768px) { #product-detail-now-tv .page-detail-col { padding-left: 0; } } @media screen and (min-width: 992px) { #product-detail-now-tv .right-content { padding: 0px 15px; } } @media screen and (min-width: 768px) { #product-detail-now-tv .block-header, #product-detail-now-tv .box-with-link h2, .box-with-link #product-detail-now-tv h2 { margin-bottom: 0; } } #product-detail-now-tv .feature-row .feature img { width: 135px; height: 45px; } #product-detail-now-tv .feature-row .feature .box-with-link h2 { height: 65px; padding-top: 20px; } #product-detail-now-tv .feature-row .feature .box-with-link h2 img { margin-top: -10px; } @media screen and (min-width: 768px) { #product-detail-now-tv .feature-row .feature .box-with-link h2 { margin-bottom: 10px; margin-top: 8px; } } @media screen and (min-width: 768px) { #product-detail-now-tv .feature-row .feature .box-with-link .link { padding-top: 0; padding-bottom: 0; bottom: 20px; position: absolute; } } @media screen and (min-width: 768px) { #product-detail-now-tv .feature-row .feature .box-with-link { height: 175px; } } @media screen and (min-width: 768px) { #product-detail-now-tv .feature-row { padding-top: 15px; } } #product-detail-now-tv .app-lists { padding-top: 20px; } #product-detail-now-tv .more-apps { margin-top: 20px; padding: 10px; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; overflow: hidden; } #product-detail-now-tv .more-apps .link a { color: inherit; font-weight: bold; } #product-detail-now-tv .more-apps .link a .link-icon { background: url(../img/arrow-blue-6x11.png) left center no-repeat; width: 6px; height: 11px; display: inline-block; vertical-align: middle; margin-left: 5px; } @media screen and (min-width: 768px) { #product-detail-now-tv .channel-slider, #product-detail-now-tv .channel-list { padding: 0 15px 15px 15px; } } #product-detail-now-tv #channel-list-slider .carousel-indicators { position: relative; bottom: 0; left: 0; margin: 5px auto; width: 100%; } #product-detail-now-tv #channel-list-slider .carousel-indicators li { margin: 0; width: 25% !important; /*max-width: 132px;*/ height: auto; text-indent: 0; } #product-detail-now-tv #channel-list-slider .carousel-indicators li .image-wrapper { background: transparent; } #product-detail-now-tv #channel-list-slider .carousel-indicators li .image-wrapper img { width: 100%; border: 2px solid #fff; } #product-detail-now-tv #channel-list-slider .carousel-indicators .active .image-wrapper img { border: 2px solid #03437e; } #product-detail-now-tv #channel-list-slider img.prev-slider, #product-detail-now-tv #channel-list-slider img.next-slider { width: 6px; height: auto; margin-top: 85%; } @media screen and (min-width: 768px) { #product-detail-now-tv #channel-list-slider img.prev-slider { margin-left: 60%; } } @media screen and (min-width: 768px) { #product-detail-now-tv #channel-list-slider img.next-slider { margin-right: 60%; } } #product-detail-now-tv #channel-list-slider .carousel-inner .item { width: 100%; } #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 { font-size: 100%; } #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-title, #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-schedule { color: #fff; } #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-title { font-size: 130%; } @media screen and (min-width: 768px) { #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-title { font-size: 300%; } } #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-schedule { font-size: 80%; } @media screen and (min-width: 768px) { #product-detail-now-tv #channel-list-slider .carousel-inner .item h3 a .movie-schedule { font-size: 140%; } } #product-detail-now-tv #channel-list-slider .carousel-inner .item .carousel-caption { display: block; left: 0; right: 0; bottom: 0; padding: 2% 0 5% 5%; background: url(../img/grid-link-bg-black.png); } #product-detail-now-tv #channel-list-slider .carousel-inner .item .carousel-caption h3 { margin: 0; } #product-detail-now-tv #channel-list-slider .carousel-inner .item img { width: 100%; height: auto; } @media screen and (min-width: 768px) { #product-detail-now-tv #rg-gallery { padding: 0 5px; } } #product-detail-now-tv #rg-gallery .rg-image-wrapper { position: relative; } #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption { display: block; left: 0; right: 0; bottom: 0; padding: 2% 0 5% 5%; background: url(../img/grid-link-bg-black.png); text-align: left; } #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-title, #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-schedule { color: #fff; } #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-title { font-size: 130%; } @media screen and (min-width: 768px) { #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-title { font-size: 300%; } } #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-schedule { font-size: 80%; } @media screen and (min-width: 768px) { #product-detail-now-tv #rg-gallery .rg-image-wrapper .rg-caption a .movie-schedule { font-size: 140%; } } @media screen and (min-width: 768px) { #product-detail-now-tv #rg-gallery .rg-thumbs { padding: 0 30px; } } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-carousel ul { display: block; } @media screen and (min-width: 768px) { #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-carousel ul li { width: 150px !important; } } @media screen and (min-width: 992px) { #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-carousel ul li { width: 140px !important; } } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-carousel ul li a { border-color: #fff; } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-carousel ul li.selected a { border-color: #03437e; } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-nav .es-nav-next, #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-nav .es-nav-prev { background-color: transparent; } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-nav .es-nav-prev { background: url(../img/arrow-l-blue-6x11.png) no-repeat center; } #product-detail-now-tv #rg-gallery .es-carousel-wrapper .es-nav .es-nav-next { background: url(../img/arrow-blue-6x11.png) no-repeat center; } /* Batch 3 - Pages */ #fast-fact .fast-fact-title, #fast-fact .fast-fact-content { padding-right: 0; padding-left: 0; } @media screen and (min-width: 768px) { #fast-fact .fast-fact-title { max-width: 185px; } } #fast-fact .left-content { margin-bottom: 20px; margin-top: 10px; } #fast-fact .left-content .fast-fact-div .fast-fact-item { padding-top: 15px; padding-bottom: 15px; } #fast-fact .left-content .nav-tabs { padding-left: 10px; } @media screen and (min-width: 768px) { #fast-fact .left-content .nav-tabs { padding-left: 2px; } } @media screen and (min-width: 768px) { #fast-fact .left-content { margin-top: 15px; } } #fast-fact .right-content { margin-top: 10px; } #fast-fact .right-content .investor-relations-heading { padding: 10px; font-size: 160%; color: #333; } @media screen and (min-width: 992px) { #fast-fact .right-content .investor-relations-heading { padding-top: 0; } } @media screen and (min-width: 768px) { #fast-fact .right-content .investor-relations-heading { font-size: 180%; } } #fast-fact .right-content .investor-relations #menu .panel { margin: 5px 10px; } @media screen and (min-width: 768px) { #fast-fact .right-content .investor-relations #menu .menu-title { display: none; } } @media screen and (min-width: 992px) { #fast-fact .right-content .investor-relations #menu .item { line-height: 14px; margin: 5px 10px; } } @media screen and (min-width: 768px) { #fast-fact .right-content .investor-relations #menu #investor-relations { display: block; } } @media screen and (min-width: 560px) { #fast-fact .right-content .investor-relations #menu .border-left, #fast-fact .right-content .investor-relations #menu .border-right { width: auto; } } @media screen and (min-width: 992px) { #fast-fact .right-content .investor-relations #menu h4.dynamic-title { margin-bottom: 0; margin-top: 5px; } } @media screen and (min-width: 992px) { #fast-fact .right-content { padding-left: 0; } } /* ------------------- HOME AUTOMATION --------------------- */ #home-automation .page-title { font-size: 180%; } @media screen and (min-width: 768px) { #home-automation .page-title { font-size: 260%; } } #home-automation .page-logo { margin-top: 5px; } #home-automation .page-logo img { height: 23px; } @media screen and (min-width: 768px) { #home-automation .page-logo img { height: 32px; } } @media screen and (min-width: 768px) { #home-automation #lightingBox .service-box .service-box-wrapper, #home-automation #curtainBox .service-box .service-box-wrapper, #home-automation #temperatureControlBox .service-box .service-box-wrapper, #home-automation #homeMonitoringBox .service-box .service-box-wrapper, #home-automation #homeTheaterBox .service-box .service-box-wrapper, #home-automation .empty-box .service-box .service-box-wrapper { padding-top: 1px; } #home-automation #lightingBox .service-box .service-box-wrapper .header, #home-automation #curtainBox .service-box .service-box-wrapper .header, #home-automation #temperatureControlBox .service-box .service-box-wrapper .header, #home-automation #homeMonitoringBox .service-box .service-box-wrapper .header, #home-automation #homeTheaterBox .service-box .service-box-wrapper .header, #home-automation .empty-box .service-box .service-box-wrapper .header { height: 70px; position: relative; margin-top: 10px; z-index: 10; } #home-automation #lightingBox .service-box .service-box-wrapper .header h2, #home-automation #curtainBox .service-box .service-box-wrapper .header h2, #home-automation #temperatureControlBox .service-box .service-box-wrapper .header h2, #home-automation #homeMonitoringBox .service-box .service-box-wrapper .header h2, #home-automation #homeTheaterBox .service-box .service-box-wrapper .header h2, #home-automation .empty-box .service-box .service-box-wrapper .header h2 { position: absolute; bottom: 0; } } @media screen and (min-width: 768px) { #home-automation #lightingBox .content p, #home-automation #curtainBox .content p, #home-automation #temperatureControlBox .content p, #home-automation #homeMonitoringBox .content p, #home-automation #homeTheaterBox .content p { height: 105px; } } @media screen and (min-width: 992px) { #home-automation #lightingBox .content p, #home-automation #curtainBox .content p, #home-automation #temperatureControlBox .content p, #home-automation #homeMonitoringBox .content p, #home-automation #homeTheaterBox .content p { height: 125px; } } @media screen and (min-width: 768px) { #home-automation #lightingBox .image-wrapper, #home-automation #curtainBox .image-wrapper, #home-automation #homeTheaterBox .image-wrapper { height: 35px; } } @media screen and (min-width: 768px) { #home-automation #temperatureControlBox .image-wrapper, #home-automation #homeMonitoringBox .image-wrapper { height: 40px; } } #home-automation #lightingBox .content img { width: 40px; height: 35px; } #home-automation #curtainBox .content img { width: 30px; height: 30px; } #home-automation #homeTheaterBox .content img { width: 40px; height: 20px; } @media screen and (min-width: 768px) { #home-automation #homeTheaterBox .content img { margin-top: 5px; } } #home-automation #temperatureControlBox .content img { width: 20px; height: 40px; } #home-automation #homeMonitoringBox .content img { width: 30px; height: 16px; } @media screen and (min-width: 768px) { #home-automation #homeMonitoringBox .content img { margin-top: 10px; } } #home-automation .empty-box .content .empty-banner { margin-bottom: 25px; width: 100%; height: 80px; background-color: #dbdbdb; } #home-automation #linkHeader { font-size: 170%; padding: 10px; color: #333; margin: 0; text-align: center; } @media screen and (min-width: 768px) { #home-automation #linkHeader { text-align: left; font-size: 180%; } } @media screen and (min-width: 992px) { #home-automation #linkHeader { padding-top: 0; } } #home-automation .content-area { margin-bottom: 20px; } #home-automation .store-link-col { margin-top: 25px; } @media screen and (min-width: 768px) { #home-automation .store-link-col { margin-top: 0; padding-left: 5px; } } #home-automation .boxes-col > h2 { font-size: 170%; color: #03437e; padding: 10px 15px; border-bottom: 2px solid #178be2; } @media screen and (min-width: 768px) { #home-automation .boxes-col > h2 { font-size: 180%; } } #home-automation .service-store-box { padding: 20px 0; } #home-automation .service-store-box a .icon { width: auto; height: 35px; } #home-automation .service-store-box .wrapper .image { margin: 0; } @media screen and (min-width: 768px) { #home-automation .service-store-box .wrapper .image { margin: auto; padding: 0; height: 70%; } #home-automation .service-store-box .wrapper .image img { height: 50px; } } #home-automation .service-box { margin-bottom: 10px; padding: 0 4px; } #home-automation .service-box .service-box-wrapper .content { margin-top: 10px; } @media screen and (min-width: 768px) { #home-automation .service-box .service-box-wrapper .content { margin-top: 15px; min-height: 110px; } } @media screen and (min-width: 992px) { #home-automation .service-box .service-box-wrapper .content { min-height: 120px; } } #home-automation .service-box .service-box-wrapper .link { padding: 0; border: 0; } @media screen and (min-width: 992px) { #home-automation .right-content { padding-left: 0; } } #home-automation .right-content .box-other-link .link .arrow-holder .arrow-bullet { padding-top: 3px; } /* DISCLAIMER FORM */ @media (min-width: 768px) { #disclaimer-form .page-title { margin-bottom: 40px; } } #disclaimer-form .form-horizontal { padding-left: 15px; padding-right: 15px; } #disclaimer-form .form-horizontal .blue-box { background-color: #eef3f9; } #disclaimer-form .form-horizontal .blue-box .bold { font-weight: bold; } #disclaimer-form .form-horizontal .btn-image { margin-left: 10px; } #disclaimer-form .right-content .box-sidebar { padding-top: 25px; } @media (min-width: 768px) { #disclaimer-form .right-content .box-sidebar { padding-top: 0; } } @media (min-width: 768px) { #disclaimer-form .right-content .box-sidebar .box-row-wrapper { padding-right: 25px; padding-left: 0; } } #disclaimer-form .right-content .box-sidebar .box-row-wrapper .title { padding-top: 0; } #content-scenario-details h2 { font-size: 180%; } #content-scenario-details .page-detail { padding-left: 10px; } @media (min-width: 768px) { #content-scenario-details .page-detail { padding-left: 0; padding-right: 10px; } } @media screen and (max-width: 992px) { #content-scenario-details .padding-right-reset { padding-right: 15px; } } #content-scenario-details .right-content { margin-top: 40px; margin-bottom: 20px; } @media screen and (min-width: 992px) { #content-scenario-details .right-content { margin-top: 46px; } } #content-scenario-details .right-content .scenario-links { padding-left: 0; padding-right: 0; } #content-scenario-details .right-content .scenario-links .box-other-link .link .arrow-holder .arrow-bullet { padding-top: 3px; } #individual-product-landing { /*.padding-right-reset{ @media screen and (max-width: $screen-sm) { padding-right:15px; } }*/ } #individual-product-landing h2 { font-size: 180%; } #individual-product-landing .padding-5 { padding-top: 15px; } #individual-product-landing .margin-top-less-10 { margin-top: -10px; } #individual-product-landing .linkApp { margin-top: 25px; border-top: solid 1px #cccccc; border-bottom: solid 1px #cccccc; padding: 7px; font-size: 130%; font-weight: bold; } #individual-product-landing .linkApp a { color: #666666; position: relative; z-index: 2; } /*#individual-product-landing .link-icon { background: url(../img/arrow-blue-dotted-5x9.png) left center no-repeat; width: 6px; height: 11px; display: inline-block; vertical-align: middle; margin-left: 2px; }*/ #individual-product-landing .store-box a { font-size: 160%; } @media screen and (max-width: 768px) { #individual-product-landing .store-box { padding-left: 0; margin-top: 20px; } } @media screen and (max-width: 992px) { #individual-product-landing .store-box .service-store-box { padding-top: 15px; padding-bottom: 15px; } } #individual-product-landing .min-height-100 { min-height: 100px; /* additional intended for this element only */ } @media screen and (min-width: 445px) and (max-width: 480px) { #individual-product-landing .min-height-100 { min-height: 120px; } } #individual-product-landing .padding-box .link { padding-bottom: 7px; } @media screen and (max-width: 768px) { #individual-product-landing .padding-side-15, #individual-product-landing #stores-and-showrooms .accordian .panel .panel-body > div, #stores-and-showrooms .accordian .panel #individual-product-landing .panel-body > div { padding-left: 0; padding-right: 0; } } @media screen and (max-width: 768px) { #individual-product-landing .padding-left-reset { padding-right: 15px; padding-left: 15px; } } @media screen and (min-width: 992px) { #individual-product-landing .left-content { padding-right: 15px; } } #individual-product-landing .right-content { margin-top: 30px; margin-bottom: 30px; /* for tablet layout only */ } @media screen and (max-width: 992px) { #individual-product-landing .right-content .padding-side-10, #individual-product-landing .right-content #page-corporate-governance .management-structure .header, #page-corporate-governance .management-structure #individual-product-landing .right-content .header, #individual-product-landing .right-content #page-corporate-governance .management-structure .detail, #page-corporate-governance .management-structure #individual-product-landing .right-content .detail, #individual-product-landing .right-content #page-corporate-governance .related-links-list .header, #page-corporate-governance .related-links-list #individual-product-landing .right-content .header, #individual-product-landing .right-content #page-corporate-governance .related-links-list .information-link, #page-corporate-governance .related-links-list #individual-product-landing .right-content .information-link { padding-right: 0; padding-left: 0; } } @media screen and (min-width: 768px) and (max-width: 992px) { #individual-product-landing .right-content { margin-bottom: 40px; } } @media screen and (min-width: 992px) { #individual-product-landing .right-content { margin-top: 0; } } .headerLink { color: #333333; margin: 0; padding-bottom: 10px; text-align: center; } @media screen and (min-width: 768px) { .headerLink { text-align: left; padding-left: 15px; } } .headerLink-blue-underline { color: #03437e; padding: 10px 15px; border-bottom: 2px solid #178be2; } .app-list-box img { max-width: 100%; } @media screen and (min-width: 768px) { .app-list-box img { width: auto; } } .app-list-box .list-unstyled li { margin-bottom: 4px; } /* ------------------------- SERVICE PLAN NOW TV --------------------------- */ #service-plan-now-tv .page-logo { margin-bottom: 5px; padding-left: 15px; } #service-plan-now-tv .page-logo img { width: 80px; height: auto; } @media screen and (min-width: 992px) { #service-plan-now-tv .page-logo { margin: 20px 0px; } } #service-plan-now-tv .service-store-box { margin: 20px 0; } #service-plan-now-tv #live-chat-img { background: url("../img/live-chat-image.png") no-repeat center; } #service-plan-netvigator #live-chat-img { margin-top: -75px; } @media screen and (min-width: 992px) { #service-plan-netvigator #live-chat-img { margin-right: 215px; } } @media screen and (min-width: 768px) { #service-plan-netvigator .page-logo { margin-top: 30px; } } @media screen and (min-width: 768px) { #service-plan-netvigator .content-area { padding-bottom: 30px; } } #service-plan-netvigator .right-content { margin-top: 25px; margin-bottom: 15px; } @media screen and (min-width: 768px) { #service-plan-netvigator .right-content { padding-left: 15px; margin-top: 40px; width: 240px; } } @media screen and (min-width: 992px) { #service-plan-netvigator .right-content { padding-left: 10px; margin-top: 15px; } } #service-plan-netvigator .left-content .account-info-box h2 { margin-top: 0; } #service-plan-netvigator .left-content .incentives h2, #service-plan-netvigator .left-content .commitment h2 { margin-bottom: 25px; } @media screen and (min-width: 768px) { #service-plan-netvigator .left-content .incentives h2, #service-plan-netvigator .left-content .commitment h2 { margin-bottom: 10px; } } #service-plan-netvigator .left-content .text-right { text-align: center; padding-right: 0; padding-left: 0; } @media screen and (min-width: 992px) { #service-plan-netvigator .left-content { margin-top: 10px; padding-right: 0; } } /* SERVICE PLAN FIXED LINE */ #service-plan-fixed-line .e-form { padding: 20px 0 10px 0; } @media (min-width: 992px) { #service-plan-fixed-line .e-form { padding: 30px 0 0 0; } } #service-plan-fixed-line .service-left-content { padding-left: 0; padding-right: 0; } @media (min-width: 768px) { #service-plan-fixed-line .service-left-content { padding-right: 10px; } } #service-plan-fixed-line .usage-record { padding-top: 15px; } /* ------------------- CONSUMER ELECTRONICS --------------------- */ #consumer-electronics .page-logo img { width: 108px; height: 23px; } @media screen and (min-width: 768px) { #consumer-electronics .page-logo img { width: auto; height: 30px; } } @media screen and (min-width: 768px) { #consumer-electronics #network-devices .content img, #consumer-electronics #ip-cam .content img, #consumer-electronics #wearable-gadgets .content img, #consumer-electronics #smart-gadgetry .content img, #consumer-electronics #home-appliances .content img, #consumer-electronics .empty-box .content img { margin-bottom: 15px; } } #consumer-electronics #network-devices .link a, #consumer-electronics #ip-cam .link a, #consumer-electronics #wearable-gadgets .link a, #consumer-electronics #smart-gadgetry .link a, #consumer-electronics #home-appliances .link a, #consumer-electronics .empty-box .link a { font-size: 100%; } #consumer-electronics #network-devices .link a span.link-icon.arrow, #consumer-electronics #ip-cam .link a span.link-icon.arrow, #consumer-electronics #wearable-gadgets .link a span.link-icon.arrow, #consumer-electronics #smart-gadgetry .link a span.link-icon.arrow, #consumer-electronics #home-appliances .link a span.link-icon.arrow, #consumer-electronics .empty-box .link a span.link-icon.arrow { height: 11px; } #consumer-electronics #network-devices .content img { width: 30px; height: auto; } @media screen and (min-width: 768px) { #consumer-electronics #network-devices .content img { width: auto; height: 35px; } } #consumer-electronics #ip-cam .content img { width: 16px; height: auto; } @media screen and (min-width: 768px) { #consumer-electronics #ip-cam .content img { width: auto; height: 35px; } } #consumer-electronics #wearable-gadgets .content img { width: 16px; height: auto; } @media screen and (min-width: 768px) { #consumer-electronics #wearable-gadgets .content img { width: auto; height: 35px; } } #consumer-electronics #smart-gadgetry .content img { width: 22px; height: auto; } @media screen and (min-width: 768px) { #consumer-electronics #smart-gadgetry .content img { margin-top: 3px; width: auto; height: 25px; } } #consumer-electronics #home-appliances .content img { width: 23px; height: auto; } @media screen and (min-width: 768px) { #consumer-electronics #home-appliances .content img { width: auto; height: 28px; } } #consumer-electronics .empty-box .content .empty-banner { margin-bottom: 25px; width: 100%; height: 80px; background-color: #dbdbdb; } @media screen and (min-width: 768px) { #consumer-electronics .empty-box .content .empty-banner { margin-top: -5px; margin-bottom: 15px; } } #consumer-electronics .empty-box .link { clear: both; } #consumer-electronics .empty-box .link a span.text { font-size: 100%; } #consumer-electronics .service-box { margin-bottom: 10px; padding: 0 4px; } #consumer-electronics .service-box .service-box-wrapper .content { margin-top: 10px; } @media screen and (min-width: 768px) { #consumer-electronics .service-box .service-box-wrapper .content { margin-top: 15px; min-height: 110px; } } @media screen and (min-width: 992px) { #consumer-electronics .service-box .service-box-wrapper .content { min-height: 120px; } } #consumer-electronics .service-box .service-box-wrapper .link { padding: 0; border: 0; } /* Directory inquiries */ @media (min-width: 768px) { #directory-inquiries .content-area { padding-top: 15px; } } #directory-inquiries .service-boxes { padding-left: 0; padding-right: 0; } #directory-inquiries .service-boxes .icon { display: none; } #directory-inquiries .service-boxes .service-store-box { margin-bottom: 15px; } #directory-inquiries .section-heading { font-size: 135%; font-weight: bold; padding-bottom: 5px; } @media (min-width: 768px) { #directory-inquiries .section-heading { font-size: 190%; } } #directory-inquiries .navigation-tab { padding-top: 15px; } #directory-inquiries .tab-content { padding-left: 0; background-color: #eef3f9; padding-bottom: 25px; } #directory-inquiries .tab-content .inquiry-form-select { margin-top: 15px; padding-right: 0; } #directory-inquiries .tab-content .inquiry-form-select .filter-option { color: #acacac; } #directory-inquiries .tab-content .inquiry-form-select .btn { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #directory-inquiries .tab-content .inquiry-form-select .border-side-right, #directory-inquiries .tab-content .inquiry-form-select .border-side-left { display: none; } #directory-inquiries .tab-content .find-business-form, #directory-inquiries .tab-content .find-person-form { padding-left: 0; padding-right: 0; } #directory-inquiries .tab-content .find-business-form .indicator, #directory-inquiries .tab-content .find-person-form .indicator { color: red; } @media (min-width: 768px) { #directory-inquiries .tab-content .find-business-form .tip, #directory-inquiries .tab-content .find-person-form .tip { padding-bottom: 15px; } } #directory-inquiries .tab-content .find-business-form .form-control, #directory-inquiries .tab-content .find-business-form .btn, #directory-inquiries .tab-content .find-person-form .form-control, #directory-inquiries .tab-content .find-person-form .btn { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #directory-inquiries .tab-content .find-business-form .border-side-right, #directory-inquiries .tab-content .find-business-form .border-side-left, #directory-inquiries .tab-content .find-person-form .border-side-right, #directory-inquiries .tab-content .find-person-form .border-side-left { display: none; } #directory-inquiries .tab-content .find-business-form .custom-input-select button, #directory-inquiries .tab-content .find-person-form .custom-input-select button { margin-left: 0; } #directory-inquiries .tab-content .find-business-form .input-name, #directory-inquiries .tab-content .find-person-form .input-name { padding-right: 0; } @media (min-width: 768px) { #directory-inquiries .tab-content .find-business-form .input-name, #directory-inquiries .tab-content .find-person-form .input-name { padding-right: 10px; } } #directory-inquiries .tab-content .find-business-form .custom-padding-r, #directory-inquiries .tab-content .find-person-form .custom-padding-r { padding-right: 0; } @media (min-width: 768px) { #directory-inquiries .tab-content .find-business-form .custom-padding-r, #directory-inquiries .tab-content .find-person-form .custom-padding-r { padding-right: 10px; } } @media (min-width: 992px) { #directory-inquiries .tab-content .find-business-form .custom-padding-r, #directory-inquiries .tab-content .find-person-form .custom-padding-r { padding-right: 40px; } } #directory-inquiries .tab-content .find-business-form .search-btn, #directory-inquiries .tab-content .find-person-form .search-btn { background: url(../img/search-btn-101x30.png) no-repeat; border: none; width: 101px; height: 30px; margin-top: 20px; } #directory-inquiries .warning-msg { margin-top: 20px; } #directory-inquiries .warning-msg .warning-list { padding-left: 15px; } #directory-inquiries .warning-msg .warning-list li { list-style-image: url(../img/dash.png); } #directory-inquiries .warning-msg .warning-list .last { list-style-image: url(../img/arrow-blue-dotted-5x9.png); padding-top: 20px; } /* Directory inquiries */ @media (min-width: 768px) { #directory-local-search .content-area { padding-top: 15px; } } #directory-local-search .service-boxes { padding-left: 0; padding-right: 0; } #directory-local-search .service-boxes .icon { display: none; } #directory-local-search .service-boxes .service-store-box { margin-bottom: 15px; } #directory-local-search .section-heading { font-size: 135%; font-weight: bold; padding-bottom: 5px; padding-left: 15px; } @media (min-width: 768px) { #directory-local-search .section-heading { font-size: 190%; } } #directory-local-search .navigation-tab { padding-top: 15px; } #directory-local-search .tab-content { padding-left: 0; background-color: #eef3f9; padding-bottom: 25px; } #directory-local-search .tab-content .inquiry-form-select { margin-top: 15px; padding-right: 0; z-index: 5; } #directory-local-search .tab-content .inquiry-form-select .btn { border: none; } #directory-local-search .tab-content .inquiry-form-select .btn .placeholder { color: #acacac; } #directory-local-search .tab-content .inquiry-form-select .border-side-right, #directory-local-search .tab-content .inquiry-form-select .border-side-left { display: none; } #directory-local-search .tab-content .find-business-form, #directory-local-search .tab-content .find-person-form { padding-left: 0; padding-right: 0; /*.label-surname{ @media (min-width: $screen-sm){ width: 10%; } @media (min-width: $screen-md){ margin-left: 18px; } }*/ } #directory-local-search .tab-content .find-business-form .indicator, #directory-local-search .tab-content .find-person-form .indicator { color: red; } @media (min-width: 768px) { #directory-local-search .tab-content .find-business-form .tip, #directory-local-search .tab-content .find-person-form .tip { padding-bottom: 15px; } } #directory-local-search .tab-content .find-business-form .form-control, #directory-local-search .tab-content .find-business-form .btn, #directory-local-search .tab-content .find-person-form .form-control, #directory-local-search .tab-content .find-person-form .btn { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #directory-local-search .tab-content .find-business-form .custom-input-select button, #directory-local-search .tab-content .find-person-form .custom-input-select button { margin-left: 0; } #directory-local-search .tab-content .find-business-form .form-label, #directory-local-search .tab-content .find-person-form .form-label { margin-right: 5px; } #directory-local-search .tab-content .find-business-form .form-label-1, #directory-local-search .tab-content .find-person-form .form-label-1 { margin-right: 8px; } #directory-local-search .tab-content .find-business-form .border-side-right, #directory-local-search .tab-content .find-business-form .border-side-left, #directory-local-search .tab-content .find-person-form .border-side-right, #directory-local-search .tab-content .find-person-form .border-side-left { display: none; } #directory-local-search .tab-content .find-business-form .custom-padding-r, #directory-local-search .tab-content .find-person-form .custom-padding-r { padding-right: 0; } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .custom-padding-r, #directory-local-search .tab-content .find-person-form .custom-padding-r { padding-left: 0; } } @media (min-width: 768px) { #directory-local-search .tab-content .find-business-form .area-select, #directory-local-search .tab-content .find-person-form .area-select { padding-left: 0; } } @media (min-width: 768px) { #directory-local-search .tab-content .find-business-form .clear, #directory-local-search .tab-content .find-person-form .clear { clear: both; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .clear, #directory-local-search .tab-content .find-person-form .clear { display: none; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .label-name, #directory-local-search .tab-content .find-person-form .label-name { margin-left: 5px; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .input-name, #directory-local-search .tab-content .find-person-form .input-name { width: 180px; margin-left: -10px; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .label-area, #directory-local-search .tab-content .find-person-form .label-area { /*margin-left: 18px;*/ margin-left: 5px; margin-right: -25px; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .label-district, #directory-local-search .tab-content .find-person-form .label-district { margin-left: 60px; margin-right: -10px; } } @media (min-width: 768px) { #directory-local-search .tab-content .find-business-form .select-district, #directory-local-search .tab-content .find-person-form .select-district { padding-left: 12px; padding-right: 3px; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .select-district, #directory-local-search .tab-content .find-person-form .select-district { margin-left: -10px; } } #directory-local-search .tab-content .find-business-form .search-btn, #directory-local-search .tab-content .find-person-form .search-btn { background: url(../img/search-btn-101x30.png) no-repeat; border: none; width: 101px; height: 30px; margin-top: 20px; } @media (min-width: 768px) { #directory-local-search .tab-content .find-business-form .search-btn, #directory-local-search .tab-content .find-person-form .search-btn { margin-top: 3px; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .search-btn, #directory-local-search .tab-content .find-person-form .search-btn { margin-top: 6px; margin-right: -25px; } } #directory-local-search .tab-content .find-business-form .btn, #directory-local-search .tab-content .find-person-form .btn { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .btn, #directory-local-search .tab-content .find-person-form .btn { width: 135%; } } @media (min-width: 992px) { #directory-local-search .tab-content .find-business-form .dropdown-menu, #directory-local-search .tab-content .find-person-form .dropdown-menu { width: 135%; } } #directory-local-search .tab-content .find-business-form .border-side-right, #directory-local-search .tab-content .find-business-form .border-side-left, #directory-local-search .tab-content .find-person-form .border-side-right, #directory-local-search .tab-content .find-person-form .border-side-left { display: none; } @media screen and (min-width: 768px) { #directory-local-search .tab-content .find-person-form .label-name, #directory-local-search .tab-content .find-person-form .label-surname { padding-right: 0; width: auto; } } @media screen and (min-width: 768px) { #directory-local-search .tab-content .find-person-form .input-name-wrapper { padding-left: 1px; } } @media screen and (min-width: 992px) { #directory-local-search .tab-content .find-person-form .input-name-wrapper { padding-left: 15px; width: auto; } } #directory-local-search .warning-msg { margin-top: 20px; } #directory-local-search .warning-msg .warning-list { padding-left: 15px; } #directory-local-search .warning-msg .warning-list li { list-style-image: url(../img/dash.png); } #directory-local-search .warning-msg .warning-list .last { list-style-image: url(../img/arrow-blue-dotted-5x9.png); padding-top: 20px; } #directory-local-search .search-total { font-size: 140%; padding-top: 10px; padding-bottom: 10px; border-bottom: 2px solid #b7b7b7; } @media (min-width: 768px) { #directory-local-search .search-total { font-size: 175%; border: none; padding-top: 30px; padding-bottom: 20px; } } /* Directory International Search */ #directory-international-search .left-side-content { padding-left: 0; padding-right: 0; } @media (min-width: 768px) { #directory-international-search .left-side-content .content-area { padding-top: 15px; } } #directory-international-search .left-side-content .detail-content { padding-left: 8px; } #directory-international-search .left-side-content .section-heading { font-size: 135%; font-weight: bold; padding-bottom: 5px; padding-left: 15px; } @media (min-width: 768px) { #directory-international-search .left-side-content .section-heading { font-size: 190%; } } #directory-international-search .left-side-content .form-holder { background-color: #eef3f9; } #directory-international-search .left-side-content .form-holder form { padding-top: 15px; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form { padding-top: 25px; } } #directory-international-search .left-side-content .form-holder form .clear { clear: both; } #directory-international-search .left-side-content .form-holder form .indicator { color: red; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .tip { padding-bottom: 10px; } } #directory-international-search .left-side-content .form-holder form .form-control, #directory-international-search .left-side-content .form-holder form .btn { height: 32px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: none; } #directory-international-search .left-side-content .form-holder form .form-control .filter-option, #directory-international-search .left-side-content .form-holder form .btn .filter-option { color: #acacac; } #directory-international-search .left-side-content .form-holder form .custom-input-select button { margin-left: 0; } #directory-international-search .left-side-content .form-holder form .radio-btn { padding-bottom: 3px; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .radio-btn { padding-bottom: 10px; } } #directory-international-search .left-side-content .form-holder form .radio-btn .radio-inline { margin-top: -2px; } #directory-international-search .left-side-content .form-holder form label { margin-left: 5px; font-weight: normal; } #directory-international-search .left-side-content .form-holder form .btns-group { padding-bottom: 20px; } #directory-international-search .left-side-content .form-holder form .btns-group .submit-form-btn { margin-right: 10px; display: block; width: 101px; height: 30px; border: none; background: url(../img/submit-btn-101x30.png) right top no-repeat; } #directory-international-search .left-side-content .form-holder form .btns-group #reset-btn { width: 101px; height: 30px; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .select-area-to, #directory-international-search .left-side-content .form-holder form .select-area-from { padding-left: 0; padding-bottom: 10px; } } #directory-international-search .left-side-content .form-holder form .select-country-to, #directory-international-search .left-side-content .form-holder form .select-country-from { padding-bottom: 5px; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .select-minute { margin-left: -10px; } } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .remarks { padding-top: 30px; padding-bottom: 15px; } } #directory-international-search .left-side-content .form-holder form .border-side-right, #directory-international-search .left-side-content .form-holder form .border-side-left { display: none; } #directory-international-search .left-side-content .form-holder form .time-separator { float: left; margin-top: 12px; margin-left: 0; } @media (min-width: 768px) { #directory-international-search .left-side-content .form-holder form .time-separator { margin-left: -6px; } } #directory-international-search .left-side-content .search-results { padding-top: 25px; } #directory-international-search .left-side-content .search-results .search-total { font-weight: bold; } @media (min-width: 768px) { #directory-international-search .left-side-content .search-results .search-total { font-weight: normal; margin-top: 10px; } } @media (min-width: 768px) { #directory-international-search .left-side-content .search-results .search-total #keyword { font-weight: bold; } } #directory-international-search .left-side-content .note { margin-top: 20px; border-top: 1px solid #b7b7b7; padding: 20px 0 15px 0; } #directory-international-search .left-side-content .rate-and-sched, #directory-international-search .left-side-content .rate-and-sched-2-col, #directory-international-search .left-side-content .rate-and-sched-3-col { margin-bottom: 15px; } @media (min-width: 768px) { #directory-international-search .left-side-content .rate-and-sched, #directory-international-search .left-side-content .rate-and-sched-2-col, #directory-international-search .left-side-content .rate-and-sched-3-col { margin-bottom: 30px; } } #directory-international-search .left-side-content .rate-and-sched .col-head, #directory-international-search .left-side-content .rate-and-sched-2-col .col-head, #directory-international-search .left-side-content .rate-and-sched-3-col .col-head { padding-top: 5px; padding-bottom: 5px; background-color: #e5e5e5; border-top: 1px solid #b7b7b7; border-bottom: 1px solid #b7b7b7; } #directory-international-search .left-side-content .rate-and-sched .col-head .last-col-head, #directory-international-search .left-side-content .rate-and-sched-2-col .col-head .last-col-head, #directory-international-search .left-side-content .rate-and-sched-3-col .col-head .last-col-head { padding-right: 10px; } @media (min-width: 768px) { #directory-international-search .left-side-content .rate-and-sched .col-head .last-col-head, #directory-international-search .left-side-content .rate-and-sched-2-col .col-head .last-col-head, #directory-international-search .left-side-content .rate-and-sched-3-col .col-head .last-col-head { padding-right: 15px; } } #directory-international-search .left-side-content .rate-and-sched .rate-info, #directory-international-search .left-side-content .rate-and-sched-2-col .rate-info, #directory-international-search .left-side-content .rate-and-sched-3-col .rate-info { padding-top: 5px; padding-bottom: 15px; border-bottom: 1px solid #b7b7b7; } @media (min-width: 768px) { #directory-international-search .left-side-content .rate-and-sched .rate-info, #directory-international-search .left-side-content .rate-and-sched-2-col .rate-info, #directory-international-search .left-side-content .rate-and-sched-3-col .rate-info { padding-bottom: 25px; } } /* ------------------------------------- SERVICE RELOCATION --------------------------------------- */ #service-relocation { /*form { .custom-form { background-color: #eef3f9; h4 { margin-top: 0; font-size: 130%; @media screen and (min-width: $screen-sm) { margin-top: 5px; font-size: 180%; } } .tip span, .form-label { font-size: 120%; } .form-label { @media screen and (min-width: $screen-sm) { margin-top: 7px; line-height: 30px; } } .tip { @media screen and (min-width: $screen-sm) { padding-top: 15px; padding-bottom: 30px; } } .radio { @media screen and (min-width: $screen-sm) { margin-top: 15px; margin-bottom: 5px; } label { padding: 0; @media screen and (min-width: $screen-sm) { padding-left: 20px; } .radio-btn { width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; @media screen and (min-width: $screen-sm) { display: none; } } .radio-btn-selected { background-position: left center; } .custom-label { margin-top: 5px; margin-left: 5px; display: inline-block; vertical-align: top; @media screen and (min-width: $screen-sm) { margin: 0; display: block; vertical-align: middle; } } input[type="radio"] { display: none; @media screen and (min-width: $screen-sm) { margin-top: 0; display: block; } } } .label-wrapper { margin: 0; label { font-size: 120%; } } } input[type="text"]{ font-size: 120%; } .indicator { color: red; } .form-control{ border-radius: 3px; border: none } .custom-padding-r{ padding-right: 4px; } .custom-padding-l{ padding-left: 4px; } .privacy-statement { @media screen and (min-width: $screen-sm) { text-align: right; } span { @extend .font-block-content; &.link-label { padding-top: 1px; padding-left: 15px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; } } } } .form_datetime { background: #fff url(../img/calendar.png) no-repeat 98% 50%; @media screen and (min-width: $screen-sm) { width: 50%; background-position-x: 95%; } } .legend { @media screen and (min-width: $screen-sm) { padding-top: 20px; padding-left: 10px; font-size: 120%; } } }*/ /*.btnz-group { @media screen and (min-width: $screen-sm) { padding-right: 10px; } @media screen and (min-width: $screen-md) { padding-right: 15px; } a { margin-left: 10px; .btn-image { height: 30px; width: 101px; } } input[type=submit].submit-form-btn, input[type=reset].reset-form-btn { margin-left: 10px; display: block; width: 116px; height: 35px; border: none; @media screen and (min-width: $screen-sm) { width: 101px; height: 30px; } } input[type=submit].submit-form-btn { background: url(../img/submit-btn-mobile.png) right top no-repeat; @media screen and (min-width: $screen-sm) { background: url(../img/submit-btn-101x30.png) right top no-repeat; } } input[type=reset].reset-form-btn { background: url(../img/reset-btn-mobile.png) right top no-repeat; @media screen and (min-width: $screen-sm) { background: url(../img/reset-btn-101x30.png) right top no-repeat; } } }*/ } @media screen and (min-width: 992px) { #service-relocation .page-title { margin-bottom: 35px; } } @media screen and (min-width: 768px) { #service-relocation .chat-wrapper { margin-bottom: 10px; } } @media screen and (min-width: 992px) { #service-relocation .chat-wrapper { float: right; margin: 0; padding-left: 10px; } } @media screen and (min-width: 992px) { #service-relocation .form-wrapper { float: left; margin-bottom: 35px; } } @media screen and (min-width: 992px) { #service-relocation .hotline-wrapper { float: right; padding-left: 10px; } } #service-relocation #live-chat-link { border-bottom: 1px solid #f1f1f1; } @media screen and (min-width: 992px) { #service-relocation #live-chat-link { border-color: #cccccc; } } @media screen and (min-width: 992px) { #service-relocation #live-chat-link { border: none; } } @media screen and (min-width: 768px) { #service-relocation .divider { margin-top: 20px; border-bottom: 1px solid #a6bcc9; } } #service-relocation .hotline { border-top: 1px solid #f1f1f1; } @media screen and (min-width: 768px) { #service-relocation .hotline { margin-top: 20px; margin-bottom: 35px; padding: 15px 8px 20px 8px; border-bottom: 1px solid; border-color: #cccccc; } } @media screen and (min-width: 992px) { #service-relocation .hotline { margin: 0; } } #service-relocation .hotline .title, #service-relocation .hotline .hotline-number { font-size: 140%; } @media screen and (min-width: 768px) { #service-relocation .hotline .title, #service-relocation .hotline .hotline-number { clear: both; font-size: 160%; } } #service-relocation .hotline .title { color: #666666; } #service-relocation .hotline .hotline-number { color: #002c71; } #service-reloc-form .custom-form { background-color: #eef3f9; } #service-reloc-form .custom-form h4 { margin-top: 0; font-size: 130%; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form h4 { margin-top: 5px; font-size: 180%; } } #service-reloc-form .custom-form .tip span, #service-reloc-form .custom-form .form-label { font-size: 120%; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .form-label { margin-top: 7px; line-height: 30px; } } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .tip { padding-top: 15px; padding-bottom: 30px; } } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .radio { margin-top: 15px; margin-bottom: 5px; } } #service-reloc-form .custom-form .radio label { padding: 0; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .radio label { padding-left: 20px; } } #service-reloc-form .custom-form .radio label .radio-btn { width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .radio label .radio-btn { display: none; } } #service-reloc-form .custom-form .radio label .radio-btn-selected { background-position: left center; } #service-reloc-form .custom-form .radio label .custom-label { margin-top: 5px; margin-left: 5px; display: inline-block; vertical-align: top; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .radio label .custom-label { margin: 0; display: block; vertical-align: middle; } } #service-reloc-form .custom-form .radio label input[type="radio"] { display: none; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .radio label input[type="radio"] { margin-top: 0; display: block; } } #service-reloc-form .custom-form .radio .label-wrapper { margin: 0; } #service-reloc-form .custom-form .radio .label-wrapper label { font-size: 120%; } #service-reloc-form .custom-form input[type="text"] { font-size: 120%; } #service-reloc-form .custom-form .indicator { color: red; } #service-reloc-form .custom-form .form-control { border-radius: 3px; border: none; } #service-reloc-form .custom-form .custom-padding-r { padding-right: 4px; } #service-reloc-form .custom-form .custom-padding-l { padding-left: 4px; } @media screen and (min-width: 768px) { #service-reloc-form .custom-form .privacy-statement { text-align: right; } } #service-reloc-form .custom-form .privacy-statement span.link-label { padding-top: 1px; padding-left: 15px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; color: #666; } #service-reloc-form .custom-form .privacy-statement span.link-label:hover { border: none; } #service-reloc-form .custom-form.iframe-custom-form #date + div { clear: both; } #service-reloc-form .custom-form.iframe-custom-form .radio-option { width: 16.6667%; } #service-reloc-form .custom-form.iframe-custom-form .col-3, #service-reloc-form .custom-form.iframe-custom-form .form-label { width: 25%; } #service-reloc-form .custom-form.iframe-custom-form .col-sm-block.col-3 { float: left; } #service-reloc-form .custom-form.iframe-custom-form .col-9 { width: 75%; } #service-reloc-form .custom-form.iframe-custom-form .col-5 { width: 41.66667%; } #service-reloc-form .custom-form.iframe-custom-form .col-4 { width: 33.33333%; } #service-reloc-form .custom-form.iframe-custom-form h4 { margin-top: 5px; font-size: 180%; } #service-reloc-form .custom-form.iframe-custom-form .form-label { margin-top: 7px; line-height: 30px; } #service-reloc-form .custom-form.iframe-custom-form .tip { padding-top: 15px; padding-bottom: 30px; } #service-reloc-form .custom-form.iframe-custom-form .radio { margin-top: 15px; margin-bottom: 5px; } #service-reloc-form .custom-form.iframe-custom-form .radio label { padding-left: 20px; } #service-reloc-form .custom-form.iframe-custom-form .radio label .radio-btn { display: none; } #service-reloc-form .custom-form.iframe-custom-form .radio label .custom-label { margin: 0; display: block; vertical-align: middle; } #service-reloc-form .custom-form.iframe-custom-form .radio label input[type="radio"] { margin-top: 0; display: block; } #service-reloc-form .custom-form.iframe-custom-form .privacy-statement { text-align: right; } #service-reloc-form .custom-form.iframe-custom-form .privacy-statement span { font-size: 120%; } #service-reloc-form .custom-form.iframe-custom-form .form_datetime { width: 100%; background-position-x: 95%; } #service-reloc-form .custom-form.iframe-custom-form ~ .legend { padding-top: 20px; padding-left: 10px; font-size: 120%; } #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group { padding-right: 10px; } @media screen and (min-width: 992px) { #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group { padding-right: 15px; } } #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group input[type=submit].submit-form-btn, #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group input[type=reset].reset-form-btn { width: 101px; height: 30px; } #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group input[type=submit].submit-form-btn { background: url(../img/submit-btn-101x30.png) right top no-repeat; } #service-reloc-form .custom-form.iframe-custom-form ~ .btnz-group input[type=reset].reset-form-btn { background: url(../img/reset-btn-101x30.png) right top no-repeat; } #service-reloc-form .form_datetime { background: white url(../img/calendar.png) no-repeat 98% 50%; } @media screen and (min-width: 768px) { #service-reloc-form .form_datetime { width: 50%; background-position-x: 95%; } } @media screen and (min-width: 768px) { #service-reloc-form .legend { padding-top: 20px; padding-left: 10px; font-size: 120%; } } @media screen and (min-width: 768px) { #service-reloc-form .btnz-group { padding-right: 10px; } } @media screen and (min-width: 992px) { #service-reloc-form .btnz-group { padding-right: 15px; } } #service-reloc-form .btnz-group a { /* buttons spacing */ margin-left: 10px; } #service-reloc-form .btnz-group a .btn-image { height: 30px; width: 101px; } #service-reloc-form .btnz-group input[type=submit].submit-form-btn, #service-reloc-form .btnz-group input[type=reset].reset-form-btn { margin-left: 10px; display: block; width: 116px; height: 35px; border: none; } @media screen and (min-width: 768px) { #service-reloc-form .btnz-group input[type=submit].submit-form-btn, #service-reloc-form .btnz-group input[type=reset].reset-form-btn { width: 101px; height: 30px; } } #service-reloc-form .btnz-group input[type=submit].submit-form-btn { background: url(../img/submit-btn-mobile.png) right top no-repeat; } @media screen and (min-width: 768px) { #service-reloc-form .btnz-group input[type=submit].submit-form-btn { background: url(../img/submit-btn-101x30.png) right top no-repeat; } } #service-reloc-form .btnz-group input[type=reset].reset-form-btn { background: url(../img/reset-btn-mobile.png) right top no-repeat; } @media screen and (min-width: 768px) { #service-reloc-form .btnz-group input[type=reset].reset-form-btn { background: url(../img/reset-btn-101x30.png) right top no-repeat; } } /* ------------------- STORES & SHOWROOMS --------------------- */ @media screen and (min-width: 992px) { #stores-and-showrooms .main-content { padding-right: 5px; } } @media screen and (min-width: 992px) { #stores-and-showrooms .other-content { margin-top: 28px; padding-left: 5px; } } #stores-and-showrooms .page-logo img { width: 108px; height: 23px; } @media screen and (min-width: 768px) { #stores-and-showrooms .page-logo img { width: auto; height: 28px; } } #stores-and-showrooms .page-detail p.bot-space { margin-bottom: 35px; } #stores-and-showrooms .account-detail { margin-bottom: 15px; } #stores-and-showrooms .account-detail .header h2 { margin: 0; color: #442b7f; } #stores-and-showrooms .account-detail .detail { margin: 0; font-size: 100%; } #stores-and-showrooms .account-detail .detail .detail-row { padding: 0; } #stores-and-showrooms .account-detail .detail label { margin-right: 5px; margin-bottom: 0; min-width: 0; width: auto; } #stores-and-showrooms #gen-store-info { border-top: 4px solid #442b7f; border-bottom: 4px solid #442b7f; } #stores-and-showrooms .accordian .panel { box-shadow: none; } #stores-and-showrooms .accordian .panel .panel-heading { height: 48px; border-bottom: 2px solid #369ae6; } #stores-and-showrooms .accordian .panel .panel-heading span { color: #006ea5; font-size: 100%; } @media screen and (min-width: 768px) { #stores-and-showrooms .accordian .panel .panel-heading span { font-size: 120%; } } #stores-and-showrooms .accordian .panel .panel-heading span.text { line-height: 26px; } #stores-and-showrooms .accordian .panel .panel-heading span.accordian-toggle { margin-top: 10px; width: 11px; height: 6px; display: block; background: url(../img/arrow-down-blue-11x6.png) no-repeat; } #stores-and-showrooms .accordian .panel.expanded .panel-heading span.accordian-toggle { background: url(../img/arrow-up-blue-11x6.png) no-repeat; } #stores-and-showrooms .accordian .panel .panel-body { padding-bottom: 0; border: none; } #stores-and-showrooms .accordian .panel .panel-body > div { margin: 0 -15px; } @media screen and (min-width: 768px) { #stores-and-showrooms .accordian .panel .panel-body > div { padding-left: 20px; } } #stores-and-showrooms .others { padding: 5px 0 20px 0; } @media screen and (min-width: 768px) { #stores-and-showrooms .others { padding: 25px 0 30px 0; } } #stores-and-showrooms .others h2 { color: #333333; font-size: 140%; text-align: center; } @media screen and (min-width: 768px) { #stores-and-showrooms .others h2 { padding: 0 15px 10px 15px; font-size: 200%; text-align: left; } } #stores-and-showrooms .others .box-other-link .link .arrow-holder .arrow-bullet { padding-top: 3px; } @media screen and (min-width: 992px) { #stores-and-showrooms .others .box-other-link .link .arrow-holder .arrow-bullet { padding-top: 4px; } } #stores-and-showrooms #map_canvas { width: 100%; height: 350px; } #stores-and-showrooms #map-location .modal-dialog { margin: 150px 25px 25px; min-width: 270px; } @media screen and (min-width: 768px) { #stores-and-showrooms #map-location .modal-dialog { margin: 150px auto auto; } } /* Batch 4 - Pages */ /* Page job opportunities */ #job-opportunities .top-content { padding-left: 0; } #job-opportunities .top-content .content-area { padding-left: 8px; } #job-opportunities .top-content .page-detail { margin-top: 5px; margin-bottom: 15px; } @media (min-width: 768px) { #job-opportunities .top-content .page-detail { margin-top: 15px; } } #job-opportunities .dropdown-toggle { color: inherit; font-size: 110%; padding: 5px 25px 5px 5px; } @media (min-width: 768px) { #job-opportunities .dropdown-toggle { color: #acacac; font-size: 105%; } } #job-opportunities .dropdown-menu { font-size: 105%; } #job-opportunities .dropdown-menu .text { color: #666; } @media (min-width: 768px) { #job-opportunities .dropdown-menu .text { color: #acacac; } } #job-opportunities .jobs-found-indicator { margin-top: 20px; padding-left: 8px; } #job-opportunities .select-criteria { margin: 5px 0 5px 0; padding-left: 8px; padding-right: 0; } @media (min-width: 768px) { #job-opportunities .select-criteria { margin-top: 10px; margin-bottom: 10px; } } @media (min-width: 992px) { #job-opportunities .select-criteria { margin-top: 10px; margin-bottom: 20px; } } /* GRADUTE TRAINEE PROGRAMS */ #graduate-trainee-programs #left-content { padding-left: 0; padding-right: 0; } #graduate-trainee-programs #left-content .content-video { margin-top: 10px; margin-bottom: 20px; } @media (min-width: 768px) { #graduate-trainee-programs #left-content .content-video { padding-left: 0; } } #graduate-trainee-programs #left-content .page-content-detail p { margin-bottom: 20px; } #graduate-trainee-programs #left-content .carousel-holder .training-pics-caption { font-size: 95%; font-style: italic; margin-top: 5px; margin-bottom: 0; } @media (min-width: 768px) { #graduate-trainee-programs #left-content .carousel-holder .training-pics-caption { margin-bottom: 0; font-size: 110%; } } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper { padding: 10px 20px; margin-bottom: 0; } @media (min-width: 768px) { #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper { padding: 10px 30px; } } @media (min-width: 992px) { #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper { padding: 10px 32px; } } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-nav-prev { background: url(../img/arrow-l-blue-6x11.png) no-repeat center; left: -3px; } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-nav-next { background: url(../img/arrow-blue-6x11.png) no-repeat center; right: -3px; } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-carousel ul .selected > a { border-color: #1d8fe3; } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-carousel ul li { width: 48px !important; } @media (min-width: 768px) { #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-carousel ul li { width: 72px !important; } } @media (min-width: 992px) { #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-carousel ul li { width: 77px !important; } } #graduate-trainee-programs #left-content .carousel-holder .rg-thumbs .es-carousel-wrapper .es-carousel ul li a { border-color: #FFF; opacity: 1; } #graduate-trainee-programs .sub-heading { color: #1c2a47; font-weight: bold; font-style: italic; margin-top: 20px; } @media screen and (min-width: 992px) { #graduate-trainee-programs #right-content { margin-top: 32px; } } #graduate-trainee-programs #right-content .update-heading { padding-bottom: 10px; color: #333333; text-align: center; font-family: "Lato-Bold", Arial, sans-serif; } @media (min-width: 768px) { #graduate-trainee-programs #right-content .update-heading { text-align: left; padding-left: 10px; border-bottom: 1px solid #ddd; font-size: 190%; } } #graduate-trainee-programs #right-content .service-form { padding-left: 0; padding-right: 0; margin-bottom: 30px; margin-top: 20px; } @media (min-width: 992px) { #graduate-trainee-programs #right-content .service-form { margin-bottom: 15px; } } @media (min-width: 768px) { #graduate-trainee-programs #right-content #sidebar-holder { margin-top: 15px; } } @media (min-width: 992px) { #graduate-trainee-programs #right-content #sidebar-holder { margin-top: 0; } } #graduate-trainee-programs #right-content #sidebar-holder #sidebar-title { font-family: "Lato-Bold", Arial, sans-serif; color: #333333; } /* CONTENT CAREERS */ #careers .page-title-holder { position: relative; padding-left: 0; z-index: 5; } #careers .content-holder { padding-left: 0; padding-right: 0; } @media (min-width: 992px) { #careers .content-holder { margin-left: 0; } } #careers .job-lists { margin-top: 20px; } #careers .left-content { padding-left: 0; padding-right: 0; } #careers .left-content .page-detail .why-hkt-link { color: inherit; } #careers .left-content .graduate-box { padding-right: 15px; } @media (min-width: 768px) { #careers .left-content .graduate-box { padding-right: 5px; } } #careers .left-content .internship-box { padding-left: 15px; margin-top: -20px; } @media (min-width: 768px) { #careers .left-content .internship-box { padding-left: 5px; margin-top: 0; } } #careers .left-content .box-with-link { margin-bottom: 15px; } @media (min-width: 768px) { #careers .left-content .box-with-link .title { margin-top: 0; } } #careers .right-content { padding-left: 0; padding-right: 0; } @media (min-width: 992px) { #careers .right-content { padding-left: 15px; } } #careers .right-content h2 { font-size: 180%; color: #03437e; font-weight: bold; border-bottom: 2px solid #178be2; padding-bottom: 10px; } @media (min-width: 992px) { #careers .right-content h2 { margin-top: 0; } } #careers .right-content .job-opportunities .header-label { border-top: 0; } #careers .right-content .job-opportunities .col-label { padding-left: 5px; } #careers .right-content .job-opportunities .job-results-holder { border-top: 0; } #careers .right-content .job-opportunities .job-results-holder .job-lists { margin-top: 0; } @media (min-width: 768px) { #careers .right-content .job-opportunities .job-results-holder .job-lists { margin-top: 5px; } } #careers .right-content .job-opportunities .job-results-holder .job-lists .mobile-job-result { padding-left: 5px; } #careers .right-content .find-more { color: inherit; font-size: 110%; font-weight: bold; padding: 10px 0 10px 0; margin-bottom: 20px; border-bottom: 1px solid #dadada; } @media (min-width: 768px) { #careers .right-content .find-more { font-size: 130%; } } #careers .right-content .find-more a { color: inherit; } #careers .right-content .find-more .link-icon { background: url(../img/arrow-blue-6x11.png) no-repeat; width: 13px; height: 13px; display: inline-block; margin-bottom: -4px; margin-left: 10px; } /* Share Performance Page */ #share-performance .left-content, #share-performance .right-content { padding-left: 0; padding-right: 0; } @media (min-width: 992px) { #share-performance .left-content, #share-performance .right-content { padding-right: 20px; } } #share-performance .left-content #ele-share-details, #share-performance .left-content #ele-stock-price-history, #share-performance .right-content #ele-share-details, #share-performance .right-content #ele-stock-price-history { margin-top: 40px; } @media screen and (min-width: 992px) { #share-performance .right-content { margin-top: -8px; } } @media (min-width: 992px) { #share-performance .investor-relations #menu .menu-title { margin-top: 0; padding: 0 20px; } } /* Press Relase Detail */ #press-release-detail .press-header { padding: 12px 0 12px 0; } #press-release-detail .press-release-content .content-heading, #press-release-detail .modal-content .content-heading { color: #006ea5; font-weight: bold; font-size: 120%; margin-top: 10px; } @media (min-width: 768px) { #press-release-detail .press-release-content .content-heading, #press-release-detail .modal-content .content-heading { font-size: 130%; } } #press-release-detail .press-release-content .sub-heading, #press-release-detail .modal-content .sub-heading { margin-top: 25px; } @media (min-width: 768px) { #press-release-detail .press-release-content .sub-heading, #press-release-detail .modal-content .sub-heading { margin-top: -10px; margin-bottom: 30px; } } #press-release-detail .press-release-content p, #press-release-detail .modal-content p { margin-bottom: 20px; } #press-release-detail .press-release-content #issued-by, #press-release-detail .modal-content #issued-by { margin: 15px 0 20px 0; } @media (min-width: 768px) { #press-release-detail .press-release-content #issued-by, #press-release-detail .modal-content #issued-by { margin: 20px 0 30px 0; } } #press-release-detail .press-release-content .more-info-text, #press-release-detail .modal-content .more-info-text { margin-bottom: 10px; margin-top: -5px; } @media (min-width: 768px) { #press-release-detail .press-release-content .more-info-text, #press-release-detail .modal-content .more-info-text { margin-bottom: 15px; margin-top: 30px; } } #press-release-detail .download-print-holder { padding-top: 8px; padding-bottom: 8px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin-bottom: 15px; } @media (min-width: 768px) { #press-release-detail .download-print-holder { padding-top: 5px; padding-bottom: 5px; } } #press-release-detail .download-print-holder .download-print { padding-left: 5px; padding-right: 0; } #press-release-detail .download-print-holder .download-print a { color: inherit; } #press-release-detail .download-print-holder .download-print .print-download-icon { width: 23px; margin-right: 20px; margin-left: 10px; } @media (min-width: 768px) { #press-release-detail .download-print-holder { font-weight: bold; } } #press-release-detail .pccw-footer { margin-top: 40px; border-top: 2px solid #ccc; padding: 30px 0 5px 0; } #press-release-detail .pccw-footer .copyright { font-size: 85%; } /* ----------------- PAGE - AWARDS ------------------- */ @media screen and (min-width: 992px) { #awards .content-area { position: relative; } } @media screen and (min-width: 768px) { #awards .content-area .page-detail { margin-bottom: 20px; } } @media screen and (min-width: 992px) { #awards .content-area .page-detail { margin-bottom: 45px; } } @media screen and (min-width: 768px) { #awards .content-area .filter label { line-height: 32px; } } @media screen and (min-width: 768px) { #awards .content-area .filter .date-filter { padding-left: 0; } } #awards .content-area .filter .date-filter .custom-input-select .dropdown-menu, #awards .content-area .filter .date-filter .custom-input-select ul.dropdown-menu li, #awards .content-area .filter .date-filter .custom-input-select ul.dropdown-menu li a { font-size: 100%; } @media screen and (min-width: 992px) { #awards .content-area .awards-list-wrapper { padding-bottom: 20px; } } #awards .content-area .other-links-wrapper { padding: 25px 15px; } @media screen and (min-width: 768px) { #awards .content-area .other-links-wrapper { padding-top: 10px; } } @media screen and (min-width: 768px) { #awards .content-area .other-links-wrapper .the-other-links .header { padding-bottom: 10px; } } #awards .content-area .other-links-wrapper .the-other-links .box-other-link .link { font-size: 100%; } #awards .content-area .desk-other-links { margin-top: -3px; margin-bottom: 20px; padding-left: 5px; } #awards .content-area .desk-other-links .the-other-links .header { padding-bottom: 10px; } #awards .content-area .desk-other-links .the-other-links .box-other-link .link { font-size: 100%; } #awards .sidebar-links .header { text-align: center; font-size: 170%; color: #333; } @media (min-width: 768px) { #awards .sidebar-links .header { text-align: left; padding-left: 30px; } } #awards .sidebar-links .item-list { padding-bottom: 28px; } #awards .sidebar-links .item-list .item { padding: 10px 20px; } #awards .sidebar-links .item-list .item a img { display: inline !important; } /* ---------------------------------------- PAGE - EMAIL ALERT REGISTRATION ------------------------------------------ */ #email-alert-reg { /*form { .custom-form { background-color: #eef3f9; @media screen and (min-width: $screen-sm) { padding: 10px; } h4 { margin-top: 0; font-size: 130%; @media screen and (min-width: $screen-sm) { margin-top: 5px; font-size: 180%; } } .info, .form-label, .custom-label { @extend %content-details-font; } .form-label { @media screen and (min-width: $screen-sm) { margin-top: 7px; line-height: 30px; } } .radio { @media screen and (min-width: $screen-sm) { margin-top: 15px; margin-bottom: 5px; } label { padding: 0; @media screen and (min-width: $screen-sm) { padding-left: 20px; } .radio-btn { width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; @media screen and (min-width: $screen-sm) { display: none; } } .radio-btn-selected { background-position: left center; } .custom-label { margin-top: 5px; display: inline-block; vertical-align: top; @media screen and (min-width: $screen-sm) { margin: 0; display: block; vertical-align: middle; } &.label-residential { margin-left: -1px; @media screen and (min-width: $screen-sm) { margin-left: 0; } } } input[type="radio"] { display: none; @media screen and (min-width: $screen-sm) { display: block; } } } .label-wrapper { margin: 0; } } input[type="text"]{ @extend %content-details-font; } .indicator { color: red; } .form-control{ border-radius: 3px; border: none } .custom-padding-r{ padding-right: 4px; } .custom-padding-l{ padding-left: 4px; } .privacy-statement { span { @extend .font-block-content; &.link-label { padding-top: 1px; padding-left: 15px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; } } } } .form_datetime { background: #fff url(../img/calendar.png) no-repeat 98% 50%; @media screen and (min-width: $screen-sm) { width: 50%; background-position-x: 95%; } } .legend { @media screen and (min-width: $screen-sm) { padding-top: 20px; padding-left: 10px; font-size: 120%; } } .btnz-group { @media screen and (min-width: $screen-sm) { padding-right: 75px; } @media screen and (min-width: $screen-md) { padding-right: 25px; } a { margin-left: 10px; .btn-image { height: 30px; width: 101px; } } input[type=submit].subscribe-form-btn, input[type=submit].unsubscribe-form-btn { margin-left: 10px; display: block; width: 116px; height: 28px; border: none; @media screen and (min-width: $screen-sm) { width: 135px; height: 32px; } } input[type=submit].subscribe-form-btn { background: url(../img/mobile-subscribe-btn.png) right top no-repeat; @media screen and (min-width: $screen-sm) { background: url(../img/subscribe-btn.png) right top no-repeat; } } input[type=submit].unsubscribe-form-btn { background: url(../img/mobile-unsubscribe-btn.png) right top no-repeat; @media screen and (min-width: $screen-sm) { background: url(../img/unsubscribe-btn.png) right top no-repeat; } } } }*/ } #email-alert-reg .page-detail { margin: 0px; padding: 15px; background-color: #eef3f9; } @media screen and (min-width: 768px) { #email-alert-reg .page-detail { margin-top: 10px; background-color: #fff; } } @media screen and (min-width: 992px) { #email-alert-reg .other-links { padding-left: 5px; } } #email-alert-reg .other-links .dropdown-header { font-size: 130%; color: #000; } @media screen and (min-width: 768px) { #email-alert-reg .other-links .dropdown-header { font-size: 200%; } } @media screen and (min-width: 768px) { #email-alert-reg .other-links .investor-relations #menu .dynamic-title { margin-left: 5px; margin-bottom: 3px; } } @media screen and (min-width: 992px) { #email-alert-reg .other-links .investor-relations #menu .dynamic-title { margin: 10px -3px 0; } } @media screen and (min-width: 768px) { #email-alert-reg .other-links .investor-relations #menu .dynamic-title .menu-title { padding: 0 20px; } } @media screen and (min-width: 992px) { #email-alert-reg .other-links .investor-relations #menu .dynamic-title .menu-title { margin-top: 15px; } } @media screen and (min-width: 768px) { #email-alert-reg .other-links .investor-relations #menu .item { padding-left: 10px; } } @media screen and (min-width: 992px) { #email-alert-reg .other-links .investor-relations #menu .item { margin: 2px 10px; } } @media screen and (min-width: 768px) { #email-alert-reg .other-links .investor-relations #menu .item .line { margin-top: 8px; } } #email-registration-form .custom-form { background-color: #eef3f9; } @media screen and (min-width: 768px) { #email-registration-form .custom-form { padding: 10px; } } #email-registration-form .custom-form h4 { margin-top: 0; font-size: 130%; } @media screen and (min-width: 768px) { #email-registration-form .custom-form h4 { margin-top: 5px; font-size: 180%; } } @media screen and (min-width: 768px) { #email-registration-form .custom-form .form-label { margin-top: 7px; line-height: 30px; } } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio { margin-top: 15px; margin-bottom: 5px; } } #email-registration-form .custom-form .radio label { padding: 0; } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio label { padding-left: 20px; } } #email-registration-form .custom-form .radio label .radio-btn { width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio label .radio-btn { display: none; } } #email-registration-form .custom-form .radio label .radio-btn-selected { background-position: left center; } #email-registration-form .custom-form .radio label .custom-label { margin-top: 5px; display: inline-block; vertical-align: top; } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio label .custom-label { margin: 0; display: block; vertical-align: middle; } } #email-registration-form .custom-form .radio label .custom-label.label-residential { margin-left: -1px; } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio label .custom-label.label-residential { margin-left: 0; } } #email-registration-form .custom-form .radio label input[type="radio"] { display: none; } @media screen and (min-width: 768px) { #email-registration-form .custom-form .radio label input[type="radio"] { display: block; } } #email-registration-form .custom-form .radio .label-wrapper { margin: 0; } #email-registration-form .custom-form .indicator { color: red; } #email-registration-form .custom-form .form-control { border-radius: 3px; border: none; } #email-registration-form .custom-form .custom-padding-r { padding-right: 4px; } #email-registration-form .custom-form .custom-padding-l { padding-left: 4px; } #email-registration-form .custom-form .privacy-statement span.link-label { padding-top: 1px; padding-left: 15px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; color: #666; } #email-registration-form .custom-form .privacy-statement span.link-label:hover { border: none; } #email-registration-form .custom-form.iframe-custom-form { padding: 10px; } #email-registration-form .custom-form.iframe-custom-form .radio-option { width: 33.33333%; } #email-registration-form .custom-form.iframe-custom-form .col-2 { width: 16.66667%; } #email-registration-form .custom-form.iframe-custom-form .col-6 { width: 50%; } #email-registration-form .custom-form.iframe-custom-form .form-label { width: 25%; } #email-registration-form .custom-form.iframe-custom-form .radio { width: 75%; } #email-registration-form .custom-form.iframe-custom-form h4 { margin-top: 5px; font-size: 180%; } #email-registration-form .custom-form.iframe-custom-form .info, #email-registration-form .custom-form.iframe-custom-form .form-label, #email-registration-form .custom-form.iframe-custom-form .custom-label { font-size: 140%; } #email-registration-form .custom-form.iframe-custom-form .form-label { margin-top: 7px; line-height: 30px; } #email-registration-form .custom-form.iframe-custom-form .radio { margin-top: 15px; margin-bottom: 5px; } #email-registration-form .custom-form.iframe-custom-form .radio label { padding-left: 20px; } #email-registration-form .custom-form.iframe-custom-form .radio label .radio-btn { display: none; } #email-registration-form .custom-form.iframe-custom-form .radio label .custom-label { margin: 0; display: block; vertical-align: middle; } #email-registration-form .custom-form.iframe-custom-form .radio label .custom-label.label-residential { margin-left: 0; } #email-registration-form .custom-form.iframe-custom-form .radio label input[type="radio"] { display: block; } #email-registration-form .custom-form.iframe-custom-form input[type="text"] { font-size: 140%; } #email-registration-form .custom-form.iframe-custom-form .privacy-statement span { font-size: 120%; } #email-registration-form .custom-form.iframe-custom-form .btnz-group { padding-right: 75px; } @media screen and (min-width: 992px) { #email-registration-form .custom-form.iframe-custom-form .btnz-group { padding-right: 25px; } } #email-registration-form .custom-form.iframe-custom-form .btnz-group input[type=submit].subscribe-form-btn, #email-registration-form .custom-form.iframe-custom-form .btnz-group input[type=submit].unsubscribe-form-btn { width: 135px; height: 32px; } #email-registration-form .custom-form.iframe-custom-form .btnz-group input[type=submit].subscribe-form-btn { background: url(../img/subscribe-btn.png) right top no-repeat; } #email-registration-form .custom-form.iframe-custom-form .btnz-group input[type=submit].unsubscribe-form-btn { background: url(../img/unsubscribe-btn.png) right top no-repeat; } #email-registration-form .form_datetime { background: white url(../img/calendar.png) no-repeat 98% 50%; } @media screen and (min-width: 768px) { #email-registration-form .form_datetime { width: 50%; background-position-x: 95%; } } @media screen and (min-width: 768px) { #email-registration-form .legend { padding-top: 20px; padding-left: 10px; font-size: 120%; } } @media screen and (min-width: 768px) { #email-registration-form .btnz-group { padding-right: 75px; } } @media screen and (min-width: 992px) { #email-registration-form .btnz-group { padding-right: 25px; } } #email-registration-form .btnz-group a { /* buttons spacing */ margin-left: 10px; } #email-registration-form .btnz-group a .btn-image { height: 30px; width: 101px; } #email-registration-form .btnz-group input[type=submit].subscribe-form-btn, #email-registration-form .btnz-group input[type=submit].unsubscribe-form-btn { margin-left: 10px; display: block; width: 116px; height: 28px; border: none; } @media screen and (min-width: 768px) { #email-registration-form .btnz-group input[type=submit].subscribe-form-btn, #email-registration-form .btnz-group input[type=submit].unsubscribe-form-btn { width: 135px; height: 32px; } } #email-registration-form .btnz-group input[type=submit].subscribe-form-btn { background: url(../img/mobile-subscribe-btn.png) right top no-repeat; } @media screen and (min-width: 768px) { #email-registration-form .btnz-group input[type=submit].subscribe-form-btn { background: url(../img/subscribe-btn.png) right top no-repeat; } } #email-registration-form .btnz-group input[type=submit].unsubscribe-form-btn { background: url(../img/mobile-unsubscribe-btn.png) right top no-repeat; } @media screen and (min-width: 768px) { #email-registration-form .btnz-group input[type=submit].unsubscribe-form-btn { background: url(../img/unsubscribe-btn.png) right top no-repeat; } } #webcast-settings { padding: 25px 10px 0 0; } #webcast-settings #high-resolution { display: block; padding-left: 10px; font-size: 140%; background: url(../img/arrow-blue-dotted-5x9.png) center left no-repeat; } #webcast-settings #refresh { display: block; padding-left: 10px; font-size: 140%; background: url(../img/arrow-blue-dotted-5x9.png) center left no-repeat; } #webcast .main-content-wrapper .info-wrapper .detail-wrapper .range, #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { font-size: 40%; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .range, #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { font-size: 60%; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .range, #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { font-size: 90%; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .range, #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { font-size: 110%; } } #webcast .page-title { margin: 7px -5px 14px; font-size: 180%; } @media screen and (min-width: 768px) { #webcast .page-title { margin: 7px 0 14px; font-size: 300%; } } #webcast .page-title span { color: #ccc; } @media screen and (min-width: 768px) { #webcast .main-content-wrapper { padding-top: 70px; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .left-section { padding-left: 15px; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .left-section { padding-left: 30px; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .right-section { padding-left: 32px; padding-right: 15px; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .right-section { padding-right: 30px; } } #webcast .main-content-wrapper .info-wrapper { position: relative; border: 1px solid #faf9fa; } #webcast .main-content-wrapper .info-wrapper .hkt-logo { max-width: 55px; height: auto; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .hkt-logo { max-width: 70px; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .hkt-logo { padding: 10px; max-width: 135px; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .hkt-logo { max-width: 170px; } } #webcast .main-content-wrapper .info-wrapper .site-logo { margin-left: -5px; } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .site-logo { padding-top: 15px; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .site-logo { width: 100%; } } #webcast .main-content-wrapper .info-wrapper .detail-wrapper { position: absolute; right: 5px; top: 40%; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper { top: 35%; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper { top: 38%; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper { top: 39%; } } #webcast .main-content-wrapper .info-wrapper .detail-wrapper .heading { font-size: 80%; font-weight: bold; color: #000; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .heading { font-size: 130%; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .heading { font-size: 210%; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .heading { font-size: 230%; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .range { padding-top: 10px; } } #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { padding-top: 8px; color: #f00; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { padding-top: 25px; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .detail-wrapper .date { padding-top: 23px; } } #webcast .main-content-wrapper .info-wrapper .member-logo-wrapper .member-logo { padding-top: 17px; max-width: 40px; } @media screen and (min-width: 480px) { #webcast .main-content-wrapper .info-wrapper .member-logo-wrapper .member-logo { max-width: 50px; } } @media screen and (min-width: 768px) { #webcast .main-content-wrapper .info-wrapper .member-logo-wrapper .member-logo { padding-top: 48px; padding-bottom: 5px; max-width: 80px; } } @media screen and (min-width: 992px) { #webcast .main-content-wrapper .info-wrapper .member-logo-wrapper .member-logo { padding-top: 36px; max-width: 95px; } } #webcast .links { margin: 0 -5px; padding: 8px 0 10px; } @media screen and (min-width: 768px) { #webcast .links { margin: 0; } } #webcast .links .link-label { padding-left: 10px; font-size: 130%; background: url(../img/arrow-blue-dotted-5x9.png) center left no-repeat; } #webcast .tip { margin: 0 -5px; padding-bottom: 5px; font-size: 90%; } @media screen and (min-width: 768px) { #webcast .tip { margin: 0; } } #page-footer.webcast-footer .tip { font-size: 130%; } @media screen and (min-width: 768px) { #page-footer.webcast-footer #footer-site-logo { padding-right: 0; } } @media screen and (min-width: 992px) { #page-footer.webcast-footer .copyright-wrapper { position: relative; } } @media screen and (min-width: 768px) { #page-footer.webcast-footer #copyright { right: -3.667%; } } @media screen and (min-width: 992px) { #page-footer.webcast-footer #copyright { position: absolute; right: 32.333%; } } /* -------------------------------------------- PAGE - CONTENT TEMPLATE TEXT AND VISUALS ---------------------------------------------- */ #text-and-visuals .article-content h6.header-one, #text-and-visuals .article-content h6.header-two, #text-and-visuals .article-content h6.header-three, #text-and-single-visual .article-content h6.header-one, #text-and-single-visual .article-content h6.header-two, #text-and-single-visual .article-content h6.header-three, #text-and-multiple-visuals .article-content h6.header-one, #text-and-multiple-visuals .article-content h6.header-two, #text-and-multiple-visuals .article-content h6.header-three { font-size: 110%; } @media screen and (min-width: 768px) { #text-and-visuals .article-content h6.header-one, #text-and-single-visual .article-content h6.header-one, #text-and-multiple-visuals .article-content h6.header-one { font-size: 160%; } } @media screen and (min-width: 768px) { #text-and-visuals .article-content h6.header-two, #text-and-single-visual .article-content h6.header-two, #text-and-multiple-visuals .article-content h6.header-two { font-size: 140%; } } @media screen and (min-width: 768px) { #text-and-visuals .article-content h6.header-three, #text-and-single-visual .article-content h6.header-three, #text-and-multiple-visuals .article-content h6.header-three { font-size: 130%; } } @media screen and (min-width: 992px) { #text-and-single-visual .article-content h6.header-two, #text-and-single-visual .article-content h6.header-three, #text-and-multiple-visuals .article-content h6.header-two, #text-and-multiple-visuals .article-content h6.header-three { padding-top: 10px; } } @media screen and (min-width: 768px) { #text-and-multiple-visuals .image-block.margin-right-reset, #text-and-multiple-visuals .caption.margin-right-reset { margin-right: 0; } } @media screen and (min-width: 992px) { #text-and-multiple-visuals .image-block.margin-right-reset, #text-and-multiple-visuals .caption.margin-right-reset { margin-right: auto; } } @media screen and (min-width: 768px) { #text-and-multiple-visuals .image-block.margin-left-reset, #text-and-multiple-visuals .caption.margin-left-reset { margin-left: 0; } } @media screen and (min-width: 992px) { #text-and-multiple-visuals .image-block.margin-left-reset, #text-and-multiple-visuals .caption.margin-left-reset { margin-left: auto; } } @media screen and (min-width: 992px) { #text-and-multiple-visuals .another-img { padding-top: 30px; } } /* -------------------------------------------- PAGE - WHY HKT ---------------------------------------------- */ /* -------------------------------------------- PAGE - CORPORATE SOCIAL RESPONSIBILITY ---------------------------------------------- */ #corporate-social-responsibility .article-detail { margin: 0 -5px; } @media screen and (min-width: 768px) { #corporate-social-responsibility .article-detail h6.header { padding: 5px 15px 10px; } } @media screen and (min-width: 768px) { #corporate-social-responsibility .article-detail .detail { padding: 5px 20px; } } #corporate-social-responsibility .article-detail .detail .achievements { margin: 0; } #corporate-social-responsibility .article-detail .detail ul { padding: 0 10px; } @media screen and (min-width: 768px) { #corporate-social-responsibility .article-detail .detail ul { padding: 0 13px; } } @media screen and (min-width: 992px) { #corporate-social-responsibility .activities-links { padding-top: 0; padding-left: 5px; } } #corporate-social-responsibility .activities-links .activities-header { text-align: center; font-size: 130%; color: #000; } @media screen and (min-width: 768px) { #corporate-social-responsibility .activities-links .activities-header { padding: 0 10px; text-align: left; font-size: 200%; } } @media screen and (min-width: 992px) { #corporate-social-responsibility .activities-links .activities-header { margin-top: 0; } } #corporate-social-responsibility .activities-links .box-other-link .link { font-size: 100%; } @media screen and (min-width: 992px) { #corporate-social-responsibility .activities-links .other-activities { padding-top: 20px; } } @media screen and (min-width: 992px) { #corporate-social-responsibility .activities-links .other-activities .box-with-link { margin-top: -10px; } } #corporate-social-responsibility .activities-links .other-activities .box-with-link .title { padding-left: 5px; } @media screen and (min-width: 992px) { #corporate-social-responsibility .activities-links .other-activities .box-with-link .title { padding-left: 0; } } #corporate-social-responsibility .activities-links .other-activities .box-with-link p img { margin: 0 auto 10px auto; } /* Product details page */ #product-details .product-detail-content { padding-top: 15px; padding-bottom: 15px; } @media (min-width: 768px) { #product-details .product-detail-content { padding-top: 0; } } #product-details .product-detail-content .call-services { padding-left: 15px; margin-bottom: 0; } @media (min-width: 768px) { #product-details .product-detail-content .call-services { padding-left: 30px; margin-top: 12px; } } #product-details .product-detail-content .call-services li { padding-bottom: 5px; } #product-details .product-detail-content .tele-line-price { margin-top: 30px; margin-bottom: 20px; } #product-details .product-detail-content .service-provision { margin-top: 10px; margin-bottom: 20px; } @media (min-width: 768px) { #product-details .product-detail-content .service-provision { margin-top: 0; margin-bottom: 23px; } } #product-details .product-detail-content .detail-note { margin-bottom: 15px; margin-top: 15px; } #product-details .detail-note a.link-label { color: #666; } #product-details .detail-note a.link-label:hover { border: none; } /* Batch 4.2 - Pages*/ /* SERVICE CSL */ @media screen and (min-width: 992px) { #services-csl { padding-bottom: 40px; } } #services-csl .page-title { margin: 7px 0 18px; /*font-size: 100%;*/ } @media screen and (min-width: 768px) { #services-csl .page-title { margin-bottom: 25px; } } #services-csl .page-title span { display: block; line-height: 30px; font-size: 170%; } @media screen and (min-width: 768px) { #services-csl .page-title span { line-height: 53px; font-size: 270%; } } #services-csl .page-title img { height: 30px; } @media screen and (min-width: 768px) { #services-csl .page-title img { padding-right: 20px; height: 53px; } } @media screen and (min-width: 768px) { #services-csl .services-wrapper { margin: 0 -4px; } } #services-csl .services-wrapper .service-box { margin-bottom: 18px; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box { margin-bottom: 10px; padding: 0 4px; } } #services-csl .services-wrapper .service-box .service-box-wrapper { padding-top: 5px; padding-bottom: 10px; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper { padding-top: 22px; } } #services-csl .services-wrapper .service-box .service-box-wrapper .header h2 { font-size: 150%; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .header h2 { margin-top: 8px; margin-bottom: 14px; font-size: 190%; } } #services-csl .services-wrapper .service-box .service-box-wrapper .content { margin-top: 10px; margin-bottom: 21px; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .content { margin-top: 13px; } } #services-csl .services-wrapper .service-box .service-box-wrapper .content .image-wrapper { margin-bottom: 9px; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .content .image-wrapper { margin-bottom: 14px; } } #services-csl .services-wrapper .service-box .service-box-wrapper .content .image-wrapper img { height: 28px; } #services-csl .services-wrapper .service-box .service-box-wrapper .content p { font-size: 100%; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .content p { line-height: 20px; font-size: 130%; } } #services-csl .services-wrapper .service-box .service-box-wrapper .link { padding: 5px 0; border: none; } #services-csl .services-wrapper .service-box .service-box-wrapper .link a { font-size: 100%; } #services-csl .services-wrapper .service-box .service-box-wrapper .link a .text { display: inline-block; padding-top: 2px; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .link a .text { font-size: 130%; } } #services-csl .services-wrapper .service-box .service-box-wrapper .link a .link-icon.new-page { background: url(../img/new-page-icon-11x11.png) no-repeat center right; } @media screen and (min-width: 768px) { #services-csl .services-wrapper .service-box .service-box-wrapper .link a .link-icon.new-page { background: url(../img/icon-new-window-13x13.png) no-repeat center right; } } @media screen and (min-width: 768px) { #services-csl .services-wrapper #mobile-payment .service-box .service-box-wrapper, #services-csl .services-wrapper #data-safe-service .service-box .service-box-wrapper { padding-top: 2px; } } #on-the-go-apps .csl-img img { width: 30%; } @media (min-width: 768px) { #on-the-go-apps .csl-img img { width: auto; padding-right: 20px; } } #on-the-go-apps .apps { margin-top: 15px; margin-bottom: 15px; } @media (min-width: 768px) { #on-the-go-apps .apps { margin-top: 0; } } #on-the-go-apps .apps .app-holder { margin-top: -10px; } /* ON THE GO SERVICE PLANS */ #on-the-go-service-plan .csl-img img { width: 30%; } @media (min-width: 768px) { #on-the-go-service-plan .csl-img img { width: auto; padding-right: 20px; } } #on-the-go-service-plan .service-plans { margin-bottom: 20px; } @media (min-width: 768px) and (max-width: 991px) { #on-the-go-service-plan .service-plans { padding-left: 40px; padding-right: 40px; margin-bottom: 35px; } } @media (min-width: 992px) { #on-the-go-service-plan .service-plans { margin-bottom: 40px; } } /* PAGE ON THE GO */ @media (min-width: 768px) { #on-the-go .carousel-wrapper { padding-top: 20px; margin-bottom: 0; } } /* INDIVIDUAL DEVICE */ #individual-device .page-title { font-size: 170%; } @media (min-width: 768px) { #individual-device .page-title { font-size: 260%; } } #individual-device .csl-img img { width: 80%; } @media (min-width: 768px) { #individual-device .csl-img img { width: auto; padding-right: 20px; } } #individual-device .contents { margin-top: 10px; } @media (min-width: 768px) { #individual-device .contents { margin-top: 20px; } } @media (min-width: 992px) { #individual-device .contents { margin-top: 25px; } } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-indicators { bottom: 0; z-index: 3000; } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-indicators li { width: 8px; height: 8px; background: url("../img/carousel-indicator-xs.png") no-repeat scroll left center transparent; } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-indicators .active { background-position: -9px 0px; } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-inner { z-index: 0; background-color: transparent; padding-bottom: 40px; } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-inner .item img { width: 35%; margin: auto; overflow: hidden; } @media (min-width: 768px) { #individual-device .contents .carousel-wrapper .carousel-slider .carousel-inner .item img { width: 67%; } } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control { opacity: 1; background-color: #e5e5e5; position: absolute !important; width: 35px; height: 35px; bottom: 45px; } @media (min-width: 768px) { #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control { background-color: #FFF; width: 25px; height: 25px; } } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control.left { background-image: url(../img/white-arrow-slider-left.png); } @media (min-width: 768px) { #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control.left { background-image: url(../img/black-arrow-slider-left.png); left: 0; } } #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control.right { background-image: url(../img/white-arrow-slider-right.png); } @media (min-width: 768px) { #individual-device .contents .carousel-wrapper .carousel-slider .carousel-control.right { background-image: url(../img/black-arrow-slider-right.png); right: 0; } } #individual-device .contents .specs .device-name { font-size: 115%; font-weight: bold; color: #333333; padding-left: 15px; } #individual-device .contents .specs .new-btn { width: 12%; margin-bottom: 5px; margin-left: 15px; } @media (min-width: 768px) { #individual-device .contents .specs .new-btn { width: 8%; margin-left: 0; } } @media (min-width: 992px) { #individual-device .contents .specs .new-btn { margin-left: 15px; } } #individual-device .contents .specs .features-title { margin: 0; } @media (min-width: 768px) { #individual-device .contents .specs .features-title { font-weight: bold; margin-top: 10px; } } #individual-device .contents .specs .features { padding-left: 15px; } #individual-device .contents .specs .features li { line-height: 20px; } @media (min-width: 768px) { #individual-device .contents .specs .features li { margin-bottom: 5px; } } @media (min-width: 992px) { #individual-device .contents .specs .features li { margin-bottom: 3px; } } @media (min-width: 768px) { #individual-device .contents .specs .srp { margin-top: 20px; } } @media (min-width: 992px) { #individual-device .contents .specs .srp { margin-top: 15px; } } #individual-device .contents .specs .buy-and-compare { padding-top: 20px; } @media (min-width: 992px) { #individual-device .contents .specs .buy-and-compare { padding-top: 15px; } } #individual-device .contents .specs .buy-and-compare .buy-btn, #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox { text-align: center; } @media (min-width: 768px) { #individual-device .contents .specs .buy-and-compare .buy-btn, #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox { text-align: initial; } } @media (min-width: 768px) { #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox { padding-top: 8px; padding-left: 0; } } #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox label { font-weight: normal; } @media (min-width: 768px) { #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox label { margin-left: -12px; } } @media (min-width: 768px) { #individual-device .contents .specs .buy-and-compare .add-to-compare-chkbox label input[type=checkbox] { margin-left: -16px; } } #individual-device .contents .compare-widget { background-color: #eef3f9; border: 1px solid #a6bcc9; padding: 5px 24px 30px 24px; margin-top: 25px; } @media (min-width: 768px) { #individual-device .contents .compare-widget { padding: 15px 24px 10px 24px; margin-top: 0; } } @media (min-width: 992px) { #individual-device .contents .compare-widget { padding: 5px 20px 20px 20px; } } @media (min-width: 768px) { #individual-device .contents .compare-widget .heading-holder { margin-right: 30px; margin-top: 10px; } } #individual-device .contents .compare-widget .heading-holder .heading { color: #03437e; font-size: 165%; margin: 0; } @media (min-width: 768px) { #individual-device .contents .compare-widget .heading-holder .heading { font-size: 145%; } } @media (min-width: 768px) { #individual-device .contents .compare-widget .compare-limit { font-size: 85%; } } #individual-device .contents .compare-widget .device-holder { padding: 0; } @media (min-width: 768px) and (max-width: 991px) { #individual-device .contents .compare-widget .device-holder { margin-right: 30px; } } @media (min-width: 768px) { #individual-device .contents .compare-widget .device-holder.no-mobile { margin-right: 25px; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .device-holder.no-mobile { margin-right: 0; } } #individual-device .contents .compare-widget .device-holder .phone-img { text-align: center; } @media (min-width: 768px) { #individual-device .contents .compare-widget .device-holder .phone-img { text-align: left; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .device-holder .phone-img { text-align: center; margin-bottom: 30px; } } #individual-device .contents .compare-widget .device-holder .phone-img img { width: 35%; } @media (min-width: 768px) { #individual-device .contents .compare-widget .device-holder .phone-img img { width: 32%; float: left; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .device-holder .phone-img img { width: 18%; margin-left: -55px; float: inherit; } } #individual-device .contents .compare-widget .device-holder .phone-img .remove-phone img { width: 12px; position: absolute; margin-left: 8px; } @media (min-width: 768px) { #individual-device .contents .compare-widget .device-holder .phone-img .remove-phone img { margin-top: 10px; margin-left: 8px; position: relative; margin-right: 8px; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .device-holder .phone-img .remove-phone img { position: absolute; } } #individual-device .contents .compare-widget .device-holder .phone-img .device-name { margin-top: 7px; font-size: 95%; } @media (min-width: 768px) { #individual-device .contents .compare-widget .device-holder .phone-img .device-name { margin-left: 6px; font-size: 80%; float: left; position: relative; top: 0; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .device-holder .phone-img .device-name { position: absolute; left: 90px; text-align: left; margin-top: 25px; } } #individual-device .contents .compare-widget .tablet-compare-btn .compare-btn { width: 60%; margin-top: 26px; margin-left: 20px; } #individual-device .contents .compare-widget .tablet-compare-btn .grey-arrow { margin-top: 15px; } #individual-device .contents .compare-widget .select-device { margin-top: 10px; } @media (min-width: 768px) { #individual-device .contents .compare-widget .select-device { margin-top: 30px; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .select-device { margin-top: 0; } } #individual-device .contents .compare-widget .select-device a.link-label { color: #666; } #individual-device .contents .compare-widget .select-device a.link-label:hover { border: none; } @media (min-width: 768px) { #individual-device .contents .compare-widget .select-device .add-device-label { margin-top: 5px; } } @media (min-width: 768px) and (max-width: 991px) { #individual-device .contents .compare-widget .select-device .select-brand-holder { padding-left: 0; padding-right: 0; } } @media (min-width: 768px) and (max-width: 991px) { #individual-device .contents .compare-widget .select-device .select-model-holder { padding-right: 0; width: 28%; } } @media (min-width: 768px) and (max-width: 991px) { #individual-device .contents .compare-widget .select-device .add-compare-holder { padding-left: 0; padding-right: 0; margin-top: 5px; margin-left: 10px; } } @media (min-width: 992px) { #individual-device .contents .compare-widget .select-device .add-compare-holder { font-size: 85%; } } #individual-device .contents .compare-widget .select-device .select-brand, #individual-device .contents .compare-widget .select-device .select-model { padding-bottom: 10px; } #individual-device .contents .compare-widget .select-device .select-brand .btn .filter-option, #individual-device .contents .compare-widget .select-device .select-model .btn .filter-option { color: #acacac; } #individual-device .contents .compare-widget .select-device .select-brand .open, #individual-device .contents .compare-widget .select-device .select-model .open { margin-top: -10px; } #individual-device .contents .compare-widget .select-device .select-brand .open .text, #individual-device .contents .compare-widget .select-device .select-model .open .text { color: #acacac; } #individual-device .contents .compare-widget .select-device .compare-btn { width: 30%; margin-top: 20px; } @media (min-width: 992px) { #individual-device .contents .compare-widget .select-device .compare-btn { width: 45%; } } #individual-device .contents .specs-area { margin-top: 40px; } @media (min-width: 992px) { #individual-device .contents .specs-area { margin-top: -270px; padding-right: 0; } } #individual-device .contents .specs-area #tabs .nav-tabs { border-bottom: 0; /* basic info */ } #individual-device .contents .specs-area #tabs .nav-tabs li { /* main feat */ } @media (min-width: 768px) { #individual-device .contents .specs-area #tabs .nav-tabs li a { padding: 5px 10px; } } @media (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li a { /*padding: 5px 6px;*/ padding: 2px 5px 8px 18px; } } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li a .tab-indicator { margin-left: 5px; margin-right: 9px; } } #individual-device .contents .specs-area #tabs .nav-tabs li + li { /* packaging */ } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li a { padding-left: 7px; } } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li a .tab-indicator { margin-left: 0px; margin-right: 3px; } } #individual-device .contents .specs-area #tabs .nav-tabs li + li + li { /* exclusive value */ } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li + li a { padding-left: 9px; padding-right: 9px; } } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li + li a .tab-indicator { margin-left: -3px; } } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li + li + li a { padding-left: 10px; } } @media screen and (min-width: 992px) { #individual-device .contents .specs-area #tabs .nav-tabs li + li + li + li a .tab-indicator { margin-left: 0px; margin-right: 5px; } } #individual-device .contents .specs-area #tabs .tab-content .info-row { margin-left: 0; margin-right: 0; padding-top: 10px; padding-bottom: 10px; } #individual-device .contents .specs-area #tabs .tab-content .info-row .info-label { font-weight: bold; } #individual-device .contents .specs-area #tabs .tab-content .tab-pane { padding-top: 15px; } @media (min-width: 768px) { #individual-device .contents .specs-area .nav-tabs-border { /*width: 93%;*/ width: 96%; height: 3px; background: #a6bcc9; position: absolute; top: 32px; } } @media (min-width: 992px) { #individual-device .contents .specs-area .nav-tabs-border { /*width: 95%;*/ width: 98%; } } #individual-device .contents .specs-area #accordion .panel-default { border: none; border-radius: 0; box-shadow: none; } #individual-device .contents .specs-area #accordion .panel-default .panel-heading { color: #FFF; height: 34px; border-radius: 0; background: url(../img/arrow-7x13.png) no-repeat 96% center; background-color: #a6bcc9; } #individual-device .contents .specs-area #accordion .panel-default .panel-heading.active { background: #006EA5; } #individual-device .contents .specs-area #accordion .panel-default .panel-heading .panel-title { font-size: 120%; } #individual-device .contents .specs-area #accordion .panel-default .panel-heading .panel-title a { display: block; } #individual-device .contents .specs-area #accordion .panel-default .panel-body { border: 0; } #individual-device .contents .specs-area #accordion .panel-default .panel-body .info-row { padding-top: 5px; padding-bottom: 5px; } #individual-device .contents .specs-area #accordion .panel-default .panel-body .info-row .info-label { font-weight: bold; } /* COMPARE DEVICES */ #compare-devices .page-title { margin: 7px -10px 18px; font-size: 100%; } @media screen and (min-width: 768px) { #compare-devices .page-title { margin: 7px 0 25px; } } #compare-devices .page-title span { display: block; line-height: 30px; font-size: 170%; } @media screen and (min-width: 768px) { #compare-devices .page-title span { line-height: 53px; font-size: 270%; } } #compare-devices .page-title img { height: 30px; } @media screen and (min-width: 768px) { #compare-devices .page-title img { padding-right: 20px; height: 53px; } } #compare-devices #select-device { margin-bottom: 17px; border: 1px solid #a4b2c5; background-color: #eef3f9; } @media screen and (min-width: 768px) { #compare-devices #select-device { margin-bottom: 0; border: none; background: none; } } #compare-devices #select-device .title { padding-top: 4px; padding-bottom: 13px; text-align: center; font-family: "Lato-bold"; } @media screen and (min-width: 768px) { #compare-devices #select-device .title { padding-top: 72px; padding-bottom: 112px; text-align: left; font-size: 130%; border-right: 1px solid #e5e5e5; } } @media screen and (min-width: 992px) { #compare-devices #select-device .title { padding-left: 40px; } } #compare-devices #select-device .title b { font-size: 170%; color: #03437e; } #compare-devices #select-device .mobile-phone, #compare-devices #select-device .no-mobile-phone { position: relative; text-align: center; font-size: 110%; } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone, #compare-devices #select-device .no-mobile-phone { position: static; } } #compare-devices #select-device .mobile-phone .phone-img, #compare-devices #select-device .no-mobile-phone .phone-img { display: block; margin: 0 auto 6px; height: 62px; } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone .phone-img, #compare-devices #select-device .no-mobile-phone .phone-img { height: 87px; } } #compare-devices #select-device .mobile-phone .phone-img-wrapper, #compare-devices #select-device .no-mobile-phone .phone-img-wrapper { position: relative; } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone .phone-img-wrapper, #compare-devices #select-device .no-mobile-phone .phone-img-wrapper { margin-top: 18px; margin-bottom: 19px; } } #compare-devices #select-device .mobile-phone .phone-img-wrapper .phone-img, #compare-devices #select-device .no-mobile-phone .phone-img-wrapper .phone-img { height: 148px; } #compare-devices #select-device .mobile-phone .remove-phone, #compare-devices #select-device .no-mobile-phone .remove-phone { position: absolute; top: -2px; } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone .remove-phone, #compare-devices #select-device .no-mobile-phone .remove-phone { top: -4px; right: 17px; } } @media screen and (min-width: 992px) { #compare-devices #select-device .mobile-phone .remove-phone, #compare-devices #select-device .no-mobile-phone .remove-phone { top: -1px; right: 44px; } } #compare-devices #select-device .mobile-phone .remove-phone img, #compare-devices #select-device .no-mobile-phone .remove-phone img { height: 12px; } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone .remove-phone img, #compare-devices #select-device .no-mobile-phone .remove-phone img { height: 13px; } } @media screen and (min-width: 768px) { #compare-devices #select-device .mobile-phone { padding-bottom: 16px; font-size: 130%; color: #000; border-right: 1px solid #e5e5e5; } } #compare-devices #select-device .mobile-phone.mobile-a .remove-phone { right: 7px; } #compare-devices #select-device .mobile-phone.mobile-b .remove-phone { right: 15px; } #compare-devices #select-device .mobile-phone .phone-img:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); opacity: 0.2; cursor: url(../img/crosshair.png), auto; } #compare-devices #select-device .no-mobile-phone { padding-right: 28px; } @media screen and (min-width: 768px) { #compare-devices #select-device .no-mobile-phone { padding: 37px 5px 0; } } @media screen and (min-width: 992px) { #compare-devices #select-device .no-mobile-phone { padding: 37px 15px 0; } } @media screen and (min-width: 768px) { #compare-devices #select-device .no-mobile-phone > span { font-size: 110%; } } @media screen and (min-width: 768px) { #compare-devices #select-device .no-mobile-phone .phone-img { margin-bottom: 18px; } } @media screen and (min-width: 768px) { #compare-devices #select-device .no-mobile-phone .another-select { padding-top: 7px; } } #compare-devices #select-device .no-mobile-phone .another-select .custom-input-select { margin-bottom: 7px; } #compare-devices #select-device .no-mobile-phone .another-select .custom-input-select .border-side-right { right: -5px; } #compare-devices #select-device .no-mobile-phone .another-select .custom-input-select .selectpicker span { font-size: 90%; color: #acacac; } #compare-devices #select-device .no-mobile-phone .link-label { padding-left: 10px; font-size: 110%; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; color: #666; } #compare-devices #select-device .no-mobile-phone .link-label:hover { border: none; } #compare-devices #select-device .add-device { padding-top: 19px; text-align: center; } #compare-devices #select-device .add-device > span { font-size: 110%; font-weight: bold; } #compare-devices #select-device .add-device a.link-label { padding-left: 10px; padding-right: 3.66663%; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; color: #666; } #compare-devices #select-device .add-device a.link-label:hover { border: none; } #compare-devices #select-device .add-device .another-select { margin: auto; width: 93%; } #compare-devices #select-device .add-device .another-select .custom-input-select { margin: 5px 0; } #compare-devices #select-device .add-device .another-select .custom-input-select .border-side-left, #compare-devices #select-device .add-device .another-select .custom-input-select .border-side-right { display: none; } #compare-devices #select-device .add-device .another-select .custom-input-select .selectpicker { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #compare-devices #select-device .add-device .another-select .custom-input-select .selectpicker span { font-size: 90%; color: #acacac; } #compare-devices #select-device .add-device .btn-wrapper { padding: 16px 0 26px; } #compare-devices #select-device .add-device .btn-wrapper img { height: 23px; } #compare-devices #compare-specs, #compare-devices #basic-info, #compare-devices #main-feat { padding: 0; list-style: none; } #compare-devices #compare-specs li a, #compare-devices #basic-info li a, #compare-devices #main-feat li a { display: block; line-height: 35px; font-size: 120%; } #compare-devices #compare-specs li a.link-label, #compare-devices #basic-info li a.link-label, #compare-devices #main-feat li a.link-label { color: #666; } #compare-devices #compare-specs li a.link-label:hover, #compare-devices #basic-info li a.link-label:hover, #compare-devices #main-feat li a.link-label:hover { border: none; } #compare-devices #basic-info li a, #compare-devices #main-feat li a { background: url(../img/arrow-up-blue-dotted.png) no-repeat 96% center; } #compare-devices #basic-info li a.collapsed, #compare-devices #main-feat li a.collapsed { background: url(../img/arrow-down-blue-dotted.png) no-repeat 96% center; } #compare-devices #compare-specs > li > a { background-image: none; background-color: #eef3f9; } @media screen and (min-width: 768px) { #compare-devices #compare-specs > li > a { padding: 0 20px; line-height: 39px; font-size: 130%; font-weight: bold; background: url(../img/arrow-up-blue-dotted.png) no-repeat 98% center #eef3f9; } } #compare-devices #compare-specs > li > a.collapsed { background-color: #eef3f9; } @media screen and (min-width: 768px) { #compare-devices #compare-specs > li > a.collapsed { background: url(../img/arrow-down-blue-dotted.png) no-repeat 98% center #eef3f9; } } #compare-devices #compare-specs .basic-info { padding-bottom: 20px; } @media screen and (min-width: 768px) { #compare-devices #compare-specs .basic-info { padding-bottom: 10px; } } #compare-devices #compare-specs .main-feat { padding-bottom: 5px; } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs > .no-bg, #compare-devices #compare-specs .specs > .bg-lighter-grey, #compare-devices #compare-specs #stores-and-showrooms .accordian .panel .panel-body .specs > .odd, #stores-and-showrooms .accordian .panel .panel-body #compare-devices #compare-specs .specs > .odd { overflow: hidden; } } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs > .no-bg > div, #compare-devices #compare-specs .specs > .bg-lighter-grey > div, #compare-devices #compare-specs #stores-and-showrooms .accordian .panel .panel-body .specs > .odd > div, #stores-and-showrooms .accordian .panel .panel-body #compare-devices #compare-specs .specs > .odd > div { margin-bottom: -100%; padding-bottom: 100%; } } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs > .no-bg { padding-bottom: 10px; } } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs > .no-bg > div { padding-top: 16px; /*padding-bottom: 10px;*/ } } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs > .bg-lighter-grey > div, #compare-devices #compare-specs #stores-and-showrooms .accordian .panel .panel-body .specs > .odd > div, #stores-and-showrooms .accordian .panel .panel-body #compare-devices #compare-specs .specs > .odd > div { padding-top: 8px; } } #compare-devices #compare-specs .specs .sub-title { border: none; /*&+.collapse.in { border-bottom: 1px solid #dadada; }*/ } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs .sub-title { padding-left: 20px; font-size: 130%; font-weight: bold; border-right: 1px solid #e5e5e5; } } #compare-devices #compare-specs .specs .sub-title.collapsed { border-bottom: 1px solid #dadada; } #compare-devices #compare-specs .specs .device-detail { padding: 0; } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs .device-detail { padding-left: 9px; border-right: 1px solid #e5e5e5; } } #compare-devices #compare-specs .specs .device-detail .device, #compare-devices #compare-specs .specs .device-detail .detail { font-size: 110%; } #compare-devices #compare-specs .specs .device-detail .device { padding-bottom: 6px; color: #000; } #compare-devices #compare-specs .specs .device-detail .device.device-b { padding-top: 13px; } #compare-devices #compare-specs .specs .device-detail .device.device-b + .detail { padding-bottom: 28px; } #compare-devices #compare-specs .specs .device-detail .detail { padding: 0 10px 20px 11px; background: url(../img/check-green-dotted-10x7.png) no-repeat left 5px; } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs .device-detail .detail { padding-left: 13px; /*padding-bottom: 14px;*/ padding-bottom: 7px; font-size: 120%; } } #compare-devices #compare-specs .specs .device-detail .detail.no-spec { background: none; } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs .device-detail .detail.no-spec { padding-left: 0; } } @media screen and (min-width: 768px) { #compare-devices #compare-specs .specs .device-detail .detail.no-spec img { display: block; margin: auto; } } #compare-devices .added-info p, #compare-devices .added-info a { font-size: 120%; } #compare-devices .added-info p.link-label, #compare-devices .added-info a.link-label { color: #666; } #compare-devices .added-info p.link-label:hover, #compare-devices .added-info a.link-label:hover { border: none; } #compare-devices .added-info .full-specs-link { display: block; padding: 0 10px; background: url(../img/arrow-blue-dotted-5x9.png) no-repeat left center; } #compare-devices .added-info .full-specs-link + .full-specs-link { margin-top: 10px; } /* VIEW DEVICES */ #view-devices .page-title { margin: 7px -10px 18px; font-size: 100%; } @media screen and (min-width: 768px) { #view-devices .page-title { margin: 7px 0 25px; } } #view-devices .page-title span { display: block; line-height: 30px; font-size: 170%; } @media screen and (min-width: 768px) { #view-devices .page-title span { line-height: 53px; font-size: 270%; } } #view-devices .page-title img { height: 30px; } @media screen and (min-width: 768px) { #view-devices .page-title img { padding-right: 20px; height: 53px; } } #view-devices #compare-section { margin-bottom: 25px; padding: 3px 15px; border: 1px solid #a4b2c5; background-color: #eef3f9; } @media screen and (min-width: 768px) { #view-devices #compare-section { margin-bottom: 41px; } } #view-devices #compare-section b { font-family: "Lato-bold"; font-size: 180%; color: #03437e; } #view-devices #compare-section > a { display: block; text-align: center; } #view-devices #compare-section > a:hover { border: none; } #view-devices #compare-section #compare-handsets { margin-bottom: 6px; padding: 0; list-style: none; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets { padding-top: 14px; } } #view-devices #compare-section #compare-handsets .title { margin-top: -3px; padding-bottom: 16px; text-align: center; font-family: "Lato-bold"; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .title { padding-top: 13px; } } #view-devices #compare-section #compare-handsets .no-mobile-phone { text-align: center; } #view-devices #compare-section #compare-handsets .no-mobile-phone img { display: block; margin: 0 auto 6px; height: 62px; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .no-mobile-phone img { display: inline-block; height: 65px; } } #view-devices #compare-section #compare-handsets .no-mobile-phone span { font-size: 110%; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .no-mobile-phone span { float: right; padding-top: 25px; } } #view-devices #compare-section #compare-handsets .btn-wrapper { padding-top: 13px; text-align: center; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .btn-wrapper { float: right; padding-top: 19px; } } @media screen and (min-width: 992px) { #view-devices #compare-section #compare-handsets .btn-wrapper { padding-right: 24px; } } #view-devices #compare-section #compare-handsets .btn-wrapper img { height: 22px; } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .btn-wrapper img { height: 25px; } } @media screen and (min-width: 768px) { #view-devices #compare-section #compare-handsets .btn-wrapper + img { float: right; padding-top: 7px; padding-right: 18px; } } @media screen and (min-width: 992px) { #view-devices #compare-section #compare-handsets .btn-wrapper + img { float: left; padding-left: 5px; } } @media screen and (min-width: 768px) { #view-devices #collapseOne-tab > .row { margin: 19px 0 0; } } #view-devices #search-section { margin-bottom: 9px; padding-top: 10px; background-color: #03437e; } #view-devices #search-section form .form-group { margin: 0 0 0 -10px; } @media screen and (min-width: 768px) { #view-devices #search-section form .form-group { margin-left: -5px; margin-right: -7px; padding-bottom: 5px; } } #view-devices #search-section form .form-control { border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } @media screen and (min-width: 768px) { #view-devices #search-section form .form-control { padding-left: 5px; height: 22px; font-size: 130%; border-radius: 0; } } #view-devices #search-section form .input-group { width: 100%; } #view-devices #search-section form .input-group .input-group-addon { width: 26px; height: 26px; } #view-devices #search-section form .input-group .input-group-addon.search { padding-right: 0; border: none; background-color: transparent; } @media screen and (min-width: 768px) { #view-devices #search-section form .input-group .input-group-addon.search { padding-top: 1px; padding-left: 3px; } } #view-devices #search-section form .input-group .input-group-addon.search img { height: 19px; } #view-devices #search-section #mobile-search-filters { margin: 0 -7px 0 -13px; padding: 16px 0 19px; list-style: none; } #view-devices #search-section #mobile-search-filters .custom-input-select { padding-bottom: 9px; } #view-devices #search-section #mobile-search-filters .custom-input-select .border-side-left, #view-devices #search-section #mobile-search-filters .custom-input-select .border-side-right { display: none; } #view-devices #search-section #mobile-search-filters .custom-input-select button.selectpicker { color: #acacac; border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #view-devices #search-section #mobile-search-filters .custom-input-select button.selectpicker + img + .dropdown-menu { top: 75%; left: 3px; width: 100%; } #view-devices #search-section #mobile-search-filters .custom-input-select button.selectpicker + img + .dropdown-menu a { color: #acacac; } #view-devices #search-section #mobile-search-filters .search-btn-wrapper { padding-top: 7px; text-align: center; } #view-devices #search-section #mobile-search-filters .search-btn-wrapper img { height: 23px; } #view-devices #search-section #mobile-search-filters + .link-label { display: block; margin: 10px 0; text-align: center; color: #fff; } #view-devices #search-section #mobile-search-filters + .link-label:hover { border: none; } #view-devices #search-section #mobile-search-filters + .link-label span { font-size: 110%; padding-right: 20px; background: url(../img/grey-down-arrow-11x6.png) no-repeat center right; } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters { margin: 0 -15px; background-color: #fff; } } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by a { display: block; padding: 8px 15px 5px; font-size: 130%; font-weight: bold; background: url(../img/arrow-up-blue-dotted.png) no-repeat 96% center #eef3f9; } } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by a.collapsed { background: url(../img/arrow-down-blue-dotted.png) no-repeat 96% center #eef3f9; } } #view-devices #search-section #search-filters .filter-by a.link-label { color: #666; } #view-devices #search-section #search-filters .filter-by a.link-label:hover { border: none; } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by > div { padding: 0 15px 18px; } } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by .checkbox { margin-top: 8px; margin-bottom: -3px; } } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by .checkbox label { font-size: 130%; } } @media screen and (min-width: 768px) { #view-devices #search-section #search-filters .filter-by input[type="checkbox"] { margin-top: 2px; } } #view-devices #handsets-section .device-info { padding-top: 26px; padding-bottom: 23px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info { padding-top: 1px; padding-bottom: 0; margin-bottom: 47px; } } #view-devices #handsets-section .device-info .device-unit, #view-devices #handsets-section .device-info .device-feats, #view-devices #handsets-section .device-info .available-colors { text-align: center; } #view-devices #handsets-section .device-info .device-unit { padding-bottom: 15px; font-size: 110%; font-weight: bold; color: #000; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-unit { padding-bottom: 24px; font-size: 130%; } } #view-devices #handsets-section .device-info .device-unit .unit-name { padding-right: 5px; text-align: right; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-unit .unit-name { padding-right: 0; text-align: center; } } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-unit .unit-name span { float: right; } } #view-devices #handsets-section .device-info .device-unit .unit-name + div { padding-left: 5px; text-align: left; } #view-devices #handsets-section .device-info .device-feats { padding-bottom: 18px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-feats { padding-bottom: 25px; } } #view-devices #handsets-section .device-info .device-feats:hover > div { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); opacity: 0.2; cursor: url(../img/crosshair.png), auto; } #view-devices #handsets-section .device-info .device-feats:hover > div a { cursor: url(../img/crosshair.png), auto; } #view-devices #handsets-section .device-info .device-feats .img-wrapper { padding-right: 0; text-align: right; } #view-devices #handsets-section .device-info .device-feats .img-wrapper .device-image { height: 170px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-feats .img-wrapper .device-image { height: 187px; } } #view-devices #handsets-section .device-info .device-feats .specs-wrapper { padding-left: 10px; text-align: left; } #view-devices #handsets-section .device-info .device-feats .specs-wrapper .device-specs { margin-top: 7px; height: 150px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-feats .specs-wrapper .device-specs { margin-top: 13px; height: 164px; } } #view-devices #handsets-section .device-info .device-details-link { padding-bottom: 11px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-details-link { padding-bottom: 13px; } } #view-devices #handsets-section .device-info .device-details-link .link-label, #view-devices #handsets-section .device-info .device-details-link label { font-size: 110%; } #view-devices #handsets-section .device-info .device-details-link .detail-link { text-align: right; } #view-devices #handsets-section .device-info .device-details-link .detail-link a.link-label { color: #666; } #view-devices #handsets-section .device-info .device-details-link .detail-link a.link-label:hover { border: none; } #view-devices #handsets-section .device-info .device-details-link .detail-link a.link-label img { margin-top: -2px; } #view-devices #handsets-section .device-info .device-details-link .add-compare { padding-left: 8px; } #view-devices #handsets-section .device-info .device-details-link .add-compare .checkbox { margin: 0; } #view-devices #handsets-section .device-info .device-details-link .add-compare input[type="checkbox"] { margin-top: 0; margin-left: -18px; } #view-devices #handsets-section .device-info .buy-btn-wrapper { text-align: center; } #view-devices #handsets-section .device-info .buy-btn-wrapper img { height: 33px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .buy-btn-wrapper img { height: 37px; } } #view-devices #handsets-section .device-info .available-colors { padding-bottom: 18px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .available-colors { padding-bottom: 14px; } } #view-devices #handsets-section .device-info .device-color, #view-devices #handsets-section .device-info .label-new { padding: 0 3px; height: 17px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .device-color, #view-devices #handsets-section .device-info .label-new { height: 20px; } } #view-devices #handsets-section .device-info .label-new { margin-top: -1px; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info .label-new { margin-top: -2px; height: 19px; } } #view-devices #handsets-section .device-info + .device-info { display: none; border-top: 1px solid #e5e5e5; } @media screen and (min-width: 768px) { #view-devices #handsets-section .device-info + .device-info { display: block; border-top: none; } } @media screen and (min-width: 992px) { #view-devices #handsets-section .device-info + .device-info { border-top: none; } } #view-devices #handsets-section .load-more-btn-wrapper #load-more { width: 100%; height: 34px; font-size: 110%; color: #03437e; border-color: #e5e5e5; } @media screen and (min-width: 768px) { #view-devices #handsets-section .load-more-btn-wrapper #load-more { display: none; } } #view-devices #handsets-section .load-more-btn-wrapper #load-more:hover, #view-devices #handsets-section .load-more-btn-wrapper #load-more:focus { border-color: #e5e5e5; background-color: #fff; } #view-devices #handsets-section .pagination-wrapper { display: none; text-align: center; } @media screen and (min-width: 768px) { #view-devices #handsets-section .pagination-wrapper { display: block; } } #view-devices #handsets-section .pagination-wrapper a { padding: 0 8px; font-size: 110%; } #view-devices #handsets-section .pagination-wrapper a img { margin-top: -1px; } #view-devices #handsets-section .pagination-wrapper a.link-label { color: #2b96e5; border: none; } #view-devices #handsets-section .pagination-wrapper a.link-label.active { color: #666; } #view-devices #accordion .custom-panel { border: none; box-shadow: none; } #view-devices #accordion .custom-panel .panel-heading { height: 34px; border-radius: 0; background: url(../img/arrow-7x13.png) no-repeat 96% center; background-color: #a6bcc9; } #view-devices #accordion .custom-panel .panel-heading.active { background: none; background-color: #006ea5; } #view-devices #accordion .custom-panel .panel-heading .panel-title a { display: block; font-size: 70%; color: #fff; } #view-devices #accordion .custom-panel .custom-panel-collapse .panel-body { padding: 0; border: none; } #view-devices #accordion .custom-panel .custom-panel-collapse#collapseOne .panel-body { padding: 13px 15px 15px; } @media screen and (min-width: 768px) { #view-devices #tabs .nav-tabs-wrapper { border-bottom: 2px solid #a6bcc9; } } @media screen and (min-width: 768px) { #view-devices #tabs .nav-tabs-wrapper .nav.nav-tabs { margin: 0 auto -2px; width: 71%; border-width: 2px; } } @media screen and (min-width: 992px) { #view-devices #tabs .nav-tabs-wrapper .nav.nav-tabs { width: 68%; } } #view-devices #carousel-view-devices .carousel-inner .item { height: 100px; } #view-devices #carousel-view-devices .carousel-inner .item a { display: block; padding-top: 30px; text-align: center; color: #fff; } @media screen and (min-width: 768px) { #view-devices #carousel-view-devices .carousel-inner .item a { padding-top: 52px; } } @media screen and (min-width: 992px) { #view-devices #carousel-view-devices .carousel-inner .item a { padding-top: 88px; } } @media screen and (min-width: 768px) { #view-devices #carousel-view-devices .carousel-inner .item { height: 170px; font-size: 180%; } } @media screen and (min-width: 992px) { #view-devices #carousel-view-devices .carousel-inner .item { height: 226px; } } /* Page - Individual service profile */ /** * general box LO proposal */ @media screen and (min-width: 768px) { .individual-service-profile h1 { margin-bottom: 35px; } } .individual-service-profile .row-box { margin: 0 4px; padding: 4px 0; } .individual-service-profile .box { padding: 5px 4px; height: auto; } .individual-service-profile .box .box-content { background-color: #fff; padding: 10px; } @media (min-width: 768px) { .individual-service-profile .box .box-content { padding: 10px 20px; } } .individual-service-profile .box .title { padding: 0; } .individual-service-profile .box .divider { border-top: 1px solid #178be2; width: auto; margin: 10px -5px 15px; } @media (min-width: 768px) { .individual-service-profile .box .divider { margin: 15px -10px 15px -10px; } } /** * page specific LO */ .individual-service-profile h2 { color: #666; font-size: 13px; margin-top: 10px; } @media (min-width: 768px) { .individual-service-profile h2 { font-size: 20px; } } @media screen and (min-width: 992px) { .individual-service-profile .prime-info { width: 85%; } } .individual-service-profile .radio-inline { position: relative; text-align: right; width: 50%; } .individual-service-profile .radio-btn { position: absolute; right: 15px; float: left; margin-right: 5px; width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } .individual-service-profile :checked + span.radio-btn { background-position: left center; } .individual-service-profile label.radio-option:hover { cursor: pointer; } .individual-service-profile .radio-label { margin-top: 5px; display: inline-block; } @media screen and (min-width: 768px) { .individual-service-profile .radio-label { margin-top: 0; } } .individual-service-profile .submit-btn-group { display: inline-block; } .individual-service-profile .submit-btn-group .btn-cta, .individual-service-profile .submit-btn-group .btn-arrow-cta { border: 0 none; min-width: 0; padding: 0; } .individual-service-profile .checkbox-label-left { margin: 0; padding-top: 8px; line-height: 20px; } @media (min-width: 768px) { .individual-service-profile .checkbox-label-left { padding: 20px 0 10px; } } .individual-service-profile .checkbox-label-left label { padding-left: 0; } .individual-service-profile .checkbox-label-left input[type=checkbox] { margin-left: 10px; } .individual-service-profile .box-account-toggle h2 { text-align: center; margin-bottom: 18px; } .individual-service-profile .box-account-toggle .divider { border-top: 1px solid #ececec; background-color: transparent; margin: 0; } .individual-service-profile .box-account-toggle .description { margin: 0 auto 18px; text-align: center; width: 85%; } .individual-service-profile .box-account-toggle .form-group { overflow: hidden; padding: 0 5px; } @media (min-width: 768px) { .individual-service-profile .box-account-toggle .form-group { padding: 0 10px; } } .individual-service-profile .box-account-toggle .form-group > label { float: left; font-weight: normal; /* fit radio button in mobile view */ } .individual-service-profile .box-account-toggle .form-group > label + div { height: 25px; } @media screen and (min-width: 768px) { .individual-service-profile .box-account-toggle .form-group > label + div { height: auto; padding-right: 0; } } .individual-service-profile .box-account-toggle .form-group > label.radio-inline { width: auto; margin-left: 10px; } .individual-service-profile .box-account-toggle .form-group > label.radio-inline input[type="radio"] { width: auto; } .individual-service-profile .box-account-toggle .form-group input[type="radio"] { margin-top: 1px; } @media (min-width: 768px) { .individual-service-profile .box-account-toggle .form-group input[type="radio"] { margin-top: 3px; } } .individual-service-profile .box-content .title .btn-edit { color: #666; font-size: 11px; margin-left: 18px; padding-left: 9px; background: url(../img/arrow-blue-dotted-5x9.png) left center no-repeat; } @media screen and (min-width: 768px) { .individual-service-profile .box-content .title .btn-edit { font-size: 14px; margin-left: 20px; padding-left: 14px; font-family: Arial, sans-serif; font-weight: normal; } } .individual-service-profile .box-content .title img { margin: 0; } @media (min-width: 768px) { .individual-service-profile .box-content .title img { min-height: 0; height: 35px; } } @media screen and (min-width: 992px) { .individual-service-profile .service-info { position: relative; } } .individual-service-profile .service-info .box { /* stretch div to fit parent container */ /* position toggle box */ } @media screen and (min-width: 992px) { .individual-service-profile .service-info .box { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } } @media screen and (min-width: 992px) { .individual-service-profile .service-info .box.box-account-toggle { position: relative; left: 50%; } } @media screen and (min-width: 992px) { .individual-service-profile .service-info .fit-height { height: 100%; } } .individual-service-profile .form-group { margin: 8px 0; width: 100%; } .individual-service-profile .form-group label, .individual-service-profile .form-group .form-control, .individual-service-profile .form-group .display-value { color: #666; font-size: 11px; } @media (min-width: 768px) { .individual-service-profile .form-group label, .individual-service-profile .form-group .form-control, .individual-service-profile .form-group .display-value { font-size: 14px; } } .individual-service-profile .form-group label, .individual-service-profile .form-group .display-value { vertical-align: top; padding-left: 0; } .individual-service-profile .form-group .display-value { padding: 5px 5px 5px 0; display: inline-block; } .individual-service-profile .form-group .form-control { padding: 5px; } .individual-service-profile .form-group .form-control { height: auto; } .individual-service-profile .form-group .display-value { padding-top: 0; } .individual-service-profile .form-group label { font-weight: bold; margin-left: 0; } .individual-service-profile .dropdown-my-profile, .individual-service-profile .box-wrap-my-hkt, .individual-service-profile .tab-pane { background: #eef3f9; } .individual-service-profile .dropdown-my-profile { margin: 18px 0 0; padding: 10px 10px 0; } .individual-service-profile .myhkt-basic-info .box-content { padding: 0 10px; } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-basic-info .box-content { padding: 5px 15px; } } .individual-service-profile .myhkt-basic-info .info-col { width: 100%; } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-basic-info .info-col { width: 50%; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-basic-info .info-col { width: 43%; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-basic-info .info-col + .info-col { width: 57%; } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-basic-info .info-col .form label { width: 43%; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-basic-info .info-col .form label { width: 37%; } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-basic-info .info-col .form span { width: 57%; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-basic-info .info-col .form span { width: 63%; } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-basic-info .info-col .form .form-group.row { height: 27px; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-basic-info .info-col .form .form-group.row { height: auto; } } .individual-service-profile .myhkt-service-info { margin-top: 10px; } @media (min-width: 768px) { .individual-service-profile .myhkt-service-info .box-content .form-group .display-value, .individual-service-profile .myhkt-service-info .box-content .form-group input { /*width: 60%;*/ /*width: 55%;*/ } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-service-info .box-content .form-group input[type="submit"].btn-cta { width: 91px; } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-service-info .box-content .form-group input[type="submit"].btn-arrow-cta { width: 33px; } } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-service-info .box-content .form-group input[type="radio"] { width: auto; right: 25px; } } .individual-service-profile .myhkt-service-info .list-services { list-style: none; margin-top: 10px; padding-left: 0; } @media (min-width: 768px) { .individual-service-profile .myhkt-service-info .list-services { padding-left: 10px; } } .individual-service-profile .myhkt-service-info .list-services li { margin-bottom: 15px; } .individual-service-profile .myhkt-service-info .list-services li a { color: #666; padding-left: 20px; background: url(../img/arrow-bullet.png) left center no-repeat; } .individual-service-profile .myhkt-service-info .submit-btn-group { padding-top: 10px; } @media screen and (min-width: 768px) { .individual-service-profile .myhkt-service-info .form label { width: 40%; } } @media screen and (min-width: 992px) { .individual-service-profile .myhkt-service-info .form label { width: 50%; } } /* Batch 5 - pages */ /* Page - My Profile Edit Mode */ /** * general box LO proposal */ .page-my-profile-edit-mode .page-title { margin: 0 0 30px 0; } .page-my-profile-edit-mode .row-box { margin: 0 4px; padding: 4px 0; } @media (min-width: 768px) { .page-my-profile-edit-mode .tab-content .tab-box { padding: 5px 8px !important; } } .page-my-profile-edit-mode .box { height: auto; padding: 5px 15px; } @media (min-width: 768px) { .page-my-profile-edit-mode .box { padding: 5px 4px; } } .page-my-profile-edit-mode .box .box-content { background-color: #fff; padding: 10px 10px 35px; } @media (max-width: 768px) { .page-my-profile-edit-mode .box .box-content { float: left; padding: 10px 20px 35px; } } @media (max-width: 768px) { .page-my-profile-edit-mode .box .box-content .form-group { float: left; } } @media (max-width: 768px) { .page-my-profile-edit-mode .box .box-content .form-group label { width: 50%; float: left; } } @media (max-width: 768px) { .page-my-profile-edit-mode .box .box-content .form-group span.display-value { width: 50%; } } .page-my-profile-edit-mode .box .box-content .form-group .visible { -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 768px) { .page-my-profile-edit-mode .box .box-content .form-group .visible { width: 50%; } } .page-my-profile-edit-mode .box .title { padding: 0; } @media (max-width: 768px) { .page-my-profile-edit-mode .box .title img { max-height: 29px; } } .page-my-profile-edit-mode .box .divider { border-top: 1px solid #178be2; width: auto; margin: 10px -5px 15px; } @media (min-width: 768px) { .page-my-profile-edit-mode .box .divider { margin: 15px -10px 15px -10px; } } /** * page specific LO */ .page-my-profile-edit-mode h2 { color: #666; font-size: 13px; margin-top: 10px; } @media (min-width: 768px) { .page-my-profile-edit-mode h2 { font-size: 20px; } } .page-my-profile-edit-mode .checkbox-label-left { margin: 0; padding-top: 8px; line-height: 20px; } @media (min-width: 768px) { .page-my-profile-edit-mode .checkbox-label-left { padding: 20px 0 10px; } } .page-my-profile-edit-mode .checkbox-label-left label { padding-left: 0; } .page-my-profile-edit-mode .checkbox-label-left input[type=checkbox] { margin-left: 10px; } .page-my-profile-edit-mode .box-account-toggle h2 { text-align: center; margin-bottom: 18px; } .page-my-profile-edit-mode .box-account-toggle .divider { border-top: 1px solid #ececec; background-color: transparent; margin: 0; } .page-my-profile-edit-mode .box-account-toggle .description { margin-bottom: 18px; text-align: center; } .page-my-profile-edit-mode .box-account-toggle .form-group { overflow: hidden; padding: 0 5px; } @media (min-width: 768px) { .page-my-profile-edit-mode .box-account-toggle .form-group { padding: 0 10px; } } .page-my-profile-edit-mode .box-account-toggle .form-group > label { float: left; font-weight: normal; } .page-my-profile-edit-mode .box-account-toggle .form-group > label.radio-inline { width: auto; margin-left: 10px; } .page-my-profile-edit-mode .box-account-toggle .form-group > label.radio-inline input[type="radio"] { width: auto; } .page-my-profile-edit-mode .box-account-toggle .form-group input[type="radio"] { margin-top: 1px; } @media (min-width: 768px) { .page-my-profile-edit-mode .box-account-toggle .form-group input[type="radio"] { margin-top: 3px; } } .page-my-profile-edit-mode .box-content .title .btn-edit { color: #666; font-size: 11px; margin-left: 18px; padding-left: 14px; } @media (min-width: 768px) { .page-my-profile-edit-mode .box-content .title .btn-edit { font-size: 14px; margin-left: 20px; background: url(../img/arrow-blue-dotted-5x9.png) left center no-repeat; } } .page-my-profile-edit-mode .box-content .title img { margin: 0; } @media (min-width: 768px) { .page-my-profile-edit-mode .box-content .title img { min-height: 0; height: 35px; } } .page-my-profile-edit-mode .form-group { margin: 8px 0; width: 100%; } .page-my-profile-edit-mode .form-group label, .page-my-profile-edit-mode .form-group .form-control, .page-my-profile-edit-mode .form-group .display-value { width: 100%; color: #666; font-size: 11px; } @media (min-width: 768px) { .page-my-profile-edit-mode .form-group label, .page-my-profile-edit-mode .form-group .form-control, .page-my-profile-edit-mode .form-group .display-value { font-size: 14px; width: 80%; } } .page-my-profile-edit-mode .form-group label, .page-my-profile-edit-mode .form-group .display-value { vertical-align: top; } .page-my-profile-edit-mode .form-group .display-value { padding: 5px 5px 5px 0; display: inline-block; } .page-my-profile-edit-mode .form-group .form-control { padding: 5px; } .page-my-profile-edit-mode .form-group .form-control { height: auto; } .page-my-profile-edit-mode .form-group .display-value { padding-top: 0; } .page-my-profile-edit-mode .form-group label { font-weight: bold; width: 100%; } .page-my-profile-edit-mode .box-wrap-my-hkt, .page-my-profile-edit-mode .tab-pane { background: #eef3f9; } .page-my-profile-edit-mode .myhkt-basic-info .box-content { padding: 20px 10px; } .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label { width: 100%; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label { width: 33%; line-height: 26px; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label { width: 31.333333%; } } .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label + input, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label + select { width: 100%; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label + input, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group > label + select { width: 67%; } } .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .input-note { color: #acacac; font-size: 12px; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .input-note { display: block; margin-left: 33%; width: 67%; font-size: 14px; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .input-note { margin-left: 31.333333%; } } .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .font-form-label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form label, .form .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group h3, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form-subtitle { width: 33.33333%; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .font-form-label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form label, .form .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group h3, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form-subtitle { width: 12%; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .font-form-label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form label, .form .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group label, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group h3, .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .page-my-profile-edit-mode .myhkt-basic-info .box-content.update-info .form-group .form-subtitle { width: 17%; } } .page-my-profile-edit-mode .myhkt-basic-info .info-col { width: 100%; } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col { width: 50%; padding-left: 5px; } } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group { width: 99%; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group.form-group-radio { margin-top: -2px; margin-bottom: 22px; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group.form-group-radio .radio-option input[type="radio"] { float: left; margin: 7px 5px 0 0; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group.form-group-radio .radio-option .radio-label { margin: 0; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group.form-group-security { margin-bottom: 27px; } } .page-my-profile-edit-mode .myhkt-basic-info .info-col .form-group .radio-label { font-weight: normal; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col label { width: 50%; } } @media (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col label { width: 40%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .info-col .display-value { width: 50%; } } .page-my-profile-edit-mode .myhkt-basic-info .btn-group { float: right; width: 100%; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .btn-group { float: none; padding-bottom: 20px; width: auto; margin-left: 31.33333%; } } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-basic-info .btn-group { width: 100%; padding: 0 25px 0 0; margin: 0; } } .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-cta, .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-arrow-cta { border: 0 none; min-width: 0; padding: 0; } .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-cta { width: 73px; height: 26px; background: url(../img/btn-img-small.png) center top no-repeat; font-size: 12px; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-cta { font-size: 14px; background: url(../img/btn-img.png) center top no-repeat; width: 91px; height: 33px; } } .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-arrow-cta { width: 26px; height: 26px; background: url(../img/btn-arrow-small.png) center top no-repeat; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-basic-info .btn-group > div .btn-arrow-cta { background: url(../img/btn-arrow.png) center top no-repeat; width: 33px; height: 33px; } } .page-my-profile-edit-mode .myhkt-basic-info .btn-group .btn-image { height: 30px; width: 101px; } .page-my-profile-edit-mode .myhkt-service-info { margin-top: 30px; padding-bottom: 10px; } @media (max-width: 767px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account { padding-left: 30px; padding-right: 30px; padding-top: 20px; } } .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs { border-bottom: transparent; padding: 0; } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs .class-all { width: 12%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs .class-fix { width: 29%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs .class-net { width: 29%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs .class-common { width: 15%; } } .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs li a { margin-right: 2px; } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs li a { text-align: center; } } .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs li:last-child a { margin-right: 0; } @media (max-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .tabs-account .nav-tabs li:last-child a { margin-right: 2px; } } .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo { float: left; margin-top: 10px; margin-bottom: 16px; width: 80%; } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo { margin-top: 24px; margin-left: 14px; } } .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo .enabled-mark { float: left; margin-left: 8px; height: auto; width: 20px; } .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo label { margin-left: 15px; float: left; font-size: 14px; font-weight: normal; } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo label { margin-left: 5px; } } .page-my-profile-edit-mode .myhkt-service-info .allAccountInfo .all-account { float: left; margin-top: 4px; margin-left: 8px; } @media screen and (min-width: 992px) { .page-my-profile-edit-mode .myhkt-service-info .box-content .form-group { height: 31px; } } @media screen and (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .box-content .form-group .display-value, .page-my-profile-edit-mode .myhkt-service-info .box-content .form-group input { width: 50%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .box-content .form-group input[type="radio"] { width: auto; } } .page-my-profile-edit-mode .myhkt-service-info .list-services { list-style: none; margin-top: 10px; padding-left: 0; } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .list-services { padding-left: 10px; } } .page-my-profile-edit-mode .myhkt-service-info .list-services li { margin-bottom: 15px; } .page-my-profile-edit-mode .myhkt-service-info .list-services li a { color: #666; padding-left: 20px; background: url(../img/arrow-bullet.png) left center no-repeat; } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .box-content label { width: 40%; } } @media (min-width: 768px) { .page-my-profile-edit-mode .myhkt-service-info .box-content label { width: 50%; } } /* Page - Care main */ .page-care p { font-size: 120%; } .page-care .content-area { padding-left: 10px; padding-right: 10px; } @media (min-width: 768px) { .page-care .content-area { padding: 0; } } .page-care h1 { margin-top: 5px; } .page-care .modal-dialog { background: #fff; } @media (min-width: 768px) { .page-care .modal-body, .page-care .modal-footer { padding: 20px; } } .page-care .modal-footer { padding-top: 0; border: 0; } .page-care .modal-footer a { float: right; } @media (min-width: 480px) { .page-care .modal-footer a { float: none; display: inline-block; } } .block-display { display: block; } /*****************************************/ /* CSS for the light box in Care Page */ /*****************************************/ #care-modal { background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.6); } #care-modal:target { display: block; } #care-modal:target body { overflow: hidden; } #care-modal h5, #care-modal p { font-color: #666; font-size: 130%; } #care-modal h5 { font-weight: bold; } .care-main-content h4 { color: #1b2a46; line-height: 1.5; font-size: 120%; font-weight: bold; } .care-main-content .form-horizontal { margin-top: 15px; margin-bottom: 15px; } .care-main-content .form-horizontal .control-label { text-align: left; margin-bottom: 0; padding-top: 7px; padding-left: 0; font-size: 120%; } .care-main-content .form-group { margin: 0; } @media (min-width: 768px) { .care-main-content .form-control-static { padding-left: 15px; } } .care-main-content .agreement-check { font-weight: normal; } @media (min-width: 768px) { .care-main-content .agreement-check p { padding-left: 10px; } } @media (max-width: 768px) { .care-main-content .yes-label { margin-bottom: 15px; } } @media (min-width: 768px) { .care-main-content .decline-label { margin-right: 15px; } } .care-main-content .decline-label div { width: 120px; } .care-main-content .separator { margin-top: 80px; height: 2px; background: #ccc; } /* Page - Care registration */ .register-main-content .page-title { margin-bottom: 30px; } .register-main-content h2 { margin-top: 25px; margin-bottom: 25px; } @media (min-width: 768px) { .register-main-content h2 { margin-bottom: 15px; } } .register-main-content .bill-protector { padding-left: 15px; padding-right: 15px; margin-top: 20px; margin-bottom: 20px; } .register-main-content .a5 { color: #006ea5; } .register-main-content .a7e { color: #03437e; } @media (min-width: 768px) { .register-main-content .a7e { color: #002c71; } } .register-main-content h3 { margin-top: 15px; margin-bottom: 30px; } @media (min-width: 768px) { .register-main-content h3 { margin-bottom: 12px; } } .register-main-content h2, .register-main-content h3 { font-size: 13px; font-weight: bold; } .register-main-content p { font-size: 12px; } .register-main-content .i-guard { margin: 0 0 15px; } .register-main-content .personal-information-row { background-color: #eef3f9; } @media (min-width: 768px) { .register-main-content .personal-information-row { margin: 0; } } .register-main-content .personal-information-row .required-info { margin-bottom: 20px; } .register-main-content .personal-information-row .required { color: #ff0000; } @media (min-width: 768px) { .register-main-content .personal-information-row .label-normal { font-weight: normal; } } .register-main-content .personal-information-row .form-group { width: 100%; float: left; margin-bottom: 8px; } .register-main-content .personal-information-row .form-group p { margin: 0 0 5px; } .register-main-content .personal-information-row .form-group .control-label { font-size: 12px; } .register-main-content .personal-information-row .form-group .radio-btn { float: left; margin-right: 3px; width: 25px; height: 25px; display: inline-block; background: url(../img/radio-btn.png) -25px 0 no-repeat; } .register-main-content .personal-information-row .form-group .radio-label { margin-top: 5px; display: inline-block; size: 12px; font-weight: normal; } .register-main-content .personal-information-row .form-group .font-form-label, .register-main-content .personal-information-row .form-group .form label, .form .register-main-content .personal-information-row .form-group label, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group h3, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group .form-subtitle { margin-bottom: 8px; } @media (min-width: 768px) { .register-main-content .personal-information-row .form-group .font-form-label, .register-main-content .personal-information-row .form-group .form label, .form .register-main-content .personal-information-row .form-group label, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group h3, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group .form-subtitle { width: 12.66667% !important; } } @media (min-width: 992px) { .register-main-content .personal-information-row .form-group .font-form-label, .register-main-content .personal-information-row .form-group .form label, .form .register-main-content .personal-information-row .form-group label, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin h3, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group h3, .register-main-content .personal-information-row .form-group .page-myhkt-registerLogin .form-subtitle, .page-myhkt-registerLogin .register-main-content .personal-information-row .form-group .form-subtitle { padding-right: 0; } } .register-main-content .personal-information-row .form-group :checked + span.radio-btn { background-position: left center; } .register-main-content .personal-information-row .form-group label.radio-option:hover { cursor: pointer; } .register-main-content .personal-information-row .form-group :disabled { color: #acacac; } .register-main-content .personal-information-row .bill-protector-row { background-color: #fff; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .hkt-service { padding-right: 0; } } .register-main-content .personal-information-row .bill-protector-row .hkt-bills { padding-left: 0; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .hkt-bills { text-align: center; } } @media (min-width: 992px) { .register-main-content .personal-information-row .bill-protector-row .hkt-bills { padding-right: 0; padding-left: 15px; text-align: left; } } .register-main-content .personal-information-row .bill-protector-row .box-info { width: 100%; padding-top: 15px; padding-bottom: 15px; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .box-info { padding-top: 10px; padding-bottom: 0; } } .register-main-content .personal-information-row .bill-protector-row .box-info.odd { width: 90%; margin-left: 5%; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .box-info.odd { width: 96%; margin-left: auto; margin-right: auto; } } .register-main-content .personal-information-row .bill-protector-row .box-info.even { background-color: #f5f5f5; width: 90%; margin-right: auto; margin-left: auto; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .box-info.even { width: 96%; } } .register-main-content .personal-information-row .bill-protector-row .top-label { border-bottom: solid 1px #ccc; padding-bottom: 4px; } .register-main-content .personal-information-row .bill-protector-row .desk { width: 96%; margin-right: auto; margin-left: auto; } @media (min-width: 768px) { .register-main-content .personal-information-row .bill-protector-row .desk { padding-bottom: 0; } } .register-main-content .personal-information-row .terms { background-color: #fff; margin-top: 30px; padding-top: 30px; padding-bottom: 30px; } .register-main-content .personal-information-row .terms p { margin: 0 0 0px; } .register-main-content .personal-information-row .terms .row-btn { margin-top: 30px; } @media (min-width: 768px) { .register-main-content .personal-information-row .terms { margin-top: 10px; padding-top: 20px; } } @media (min-width: 768px) { .register-main-content .personal-information-row .yes-label { position: absolute; right: 0; margin-right: 180px; } } .register-main-content .personal-information-row .decline-label { margin-top: 15px; clear: both; } @media (min-width: 768px) { .register-main-content .personal-information-row .decline-label { margin-top: 0; } } .register-main-content .personal-information-row .decline-label div { width: 120px; } /* DEMO */ /* DEMO - Share Performance - START */ .stock_iframe { border: 0; } /* Browsers: 00 - iPhone 01 - Chrome 02 - Firefox 03 - Safari 04 - IE */ /* ele-performance-graph */ .performance-desk-view { /*height:750px;*/ height: 640px; } .performance-mobl-view { /*height:525px;*/ /* OK: 00 */ height: 1015px; /* OK: 00, 01, 03 */ } /* ele-share-details */ .share-desk-view { /*height:525px;*/ height: 870px; } .share-mobl-view { /*height:480px;*/ height: 330px; /* OK: 00, 01, 03 */ } /* ele-stock-price-history */ .history-desk-view { /*height:400px;*/ height: 400px; } .history-mobl-view { /*height:2600px;*/ height: 520px; /* OK: 00, 01, 03 */ } /* DEMO - Share Performance - END */ /** * External */ /* Elastislide */ /* Elastislide Style */ .es-carousel-wrapper { padding: 10px 27px; position: relative; position: relative; margin-bottom: 20px; } .es-carousel-wrapper .es-carousel { overflow: hidden; } .es-carousel-wrapper .es-carousel ul { display: none; height: 50px; } .es-carousel-wrapper .es-carousel ul li { height: 100%; float: left; display: block; } .es-carousel-wrapper .es-carousel ul li a { display: block; border-style: solid; border-color: #222; opacity: 0.8; -webkit-touch-callout: none; /* option */ -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .es-carousel-wrapper .es-carousel ul li a img { display: block; border: none; /*width: 65px; height: 43px;*/ width: 100%; } .es-carousel-wrapper .es-carousel ul li.selected a { border-color: #fff; opacity: 1.0; } .es-carousel-wrapper .es-nav span { position: absolute; top: 50%; left: 8px; /*background:transparent url(../images/nav_thumbs.png) no-repeat top left;*/ background: red; width: 14px; height: 26px; margin-top: -13px; text-indent: -9000px; cursor: pointer; opacity: 0.8; } .es-carousel-wrapper .es-nav span :hover { opacity: 1.0; } .es-carousel-wrapper .es-nav span.es-nav-next { right: 8px; left: auto; background-position: top right; } .rg-image-wrapper .rg-image img { width: 100%; } .mt-2 { margin-top:2px; } .mt-5 { margin-top:5px; } .mt-7 { margin-top:7px; } .mt-10 { margin-top:10px; } .mt-15 { margin-top:15px; } .mt-17 { margin-top:17px; } .mt-30 { margin-top:30px; } .box-detail-content-big { font-size: 120%; position: relative; z-index: 3; padding-bottom: 15px; } @media (min-width: 768px) { .box-detail-content-big { font-size: 140%; height: 630px; position: relative; z-index: 3; padding-bottom: 15px; } } .box-detail-content-med { font-size: 120%; position: relative; z-index: 3; padding-bottom: 15px; } @media (min-width: 768px) { .box-detail-content-med { font-size: 140%; height: 300px; position: relative; z-index: 3; padding-bottom: 15px; } } .box-detail-content-small { font-size: 120%; position: relative; z-index: 3; padding-bottom: 15px; } @media (min-width: 768px) { .box-detail-content-small { font-size: 140%; height: 150px; position: relative; z-index: 3; padding-bottom: 15px; } } @media (max-width: 768px) { .box .row-gutter-10 { margin-left:0px; } } @media screen and (max-width: 768px) { .box .link-nl { margin-top:0px; } .box-nl { height:auto; } } #products-and-solutions-below-link h2 { font-size: 140%; } @media (max-width: 660px) { .frame-emailalert { height: 1500px; } .frame-mediasubscribe { height: 1200px; } /* .frame-feedback { height: 1000px; } */ .frame-servicerelocation { height: 1600px; } }