body {
  font-family: $font-primary, sans-serif;
  font-weight: $base-font-weight;
  text-transform: none;
  font-size: $base-font-size;
  line-height: $base-line-height;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color:$base-font-color;

  @media (min-width: 641px) {
    font-size: $base-font-size-desktop;
    line-height: $base-line-height;
  }
}

h1,
h2,
h3,
h4,
h5,
.heading-xlarge,
.heading-large,
.heading-medium,
.heading-small,
.heading-xsmall,
.font-xxlarge,
.font-xlarge,
.font-large,
.font-medium,
.font-small,
.font-xsmall,
.bold-xlarge,
.bold-large,
.bold-medium,
.bold-small,
.bold-xsmall,
.lead,
.part-title{
  font-family: $font-primary, sans-serif;
  font-weight: $base-font-weight;
  text-transform: none;
  color:$base-font-color;

  &.top{
    margin-top:0;
    padding-top:0;
  }

  &.bottom{
    padding-bottom:0;
    margin-bottom:0;
  }
}

h1,
h2,
h3,
h4,
h5,
.heading-xlarge,
.heading-large,
.heading-medium,
.heading-small,
.heading-xsmall,
.bold-xlarge,
.bold-large,
.bold-medium,
.bold-small,
.bold-xsmall,
.part-title{
  font-family: $font-secondary, sans-serif;
  font-weight: $header-font-weight;
}

p,
ul{
  &.top{
    margin-top:0 !important;
    padding-top:0 !important;
  }

  &.bottom{
    padding-bottom:0 !important;
    margin-bottom:0 !important;
  }
}

//h1 to h5 sizes - fallback for migration of old content
h1{
  @include heading-xlarge();
}

h2{
  @include heading-large();
}

h3{
  @include heading-medium();
}

h4{
  @include heading-small();
}

//sizes - line-height - margins
.font-xxlarge {
  @include font-xxlarge();
}

.font-xlarge {
  @include font-xlarge();
}

.font-large {
  @include font-large();
}

.font-medium {
  @include font-medium();
}

.font-small {
  @include font-small();
}

.font-xsmall {
  @include font-xsmall();
}

.heading-xlarge {
  @include heading-xlarge();
}

.heading-large {
  @include heading-large();
}

.heading-medium {
  @include heading-medium();
}

.heading-small {
  @include heading-small();
}

.part-title{
  @include part-title();
} 

.part-content{
    @include text();

    .part-title {
        @include heading-large();
    }

    h2{
        @include heading-medium();
    }
}  

.section-title{
    display:block;
    font-size:24px;
    color:$secondary-font-color;
    font-weight:400;
}

.paragraph,
p,
p.sharepoint,
.link-back,
.hidden-text,
.text-link.reveal {
  @include body-text-margin();
  line-height:1.6;
}

.hidden-text{
  .panel{
    margin-top:10px;
    *{
        margin:15px 0 0;
        @include text();
    }
    li{
        margin:7px 0 0;
        &:first-child{
            margin-top:0;
        }
    }
    *:first-child { 
        margin-top: 0 !important; 
    }
    *:last-child { 
        margin-bottom: 0 !important; 
    }
  }

  a.reveal{
    @include border-link();
  }
}

.lead {
  font-size: 19px;
  line-height: 1.6;
  @media (min-width: 641px) {
    font-size: 24px;
    line-height: 1.6;
    margin-top: 1.0526315789em;
  }

  &.header{
    margin-bottom:50px;
  }

  a[rel="external"] {
      margin-right: 32px;
  }
}

//text-wrapper for usability reasons (recommeneded max 75 characters)
.text {
  @include text();
}

//used on subsites
.content-block {
    max-width: 48em;
    padding-bottom: 2.5em;
}

.text-description{
  margin-bottom:0;
  font-size:16px;
  font-weight:400;
  color:$secondary-font-color;
  @media (min-width: 641px) {
    font-size: 19px;
  }
}

//inset text
.text-highlight,
.text-block{
  border-left: 15px solid $panel-color;
  padding:15px;
  width:100%;
  margin: 30px 0;

  @media (min-width: 641px){
    margin: 30px 0;
    padding:15px 30px;
  }

  &.top{
      margin-top:0;
  }

  h2,
  h3,
  h4,
  p:first-of-type{
    margin-top:0;
  }

  h2,
  h3,
  h4{
      margin-bottom:15px;

      @media (max-width: 641px) {
          margin-bottom:7px;
      }
  }
  
  p:last-of-type{
    margin-bottom :0;
  }

  &.text-highlight--blue{
    border-color:$base-link-color;
    background:rgba($base-link-color, 0.1);
  }

  &.text-highlight--green{
    border-color:$primary-button-background-color;
    background:rgba($primary-button-background-color, 0.1);
  }

  &.text-highlight--red {
    border-color: $red !important;
    background: rgba($red,0.1);
}
}


