@charset "UTF-8";
/* 
Theme Name: Design Rangers - Hello Elementor Child Theme
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/
/********************* Atoms – Variables, Typography, Buttons, Body Copy Etc. *********************/
/****************************************

ATOMS

Atoms are the smallest core component of any design and are combined to make most elements in the site.

Table of Contents

1. VARIABLES
2. TYPOGRAPHY
3. ANIMATION
4. LINKS
5. BUTTONS
6. DIVIDERS

*****************************************/
/*********************

1. VARIABLES

*********************/
:root {
  --base-font-size: 18px;
  --base-line-height: 1.8em;
}

:root {
  --base-text-color: var(--e-global-color-primary);
  --base-accent-color: #B15533;
  --base-link-color: var(--e-global-color-7ede5130);
  --base-hover-color: var(--e-global-color-409d6c5);
  --base-divider-color: var(--e-global-color-527f85ff);
  --scooped-corner-base-padding: 48px;
  --scoop-radius: 24px;
  --north-pole-red: #EB4E3C;
  --north-pole-green-dark: #1A3F1F;
  --north-pole-green-light: #06864A;
  --north-pole-blue-medium: #3A6976;
  --north-pole-blue-light: #F0F8FA;
}
@media(max-width: 767px) {
  :root {
    --scooped-corner-base-padding: 32px;
    --scoop-radius: 16px;
  }
}

/*********************

2. TYPOGRAPHY

Baseline typography in Elementor is based on a 1.25 type scale:
https://www.modularscale.com/?16&px&1.25

*********************/
.elementor-widget-heading h1 {
  margin-bottom: 8px;
}
@media (max-width: 767px) {
  .elementor-widget-heading h1 {
    margin-bottom: 4px;
  }
}
.elementor-widget-heading h2 {
  margin-bottom: 8px;
}
@media (max-width: 767px) {
  .elementor-widget-heading h2 {
    margin-bottom: 4px;
  }
}
.elementor-widget-heading h3 {
  margin-bottom: 0;
}
.elementor-widget-heading h4 {
  margin-bottom: 0;
}
.elementor-widget-heading h5 {
  margin-bottom: 0;
}

.elementor-widget-text-editor ul, .elementor-widget-text-editor ol {
  margin-bottom: 32px;
}

/*********************

3. ANIMATION

Default animation properties.

*********************/
li.elementor-icon-list-item .elementor-icon-list-icon, li.elementor-icon-list-item, .elementor-button-c-warning .elementor-button:after, .elementor-button-c-info .elementor-button, .elementor-widget-button .elementor-button {
  transition: all 0.5s ease;
}

/*********************

4. LINKS

This could include any type of special links or link overrides.

*********************/
/*********************

5. BUTTONS

*********************/
.elementor-widget-button .elementor-button:hover, .seeallrides:hover {
  background: var(--e-global-color-409d6c5);
	font-weight:bold!important;
}

.elementor-button-c-info .elementor-button {
  background: transparent;
  border-bottom: 1.5px solid var(--e-global-color-7ede5130);
  color: var(--e-global-color-7ede5130);
  font-family: var( --e-global-typography-accent-font-family ), Sans-serif;
  font-size: var( --e-global-typography-accent-font-size );
  font-weight: var( --e-global-typography-accent-font-weight );
  text-decoration: var( --e-global-typography-accent-text-decoration );
  padding: 12px 24px;
}
.elementor-button-c-info .elementor-button:hover {
  background: transparent;
  color: var(--e-global-color-409d6c5);
  border-bottom: 1.5px solid var(--e-global-color-409d6c5);
}

.elementor-button-c-success .elementor-button {
  font-weight: bold;
  fill: var(--base-link-color);
  color: var(--base-link-color);
  background-color: transparent;
  border-style: dotted;
  border-width: 0 0 2px;
  border-color: transparent;
  padding: 8px 0;
  position: relative;
}
.elementor-button-c-success .elementor-button:hover {
  background: transparent;
  border-color: var(--base-link-color);
}

