/*!
* Custom styles for Explore Industries Dealer Portal
*/

/* Global */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300&display=swap');

div#mainContent {
   min-height: calc(100% - 174px);
}

@media (max-width: 1200px) {
   div#mainContent {
      min-height: calc(100% - 153px);
   }
}

a:not(.btn) {
   font-family: 'Lato', sans-serif;
   font-weight: 400;
   font-size: 14px;
   color: #000;
}

/* Header */

/* logo - override inline style */
body .navbar-static-top.navbar .navbar-header div>a>img {
   background-color: inherit !important;
}

@media (max-width: 1199px ) {
   body .navbar-static-top.navbar .navbar-header div>a>img {
      width: 160px !important;
   }
}

@media (max-width: 700px ) {
   body .navbar-static-top.navbar .navbar-header div>a>img {
      width: 120px !important;
   }
}

body .navbar-static-top.navbar {
   padding: 20px 0;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none;
}

/* override mobile menu */
body .navbar-static-top.navbar button.navbar-toggle {
   margin-top: 8px;
   margin-bottom: 0;
   border-color: #fff;
   background-color: #fff;
}

body .navbar-static-top.navbar button.navbar-toggle .icon-bar {
   border-color: #001689;
   background-color: #001689;
   border-width: 1.25px;
}


@media (max-width: 1199px) {
   body .navbar-static-top.navbar .menu-bar>.navbar-nav {
      padding-left: 50%;
   }

   body .navbar-static-top.navbar .navbar-brand {
      padding: 0 8px;
   }
}

body .navbar-static-top.navbar .menu-bar>.navbar-nav>.divider-vertical {
   display: none;
}

body .navbar-static-top.navbar .menu-bar>.navbar-nav>li>a {
   font-family: 'Lato', sans-serif;
   font-size: 12px;
   font-weight: 900;
   color: #181E23;
   padding: 10px 25px;
   text-transform: uppercase;
   background-color: inherit;
   border: none !important;
}

body .navbar-static-top.navbar .menu-bar>.navbar-nav>li a {
   margin-left: 0;
}

body .navbar-static-top.navbar .menu-bar>.navbar-nav>li>a:hover {
   color: #9EAFC5;
   background-color: inherit;
   border: none;
   transition: color 0.4s cubic-bezier(.42, .01, .58, 1);
}

body .navbar-static-top.navbar .menu-bar>.navbar-nav>li.open>a {
   color: #9EAFC5;
}

body .navbar-inverse .navbar-nav .open .dropdown-menu {
   padding: 0;
   background-color: #ffffff;
}

body .navbar-inverse .navbar-nav .open .dropdown-menu>li {
   border-bottom: 1px solid #AFC2DA;
   max-width: 200px;
}

body .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
   color: #738191;
   padding: 6px 20px;
   font-family: 'Lato', sans-serif;
   font-size: 11px;
}

body .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover,
body .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus {
   border: none;
   color: #181E23;
   padding: 6px 20px;
   background-color: #AFC2DA;
   transition: color 0.4s cubic-bezier(.42, .01, .58, 1), background-color 0.4s cubic-bezier(.42, .01, .58, 1);
}

body .dropdown-menu .divider {
   display: none;
}

@media (min-width: 1200px) {
   #navbar .navbar-right {
      padding-top: 14px;
   }
}

/* logo */
div.navbar-brand a>img {
   max-width: 200px;
}

/* Explore style banner in blue */
.explore-banner {
   background-position: center top;
   background-repeat: repeat;
   background-image: radial-gradient(circle at center bottom, rgba(255,255,255,0) 61%, #ffffff 100%), url(/TexturedBackground_BlueShaded.webp);
   border: 0.5px solid #9eafc5;
   border-right-width: 0;
   border-left-width: 0;
   margin: 0;
}

.explore-banner .banner-text {
   margin: 60px 0;
}

.explore-banner .banner-text h1 {
   font-family: 'Oswald', sans-serif;
   font-weight: 200;
   font-size: 60px;
   color: #ffffff;
   letter-spacing: 0.41px;
   text-align: center;
   text-transform: uppercase;
}

@media (max-width: 449px) {
   .explore-banner .banner-text {
      margin: 36px 0
   }

   .explore-banner .banner-text h1 {
      font-size: 24px;
   }
}

@media (min-width: 450px) and (max-width: 549px) {
   .explore-banner .banner-text {
      margin: 40px 0
   }
   
   .explore-banner .banner-text h1 {
      font-size: 28px;
   }
}

@media (min-width: 550px) and (max-width: 699px) {
   .explore-banner .banner-text {
      margin: 44px 0
   }
   
   .explore-banner .banner-text h1 {
      font-size: 34px;
   }
}

@media (min-width: 700px) and (max-width: 849px) {
   .explore-banner .banner-text {
      margin: 48px 0
   }
   
   .explore-banner .banner-text h1 {
      font-size: 42px;
   }
}

@media (min-width: 850px) and (max-width: 1000px) {
   .explore-banner .banner-text {
      margin: 52px 0
   }
   
   .explore-banner .banner-text h1 {
      font-size: 50px;
   }
}


div#mainContent div.sectionPrimaryColor {
   background-color: inherit;
}

