/*----------------------*/
/*===== VARIABLES =====*/
/*--------------------*/


:root {
    /* Brand Green */
    --primary-green-600: rgba(2, 37, 38, 1);
    --primary-green-500: rgba(2, 61, 66, 1); 
    --primary-green-400: rgba(0, 79, 89, 1); /* Main Shade */
    --primary-green-300: rgba(9, 100, 107, 1);
    --primary-green-200: rgba(23, 129, 132, 1);
    --primary-green-100: rgba(58, 163, 163, 1);

    /* Heading & Text */
    --headings-copy-600: rgba(0, 43, 56, 1);
    --headings-copy-500: rgba(0, 65, 84, 1);
    --headings-copy-400: rgba(0, 86, 112, 1); /* Main Shade */
    --headings-copy-300: rgba(8, 111, 135, 1);
    --headings-copy-200: rgba(19, 143, 163, 1);
    --headings-copy-100: rgba(39, 189, 204, 1);

    /* Brand Orange */
    --accent-orange-600: rgba(191, 78, 22, 1);
    --accent-orange-500: rgba(226, 104, 36, 1);
    --accent-orange-400: rgba(255, 138, 61, 1); /* Main Shade */
    --accent-orange-300: rgba(255, 150, 92, 1);
    --accent-orange-200: rgba(252, 174, 134, 1);
    --accent-orange-100: rgba(244, 202, 184, 1);

    /*----- Secondary Colors -----*/
    /* Pink */
    --pink-600: rgba(201, 44, 40, 1);
    --pink-500: rgba(234, 73, 61, 1);
    --pink-400: rgba(250, 103, 85, 1); /* Main Shade */
    --pink-300: rgba(252, 135, 126, 1);
    --pink-200: rgba(252, 164, 153, 1);
    --pink-100: rgba(253, 194, 187, 1);

    /* Cyan */
    --cyan-600: rgba(27, 189, 206, 1);
    --cyan-500: rgba(103, 214, 232, 1);
    --cyan-400: rgba(161, 237, 255, 1); /* Main Shade */
    --cyan-300: rgba(199, 244, 255, 1);
    --cyan-200: rgba(217, 248, 255, 1);
    --cyan-100: rgba(236, 251, 255, 1);

    /* Yellow */
    --yellow-600: rgba(211, 180, 47, 1);
    --yellow-500: rgba(237, 213, 112, 1);
    --yellow-400: rgba(250, 229, 145, 1); /* Main Shade */
    --yellow-300: rgba(251, 234, 167, 1);
    --yellow-200: rgba(252, 239, 189, 1);
    --yellow-100: rgba(253, 245, 211, 1);

    /* Light Green */
    --light-green-600: rgba(20, 193, 143, 1);
    --light-green-500: rgba(77, 226, 187, 1);
    --light-green-400: rgba(124, 255, 225, 1); /* Main Shade */
    --light-green-300: rgba(176, 255, 237, 1);
    --light-green-200: rgba(203, 255, 243, 1);
    --light-green-100: rgba(229, 255, 249, 1);

    /* Dark Green */
    --dark-grean-600: rgba(125, 173, 56, 1);
    --dark-green-500: rgba(165, 216, 100, 1);
    --dark-green-400: rgba(196, 242, 143, 1); /* Main Shade */
    --dark-green-300: rgba(220, 247, 188, 1);
    --dark-green-200: rgba(231, 250, 210, 1);
    --dark-green-100: rgba(243, 252, 233, 1);

    /* Brown */
    --brown-600: rgba(129, 113, 78, 1);
    --brown-500: rgba(168, 157, 133, 1);
    --brown-400: rgba(247, 244, 237, 1); /* Main Shade */
}

input
{
    outline:none;
}
input:focus
{
    box-shadow: 0 0 5px rgba(40, 218, 155, 1);
    border: 1.6px solid #28DA9B;
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button 
{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}

/*----------------------*/
/*===== CSS RESET =====*/
/*--------------------*/


/* Box sizing rules */
/* *,
*::before,
*::after {
  box-sizing: border-box;
} */


html {
    scroll-behavior: smooth;
    scroll-padding-top: 10vw;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}
*{
    
    text-rendering: geometricPrecision !important;
    -webkit-font-smoothing: antialiased;
    -webkit-font-smoothing: subpixel-antialiased;
}
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
  overflow-x: hidden;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
  height: auto;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
   scroll-behavior: auto;
  }
  
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/*----------------------------*/
/*===== UTILITY CLASSES =====*/
/*--------------------------*/