.text-highlight--red,
.text-highlight--blue,
.text-highlight--green {
  @media (min-width: 641px){
    padding: 30px;
  }
}

//text block
.text-block{
  margin:0 0 30px;
  border:0;
  border-left: 2px solid $panel-color;
  padding:0 15px;
    @media (min-width: 641px){
        padding:0 30px;
    }
}

//typography - notice
.notice{
  position:relative;
  margin:30px 0;

  i{
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -15px;
    font-size:30px;
  }

  strong {
    display: block;
    padding-left: 55px !important;
    margin-left: -15px;
  }
}

//links

//doc styling - needs aligning with doc list stylying
 a.doc {

        border-bottom:1px solid $border-color;
        padding:20px 15px 20px 40px;
        margin:0px;
        display:block;
        font-weight:bold;
        position:relative;

        &:first-of-type{
          border-top:1px solid $border-color;
        }

        &:hover{
          background:$border-color;
          text-decoration:none;          
        }

        span{
            color:$secondary-font-color;
            margin-left:10px;
        }

        &:before{

                font-family: FontAwesome;
                position:absolute;
                font-weight: normal;
                top: 17px;
                left: 10px;
                height: 25px;
                margin-top:-5px;
                width: 25px;
                display: block;
                padding:0px;
                font-size: 22px;
            
        }


    &.pdf:before {
  content: '\f1c1';
  color:#ED1F24;

    }   
 &.word:before{
    content: '\f1c2';
    color:#294BA0;
} 

&.xl:before{
    content: '\f1c3';
    color:#269129;
} 

&.external:before{
    content: '\f08e';
    color:rgba(0,0,0, 0.5);
}

&.pp:before{
    content: '\f1c4';
    color:orange;
}

   &.pdf,  &.word,  &.xl ,  &.external, &.pp{ 
       &:hover{
        &:before{
            color:#333;
        }
    }
   }
}

//link variant icons
a[rel]:after{
    font-family: FontAwesome;
    padding:0 5px;
}

a[rel="xl"]:after,
a[rel="xsl"]:after,
a[rel="xslx"]:after {
      content: "\f1c3"; 
}

a[rel="pdf"]:after {
    content: "\f1c1";
}

a[rel="doc"]:after,
a[rel="docx"]:after {
  content: "\f1c2"; 
}

a[rel="pp"]:after,
a[rel="pt"]:after {
  content: "\f1c4"; 
}

a[rel="external"]:after {
    content: "\f08e"; 
}

a,
.link {
    text-decoration:underline;
    color:$base-link-color;

    &:hover{
      color:$base-link-hover-color;
    }

    &:visited{
      text-decoration:underline;
    }
}

.link{
  border:0 !important;
  padding:0 !important;
}

a[rel="external"]{
  margin-right:25px;

    &:after {
      position: absolute;
  }
}

.text-link.reveal{
  text-decoration: none;

  &.collapsed{
    span{
      border-bottom:1px solid $base-link-color;
    }
  }

  &:before{
    font-family: FontAwesome;
    content: "\f0d7";
  }

  &.collapsed{

    &:before{
      content: "\f0da";
    }
  }
}

.link-back{
    text-decoration:none !important;
    border-bottom:1px solid $base-link-color;
    display:inline-block;
    margin: 10px 0 0;
    &:before{
        font-family: FontAwesome;
        content: "\f0d9";
        margin-right:5px;
    }
    &:hover{
        border-bottom:1px solid $base-link-hover-color;
    }
    &:visited{
        color:$base-link-color !important;
    }
}

.link-small{
    @include font-xsmall();
    color:$base-link-color;
}

//lists
ul,
ol {
  list-style-type: none;
  &.bottom{
    margin-bottom:0;
    li{
        &:last-of-type{
            margin-bottom:0;
        }
    }
  }
}

.list {
  @include list();
}

.list-bullet {
  @include list-bullet();
}

.list-number {
  @include list-number();
}

.list-step{
  @include list-step();
}

.list-nav{
  @include list-nav();
}

.heading-contents {
  margin-top: 3em;
}

.list-contents{
    font-size:16px;
}

