/**
 * CUSTOM CSS astonished-solutions 
 *
 * @author D. Amaya (diana-at-dennistiems-dot-com)
 * @version 2020-08-24 09:12;
 * @copyright Copyright BigBase
 */


/*
 * *********************************************************************************************************************
 * General style
 * For full page, like fonts, colors and body background
 * *********************************************************************************************************************
 */
 
  :root { 

    /*titles (h*), display, strong*/
    --main-text-color: rgb(85, 86, 86);
    /*all text*/
    --secondary-text-color: rgb(130, 132, 134);
    /*disable links*/
    --text-color-disable: rgb(119, 119, 119);

    /*main color: main color for buttons, links, panels, sitemap */
    --main-color: rgb(141, 199, 63);
    /*(no used in this template) - main color with opacity, backgrounds - usually in mobile menu*/
    --main-color-opacity: rgba(141, 199, 63, 0.6);
    /*hover in buttons, links and more - with primary color */
    --main-hover-color: rgb(140, 188, 89);
    /*secondary color: secondary color in buttons and links, etc. */
    --secondary-color: rgb(221, 221, 221);
    /*(no used in this template) - hover in secondary buttons, links  - with secondary color */
    --secondary-hover-color: rgb(0, 0, 0); 

    /*text color on all objects with the main color*/
     --text-color-in-main: rgb(255, 255, 255);
    /*text color in hover main*/
    --text-color-in-main-hover: rgb(255, 255, 255);
    /*text color on all objects with the secondary color*/
    --text-color-in-secondary: rgb(28, 29, 30);
    /*(no used in this template) - text color in hover secondary*/
    --text-color-in-secondary-hover: rgb(28, 29, 30);

    /*background in: content D*/    
    --main-background-color : rgb(141, 199, 63);
    /*background in: content A, C*/
    --secondary-background-color : rgb(249, 249, 249);
    /*background in: footer A*/
    --alternative-bacground-color : rgb(63, 63, 63);
    /*background in: footer B*/
    --alternative-2-bacground-color : rgb(94, 92, 93);

    /*text color in main background*/
    --text-color-in-main-background: rgb(255, 255, 255);
    /*text color in secondary background*/
    --text-color-in-secondary-background: var(--secondary-text-color);
    /*text color in alternative background*/
    --text-color-in-alternative-background: rgb(255, 255, 255);
    /*text color in alternative 2 background*/
    --text-color-in-alternative-background: rgb(255, 255, 255);

  }


  body, table {  
    /*font-family: 'Roboto', sans-serif;*/
    font-family: 'Roboto Slab', serif;
    font-weight: 300;
    font-size: 1.8rem;
    line-height: 1.5rem;
    color: var(--secondary-text-color);
  }

  @media print {
    @page {
      size: A4; 
    }
  }

  h1, h1 span,
  h2, h2 span,
  h3, h3 span,
  h4, h4 span,
  h5, h5 span,
  h6, h6 span { 
    font-weight: 700;
    font-size: 3.3rem !important;
    line-height: 3.3rem;
    color: var(--main-text-color);
    font-family: 'Prompt', sans-serif;
  }

  h2, h2 span {
    font-size: 2.8rem !important;
    line-height: 2.625rem;
  }

  h3, h3 span {
    font-size: 2.6125rem !important;
    line-height: 2.625rem;
  }

  h4, h4 span {
    font-size: 2.3rem !important;
    line-height: 2.2rem;
  }

  h5, h5 span {   
    font-size: 2.1rem !important;
    line-height: 2rem;
  }

  h6, h6 span {
    font-size: 1.8rem !important;
    line-height: 1.8rem;
  }

  small{
    font-size: 1.4rem !important;
    line-height: 1.625rem;
    color: rgb(129, 138, 145);
    font-weight: 700;
  }

  h1 small,
  h2 small,
  h3 small,
  h4 small,
  h5 small,
  h6 small{
    font-size: 86% !important;
  }

  .display-1,
  .display-2,
  .display-3,
  .display-4 {
    font-weight: 400;
    font-size: 2.1rem;
    line-height: 2.375rem;
    color: var(--main-text-color); 
  }

  .lead{
    font-size: 2.1rem !important;
    line-height: 3rem;
    font-weight: 400 !important;
  }

  .display-1{
    font-size: 6.8rem !important;
    line-height: 7rem !important;
  }

  .display-2{
    font-size: 6.3rem !important;
    line-height: 6.5rem !important;
  }

  .display-3{
    font-size: 5.7375rem !important;
    line-height: 5.75rem !important;
  }

  .display-4{
    font-size: 4.6125rem !important;
    line-height: 4.4375rem !important;
  }

  blockquote {
    font-size: 2.1rem !important;
    line-height: 2.375rem !important;
    border-right: none;
    border-left: 3px solid var(--main-color);
  }

  blockquote.text-right{
    border-left: none;
    border-right: 3px solid var(--main-hover-color);
  }

  .blockquote-footer {
    font-size: 2.1rem;
    line-height: 1.5rem;
    color: var(--main-color);
  }

  .blockquote-footer:before{
    color: var(--secondary-text-color);
  }

  .well .blockquote-footer{
    color:white;
  }

  .well blockquote.text-right{
    border-color: rgba(0, 0, 0, 0.15);
  }


  cite {
    font-size: 2.1rem;
    line-height: 1.5rem;
    color: rgb(129, 138, 145) !important;  
  }

  .well cite{
    color:white;
  }

  strong{
    font-weight: 700;
    color: var(--main-text-color);
  }

  .well strong{
    color:white;
  }

  ul, ol {
    font-weight: 400;
    font-size: 1.8rem;
    line-height: 2.3rem;
  }

  pre {
    background-color: rgb(238, 238, 238);
  }



/*
 * *********************************************************************************************************************
 * Animations
 * General animations for everywhere
 * *********************************************************************************************************************
 */