.elementor-button-c-warning .elementor-button {
  fill: var(--base-link-color);
  color: var(--base-link-color);
  background-color: transparent;
  border-style: dotted;
  border: none;
  padding: 8px 0;
  position: relative;
}
.elementor-button-c-warning .elementor-button:hover {
  color: var(--base-link-color);
  background: transparent;
}
.elementor-button-c-warning .elementor-button:hover:after {
  right: -24px;
}
.elementor-button-c-warning .elementor-button:after {
  content: "";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translatey(-50%);
}

.elementor-button-c-danger .elementor-button {
  border: 1px solid var(--base-link-color);
  border-radius: 4px;
  background-color: transparent;
  color: var(--base-link-color);
  padding: 4px 8px;
  font-size: 0.8em;
  font-weight: normal;
  letter-spacing: 0.2;
  text-transform: uppercase;
}
.elementor-button-c-danger .elementor-button:hover {
  background: var(--base-link-color);
  color: #fff;
}

/****************************************

6. DIVIDERS

*****************************************/
hr {
  color: var(--base-divider-color);
  padding-top: 8px;
  padding-bottom: 8px;
}

.elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon) .elementor-divider-separator {
  border-top: var(--divider-border-width) var(--divider-border-style) var(--base-divider-color);
}

/********************* Design Rangers Elementor Spacing *********************/
/****************************************

SECTION PADDING – DEFAULTS
Default padding for sections.

*****************************************/
:root {
  --section-padding-side: 24px;
  --section-padding-default: 96px;
  --section-padding-small: 48px;
  --section-padding-medium: 160px;
  --section-padding-large: 200px;
  --section-padding-xl: 280px;
  --section-padding-xxl: calc(280px + 5%);
}
@media (max-width: 1023px) {
  :root {
    --section-padding-default: 80px;
    --section-padding-small: 36px;
    --section-padding-medium: 96px;
    --section-padding-large: 160px;
    --section-padding-xl: 200px;
    --section-padding-xxl: calc(200px + 5%);
  }
}
@media (max-width: 767px) {
  :root {
    --section-padding-default: 32px;
    --section-padding-small: 24px;
    --section-padding-medium: 32px;
    --section-padding-large: 32px;
    --section-padding-xl: 32px;
    --section-padding-xxl: 32px;
  }
}

.section-pbxxl, .section-pbxl, .section-pbl, .section-pbm, .section-pbs, .section-pbn, .section-ptxxl, .section-ptxl, .section-ptl, .section-ptm, .section-pts, .section-ptn {
  padding-left: var(--section-padding-side);
  padding-right: var(--section-padding-side);
}

.section-default-pad {
  padding: var(--section-padding-default) 24px;
}

/****************************************

SECTION PADDING – TOP
Used to change default spacing on sections.
Applied by using custom dropdown elements added to Elementor sections.

*****************************************/
.section-ptn {
  padding-top: 0px !important;
}

.section-pts {
  padding-top: var(--section-padding-small);
}

.section-ptm {
  padding-top: var(--section-padding-medium);
}

.section-ptl {
  padding-top: var(--section-padding-large);
}

.section-ptxl {
  padding-top: var(--section-padding-xl);
}

.section-ptxxl {
  padding-top: var(--section-padding-xxl);
}

.elementor-section.elementor-inner-section {
  padding-left: 0;
  padding-right: 0;
}

/****************************************

SECTION PADDING – BOTTOM
Used to change default spacing on sections.
Applied by using custom dropdown elements added to Elementor sections.

*****************************************/
.section-pbn {
  padding-bottom: 0px !important;
}

.section-pbs {
  padding-bottom: var(--section-padding-small);
}

.section-pbm {
  padding-bottom: var(--section-padding-medium);
}

.section-pbl {
  padding-bottom: var(--section-padding-large);
}

.section-pbxl {
  padding-bottom: var(--section-padding-xl);
}

