@import './_blue.css';

.tm-video-image-handle {
    background: #fff;
    display: inline-block;
    border-radius: 200px;
}

.tm-video-image-handle,
.tm-video-image-handle a {
    padding: 0;
    margin: 0;
    font-size: 0;
}

.tm-video-image-handle span {
    padding: 3px;
}

.tm-video-image-block>.tm-video-image-handle {
    position: absolute;
    z-index: 3;
    bottom: 50px;
    right: 50px;
    width: 40px;
    height: 40px;
}


/* slider */

div#tm-top-slider>.uk-section {
    padding-top: 20px;
    padding-bottom: 20px;
}

div#tm-top-slider .tm-slider-title {
    margin: 15px auto !important;
    /* text-transform: uppercase !important; */
    color: #fff!important;
    font-size: 35px;
    display: block;
    line-height: 1em;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

div#tm-top-slider .slider-title-s2 {
    text-transform: capitalize !important;
    font-size: 26px;
    display: block;
}


/* slider */

.tm-top-offers-section>div.uk-container.uk-container-expand {
    padding-left: 0;
    padding-right: 0;
}


/* Forms */

.pmc-labels-over form.pmcontact-form .pmc-field-text label,
.pmc-labels-over form.pmcontact-form .pmc-field-name label,
.pmc-labels-over form.pmcontact-form .pmc-field-email label,
.pmc-labels-over form.pmcontact-form .pmc-field-phone label,
.pmc-labels-over form.pmcontact-form .pmc-field-subject label,
.pmc-labels-over form.pmcontact-form .pmc-field-password label,
.pmc-labels-over form.pmcontact-form .pmc-field-date label,
.pmc-labels-over form.pmcontact-form .pmc-field-textarea label,
.pmc-labels-over form.pmcontact-form .pmc-field-select label,
.pmc-labels-over form.pmcontact-form .pmc-field-multiple label {
    line-height: 47px;
    font-weight: 400;
}


/* Buttons */

.uk-button-small {
    border-width: 2px;
}


/* Cards */

.uk-card-default .uk-card-media-left:after,
.uk-card-default .uk-card-media-top:after {
    content: "";
    background: url(/images/card-bg-2a.svg) no-repeat bottom left;
    width: 195px;
    height: 138px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.pm-max-header-height {
    max-height: 55px;
}

button.tm-grid-extend-handle {
    display: inline;
    cursor: pointer;
    background: #000;
    border: 2px solid #ff3d00;
    border-radius: 200px;
    color: #c7daf7;
    font-weight: 700;
    font-size: 14px;
    padding: 0;
    line-height: 1em;
    width: 20px;
    height: 20px;
}


/* fix problem with focus color on button elements. */

.pm-outline-fix {
    margin-bottom: 2px !important;
}


/* Grid */

div#tm-grid-extended-modal .uk-modal-title {
    font-size: 33px;
    color: #464646;
}

div#tm-grid-extended-modal .uk-modal-dialog {
    border-radius: 20px;
    overflow: hidden;
}

.uk-modal-light .uk-modal-dialog,
.uk-modal-light .uk-modal-header,
.uk-modal-light .uk-modal-footer {
    background: #e5e5e5;
}

#tm-grid-extended-modal.uk-modal-light .uk-modal-dialog,
#tm-grid-extended-modal.uk-modal-light .uk-modal-header,
#tm-grid-extended-modal.uk-modal-light .uk-modal-footer {
    background: #ffffff;
}

#tm-grid-extended-modal .uk-modal-header,
#tm-grid-extended-modal .uk-modal-footer {
    border: none;
}

#tm-grid-extended-modal.uk-modal-light .uk-modal-header {
    padding-top: 15px;
}

#tm-grid-extended-modal .uk-modal-footer .uk-button-small {
    font-size: 14px;
    line-height: 24px;
}

#tm-grid-extended-modal .uk-modal-body {
    padding-top: 0
}

div#tm-grid-extended-modal .uk-modal-dialog {
    border-radius: 3px;
}

div#guarantee-section-item-1 h2 {
    font-size: 52px;
}


/* Grid */


/* pm-cta-panel */


/* fix icon */

.pm-cta-panel>div>div:first-child {
    flex-basis: 130px;
    text-align: left;
    flex-shrink: 0;
}


/* make content expand */

.pm-cta-panel>div>div:nth-child(2) {
    flex-grow: 1;
}


