/* Inits */
html { box-sizing: border-box }*,*:before,*:after{box-sizing:inherit}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}
input, select { border-radius: 0 }

/* Fonts */

@font-face {
    font-family: "telenorevolution";
    src: url("/gfx/TelenorEvolution-Light.woff2");
    font-style: normal;
    font-weight: 300;
}

@font-face {
    font-family: "telenorevolution";
    src: url("/gfx/TelenorEvolution-Normal.woff2");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "telenorevolution";
    src: url("/gfx/TelenorEvolution-Medium.woff2");
    font-style: normal;
    font-weight: 500;
}

@font-face {
    font-family: "telenorevolution";
    src: url("/gfx/TelenorEvolution-Bold.woff2");
    font-style: normal;
    font-weight: 700;
}

@font-face {
    font-family: "telenorevolution";
    src: url("/gfx/TelenorEvolution-ExtraBoldSlanted.woff2");
    font-style: italic;
    font-weight: 700;
}



/* CSS Variables  W=1600+ D=1200+ T=750+ M=450+ SM=450-  */
:root {
    --maxSiteW: 1300px;
    --lIndentSM: 10px;
    --rIndentSM: 10px;
    --lIndentM: 15px;
    --rIndentM: 15px;
    --lIndentT: 60px;
    --rIndentT: 50px;
    --lIndentD: 130px;
    --rIndentD: 100px;
    --gridSpace: 15px;
    --spaceAbove: 0px;
    --spaceBelow: 15px;
    --moreSpaceAbove: 40px;
    --moreSpaceBelow: 40px;
    --RockBottomM: 30px;
    --RockBottomT: 60px;
    --RockBottomD: 100px;
    --telenor-light-blue: #E8FDFF;
    --telenor-mid-blue: #2D28CD;
    --telenor-evolution: #B4FFFF;
    --telenor-dark-blue: #000F3C;
    --telenor-light-grey: #858383;
}


/* Std and RTE Styles */
html, body{ 
    font-family: 'telenorevolution', 'DM Sans', Arial, sans-serif; 
    font-size: 11px;
    font-weight: 400;
}
@media only screen and (min-width: 450px)  {  html, body { font-size: 12px }   }
@media only screen and (min-width: 750px)  {  html, body { font-size: 13px }   }
@media only screen and (min-width: 900px)  {  html, body { font-size: 14px }   }
@media only screen and (min-width: 1000px) {  html, body { font-size: 15px }   }

p {
    margin: 0 0 var(--spaceBelow) 0;
}

h1, h2, h3, h4, h5, h6 {
    margin: var(--spaceAbove) 0 var(--spaceBelow) 0;
} 

h2 {
    margin-top:1 5px;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.8rem;
	color: #2028CD;
}

h3 {
    margin-bottom: 5px;    
	font-size: 1.3rem;
	font-weight: 500;
	color: #2028CD;
}

h4, h5, h6 {
    margin-bottom: 5px;    
    font-size: 1.3rem;	
	font-weight: 500;
	line-height:1.6rem;
	color: #000F3C;
}

/* Buttons */

.tmButtonPrimary {
    /* 
    cpa: is this in us anywhere?
    position: absolute;
    bottom: 15px;
    right: 15px;
    */
    padding: 7px 12px 7px 12px;
    background-color: #00C8FF;
    border: 0px;
    font-size: 1rem;
    font-weight: 400;
    border-radius: 25px;
}
.tmButtonPrimary a {
    color:white;
}
.tmButtonPrimary:hover {
    background-color:#2028CD;
}
.tmButtonSecondary {
    /* 
    cpa: is this in us anywhere?
    position: absolute;
    bottom: 15px;
    right: 15px;
    */
    padding: 7px 12px 7px 12px;
    background-color: #E8FDFF;
    border: 0px;
    font-size: 1rem;
    font-weight: 400;
    border-radius: 25px;
    border: 1px solid #00C8FF
}
.tmButtonSecondary a {
    color:#00C8FF;
}
.tmButtonSecondary:hover {
    background-color:white;
}