/* Paddings */

.base-padding {
    padding: 0% 5% 0% 5%;
}
.base-padding-left
{
    padding-left:5%;
}
.base-padding-right
{
    padding-right:5%;
}
.p-0 {
    padding: 0;
}

.pt-0 {
    padding-top: 0;
}
.ptb-2
{
    padding-top:2%;
    padding-bottom:2%;
}
.pt-3
{
    padding-top:3%;
}
.pb-0 {
    padding-bottom: 0;
}

.p-2 {
    padding: 2%;
}

.p-5 {
    padding: 5%;
}

.px-0 {
    padding-right: 0;
    padding-right: 0;
}

.py-0 {
    padding-top: 0;
    padding-bottom: 0;
}

/* Margins */

.base-margin {
    margin: 0% 5% 0% 5%;
}
.base-margin-left
{
    margin-left:5%;
}
.base-margin-right
{
    margin-right:5%;
}

.m-0 {
    margin: 0;
}

.mt-0 {
    margin-top: 0;
}

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

.m-2 {
    margin: 2%;
}

.mt-2 {
    margin-top: 2%;
}

.mb-2 {
    margin-bottom: 2%;
}

.m-5 {
    margin: 5%;
}

.mx-0 {
    margin-right: 0;
    margin-right: 0;
}

.my-0 {
    margin-top: 0;
    margin-bottom: 0;
}

/* DEF COLORS */
.white_color
{
    color:white;
}

/* Hyperlinks */

.no-decore {
    color:unset;
    text-decoration: none;
}

.with-decore {
    color:unset;
    text-decoration: underline;
}

/* Layout */

.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}
.no_href
{
    text-decoration:none;
    color:unset;
}
.href_underlineonHover
{
    text-decoration:none;
    color:unset;
}
.href_underlineonHover:hover
{
    text-decoration:underline;
}
.grid {
    display: grid;
}

.gap {
    gap: 5%;
}

.max-cont-width {
    max-width: 1020px;
}

.container {
    width: 80em;
}

/*---- Colors Text ----*/

/* Primary Green */

.primary-green-600 {
    color: var(--primary-green-600);
}

.primary-green-500 {
    color: var(--primary-green-500);
}

.primary-green-400 {
    color: var(--primary-green-400);
}

.primary-green-300 {
    color: var(--primary-green-300);
}

.primary-green-200 {
    color: var( --primary-green-200);
}

.primary-green-100 {
    color: var(--primary-green-100);
}

/* Heading & Text */

.headings-copy-600 {
    color: var(--headings-copy-600);
}

.headings-copy-400 {
    color: var(--headings-copy-500);    
}

.headings-copy-400 {
    color: var(--headings-copy-400);    
}

.headings-copy-300 {
    color: var(--headings-copy-300);    
}

.headings-copy-200 {
    color: var(--headings-copy-200);    
}

.headings-copy-100 {
    color: var(--headings-copy-100);
}


/* Brand Orange */

.accent-orange-600 {
    color: var(--accent-orange-600);
}

.accent-orange-500 {
    color: var(--accent-orange-500);
}

.accent-orange-400 {
    color: var(--accent-orange-400);
}

.accent-orange-300 {
    color: var(--accent-orange-300);
}

.accent-orange-200 {
    color: var(--accent-orange-200);
}

.accent-orange-100 {
    color: var(--accent-orange-100);
}

/** Secondary Colors **/

/* Pink */

.pink-600 {
    color: var(--pink-600);
}

.pink-500 {
    color: var(--pink-500);
}

.pink-400 {
    color: var(--pink-400);
}

.pink-300 {
    color: var(--pink-300);
}

.pink-200 {
    color: var(--pink-200);
}

.pink-100 {
    color: var(--pink-100);
}

/* Cyan */

.cyan-600 {
    color: var(--cyan-600);
}

.cyan-500 {
    color: var(--cyan-500);
}

.cyan-400 {
    color: var(--cyan-400);
}

.cyan-300 {
    color: var(--cyan-300);
}

.cyan-200 {
    color: var(--cyan-200);
}

.cyan-100 {
    color: var(--cyan-100);
}

/* Yellow */

.yellow-600 {
    color: var(--yellow-600);
}

.yellow-500 {
    color: var(--yellow-500);
}