.section-pbxxl {
  padding-bottom: var(--section-padding-xxl);
}

/****************************************

ELEMENTOR COLUMN GAPS

*****************************************/
:root {
  --column-gap-default: 24px;
  --column-gap-narrow: 16px;
  --column-gap-extended: 32px;
  --column-gap-wide: 64px;
  --column-gap-wider: 128px;
}
@media (max-width: 1023px) {
  :root {
    --column-gap-default:16px;
  }
}
@media (max-width: 767px) {
  :root {
    --column-gap-default:24px 0;
    --column-gap-narrow: 24px 0;
    --column-gap-extended: 24px 0;
    --column-gap-wide: 24px 0;
    --column-gap-wider: 24px 0;
  }
}

.elementor-column-gap-default > .elementor-row > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
  padding: var(--column-gap-default);
}

.elementor-column-gap-narrow > .elementor-row > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
  padding: var(--column-gap-narrrow);
}

.elementor-column-gap-extended > .elementor-row > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
  padding: var(--column-gap-extended);
}

.elementor-column-gap-wide .elementor-row > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
  padding: var(--column-gap-wide);
}

.elementor-column-gap-wider > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
  padding: var(--column-gap-wider);
}

/********************* Helper Classes *********************/
/****************************************

HELPER CLASSES

Helper classes are common, global classes that can be applied to elements to change their behavior.
These are typically items that we would apply multiple times throughout a project.

Table of Contents

1. TYPOGRAPHY
2. MARGINS
3. COLUMN PADDING
4. COLUMN CARDS
5. CARD WRAP

*****************************************/
/****************************************

1. TYPOGRAPHY

Helper classes to help control text sizes and line width.

*****************************************/
/**** SMALLER BODY FONT ****/
.text-small p, p.text-small{
  font-size: 0.888em;
  line-height: 1.8;
}
@media (max-width: 767px) {
  .text-small p, p.text-small {
    font-size: 1em;
  }
}

/**** LARGER BODY FONT FOR INTRO TEXT ****/
.text-large p {
  font-size: 1.25em;
  line-height: 1.8;
}
@media (max-width: 767px) {
  .text-large p {
    font-size: 1em;
  }
}

/**** NARROW TEXT – DECREASE LINE WIDTH FOR BETTER READABILITY ****/
.text-narrow {
  max-width: 800px;
}

/**** NARROW TEXT CENTERED – CENTER THE TEXT WIDGET ****/
.text-narrow-centered {
  max-width: 800px;
  margin: 0 auto;
}

/****************************************

2. MARGINS

Classes to add or remove margin below headlines and text globally.

m = margin
t = top
r = right
b = bottom
l = left

Example: mbn = Margin Bottom None

*****************************************/
.mbn, .mbn.elementor-widget, .mbn.elementor-widget:not(:last-child), .mbn h1, .mbn h2, .mbn h3, .mbn h4, .mbn h5, .mbn h6, .mbn p {
  margin-bottom: 0 !important;
}

.mbs, .mbs.elementor-widget, .mbs h1, .mbs h2, .mbs h3, .mbs h4, .mbs h5, .mbs h6, .mbs p {
  margin-bottom: 8px;
}

.mbm, .mbm.elementor-widget, .mbm h1, .mbm h2, .mbm h3, .mbm h4, .mbm h5, .mbm h6, .mbm p {
  margin-bottom: 16px;
}

.mbl, .mbl.elementor-widget {
  margin-bottom: 24px;
}

.mbxl, .mbxl.elementor-widget {
  margin-bottom: 48px;
}