/* Master Main grid */
.main {
   
    background-color: #FFF;
    margin: 0 auto;
    padding: 0 0 var(--RockBottomM) 0;
    width: 100%;
    max-width: var(--maxSiteW);
    color: #000;
}
@media only screen and (min-width: 750px)  {  .main { padding-bottom: var(--RockBottomT) }   }
@media only screen and (min-width: 950px)  {  .main { padding-bottom: var(--RockBottomD) }   }

#tmBackground {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}

#tmBackground video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.tmHeader {
    margin: 0px auto;
    padding: 0;
    width: 100%;
    
    background-color: #FFF;
}   
@media only screen and (min-width: 1600px)  {  .tmHeader {  }   }

.tmMainImage {
    width: 100%;
}

/* Top header*/
.tmnav {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 90px;
    background-color: #000F3C;
    border-bottom: 1px solid white;
}

.tmlogo {
    display: block;
    position: absolute;
    top: 20px;
    left: 10px;
    width: 200px;
    height: 50px;
}

.tmlogoNew {
 
    width: 200px;
    height: 50px;
 
}
@media only screen and (min-width: 450px)   {  .tmlogo { left: 10px; width: 300px; height: 50px; }   }
@media only screen and (min-width: 750px)   {  .tmlogo { left: 30px; width: 300px; height: 50px; }   }
@media only screen and (min-width: 1200px)  {  .tmlogo { width: 300px; height: 50px; }   }

.tmmenuiconNew {
    display: flex;
    background-color: var(--telenor-dark-blue);
    color: var(--telenor-light-blue);
    border: none;
    justify-content: space-between;
   
    font-size: 18px;
}

@media only screen and (min-width: 750px)   {  .tmmenuiconNew { padding: 0 0px 0 15px; }   }
@media only screen and (min-width: 1200px)  {  .tmmenuiconNew { padding: 0 0px 0 20px; }   }

.tmmenuicon {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    padding: 0 10px 0 40px;
    background: transparent url('/gfx/icon-menu-open.svg') no-repeat left center;
    background-size: 34px;
    border: none;
    font-family: 'telenorevolution';
    font-weight: 700;
    font-size: 22px;
    color: #00C8FF;
    cursor: pointer;
    overflow: hidden;
}

@media only screen and (min-width: 450px) {
    .tmmenuicon {
        padding: 0 30px 0 40px;
    }
}

@media only screen and (min-width: 750px) {
    .tmmenuicon {
        padding: 0 60px 0 40px;
    }
}

@media only screen and (min-width: 1200px) {
    .tmmenuicon {
        padding: 0 100px 0 40px;
    }
}

.tmmenuiconText {
    display: block;
    margin: 0px 0px 0px 10px;
    
}

.tmmenuiconClose { 
    background: transparent url('/gfx/icon-menu-close.svg') no-repeat left center;
    background-size: 34px;
}

.tmmenuiconCloseNew { /* remember to add in base js.*/
   
    background-size: 34px;
}

#tmmOpenNew {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    color: white;
    cursor: pointer;
    overflow: hidden;
    padding: 30px;
}

.tmmOpen {
    display: block;
}

#tmmClose {
    display: none;
}

.tmmenutxt {
    display: block;
    position: absolute;
    top: 30px;
    right: 40px;
    width: 50px;
    height: 50px;
    font-family: telenorevolution;
    font-size: 1.8rem;
    font-style: normal;
    font-weight: bold;
    color: #00C8FF;
}


.tmnavnew {
    display: block;
    background-color: #000F3C;
    border-top: 1px white solid;
    padding: 20px 10px;
}

.tmnavnew ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
   
}

.tmnavnew-links {
    list-style-type: none;
}


.tmnavnew-links a {
    color: white;
    text-decoration: none;
    padding: 0px 20px;
    font-weight: 400;
}