/* center content+button divs */

.pm-cta-panel>div>div:nth-child(2) .uk-grid>div {
    align-self: center;
}

.pm-cta-panel .el-image.uk-icon {
    width: 65px!important;
    height: 65px!important;
    text-align: center;
    background: rgba(255, 61, 0, 0.1);
    border-radius: 200px;
    line-height: 58px;
}

.pm-cta-panel>div>div:nth-child(2) .uk-grid {
    flex-wrap: nowrap;
}

.pm-cta-panel>div>div:nth-child(2) .uk-grid>div {
    padding: 0;
}

.pm-cta-panel>div>div:nth-child(2) .uk-grid>div:nth-child(1) {
    flex-grow: 1;
    flex-shrink: 1;
}

.pm-cta-panel>div>div:nth-child(2) .uk-grid>div:nth-child(2) {
    flex-basis: 260px;
    flex-shrink: 0;
    text-align: right;
}


/* pm-cta-panel */


/* Navbar Toggle */

.tm-header-mobile .uk-container {
    padding: 0;
}

a.uk-navbar-toggle {
    background: #F0ECF7;
    padding: 6px;
    border-radius: 5px;
    margin-right: 10px;
    color: #3C1C83;
}


/* Navbar Mobile */

#tm-dialog-mobile #module-menu-dialog-mobile a {
    color: #fff;
    display: block;
    width: 100%;
    min-width: 400px;
}

#tm-dialog-mobile #module-menu-dialog-mobile li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

#tm-dialog-mobile #module-menu-dialog-mobile li li {
    border-bottom: none;
}

#tm-dialog-mobile #module-menu-dialog-mobile .uk-active a {
    color: #fff19c;
}

#tm-dialog-mobile #module-menu-dialog-mobile .uk-nav-default {
    font-size: 2em;
}

#tm-dialog-mobile #module-menu-dialog-mobile .uk-nav-sub a:before {
    content: "› ";
}

h1>.uk-heading-medium,
h2>.uk-heading-medium,
h3>.uk-heading-medium,
h1>.uk-heading-small,
h2>.uk-heading-small,
h3>.uk-heading-small,
h1>.uk-heading-large,
h2>.uk-heading-large,
h3>.uk-heading-large {
    margin-top: 0;
}


/* wrap offers block end */

.tm-min-width-250 {
    min-width: 250px;
}


/* //TODO:Update this element height with javascript */

.tm-grid-extend-item .uk-child-width-expand .uk-card-media-top:has(video) {
    min-height: 500px;
}

.pm-cta-right {
    max-width: 410px;
    margin-left: auto;
    border-radius: 15px;
}

#tm-top-slider.add-truck .tm-top-slider-grid.tm-animate:before {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
}

/* #tm-top-slider.add-truck .tm-top-slider-grid.tm-animate.animate:before {
    -webkit-animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
} */

#tm-top-slider.add-truck .tm-top-slider-grid.tm-animate.animate:before {
	-webkit-animation: slide-in-blurred-tl 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
	        animation: slide-in-blurred-tl 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

.uk-comment .uk-icon[uk-icon="star"] svg *{
    fill: #ffcc31 !important;
    stroke: #a98721 !important;
}
.tm-header a.uk-logo.uk-navbar-item {
    margin-top: -16px;
}

.tm-wave-section-1>div {
    padding: 0;
}

.tm-wave-section-1 img {
    width: 100%;
}

.tm-wave-section-2 .tm-grid-extend-item  {
    background: #ffffff !important;
}

@media (max-width: 1270px) {
    .pm-cta-panel>div>div:first-child {
        display: none;
    }
    .pm-cta-panel>div>div:nth-child(2) .uk-grid {
        margin: 0;
    }
    .pm-cta-panel .el-title,
    .pm-cta-panel .el-meta {
        line-height: 1.5em;
    }
    .uk-navbar-right{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 0px;
    }
    .uk-navbar-right .uk-navbar-nav{
        order: 2;
    }
    .tm-header .uk-navbar-right .uk-navbar-item{
        width: 100%;
        justify-content: end;
        order: 1
    }
}

@media (max-width: 520px) {}

@media (max-width: 400px) {}