.yellow-400 {
    color: var(--yellow-400);
}

.yellow-300 {
    color: var(--yellow-300);
}

.yellow-200 {
    color: var(--yellow-200);
}

.yellow-100 {
    color: var(--yellow-100);
}

/* Light Green */

.light-green-600 {
    color: var(--light-green-600);
}

.light-green-500 {
    color: var(--light-green-500);
}

.light-green-400 {
    color: var(--light-green-400);
}

.light-green-300 {
    color: var(--light-green-300);
}

.light-green-200 {
    color: var(--light-green-200);
}

.light-green-100 {
    color: var(--light-green-100);
}

/* Dark Green */

.dark-green-600 {
    color: var(--dark-grean-600);
}

.dark-green-500 {
    color: var(--dark-green-500);
}

.dark-green-400 {
    color: var(--dark-green-400);
}
.dark-green-300 {
    color: var(--dark-green-300);
}

.dark-green-200 {
    color: var(--dark-green-200);
}

.dark-green-100 {
    color: var(--dark-green-100);
}


/* Brown */

.brown-600 {
    color: var(--brown-600);
}

.brown-500 {
    color: var(--brown-500);
}

.brown-400 {
    color: var(--brown-400);
}

/* BRAND COLORS */

/*---- Colors Background ----*/

.light_green 
{
    color:#2E5140;
}
.content_green
{
    color:#9CC89F;
}
.dark_green
{
    color:#0D4F59;
}
.light_tintgreen
{
    color:#5A918B;
}
.dark_blue
{
    color:#005771;
}
.dark_cyan
{
    color:#005670;
}
.lightGrey_content
{
    color:#808080;
}
.grey_content
{
    color:#4D4D4D;
}
.light_black
{
    color:#212121
}
.lush_green
{
    color:#33CB98;
}
.lightgreen_text
{
    color:#64EAC3;
}
.slight_green_para
{
    color:#004F59;
}
.tag_ele_orange
{
    color:#C5855C;
}
.content_black
{
    color:#1A1A1A;
}
.amc_content_grey
{
    color:#999999;
}
.content_lightgrey
{
    color:#9B9B9B;
}
/* AMC DISTRIBUTION COLOR PALLATE */
.utility_color
{
    color:#4CD0B7;
}
.autoserv_color
{
    color:#EDD570;
}
.service_color
{
    color:#FF8F40;
}

.insurance_color
{
    color:#A3CA63;
}
.tax_color
{
    color:#FF7452
}

.other_color
{
    color:#64CBE8;
}

.reverse_column
{
   flex-direction: row-reverse;
}

/* Device Specific */


.desk-onlyFlex
{
    display:block;
}
.desk-only {
    display: none;    
}
.mobile-only {
    display: block;        
}
.mobile-only-flex
{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;

}


/* Primary Green */

.primary-green-600-bg {
    background-color: var(--primary-green-600);
}

.primary-green-500-bg {
    background-color: var(--primary-green-500);
}

.primary-green-400-bg {
    background-color: var(--primary-green-400);
}

.primary-green-300-bg {
    background-color: var(--primary-green-300);
}

.primary-green-200-bg {
    background-color: var( --primary-green-200);
}

.primary-green-100-bg {
    background-color: var(--primary-green-100);
}

/* Heading & Text */

.headings-copy-600-bg {
    background-color: var(--headings-copy-600);
}

.headings-copy-400-bg {
    background-color: var(--headings-copy-500);    
}

.headings-copy-400-bg {
    background-color: var(--headings-copy-400);    
}

.headings-copy-300-bg {
    background-color: var(--headings-copy-300);    
}

.headings-copy-200-bg {
    background-color: var(--headings-copy-200);    
}

.headings-copy-100-bg {
    background-color: var(--headings-copy-100);
}


/* Brand Orange */

.accent-orange-600-bg {
    background-color: var(--accent-orange-600);
}

.accent-orange-500-bg {
    background-color: var(--accent-orange-500);
}

.accent-orange-400-bg {
    background-color: var(--accent-orange-400);
}

.accent-orange-300-bg {
    background-color: var(--accent-orange-300);
}

.accent-orange-200-bg {
    background-color: var(--accent-orange-200);
}

.accent-orange-100-bg {
    background-color: var(--accent-orange-100);
}

/** Secondary Colors **/

/* Pink */

.pink-600-bg {
    background-color: var(--pink-600);
}

