html {scroll-behavior: smooth; scroll-padding-top: 90px}       
body {color: #000000; font-family: 'Inter', sans-serif!important;}   
a {color:#252f3f; text-decoration: none}
h1 {color: #000000}
h2 {color: #000000}

.nav-link {color:#252f3f; font-size: 16px; font-weight: 500;}
        
header {
    width:100%;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background: hsla(0,100%,100%,.8);
    box-shadow: 0px 0px 10px rgba(0,0,0,.06);
    position: fixed;
    z-index: 999;
    }
        
        
    ul li {font-size: 1.25rem;font-weight: 300;}
 
    .logo {}
    .logo p {font-weight: 500; margin-top: 5px;}    
    .logo a {margin-top:4px;}
    .logo a i {margin-top: 2px;font-size: 25px; color: #F581BE;}
    .logo a span {font-family: 'Poppins'; font-weight: 700; display: block; text-transform: uppercase; font-size: 20px;}
    .logo small {font-size: 8px; font-weight: 300; margin-top:-5px; margin-left: 89px; display: block; text-align:left; text-transform: uppercase;}
    .logo small span {font-weight: 400}
           
    .references {background: #fff;display: block;}
    .references h6 {font-size: 20px;font-weight: 400;text-align: center; line-height: 150%!important; margin-bottom: 45px;}
    .references .reference {text-align: center;}  
    .references .reference img {padding: 0 20px; height: 52px;}
        
    .menu-buttons {text-align:right; font-weight: 500;}
    .menu-buttons .button-one {padding: 8px 25px; background-color: #000000; color: white; border-radius: 20px; display: inline-block; font-size: 14px; margin-right: 15px;}
    .menu-buttons .button-two {padding: 8px 25px; background-color: #F581BE; color: white; border-radius: 20px; display: inline-block; font-size: 14px; box-shadow: 0 0 0 4px #f185be4f;}  
    .menu-buttons .button-two:hover {
      box-shadow: 0 0 0 6px #f185be4f;
      transition: 0.7s;
  }
        
    .main-banner {} 
    .main-banner h2 {font-weight: 900; font-family: 'Poppins'; text-transform: uppercase; -webkit-text-stroke: 1px #000; color: transparent;font-size: 70px; margin: 0;}
    .main-banner h3 {font-weight: 900; font-family: 'Poppins'; text-transform: uppercase; color: #000; font-size: 70px; margin: 0;}
    .main-banner h4 {font-weight: 500; font-size: 22px; margin: 20px 0 10px 0;}
    .main-banner p {font-weight: 300; font-size: 18px; margin: 0; width: 90%;}
    .main-banner p a {padding: 8px 25px; background-color: #F581BE; color: white; border-radius: 20px; display: inline-block; font-size: 16px; margin: 30px 0 0 0; font-weight: 500; box-shadow: 0 0 0 4px #f185be4f;}
    .main-banner p a:hover {background-color:#F581BE;transition: 0.7s; box-shadow: 0 0 0 6px #f185be4f;}
    .main-banner .full-width-bg {background-image: url(../img/bg-optimized.webp); background-position: center; background-size: cover; height: 100vh;}
        
    .feature-block {background: #fff;display: block; padding: 100px 0 100px 0;}
    .feature-block p {font-size: 16px; font-weight: 300; line-height: 175%;}
    .feature-block ul {list-style: none;} /* Remove default bullets */
    .feature-block ul li {font-size: 18px; font-weight: 300;} 
    .feature-block ul li::before {
    content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
    color: #F581BE; /* Change the color */
    font-weight: bold; /* If you want it to be bold */
    display: inline-block; /* Needed to add space between the bullet and the text */
    width: 1em; /* Also needed for space (tweak if needed) */
    margin-left: -1em; /* Also needed for space (tweak if needed) */
    }
        
    .feature-block a {}
    .feature-block p a {color: #fe42a5;} 
    .feature-block h1 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px; margin-bottom: 20px;}  
    .feature-block h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px; margin-bottom: 20px;}  
    .feature-block h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase;}  
    .feature-block img {width: 100%; border-radius: 50%; padding: 25px 25px 25px 0;}
    .feature-block .img-right {padding: 25px 0 25px 25px;}
    .feature-block .button {padding: 8px 25px; background-color: #F581BE; color: white; border-radius: 30px; display: inline-block; font-size: 16px; margin: 10px 0 0 0; font-weight: 500; box-shadow: 0 0 0 4px #f185be4f;}
    .feature-block .button:hover {background-color:#F581BE;transition: 0.7s; box-shadow: 0 0 0 6px #f185be4f;}
        
.my-services {padding: 20px 0 60px 0;}
.my-services h4 {font-size: 24px; font-weight: 500; padding: 0 0 5px 0;}
.my-services h5 {font-size: 16px; font-weight: 300; padding: 0 0 5px 0; line-height: 150%; width: 80%} 
.my-services p a {font-size: 16px; font-weight: 300; color: #fe42a5; } 
.my-services i {font-size: 50px; color: #000;} 
.my-services .headline {padding: 0 0 50px 0;} 
.my-services .headline h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px; margin-bottom: 20px;}
.my-services .headline h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase;}  
.my-services .desktop-separator {margin-top: 60px;}



.reviews {padding: 20px 0 60px 0;}
.reviews .headline {padding: 0 0 50px 0;} 
.reviews .headline h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px;}
.reviews .headline h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase;}  
.reviews .review-item {width: 100%; box-shadow: 1px 1px 7px 0px rgba(0, 0, 0, 0.09), 0px 0px 2px 0px rgba(0, 0, 0, 0.05); border-color: #ffffff;border-radius: 8px; padding: 25px;position: relative;top: 0;transition: top ease 0.5s;}
.reviews .review-item:hover {top: -5px;}
.reviews .review-item .navn {font-weight: 700; margin:0; font-size: 16px;}
.reviews .review-item .dato {font-weight: 300; margin:0; font-size: 12px;}
.reviews .review-item .scroll-box {margin: 20px 0 0 0;
display: -webkit-box;
    line-height: 23.2px;
    height: 116px;
    font-size: 16px;
    text-align: left;
    transition: height 0.5s;
    font-style: normal;
    -webkit-line-clamp: 5;
    overflow: hidden;
    overflow: auto !important;
    overflow-x: hidden !important;
    padding-right: 20px;
}

.reviews .review-item .scroll-box .message {font-weight: 300; margin:0; font-size: 16px;}

::-webkit-scrollbar {
    width: 4px;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb {
    background: rgba(180, 180, 180, 0.6);
}
::-webkit-scrollbar-track {
    background: rgba(180, 180, 180, 0.1);
}

.headline {padding: 0 0 50px 0;} 
.headline h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px;}
.headline h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase;}  

.articles {padding: 20px 0 60px 0;}
.article {box-shadow: 1px 1px 7px 0px rgba(0, 0, 0, 0.09), 0px 0px 2px 0px rgba(0, 0, 0, 0.05);border-color: #ffffff;border-radius: 8px; margin-bottom: 20px;}
.article-top {width: 100%; height: 160px; background-size: cover!important; border-top-left-radius: 8px;border-top-right-radius: 8px;}
.article-content {padding: 25px 25px 10px 25px;}
.tag {
    background-color: #ffcbe6;
    width: fit-content;
    padding: 2px 9px;
    font-size: 10px;
    border-radius: 15px;
    margin: 2px 0 8px 0;
}
.article-content a {font-size: 14px; font-weight: 500;}


/*
.testamonials .testamonial p {margin:0; padding: 0; font-weight: 300;}
.testamonials .testamonial p i {color: #e4e4e4;margin-right: 5px;}
.testamonials .person {margin-top: 25px;}
.testamonials .person p {margin: 0px; padding:0; font-weight: 300;}
.testamonials .person p strong {font-weight: 500;}
    
.testamonials {padding: 20px 0 60px 0;}
.testamonials .headline {padding: 0 0 50px 0;} 
.testamonials .headline h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px;}
.testamonials .headline h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase;}  
.testamonials .testamonial {width: 100%; border: 2px solid rgba(0,0,0,.07); padding: 0 15px;}
.testamonials .testamonial:before {
    position: relative;
    content: "";
    height: 0px;
    width: 0px;
    top: 160px;
    left: 30px;
    border: solid transparent;
    border-top-color: rgba(0,0,0,.07);
    border-width: 18px 18px 0px 0px;
}
.testamonials .testamonial:after {
    position: relative;
    content: "";
    top: 36px;
    left: 30px;
    height: 0px;
    width: 0px;
    border: solid transparent;
    border-top-color: #fff;
    border-width: 14px 13px 0px 0px;
    margin-left: 2px;
}   
.testamonials .testamonial p {margin:0; padding: 0; font-weight: 300;}
.testamonials .testamonial p i {color: #e4e4e4;margin-right: 5px;}
.testamonials .person {margin-top: 25px;}
.testamonials .person p {margin: 0px; padding:0; font-weight: 300;}
.testamonials .person p strong {font-weight: 500;}
*/

main {padding: 60px 0;}
main .text {margin-right: 40px;}
main .text .headline {padding: 0 0 10px 0;} 
main .text .headline h2 {font-family: 'Poppins';position: relative;color: #000;font-size: 36px;font-weight: 900;z-index: 100; text-transform: uppercase; margin-top: -57px; margin-bottom: 20px;}
main .text .headline h3 {font-family: 'Poppins';position: relative;color: transparent;font-size: 100px;font-weight: 900; opacity: .1; line-height: 1; max-width: 100%; overflow: hidden;white-space: nowrap;-webkit-text-stroke: 1px #000;-webkit-user-select: none;z-index: 1; text-transform: uppercase; margin-top: 0px; padding-top:0px;}  
main .text h2 {font-size: 36px; font-weight: 700; margin-bottom: 12px;line-height: 150%;}
main .text h3 {font-size: 28px; font-weight: 700; margin-bottom: 12px;line-height: 150%; margin-top: 25px;}
main .text h4 {font-size: 16px; font-weight: 500; margin-bottom: 12px;line-height: 150%;}
main .text p {font-size: 16px; font-weight: 300; margin-bottom: 12px;line-height: 175%;} 
main .text a {color: #F581BE;} 
main .text ol {font-weight: 500; padding: 0 0 0 20px;}
main .text ol li {font-weight: 500;font-size: 16px; margin-bottom: 12px;line-height: 175%; list-style-type: decimal;}
main .text ol li p {font-weight: 500;}
main .text ul li {font-size: 16px; font-weight: 300; margin-bottom: 12px;line-height: 175%; list-style-type: disc;}       
main .text .related-links {padding: 20px 0;}
main .text .related-links h5 {font-weight: 400;font-size: 18px; padding: 20px 0 0 0;}
main .text .related-links p {margin-bottom: 0px; padding: 20px 0 0 0;}
main .text .related-links hr {color: #f1f1f1; opacity: 1; margin: 20px 0;}
main .text .related-links .top {margin: 0 0 20px 0;}
        
.section-nav {position: sticky;top: 90px;align-self: start;}
.section-nav li.active > a {color: #333;font-weight: 500;}
.section-nav {padding: 0;border: 0px solid #f1f1f1}
.section-nav a {text-decoration: none;display: block;padding: .125rem 0;color: #ccc;transition: all 50ms ease-in-out;}
.section-nav a:hover, .section-nav a:focus {color: #666;}
.section-nav ul, ol {list-style: none;margin: 0;padding: 0;}
.section-nav ol li {border-left: 5px solid #e0e0e0; padding: 6px 0 6px 15px;}
.section-nav ol li.active {border-left: 5px solid #F581BE; font-weight: 500; background-color: #f9f9f9;}
.section-nav h5 {font-size: 20px; font-weight: 500; padding: 10px 0 10px 20px; }

.faq {margin: 30px 0}
.faq .top {border-top: 1px solid #f1f1f1;}
.faq .faq-link {display:block; font-size: 20px; font-weight: 400; border-bottom: 1px solid #fff; width: 100%; padding: 30px 0; border-bottom: 1px solid #f1f1f1;}
.faq .faq-link i {margin-top: 4px;}    
.faq .right {text-align: right;}
.faq .card-body {border-radius: 0px; border: 0px solid #f1f1f1; font-size: 16px; padding: 0; padding: 20px 0;}
.faq .card-body p {font-weight: 300; padding-top: 5px;}
.faq .card-body p a {color: #F581BE;}
.faq .card-body ul li {font-size: 16px; font-weight: 300; padding-top: 5px;}

/* PURE css solution for rotating carets based on expanded section */
.icon-toggle i {
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}
.icon-toggle i[aria-expanded='true'] {
    transform: rotate(180deg);
    transition: .25s ease-in-out;
}
.icon-toggle i[aria-expanded='false'] {
    transform: rotate(180deg);
    rotate: 180deg;
    transition: .25s ease-in-out;
}
        
.get-in-touch {padding: 40px 0 30px 0;}
.get-in-touch h5 {font-size: 24px; font-weight: 500; padding: 0 0 5px 0;}
.get-in-touch h6 {font-size: 16px; font-weight: 300; padding: 0 0 5px 0;} 
.get-in-touch p a {font-size: 16px; font-weight: 300; color: #F581BE;} 
.get-in-touch i {font-size: 50px; color: #000000;} 
.get-in-touch hr {color: #d3d1dc;}   
        
.selling-points {background-color: #000000; padding: 40px 0 0 0;}
.selling-points h5 {font-size: 20px; font-weight: 700; color: #fff; text-transform: uppercase;}
.selling-points h6 {font-size: 15px; font-weight: 300; color: #ffcbe6;} 
  
footer {background-color: #000000;}
footer ul {padding-left: 0;margin-bottom: 0;list-style: none;}
footer ul li {}
footer ul li h6 {font-size: 13px; color: white; font-weight: 400}        
footer ul li a {font-size: 13px; color: white; font-weight: 100}
        
footer .right {text-align: right;}
  
.email-collector {text-align: right;}        
.email-collector h6 {font-size: 14px; color: white; font-weight: 400}
.email-collector p {font-size: 14px; color: white; font-weight: 100}
.email-collector input {max-width: 250px;font-size: 12px; border: 1px solid #d3d1dc; background: transparent; height: 32px; line-height: 1.42857143; padding: 0 9px; vertical-align: baseline; width: 100%; box-sizing: border-box;opacity:0.25;}

::placeholder {
  color: white;
  opacity: 1; /* Firefox */
}        
        
        
.footer-first {padding: 30px 0 25px 0}
.footer-second {padding: 25px 0 0 0}
.footer-third {padding: 0 0 15px 0}
        
.footer-second img {width: 20px; height: 20px; padding: 0;margin: 0; display: inline;}
.footer-second ul {padding-left: 20px; display: inline;}
.footer-second ul li {display: inline; margin-right: 20px;}
.footer-second ul li a {font-size: 13px; color: white; font-weight: 100}
.footer-second .right ul li {margin: 0 0 0 20px;}
.footer-second .right ul li a i {color: #fff; font-size: 20px;}
        
.footer-third ul {padding-left: 20px; display: inline;}
.footer-third ul li {display: inline; margin-right: 20px;}
.footer-third ul li a {font-size: 13px; color: white; font-weight: 100}
.footer-third p {font-size: 13px; color: white; font-weight: 100}
.footer-third .right p a {color: #fff;}
        
footer hr {color: white;}
              
        
@media screen and (min-width: 1000px) {
  .desktop {display: block;}
  .mobile {display:none;}    
}

@media screen and (max-width: 999px) {
  .desktop {display: none;}
  .mobile {display:block;}    
  
html {scroll-padding-top: 0px}  
header {position: absolute;}
header .mobile .container {padding-left: 0!important; padding-right: 0!important;} 
.logo small {margin-right: 12px;}
    
.burger-collapse {
    background: white;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 3;
    transition: 0.5s;
    transition-delay: 0.5s;
    overflow: hidden; 
} 
.responsive-menu {height: 100vh;transition-delay: 0s; padding: 73px 0 0 0;}
.responsive-menu ul {padding:0; border-top: 1px solid #f1f1f1}
.responsive-menu ul li {display: block;color: white;font-size: 18px;font-weight: 500;border-bottom: 1px solid #f1f1f1;width: 100%;padding: 15px 0;}
.responsive-menu ul li a {padding: 0 0 0 20px;}
.responsive-menu .menu-buttons {text-align:left; margin-top: 30px;}
.responsive-menu .menu-buttons .button-one {display: block;margin: 20px 15px; padding: 15px 25px; border-radius: 50px; font-size: 18px;}
.responsive-menu .menu-buttons .button-two {display: block;margin: 20px 15px; padding: 15px 25px; border-radius: 50px; font-size: 18px;}
    


.main-banner {} 
.main-banner h2 {-webkit-text-stroke: 1px #fff;font-size: 42px;}
.main-banner h3 {color: #fff; font-size: 32px;}
.main-banner h4 {color: #fff;}
.main-banner p {color: #fff;}
.main-banner p a {background-color: #fff; color: #000; font-weight: 500;}
.main-banner .full-width-bg {height: 100vh; display: flex;justify-content: center;align-items: center;}
    
.feature-block {background: none;display: block; padding: 0;}
.feature-block img {width: 100%; border-radius: 50%; padding: 25px 25px 25px 25px; margin-top: 15px;}
.feature-block .img-right {padding: 25px 25px 25px 25px;}
.feature-block h1 {margin-top: 20px; margin-bottom: 10px;}    
.feature-block h2 {margin-top: 20px; margin-bottom: 10px;}    
.feature-block h3 {display:none;}

.reviews .review-item {margin-top: 30px;}    
    
/*
.testamonials .person {margin-bottom: 40px;}
.testamonials .testamonial:before {top: 136px;}
.testamonials .headline h2 {margin-top: 60px; margin-bottom: 10px;}    
.testamonials .headline h3 {display:none;}
*/
    
.my-services .desktop-separator {margin-top: 0px;}
.my-services .mobile-separator {margin-top: 30px;}
.my-services i {font-size: 30px;}
.my-services .mobile-center {text-align: center;}    
   
.my-services .headline h2 {margin-top: 60px; margin-bottom: 10px;}    
.my-services .headline h3 {display:none;}
.my-services h4 {font-size: 20px;}
.my-services h5 {padding: 0 20px 5px 0;width: 100%;}

.mobile-box {
    
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto;}  

main .text .headline h2 {margin-top: 60px; margin-bottom: 10px;}    
main .text .headline h3 {display:none;}
main {padding: 30px 0;}
main .text {margin:0;}
    
.faq .right {text-align: right;display: flex;justify-content: right;align-items: center;}
       
.get-in-touch {background-color: #000000; padding: 20px 0 10px 0;}
.get-in-touch h5 {font-size: 18px; font-weight: 500; padding: 0 0 5px 0;}
.get-in-touch h6 {font-size: 15px; font-weight: 300; padding: 0 0 5px 0;} 
.get-in-touch p a {font-size: 16px; font-weight: 300; color: #F581BE;} 
  
.get-in-touch .call {background-color: #F581BE;}    
.get-in-touch .mail {background-color: #fff;}    
.get-in-touch .mobile-button {padding: 15px 20px 5px 20px; margin: 10px 0;text-align: center; border-radius: 5px;}
    
.selling-points {background-color: #000000; padding: 0 0 0 0;}
.selling-points h5 {font-size: 18px; font-weight: 700; color: white; padding: 15px 0 0 0;}
.selling-points h6 {font-size: 10px; font-weight: 300; color: #F581BE;}
    
footer {padding: 30px 0 20px 0;}
footer .mobile-footer-menu {border-top: 1px solid #fff;}
footer .mobile-footer-link {display:block; color: white; font-size: 18px; font-weight: 500; border-bottom: 1px solid #fff; width: 100%; padding: 7px 0}
footer .mobile-footer-link i {margin-top: 4px;}
footer .card-body {flex: 1 1 auto; color: white; font-size: 16px; padding: 0; background-color: inherit;padding: 7px 0;}
footer .mobile-footer-text {text-align: center; padding: 20px 0 0 0;}
footer .mobile-footer-text p {font-size: 13px; font-weight: 300; color: white; margin:5px 0;padding:0;}  
footer .mobile-footer-social {width: 100%; padding: 10px 0; text-align:center;}
footer .mobile-footer-social ul li {display: inline-block; margin: 0 10px;}
footer .mobile-footer-social ul li i {color: white; font-size: 14px;}
}