@media (max-width: 1023px) {
  .mbl, .mbl.elementor-widget {
    margin-bottom: 16px;
  }

  .mbxl, .mbxl.elementor-widget {
    margin-bottom: 24px;
  }
}
/****************************************

3. COLUMN PADDING

Adds extra padding on all sides of a column globally.
Perfect for text that sits next to an image or columns that just need extra breathing room.

*****************************************/
:root {
  --column-padding-large: 64px;
  --column-padding-xl: 96px;
}
@media (max-width: 1023px) {
  :root {
    --column-padding-large:32px;
    --column-padding-xl: 32px;
  }
}
@media (max-width: 767px) {
  :root {
    --column-padding-large:24px 0;
    --column-padding-xl: 24px 0;
  }
}

.padding-large .elementor-column-wrap.elementor-element-populated {
  padding: var(--column-padding-large);
}

.padding-xl .elementor-column-wrap.elementor-element-populated {
  padding: var(--column-padding-xl);
}

/****************************************

4. COLUMN CARDS

Helper classes applied to Elementor columns to make them appear as cards.

*****************************************/
.elementor-container > .elementor-column.card > .elementor-element-populated {
  background: #fff;
  border: 1px solid #D2D1CC;
  border-radius: 10px;
}

.elementor-column-gap-default.elementor-container > .elementor-column.card > .elementor-element-populated {
  margin: 24px;
  padding: 48px;
}
@media (max-width: 1023px) {
  .elementor-column-gap-default.elementor-container > .elementor-column.card > .elementor-element-populated {
    margin: 16px;
    padding: 24px;
  }
}
@media (max-width: 767px) {
  .elementor-column-gap-default.elementor-container > .elementor-column.card > .elementor-element-populated {
    margin: 24px 0;
    padding: 32px;
  }
}

.elementor-column-gap-narrow.elementor-container > .elementor-column.card > .elementor-element-populated {
  margin: 8px;
  padding: 32px;
}
@media (max-width: 1023px) {
  .elementor-column-gap-narrow.elementor-container > .elementor-column.card > .elementor-element-populated {
    margin: 8px;
    padding: 24px;
  }
}
@media (max-width: 767px) {
  .elementor-column-gap-narrow.elementor-container > .elementor-column.card > .elementor-element-populated {
    margin: 8px 0;
    padding: 24px;
  }
}

.elementor-column-gap-default.elementor-container > .elementor-column.card > .elementor-element-populated .elementor-widget-image, .elementor-column-gap-narrow > .elementor-container > .elementor-column.card > .elementor-element-populated .elementor-widget-image {
  margin: -16px -16px 24px -16px;
  width: calc(100% + 32px);
}

/****************************************

5. CARD WRAP

Allow new columns set as cards to wrap to the next row instead of adding additional columns to the same row using Flexbox.
.section-card-wrap is applied to the container and column width (ex. .two-col) can be applied to each column.

*****************************************/
.section-card-wrap .elementor-container {
  flex-wrap: wrap;
}

.one-col {
  flex: 0 0 100%;
}
@media (max-width: 1023px) {
  .one-col {
    flex: 0 0 100%;
  }
}

/**** Two column cards – 50% width ****/
.two-col {
  flex: 0 1 50%;
}
@media (max-width: 1023px) {
  .two-col {
    flex: 0 1 50%;
  }
}
@media (max-width: 767px) {
  .two-col {
    flex: 0 0 100%;
  }
}

/**** Three column cards – 33.333% width ****/
.three-col {
  flex: 0 1 33.333%;
}
@media (max-width: 1023px) {
  .three-col {
    flex: 0 1 33.333%;
  }
}
@media (max-width: 767px) {
  .three-col {
    flex: 0 0 100%;
  }
}

/**** Three column cards – 25% width ****/
.four-col {
  flex: 0 1 25%;
}
@media (max-width: 1023px) {
  .four-col {
    flex: 0 1 25%;
  }
}
@media (max-width: 767px) {
  .four-col {
    flex: 0 0 100%;
  }
}