/* Nav shortcuts */
.tmnavshorts {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0px var(--rIndentSM) 0 var(--rIndentSM);
    background-color: #E8FDFF;
}
@media only screen and (min-width: 450px)   {  .tmnavshorts { padding: 8px var(--rIndentM) 12px var(--rIndentM) }   }
@media only screen and (min-width: 750px)   {  .tmnavshorts { padding: 8px var(--rIndentT) 12px var(--rIndentT) }   }
@media only screen and (min-width: 1200px)  {  .tmnavshorts { padding: 8px var(--rIndentD) 12px var(--rIndentD) }   }

.tmnavshorts ul {
    margin: 5px 0 4px 0;
    padding: 0;
    font-style:normal;
}

.tmnavshorts .navname {
    font-size:.8rem;
    font-style:italic;
    color:#00C8FF;
    padding-top: 15px;
}

.tmnavshorts ul li {
    display: inline-block;
    margin: 0;
    padding: 5px 5px 5px 0px;
    list-style: none;
    margin-bottom: 4px;
}

.tmnavshorts a {
    background-color: #00C8FF;
    margin: 0 0px 0 0;
    padding: 4px 6px 4px 6px;
    font-family: telenorevolution;
    font-size: 1rem;
    font-weight: bold;
    color: #000F3C;
    text-decoration: none;
}

.tmnavshorts a:hover {
    background-color: #E4A99B;
}


/* Nav path */
.tmPath {
    margin: 0;
    padding: 10px var(--rIndentSM) 20px var(--rIndentSM);
    font-family: telenorevolution;
    font-size: .8rem;
    font-weight: 700;
    font-style: italic;
    color: #FF5A28;
}
@media only screen and (max-width: 450px)  {  .tmPath { padding: 10px var(--rIndentM) 20px var(--rIndentM) }   }
@media only screen and (min-width: 750px)  {  .tmPath { padding: 10px var(--rIndentT) 20px var(--rIndentT) }   }
@media only screen and (min-width: 1200px)  {  .tmPath { padding: 10px var(--rIndentD) 20px var(--rIndentD) }   }

.tmPath ul {
    margin: 0; padding: 0;
}

.tmPath ul li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.tmPath a {
    margin: 0;
    padding: 0 5px 0 5px;
    color: #000;
    text-decoration: none;
}

.tmPath a:hover {
    text-decoration: underline;
    color: #FF5A28;
}

.tmPathActive {
    color: #000;
}


/* Dropdown navigation*/
.tmNavDDNew {
    position: absolute;
    z-index: 10;
    display: flex;
    flex-direction: column;
    width: 100%;
    
    height: auto;
    margin: 0;
    padding: 10px 30px 40px 30px;
    background-color: var(--telenor-dark-blue);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--telenor-light-blue);
    transition: all .3s linear;
    overflow: hidden;
}
@media only screen and (min-width: 550px)  {  .tmNavDD { font-size: 1.3rem;  }   }
@media only screen and (min-width: 755px)  {  .tmNavDD { font-size: 1.2rem;  }   }


.tmNavDD {
    position: absolute;
    z-index: 10;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 10px 30px 40px 30px;
    background-color: #E8FDFF;
    font-size: 1.4rem;
    font-weight: 700;
    color: #2028CD;
    transition: all .3s linear;
    overflow: hidden;
}
.tmNavDDoff {
    display: none;
}

.tmNavDDhidden {
    height: 0px;
    opacity: 0.1;
}

.tmNavDD ul {
    margin: 0;
    padding: 0;
}

.tmNavDD li {
    margin: 0;
    padding: 6px 0 0 0;
    list-style: none;
}

