html, body { overflow: auto; } /***************** * HEADER *******************/ header .banner-header { background: #35424a; border: none; border-radius: 0; margin-bottom: 0; box-shadow: none; min-height: 0; } header .banner-header .container-fluid { text-align: center; } header .banner-header .container-fluid .navbar-header .mobile-logo { display: none; } header .banner-header .container-fluid .navbar-header .mobile-logo .plt_logo { width: 82px; margin-top: 6px; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav { display: inline-block; width: 100%; text-align: center; position: relative; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li { display: inline-block; float: none; margin-right: 3%; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo { position: absolute; left: 0; margin-right: 0; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-label a { color: white; } header .banner-header .container-fluid .navbar-collapse.collapse.in ul.navbar-nav li, header .banner-header .container-fluid .navbar-collapse.collapsing ul.navbar-nav li { display: block; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo > a { padding-top: 0; padding-bottom: 0; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo > a > .plt_logo { width: auto; /*min-width: 205px;*/ height: 100%; margin-top: 4px; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li a { color: white; padding: 10px 0; background: none; text-shadow: none; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav > li.li-item > a:focus, ul.navbar-nav > li.li-item > a:hover::after { left: 0 !important; right: 0 !important; transition: all 0.5s ease; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-item a::after { content: ""; position: absolute; top: calc(100%); border-bottom: 4px solid #F04C24; left: 50%; right: 50%; transition: all 0.5s ease; } header .banner-header .container-fluid .navbar-collapse ul.navbar-nav > li.li-label > a:focus, ul.navbar-nav > li.li-label > a:hover { border: none; cursor: inherit; } /* Lien de la tabulation selectionnée */ header .banner-header .container-fluid .navbar-collapse ul.navbar-nav > li.active > a, ul.navbar-nav > li.active > a:focus, ul.navbar-nav > li.active > a:hover { background: none; border-radius: 0; border-bottom: 4px solid #F04C24; } @media (min-width: 0px) and (max-width: 768px) { header .banner-header .container-fluid .navbar-header .mobile-logo { display: inline-block; } } @media (min-width: 0px) and (max-width: 1044px) { header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo { display: none !important; } } @media (min-width: 1163px) and (max-width: 1320px) { header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo > a > .plt_logo { margin-top: 4px; /*min-width: 150px;*/ } } @media (min-width: 1045px) and (max-width: 1162px) { header .banner-header .container-fluid .navbar-collapse ul.navbar-nav li.li-logo > a > .plt_logo { margin-top: 4px; /*min-width: 105px;*/ } } /***************** * FOOTER *******************/ footer.footer { background: #C3C7CA; margin-top: 30px; position: absolute; bottom: 0; width: 100%; } footer.footer .container .row { margin-top: 20px; } footer.footer .container .row .footer-links li { display: inline-block; margin-right: 1rem; line-height: 1; } footer.footer .container .row .footer-links li a { color: #000000; text-decoration: none; } footer.footer .container .row .footer-links li a:hover { color: #F04C24; } footer.footer .container .row .footer-copyright { color: #000; font-size: 12px; } /***************** * BODY *******************/ html { height: 100%; } body { background-color: #F2F2F2; /* font-family: Roboto; */ height: 100%; } #wrapper { min-height: 100%; position: relative; } #obsolete { background-image: url(http://compatibility.plantronics.com/images/obsolete.png); position: relative; } #obsolete::before { position: absolute; height: inherit; width: inherit; } main { padding-bottom: 120px; } input, button, textarea, select { /* font-family: Roboto; */ } .container .row { margin-bottom: 20px; } .tab-content > .tab-pane { padding-top: 50px; } .helping-text-bloc { background: #C3C7CA; padding: 2%; font-size: 2rem; color: white; margin-bottom: 30px; } /* Div des résultats de la recherche */ .result-div { background-color: #FFFFFF; padding: 20px 35px 0 35px; border: 2px solid rgba(50, 50, 50, 0.2); } .table thead tr th { text-align: center; } .table tbody tr td { vertical-align: middle; } tr.tr-item.table_title_part.table_title_part > td { border: none; white-space: nowrap; background-color: #2C81C3; color: white; font-size: 1.2em; font-weight: bold; } table.main-table tbody tr:not(.tr-item) > td:not(.dataTables_empty) { padding: 0; } /* Header des sous-tableaux*/ .table.table-features > thead { background-color: #1486DB; color: white; } /* Ligne cliquable du tableau manufacturer */ .clickable-td { cursor: pointer; } table.main-table > thead > tr > th { background-color: #EDEDED; } /* Entêtes des sous-tableaux */ .table.table-features > thead > tr > th { font-weight: normal; } /* Colonne cliquable des tables */ .table tbody tr td.details-control { background: url('http://compatibility.plantronics.com/images/static/icon/picto-arrow-right.png') no-repeat center center; background-size: 70%; cursor: pointer; } /* Table ligne impaire */ .table-striped > tbody > tr:nth-of-type(odd) { background-color: #f0f9ff; } .table tbody tr.shown { color: #1486DB; } /* Colonne cliquable des tables */ .table tbody tr.shown td.details-control { background: url('http://compatibility.plantronics.com/images/static/icon/picto-arrow-down.png') no-repeat center center; background-size: 70%; cursor: pointer; } .td-break { max-width: 250px; word-break: break-word; } /* Modal du test result */ .modal.modal-test-result .row { margin-right: 0px; margin-left: 0px; } /* Header tableau des test features */ .modal.modal-test-result .modal-body table.table-test-features thead { background-color: #68BF36; color: white; } /* Résultats des tests */ .modal.modal-test-result .modal-body .row span { font-weight: bold; } /* Icone des notes */ .note-link:hover { text-decoration: none; cursor: pointer; } /* Spinner de chargement des listes */ #product_spinner, #device_spinner, #manufacturer_spinner { display: none; } /* Div erreur ajax */ .row-error .error-div { border: 1px solid red; border-radius: 2px; color: red; } /* Div du champ obsolete */ .div-softphone-obsolete { margin-top: 25px; } /* Div de la selectbox region */ .div-region { margin-top: 10px; } /* Label */ label { font-weight: normal; } /* Platforms checkboxes */ #softphone_research_form_platform_0, #softphone_research_form_platform_1 { margin-right: 2px; } #softphone_research_form_platform_1 { margin-left: 6px; } /* Item de la dropdown (host) */ .dropdown-li-host { padding-left: 2.25em !important; font-size: 12px; } /* Item de la dropdown (device) */ .dropdown-li-device { padding-left: 1.25em !important; } ul.list_items { margin: 0; text-align: left; padding-left: 0; } /* Liste des périphériques dans une case de tableau */ ul.list_product { max-height: 100px; overflow: hidden; margin: 0; text-align: left; padding-left: 0; } /* Ligne des listes de périphériques */ ul.list_product li, ul.list_items li { list-style: disc outside none; display: list-item; margin-left: 1em; } ul.list_product.expanded { max-height:inherit; } /* Bouton + ou - pour expand les cases */ img.expand_row:hover { cursor: pointer; } /* Container de l'image du device/product selectionné */ .media .media-left { padding-right: 0; } /* Container de l'image du device/product selectionné */ .media .media-body { vertical-align: middle; padding-right: 20px; text-align: left !important; padding-left: 10px; } /* Container de l'image du device/product selectionné (titre) */ .media .media-body .media-heading { font-weight: bold; } /* Image du device/product sélectionné */ .media .media-left a.device-img-link { display: block; padding: 4px; margin-bottom: 20px; line-height: 1.42857143; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; -webkit-transition: border .2s ease-in-out; -o-transition: border .2s ease-in-out; transition: border .2s ease-in-out; } /* Image du device/product sélectionné (hover)*/ .media .media-left a.device-img-link:hover { border-color: #1486DB; } .label-manufacturer { margin-right: 95px; } .label-device { margin-right: 92px; } .label-device-softphone { margin-right: 115px; } .articles-list.multiple-articles { margin-left: 20px; width: 30px; } .article-div { display: inline-block; } .img-product { max-height: 100px; height: 100%; width: auto; } @media (min-width: 0px) and (max-width: 768px) { .row-options .col-md-offset-3, .row-options .col-md-offset-4 { margin-left: 20%; } } @media (min-width: 0px) and (max-width: 992px) { .label-manufacturer { margin-right: 5px; } .label-device { margin-right: 5px; } .label-device-softphone { margin-right: 25px; } } @media (min-width: 992px) and (max-width: 1200px) { .label-manufacturer { margin-right: 88px; } .label-device { margin-right: 80px; } .label-device-softphone { margin-right: 105px; } } /* Taille des dropdowns (horizontal) */ .select2 { width: 300px !important; } /* Taille de la dropdown des régions (horizontal) */ .select2.region-select + .select2 { width: 190px !important; } /* Taille des dropdowns (vertical) */ .select2 .selection .select2-selection.select2-selection--single { height: 32px; } /* Dropdown des régions */ .select2.region-select + .select2 .selection .select2-selection { background: none; border: 1px solid white; } .select2 .selection .select2-selection .select2-selection__rendered { margin-top: 0; } /* Dropdown des régions petite croix de suppression de tous les éléments sélectionnés */ .select2.region-select + .select2 .selection .select2-selection .select2-selection__rendered .select2-selection__clear { color: #ffffff; } /* Dropdown des régions éléments sélectionnés */ .select2.region-select + .select2 .selection .select2-selection .select2-selection__rendered .select2-selection__choice { background: none; border: none; border-radius: 0; margin-right: 0; margin-top: 7px; color: #ffffff; } /* Dropdown des régions petite croix de suppression des éléments sélectionnés */ .select2.region-select + .select2 .selection .select2-selection .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove:hover { color: #ffffff; } /* Dropdown des régions petite croix de suppression des éléments sélectionnés */ .select2.region-select + .select2 .selection .select2-selection .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove { color: #ffffff; } /* Texte des dropdowns */ .select2 .selection .select2-selection .select2-selection__rendered, .select2 .selection .select2-selection .select2-selection__rendered .select2-search .select2-search__field { text-transform: uppercase; letter-spacing: 1px; font-size: 12px; color: #999; text-align: left; } .select2 .selection .select2-selection.select2-selection--multiple { padding-right: 15px; } .select2 .selection .select2-selection .select2-selection__rendered .select2-search::after { content: ''; border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; width: 0; height: 0; margin-left: -4px; margin-top: -1px; position: absolute; top: 45%; right: 5px; } .select2 .selection .select2-selection.select2-selection--multiple .select2-selection__rendered .select2-selection__clear { position: absolute; top: 45%; right: 15px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin-top: 2px; } /* Taille des résultats des dropdowns */ .select2-dropdown.select2-dropdown--below { min-width: 300px; width: auto !important; } /* Border dropdown multiple lors du focus */ .select2-container--default.select2-container--focus .select2-selection--multiple { border: 1px solid #aaa !important; } .select2-container { z-index: 0; } .result-div span.select2, .result-div .fake_deskphone_research_form_connection, .result-div .deskphone_research_form_connects_to, .result-div .fake_deskphone_research_form_wearing_style, .result-div .fake_softphone_research_form_connection, .result-div .softphone_research_form_connects_to, .result-div .fake_softphone_research_form_wearing_style{ /* float: right; */ margin-right: 15px; display: inline; margin-left: 12px; } .result-div .fake_deskphone_research_form_connection input, .result-div .deskphone_research_form_connects_to input, .result-div .fake_deskphone_research_form_wearing_style input, .result-div .fake_softphone_research_form_connection input, .result-div .softphone_research_form_connects_to input, .result-div .fake_softphone_research_form_wearing_style input{ margin-left: 10px; margin-right: 5px; } .result-div label{ /* float: right; */ /* margin-right: 12px; */ display: inline-block; } .result-div label.title.required{ width: 100px; } .bold{ font-weight: bold; } .reset-attribute-button{ float:right; } .download-button{ float:right; margin-right: 15px; } .clear{ clear: both; } .search-button { margin-left: 25px; } @media (min-width: 0px) and (max-width: 768px) { .search-button { margin-left: 10px; } } @media (min-width: 768px) and (max-width: 992px) { .search-button { margin-left: 20px; } header .sub-banner-header .container-fluid .navbar-collapse ul.navbar-nav li a { font-size: 12px; } } hr { border-color: #d6d6d6; } /* Style des boutons */ .button { text-transform: uppercase; background-image: none; outline-color: inherit; border-radius: 2px; letter-spacing: 1px; text-align: center; font-size: 1.0em; font-size: 12px; cursor: pointer; padding: 7px; color: white; } /* Couleur bleu des boutons */ .button.blue { background-color: #1486DB; border: 1px solid #1486DB; } /* Couleur verte des boutons */ .button.green { background-color: #68BF36; border: 1px solid #68BF36; } /* Bouton delete / reset */ .button.delete, .button.delete:active, .button.delete:focus, .button.test, .button.test:active, .button.test:focus, .ui-widget .button.delete{ color: #1486db; background-color: transparent; border: none; } /* Bouton de la pagination de la dataTable */ .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { background-color: #1486DB !important; border-color: #1486DB !important; } /* Item selected dans la dropdown box */ .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover { background-image: none !important; background-color: #1486DB !important; } /* Tooltip blanc */ .white-tooltip + .tooltip > .tooltip-inner { background-color: #F2F2F2; } /* Custom icones */ .icon { width: 16px; height: 16px; margin-right: 5px; } /* Icone windows logo */ .icon-windows { background: url("http://compatibility.plantronics.com/images/static/icon/windows-logo.png") center center no-repeat; display: inline-block; } /* Icone mac logo */ .icon-mac { background: url("http://compatibility.plantronics.com/images/static/icon/apple-1.png") center center no-repeat; display: inline-block; } /* Icone windows & mac */ .icon-windows-mac { background: url("http://compatibility.plantronics.com/images/static/icon/windows-mac.png") center center no-repeat; display: inline-block; } /* Icone legacy */ .icon-legacy { background: url("http://compatibility.plantronics.com/images/static/icon/legacy.png") center center no-repeat; display: inline-block; } .logout { position: absolute; right: 90px; top: 16px; color: #ffffff; } .logout:hover { color: #ffffff; text-decoration: none; } @media (min-width: 0px) and (max-width: 992px) { .logout { position: absolute; right: 18px; top: 50px; color: #ffffff; } } .no-admin-button { right: 10px !important; } .admin_button { position: absolute; right: 10px; top: 10px; border: 1px solid #344047; background-color: white; color: #344047; } .admin_button:hover { border: 1px solid white; background-color: transparent; color: white; text-decoration: none; } .my-col-buttons { width: 100%; text-align: center; float: left; padding-top: 20px; } /* MOBILE */ @media (min-width: 0px) and (max-width: 575px) { .my-col-dropdown { width: 100%; text-align: center; padding-top: 20px; padding-bottom: 20px; } .select2 { width: 220px !important; } .select2-dropdown.select2-dropdown--below { min-width: 220px; width: auto !important; } .sub-banner-header ul.nav-pills li { display: none !important; } .sub-banner-header ul.nav-pills li.burger-button { display: block !important; } .select2.region-select + .select2 { width: 100px !important; } .div-region { margin-top: 0; } } @media (min-width: 576px) and (max-width: 767px) { .select2 { width: 150px !important; } .select2-dropdown.select2-dropdown--below { min-width: 220px; width: auto !important; } .sub-banner-header ul.nav-pills li { display: none !important; } .sub-banner-header ul.nav-pills li.burger-button { display: block !important; } } @media (min-width: 768px) and (max-width: 991px) { .select2 { width: 220px !important; } .select2-dropdown.select2-dropdown--below { min-width: 220px; width: auto !important; } } @media (min-width: 992px) and (max-width: 1199px) { .select2 { width: 280px !important; } .select2-dropdown.select2-dropdown--below { min-width: 280px; width: auto !important; } }