/********************* Elementor Widgets *********************/
/****************************************

ELEMENTOR WIDGETS

Global settings to override default Elementor widget styles.

Table of Contents

1. ICON LISTS
2. TOGGLES AND ACCORDIONS

*****************************************/
/****************************************

1. ICON LISTS


.elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child) {
  padding-bottom: 0;
}

.elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child) {
  margin-top: 0;
}

li.elementor-icon-list-item {
  padding: 24px;
  display: flex;
  border-top: 0.5px solid var(--base-divider-color);
}
li.elementor-icon-list-item:first-child {
  border-top: none;
}
li.elementor-icon-list-item a {
  color: var(--base-link-color);
}
li.elementor-icon-list-item a:hover {
  color: var(--base-hover-color);
}
li.elementor-icon-list-item i {
  color: var(--base-accent-color);
}
li.elementor-icon-list-item .elementor-icon-list-icon {
  padding: 16px;
  height: 100%;
  display: inline-block;
  text-align: center;
  align-self: center;
}
@media (max-width: 1023px) {
  li.elementor-icon-list-item .elementor-icon-list-icon {
    margin: -8px 0;
  }
}
@media (max-width: 767px) {
  li.elementor-icon-list-item .elementor-icon-list-icon {
    margin: 0px;
    padding: 16px;
  }
}
li.elementor-icon-list-item .elementor-icon-list-text {
  padding-left: 16px !important;
  padding-top: 16px;
  padding-bottom: 16px;
  border-left: 0.5px solid var(--base-divider-color);
  transition: ease all 0.5s;
}
li.elementor-icon-list-item:hover {
  transition: scale(1.1);
}

*****************************************/
/****************************************

2. TOGGLES & ACCORDION ELEMENTS

*****************************************/
.elementor-toggle .elementor-tab-title {
  padding: 16px;
  border-bottom: 1px solid var(--base-divider-color);
}

.elementor-accordion .elementor-accordion-item {
  border-color: var(--base-divider-color);
}
.elementor-accordion .elementor-accordion-item .elementor-tab-title {
  padding: 16px;
}
.elementor-accordion .elementor-accordion-item .elementor-tab-title a {
  color: var(--base-text-color);
}
.elementor-accordion .elementor-accordion-item .elementor-tab-title .elementor-accordion-icon {
  color: var(--base-text-color);
}
.elementor-accordion .elementor-accordion-item .elementor-active a, .elementor-accordion .elementor-accordion-item .elementor-accordion-icon-opened {
  color: var(--base-link-color);
}
@media(max-width: 767px) {
  .elementor-toggle-icon svg {
    width: 20px;
    height: 20px
  }
}

/********************* Theme Specific Custom Styling *********************/
/****************************************

CUSTOM CSS

Custom CSS for any additoinal global site attributes.

*****************************************/



/*********** RIDES GRID ************/

.np-ride-grid .pp-post.pp-grid-item {
    background: #F0F8FA;
}
.elementor-widget-wrap>.elementor-element.np-ride-closed {
    background: rgba(0,0,0,0.6);
    position: absolute;
    height: calc(100% + 96px);
    width: calc(100% + 96px);
    left: -48px;
    top: -48px;
    z-index: 100;
}
@media(max-width: 1024px) {
    .elementor-widget-wrap>.elementor-element.np-ride-closed {
        position: absolute;
        height: calc(100% + 64px);
        width: calc(100% + 64px);
        left: -32px;
        top: -32px;
    }   
}
h6.np-closed-message {
    position: absolute;
    background: #EB4E3C;
    color: #fff;
    width: 100%;
    top: 50%;
    font-size: 16px;
    letter-spacing: 0.04em;
    font-weight: 700;
    text-transform: uppercase;
    padding: 8px 24px;
    top: 8px;
    text-align: center;
    top: 50%;
     left: 50%;
    transform: translate(-50%, -50%) rotate(-2deg);
    width: 102%;
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
}


/***********

SCOOPED CORNERS – ADAPTED FROM THE FOLLOWING SOURCE:
https://codepen.io/MisterCurtis/pen/ExKPOYZ

************/