/* footer */
body footer .footer-bottom {
   background-color: rgb(16, 24, 32);
}

body footer .footer-bottom .container {
   padding: 20px 0 10px;
}

body footer .footer-bottom .container .frenchAccessibilityLink {
   display: none;
}

body footer .footer-bottom p {
   text-align: center;
   color: rgb(115, 129, 145);
   font-size: 12px;
}

/* Icons Section */
div.icon-sections-wrapper {
   display: flex;
   flex-wrap: wrap;
   margin: 0px;
   min-height: auto;
   padding: 8px;
}

div.icon-sections {
   padding: 0px;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
}

div.icon-sections>div {
   display: flex;
   flex-direction: column;
   align-items: center;
   max-width: 100%;
}

div.icon-sections>div a img.icon {
   width: 105px;
   height: 105px;
}

div.icon-sections>div a h3 {
   font-family: 'Oswald', sans-serif;
   font-size: 32px;
   color: #181E23;
   font-weight: 300;
   text-transform: uppercase;
   margin: 10px 0 0;
}

/* Resource Icons - force to display on multiple lines */
@media (min-width: 701px) {
   #resources .icon-sections .col-md-2 {
      width: 33%;
   }
}

@media (max-width: 700px) {
   
   div.icon-sections>div {
      width: 50%;
      margin: 0;
   }
   
   div.icon-sections>div a img.icon {
      width: 90px;
      height: 90px;
   }
   
   div.icon-sections>div a h3 {
      font-size: 26px;
   }
}

@media (max-width: 540px) {
   
   div.icon-sections {
      margin: 2.5vh auto;
   }

   div.icon-sections>div {
      width: 100%;
   }
}

/* Inner Pages */
div#subtext-container .columnBlockLayout {
   margin: 20px 0 0;
}

div#subtext-container .header-subtext {
   font-family: 'Lato', sans-serif;
   font-size: 16px;
   font-weight: 300;
   color: #5a6572;
   text-align: center;
   line-height: 28px;
}

button.explore-button {
   background-color: rgba(243,246,251,0);
   padding: 13px 29px;
   font-size: 14px;
   border: 1px solid #738191;
   font-family: 'Lato', sans-serif;
   font-size: 16px;
   font-weight: 400;
   color: #738191;
   transition: all .2s;
   min-width: 230px;
}

button.explore-button:hover {
   background-color: #738191;
   color: #f3f6fb;
}

@media (max-width: 515px) {
   button.explore-button {
      margin-bottom: 20px;
   }
}

.explore-table button.btn, .explore-form input.btn, .explore-form button.btn, .explore-table .grid-actions a.btn, .explore-form .grid-actions a.btn, .explore-form .actions input.btn, .container form a.btn, .container form input.btn, form button.btn, .container form input[type='file'], .container form input[type='file']::file-selector-button {
   background-color: rgba(243,246,251,0);
   font-size: 14px;
   border: 1px solid #738191;
   font-family: 'Lato', sans-serif;
   font-weight: 400;
   color: #738191;
   transition: all .2s;
   border-radius: 2px;
   width: fit-content;
}

.explore-form .actions input.btn, .explore-form input.btn, .container form input.btn {
   margin-left: 10px;
}
.explore-form .form-action-container-right button.btn.workflow-link {
   margin-right: 10px;
}

.explore-table button.btn:hover, .explore-form input.btn:hover, .explore-form button.btn:hover, .explore-table .grid-actions a.btn:hover, .explore-form .grid-actions a.btn:hover, .explore-form .actions input.btn:hover, .container form a.btn:hover, .container form input.btn:hover, form button.btn:hover {
   background-color: #738191;
   color: #f3f6fb;
}

.btn:focus {
   outline: 0;
   outline-offset: 0;
}

/* inverse buttons */
.explore-form button.btn.workflow-link, form button.btn.btn-primary {
   background-color: #738191;
   color: #f3f6fb;
}
.explore-form button.btn.workflow-link:hover, form button.btn.btn-primary:hover {
   background-color: rgba(243,246,251,0);
   color: #738191;
}

.explore-table .action button.btn:hover {
   border-color: #738191;
}

.explore-table .action button.btn:hover span, .explore-table .grid-actions a.btn:hover span {
   color: #fff;
}

.explore-table .grid-actions a.btn span {
   margin-right: 2px;
}

/* file upload buttons */
.container form input[type='file'] {
   padding: 10px 5px;
   border-radius: 8px;
   width: 350px;
   max-width: 100%;
}

.container form input[type=file]::file-selector-button {
   margin-right: 20px;
   padding: 6px 20px;
   background-color: #738191;
   color: #f3f6fb;
   cursor: pointer;
 }

 .container form input[type=file]::file-selector-button:hover {
   background-color: rgba(243,246,251,0);
   color: #738191;
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover {
   background-color: #738191 !important;
}

table *, table a {
   font-family: 'Lato', sans-serif;
   font-weight: 300;
   font-size: 14px;
   color: #454545;
}

table a:hover {
   color: #000;
}

/* tabs */

#tabs-wrapper .container {
   padding: 0;
}