/*
 * *********************************************************************************************************************
 * Location specific style
 * Paddings and backgrounds of specific locations
 * *********************************************************************************************************************
 */

  .block-background > div {
    padding: 0px;
  }

  .parallax-fade-out > div {
    opacity: 1 !important;
    transition: top 0.3s ease;
  }

  .loc-s-2 .block-background{
    background: rgba(141, 199, 63, 0.9);
    position: absolute;
    height: 100vh;
    width: 100vw;    
  }

  .loc-s-2-e{
    padding: 50px 10%;
  }

  .loc-s-3{
    background: rgba(0, 0, 0, 0.8) !important;
  }

  .loc-s-3 > div > .container-fluid{
    top: 0px;
    position: absolute;
  }

  .loc-s-3 > div > .container-fluid > .row > div{
    width: 100%;
    margin: 0px;
    padding: 0px;
  }

  .loc-s-3 .block-popover-inner{
    background: transparent !important;
    padding: 0px !important;
    position: relative;
    top: 0px;
    height: 100vh;
    max-height: 100vh;
    max-width: 100%;
  }

  .loc-s-3-b > .row > div{
    padding-left: 20%;
    padding-right: 20%;
  }

   @media(max-width: 1023px){
    .loc-s-3-b > .row > div{
      padding-left: 10%;
      padding-right: 10%;
    }
  }

  @media(max-width: 920px){
    .loc-s-3-b > .row > div{
      padding-left: 5%;
      padding-right: 5%;
    }
  }

  @media(max-width: 767px){
    .loc-s-3-b > .row > div{
      padding-left: 12px;
      padding-right: 12px;
    }
  }

  .loc-s-3-b > .row > div:first-child{
    padding-top: 50px;
  }

  .loc-s-3-b > .row > div:nth-child(2),
  .loc-s-3-b > .row > div:first-child{
    background: var(--main-color);
  }

  .loc-s-3-b > .row > div:nth-child(2) {
    margin-top: -1px;
  }

  .loc-s-3-b > .row > div:nth-child(3){
    position: relative;
    padding-top: 105px;
  }

  @media(min-width: 1600px){
    .loc-s-3-b > .row > div:nth-child(3){
      padding-top: 120px;
    }
  }

  @media(min-width: 3500px){
    .loc-s-3-b > .row > div:nth-child(3){
      padding-top: 160px;
    }
  }

  @media(max-width: 919px){
    .loc-s-3-b > .row > div:nth-child(3){
      padding-top: 80px;
    }
  }

  @media(max-width: 500px){
    .loc-s-3-b > .row > div:nth-child(3){
      padding-top: 60px;
    }
  }

  @media(max-width: 400px){
    .loc-s-3-b > .row > div:nth-child(3){
      padding-top: 50px;
    }
  }


  .loc-s-6 {
    position: fixed;
    bottom: 0px;
    background: var(--main-background-color);
    color: var(--text-color-in-main-background);
    width: 100%;
    max-height: 100%;
    padding: 4px 0px;
  }

  @media(max-width: 919px){
    .loc-s-6 {
      padding: 2px 0px;
    }
  }

  @media print {
    .loc-s-2,
    .loc-s-3,
    .loc-s-6,
    .parallax {
      display: none !important;
    }
  }

  .parallax .block-background > .container-fluid{
    width: 100%;
  }

  .loc-s-7.block-behind-page{
    padding-top: 105px;
    max-height: 100vh;
    z-index: 2;
    overflow-y: auto;
    background: var(--alternative-bacground-color);
  }

  @media(min-width: 1600px){
    .loc-s-7.block-behind-page{
      padding-top: 120px;
    }
  }

  @media(min-width: 3500px){
    .loc-s-7.block-behind-page{
      padding-top: 160px;
    }
  }

  @media(max-width: 919px){
    .loc-s-7.block-behind-page{
      padding-top: 80px;
    }
  }

  @media(max-width: 500px){
    .loc-s-7.block-behind-page{
      padding-top: 60px;
    }
  }

  @media(max-width: 400px){
    .loc-s-7.block-behind-page{
      padding-top: 50px;
    }
  }
   
  .loc-s-7-a > .row > div:not(:first-child){
    background: var(--alternative-2-bacground-color);
  }
  
  .loc-s-7-a > .row > div:first-child{
    padding-bottom: 100px;
    padding-top: 60px;
  }

  .loc-s-7-a > .row > div:nth-last-child(2){
    padding-right: 12px !important;
  }

  .loc-s-7-a > .row > div:last-child{
    padding-left: 12px !important;
  }

  .loc-h-2 {
    background: rgb(255,255,255);
  }

  @media(min-width: 1024px){
    .loc-h-2-d{
      width: 15%;
    }

    .loc-h-2-e{
      width: 85%;
    }
  }

  .loc-h-4, 
  .loc-h-4 .parallax {
    height: auto;
  }

  .loc-h-4{
    z-index: 36 !important;
    background: rgb(255, 255, 255);
  }

  .loc-h-4 .block-foreground{
    padding-top:105px;
    padding-bottom: 105px;
  }

  .loc-h-4 .block-background *{
    height: 100% !important;
  }


  .loc-m-1.block,
  .loc-m-3.block,
  .loc-m-5.block {
    padding-top: 60px !important;
    padding-bottom: 105px;
  }

  @media(min-width: 1600px){
    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block {
      padding-bottom: 120px;
    }
  }

  @media(min-width: 3500px){
    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block {
      padding-bottom: 160px;
    }
  }

  @media(max-width: 919px){
    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block {
      padding-bottom: 80px;
    }
  }

  @media(max-width: 500px){
    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block {
      padding-bottom: 60px;
    }
  }

  @media(max-width: 400px){
    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block {
      padding-bottom: 50px;
    }
  }
  
  .loc-m-7.block{
    padding-top: 60px !important;
    padding-bottom: 0px !important;
  }


  @media(max-width: 767px){

    .loc-m-1.block,
    .loc-m-3.block,
    .loc-m-5.block, 
    .loc-m-7.block {
      padding-top: 30px !important;
    }

  }

  .loc-m-1{
    z-index: 36 !important;
  }

  .loc-m-3{
    z-index: 37 !important;
    background: rgb(255,255,255);
  }

  .loc-m-5{
    z-index: 38 !important;
  }

  .loc-m-7 {
    z-index: 39 !important;
    background-color: var(--main-background-color);
  }

  .loc-m-1, 
  .loc-m-5{
    background-color: var(--secondary-background-color);
  } 

  /*arrows and circle styles*/

  /*920px- 1599px*/
  
  main > .loc-container > .block-background{
    width: 100%;
    height: 105px;
    overflow: hidden;
    margin: 0px;
    top: -103px;
  }

  .loc-s-3-b > .row > div .overflow,
  main > .loc-container > .overflow{
    width: 100%;
    height: 105px;
    overflow: hidden;
    margin: 0px;
    bottom: -105px;
    position: absolute;
    right: 0;
    left: 0;
  }

  .loc-s-3-b > .row > div .overflow > .straight:after,
  main > .loc-container > .overflow > .straight:after,
  main > .loc-container > .block-background > .straight:after{
    content: "";
    position: absolute;
    top: 0vw;
    right: 0;
    width: 0;
    height: 0;
    border-right: calc(50vw - 120px) solid var(--secondary-background-color);
    border-top: 75px solid transparent;
    border-bottom: 30px solid var(--secondary-background-color);
  }

  .loc-s-3-b > .row > div .overflow > .straight:after,
  main > .loc-container > .overflow > .straight:after{
    border-right: calc(50vw - 120px) solid transparent;
    border-top: 75px solid var(--secondary-background-color);
    border-bottom: 30px solid transparent;
  }

  .loc-s-3-b > .row > div .overflow > .straight:before,
  main > .loc-container > .overflow > .straight:before,
  main > .loc-container > .block-background > .straight:before{
    content: "";
    position: absolute;
    top: 0vw;
    width: 0;
    height: 0;
    border-left: calc(50vw - 120px) solid var(--secondary-background-color);
    border-bottom: 75px solid transparent;
    transform: rotateX(180deg);
    padding-bottom: 30px;
  }

  .loc-s-3-b > .row > div .overflow > .straight:before,
  main > .loc-container > .overflow > .straight:before{
    border-left: calc(50vw - 120px) solid transparent;
    border-bottom: 75px solid var(--secondary-background-color);
    /*margin-top: -0.3px;*/
  }

  .loc-s-3-b > .row > div .overflow > .circle,
  main > .loc-container > .overflow > .circle,
  main > .loc-container > .block-background > .circle{
    position: absolute;
    width: 224px;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
    bottom: 0px;
  }

  .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
  main > .loc-container:not(.has-bar) > .overflow > .circle,
  main > .loc-container:not(.has-bar) > .block-background > .circle{
    width: 244px;
    bottom: 0px;
  }

  .loc-s-3-b > .row > div .overflow > .circle,
  main > .loc-container > .overflow > .circle{
    height: 105px;
  }

  .loc-s-3-b > .row > div .overflow > .circle:before,
  main > .loc-container > .overflow > .circle:before,
  main > .loc-container > .block-background > .circle:before{
    content: "";
    width: 290px;
    height: 50px;
    position: absolute;
    border-radius: 50%;
    box-shadow: 0 0 0 100vw var(--secondary-background-color);
    bottom: 21px;
    left: 50%;
    transform: translateX(-50%);
  }

  .loc-s-3-b > .row > div .overflow > .circle:before,
  main > .loc-container > .overflow > .circle:before {    
    box-shadow: 0 -23px 0 27px var(--secondary-background-color);  
    bottom: 24px; 
    width: 317px;
  }

  main > .loc-container:not(.has-bar) > .block-background > .circle:before{
    bottom: 19px;
  }

  .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
  main > .loc-container:not(.has-bar) > .overflow > .circle:before{
    bottom: 23px;
    width: 332px;
  }

  .loc-s-3-b > .row > div .overflow > .circle:after,
  main > .loc-container > .overflow > .circle:after{
    content: "";
    height: 65px;
    width: 327px;
    background: var(--secondary-background-color);
    top: 19px;
    position: absolute;
    border-radius: 50%;
    left: 50%;
    transform: translateX(-50%);
  }

  .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after,
  main > .loc-container:not(.has-bar) > .overflow > .circle:after{
    top: 20px;
  }

 @media(min-width: 1600px){
    

    main > .loc-container > .block-background{
      height: 120px;
      top: -119px;
    }

    .loc-s-3-b > .row > div .overflow,
    main > .loc-container > .overflow{
      height: 120px;
      bottom: -120px;
    }
    
    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-bottom-width: 90px;
    }
 
    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-top-width: 90px;
    }

    .loc-s-3-b > .row > div .overflow > .circle,
    main > .loc-container > .overflow > .circle{
      height: 118px;
      top: -1px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before,
    main > .loc-container > .block-background > .circle:before{
      width: 340px;
      bottom: 24px;
    }

    main > .loc-container:not(.has-bar) > .block-background > .circle:before{
      bottom: 22px;
      width: 327px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 30px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:before,
    main > .loc-container.has-bar > .overflow > .circle:before{
      bottom: 22px;
    }    

    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before{
      box-shadow: 0 -33px 0 37px var(--secondary-background-color);
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before{
      visibility: hidden;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after{
      height: 80px;
      width: 331px;
      top: 20px;      
    }

    main > .loc-container:not(.has-bar) > .overflow > .circle:after {
        top: -11px;
        width: 500px;
        border-top-right-radius: 0px;
        height: 109px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after{
      top: -32px;
      height: 134px;
      width: 438px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:after,
    main > .loc-container.has-bar > .overflow > .circle:after{
      height: 105px;
      width: 481px;
      top: -8px;
    }
 }

@media(min-width: 2000px){

    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-left-width: calc(50vw - 300px);
    }
 
    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-right-width: calc(50vw - 300px);
    }

    .loc-s-3-b > .row > div .overflow > .circle,
    main > .loc-container > .overflow > .circle,
    main > .loc-container > .block-background > .circle,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
    main > .loc-container:not(.has-bar) > .overflow > .circle,
    main > .loc-container:not(.has-bar) > .block-background > .circle{
      width: 602px;
      height: 118px;
      top: 1px;
    }

    .loc-s-3-b > .row > div .overflow > .circle,
    main > .loc-container > .overflow > .circle,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
    main > .loc-container:not(.has-bar) > .overflow > .circle{
      top:-1px;
    }


    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before,
    main > .loc-container > .block-background > .circle:before,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .block-background > .circle:before{
      bottom: 7px;
      width: 1273px;
      height: 368px;
    }

    main > .loc-container.has-bar > .block-background > .circle:before{
      bottom: 8px;
    }

    main > .loc-container > .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 8px;
      width: 1271px;
    }

    main > .loc-container.has-bar > .overflow > .circle:before{
      bottom: 9px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,    
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before{
        bottom: 12px;
        width: 1386px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after,
    main > .loc-container > .block-background > .circle:after,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after,
    main > .loc-container:not(.has-bar) > .overflow > .circle:after,
    main > .loc-container:not(.has-bar) > .block-background > .circle:after{
      top: -22px;
      height: 136px;
      width: 801px;
    }

    main > .loc-container > .overflow > .circle:after,    
    main > .loc-container:not(.has-bar) > .overflow > .circle:after{
      top: -24px;
    }

     
     .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after{
      top: -26px;
      width: 867px;
     }
    
     main > .loc-container.has-bar > .overflow > .circle:after,
     .loc-s-3-b.has-bar > .row > div .overflow > .circle:after{
      height: 134px;
      width: 791px;
      top: -23px;
     }

     .loc-s-3-b.has-bar > .row > div .overflow > .circle:after{
      top:-21px;
     }

  
 }

  @media(min-width: 2500px){

    main > .loc-container > .block-background > .circle:before,
    main > .loc-container:not(.has-bar) > .block-background > .circle:before{
      bottom: 11px;
      width: 1391px;
    }
    
    main > .loc-container.has-bar > .block-background > .circle:before {
      bottom: 12px;
    }

    main > .loc-container > .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 13px;
      width: 1441px;
    }

    main > .loc-container.has-bar > .overflow > .circle:before{
      bottom: 14px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,    
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before{
        bottom: 17px;
        width: 1611px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:before{
      bottom: 18px;
    }

    main > .loc-container > .overflow > .circle:after,    
    main > .loc-container:not(.has-bar) > .overflow > .circle:after{
      top: -29px;
      width: 900px;
    }  

    main > .loc-container.has-bar > .overflow > .circle:after{
      width: 891px;
      top: -29px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after{
      top: -32px;
      width: 999px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:after {
        top: -33px;
        width: 987px;
    }
  }

  @media(min-width: 3500px){

    main > .loc-container > .block-background{
      height: 160px;
      top: -159px;
    }

    .loc-s-3-b > .row > div .overflow,
    main > .loc-container > .overflow{
      height: 160px;
      bottom: -160px;
    }

    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-left-width: calc(50vw - 600px);
      border-bottom-width: 120px;
      padding-bottom: 40px;
    }
 
    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-right-width: calc(50vw - 600px);
      border-top-width: 120px;
      border-bottom-width: 40px;
    }

   
    main > .loc-container > .block-background > .circle,   
    main > .loc-container:not(.has-bar) > .block-background > .circle{
      width: 1202px;
      height: 122px;
      top: 75px;
    }

     .loc-s-3-b > .row > div .overflow > .circle,
    main > .loc-container > .overflow > .circle,
     .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
    main > .loc-container:not(.has-bar) > .overflow > .circle{
      width: 1202px;
      height: 207px;
      top: -20px;
    }

    
    main > .loc-container > .block-background > .circle:before,
    main > .loc-container:not(.has-bar) > .block-background > .circle:before{
      bottom: 42px;
      width: 2366px;
      height: 510px;
    }

    main > .loc-container.has-bar > .block-background > .circle:before {
        bottom: 42px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,    
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 37px;
      width: 2146px;
    }

    main > .loc-container.has-bar > .overflow > .circle:before {
      bottom: 39px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:before{
      bottom: 39px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,    
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after,    
    main > .loc-container:not(.has-bar) > .overflow > .circle:after{
      top: -29px;
      width: 1644px;
      height: 201px;
    }  

    main > .loc-container.has-bar > .overflow > .circle:after {
        width: 1646px;
        top: -29px;
        height: 199px;
    }

    .loc-s-3-b.has-bar > .row > div .overflow > .circle:after {
        top: -13px;
        width: 1555px;
        height: 186px;
    }
 }

  @media(max-width: 919px){

    main > .loc-container > .block-background {       
      height: 80px;
      top: -78px;
    }
    .loc-s-3-b > .row > div .overflow,
    main > .loc-container > .overflow{
      height: 80px;
      bottom: -80px;
    }
    
    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-left-width: calc(50vw - 60px);
      border-bottom-width: 50px ;
    }

    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-right-width: calc(50vw - 60px) ;
      border-top-width: 50px ;
    }

    .loc-s-3-b > .row > div .overflow > .circle,
    main > .loc-container > .overflow > .circle,
    main > .loc-container > .block-background > .circle{
      width: 123px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
    main > .loc-container:not(.has-bar) > .overflow > .circle,
    main > .loc-container:not(.has-bar) > .block-background > .circle{
      width: 120px;
      bottom: 0px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before,
    main > .loc-container > .block-background > .circle:before{
      width: 230px;
      height: 54px;
      bottom: 27px;
    }

    main > .loc-container:not(.has-bar) > .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .block-background > .circle:before{
      width: 211px;
      bottom: 25px;
    }
 
    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before{
      bottom: 31px;
      width: 260px;
    }


    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 29px;
      width: 234px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before{
      bottom: 29px;
      width: 237px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after{
      top: 10px;
    }    

    main > .loc-container:not(.has-bar) > .overflow > .circle:after,
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after{
      top:12px;
    }
  }

  @media(max-width: 767px){
    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before {
      bottom: 29px;
      width: 190px; 
    }
    
    main > .loc-container:not(.has-bar) > .overflow > .circle:before {
      bottom: 29px;  
      width: 229px;  
    }
    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before{
      bottom: 29px;
      width: 240px;
    }
    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after {
      top: 12px;
      width: 212px;
    }
    
    main > .loc-container:not(.has-bar) > .overflow > .circle:after {
      top: 13px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after{
      top: 14px;
    }
  }

  @media(max-width: 500px){

    main > .loc-container > .block-background {       
      height: 60px;
      top: -58px;
    }
    
    .loc-s-3-b > .row > div .overflow,
    main > .loc-container > .overflow,{
      height: 60px;
      bottom: -60px;
    }

    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-bottom-width: 30px;
    }

    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-top-width: 30px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before{
      bottom: 49px;
      width: 192px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 50px;
      width: 253px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after{
      top: -8px;
      width: 270px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after,
    main > .loc-container:not(.has-bar) > .overflow > .circle:after{
      top: -9px;
      width: 250px;
    }
  }

  @media(max-width: 400px){

    main > .loc-container > .block-background {       
      height: 50px;
      top: -48px;
    }

    .loc-s-3-b > .row > div .overflow,
    main > .loc-container > .overflow{
      height: 50px;
      bottom: -50px;
    }

    .loc-s-3-b > .row > div .overflow > .straight:before,
    main > .loc-container > .overflow > .straight:before,
    main > .loc-container > .block-background > .straight:before{
      border-bottom-width: 20px;
    }

    .loc-s-3-b > .row > div .overflow > .straight:after,
    main > .loc-container > .overflow > .straight:after,
    main > .loc-container > .block-background > .straight:after{
      border-top-width: 20px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle,
    main > .loc-container:not(.has-bar) > .overflow > .circle{
      height: 73px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:before,
    main > .loc-container > .overflow > .circle:before{
      bottom: 29px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:before,
    main > .loc-container:not(.has-bar) > .overflow > .circle:before{
      bottom: 59px;
    }

    .loc-s-3-b > .row > div .overflow > .circle:after,
    main > .loc-container > .overflow > .circle:after{
      top: 12px;
    }

    .loc-s-3-b:not(.has-bar) > .row > div .overflow > .circle:after,
    main > .loc-container:not(.has-bar) > .overflow > .circle:after{
      top: -18px;
    }
  } 

  
  /*change colors*/  
  main > .loc-m-3 > .block-background > .straight:before{
    border-left-color: rgb(255,255,255);
  }
  main > .loc-m-3 > .overflow > .straight:before{
    border-bottom-color: rgb(255,255,255);
  }  
  main > .loc-m-3 > .block-background > .straight:after{
    border-right-color: rgb(255,255,255);
    border-bottom-color: rgb(255,255,255);
  }
  main > .loc-m-3 > .overflow > .straight:after{
    border-top-color:rgb(255,255,255);
  }
  main > .loc-m-3 > .block-background > .circle:before{
    box-shadow: 0 0 0 100vw rgb(255,255,255);
  }
  main > .loc-m-3 > .overflow > .circle:before{
    box-shadow: 0 -23px 0 27px rgb(255,255,255);
  }
  main > .loc-m-3 > .overflow > .circle:after{
    background: rgb(255,255,255);
  }


  main > .loc-m-7 > .block-background > .straight:before{
    border-left-color: var(--main-background-color);
  }
  .loc-s-3-b > .row > div .overflow > .straight:before,
  main > .loc-m-7 > .overflow > .straight:before{
    border-bottom-color: var(--main-background-color);
  }

  main > .loc-m-7 > .block-background > .straight:after{
    border-right-color: var(--main-background-color);
    border-bottom-color: var(--main-background-color);
  }
  .loc-s-3-b > .row > div .overflow > .straight:after,
  main > .loc-m-7 > .overflow > .straight:after{
    border-top-color: var(--main-background-color);
  }

  main > .loc-m-7 > .block-background > .circle:before{
    box-shadow: 0 0 0 100vw var(--main-background-color);
  }
  .loc-s-3-b > .row > div .overflow > .circle:before,
  main > .loc-m-7 > .overflow > .circle:before{
    box-shadow: 0 -23px 0 27px var(--main-background-color);
  }
  .loc-s-3-b > .row > div .overflow > .circle:after,
  main > .loc-m-7 > .overflow > .circle:after{
    background: var(--main-background-color);
  }



  



/*
 * *********************************************************************************************************************
 * Element specific style
 * How do global wells, forms, panels, etc. look like
 * *********************************************************************************************************************
 */
  a:not(.btn):focus,
  a:not(.btn):hover,
  a:not(.btn):hover span {
    cursor: pointer;
    outline: none !important;
    color: var(--main-color);
  }

  .btn,
  .btn:focus{
    outline: none !important;
  }

  .btn.btn-primary{      
    border-color: var(--main-color);
    background-color: var(--main-color);
    color: var(--text-color-in-main);
    border-radius: 4px;
    font-weight: 700;
    font-size: 1.7rem;
    font-family: 'Prompt', sans-serif;
  }

  .btn.btn-primary *{
    color: var(--text-color-in-main);
  }

  .btn.btn-primary.active, 
  .open > .dropdown-toggle.btn-primary,
  .open > .dropdown-toggle.btn-primary:active,
  .open > .dropdown-toggle.btn-primary:focus,
  .btn.btn-primary:active,
  .btn.btn-primary:hover{       
    background-color: var(--main-hover-color);
    border-color: var(--main-hover-color);
    color: var(--text-color-in-main-hover);
  }

  .btn.btn-primary:active *,
  .btn.btn-primary:hover *{       
    color: var(--text-color-in-main-hover);
  }

  .open > .dropdown-toggle {
    outline: none !important;
    border-color: transparent !important;
  }

  .btn.btn-default:not(.fileinput-button){      
    border-color: var(--alternative-bacground-color);
    background-color: transparent;
    color: var(--text-color-in-secondary);
    border-radius: 4px;
    font-weight: 700;
    font-size: 1.7rem;
    font-family: 'Prompt', sans-serif;
  }


  .btn.btn-default:hover,
  .btn-default:active, 
  .btn-default.active, 
  .open > .dropdown-toggle.btn-default,
  .open > .dropdown-toggle.btn-default:hover,
  .open > .dropdown-toggle.btn-default:focus{
    border-color: var(--alternative-bacground-color);
    background-color: var(--text-color-in-alternative-background);
    color: var(--text-color-in-secondary);
  }

  .btn.btn-default:not(.fileinput-button) *,
  .btn.btn-default:hover *,
  .btn-default:active *{
    color: var(--text-color-in-secondary);
  }

  .btn.btn-link{
    color: var(--main-color);
  }

  .btn.btn-scrolltop:hover,
  .btn.btn-scrolltop{
    background: rgb(255,255,255) !important;
    color: var(--main-text-color) !important;
    border: none;
    border-radius: 50% !important;
    padding: 0px 3px;
    left: 50%;
    bottom: 65px;
    transform: translateX(-50%);
    font-size: 20px !important;
    border: 1px solid var(--alternative-bacground-color) !important;
  }

.btn.btn-scrolltop { display/*\**/: table \9; }
@media screen and (min-width:0\0) {
    .btn.btn-scrolltop{
          display: table !important;     
      }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

      .btn.btn-scrolltop{
          display: table !important;       
      }
}

  .btn.btn-scrolltop:hover{
    background: var(--secondary-background-color) !important;
  }

  .btn.btn-scrolltop .icon:before{
    top:3px;
  }

  .btn.block-overlay-toggle{
    background: transparent !important;
    color: var(--main-color) !important;
    padding: 0px;
    border: none;
    height: 40px;
    width: 40px;
    left: auto;
    top: 15px;
    outline: none !important;
    display: inline-block;
    font-size: 50px !important;
    right: 20px;
  }

  .btn.block-overlay-toggle * {
    color: var(--main-color) !important;
  }

  .btn.block-overlay-toggle span:before{
    /*content: "\EA82";*/
    top: -5px;
    right: -3px;
    display: block;
    width: 40px;
    height: 40px;
  }

  .btn.block-overlay-toggle.active{
    right: calc(10% + 12px);
    color: rgb(255,255,255) !important;
  }

  .btn.block-overlay-toggle.active *{
    color: rgb(255,255,255) !important;
  }

   @media(min-width: 920px) {
    .btn.block-overlay-toggle{
      right: 5%;
    }
    .btn.block-overlay-toggle.active{
      right: 25px;
    }
  }

  @media(min-width: 1039px){
    .btn.block-overlay-toggle{
      display: none !important;
    }
  }
 
  .table td,
  .table th{
    font: bold 1.5rem/1.5rem Roboto, sans-serif;
    border-bottom: none !important;
    border-top: 1px solid rgb(221, 221, 221) !important;
  }

  .table td{
    font-weight: normal;
    font-style: normal;
  }

  .table.table-dark td,
  .table.table-dark th{
    color: rgb(255, 255, 255);
  }

  .table .thead-dark th {
    background-color: rgb(28, 29, 30);
    color: rgb(255,255,255);
  }

  .table .thead-light th {
    background-color: rgb(236, 238, 239);
    color: rgb(85,89,92);
  }

  .table-dark {
    background-color: rgb(28, 29, 30);
  }

  .table-dark td, 
  .table-dark th, 
  .table-dark thead th{
    border-color: rgb(236, 238, 239);
  }

  .table-striped tbody tr:nth-of-type(odd){
    background-color : rgb(236, 238, 239);
  }

  .table-dark.table-striped tbody tr:nth-of-type(odd){
    background-color: rgb(0,0,0);
  }

  .table-bordered td,
  .table-bordered th {
    border: 1px solid rgb(221, 221, 221) !important;
  }

  .table-secondary,
  .table-active{
    background: rgb(245,245,245);
  }
  .table-primary,
  .table-success {
    background: rgb(222,240,215);
  }
  .table-info {
    background: rgb(216,237,247);
  }
  .table-danger{
    background:  rgb(242,222,223);
  }
  .table-warning{
    background:  rgb(253,248,227);
  }
  
  .table-dark .table-active {
    background: var(--main-hover-color);
  }
  .table-dark .table-active td, 
  .table-dark .table-active th, 
  .table-dark .table-active thead th{
    color: var(--text-color-in-main-hover);
  }
  .table-dark .table-primary{
    background: var(--main-color);
  }

  .table-dark .table-primary td, 
  .table-dark .table-primary th, 
  .table-dark .table-primary thead th{
    color: var(--text-color-in-main);
  }
  .table-dark .table-success {
    background: rgb(116,176,93) ;
  }
  .table-dark .table-info {
    background: rgb(112,190,219) ;
  }
  .table-dark .table-danger{
    background: rgb(215, 119, 103);
  }
  .table-dark .table-warning{
    background: rgb(238, 152, 0);
  }
  .table-dark.text-dark{
    background: var(--secondary-color);
  }

  .table-dark.text-dark td, 
  .table-dark.text-dark th, 
  .table-dark.text-dark thead th{
    color: var(--text-color-in-secondary);
  }

  .table-dark .table-secondary,
  .table-dark .table-dark.text-dark{
    background: rgb(129, 138, 145);
  }

  form .has-error label {
    color: rgb(203,46,37)  !important;
  }

  form .has-success label {
    color: rgb(68,157,68) !important;
  }

  form .form-control{
    font-size: 1.8rem;
  }

  form .radio label,
  form .checkbox label{
    line-height: 1.8;
  }

  form .form-actions{
    text-align: center;
  }

  form .form-actions > p{
    display: none;
  }

  form .btn:not(.fileinput-button){
    width: calc(50% - 5px);
    margin-bottom: 5px;
  }

  @media (min-width: 1040px) {
    form .btn:not(.fileinput-button) {
      width: calc(50% - 6px);
    }
  }

  @media (min-width: 1380px) {
    form .btn:not(.fileinput-button) {
      width: calc(50% - 8px);
    }
  }

  input,
  select,
  textarea {
    border-radius: 4px !important;
  }

  form .form-group > label,
  form legend{
    font-family: 'Prompt', sans-serif;
  }

  form .form-group > label em{
    display: none;
  }

  .input-group input{
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }

  .input-group .btn.fileinput-button{
    border-top-right-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
  }

  .dropdown-menu {
    min-width: 180px !important;
    padding: 5px 15px;
    background: var(--main-color) !important;
    border: 1px solid var(--main-color) !important;
    margin-top: 0px !important;
  }

  .dropdown-menu a {
    padding: 4px 0px !important;
    background: transparent !important;
    color: var(--text-color-in-main);
    border-bottom: 1px solid var(--text-color-in-main);
    font-weight: 200;
  }

  .dropdown-menu span {
    color: var(--text-color-in-main) !important;
  }

  .dropdown-menu li.active a,
  .dropdown-menu li.active,
  .dropdown-menu li:hover {
    font-weight: 700;
  }

  nav,
  .nav{   
    margin: 0px;
  }

  nav img,
  .nav img {
    max-height: 12px !important;
  }
  
  nav ul {
    list-style: none;
    padding: 0px;
  }

  nav > li.active > a,
  .nav > li.active > a,
  nav > li > a,
  .nav > li > a {
    color: var(--secondary-text-color) !important;
    font-size: 1.8rem;
    line-height: 1.1875rem;
    font-weight: 400;
    border: 1px solid transparent;
    white-space: nowrap;
  }

  .nav.navbar-nav{
    float: right;
  }
  .nav.navbar-nav > li > a{
    min-height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Prompt', sans-serif;
    font-weight: 700 !important;
    padding: 6px 10px;
    font-size: 1.2rem;
    white-space: nowrap;
  }

  .nav.navbar-nav > li > a,
  .nav.navbar-nav > li > a span{
    color: var(--main-text-color) !important;
    outline: none !important;
  }

  .nav.navbar-nav > li.open,
  .nav.navbar-nav > li.active{
    background: var(--main-color) !important;
  }
  
  .navbar-nav > li.open > a,
  .navbar-nav > li.active > a{
    background: var(--main-color) !important;
    border: 1px solid var(--main-color);
    color: var(--text-color-in-main) !important;
  }
  
  .navbar-nav > li.open > a span,
  .navbar-nav > li.active > a span{
    color: var(--text-color-in-main) !important;
  } 

  .list > li > a {
    padding: 6px 12px;
    width: 100%;
    display: inline-block;
  }

  .list-inline > li li > a,
  .list > li li > a{
    padding-top: 10px;
    width: 100%;
    display: inline-block;
  }

  .list li {
    border-bottom: 1px solid;
  }

  .list-inline{
    text-align: right;
  }

  .list-inline li {
    vertical-align: text-bottom;
  }

  .list-inline > li > a{
    padding: 0 0 0 10px;
    font-weight: 300;
  }

  .list-inline > li + li:before{
    content: "|";
  }

  .badge,
  .label {
    padding: 6px 12px;
    font-size: 1.8rem !important;
  }

  .jumbotron{
    background-color: rgb(236, 238, 239);
  }

  .jumbotron p{
    font-size: 1.8rem;
    line-height: 2.3rem; 
  }

  hr {
    border-top: 1px solid rgb(221, 221, 221);
  }

  .thumbnail {
    padding: 0px;
    border: none;
    margin-bottom: 0px !important;
  }

  @media(max-width: 767px){
    .images-thumbnails-container > .row > div{
      width: 100% !important; 
    }

    .thumbnail{
      min-height: auto !important;
    }
  }

  .thumbnail > .image-container {
    position: relative;
    margin-bottom: 15px;
  }

  .thumbnail .image-container:after{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: var(--main-color-opacity);
    transition: all .3s ease-out;
  }

  .thumbnail:hover .image-container:after{
    display: none;
    transition: all .3s ease-out;
  }

  .thumbnail img{
    object-fit: cover;
  }

  .thumbnail h4{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-weight: 500;
    color: var(--text-color-in-main);
    z-index: 3;
    width: 100%;
    text-align: center;
    padding: 6px;
    pointer-events: none;
    font-size: 3.1rem !important;
    line-height: 1.2;
    margin:0px;
  }

  .thumbnail:hover h4{
    color: var(--main-color);
    text-shadow: 0px 0px 4px rgb(0,0,0), 0px 0px 4px rgb(0,0,0),0px 0px 4px rgb(0,0,0);
  }

  .thumbnail .caption{
    color: var(--secondary-text-color);
    text-align: center;
  }  
  .thumbnail .caption p + p{
    margin-bottom: 0px;
  }

  .thumbnail .btn{      
    border-color: transparent !important;
    background-color: transparent;
    color: var(--secondary-text-color-text-color);  
    position: relative;   
    padding-left: 30px;
    margin-top: 10px;
    font-size: 2rem !important;
  }

  .thumbnail .btn:active,
  .thumbnail .btn:hover{       
    background-color: transparent;
    border-color: transparent;
    color: var(--main-color); 
  }

  .thumbnail .btn:before {
    content: "\EA4B";
    font-family: "toolkit-entypo";
    font-size: 10px;
    position: absolute;
    width: 20px;
    height: 19px;
    padding-left: 1px;
    padding-top: 2px;
    left: 0px;
    top: 13px;
    background: var(--alternative-bacground-color);
    color: var(--text-color-in-alternative-background);
    border-radius: 50%;
  }

  .thumbnail .btn:active:before,
  .thumbnail .btn:hover:before{ 
    background: var(--main-color); 
  }

  .progress{
    margin: 0px;
  }

  .progress{
    background: rgb(236, 238, 239);
  }

  .progress-bar{
    background-color: var(--main-color);
  }

  .panel{
    text-align: center;
    padding-bottom: 28px !important;
    margin-bottom: 25px;
  }

  .panel-heading,
  .panel{
    background: transparent !important;
    border: none;
    padding: 0;
  }

  .panel-heading .image-container{
    position: relative;
  }

  .panel-heading .image-container:hover span.overflow:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 2;
    background: var(--main-color-opacity);
  }

  .panel .label{
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    border-color: var(--main-color);
    background-color: var(--main-color);
    color: var(--text-color-in-main);
    border-radius: 4px;
    font-weight: 700;
    font-size: 1.7rem !important;
    padding-top: 8px;
    padding-bottom: 7px;
    font-family: 'Prompt', sans-serif;
    cursor: pointer;
  }

  @media(max-width: 919px){
    .panel{
      margin-bottom: 45px;
    }
    .panel .label{
      position: absolute;
      bottom: -20px;
    }
  }

  .panel .label:hover{       
    background-color: var(--main-hover-color);
    border-color: var(--main-hover-color);
    color: var(--text-color-in-main-hover);
  }

  .panel .panel-body p{
    pointer-events: none;
  }

  .panel .panel-title{
    font-size: 2rem !important;
    color: var(--main-color);
    margin-top: 20px;
  }

  .panel img{
    object-fit: cover;
    margin: 0px auto !important;
  }

  .well{
    background-color: transparent;
    padding: 0px;
  }

  .well * {
    color: var(--text-color-in-main);
  }

  .well a:not(.btn),
  .well .btn-link{
    color: var(--text-color-in-main) !important;
    text-decoration: underline;
  }

  .well .btn-primary{
    background-color: var(--text-color-in-main) !important;
    border-color: var(--text-color-in-main) !important;
    color: var(--main-color) !important;
  }

  .well .btn-primary:hover,
  .well .btn-primary:focus{
    border-color: var(--secondary-background-color) !important;
    background-color: var(--secondary-background-color) !important;
  }

  .well .btn-primary *{
    color: var(--main-color) !important;
  }

  .well .btn.fileinput-button {
    background: var(--main-color);
  }

  .well hr{
    border-color: var(--text-color-in-main);
  }

  .well h1, 
  .well .h1, 
  .well h2, 
  .well .h2, 
  .well h3, 
  .well .h3 {
    margin-top: 16px;
  }

  .modal-dialog{
    margin-left: auto;
    margin-right: auto;
  }

  .modal-content{
    padding: 30px;
    border: 0px;
  }

  .modal-content .close-modal{   
    position: absolute;
    top: 12px;
    right: 12px;
    font-weight: 700;
    font-size: 2.5rem;
    color: rgb(129, 138, 145);
    cursor: pointer;
  }

  .modal-content .close-modal:before{
    content: "\1F5D9";   
  }

  .modal-header,
  .modal-body{ 
    border: none;
    padding: 0px 0px 10px 0px;
  }

  .modal-footer {
    padding-right: 0px;
    padding-left:  0px;
  }

  .modal-title{
    font-size: 2.1rem;
    line-height: 1.5rem;
    font-weight: 700;
  }

   #loader .modal-content{
    padding: 0px;
  }

  #loader.modal .modal-body {
    border:none;
    padding:20px;
    display: flex;
  }

  #loader.modal .modal-body > img{
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  .carousel-indicators li{
    border-color: var(--text-color-disable);
    background-color: var(--text-color-disable);
  }
  .carousel-indicators li.active{
    border-color: var(--main-color);
    background-color: var(--main-color);
  }
  .carousel-control{
    opacity: 1;
  }
  .carousel-control span{
    color : var(--text-color-disable) !important;    
  }
  .carousel .icon-chevron-thin-left, 
  .carousel .icon-chevron-thin-right{
    margin-top: 0px;
    transform: translateY(-50%);
  }     
  .carousel .icon-chevron-thin-left:before {
    /*content: "\1F850";  */  
    color: var(--main-color);
  }
  .carousel .icon-chevron-thin-right:before {
   /* content: "\1F852";*/
    color: var(--main-color);
  }

  .carousel-caption{   
    position: absolute;
    width: 50%;
    height: auto;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;     
    padding: 20px 5%;
    background: transparent;
    min-height: max-content;
  }

  .carousel-caption a:hover,
  .carousel-caption a,  
  .carousel-caption .btn,
  .carousel-caption {
    color: rgb(255,255,255);
    text-decoration: none !important;
    word-wrap: break-word;
    white-space: normal;
  }
  
  .carousel-caption .btn{
    width: fit-content;
    color: var(--main-color);
    background: var(--text-color-in-main);
    border-color: var(--text-color-in-main);
  }

  .carousel-caption p{
    line-height: 1.5rem !important;
    word-wrap: break-word;
    white-space: normal;
    word-break: break-word;
  }

  .carousel-caption h4,
  .carousel-caption h4 a{
    color: var(--text-color-in-main) !important;
    font-size: 2.675rem !important;
    line-height: 2.1875rem;
    font-weight: 500;
    margin-bottom: 15px;
    word-wrap: break-word;
    white-space: normal;
    word-break: break-word;
  }

  @media (max-width: 767px){
    .carousel-caption{ 
      padding: 10px 15px; 
    }
    .carousel-caption h4,
    .carousel-caption h4 a{
      margin-bottom: 5px;
    }
    .carousel-caption .btn{
      margin-top: 5px;
    }
  }

  @media print {

    a[href]:after {
      content: none !important;
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    
    .btn:not(.btn-block){
        display: none !important;
    }
   
    .colorbox + img{
      display: none !important;
    }

    *,
    *:before,
    *:after,
    *:first-letter,
    p:first-line,
    div:first-line,
    blockquote:first-line,
    li:first-line {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    table{ 
      border-collapse:collapse; 
    } 
    tr td{ 
      page-break-inside: avoid; white-space: nowrap; 
    } 

    thead {
      display: table-row-group;
    }
    
  }

/*
 * *********************************************************************************************************************
 * Element on location specific style
 * How do global wells, forms, panels, etc. look like on a specific location
 * *********************************************************************************************************************
 */
  .block-background img{
    width: 100%;
    height: max-content;
    object-fit: cover;
  }

  @media(max-width: 919px){
    .block-background img{
      object-fit: contain !important;
    }
  }

  .loc-s-2 .nav-pills{
    padding: 0px 12px;
    margin-bottom: 40px;
    font-family: arial;
  }

  .loc-s-2 .nav-pills .caret {
    float: right;
    margin-top: 6px;
  }

  .loc-s-2 .nav-pills li{
    border:none !important;
  }

  .loc-s-2 .nav-pills > li > a{
    font-weight: 700;
  }

  .loc-s-2 .nav-pills a {

    padding: 14px 0px;
    border-bottom: 1px solid var(--text-color-in-main) !important;
    text-decoration: none !important;    
  }

  .loc-s-2 .nav-pills li a,
  .loc-s-2 .nav-pills li a span {
    color: var(--text-color-in-main) !important;
    background: none !important;
    white-space: normal;
  }

  .loc-s-2 .nav-pills li.open ul {
    display: contents;
  }
  
  .loc-s-2 .dropdown-menu li,
  .loc-s-2 .dropdown-menu {
    background: transparent !important;
  }

  .loc-s-2 .dropdown-menu li{
    padding-left: 20px;
  }

  .loc-s-2 .dropdown-menu >li:first-child{
    margin-top: 15px;
  }

  .loc-s-2 .dropdown-menu >li:last-child{
    margin-bottom: 15px;
  }

  .loc-s-2 .dropdown-menu a{
     padding: 5px 0px !important; 
     font-weight: 300;
     line-height: 1.2;
     display:block;
  }

.loc-s-2 .dropdown.open .dropdown-backdrop{
     display:none !important;
}

  .loc-s-2 .btn{
    width: 100%;
  }

  .loc-s-3 .close{
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 4rem;
    font-weight:300;
    padding: 0px;
    margin: 0px;
    color: rgb(255,255,255);
    opacity: 1;
    width: 35px;
    height: 35px;
    line-height: 0;
    outline: none !important;
  }


  @media(max-width: 920px){
    .loc-s-3 .close{
      top: 6px;
      right: calc(5% - 8px);
    }
  }

  @media(max-width: 920px){
    .loc-s-3 .close{
      top: 6px;
      right: 5%;
    }
  }

  @media(max-width: 767px){
    .loc-s-3 .close{
      top: 6px;
      right: 4px;
    }
  }

  .loc-s-3 form .form-group > label{
    display: none;
  }

  .loc-s-3 .well .btn-primary{
    border: 1px solid var(--main-color) !important;
    background-color: var(--main-color) !important;
    color: var(--text-color-in-main) !important;
    padding-bottom: 4px;
  }
  .loc-s-3 .well .btn-primary * {
    color: var(--text-color-in-main) !important;
  }

  .loc-s-3 .well .btn-primary:focus,
  .loc-s-3 .well .btn-primary:hover{
    background-color: var(--main-hover-color) !important;
    border-color: var(--main-hover-color) !important;
    color: var(--text-color-in-main-hover) !important;
  }

  .loc-s-3 .well .btn-primary:focus,
  .loc-s-3 .well .btn-primary:hover{
     color: var(--text-color-in-main-hover) !important;
  }

  .loc-s-3 .well .btn-default{
    border: 1px solid var(--secondary-color);
    background-color: var(--secondary-color);
    color: var(--text-color-in-secondary);
    padding-bottom: 4px;
  }

 .loc-s-3 form input{
    width: calc(50% - 5px);
    margin: auto;
  }

 @media (min-width: 1040px) {
    .loc-s-3 form input {
      width: calc(50% - 6px);
    }
  }

 @media (min-width: 1380px) {
    .loc-s-3 form input {
      width: calc(50% - 8px);
    }
  }

  .loc-s-6 .btn-primary{
    border: 1px solid var(--text-color-in-main);
    background-color: var(--text-color-in-main);
    color: var(--main-color);
  }

  .loc-s-6 .btn-default{
    background-color: var(--secondary-color);
  }

  .loc-s-6 .close {
   position: absolute;
   right: 7px;
   top: calc(50% - 13px);
   z-index: 20;
  }

  .block-background img{
    height: 100%;
    object-fit: cover;
  }

  .loc-m-3 .btn.btn-default:not(.fileinput-button){
    background: var(--secondary-background-color);
  }

  .loc-m-3 .btn.btn-default:not(.fileinput-button):hover{
    background: rgb(255,255,255);
  }


  .loc-s-7 p,
  .loc-s-7 .nav,
  .loc-s-7 .nav ul,
  .loc-s-7 nav,
  .loc-s-7 nav ul{
    margin: 0px;
  }

  .loc-s-7 .nav,
  .loc-s-7 nav{
    margin: 0px;
  }

  .loc-s-7 .nav > ul > li > a,
  .loc-s-7 nav > ul > li > a{
    font-weight:700;
  }

  .loc-s-7 .list-inline li{
    padding-top: 1px;
  }
  .loc-s-7 .list li:first-child{
    padding-top: 0px;
  }
  .loc-s-7 .nav .open:focus > a,
  .loc-s-7 .nav .open:hover > a,
  .loc-s-7 .nav .open > a:focus,
  .loc-s-7 .nav .open > a {
    border-color: transparent;
  }

  .loc-s-7 *:not(.btn):not(a){
    color : var(--text-color-in-alternative-background);
  }

  .loc-s-7 form .btn-default {
    color: var(--text-color-in-alternative-background) !important;
    border-color: var(--text-color-in-alternative-background);
  }

  .loc-s-7 form .btn-default:hover {
    color: var(--text-color-in-secondary) !important;
    border-color: var(--secondary-color);
  }
      
  .loc-s-7 form .btn-primary abbr{
    color: var(--text-color-in-main) !important;
  }

  .loc-s-7 form .btn-primary:hover abbr{
    color: var(--text-color-in-main-hover) !important;
  }

  .loc-s-7 hr{
    border-top: 1px solid var(--text-color-in-alternative-background) !important;
  }

  .loc-s-7 h2, 
  .loc-s-7 h2 span,
  .loc-s-7 h4, 
  .loc-s-7 h4 span,
  .loc-s-7 h6, 
  .loc-s-7 h6 span,
  .loc-s-7 .lead {
    color: rgb(181, 182, 183) !important;
    margin: 0px !important;
  }

  .loc-s-7 h1,
  .loc-s-7 h1 span,
  .loc-s-7 h3,
  .loc-s-7 h3 span,
  .loc-s-7 h5,
  .loc-s-7 h5 span{
    margin:  0px !important;
  }

  .loc-s-7 a:not(.btn):focus, 
  .loc-s-7 a:not(.btn):hover, 
  .loc-s-7 a:not(.btn):hover span {
    color: var(--text-color-in-alternative-background);
  }

  .loc-s-7-a > .row > div:not(:first-child) *{
    color: rgb(181, 182, 183) !important;
    font-weight: 100 !important;
  }

@media(max-width:500px){
  .loc-s-7-a > .row > div:not(:first-child) *{
    font-size: 1rem !important;
  }
}


   
/*
 * *********************************************************************************************************************
 * Entity specific style
 * How do specific wells, forms, panels, etc. in specific entities look like
 * *********************************************************************************************************************
 */
  .entity-article .btn {
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 1.57;
  }
  .entity-article a:not(.btn) {
    color: var(--main-color);
  }

  .entity-article .btn-link{
    padding: 0px 0px 3px 0px;
  }

  .entity-infolist.entity-infolist-panels-horizontal-2 .panel,
  .entity-imagelist.entity-imagelist-thumbnails .thumbnail{
    min-height: auto !important;
  }

  .entity-imagelist.entity-imagelist-thumbnails > .images-thumbnails-container > .row > div:last-child .thumbnail{
    margin-bottom: 0px !important;
  }

  .entity-infolist.entity-infolist-panels-horizontal-2 .panel{
    padding-bottom: 0px !important;
  }
 

  
/*
 * *********************************************************************************************************************
 * Element and entity specific style for specific locations
 * How do specific wells, forms, panels, etc. in specific entities on specific locations look like
 * *********************************************************************************************************************
 */

  .loc-s-3 .entity-article{
      padding: 0px 60px;
  }

  .loc-s-3 .entity-webform{
      padding: calc(1vw + 20px) 60px 0px 60px;
  }
  @media(max-width: 1023px){
    .loc-s-3 .entity-webform,
    .loc-s-3 .entity-article{
      padding-left: 50px;
      padding-right: 50px;
    }
  }

  @media(max-width: 920px){
    .loc-s-3 .entity-webform,
    .loc-s-3 .entity-article{
      padding-left: 40px;
      padding-right: 40px;
    }
  }

  @media(max-width: 767px){
    .loc-s-3 .entity-webform,
    .loc-s-3 .entity-article{
      padding-left: 20px;
      padding-right: 20px;
    }
  }

  .loc-s-3 .entity-article p{
    margin: 0px;
  }

  .loc-s-3 .entity-imagelist img{
    width: 100%;
    object-fit: cover;
  }

  .loc-s-3 .container-fluid .entity-imagelist{
    margin: 0px;
  }

  .loc-s-6 .entity-article a:not(.btn),
  .loc-s-6 .entity-article .btn-link {
    color: var(--text-color-in-alternative-background);
    text-decoration: underline;
  }

  .loc-s-6 .entity-article .btn:not(.btn-link) {
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .loc-s-6 .entity-article .btn-link{
    padding-bottom: 3px;
  }

  header .entity-imagelist.entity-imagelist-random{
    margin-bottom: 0px;
  }
 
  header .parallax .entity-article{
    padding: 20px 0;
    max-width:100%;
  }
  @media(max-width:919px){
     header .parallax .entity-article{
         max-width:100vw;
         width: auto;
     }
  }

  .loc-h-2 .entity-imagelist img,
  .loc-h-2 .entity-article img{
    max-height: 70px;
    min-height: 70px;
    object-fit: contain;
    width: auto;
  }

  @media(max-width: 1039px){
    .loc-h-2 .entity-imagelist img,
    .loc-h-2 .entity-article img{
      max-width: 40vw;
      height: 70px;
      padding: 6px 0px;
    }
  }

  .loc-h-2 .entity-article {
    min-height: 70px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  
  .loc-h-2 .entity-article p {
    margin: 0px;
  }

  .loc-h-4 .entity-article p{
    line-height: 1;
    margin: 0;
  }
  .loc-h-4 .entity-article h4{
    line-height: 0.4;
  }

  .loc-h-4 .entity-article-default .btn-link,
  .loc-h-4 .entity-article-default *:not(.btn){
    color:rgb(0,0,0);
  }

  .loc-h-4 .entity-article-default{
    background-image: radial-gradient(rgb(255 255 255) 25%, rgb(255 255 255 / 90%) 34%, rgb(255 255 255 / 72%) 48%, rgb(255 255 255 / 64%) 53%, rgb(255 255 255 / 32%) 66%, rgb(255 255 255 / 8%) 70%, rgb(255 255 255 / 0%) 72%, rgb(255 255 255 / 0%) 100%);
    /*background-image: radial-gradient(#fff 30%, #ffffffe6 40%, #ffffffb8 48%, #ffffffa8 55%, #ffffff52 66%, #ffffff14 70%, #ffffff00 72%, #ffffff00 100%);*/
    margin: auto;
    min-height: 158px;
    display: flex;
    align-items: center;
    max-width: 100%;
    padding: 20px 70px !important;
  }

  @media(min-width: 768px){
    .loc-h-4 .entity-article-default{
      padding: 30px 70px !important;
      width: max-content;
    }
  }

 @media(max-width: 500px){
    .loc-h-4 .entity-article-default{
      padding: 20px 30px !important;
    }
  }

  .loc-h-4 .entity-article-default .btn{
    text-shadow: none;
  }
  .loc-s-7 .entity-menu.entity-menu-list-horizontal,
  .loc-s-7 .entity-article{
      margin-left: 0px !important;
      margin-right: 0px !important;
  }
  .loc-s-7 .entity-menu.entity-menu-list-horizontal nav{
    min-height: 30px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    white-space: nowrap;
  }

  @media(max-width: 919px){
    .loc-s-7 .entity-menu.entity-menu-list-horizontal nav{
      justify-content: flex-start;
      white-space: normal;
    }
    .loc-s-7 .entity-menu.entity-menu-list-horizontal nav > ul{
      text-align: left;
    }
  }

  .loc-s-7 .entity-menu.entity-menu-list-horizontal nav > ul > li:first-child,
  .loc-s-7 .entity-menu.entity-menu-list-horizontal nav > ul > li:first-child > a{
    padding-left: 0px;
  }

  .loc-s-7 .entity-menu.entity-menu-list-horizontal nav > ul > li:last-child,
  .loc-s-7 .entity-menu.entity-menu-list-horizontal nav > ul > li:last-child > a{
    padding-right: 0px;
  }

  .loc-s-7-a > .row > div:not(:first-child) .entity-article{
    text-align: left;
    min-height: 30px;
    display: flex;
    align-items: center;
  }
  .loc-s-7-a > .row > div:not(:first-child) .entity-article .btn-default{
    background: var(--secondary-color);
  }
  .loc-s-7-a > .row > div:not(:first-child) .entity-article *{
    font-weight: 300;
  }
  .loc-s-7-a > .row > div:not(:first-child) *{
    font-size: 1.5rem;
  }

  .loc-h-2 .entity-article .btn{
   font-size: 1.2rem;
 }