.scooped-corners > .elementor-column-wrap > .elementor-widget-wrap {

  --border-width: 2px;
  --border-color: var(--north-pole-red);
  --background-color: rgba(255,255,255,0);
  --border-stop: calc(var(--scoop-radius) + var(--border-width));
  --scoop-gradient: rgba(255, 255, 255, 0) var(--scoop-radius),
      var(--border-color) calc(var(--scoop-radius) + 1px),
      var(--border-color) var(--border-stop),
      var(--background-color) calc(var(--border-stop) + 1px);
  padding: var(--scooped-corner-base-padding);
  background: var(--background-color);
  background: radial-gradient(circle at 0 0, var(--scoop-gradient)) top left, radial-gradient(circle at 100% 0, var(--scoop-gradient)) top right, radial-gradient(circle at 100% 100%, var(--scoop-gradient)) bottom right, radial-gradient(circle at 0 100%, var(--scoop-gradient)) bottom left;
  background-size: 50% 50%;
  background-repeat: no-repeat;
  background-image: linear-gradient(to bottom, var(--border-color) 0, var(--border-color) var(--border-width)), linear-gradient(to left, var(--border-color) 0, var(--border-color) var(--border-width)), linear-gradient(to top, var(--border-color) 0, var(--border-color) var(--border-width)), linear-gradient(to right, var(--border-color) 0, var(--border-color) var(--border-width)), radial-gradient(circle at 0 0, var(--scoop-gradient)), radial-gradient(circle at 100% 0, var(--scoop-gradient)), radial-gradient(circle at 100% 100%, var(--scoop-gradient)), radial-gradient(circle at 0 100%, var(--scoop-gradient)), linear-gradient(to right, var(--background-color) 0, var(--background-color) 1px), linear-gradient(to right, var(--background-color) 0, var(--background-color) 1px);
  background-position: top center, right center, bottom center, left center, top left, top right, bottom right, bottom left, top center, left center;
  background-size: calc(100% - (var(--scoop-radius) + 1px) * 2) var(--border-width), var(--border-width) calc(100% - (var(--scoop-radius) + 1px) * 2), calc(100% - (var(--scoop-radius) + 1px) * 2) var(--border-width), var(--border-width) calc(100% - (var(--scoop-radius) + 1px) * 2), var(--border-stop) var(--border-stop), var(--border-stop) var(--border-stop), var(--border-stop) var(--border-stop), var(--border-stop) var(--border-stop), calc(100% - var(--border-stop) * 2) 100%, 100% calc(100% - var(--border-stop) * 2);
}
.scooped-corners.border-red .elementor-column-wrap .elementor-widget-wrap {
  --border-color: var(--north-pole-red);
}
.scooped-corners.border-green .elementor-column-wrap .elementor-widget-wrap {
  --border-color: var(--north-pole-green-light);
}
.scooped-corners.border-blue .elementor-column-wrap .elementor-widget-wrap {
  --border-color: var(--north-pole-blue-medium);
}
.scooped-corners.border-light-blue .elementor-column-wrap .elementor-widget-wrap {
  --border-color: var(--north-pole-blue-light);
}