@media (max-width: 1020px) {
    .uk-navbar-item, .uk-navbar-nav > li > a, .uk-navbar-toggle{
        font-size: 13px;
    }
}
@media (max-width: 961px) {
    div#tm-top-slider {
        background-size: cover;
    }
    .tm-top-slider-grid {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    div#tm-top-slider .tm-top-slider-c1 {
        display: none;
    }
    .tm-video-article {
        max-width: 300px;
        margin: auto;
    }
    .tm-top-form-row .uk-button {
        display: block;
    }
    /* header (mobile) */
    .tm-header-mobile {
        height: 50px;
    }
    .tm-header-mobile .uk-navbar-container {
        height: 40px;
    }
    .tm-header-mobile .uk-logo {
        position: absolute;
        top: 3px;
        left: 10px;
    }
    .tm-header-mobile .uk-logo img,
    .tm-header-mobile .uk-logo svg {
        max-height: 60px;
        width: auto;
    }
    /* header (mobile) */
    /* Modal Contact Form (mobile) */
    /* div#tm-form-modal, */
    div#tm-dialog-mobile {
        top: 50px;
    }
    #tm-form-modal-body>div {
        display: block!important;
    }
    #tm-form-modal .pmcontact {
        padding: 20px 0;
    }
    #tm-form-modal .pmcontact .uk-grid {
        flex-direction: column;
        align-items: stretch;
    }
    #tm-form-modal .pmcontact .uk-grid>div,
    #tm-form-modal .pmcontact .uk-button {
        width: 100%;
    }
    #tm-form-modal .pmcontact .pmc-label {
        display: block!important;
        position: relative!important;
    }
    .uk-modal.uk-light .uk-input,
    .uk-modal.uk-light .uk-select,
    .uk-modal.uk-light .uk-textarea {
        background-color: rgb(5 55 97);
        border: none;
    }
    #tm-form-modal-body>h3 {
        text-align: center;
    }
    #tm-form-modal .pmcontact .pmc-label>label {
        padding: 0;
        color: #e5e5e5;
    }
    #tm-form-modal .pmcontact .pmc-field-buttons {
        margin-top: 30px;
    }
    /* Modal Contact Form (mobile) */
    .pm-cta-right {
        margin-right: auto;
    }
}

@media (max-width: 959px) {
      .uk-navbar-right {
        display: flex;
        flex-direction: unset;
        flex-wrap: unset;
        gap: 15px;
      }
}

@media (max-width: 670px) {
    .pm-cta-panel>div>div .uk-grid,
    .pm-cta-panel>div>div:nth-child(2) .uk-grid>div:nth-child(2) {
        display: block;
        text-align: center;
    }
    div#tm-grid-extended-modal .uk-modal-title {
        font-size: 26px;
    }
}

@media (max-width: 640px) {
    div#guarantee-section-item-1 h2 {
        font-size: 30px;
    }
    /* Navbar Mobile */
    #tm-dialog-mobile #module-menu-dialog-mobile a {
        min-width: unset;
    }
    .uk-button {
        /* line-height: 2em; */
    }
    .pm-footer-text-small {
        font-size: 14px;
        line-height: normal;
    }
}


/* fine-tune styles */


/* @media (min-width: 1200px) and (max-width:1300px) {} */


/* @media (min-width: 1024px) and (max-width:1200px) {} */


/* @media (min-width: 960px) and (max-width:1024px) {} */


/* @media (min-width: 764px) and (max-width:961px) {} */


/* @media (min-width: 640px) and (max-width:764px) {} */

@media (min-width: 960px) and (max-width:1200px) {
    .tm-grid-extend-item video[uk-cover] {
        position: relative;
        left: 0;
        top: 0;
        --uk-position-translate-x: unset;
        --uk-position-translate-y: unset;
        width: 100%!important;
        max-width: unset;
        height: auto!important;
    }
}

@media (min-width: 960px) and (max-width:1270px) {
    .tm-horizontal-form .pmc-field-buttons .uk-button {
        font-size: 16px;
        padding: 0 12px;
    }
    .tm-horizontal-form .uk-form-label {
        font-size: 12px;
        padding-left: 15px !important;
    }
    .tm-horizontal-form .uk-input,
    .tm-horizontal-form .uk-select,
    .tm-horizontal-form .uk-textarea {
        font-size: 12px;
    }
    div#tm-top-slider .tm-slider-title,
    div#tm-top-slider .slider-title-s2,
    div#tm-top-slider .slider-title-s1 {
        font-size: 30px;
    }
}