.tmNavDD ul.tmNavFl {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.tmNavDD li.lvl1 {
    width: 100%;
}
@media only screen and (min-width: 375px)  {  .tmNavDD li.lvl1 { width: 50%  }   }
@media only screen and (min-width: 750px)  {  .tmNavDD li.lvl1 { width: 19%  }   }

.tmNavDD li.lvl1S {
    width: 100%;
}
@media only screen and (min-width: 375px)  {  .tmNavDD li.lvl1S { width: 100% }   }
@media only screen and (min-width: 500px)  {  .tmNavDD li.lvl1S { width: 100%; padding-left: 50% }   }
@media only screen and (min-width: 750px)  {  .tmNavDD li.lvl1S { width: 19%; padding-left: 0 }   }


.tmNavDDNew a {
    font-size: 0.875rem;
    color: var(--telenor-light-blue);
    text-decoration: none;
    font-weight: 400;
}

.tmNavDD a {
    font-size: 90%;
    color: #000;
    text-decoration: none;
}

.tmNavDD a:hover {
    text-decoration: underline;
}

.tmNavDDicon {
    display: block;
    width: 80px;
    height: 80px;
}

.tmNavDD .lvl2S {
    color: #FF5A28;
}

.tmNavDDNew .lvl2S {
    color: #FF5A28;
}

.tmNavDD ul.lvl2S a {
    color: #2028CD;
}

.tmNavDDNew ul.lvl2S a {
    color: #2028CD;
}


.tmNavDDNew ul.lvl2S a {
    color: var(--telenor-light-blue);
}

.navSearch {
    width: 100%;
    height: 25px;
    margin: 40px 0 0 0;
}

@media only screen and (min-width: 500px) {
    .navSearch {
        width: 70%
    }
}

@media only screen and (min-width: 750px) {
    .navSearch {
        width: 100%
    }
}

.navSearch form {
    margin: 0;
    padding: 0;
}

.navSearchInput {
    display: block;
    float: left;
    height: 25px;
    width: 118px;
    width: 90%;
    margin: 0;
    padding: 0;
    background-color: #E4A99B;
    border: none;
    border-radius: 0;
    color: #000F3C;
    font-family: 'telenorevolution';
    font-weight: 500;
    font-size: 1rem;
}

    .navSearchInput::placeholder {
        color: #000F3C;
    }

.navSearchBtn {
    display: block;
    float: left;
    height: 25px;
    width: 10%;
    margin: 0;
    padding: 3px;
    background: #E4A99B url('/gfx/icon-search.svg') no-repeat center center;
    background-size: 15px 15px;
    border: none;
    border-radius: 0;
    color: transparent;
    font-size: 1rem;
    cursor: pointer;
    overflow: hidden;
}

    .navSearchBtn:hover {
        background-size: 18px 18px;
    }


/* Footer */
.tmFooter {
    margin: 0 auto;
    padding: 64px 32px;
    width: 100%;
    background-color: #000F3C;
    color: #FFF;
}

.tmFooterFirstLogo {
    width: 44px;
    height: 40px;
}

.footerLogo {
    width: 44px;
    height: 48px;
}

.footerLogo img {
    width: 100%;
}

.tmFooterBtmLogo {
    width: 200px;
}

.tmFooterFC {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0;
    padding: 10px var(--rIndentSM) 20px var(--rIndentSM);
}
@media only screen and (max-width: 450px)  {  
    .tmFooterFC { 
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        padding: 10px var(--rIndentM) 20px var(--rIndentM) 

    }   


}



@media only screen and (min-width: 750px)  {  .tmFooterFC { padding: 10px var(--rIndentT) 20px var(--rIndentT) }   }
@media only screen and (min-width: 1200px)  {  .tmFooterFC { padding: 10px var(--rIndentD) 20px var(--rIndentD) }   }

.tmFooterBlock {
    width: 100%;
    font-family: "telenorevolution";
    font-size: 1rem;
    font-weight: 200;
}
@media only screen and (min-width: 375px)  {  .tmFooterBlock { width: 49%; font-size: .9rem; }   }
@media only screen and (min-width: 750px)  {  .tmFooterBlock { width: 33%; font-size: .9rem; }   }

.tmFooterBlockHeader {
    display: block;
    margin: 40px 0 8px 0;
    font-size: 1.3rem;
    font-weight: 500;
}

.tmFooterBlock ul {
    margin: 0;
    padding: 0;
}

.tmFooterBlock li {
    margin:  5px 0 0 0;
    padding: 0;
    list-style: none;
}

.tmFooter a {
    color: #fff;
    text-decoration: none;
}

.tmFooter a:hover {
    text-decoration: underline;
}

.tmColofon{
    position: relative;
    margin-top: 50px;
}

.tmFooter .copyright-container {
    font-size: .7rem;
    font-weight: 200;
    letter-spacing: .05rem;
}

.tmSocials {
    position: absolute;
    top: 5px;
    right: 0;
}

.tmSocials ul {
    margin: 0;
    padding: 0;
}

.tmSocials ul li {
    display: inline-block;
    margin: 0 0 0 10px;
    padding: 0;
    list-style: none;
}
.tmSocials img {
   height: 16px;
}
@media only screen and (min-width: 375px)  {  .tmSocials ul li { margin-left: 15px } .tmSocials img { height: 16px }   }
@media only screen and (min-width: 450px)  {  .tmSocials ul li { margin-left: 30px } .tmSocials img { height: 22px }   }



/*cookie consent*/
/* .tmCookieConsentWrapper{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:11;
    background-color:rgba(0,0,0,0.7);
}

.tmCookieConsent {
    background-color: #fff;
    margin:10% auto 0 auto;
    width: 60%;
    padding: 35px;
    text-align: center;
    line-height: 1.5rem;
    border-radius: 6px;

}
@media only screen and (max-width: 1440px) {
    .tmCookieConsent {
        width: 75%;
        padding: 25px;

    }
}

@media only screen and (max-width: 1024px) {
    .tmCookieConsent {
        width: 90%;
        padding: 25px;
    }
} */


/* 
.tmCookieConsentBtnWrapper button {
    cursor:pointer;
    padding: 10px;
    border: 1px solid #00C8FF;
    background-color: #fff;
    color: #000;
    border-radius: 6px;
    width: 175px;
    text-align: center;
}

.tmCookieConsentBtnWrapper button.acceptCookies {
    border: 1px solid #00C8FF;
    background-color: #00C8FF;
    color: #fff;
} */


/* .cookieSettings {
    text-align: left;
    background-color: #f5f5f5;
    padding: 15px;
    margin: 35px 0;
}

#cookieSettingsWrapper {
    display:none;
} */

/*cookie consent end*/

.newNav {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 30px;
}

.newNavSection  {
    display: flex;
    flex-direction: column;
   
}

.newNavSectionLeft {
    width: 52%;
    padding: 0px 0px 0px 0px;
}

.newNavSectionMiddle {
    display: block;
    width: 12.9%;
    color: transparent;
}

.newNavSectionRight {
    width: 35%;
    padding: 0px 0px 0px 0px;
}

.newNavGroup {
    display: flex;
   
}

.newNavGroupRight {
    justify-content: flex-end;
}


.newNavGroupAdditional {
    display: flex;
    flex-direction: column;
    color: white;
   
}

.newNavItem {
    width: 33.3%;
    padding: 10px 15px;
}

.newNavItemTitle {
    font-weight: 500;
}

.newNavItemAdditional {
    padding: 10px 15px;
}

.newNavItem > ul, .newNavItemAdditional > ul  {
    list-style-type: none;
    padding: 0; /* Remove default padding */
    margin: 0;
    line-height: 1;
}

.newNavGroupBottom   {
    margin-top: auto;
}

.newNavItem > h2 {
    font-weight: 400;
    margin-top: 0px;
    font-size: 1.25rem;
    color: white;
}

.newNavItem > h3 {
    font-size: 0.875rem;
    color: var(--telenor-light-blue);
    margin-bottom: 0px;
}

.newNavItemAdditionalLink a {
    font-size: 1.4rem;
  
    color: white;
    font-weight: 400;
}

.newNavItemAdditionalLink {
    margin: 20px 0px;
}

.newNavPlaceholder {
    line-height: 1.8rem;
    color: var(--telenor-dark-blue);
}

.newNavIcon {
    text-align: center;
    width: 75px;
    height: 75px;
}

.newNavSearch {
    width: 100%;
    display: flex;
    flex-direction: column;
    color: white;
}

.newNavSearchTitle {
    font-weight: 300;
    font-size: 0.875rem;
}

.newNavSearchInput {
    display: block;
    float: left;
    height: 35px;
    width: 88%;
    margin: 0;
    padding: 0;
    background-color: rgba(255, 255, 255, 0.2);
    border: none;
    border-radius: 2px;
    color: #000F3C;
    font-family: 'telenorevolution';
    font-weight: 500;
    font-size: 1rem;
}
.newNavSearchBtn {
    margin:0;
    border: none;
    padding: 0px;
    padding-left: 5px;
    background-color: transparent;

}

.newNavSearchWrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}