.s-relative{
	position:relative;
}
.border-shape-top:before {
    content: '';
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%!important;
    height: 100px;	
    background: url(https://northpolecolorado.com/wp-content/uploads/2021/03/divider-shape-top.svg) no-repeat;
    background-position: -10px top;
}
.border-shape-bottom:after{
    content: '';
    position: absolute;
    bottom: -30px;
    left: 0px;
    width: 100%!important;
    height: 100px;	
    background: url(https://northpolecolorado.com/wp-content/uploads/2021/03/divider-shape-bottom.svg);
	background-size: auto 100%;
}

.dropdown {
  position: relative; 
}
.u-rides .elementor-image-box-content {
    z-index: 9;
}
.dropdown .dropdown-content {
  display: none;
  position: absolute;
  background-color: var( --e-global-color-13cb6f2 );

  box-shadow: 0px 8px 40px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 99999;
  top: 60px;
	max-width: 380px!important;
	min-width: 380px!important;
	width:100%;
  left: -50%;
}
.dropdown .dropdown-content:after{
    content: '';
    position: absolute;
    right: 20px;
    top: -15px;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid var( --e-global-color-13cb6f2 );
    clear: both;
}
table.mabel-bhi-businesshours{
	margin-top:20px;
}
table.mabel-bhi-businesshours tr, table.mabel-bhi-businesshours td {
    padding: 0px!important;
    color: var(--e-global-color-secondary);
    border: 0px;
    background: transparent!important;
}
.dropdown:hover .dropdown-content {
  display: block;
}
strong{
	font-weight:800;
}

.a-hover a{
	color:#fff;
}
.a-hover a:hover{
	color:var( --e-global-color-409d6c5 )!important;
}
.u-rides .elementor-image-box-content{
	    padding-top: 39px!important;
}
.social-menu ul a {
    padding: 0 0 20px;
}
.social-menu ul i {
    background: var( --e-global-color-772fb91 );;
    padding: 0px;
    border-radius: 50%;
    margin-right: 10px;
    color:var( --e-global-color-9dd8733 );
    width: 25px!important;
    height: 25px!important;
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
	font-size:18px!important;
}
.plan-trip .elementor-widget-container {
    height: 60px!important;
    width: 60px!important;
    display: flex!important;
    justify-content: center;
    align-items: center;
}
body #splw-location-weather-pro-962.splw-main-wrapper {
	margin-bottom: 0;
}
.splw-pro-header {
    display: none!important;
}
.splw-pro-wrapper .splw-pro-current-temp span.cur-temp{
	font-size: 20px!important;
    line-height: 50px!important;
    font-weight: 400!important;
	font-family: "basic-sans", Sans-serif!important;
	display: inline-block;
	margin-left: 8px;
}
.splw-pro-wrapper .splw-pro-current-temp,
.splw-pro-wrapper .splw-pro-body,
.splw-pro-wrapper,
.splw-pro-current-text,
#splw-location-weather-962{
    margin: 0!important;
    padding: 0!important;
}
/*HomePage Dozen Rides */
.dozen-rides img {
    height: 71vh;
    object-fit: cover;
}
@media(max-width: 1024px) {
  .dozen-rides img {
      height: 420px;
      object-fit: cover;
  }
}
@media(max-width: 767px) {
  .dozen-rides img {
      height: 320px;
      object-fit: cover;
  }
}
.elementor-swiper-button-next i,
.elementor-swiper-button-prev i{
	display:none;
}
.elementor-swiper-button-next,
.elementor-swiper-button-prev{
    height: 40px;
    width: 40px;
    background-size: 15px !important;
    background-position: center center!important;
    border-radius: 2px;
}
.elementor-swiper-button:hover{
	background-color:var(--e-global-color-409d6c5)!important;
}
.elementor-swiper-button-next{
	background:url(https://northpolecolorado.com/wp-content/uploads/2021/03/next-icon.svg) no-repeat;
}
.elementor-swiper-button-prev{
	background:url(https://northpolecolorado.com/wp-content/uploads/2021/03/previous-icon.svg) no-repeat;
}
.rotate-left, .rotate-right{
	overflow:hidden!important
}
.rotate-left .rotate-img .elementor-widget-container {
    transform: rotate(-3deg);
    width: 90%;
    margin: auto;
	border:20px solid var( --e-global-color-772fb91 );
}
.rotate-right .rotate-img .elementor-widget-container {
    transform: rotate(3deg);
    width: 90%;
    margin: auto;
	border:20px solid var( --e-global-color-772fb91 );
}
.img-position-left img {
    object-position: 28%;
}

.slider-explore .swiper-slide-contents{
	background-color:var(--e-global-color-13cb6f2);
	padding:30px;
	display: flex;
    flex-direction: column;
	min-height:300px!important;
}
.slider-history .swiper-slide-contents {
    background-color: rgba(255,255,255,.8);
    padding: 30px;
}
.s-relative .elementor-column-wrap.elementor-element-populated {
    background-size: 100% 100%!important;
}
.s-overflow{
	overflow:hidden;
}
@media(max-width:1436px){
	.slider-explore .swiper-slide-contents{
		min-height:340px!important;
	}
}
@media(max-width:1308px){
	.slider-explore .swiper-slide-contents{
		min-height:360px!important;
	}
	.slider-explore .swiper-slide{
		min-height:600px!important;
	}
}
@media(max-width:1229px){
	.slider-explore .swiper-slide-contents{
		min-height:380px!important;
	}
}
@media(max-width:1142px){
	.slider-explore .swiper-slide-contents{
		min-height:410px!important;
	}

}
@media(max-width:1058px){
	.slider-explore .swiper-slide-contents{
		min-height:500px!important;
	}
	.slider-explore .swiper-slide{
		min-height:650px!important;
	}
}
@media (min-width:767px){
	.slider-explore .swiper-slide {
    width: 48%!important;
    margin-right: 2%;
	}
	.slider-explore .elementor-slide-description {
    min-height: 180px!important;
}
	.menu-btn a{
		margin-left:20px;
	}
}
.slider-explore .swiper-slide-bg {
	background-position: top!important;
}
.slider-explore .elementor-swiper-button{
    top: 104%;
    background-color: var( --e-global-color-7ede5130 );
    background-position: center;
	width: 40px;
    height: 40px;
}
.slider-explore .elementor-swiper-button-prev {
    right: 70px!important;
    left: unset!important;
}
.slider-history .elementor-swiper-button {
    background-color: var( --e-global-color-7ede5130 );
    background-position: center;
	width: 40px;
    height: 40px;
}
.swiper-slide-bg {
    background-position: 15%!important;
}
.svg-bordeline {
    background-size: 97% 100% !important;
}
.svg-bordelinefull{
    background-size: 97% 90% !important;
}

@media (min-width:1025px){
.columns100 .elementor-row{
	flex-direction: column;
}
	.columns100 .elementor-column{
	width:100%!important
}
}


@media (max-width:1024px){

	.border-corner {
    max-width: 656px;
    margin: auto;
}
	.double-border-corner:after, .border-corner:after {
display:none;
	}
		.slider-history .swiper-slide-bg {
    background-size: cover!important;
}
	.slider-explore .swiper-slide-contents{
		min-height:360px!important;
	}
	.slider-explore .swiper-slide{
		min-height:600px!important;
	}
}
@media (max-width:774px){
		.slider-explore .swiper-slide-contents{
		min-height:380px!important;
	}
}
@media (max-width:767px){
/*li.menu-item-986 {
	display: block;}*/
	.header-color{
		background-color: var( --e-global-color-13cb6f2 )!important;
	}
	.border-corner-blue:after{
		display: none;
	}
	.border-corner-blue.footers {
    max-width: 435px!important;
}
	.dropdown .dropdown-content{
		max-width: 300px!important;
    max-height: 500px!important;
        width: 100%;
        left: 0%;
	}
	.slider-explore .swiper-slide-inner{
		align-items: flex-end;
		padding:0px!important;
	}
		.slider-explore .swiper-slide-contents{
		background-color:var(--e-global-color-13cb6f2);
			padding: 20px;
	}

.slider-explore .swiper-wrapper.elementor-slides {
transform: none!important;
}
.slider-explore .swiper-wrapper, 
.slider-explore .swiper-slide-contents {
display: block!important;
}
.slider-explore .elementor-swiper-button {
    display: none;
}
.slider-explore .swiper-slide{
    margin-bottom:30px!important;
    max-width:95%!important;
    margin:auto;
}
.svg-bordeline {
    background-size: 97% 90% !important;
}
	.slider-explore .swiper-slide-contents{
		min-height:200px!important;
	}
	.slider-explore .swiper-slide{
		min-height:500px!important;
	}
}