@media (min-width: 1270px) and (max-width:1400px) {
    div#tm-top-slider .tm-slider-title,
    div#tm-top-slider .slider-title-s2,
    div#tm-top-slider .slider-title-s1 {
        font-size: 40px;
    }
}


/* fine-tune styles end */

@media (min-width: 380px) {
    .tm-header-cta-mobile-btn .uk-button {
        font-size: 20px;
    }
}

@media (min-width: 450px) {
    .tm-header-cta-mobile-btn .uk-button {
        font-size: 24px;
    }
}


/* Small */

@media (min-width: 640px) {}


/* Medium */

@media (min-width: 960px) {
    .tm-top-form-section {
        padding-bottom: 0!important;
    }
    /* slider */
    div#tm-top-slider>.uk-section {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    div#tm-top-slider .tm-slider-title {
        margin: 0 auto 30px !important;
        text-shadow: none;
    }
    div#tm-top-slider .tm-slider-title,
    div#tm-top-slider .slider-title-s2 {
        text-transform: unset !important;
        color: #C9DCF8 !important;
        font-size: 40px;
        line-height: 1.2em;
    }
    div#tm-top-slider .slider-title-s2 {
        display: inline;
    }
    div#tm-top-slider .slider-title-s1 {
        /* text-transform: uppercase !important; */
        color: #fff!important;
        font-size: 52px;
        display: block
    }
    .tm-top-slider-grid {
        flex-wrap: nowrap;
    }
    .tm-top-slider-grid>div:nth-child(2) {
        width: 600px !important;
    }
    .tm-top-slider-grid>div:nth-child(3) {
        width: auto!important;
        flex-grow: 0;
    }
    /* div#tm-top-slider>div>div.uk-container-expand-left {
        padding: 0;
    } */
    div#tm-top-slider .uk-container-expand-left {
        padding: 0;
    }
    div#tm-top-slider .uk-container-expand-left,
    div#tm-top-slider .uk-container-expand-right {
        max-width: calc(50% + (1370px / 2));
    }
    .tm-slider-video {
        padding: 35px 0;
    }
    /* slider */

    #tm-top-slider.add-truck .tm-top-slider-grid:before {
        content: "";
        width: 761px;
        height: 430px;
        background: url("/images/plumbing/truck-3-w-shadow.png");
        z-index: 5;
        position: absolute;
        right: calc(100% * 3 / 4.000);
        top: 40px;
        background-size: contain;
        background-repeat: no-repeat;
    }
    #tm-top-slider.add-truck .tm-top-slider-grid {
        position: relative;
    }
    .tm-wave-section-2 > div {
        margin-top: -100px;
    }
}


/* Large */

@media (min-width: 1200px) {}

@media (min-width: 1400px) {
    div#tm-top-slider .tm-top-slider-c3 video {
        width: 350px;
    }
    div#tm-top-slider .tm-top-slider-c3 {
        padding-top: 25px;
        padding-bottom: 25px;
    }
    div#tm-top-slider>div>div.uk-container-expand-left {
        padding: 0;
    }
    div#tm-top-slider .tm-slider-title,
    div#tm-top-slider .slider-title-s2 {
        font-size: 48px;
    }
    div#tm-top-slider .slider-title-s1 {
        font-size: 64px;
        line-height: 1em;
    }
    div#tm-top-slider .tm-top-slider-c1,
    div#tm-top-slider .tm-top-slider-c3 {
        min-width: 410px;
    }
    #tm-top-slider.add-truck .tm-top-slider-grid:before {
        right: calc(100% * 3 / 4.400);
        width: 550px;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: right;
    }
}


/* Xlarge */

@media (min-width: 1600px) {
    .tm-wave-section-2 > div {
        margin-top: -200px;
    }
}

@media (min-width: 1600px) {}


@-webkit-keyframes slide-in-blurred-tl {
    0% {
      -webkit-transform: translate(-1000px, -100px) skew(10deg, 10deg);
              transform: translate(-1000px, -100px) skew(10deg, 10deg);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translate(0, 0) skew(0deg, 0deg);
              transform: translate(0, 0) skew(0deg, 0deg);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-blurred-tl {
    0% {
      -webkit-transform: translate(-1000px, -100px) skew(10deg, 10deg);
              transform: translate(-1000px, -100px) skew(10deg, 10deg);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translate(0, 0) skew(0deg, 0deg);
              transform: translate(0, 0) skew(0deg, 0deg);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }