.Section{
  display:flex;
  gap:1%;
  flex-wrap:wrap;
  justify-content: space-between;
}

.ArticleGap{
  gap: 0.5% !important;
}

.Section > div{
  position: relative;
  flex: 1;
  display: block;
  width: 100%;
}

.Section .Category {
  margin-bottom:50px;
}

.Section .Width-1{
  flex:0 0 100%;
}

.Section .Width-2{
  flex:0 0 calc(50% - 1%);
}
.Section .Width-3{
  flex:0 0 calc(33.33333% - 1%);
}
.Section .Width-4{
  flex:0 0 calc(25% - 1%);
}

section.bigtext.expandable+.toggleDescriptionButton{
  margin: 0;
}

/*
* Category start
*/
.CategoryContainer .Category .ImageContainer a{
  height: auto;
  width: 100%;
  display: block;
}

.CategoryContainer .Category .ImageContainer{
  overflow: hidden;
  position: relative;
  box-shadow: none;
}

.CategoryContainer .Category a.TextContainer{
  text-decoration: none;
  color: #000;
}

.CategoryContainer .Category .TextContainer svg.PlusIcon{
  display: none;
}


.CategoryContainer .Category.Width-5 a.TextContainer,
.CategoryContainer .Category.Width-6 a.TextContainer,
.CategoryContainer .Category.Width-7 a.TextContainer,
.CategoryContainer .Category.Width-8 a.TextContainer,
.CategoryContainer .Category.NoTextOnImage .TextContainer{
  color: #fff;
}

.CategoryContainer .Category .TextContainer{
  position: absolute;
  bottom: 10%;
  letter-spacing: 0.3px;
  color: #000;
  right: 6%;
  z-index: 2;
  background-color: #fff;
  width: 225px;
  padding: 20px;
  border-radius: 5px;
}

.CategoryContainer .Category.Width-5 .TextContainer,
.CategoryContainer .Category.Width-6 .TextContainer,
.CategoryContainer .Category.Width-7 .TextContainer,
.CategoryContainer .Category.Width-8 .TextContainer,
.CategoryContainer .Category.NoTextOnImage .TextContainer{
  
  position: unset;
  background-color: unset;
  padding: 10px 0px;
}

.CategoryContainer .Category.Width-5 .TextContainer .Text,
.CategoryContainer .Category.Width-6 .TextContainer .Text,
.CategoryContainer .Category.Width-7 .TextContainer .Text,
.CategoryContainer .Category.Width-8 .TextContainer .Text,
.CategoryContainer .Category.NoTextOnImage .TextContainer .Text{
  font-size: 14px;
  font-weight: 700;
  padding: 8px;
  letter-spacing: 0.2px;
  display: flex;
  justify-content: space-between;
  border-radius: 0px 0px 5px 5px;
  background: #0085b7;
}

.CategoryContainer .Category.Width-1 .TextContainer svg.ArrowIconLeft,
.CategoryContainer .Category.Width-2 .TextContainer svg.ArrowIconLeft,
.CategoryContainer .Category.Width-3 .TextContainer svg.ArrowIconLeft,
.CategoryContainer .Category.Width-4 .TextContainer svg.ArrowIconLeft{
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin:0px 5px;
  border-radius: 50%;
  padding: 1px;
  align-self: unset;
  display: inline-block;
}


.CategoryContainer .Category.Width-5 .TextContainer svg.PlusIcon,
.CategoryContainer .Category.Width-6 .TextContainer svg.PlusIcon,
.CategoryContainer .Category.Width-7 .TextContainer svg.PlusIcon,
.CategoryContainer .Category.Width-8 .TextContainer svg.PlusIcon,
.CategoryContainer .Category.NoTextOnImage .TextContainer svg.PlusIcon{
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin:0px 5px;
  border-radius: 50%;
  padding: 1px;
  align-self: unset;
  stroke-width:10;
  display: block;
}

.CategoryContainer .Category.Width-5 .TextContainer svg.ArrowIconLeft,
.CategoryContainer .Category.Width-6 .TextContainer svg.ArrowIconLeft,
.CategoryContainer .Category.NoTextOnImage .TextContainer svg.ArrowIconLeft{
  display: none;
}

@media (pointer: fine){
  .CategoryContainer .Category a.TextContainer:hover{
    font-weight: normal;
  }
}

.CategoryContainer .Category .TextContainer .LinkText,
.CategoryContainer .Category .TextContainer .Text{
  display:inline-block;
}

.CategoryContainer .Category .TextContainer .Text{
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
  display:block;
  line-height: 18px;
}

.CategoryContainer .Category .TextContainer .LinkText{
  font-size: 14px;
  padding-right: 3px;
}

.CategoryContainer .Category .TextContainer .ArrowLink{
  display:inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.CategoryContainer .Category.Width-5 .LinkText,
.CategoryContainer .Category.Width-6 .LinkText,
.CategoryContainer .Category.Width-7 .LinkText,
.CategoryContainer .Category.Width-8 .LinkText,
.CategoryContainer .Category.NoTextOnImage .LinkText,
.CategoryContainer .Category.Width-5 .ArrowLink,
.CategoryContainer .Category.Width-6 .ArrowLink,
.CategoryContainer .Category.Width-7 .ArrowLink,
.CategoryContainer .Category.Width-8 .ArrowLink,
.CategoryContainer .Category.NoTextOnImage .ArrowLink{
  display:none;
}

.CategoryContainer .Category.NoTextOnImage .ArrowLink svg path{
  fill: currentcolor;
  stroke: currentColor;
}

/*
* Category End
*/


/*
* Overview start
*/

.ImageContainer a > img{
  border-radius: 5px 5px 0px 0px;
  width:100%;
  display: block;
}
@media (pointer: fine){
  .CategoryContainer .Section > div:hover a.TextContainer .LinkText{
    text-decoration: underline;
  }

  .CategoryContainer .Section > div:hover a.LinkContainer .ArrowTextContainer .LinkText{
    text-decoration: underline;
  }
}

.CategoryContainer .Overview{
  margin-bottom: 50px;
}

.CategoryContainer .Overview a{
  display:flex;
  background-color: #004f6d;
  gap: 1%;
  text-decoration: none;
  border-radius: 5px;
}

.CategoryContainer .Overview .ImageContainer{
  height: 100%;
  width: 100%;
  display: block;
  border-radius: 5px;
  box-shadow: none;
}

.CategoryContainer .Overview .ImageContainer img{
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 0px 5px 5px 0px;
}

.CategoryContainer .Overview .Container{
  letter-spacing: 0.3px;
  color: #000;
  padding: 50px;
  border-radius: 5px;
  flex: 0 0 33%;
  display:flex;
  flex-direction: column;
  margin: auto 0;
}
@media (pointer: fine){
  .CategoryContainer .Overview a:hover{
    font-weight: normal;
  }
}

.CategoryContainer .Overview .Container .News{
  padding: 6px 12px;
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: bold;
  background-color: #fff;
  width: fit-content;
  display: block;
  border-radius: 5px;
  text-transform: uppercase;
  margin-bottom: 25px;
}

.CategoryContainer .Overview .Container .LinkText,
.CategoryContainer .Overview .Container .Text,
.CategoryContainer .Overview .Container .Link{
  display:inline-block;
  color: #fff;
}

.CategoryContainer .Overview .Container .Link{
  margin:25px 0px;
}

.CategoryContainer .Overview .Container .Link:empty{
  margin:0px;
}

.CategoryContainer .Overview .Container .HeadingText{
  font-size: 1.4rem;
  margin-bottom: 20px;
  color: #fff;
  font-weight: bold;
}

.CategoryContainer .Overview .Container .Text{
  font-size: 14px;
  margin-bottom: 10px;
  color: #fff;
  line-height: 22px;
}

.CategoryContainer .Overview .Container .LinkText{
  font-weight: bold;
  vertical-align: middle;
}

.CategoryContainer .Overview .Container .ArrowTextContainer{
  margin-top:25px;
}

.CategoryContainer .Overview .Container .ArrowIconLeft{
display: inline-block;
  width: 25px;
  height: 25px;
  vertical-align: middle;
  margin: 0px 5px;
  fill: currentColor;
  color: #fff;
}
/*
* Overview End
*/

/*
* Heading Start
*/

.CategoryContainer .Section > .Heading > h2{
  margin:0px 0px 0px 0px !important;
  font-size: 1.4rem;
  color: #2e2e2e;
}

.Section > .Heading{
  margin-bottom:25px;
}

/*
* Heading End
*/

/*
* CTA Start
*/

.Section .CTA{
  background-color: #e0ebef;
  padding: 25px;
  border-radius: 5px;
  margin-bottom:50px;
}
@media (pointer: fine){
  .Section .CTA .Container:hover .LinkText{
    background-color: #0085b7;
  }
}

.Section .CTA .Container{
  display: flex;
  flex-direction: column;
  text-decoration: none;
  justify-content: space-between;
  height: 100%;
}

.Section .CTA .Container img{
  display: block;
  width: 60px;
  margin: 0 auto;
}
@media (pointer: fine){
  .Section .CTA .Container:hover{
    font-weight: normal;
  }
}

.Section .CTA .Container .HeadingText,
.Section .CTA .Container .Text{
  margin:0 auto;
  margin-bottom: 15px;
}


.Section .CTA .Container .HeadingText{
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  display:block;
}

.Section .CTA .Container .Text{
}

.Section .CTA .Container .TextContainer{
  text-align: center;
  margin-bottom: 35px;
  color: #2e2e2e;
}

.Section .CTA .Container .LinkText{
  margin: 0 auto;
  min-width: 75%;
  text-align: center;
  width: fit-content;
  text-decoration: none !important;
  padding: 14px 20px;
  border-radius: 5px;
  background-color: #0085b7;
  color: #fff;
}

.Section .CTA .Container:hover .LinkText{
  text-decoration: none;
  font-weight: normal;
  background-color: #004f6d;
}

/*
* CTA End
*/

/*
* TipsNTricks Start
*/

.TipsNTricks{
  background-color: #e0ebef;
  border-radius: 5px;
  max-width: 33%;
  margin-bottom: 50px;
}

.TipsNTricks .Container{
  display: flex;
  text-decoration: none;
  height: 100%;
  max-width: 100%;
}
@media (pointer: fine){
  .TipsNTricks a.Container:hover{
    font-weight: normal;
  }
}

.TipsNTricks .Container .ImageContainer{
  flex: 0 0 33.333%;
}

.TipsNTricks .Container .ImageContainer img{
  display: block;
  border-radius: 5px 0px 0px 5px;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.TipsNTricks .Container .TextContainer{
  padding: 25px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #2e2e2e;
}

.TipsNTricks .Container .TextContainer .HeadingText{
  font-size: 16px;
  font-weight: 700;
}

.TipsNTricks .Container .TextContainer .Text {
  font-size: 14px;
  margin: 10px 0px 20px 0px;
}

.TipsNTricks .Container .TextContainer .LinkText{
  vertical-align: bottom;
  min-width: 150px;
  text-align: center;
  width: fit-content;
  text-decoration: none !important;
  padding: 14px 20px;
  border-radius: 5px;
  background-color: #0085b7;
  color: #fff;
}

@media (pointer: fine){
  .TipsNTricks .Container:hover .TextContainer .LinkText{
    background-color: #004f6d;
  }
}
/*
* TipsNTricks End
*/



@media (max-width: 1440px){

  .CategoryContainer .Category .TextContainer{
    padding: 10px;
  }

  .CategoryContainer .Category .TextContainer .Text{
    margin-bottom: 5px;
  }

  .CategoryContainer .Overview .ImageContainer {
    box-shadow: none;
    position: relative;
    overflow: hidden;
    display: block;
    border-radius: 0px 5px 5px 0px;
  }

  .CategoryContainer .Overview .ImageContainer img {
    position: relative;
    max-width: none;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    max-height: 500px;
  }

  .TipsNTricks .Container .TextContainer{
    padding: 25px;
  }
  .Section.MobileScroll{
    flex-wrap: nowrap;
    margin-bottom: 30px;
  }

  .Section.MobileScroll .Category{
    width: 16.66666%;
    display: inline-block;
  }
}

@media (max-width: 1400px){
  .TipsNTricks .Container .ImageContainer{
    display: none;
  }

  .TipsNTricks .Container .TextContainer{
    flex: 0 0 100%;
    min-height: 230px;
  }

  .CategoryContainer .Section.MobileScroll .Category .TextContainer .Text{
    text-align: left;
  }
}

@media (max-width: 1024px) {
  .TipsNTricks .Container .TextContainer{
    min-height: 250px;
  }

  .Section.MobileScroll{
    gap:2%;
    overflow-x: scroll;
  }

  .Section.MobileScroll .Category{
    width: 20%;
    flex: 0 0 20%;
  }

  .CategoryContainer .Overview .Container{
    flex: 0 0 50%;
  }

  .TipsNTricks .Container .TextContainer .HeadingText {
    font-size:16px;
  }

  .TipsNTricks .Container .TextContainer .LinkText{
      min-width: unset;
      padding: 10px 20px;
  }

}

@media (max-width: 880px) {

  .Section.MobileScroll .Category{
    width: 30.3333%;
    flex: 0 0 30.3333%;
  }

  .TipsNTricks .Container .TextContainer{
    min-height: 150px;
  }

  .SubCats_Categories_UL>li .name a{
    padding: 4px;
  }

  .Section .CTA{
    flex:1 1 100%;
  }

  .Section > div{
    margin-bottom: 30px;
  }

  .TipsNTricks{
    max-width: 100%;
  }

  .Section .Width-4{
    flex:1 1 100%;
  }
}

@media (max-width: 660px) {

  section.bigtext.expandable+.toggleDescriptionButton{
    padding: 10px 10px 25px 0px;
  }

  .Section > div{
    margin-bottom: 20px;
  }

  .Section > .Heading{
    margin-top: 25px;
  }

  .Section{
    gap:0%;
  }

  .Section.MobileScroll{
    gap:2%;
  }

  .Section .Width-2, .Section .Width-3, .Section .Width-4, .Section .Width-5, .Section .Width-6, .Section .Width-7{
    flex:1 1 100%;
  }

  .CategoryContainer .Category .TextContainer{
    bottom: 10%;
    right: 5%;
    width: 45%;
    padding: 20px;
    border-radius: 5px;
  }

  .CategoryContainer .Overview .Container{
    flex: 0 0 100%;
  }

  .CategoryContainer .Overview .ImageContainer,
  .TipsNTricks .Container .ImageContainer{
    flex: 0 0 50%;
    display: none;
  }

  .CategoryContainer .Overview .ImageContainer img{
    max-height: 300px;
  }

  .TipsNTricks .Container .TextContainer .Text{
    display:block;
  }

  .CategoryContainer .Overview .Container .ArrowTextContainer{
    margin-top: 15px;
  }
}

@media (max-width: 600px) {

    .Section.MobileScroll .Category{
      width: 46%;
      flex: 0 0 46%;
    }

    .ShowMoreCategories{
      margin-bottom: 35px;
      margin-top: 15px;
    }

  .CategoryContainer .Overview .Container{
    flex: 1 1 100%;
    padding: 25px;
  }

  .CategoryContainer .Overview .ImageContainer{
    display:none;
  }

  .Section .TipsNTricks{
    margin-bottom: 25px;
  }

  .TipsNTricks .Container .TextContainer{
    flex: 1 1 50%;
  }
}