#newNavHamburgerOpen {
    display: block;
}

#newNavHamburgerClose {
    display: none;
}


.newHeaderMenuUnder {
    display: block;
    background-color: var(--telenor-dark-blue);
    padding: 10px;
    transition: all .3s linear;
    overflow-x: auto;
  
}

.newHeaderMenuUnderLinks {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style-type: none;
    flex-wrap: nowrap;
    white-space: nowrap;
    padding: 0px;
    margin: 0px;
}

.newHeaderMenuUnder-link a {
    text-decoration: none;
    color:white;
    padding: 10px 30px;
    font-size: 1.1rem;
}


.newHeaderMenuUnder-link a:hover {
    color: var(--telenor-evolution);
}




@media only screen and (max-width: 1100px) {
    .newNav {
        padding: 10px 20px;
    }

    .newNavSectionLeft {
        width: 55%;

    }

    .newNavSectionMiddle {
        width: 9.9%;
    }

    .newNavSectionRight {
        width: 35%;

    }
}


@media only screen and (max-width: 950px) {
  .newNavItem {
      padding: 10px;
  }
}

@media only screen and (max-width: 800px) {
    .newNavSectionLeft {
        width: 57%;
    }

    .newNavSectionMiddle {
        width: 6.9%;
    }

    .newHeaderMenuUnder-link a {
        padding: 10px 20px;
    }


}