ul#tabs {
   list-style: none;
   display: flex;
   position: relative;
   margin: 0;
   padding: 0;
   margin-top: 20px;
}

ul#tabs:after {
   border-bottom: 1px solid #666;
   content: '';
   display: block;
   width: 100%;
   height: auto;
   position: absolute;
   bottom: 0;
   right: 0;
}

ul#tabs li {
   border: 1px solid #666;
   border-radius: 6px 6px 0 0;
   padding: 12px;
   background-color: #f2f2f2;
   font-family: 'Lato', sans-serif;
   font-weight: 400;
   font-size: 14px;
}

ul#tabs li.active {
   background-color: #fff;
   border-bottom: 0;
   position: relative;
}

ul#tabs li a {
   color: #666;
}

ul#tabs li.active:after {
   content: '';
   display: block;
   position: absolute;
   left: 0;
   right: 0;
   bottom: -1px;
   height: 4px;
   background: white;
   width: 100%;
   z-index: 2;
}

.explore-table table.table>thead>tr>th {
   border-width: 1px;
   background-color: rgba(0, 0, 153, 0.1);
}

.explore-table table.table>thead>tr>th, .explore-table table.table>thead>tr>th>a {
   color: #000;
   font-weight: 400;
   transition: all .2s;
}

.explore-table table.table>thead>tr>th>a:hover {
   color: #5a6572;
}

.explore-table table > tbody > tr:nth-child(even) > td {
   background: #f2f2f2;
}

.explore-table .grid-actions, .explore-table .entitylist {
   border-width: 0.5px;
}

@media (max-width: 700px) {
   .explore-table table#BcInventory>thead>tr>th, .explore-table table#BcInventory>tbody>tr>td {
      font-size: 13px;
      min-width: 75px;
   }
}

.container .entity-grid div.message {
   font-family: 'Lato', sans-serif;
   margin-left: 10px;
}

.explore-form h2.tab-title, .explore-form h3 {
   font-family: 'Oswald', sans-serif;
   font-weight: 200;
   color: #5a6572;
   margin-left: 10px;
}

.container .disclaimer {
   background-color: #F0E68C;
   color: #000;
   font-family: 'Lato', sans-serif;
   font-size: 14px;
   font-weight: bold;
   text-align: center;
}

/* view order */
#billtoaddress .info, table[data-name='billto'] .info, table[data-name='shipto'] .info {
   display: none;
}

#billtoaddress .form-control, table[data-name='shipto'] td.form-control-cell, table[data-name='shipto'] .form-control {
   padding: 0;
   height: auto;
}

#billtoaddress td.cell, table[data-name='shipto'] td.cell {
   margin-bottom: 0
}

#billtoaddress input#address1_country, table[data-name='shipto'] input#shipto_country {
   display: none;
}


/* Modal */

.container .modal-header h1, .container form h2, .container form h3, .container form h4, .modal-dialog .modal-content .modal-header h4 {
   font-family: 'Oswald', sans-serif;
   font-weight: 200;
   color: #5a6572;
   margin-left: 10px;
}

.container .modal-header h1 {
   margin-left: 0;
}

.container .modal-body  {
   font-family: 'Lato', sans-serif;
   font-size: 16px;
   font-weight: 300;
   color: #5a6572;
}

/* PDF iframe */
.row .container .iframe-container {
   position: relative;
   overflow: hidden;
   width: 100%;
   margin: 20px 0;
   padding: 0;
   padding-top: 100%;

 }
 
 .iframe-container .pdf-viewer {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   width: 100%;
   height: 100%;
 }

 .logo-right {
   padding-bottom: 20px;
 }

 .logo-right img {
   width: 200px;
   float: right;
 }

 @media (max-width: 1199px ) {
   .logo-right img {
      width: 160px !important;
   }
}

@media (max-width: 700px ) {
   .logo-right img {
      width: 120px !important;
   }
}

/* login form */
form * {
   font-family: 'Lato', sans-serif;
   font-weight: 400;
   color: #5a6572;
}

form h1 * {
   font-size: 32px;
}

/* resources landing page */
#resources {
   margin-top: 40px
}

#resources h2 {
   font-family: 'Oswald', sans-serif;
   font-size: 40px;
   color: #181E23;
   font-weight: 300;
   text-transform: uppercase;
   margin: 0 0 20px 0;
   text-align: center;
}

#resources .icon-sections-wrapper {
   margin-bottom: 80px
}

#resources .icon-sections>div {
   margin: 0 
}

#resources div.icon-sections>div a h3 {
   text-transform: initial;
}

/* resources list */
#resources-download > .container table.section .notes .note .row .col-sm-3.metadata {
   display: none;
}

#resources-download > .container table.section #notescontrol .col-md-8.entity-notes, #resources-download > .container table.section .notes .note .row .col-sm-9.content {
   width: 100%;
}