//blockquote
blockquote {
    font-family:$font-secondary;
    font-weight:bold;
    position:relative;
    padding:0 30px 0 80px;
    margin:30px 0;
    border-left: 5px solid $border-color;
    @media (min-width: 641px){
        margin:60px 0;
    }
    &:before{
        font-family: FontAwesome;
        content: "\f10d";
        position: absolute;
        top: 0;
        left: 30px;
        opacity: 0.5;
        font-size: 32px;
    }
    p{
      font-size:24px !important;
      margin:0 0 15px;
      padding:0;
      @media (max-width: 641px) {
        font-size:19px !important;
      }
      @media (min-width: 641px){
        padding:30px;
      }
    }

  span.open-quote:after {
    color: $border-color;
  }

  footer {
    color: $base-font-color;

    @media (max-width: 641px) {
      font-size:16px !important;
    }
  }
  .blockquote-footer,
  cite{
      color:$secondary-font-color;
      font-weight:normal;
      font-style:normal;
      font-size:16px;
      line-height:1.6;
  }
}

//text-highlight content spacing
.text-highlight{
    *{
        margin:15px 0 0;
    }
    li{
        margin:7px 0 0;
        &:first-child{
            margin-top:0;
        }
    }
    *:first-child { 
        margin-top: 0 !important; 
    }
    *:last-child { 
        margin-bottom: 0 !important; 
    }
    pre{
        margin-top:15px !important;
    }
}

@media (max-width: 641px){
.text-highlight h2, .text-highlight h3, .text-highlight h4, .text-block h2, .text-block h3, .text-block h4 {
    margin-bottom: 15px;
}
}

//element spacing
ul + .text-highlight{
    margin-top:6px;
}

ul + .heading-large{
    margin-top:26px;
    @media (max-width: 641px){
        margin-top:6px;
    }
}

ul + .heading-medium{
    margin-top:16px;
    @media (max-width: 641px){
        margin-top:6px;
    }
}

ul + .heading-small{
    margin-top:6px;
    @media (max-width: 641px){
        margin-top:1px;
    }
}

ul + p{
    margin-top:0;
}

.text-highlight + p{
    margin-top:0;
}

.btn + h2,
.btn + h3,
.btn + .heading-medium,
.btn + .heading-small{
    margin-top:50px;

    @media (max-width: 641px) {
        margin-top:30px;
    }
}

//contact
.list-nav .contact{
    i{
        margin-right:10px;
    }
}

.contact{
    font-size:21px;

    @media (max-width: 641px) {
        font-size:19px;
    }

    i{
        margin-right:10px;
    }
}

.sub-section a + p.contact{
    margin-top:0;
}

h2 + h3{
    margin-top:0;
}

.top-header-margin{
  margin-top:50px;

  @media (max-width: 641px) {
        margin-top:30px;
    }
}

.more{
    font-weight:700;
}

//contact page old styles
.box-layout{
    @include flexbox();
    @include flex-direction(row);
    @include flex-wrap(wrap);
    margin:0 0 0 -15px;
    width:auto;
    padding:0 0 15px;

    .box-layout-item{
        padding-bottom:10px;
        width: calc(100% * (1/3) - 16px);
        margin:15px 0 0 15px;
        border:0;
        background:$lighter-grey;
        padding:30px;

        @media (max-width: 1200px) {
            width: calc(100% * (1/2) - 16px);
        }

        @media (max-width: 600px) {
            width: 100%;
        }
    }
    h2,
    h3,
    h4{
        &:first-of-type{
            margin-top:0;
        }
    }
    &.other{
      margin-bottom:0;
      padding-bottom:0;
      p{
          color:$secondary-font-color;
          margin:0 0 10px;
      }
      .box-layout-item{
          &:last-of-type{
              padding-bottom:0;
          }
      }
  }
  &.main{
      &.transparent{
          .box-layout-item{
              @media (max-width: 641px){
                  padding:0 0 15px 0;
              }
          }
      }
  }
  .list-nav{
      li{
        border-left: 3px solid darken($light-grey,5%);
          a{
              border:0;
              padding-left:15px;
              text-decoration:underline !important;
              display: inline-block;
          }
          &:last-child{
              margin:0;
          }
      }
  }
  &.transparent{
      .box-layout-item{
          background:transparent;
          padding:0 30px 15px 0;
          @media (max-width: 641px){
              width: 100%;
              padding:0 0 5px 0;
          }
          .list-nav li {
            border-left:3px solid $lighter-grey;
        }
      }
  }
}

//contact page
.telephone{
    font-weight:700;
    position:relative;
    padding-left:27px;
    margin:5px 0 10px;
    font-size:21px;
    @media (max-width: 641px){  
        padding-left:22px;  
        margin:0 0 10px;
        font-size:19px;
    }
    &:before{
        font-family: FontAwesome;
        content: "\f095";
        margin-right:0;
        color:$grey;
        position:absolute;
        left:0;
    }
    .additionalInfo{
        @include font-xsmall();
        display:block;
        font-weight:400;
    }
}


.sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}