@media only screen and (max-width: 710px) {
    .newNav {
        padding: 0px;
    }

    .newNavItemAdditionalLink a {
        font-size: 1.3rem;
    }

    .newNavItemAdditional {
        padding: 0px;
    }

    .newNavItemAdditionalLink {
        margin: 10px 0px;
    }

    .newNavSectionLeft {
        width: 58%;
    }

    .newNavSectionMiddle {
        width: 0.5%;
    }

    .newNavSectionRight {
        width: 40%;
    }
    
}

/* mobile breakpoint */
@media only screen and (max-width: 600px) {

    .newNav {
        flex-direction: column;
    }

    .newNavSectionLeft, .newNavSectionMiddle, .newNavSectionRight {
        padding-left: 20px;
    }

    .newNavSectionLeft {
        width: 100%;
    }

    .newNavSectionMiddle {
        width: 100%;
    }
    
    .newNavSectionRight {
        width: 100%;
    }

    .newNavSearch {
        padding-top: 20px;
        width: 100%;
    }

    .newNavGroupAdditional {
        padding-top: 30px;
    }

    .tmNavDDNew {
        justify-content: center;
        align-items: center;
       padding: 20px 40px 40px 40px;
    }

    .tmmenuiconText {
        display: none;
    }

    #tmmOpenNew {
        top: 3.5px;
        padding: 30px 15px 30px 30px;
    }

    .newHeaderMenuUnder-link a {
        padding: 10px;
    }
}

