/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/** to be sorted **/
/** BS5 5.1.1 Table Style Import **/
/** ============================ **/

input[type=date] {
  color: #aeaeae;
  background-color: #000000;
  border-color: #2d2d2d !important;
  border: 1px solid;
  padding: 10px 15px;
  max-width: 100%;
  width: 100%;
  margin-bottom: 1rem;
  border-radius: 6px;
  padding: 1rem;
}

input[type=date]::focus {
  border-color: #f40101;
}


input[type="date"]:valid {
  color: #f40101;
}

input[type="date"]:invalid:hover {
  color: red;
}

input[type=”date”] {
  position: relative;
}

::-webkit-calendar-picker-indicator {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='15' viewBox='0 0 24 24'><path fill='%23aeaeae' d='M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z'/></svg>");
}



::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #aeaeae;
  opacity: 1;
  /* Firefox */
}

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #aeaeae;
}

::-moz-placeholder {
  /* Firefox 19+ */
  color: #aeaeae;
}

:-ms-input-placeholder {
  /* IE 10+ */
  color: #aeaeae;
}

::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #aeaeae;
}

:-moz-placeholder {
  /* Firefox 18- */
  color: #aeaeae;
}


table {
  caption-side: bottom;
  border-collapse: collapse;
  border-spacing: 0;
  border-width: 1px 0px;
}

caption {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  color: #fff;
  text-align: left;
}

th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

thead,
tbody,
tfoot,
tr,
td,
th {
  border-color: inherit border-style: solid;
  border-width: 0;
  border-bottom: #333 solid 1px;
}

th {
  border-bottom: #000;
}

.table {
  --bs-table-bg: transparent;
  --bs-table-accent-bg: transparent;
  --bs-table-striped-color: #fff;
  --bs-table-striped-bg: #222;
  --bs-table-active-color: #f40101;
  --bs-table-active-bg: #000;
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: #000;
  width: 100%;
  margin-bottom: .2rem;
  color: #fff;
  vertical-align: top;
  border-color: #333;
}