.pink-500-bg {
    background-color: var(--pink-500);
}

.pink-400-bg {
    background-color: var(--pink-400);
}

.pink-300-bg {
    background-color: var(--pink-300);
}

.pink-200-bg {
    background-color: var(--pink-200);
}

.pink-100-bg {
    background-color: var(--pink-100);
}

/* Cyan */

.cyan-600-bg {
    background-color: var(--cyan-600);
}

.cyan-500-bg {
    background-color: var(--cyan-500);
}

.cyan-400-bg {
    background-color: var(--cyan-400);
}

.cyan-300-bg {
    background-color: var(--cyan-300);
}

.cyan-200-bg {
    background-color: var(--cyan-200);
}

.cyan-100-bg {
    background-color: var(--cyan-100);
}

/* Yellow */

.yellow-600-bg {
    background-color: var(--yellow-600);
}

.yellow-500-bg {
    background-color: var(--yellow-500);
}

.yellow-400-bg {
    background-color: var(--yellow-400);
}

.yellow-300-bg {
    background-color: var(--yellow-300);
}

.yellow-200-bg {
    background-color: var(--yellow-200);
}

.yellow-100-bg {
    background-color: var(--yellow-100);
}

/* Light Green */

.light-green-600-bg {
    background-color: var(--light-green-600);
}

.light-green-500-bg {
    background-color: var(--light-green-500);
}

.light-green-400-bg {
    background-color: var(--light-green-400);
}

.light-green-300-bg {
    background-color: var(--light-green-300);
}

.light-green-200-bg {
    background-color: var(--light-green-200);
}

.light-green-100-bg {
    background-color: var(--light-green-100);
}

/* Dark Green */

.dark-green-600-bg {
    background-color: var(--dark-grean-600);
}

.dark-green-500-bg {
    background-color: var(--dark-green-500);
}

.dark-green-400-bg {
    background-color: var(--dark-green-400);
}
.dark-green-300-bg {
    background-color: var(--dark-green-300);
}

.dark-green-200-bg {
    background-color: var(--dark-green-200);
}

.dark-green-100-bg {
    background-color: var(--dark-green-100);
}


/* Brown */

.brown-600-bg {
    background-color: var(--brown-600);
}

.brown-500-bg {
    background-color: var(--brown-500);
}

.brown-400-bg {
    background-color: var(--brown-400);
}

/* Everything Else Gones Down */

footer.footer_nav_panel {
    position: relative;
}

.scroll-to-top {
    position: absolute;
    width: 10%;
    right: 5%;
    margin-top: -10%;
}

.scroll-to-top img {
    width: 100%;
    height: 100%;
}

/* Form Messages */

.form_messages {
    margin-left: 5%;
}

.success-message {
    color: green;
    opacity: 0;
    transition: 1s;
}

.error-message {
    color: red;
    opacity: 0;
    transition: 1s ease-in-out;
}
div.hero_button a 
{
    text-decoration:none;
    color:unset;
}
.subscription-messages p {
    position: absolute;
    margin-top: -2%;
    display: none;
}

/* DESKTOP MED SCREEN */
@media only screen and (min-width:1030px) 
{
    .base-padding 
    {
        padding-left:6%;
        padding-right:6%;
    }
    .base-padding-left
    {
        padding-left:6%;
    } 
    .base-padding-right
    {
        padding-right:6%;
    }
    .base-margin
    {
        margin-left:6%;
        margin-right:6%;
    }
    .base-margin-left
    {
        margin-left:6%;
    }
    .base-margin-right
    {
        margin-right:6%;
    }
    .desk-only 
    {
        display: block;    
    }
    .desk-onlyFlex
    {
        display:flex;
    }
    div.featured_graphic 
    {
        width: 80%;
    }
    .mobile-only 
    {
        display: none;        
    }
    .mobile-only-flex
    {
        display:none;
    }
    .footer_leftDesc {
        padding-right: 20%;
    }
    .scroll-to-top {
        position: absolute;
        width: 3%;
        right: 10%;
        margin-top: -3.5%;
    }
    .subscription-messages p
    {
        position:absolute;
        margin-top: -2%;
        display:none;
    }
    .subscription-success 
    {
        color:#28E4A5;
    }
    .subscription-error
    {
        color:#FF7452;
    }
    
}
@media only screen and (min-width:1850px)
{
    .base-margin
    {
        margin-left:6%;
        margin-right:6%;
    }
}