﻿/* ------------------------------ */
/* Imports */
/* ------------------------------ */
/*
    Open Sans
    - 300 = Thin
    - 400 = Medium
    - 500 = Thick
*/

@import url('https://fonts.googleapis.com/css2?family=Afacad+Flux:wght@100..1000&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

@media {
    /* ------------------------------ */
    /* STANDARD HTML STYLES */
    /* ------------------------------ */
    /* calculator logic: */
    /* at with of 320 font size of 12 */
    /* at with of 1600 font size of 20 */

    :root {
        /* fonts */
        --font-0: 'Afacad Flux', sans-serif;  /* standard text */
        --font-1: 'Montserrat', sans-serif;  /* Title text*/

        --font-weight-light: 300;
        --font-weight-normal: 400;
        --font-weight-bold: 600;
        --font-weight-bolder: 700;
        --font-weight-boldest: 800;

        --font-size-5S: clamp(0.30rem, calc(0.27rem + 0.14vw), 0.41rem);
        --font-size-4S: clamp(0.36rem, calc(0.32rem + 0.19vw), 0.51rem);
        --font-size-3S: clamp(0.43rem, calc(0.38rem + 0.26vw), 0.64rem);
        --font-size-2S: clamp(0.52rem, calc(0.45rem + 0.35vw), 0.80rem);
        --font-size-1S: clamp(0.63rem, calc(0.53rem + 0.47vw), 1.00rem);
        --font-size-0: clamp(0.75rem, calc(0.63rem + 0.63vw), 1.25rem);
        --font-size-1L: clamp(0.90rem, calc(0.73rem + 0.83vw), 1.56rem);
        --font-size-2L: clamp(1.08rem, calc(0.86rem + 1.09vw), 1.95rem);
        --font-size-3L: clamp(1.30rem, calc(1.01rem + 1.43vw), 2.44rem);
        --font-size-4L: clamp(1.56rem, calc(1.18rem + 1.87vw), 3.05rem);
        --font-size-5L: clamp(1.87rem, calc(1.38rem + 2.44vw), 3.82rem);

        /* padding and margins */
        --spacing-5S: clamp(0.06rem, calc(0.02rem + 0.23vw), 0.25rem);
        --spacing-4S: clamp(0.13rem, calc(0.08rem + 0.23vw), 0.31rem);
        --spacing-3S: clamp(0.19rem, calc(0.16rem + 0.16vw), 0.31rem);
        --spacing-2S: clamp(0.38rem, calc(0.31rem + 0.31vw), 0.63rem);
        --spacing-1S: clamp(0.56rem, calc(0.47rem + 0.47vw), 0.94rem);
        --spacing-0: clamp(0.75rem, calc(0.63rem + 0.63vw), 1.25rem);
        --spacing-1L: clamp(1.13rem, calc(0.94rem + 0.94vw), 1.88rem);
        --spacing-2L: clamp(1.50rem, calc(1.25rem + 1.25vw), 2.50rem);
        --spacing-3L: clamp(2.25rem, calc(1.88rem + 1.88vw), 3.75rem);
        --spacing-4L: clamp(3.00rem, calc(2.50rem + 2.50vw), 5.00rem);
        --spacing-5L: clamp(4.50rem, calc(3.75rem + 3.75vw), 7.50rem);

        /* colors - brand */
        --color-light-purple:#312a4d;
        --color-purple: #1d1833;
        --color-dark-purple: #140e2c;
  
        --color-light-red:#c43b51;
        --color-red: #a32035;
        --color-dark-red: #870c1f;

        --color-light-salmon:#fa999a;
        --color-salmon: #f15b5c;
        --color-dark-salmon: #dc3334;

        --color-light-brown:#4f3636;
        --color-brown: #3f201f;
        --color-dark-brown: #350f0e;

        --color-light-beige:#f6f2ef;
        --color-beige: #a57c65;
        --color-dark-beige: #925b3c;

        /* colors - supporting */
        --color-white: #FFFFFF;
        --color-black: #111111;

        --color-light-gray:#f8f8f8;
        --color-gray: #a9a9a9;
        --color-dark-gray: #626262;

        --color-alert-red:#cb2d3e;
        --color-alert-yellow:#FFB75E;
        --color-alert-green:#56ab2f;
        --color-alert-gray:#8e9eab;
    }

    html{ width:100%; height:100%; font-size:24px; background-color:var(--color-white);}
    body { position:relative; max-width:1800px; height:100%; margin:0px auto; padding:0px; color:var(--color-black); font-family: var(--font-0); }

    ul { margin-bottom:0px; list-style-type:square; }
    ul > li:not(:last-of-type) { margin-bottom:var(--spacing-2S); }

    hr { background-color:var(--color-gray); height:1px; border:0px; }

    form { margin:0px; padding:0px; }

    a { color:var(--color-red); text-decoration:none; transition: all .5s ease 0s; }
    a:hover,
    a:focus { color:var(--color-purple); text-decoration:underline; }

    a.underline { text-decoration:underline; }
    a.underline:hover,
    a.underline:focus { text-decoration:none; }

    h1 { color:var(--color-black); font-family: var(--font-1); font-size:var(--font-size-5L); line-height:1; font-weight:var(--font-weight-light); letter-spacing:2px; text-transform:uppercase;  }
    h2 { color:var(--color-black); font-family: var(--font-1); font-size:var(--font-size-4L); line-height:1; font-weight:var(--font-weight-light); letter-spacing:1px; text-transform:uppercase; }
    h3 { color:var(--color-black); font-family: var(--font-1); font-size:var(--font-size-2L); line-height:1; font-weight:var(--font-weight-light); }
    h4 { color:var(--color-black); font-family: var(--font-1); font-size:var(--font-size-1L); line-height:1; font-weight:var(--font-weight-bold); }
    h5 { color:var(--color-black); font-family: var(--font-1); font-size:var(--font-size-0); line-height:1; font-weight:var(--font-weight-bold); }

    p { margin-top:0px; padding-top:0px; line-height:1.4; }

    div p:last-of-type,
    section p:last-of-type { margin-bottom:0px; }

    img	{ border:0px; display:inline-block; margin:0px; padding:0px; }

    /* start inputs */
    input[type="button"],
    input[type="text"],
    input[type="file"],
    input[type="email"],
    select,
    textarea { font-size:var(--font-size-1S); -webkit-appearance:none; -moz-appearance:none; appearance:none; -ms-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }

    input[type="text"],
    input[type="file"],
    input[type="email"],
    select,
    textarea { outline:none; border:1px var(--color-dark-gray) solid; background-color:var(--color-white); border-radius:5px; }

    input[type="text"],
    input[type="file"],
    input[type="email"],
    select,
    textarea{ padding:var(--spacing-1S) var(--spacing-0); width:100%;}

    select { border-radius:0px; background-image:linear-gradient(-135deg, transparent 50%, black 50%), linear-gradient(135deg, black 50%, transparent 50%), linear-gradient(to right, #FFF, #FFF); background-position:calc(100% - 10px) calc(1em + 0px), calc(100% - 10px) calc(1em + 5px), calc(100% - -140px) 0.5rem; background-size:5px 5px,5px 5px,1px 2rem; background-repeat:no-repeat; }
    select::-ms-expand { display:none; }

    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible { outline:none; }

    input[disabled='disabled'],
    input[disabled],
    textarea[disabled='disabled'],
    textarea[disabled],
    textarea.aspNetDisabled,
    select.aspNetDisabled,
    input[type=text]:read-only { color:var(--color-dark-gray); background-color:var(--color-light-gray); }

    fieldset { border:0px; padding:0px; }
    /* end inputs */

    /* for search */
    .search_box { max-width:500px; padding-right:var(--spacing-1L) !important; background-position:calc(100% - var(--spacing-0)) center; background-repeat:no-repeat; background-size:var(--font-size-2S); background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>'); border-radius:50px !important; }
    .no_result { display:none; position:relative; padding:var(--spacing-3L); font-size:var(--font-size-1L); text-align:center; font-style:italic; }
    /* end search */

    /* start controls */
    .control_small_width { width:10% !important; min-width:100px; }
    .control_quarter_width { width:25%  !important; }
    .control_half_width { width:50% !important; }
    .control_three_quarters_width { width:75%  !important; }
    /* end controls */

    /* start buttons */
    .input_button,
    .link_as_button { display:inline-block; margin:0px; padding:var(--spacing-1S) var(--spacing-2L); color:var(--color-white); line-height:1; letter-spacing:1px; cursor:pointer; background-color:var(--color-red); border:0px; }

    .input_button:hover,
    .input_button:focus,
    .link_as_button:hover,
    .link_as_button:focus { color:var(--color-white); background-color:var(--color-purple); }

    .input_button:disabled,
    .link_as_button:disabled { background-color:var(--color-gray_dark); color:var(--color-gray); cursor:default; }

    .salmon_button { background-color:var(--color-salmon); }
    .salmon_button:hover,
    .salmon_button:focus { color:var(--color-white); background-color:var(--color-dark-salmon); }

    .transparent_button { color:var(--color-white); background-color:transparent; border:1px var(--color-white) solid; }
    .transparent_button:hover,
    .transparent_button:focus { color:var(--color-purple); background-color:var(--color-white); }
    /* end buttons */

    ul.no_bullets { margin:0px; padding:0px; list-style:none; }
    ul.no_bullets > li { margin:0px; padding:0px; }

    /* start message */
    .message span { font-size:var(--font-size-1S); margin-right:var(--spacing-3S); color:var(--color-white); vertical-align:middle; }

    .message .ok,
    .message .warning,
    .message .error,
    .message .nothing_defined { padding:var(--spacing-1S); color:var(--color-white); }

    .message .error { background:var(--color-alert-red); }
    .message .warning { background:var(--color-alert-yellow); }
    .message .ok { background:var(--color-alert-green);}

    .message .nothing_defined { background:var(--color-alert-gray); }
    /* end message */

    /* alignments */
    left { text-align:left; }
    .right { text-align:right; }
    .center { text-align:center; }
    /* end alignments */

    /*required*/
    .required { position:absolute; top:0px; right:0px; padding:var(--spacing-3S) var(--spacing-2S); color:var(--color-white); font-size:var(--font-size-1S); background:var(--color-alert-red); z-index:1; } 
    /*end required*/

    /* scrollbars */
    ::-webkit-scrollbar { width: 5px; height: 7px; border-radius:6px; }
    ::-webkit-scrollbar-track {  background: var(--color-lighter-gray); }
    ::-webkit-scrollbar-thumb {  background: var(--color-salmon); border-radius:6px; }
    ::-webkit-scrollbar-thumb:hover { background: var(--color-dark-salmon); }
    /* end scrollbars */

    /* back row */
    .back_row { margin-bottom:var(--spacing-2L); padding-bottom:var(--spacing-0); border-bottom:1px var(--color-lighter-gray) solid; }
    /* end back row */

    /* catcpha */
    .catcpha { font-size:var(--font-size-1L); letter-spacing:2px; }
    /* end catcpha */

    /* form */
    ul.form_box { margin:var(--spacing-1L) 0px 0px 0px; padding:0px; list-style:none; display:grid; grid-template-columns:repeat(2, 1fr); column-gap:var(--spacing-1L); row-gap:var(--spacing-2S); }
    ul.form_box > li { position:relative; }
    ul.form_box > li.full_row { margin:0px; padding:0px;grid-column: 1 / -1 }
    ul.form_box > li label { display:block; margin-bottom:var(--spacing-3S); font-size:var(--font-size-1S); font-weight:var(--font-weight-bold); letter-spacing:1px; line-height:1; }

    .form_error { display: none; position: absolute; top:0px; right:0px; padding:var(--spacing-3S); color: var(--color-white); font-size: var(--font-size-3S); line-height: 1; letter-spacing: 1px; background-color:var(--color-red); }    
    /* end form */

    /* flex and grid */
    .is_flex { display:flex; align-items: center; gap:var(--spacing-1S); }
    .is_grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:var(--spacing-1S); }

    ul.is_grid,
    ol.is_grid{ column-gap:var(--spacing-1L); row-gap:var(--spacing-2S); list-style-position:outside; }

    ul.is_grid > li.full_width,
    ol.is_grid > li.full_width { grid-column: 1 / -1; }

    ul.has_divider_lines > li:not(:last-of-type),
    ol.has_divider_lines > li:not(:last-of-type) { padding-right:var(--spacing-1S); line-height:var(--font-size-2S); border-right:1px var(--color-gray) solid; }
    /* end flex and grid*/

    /* text quick sizes */
    .small_text { font-size:var(--font-size-1S); }
    .large_text { font-size:var(--font-size-1L); }
    .larger_text { font-size:var(--font-size-2L); }
    .largest_text { font-size:var(--font-size-3L); }
    /* end text quick sizes */

    .lock_body { height:100vh; overflow:hidden; }

    .hide { display:none; }

    /*-----------------------------*/
    /* MAIN BODY ROWS */
    /*-----------------------------*/
    main { clear:both; }

    .wrapper_row { position:relative; background-color:var(--color-white); }

    .container_row { position:relative; width:100%; max-width:1400px; margin:0px auto; }
    .container_row_content { padding:var(--spacing-5L) 0px; }
    .container_row_content h1 { margin-top:0px; padding-top:0px; }

    .center_content { height:100vh; }
    .center_content > div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

    .width_400 { max-width:400px; }
    .width_500 { max-width:500px; }
    .width_600 { max-width:600px; }
    .width_800 { max-width:800px; }
    .width_1000 { max-width:1000px; }
    .width_1200 { max-width:1200px; }
    .width_1400 { max-width:1400px; }
    .width_1600 { max-width:1600px; }
    .width_full { max-width:initial; }

    /*-----------------------------*/
    /* HEADER */
    /*-----------------------------*/
    header { background-color:transparent; }
    header button.rd_menu { display:none; }

    /* logo */
    header #logo { position:relative; width:20%; padding:var(--spacing-1S) 0px; }
    header #logo a { display:inline-block; }
    header #logo a img { width:90%; max-width:220px; margin:0px; }

    /* menu */
    header #menu { width:80%; }
    header #menu ul { display:flex; justify-content:flex-end; align-items:center; margin:0px; padding:var(--spacing-1S) 0px; list-style:none;}
    header #menu ul li { position:relative; display:inline-block; margin:0px; padding:0px; }
    header #menu ul li:not(.icon):not(.divider) { margin:0px var(--spacing-1L); }

    header #menu ul li a { display:inline-block; color:var(--color-white); text-transform:uppercase; font-weight:var(--font-weight-bold); letter-spacing:1px; }
    header #menu ul li a.selected,
    header #menu ul li:not(.icon) a:hover,
    header #menu ul li:not(.icon) a:focus { border-bottom:6px var(--color-salmon) solid; text-decoration:none; transition: all .5s ease .2s;  }
    
    header #menu ul li.icon { margin-left:var(--spacing-5S); padding:0px var(--spacing-5S); }
    header #menu ul li.icon.accessibility:before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:var(--font-size-1S); height:var(--font-size-1S); background-color:var(--color-white); border-radius:50px; z-index:-1; }

    header #menu ul li.icon a { font-size:var(--font-size-0); color:var(--color-salmon); text-decoration:none; vertical-align:middle; }
    header #menu ul li.icon a img { height:var(--font-size-0); vertical-align:middle; display:inline-block; margin:0px auto; }

    header #menu ul li.social_media a:hover,
    header #menu ul li.social_media a:focus { transform:rotateY(360deg); transition: all 1s ease 0s;  }

    header #menu ul li.accessibility a:hover,
    header #menu ul li.accessibility a:focus { animation: pulsate 1s infinite; }

    /* on scroll class */
    header.header_no_scroll { border:none; }

    header.header_scroll { position:fixed; background-color:var(--color-purple); top:0px; right:0px; left:0px; z-index:99998; transition: all .5s ease 0s; }  /* applied in default.css too */
    /* header:after { content:'';  position:absolute; top:0px; right:0px; left:0px; height:30vh; background: linear-gradient(to bottom, #1d1833, rgba(255, 255, 255, 0) 10vh); z-index:-1;} */
    
    header.transparent_header { background-color:transparent; }

    /*-----------------------------*/
    /* HERO */
    /*-----------------------------*/
    #hero { background-size:cover; background-position:center center; background-repeat:no-repeat; }
    #hero:before { content:'';  position:absolute; top:0px; right:0px; left:0px; height:30vh; background: linear-gradient(to bottom, #111111, rgba(255, 255, 255, 0) 10vh); z-index:1;} 

    #hero .container_row { z-index:3; }
    #hero .container_row_content { height:70vh; padding-top:0px; padding-bottom:0px; }
    #hero .container_row_content h1 { position:absolute; margin:0px; bottom:30%; left:4.7%; color:var(--color-white); font-size:calc(var(--font-size-5L) * 2); z-index:1; }

    /*-----------------------------*/
    /* FOOTER */
    /*-----------------------------*/
    footer { background-position:right center; background-repeat:no-repeat; background-size:contain; background-image:url(https://eu2allwebext.blob.core.windows.net/providencemarketsquare/www/resources/images/common/other/i_pattern_double_purple.png);}
    footer .container_row_content { padding-top:var(--spacing-3L); padding-bottom:var(--spacing-3L); }
    footer h3 { margin-top:var(--spacing-2L); margin-bottom:var(--spacing-1S); font-size:var(--font-size-0); font-weight:var(--font-weight-bold); }
    footer h3:first-child { margin-top:0px; }

    footer .footer_group { width:70%; gap:var(--spacing-4L); }
    footer .footer_group > div:nth-child(1) a.link_as_button { margin-top:var(--spacing-2L); }

    footer .footer_group > div:nth-child(2) a { color:var(--color-white); text-decoration:underline; }
    footer .footer_group > div:nth-child(2) a:hover,
    footer .footer_group > div:nth-child(2) a:focus { text-decoration:none; }

    footer .footer_group > div:nth-child(2) ul.link_group { margin-top:var(--spacing-1L); grid-template-columns:1fr; gap:var(--spacing-0); }

    /*-----------------------------*/
    /* LEGAL NOTICE */
    /*-----------------------------*/
    #legal_footer { color:var(--color-dark-beige); font-size:var(--font-size-1S); }
    #legal_footer .container_row_content { padding-top:var(--spacing-1L); padding-bottom:var(--spacing-1L); }

    #legal_footer .legal_group { gap:0px; grid-template-columns:7fr 3fr; }
    #legal_footer .legal_group > div:nth-child(1) ul.link_list { gap:var(--spacing-1S); }
    #legal_footer .legal_group > div:nth-child(1) .server_is { font-size:var(--font-size-2S); }

    #legal_footer .legal_group > div:nth-child(2) { text-align:right; }
    #legal_footer .legal_group > div:nth-child(2) img { display:inline-block; height:var(--spacing-2L); }

    /*-----------------------------*/
    /* LEGAL NOTICE */
    /*-----------------------------*/
    #legal_notice { display:block; position:fixed; bottom:0px; right:0px; left:0px; background-color:var(--color-white); border-top:1px var(--color-black) solid; z-index:10000; }
    #legal_notice .body { padding:var(--spacing-1L) var(--spacing-1S); text-align:center; }	
    #legal_notice .body p:last-of-type { margin-bottom:0px; }
    #legal_notice .body a:not(.link_as_button) { text-decoration:underline; }

    /*-----------------------------*/
    /* Animations */
    /*-----------------------------*/
    .animate_image_rotate:hover img,
    .animate_image_rotate:focus img { transform: rotate(360deg); transition: all 0.5s ease 0s; }

    /* pulsate */
    @-webkit-keyframes pulsate {
        0% { -webkit-transform: scale(1.5); transform: scale(1.5); } 100% { -webkit-transform: scale(1); transform: scale(1); }
    }

    @keyframes gradient {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    .coming_soon { display:inline-block; padding:var(--spacing-3S) var(--spacing-1S); font-size:var(--font-size-2S); text-transform:uppercase; letter-spacing:1px; line-height:1; border:1px var(--color-gray) solid; }
}

@media (max-width:1600px) {
    html { font-size:22px; }

    #hero .container_row_content { height:60vh; }
}

@media (max-width:1400px) {
    html { font-size:20px; }

    header #logo .body { padding-left:var(--spacing-2L); }
    header #menu ul { padding-right:var(--spacing-2L); }

    .container_row_content { padding:var(--spacing-5L) var(--spacing-2L); }
}

@media (max-width:1200px) {
    html { font-size:18px; }

    #hero .container_row_content { height:50vh; }
}

@media (max-width:1000px) {
    /* logo */
    header #logo { width:30%; }
    header #logo a img { width:initial; max-width:initial; height:45px; }

    /* menu */
    header #menu { display:none; width:100%; position:fixed; top:77px; right:0px; bottom:0px; left:0px; border-top:1px var(--color-white) solid; background-color:var(--color-purple); background-position:right center; background-repeat:no-repeat; background-size:contain; background-image:url(https://eu2allwebext.blob.core.windows.net/providencemarketsquare/www/resources/images/common/other/i_pattern_single_red.png);  z-index:201; }
    header #menu ul { display:grid; position:absolute; grid-template-columns:1fr; gap:var(--spacing-1L); top:50%; left:10%; transform:translateY(-50%); width:100%; }
    header #menu ul li { display:block; margin:0px; }
    header #menu ul li:not(.accessibility) a { color:var(--color-white); font-size:var(--font-size-4L); font-weight:var(--font-weight-light); letter-spacing:2px; }
    
    header #menu ul li.icon { margin-left:initial; }
    header #menu ul li:not(.icon):not(.divider) { margin:0px; }
    header #menu ul li.icon.accessibility a { font-size:var(--font-size-3L); }
    header #menu ul li.icon.accessibility:before { display:none; }

    header #menu ul li.divider { border:0px !important;}

    /* rd menu */
    header button.rd_menu { display:block; position:absolute; padding:var(--spacing-2S); top:50%; right:var(--spacing-2L); transform:translateY(-50%); color:var(--color-black); font-size:var(--font-size-0); cursor:pointer; background-color:var(--color-white); border:1px var(--color-white) solid; border-radius:var(--spacing-2S); z-index:20; }
    header button.rd_menu:hover { color:var(--color-black); background-color:var(--color-white); border-radius:0px; }
}

@media (max-width:700px) {
    #hero .container_row_content { height:40vh; }

    footer { background-position:right -200px center; }
    footer .footer_group { grid-template-columns:1fr; gap:var(--spacing-2L); }

    #legal_footer .legal_group { grid-template-columns:7fr 3fr; gap:var(--spacing-1L); align-items:flex-end; }

    #legal_footer .legal_group > div:nth-child(1) ul.link_list { margin-bottom:var(--spacing-0); flex-wrap:wrap; row-gap:var(--spacing-2S); }
    #legal_footer .legal_group > div:nth-child(1) ul.link_list li:nth-child(1) { width:100%; border-right:none; }
}

@media (max-width:600px) {
    #hero .container_row_content { height:30vh; }
}