.table> :not(caption)>*>* {
  padding: 0.5rem 0.5rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

.table>tbody {
  vertical-align: inherit;
}

.table>thead {
  vertical-align: bottom;
}

.table> :not(:last-child)> :last-child>* {
  border-bottom-color: currentColor;
}

.caption-top {
  caption-side: top;
}

.table-sm> :not(caption)>*>* {
  padding: 0.25rem 0.25rem;
}

.table-bordered> :not(caption)>* {
  border-width: 1px 0;
}

.table-bordered> :not(caption)>*>* {
  border-width: 0 1px;
}

.table-borderless> :not(caption)>*>* {
  border-bottom-width: 0;
}

.table-striped>tbody>tr:nth-of-type(odd) {
  --bs-table-accent-bg: var(--bs-table-striped-bg);
  color: var(--bs-table-striped-color);
}

.table-active {
  --bs-table-accent-bg: var(--bs-table-active-bg);
  color: var(--bs-table-active-color);
}

.table-hover>tbody>tr:hover {
  --bs-table-accent-bg: var(--bs-table-hover-bg);
  color: var(--bs-table-hover-color);
}

.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 575.98px) {
  .table-responsive-sm {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 767.98px) {
  .table-responsive-md {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 991.98px) {
  .table-responsive-lg {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 1199.98px) {
  .table-responsive-xl {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 1399.98px) {
  .table-responsive-xxl {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/** Volumetric Weight Calculator **/
/** ============================ **/

.wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 10px;
}


.box input[type=text] {
  box-sizing: border-box;
  display: inline-block;
}

.box {
  position: relative;
}

.box .appended {
  position: absolute;
  top: 45px;
  right: 20px;
  z-index: 2;
  display: inline-block;
  font-weight: bold;
  color: #f40101;

}

.box label {
  font-weight: bold;
}

.calcValues {
  font-weight: bold;
}

/* bullet lists */

.live {
  overflow: hidden;
  margin-left: 1.5rem;
}

.live>li {
  list-style: none;
  position: relative;
  padding: 0 0 0 2em;
  margin: 0 0 0.5em 10px;
  transition: 0.12s;
}

.live>li::before {
  position: absolute;
  content: "•";
  font-family: Arial;
  color: #FFF;
  top: 0;
  left: 0;
  text-align: center;
  font-size: 2em;
  opacity: 0.5;
  line-height: 0.75;
  transition: 0.5s;
}

.live>li:hover {
  color: #ffed00;
}

.live>li:hover::before {
  transform: scale(2);
  opacity: 1;
  text-shadow: 0 0 4px;
  transition: 0.1s;
}

.live.type2>li::before {
  content: "";
  width: 10px;
  height: 10px;
  background: #FFF;
  border-radius: 3px;
  line-height: 0;
  top: 0.27em;
  left: -10px;
}

.live.type2>li:hover::before {
  transform: none;
  border-radius: 5px;
  width: 25px;
  left: -10px;
  background: #ffed00;
}




/** Navigation Button **/
/** ================= **/

@media (min-width:769px) {
  .main-navigation .main-nav ul li.nav-button a {
    background-color: #f40101;
    color: #ffffff;
    font-weight: bold;
    text-transform: capitalize;
    letter-spacing: 0.02em;
    margin-left: 15px;
    border-radius: 0;
    border-width: 3px;
    border-style: solid;
    border-color: #f40101;
    text-transform: capitalize;
    display: inline-flex;
    align-items: center;
  }

  .main-navigation .main-nav ul li.nav-button a:hover {
    background-color: rgba(248, 174, 52, 0);
    color: #ffffff;
    border-color: #f40101;
  }
}

/** Hero Scroll Indicator **/
/** ===================== **/

.indicator {
  position: relative;
  min-height: 100px;
  margin-top: 60px;
}

.down {
  font-size: 48px;
  position: absolute;
  animation: opacity 3s infinite;
  left: 40%;
  opacity: .25;
  color: #f40101;
  left: 50%;
  transform: translate(-50%);
}

.down:nth-child(2) {
  top: 11px;
  animation-delay: .25s;
}

/*animation*/
@keyframes opacity {
  0% {
    opacity: .25;
  }

  30% {
    opacity: 1;
  }

  60% {
    opacity: 1;
  }

  100% {
    opacity: .25;
  }
}


/** custom-cf7-layout / Mail Chimp / Search Input Overides **/
/** ========== **/

.search-form label {
  display: block;
  margin-right: 1rem;
}

.search-field {
  margin-bottom: 0 !important;
  margin-right: 1rem;
}

.search-submit {
  padding: 14px 19px;
}

.search-submit .gp-icon svg {
  width: 1.3em;
  height: 1.3em;
  top: 0;
}

.cf7-gb-icon,
.mc-gb-icon {
  margin-left: -.20rem;
  margin-right: .8rem;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
textarea,
select {
  width: 100%;
  margin-bottom: .5rem;
  border-radius: 6px;
  padding: 1rem;
}

textarea {
  height: 150px !important;
  resize: none;
  margin-bottom: 0;
}

.wpcf7-not-valid-tip {
  display: inline-block;
  padding: .1rem .4rem;
  margin: 0rem 0rem 1rem 0rem;
  border: 1px solid #e5383b;
  border-radius: 18px;
  font-size: 12px;
  white-space: nowrap;
  color: #e5383b;
}

.wpcf7-not-valid-tip::before {
  content: "*";
  margin-right: 2px;
}

.wpcf7-response-output {
  color: #fff;
  background-color: transparent;
  border: 0;
  border-radius: 3.33px;
  padding: 5px 9px !important;
  margin: 0 !important;
  display: block;
  width: 300px;
  font-size: 14px;
}

.wpcf7-list-item {
  margin: 0;
}

.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
  content: "";
  margin-right: 0.5rem;
}

/** working hours table **/
/** ============ **/

.working-hours {
  font-size: 14px;
}

.working-hours td {
  padding: .5rem 0;
  border-bottom: 1px solid #666;
}

.working-hours figcaption {
  color: #666;
}

/** Footer Links **/
/** ============ **/

.site-footer .footer-links a:not(:last-child):after {
  content: '/';
  margin: .0rem .8rem;
  color: #444;
}

.user-sign-links a:not(:last-child):after {
  content: '/';
  margin: .0rem .8rem;
  color: #444;
}

/** Utility **/
/** ======= **/

button,
input[type=button],
input[type=submit] {
  background-color: #f40101;
  color: #ffffff;
  font-weight: bold !important;
  text-transform: capitalize;
  letter-spacing: 0.02em;
  padding: 12px 25px;
  border-radius: 3.33px;
  border-width: 3px;
  border-style: solid;
  border-color: #f40101;
  text-transform: capitalize;
  display: inline-flex;
  align-items: center;
  transition: all 0.2s ease;
  margin-bottom: 1rem;
}

button:hover,
input[type=button]:hover,
input[type=submit]:hover {
  background-color: rgba(248, 174, 52, 0) !important;
  color: #fff ! important;
  border-color: #f40101 !important;
  transition: all 0.2s ease !important;
}

.d-none {
  display: none !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.no-margin {
  margin: 0 !important;
}

.separate-containers .site-main {
  margin: 30px 30px 120px 30px;
}

.separate-containers .inside-right-sidebar,
.separate-containers .inside-left-sidebar {
  margin-top: 31px;
  margin-bottom: 120px;
}

.separate-containers .inside-right-sidebar .gb-headline,
.separate-containers .inside-left-sidebar .gb-headline {
  margin-top: -13px;
}

@media (min-width: 769px) {
  .main-navigation .main-nav ul li.nav-button a {
    border-radius: 3.33px;
  }
}

.masonry-load-more {
  text-align: center;
}

.masonry-load-more a.button {
  background-color: rgba(248, 174, 52, 0);
  color: #ffffff;
  font-weight: bold;
  text-transform: capitalize;
  letter-spacing: 0.02em;
  padding: 12px 25px;
  border-radius: 3.33px;
  border-width: 3px;
  border-style: solid;
  border-color: #f40101;
  text-transform: capitalize;
  display: inline-flex;
  align-items: center;
  transition: all 0.3s ease;
}

.masonry-load-more a.button:hover {
  background-color: #f40101;
  color: #ffffff;
  border-color: #f40101;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%0A%3Csvg aria-hidden='true' focusable='false' data-prefix='far' data-icon='chevron-down' class='svg-inline--fa fa-chevron-down fa-w-14' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' width='16' %3E%3Cpath fill='orange' d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position-x: 98%;
  background-position-y: 19px;
}

select {
  color: #777;
  transition: all 0.3s ease;
}

select:hover {
  color: #f40101;
  border-color: #f40101;
  transition: all 0.3s ease;
}

select:focus {
  color: #f40101;
  border-color: #f40101;

}

.button:disabled,
.gb-button:disabled {
  background-color: #777;
  border-color: #777;
}


/** Trackform Styles **/
/** ================ **/

.btn-inside-form {
  position: relative;
}

.btn-inside-input {
  background: rgba(0, 0, 0, 0.5) !important;
  padding-right: 6rem !important;
}

.btn-inside {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 2;
  cursor: pointer;
  transform: translateX(2px);
}

input#submit_wpcargo {
  font-weight: bold;
}

.wpcargo-modal .modal-content {
  border: 1px solid #f40101;
  border-radius: 13.33px;
  padding: 10px;
  background-color: #000;
}

.wpcargo-modal .modal-body {
  padding: 30px;
  background-color: #000;
}

.wpcargo-modal .modal-header {
  background-color: #000;
}

.wpcargo-modal .modal-footer {
  background-color: #000;
}

input.input_track_num.btn-inside-input {
  margin-bottom: 0;
}

/** WP Cargo login form **/
/** =================== **/

.wpcargo-login {
  margin: 0 !important;
}

.wpcargo-login #loginform {
  padding: 10px;
  border: 0;
}

.login-password,
.login-username {
  margin: 0 !important;
}

.wpcargo-login input[type="submit"] {
  background-color: #f40101;
  color: #ffffff;
  font-weight: bold !important;
  text-transform: capitalize;
  letter-spacing: 0.02em;
  padding: 12px 25px;
  border-radius: 3.33px;
  border-width: 3px;
  border-style: solid;
  border-color: #f40101;
  text-transform: capitalize;
  display: inline-flex;
  align-items: center;
  transition: all 0.3s ease;
}

.wpcargo-login input[type="submit"]:hover {
  background-color: rgba(248, 174, 52, 0);
  color: #ffffff;
  border-color: #f40101;
}

/** Custom colours for Gutenberg editor **/
/** =================================== **/

/** yellow gutenburg **/
.has-yellow-background-color {
  background-color: #ffed00;
}

.has-yellow-color {
  color: #ffed00;
}

/** orange gutenburg **/
.has-orange-background-color {
  background-color: #f40101;
}

.has-orange-color {
  color: #f40101;
}

/** offset-black gutenburg **/
.has-offset-black-background-color {
  background-color: #1e2022;
}

.has-offset-black-color {
  color: #1e2022;
}

/** muted-grey gutenburg **/
.has-muted-grey-background-color {
  background-color: #afafaf;
}

.has-muted-grey-color {
  color: #afafaf;
}

/** ghost-white gutenburg **/
.has-ghost-white-background-color {
  background-color: #f8f9fa;
}

.has-ghost-white-color {
  color: #f8f9fa;
}

/** white gutenburg **/
.has-white-background-color {
  background-color: #ffffff;
}

.has-white-color {
  color: #ffffff;
}

/** black gutenburg **/
.has-black-background-color {
  background-color: #000000;
}

.has-black-color {
  color: #000000;
}