@media only screen and (max-width: 550px) {
    .tmNavDDNew {

        padding: 10px 15px 30px 15px;
    }

    .newNavSectionLeft, .newNavSectionMiddle, .newNavSectionRight {
        padding-left: 10px;
        padding-right: 5px;
    }
}

@media only screen and (max-width: 420px) {


    .newHeaderMenuUnderLinks {
        justify-content: flex-start;
    }
}


/* campaign page */
.campaignContainer {
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.campaign {
    width: 82%;
    display: flex;
    padding: 10px;
}


.campaignSide {
    padding: 20px;
}

.campaignHeaderImage {
    width: 82%;
    height: 322px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    background-size: cover;
    background-position: center; /* Centers the image */
}

.campaignHeaderText {
    display: block;
    font-size: 2.3rem;  
}

.campaignHeaderText-mobile {
    width: 100%;
    font-size: 1.2rem;
}

.campaignHeaderTitle {
    display: inline-block;
    margin-bottom: -10px;
    padding: 12px 15px;
    font-weight: 300;
    background-color: #000F3C;
    color: var(--telenor-evolution);
    line-height: 1;
}

.campaignHeaderUndertitle {
    display: inline-block;
    padding: 12px 15px;
    font-weight: 300;
    color: #E8DED3;
    background-color: #000F3C;

    line-height: 1;
}

.campaignMain {
    padding: 20px 35px;
    width: 80%;
}

.campaignSide {
    display: block;
    width: 20%;
    padding: 20px;
}

.campaignHeaderText-mobile {
    display: none;
    width: 100%;
}

.campaignTextTitle {
    margin: 0;
    padding: 0;
    line-height: 1.2;
    font-weight: 400;
    font-size: 40px;
    color: black;
    margin-bottom: 30px;
}

.campaignTextIntro, .contentBuilderHeading {
    font-size: 22px;
    font-weight: 500;
}

.campaignTextMain {
    font-size: 18px;
}

.campaignLinkedIn-mobile, .campaignContact {
    display: none;
}

.campaignContentBuilder {
    padding: 40px 0px;
}


/* carousel */
.campaignCarousel {
    padding: 30px 0px;
    position:relative;
}

.carousel-container {
    display: flex;
    overflow: hidden;
    width: 100%;
    
}

.carousel-slide {
    display: flex;
    min-width: 100%;
    transition: transform 0.5s ease;
    justify-content: center;
    
}

.carousel-item {
   
    box-sizing: border-box;
}

#nextSlide, #prevSlide {
    position: absolute;
    cursor: pointer;
    z-index: 1000;
    top: 45%; /* Position it at the vertical center */
    border: none;
    background: transparent;
}

#prevSlide {
    left: 0;
}

#nextSlide {
    right: 0;
}

.msContainer {
    display: flex;
    flex-flow: wrap;
}

.ms {

    width: 360px;
    display: flex;
    flex-direction: column;
    color: white;
    margin: 10px 20px 20px 0px; 
}

.msImage {
    object-fit: cover;
}

.msText {
    height: 164px;
    padding: 15px 20px;
    background-color: var(--telenor-dark-blue);
}

.msTitle {
   display: flex;
   justify-content: space-between;
}

.msTitle > h3 {
    color: white;
    font-size: 1.7rem;
}

.msLink {
    text-decoration: none;
}


@media only screen and (max-width: 1000px) {
    .campaignHeaderText {
      
        font-size: 2rem;
    }
}


/* mobile breakpoint */
@media only screen and (max-width: 640px) {
    .campaignSide {
        display: none;
    }

    .campaign {
        width: 100%;
    }

    .campaignMain {
        width: 100%;
    }

    .campaignLinkedIn-mobile, .campaignContact {
        display: block;
    }

    .campaignHeaderImage {
        width: 100%;
    }

    .campaignHeaderText {
        display: none;
    }

    .campaignHeaderText-mobile {
        display: block;
        padding-top: 30px;
    
    }

}

@media only screen and (max-width: 1200px) {
    .campaignHeaderTitle {
        width: auto;
    }
}