/*
Theme Name: cordingleys
Theme URI: https://www.cordingleys.co.uk
Author: Cornerstone DM
Author URI: https://www.cornerstonedm.co.uk/
Description: The cordingleys theme for WordPress.
Version: 1.00

Tags: cordingleys
*/

/*
z-index's

1
.newsTileOverlay
.tab
.bannerBar
.bannerScroll

2
.socialHolder

4
.header
.navSubHolderOpen

9
.tmodal

10
.menu-toggle
*/

/*
@font-face
{
  font-family:NoirPro-Regular;
  src:url("css/fonts/NoirPro-Regular.otf") format("opentype");
}

@font-face
{
  font-family:NoirPro-SemiBold;
  src:url("css/fonts/NoirPro-SemiBold.otf") format("opentype");
}
*/

@font-face
{
  font-family:NoirPro-Regular;
  src:url("css/fonts/NoirPro-Regular.eot"); /* IE9 Compat Modes */
  src:url("css/fonts/NoirPro-Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
      url("css/fonts/NoirPro-Regular.woff2") format("woff2"), /* Modern Browsers */
      url("css/fonts/NoirPro-Regular.woff") format("woff") /* Modern Browsers */
}

@font-face
{
  font-family:NoirPro-SemiBold;
  src:url("css/fonts/NoirPro-SemiBold.eot"); /* IE9 Compat Modes */
  src:url("css/fonts/NoirPro-SemiBold.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
      url("css/fonts/NoirPro-SemiBold.woff2") format("woff2"), /* Modern Browsers */
      url("css/fonts/NoirPro-SemiBold.woff") format("woff") /* Modern Browsers */
}


img.imageStretch
{
  width:100%;
}

video.videoStretch
{
  width:100%;
}

.imageGrowth
{
  overflow:hidden;
}
.imageGrowth img:first-child
{
  /*
  -webkit-transition: all 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: all 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: all 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  */
  transition: all 3.0s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.imageGrowth img:first-child:hover
{
  -ms-transform: scale(1.10); /* IE 9 */
  -webkit-transform: scale(1.10); /* Safari */
  transform:scale(1.10);
}

p img
{
  max-width:100%;
  height:auto;
  margin-bottom:5px;
}


.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

a
{
  color:inherit;
  text-decoration:none; /*bootstrap 5 defaults to underline*/
  outline:none; /*remove outline on image links, looks nicer.  If its needed for accessibility we can put it back in later*/

  cursor:pointer; /*for when <a doesn't have href, ie onclick="javascript*/
}

a:hover,
a:focus
{
  color:inherit;
  text-decoration:none;
  outline:none;
}

h1, h2, h3, h4, h5, h6
{
  padding:0px;
  margin:0px;
}

h1, h2, h3
{
  line-height:1.0;
}

p
{
  padding:0px;
  margin:0px;

  line-height:160%;
  padding-bottom:30px;
}

p a
{
  /*text-decoration:underline;*/
}


small,
.small
{
  display:inline-block;
  line-height:150%;
}

.container
{
  transition:all 0.15s;
}


/*
* - Mobile/Tablet navigation -
*/
body
{
  padding-right:0px!important;
}
body.noscroll
{
  position:fixed;
  overflow:hidden;
  width:100%;
}


.tmodal
{
  display:flex;
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  right:0;
  z-index:9;
  background-color:rgba(19, 19, 19, 0.993);

  transition:clip-path 500ms ease-out;

  justify-content:center;
  align-items:center;
  clip-path:polygon(100% -50%, 150% 0%, 130% 0%, 150% -20%);
  visibility:hidden;

  color:white;
}

.modal-active
{
  clip-path:polygon(50% -50%, 150% 50%, 50% 150%, -50% 50%);
  visibility:visible;
}


.tmodal nav
{
  opacity:0;
  transition:opacity 100ms linear;
  padding-top:30px;
  padding-bottom:30px;

  width:67%;
  margin-left:auto;
  margin-right:auto;
}
.tmodal nav ul
{
  text-align:left;
  list-style-type:none;
  font-weight:700;
  padding:0px;
  margin:0px;
}
.tmodal nav ul li
{
  display:block;
  margin-bottom:9px;
}
.tmodal nav ul li::before
{
  content:none;
}


.tmodal nav ul li a
{
  display:block;

  font-size:16px;
  color:white!important;
  text-decoration:none;
  position:relative;
}

.tmodal nav ul li a .fal
{
  float:right;
  font-size:16px;
  position:relative;
  top:4px;

  width:20px;
  text-align:center;
}

.tmodal nav ul li ul li
{
  margin-top:1px;
  margin-bottom:2px;
}
.tmodal nav ul li ul li a
{
  font-size:13px;
  font-weight:400;
}

.tmodal nav.nav-active
{
  opacity:1;
}

.menu-toggle
{
  z-index:10;
  position:fixed;
  top:27px;
  right:15px;
  right:5%;
  height:30px;
  width:30px;
  /*background-color:red;*/

  transition:all 250ms ease-in-out;
}
.menu-toggle:hover
{
  cursor:pointer;
  transform:scale(1.04);
}

.menu-toggle-active
{
  transform:rotate(45deg);
  border-radius:50%;
}
.menu-toggle-active:hover
{
  transform:rotate(45deg);
}
.menu-toggle-active .hamburger
{
  width:0;
  background-color:white!important;
}
.menu-toggle-active .hamburger::before {
  transform:translate(0px, 0px) rotate(-90deg);
  background-color:white!important;
}
.menu-toggle-active .hamburger::after
{
  transform:translate(0px, -2px);
  background-color:white!important;

  width:30px;
}

.hamburger
{
  margin-left:0px;
  margin-top:14px;
  height:2px;
  width:30px;
  border-radius:0px;
  background-color:white;
  transition:all 250ms ease-in-out;
}
.hamburger::before
{
  content:'';
  display:block;
  height:2px;
  width:30px;
  border-radius:0px;
  background-color:white;
  transition:all 250ms ease-in-out;
}
.hamburger::after
{
  content:'';
  display:block;
  height:2px;
  width:15px;
  border-radius:0px;
  background-color:white;
  transition:all 250ms ease-in-out;
}
.hamburger::before
{
  transform:translateY(-8px);
}
.hamburger::after
{
  transform:translateY(6px);
}



/*
* — Desktop navigation —
*/
.navigation
{
  text-align:center;
  list-style:none;
  padding:0px;
  padding-top:0px;
  margin:0px;
}

.navigation > li
{
  display:inline-block;
  font-size:16px;
  margin-left:5px;
  margin-right:5px;
  margin-bottom:13px;
  padding-left:0px;

  text-align:center;
}
.navigation > li::before
{
  content:none;
}

.navigation > li a
{
  padding-left:10px;
  padding-right:10px;
  padding-bottom:9px;
  border-bottom:4px solid transparent;

  width:100%;
  transition:border-bottom-color 0.15s;
}
.navigation > li a:hover,
.navigation > li a.active
{
  border-bottom:4px solid #00AAC4;
  color:#00AAC4;
}


.arrowMenuDownHolder
{
  position:absolute;
  text-align:center;
  padding-top:7px;
}

.arrowMenuUp
{
  display:block;
  height:15px;
  margin-left:auto;
  margin-right:auto;
  vertical-align:bottom;
}

.navSubHolder
{
  display:none;
  padding-top:40px;
}
.navSubHolderOpen
{
  display:block;
  position:absolute;

  /*transform:translate(-22%);*/
  /*transform:translate(-75px);*/

  width:295px;

  z-index:4;
}

.navSub
{
  list-style:none;
  padding:0px;
  margin:0px;

  padding-top:15px;
  padding-bottom:15px;

  background-color:white;
  color:#0C2F38;

  -webkit-box-shadow:10px 10px 50px -20px rgba(0, 0, 0, 0.25);
  -moz-box-shadow:10px 10px 50px -20px rgba(0, 0, 0, 0.25);
  box-shadow:10px 10px 50px -20px rgba(0, 0, 0, 0.25);

  border-radius:8px 8px 8px 8px;
  -moz-border-radius:8px 8px 8px 8px;
  -webkit-border-radius:8px 8px 8px 8px;
}

.navSub li
{
  padding-top:5px;
  padding-bottom:5px;
  padding-left:15px;
  padding-right:15px;
  margin-bottom:0px;
  font-size:14px;
  text-align:center;

  display:list-item;
}
.navSub li::before
{
  content:none;
}
.navSub li a
{
  display:inline;
  border-bottom:0px solid transparent!important;
}
.navSub li:last-child a
{
  /*border-bottom:0px;*/
}

.navSub li a:hover
{
  border-bottom:0px solid #F08300!important;;
  color:#F08300!important;;
}

.navSecondary
{

}
.navSecondary a:not(.buttonMedium)
{
  display:inline-block;
  margin-left:20px;
  margin-bottom:15px;
}
.navSecondary a:first-child:not(.buttonMedium)
{
  margin-left:0px;
}

.services-3-per-row h4{
  font-size:24px;
}


/* Style adjustments for viewports 320px and over go here, anything smaller than 320 treat it as 320 */
@media all and (min-width: 0px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/

    font-family:'Roboto', sans-serif;
    font-size:16px;
    color:#4B4B4B;

    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  h1
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:37px;
    line-height:1.0;
    color:#0C2F38;

    margin-bottom:25px;
  }

  h2
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:30px;
    line-height:1.2;
    color:#0C2F38;

    margin-bottom:20px;
  }

  h3
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:25px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:20px;
  }

  h4
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:29px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:20px;
  }

  h5
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:26px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:20px;
  }

  h6
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:24px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:20px;
  }


  /*default 3 columns*/
  .grid-item
  {
    width:50%;
  }

  /* 4 columns */
  .grid-item--col4
  {
    width:50%;
  }

  /* 6 columns */
  .grid-item--col6
  {
    width:50%;
  }

  /* 12 columns */
  .grid-item--col12
  {
    width:50%;
  }

  .grid-item img
  {
    width:100%;
  }


  .h-100Holder-md
  {
    height:auto;
  }
  .h-100Holder-lg
  {
    height:auto;
  }
  .h-100Holder-xl
  {
    height:auto;
  }

  .text-2-columns
  {
    column-count:1;
    column-gap:0px;
  }
  .text-3-columns
  {
    column-count:1;
    column-gap:0px;
  }
  .text-4-columns
  {
    column-count:1;
    column-gap:0px;
  }


  .newsTile
  {
    position:relative;
    overflow:hidden;
  }

  .newsTileOverlay
  {
    color:white!important;
    text-align:center;

    width:100%;
    height:100%;
    padding:7%;
    /*transition:background-color 0.5s, height 0.4s, width 0.25s;*/

    position:absolute;
    bottom:0px;
    left:0%;
    right:0%;
    z-index:1;


    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    background-color:rgba(19, 19, 19, 0.75);
  }

  .newsTile:hover .newsTileOverlay
  {
    background-color:rgba(19, 19, 19, 0.75);
  }

  .newsTile a
  {
    opacity:1.0;

    color:white;
    margin-bottom:0px;
    position:relative;
    top:0px;

  }
  .newsTile:hover a
  {
    opacity:1.0;
    color:white;
    top:0px;
  }

  .newsTile .buttonSmall,
  .newsTile .buttonMedium,
  .newsTile .buttonLarge
  {
    opacity:1.0;
    /*border:1px solid white;*/
    color:white;
    margin-bottom:0px;
    position:relative;
    top:0px;
  }
  .newsTile:hover .buttonSmall,
  .newsTile:hover .buttonMedium,
  .newsTile:hover .buttonLarge
  {
    opacity:1.0;
    /*border:1px solid white;*/
    color:white;
    top:0px;
  }


  .tabContent
  {
    display:block;
    padding-top:10px;
    padding-bottom:10px;
    padding-left:20px;
    padding-right:20px;

    border:1px solid #F0F0F0;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;

    margin-bottom:10px;
  }
  .tabContent:first-child
  {
    display:block;
  }
  .tabContent.active
  {
    border-color:#F2F4F6;
  }

  .tabContentInner
  {
    height:0px;
    overflow:hidden;
  }


  .featureBar
  {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;

    padding-top:50px;
    padding-bottom:50px;
  }


  .header .logo
  {
    max-width:175px;
  }

  .bgDirectors
  {
    background-image:url("images/slantsWhiteBackward.svg");
    background-repeat:no-repeat;
    background-position:right -685px top -0px;
    background-size:auto auto;
  }
}


/*iPhone 6 or iPhone 5 sideways*/
@media all and (min-width: 375px)
{

}


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/

    font-family:'Roboto', sans-serif;
    font-size:16px;
    color:#4B4B4B;

    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  h1
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:50px;
    line-height:1.0;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h2
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:35px;
    line-height:1.2;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h3
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:27px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h4
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:29px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h5
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:26px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h6
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:24px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }


  /*default 3 columns*/
  .grid-item
  {
    width:25%;
  }

  /* 4 columns */
  .grid-item--col4
  {
    width:33.33%;
  }

  /* 6 columns */
  .grid-item--col6
  {
    width:50%;
  }

  /* 12 columns */
  .grid-item--col12
  {
    width:100%;
  }

  .grid-item img
  {
    width:100%;
  }


  .h-100Holder-md
  {
    height:100%;
  }
  .h-100Holder-lg
  {
    height:auto;
  }
  .h-100Holder-xl
  {
    height:auto;
  }

  .text-2-columns
  {
    column-count:2;
    column-gap:40px;
  }
  .text-3-columns
  {
    column-count:3;
    column-gap:40px;
  }
  .text-4-columns
  {
    column-count:3;
    column-gap:40px;
  }


  .newsTile
  {
    position:relative;
    overflow:hidden;
  }

  .newsTileOverlay
  {
    color:white!important;
    text-align:center;

    width:100%;
    height:100%;
    padding:7%;
    /*transition:background-color 0.5s, height 0.4s, width 0.25s;*/

    position:absolute;
    bottom:0px;
    left:0%;
    right:0%;
    z-index:1;


    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    background-color:transparent;
  }

  .newsTile:hover .newsTileOverlay
  {
    background-color:rgba(19, 19, 19, 0.75);
  }

  .newsTile a
  {
    opacity:0.0;

    color:white;
    margin-bottom:0px;
    position:relative;
    top:100px;
  }
  .newsTile:hover a
  {
    opacity:1.0;
    color:white;
    top:0px;
  }

  .newsTile .buttonSmall,
  .newsTile .buttonMedium,
  .newsTile .buttonLarge
  {
    opacity:0.0;
    /*border:1px solid white;*/
    color:white;
    margin-bottom:0px;
    position:relative;
    top:100px;
  }
  .newsTile:hover .buttonSmall,
  .newsTile:hover .buttonMedium,
  .newsTile:hover .button
  {
    opacity:1.0;
    /*border:1px solid white;*/
    color:white;
    top:0px;
  }


  .tabContent
  {
    display:none;
    padding-top:20px;
    padding-bottom:20px;
    padding-left:20px;
    padding-right:20px;

    border:1px solid #F2F4F6;
    border-top-left-radius:0px;
    border-top-right-radius:0px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;

    margin-bottom:10px;
  }
  .tabContent:first-child
  {
    display:block;
  }
  .tabContent.active
  {
    border-color:#F2F4F6;
  }

  .tabContentInner
  {
    height:auto!important;
    overflow:hidden;
  }


  .featureBar
  {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;

    padding-top:50px;
    padding-bottom:50px;
  }


  .header .logo
  {
    max-width:175px;
  }

  .bgDirectors
  {
    background-image:url("images/slantsWhiteBackward.svg");
    background-repeat:no-repeat;
    background-position:right -685px top -0px;
    background-size:auto auto;
  }
  .services-3-per-row h4{
    font-size:29px;
  }
}


/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/

    font-family:'Roboto', sans-serif;
    font-size:16px;
    color:#4B4B4B;

    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  h1
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:60px;
    line-height:1.0;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h2
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:37px;
    line-height:1.2;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h3
  {
    font-family:NoirPro-SemiBold, sans-serif;
    font-weight:600;
    font-size:30px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h4
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:29px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h5
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:26px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }

  h6
  {
    font-family:NoirPro-Regular, sans-serif;
    font-weight:normal;
    font-size:24px;
    line-height:1.1;
    color:#0C2F38;

    margin-bottom:30px;
  }


  /*default 3 columns*/
  .grid-item
  {
    width:25%;
  }

  /* 4 columns */
  .grid-item--col4
  {
    width:33.33%;
  }

  /* 6 columns */
  .grid-item--col6
  {
    width:50%;
  }

  /* 12 columns */
  .grid-item--col12
  {
    width:100%;
  }

  .grid-item img
  {
    width:100%;
  }


  .h-100Holder-md
  {
    height:100%;
  }
  .h-100Holder-lg
  {
    height:100%;
  }
  .h-100Holder-xl
  {
    height:auto;
  }

  .text-2-columns
  {
    column-count:2;
    column-gap:60px;
  }
  .text-3-columns
  {
    column-count:3;
    column-gap:60px;
  }
  .text-4-columns
  {
    column-count:4;
    column-gap:60px;
  }


  .newsTile
  {
    position:relative;
    overflow:hidden;
  }

  .newsTileOverlay
  {
    color:white!important;
    text-align:center;

    width:100%;
    height:100%;
    padding:7%;
    /*transition:background-color 0.5s, height 0.4s, width 0.25s;*/

    position:absolute;
    bottom:0px;
    left:0%;
    right:0%;
    z-index:1;


    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    background-color:transparent;
  }

  .newsTile:hover .newsTileOverlay
  {
    background-color:rgba(19, 19, 19, 0.75);
  }

  .newsTile a
  {
    opacity:0.0;

    color:white;
    margin-bottom:0px;
    position:relative;
    top:100px;
  }
  .newsTile:hover a
  {
    opacity:1.0;
    color:white;
    top:0px;
  }

  .newsTile .buttonSmall,
  .newsTile .buttonMedium,
  .newsTile .buttonLarge
  {
    opacity:0.0;
    /*border:1px solid white;*/
    color:white;
    margin-bottom:0px;
    position:relative;
    top:100px;
  }
  .newsTile:hover .buttonSmall,
  .newsTile:hover .buttonMedium,
  .newsTile:hover .buttonLarge
  {
    opacity:1.0;
    /*border:1px solid white;*/
    color:white;
    top:0px;
  }


  .tabContent
  {
    display:none;
    padding-top:20px;
    padding-bottom:20px;
    padding-left:20px;
    padding-right:20px;

    border:1px solid #F2F4F6;
    border-top-left-radius:0px;
    border-top-right-radius:0px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;

    margin-bottom:10px;
  }
  .tabContent:first-child
  {
    display:block;
  }
  .tabContent.active
  {
    border-color:#F2F4F6;
  }

  .tabContentInner
  {
    height:auto!important;
    overflow:hidden;
  }


  .featureBar
  {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;

    padding-top:125px;
    padding-bottom:125px;
  }


  .tmodal
  {
    display:none;
  }

  .header .logo
  {
    max-width:175px;
  }

  .bgDirectors
  {
    background-image:url("images/slantsWhiteBackward.svg");
    background-repeat:no-repeat;
    background-position:right -480px top -170px;
    background-size:auto auto;
  }
}


/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px)
{
  .h-100Holder-md
  {
    height:100%;
  }
  .h-100Holder-lg
  {
    height:100%;
  }
  .h-100Holder-xl
  {
    height:100%;
  }


  .header .logo
  {
    max-width:240px;
  }

  .navigation
  {
    text-align:center;
    list-style:none;
    padding:0px;
    padding-top:5px;
    margin:0px;
  }

  .navigation > li
  {
    display:inline-block;
    font-size:18px;
    margin-left:12px;
    margin-right:12px;
    margin-bottom:15px;
    padding-left:0px;

    text-align:center;
  }
  .navigation > li::before
  {
    content:none;
  }

  .navigation > li a
  {
    padding-left:12px;
    padding-right:12px;
    padding-bottom:10px;
    border-bottom:5px solid transparent;

    width:100%;
    transition:border-bottom-color 0.15s;
  }
  .navigation > li a:hover,
  .navigation > li a.active
  {
    border-bottom:5px solid #00AAC4;
    color:#00AAC4;
  }

  .navSecondary a:not(.buttonMedium)
  {
    display:inline-block;
    margin-left:30px;
    margin-bottom:15px;
  }
}

@media (min-width: 1300px)
{
  .footer
  {
    background-image:url("images/slantsBlueForward.svg");
    background-repeat:no-repeat;
    background-position:right -440px center;
    background-size:auto 100%;
  }
}


@media (min-width: 1400px)
{
  .header .logo
  {
    max-width:320px;
  }

  .navigation
  {
    text-align:center;
    list-style:none;
    padding:0px;
    padding-top:20px;
    margin:0px;
  }

  .navigation > li
  {
    display:inline-block;
    font-size:18px;
    margin-left:15px;
    margin-right:15px;
    margin-bottom:15px;
    padding-left:0px;

    text-align:center;
  }
}


@media (min-width: 1600px)
{
  /*
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl
  {
    max-width:1420px;
  }
  */

  .header .logo
  {
    max-width:none;
  }
}


@media (min-width: 1900px)
{
  /*
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl
  {
    max-width:1670px;
  }
  */
}


.panelBg
{
  height:100%;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
}



/*
* - slick slider -
*/
.slick-arrow
{
  cursor:pointer;
  font-size:27px;
  transition:all 0.4s;
  /*padding-right:16px;*/
  color:#3D627C;
}
.slick-arrow:hover
{
  opacity:0.75;
}

.slick-dots
{
  /*bottom:-50px!important;*/
  left:0px!important;
}

.slick-dots li
{
  margin-left:1px!important;
  margin-right:1px!important;
}
.slick-dots li::before
{
  content:none;
}
.slick-dots li button::before
{
  font-size:12px!important;
  color:#F2F4F6!important;
  opacity:0.66!important;
}
.slick-dots li button:hover::before
{
  opacity:1.0!important;
}
.slick-dots li.slick-active button::before
{
  color:#00AAC4!important;
}

.slick-prev1
{
  /*display:inline-block;*/
  position:absolute;
  top:50%;
  left:15px;
}
.slick-next1
{
  /*display:inline-block;*/
  position:absolute;
  top:50%;
  right:15px;
}

.sliderBanners.slick-slider > div
{
  line-height:0px; /*removes space under individual slides - in particular video slides*/
}
.sliderBanners.slick-slider > div .slideBanner *
{
  line-height:normal; /*restore "normal" line height for buttons*/
}

.sliderBanners.slick-dotted.slick-slider
{
  margin-bottom:0px!important;
}
/*
.sliderBanners .slick-dots
{
  text-align:right;
  padding-left:30px;
  padding-right:30px;

  bottom:50px;
}
*/
.sliderBanners .slick-track
{
  display:flex!important;
}
.sliderBanners .slick-slide
{
  height:inherit!important;
}
.sliderBanners .slick-slide > div
{
  height:100%;
}
.sliderBannerTextHolder
{
  /*
  padding-top:70px;
  padding-bottom:30px;
  */
  padding-top:14vw;
  padding-bottom:7vw;
}
.sliderBannerTextHolder *
{
  color:white;
}
.sliderBannerWithBgImage
{
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
}


.sliderBannerSplits.slick-slider > div
{
  line-height:0px; /*removes space under individual slides - in particular video slides*/
}
.sliderBannerSplits.slick-slider > div .slideBannerSplit *
{
  line-height:normal; /*restore "normal" line height for buttons*/
}
.sliderBannerSplits.slick-dotted.slick-slider
{
  margin-bottom:0px!important;
}
/*
.sliderBannerSplits .slick-dots
{
  text-align:right;
  padding-left:30px;
  padding-right:30px;

  bottom:50px;
}
*/
.sliderBannerSplits .slick-track
{
  display:flex!important;
}
.sliderBannerSplits .slick-slide
{
  height:inherit!important;
}
.sliderBannerSplits .slick-slide > div
{
  height:100%;
}


/*applies to backend editor, no effect to frontend*/
.acf-block-preview .sliderGallery .slideGallery
{
  float:left;
  width:30%;
}

.sliderGallery .slideGallery
{
  padding-left:8px;
  padding-right:8px;
  padding-bottom:10px;
}
.sliderGallery .slideGallery img
{
  margin-bottom:15px;
}


/*applies to backend editor, no effect to frontend*/
.acf-block-preview .sliderLogos .slideLogo
{
  width:200px;
  float:left;
}


.sliderTestimonialsV2 .slideTestimonial
{
  padding-left:10px;
  padding-right:10px;
  padding-bottom:10px;
}

.sliderTestimonialsV3 .slideTestimonial
{
  padding-bottom:10px;
}

.speechBox
{
  border:2px solid #00AAC4;
}
/*
.speechBox::after
{
  content:url("images/speechBoxArrow.svg");
  position:relative;
  top:0px;
  left:calc(50% - 15px);
}
*/

.sliderIndustries .slick-track
{
  display:flex!important;
}
.sliderIndustries .slick-slide
{
  height:inherit!important;
}
.sliderIndustries .slick-slide > div
{
  height:100%;
}
.sliderIndustries .slideIndustry
{
  padding-left:25px;
  padding-right:25px;
  padding-bottom:20px;
}

.boxShadow
{
  box-shadow:0px 3px 6px rgba(0, 0, 0, 0.16);
}


.tabs
{
  font-size:19px;
  font-weight:bold;
  line-height:20px;
  color:#222222;

  position:relative;
  z-index:1;
  top:1px;
}
.tabs a
{
  display:block;
  padding:20px;

  border:1px solid #F0F0F0;
  border-bottom:1px solid #F2F4F6;
  border-top-left-radius:5px;
  border-top-right-radius:5px;

  height:100%;
}
.tabs a.active
{
  background-color:#F2F4F6;

  border:1px solid #F2F4F6;
  border-bottom:1px solid #F2F4F6;
}

.tabMobileButton
{
  display:inline-block;
  font-size:30px;
  line-height:30px;
  height:30px;
  color:#131313;
  float:right;
}
.tabMobileButton:hover
{
  /*color:anothercolor;*/
  /*
  iPhone obeys the hover color, but not the focus - so lets just make it the same color always
  android doesn't obey the hover on tap, but on finger hold it obeys the hover.
  */
  color:#131313;
}
.tabMobileButton:focus
{
  color:#F2F4F6;
}


.pagination
{
  margin-bottom:75px;
}
.page-numbers
{
  display:inline-block;
  width:30px;
  height:30px;
  border-radius:5px;
  border:1px solid #00AAC4;

  font-size:16px;
  line-height:28px;
  text-align:center;
  background-color:white;
  color:#0C2F38;

  margin-left:1px;
  margin-right:1px;
  margin-bottom:10px;
}

.page-numbers *
{

}

.page-numbers.current
{
  border:1px solid #00AAC4;
  background-color:#00AAC4;
  color:#0C2F38;
}


.header
{
  width:100%;
  position:fixed;
  z-index:4;
  top:0px;

  padding:24px;

  background-color:transparent;
  color:white;

  transition:background 450ms ease-in-out;

  box-shadow:0 10px 20px rgba(150,150,150,0.01);
  -webkit-box-shadow:0 10px 20px rgba(150,150,150,0.01);
  -moz-box-shadow:0 10px 20px rgba(150,150,150,0.01);

  font-family:NoirPro-Regular, sans-serif;
}
.header.bgNavy
{
  background-color:#0C2F38;
  background-color:rgba(12, 47, 56, 0.993)
}
/*when fancybox is open it wants to add 15px margin right to any position:fixed element*/
.fancybox-margin .header
{
  width:calc(100% - 15px);
}

.rank-math-breadcrumb
{
  font-family:NoirPro-Regular, sans-serif;
  font-size:16px;
  color:#0C2F38;
  margin-top:20px;
  margin-bottom:3px;
}
.rank-math-breadcrumb .separator
{
  font-size:100%;
}
.rank-math-breadcrumb .last
{
  font-family:NoirPro-SemiBold, sans-serif;
  font-size:105%;
}

.titleBar
{
  background-image:url("images/slantsBlueBackward.svg");
  background-repeat:no-repeat;
  background-position:right -175px bottom -215px;
}

.bannerBarHolder
{
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
  background-blend-mode:overlay;

  overflow:clip;

  position:relative;
  min-height:86vh;
  /*max-height:-webkit-fill-available;*/
}
.bannerBarImg
{
  width: 90%;
}
@media only screen and (min-width:1400px)
{
  .bannerBarImg
  {
    width: 80%;
  }
}
.bannerBar
{
  background-image:url("images/slantsBlueBackward.svg");
  background-repeat:no-repeat;
  background-position:right -90px bottom -75px;

  position:relative;
  z-index:1;
  min-height:86vh;
  /*max-height:-webkit-fill-available;*/
}
.bannerBar h1{
  font-size:40px;
}
.bannerScroll
{
  position:absolute;
  width:100%;
  z-index:1;
  text-align:center;
  bottom:30px;
}
.bannerScroll img
{
  display:inline!important;
}


.contactTable
{
  display:inline-block;
  margin-right:30px;
  margin-bottom:30px;
  text-align:left;
}

.contactTable td i
{
  font-size:28px;
  padding-right:20px;
}

footer
{
  background-color:#0C2F38;
  color:white;
}

.footer
{
  padding-top:50px;
  padding-bottom:20px;
  padding-left:30px;
  padding-right:30px;

  font-size:12px;
}

.footerLinks
{
  font-family:NoirPro-Regular, sans-serif;
  font-size:15px;

  margin-bottom:35px;
}
.footerLinks a
{
  display:block;

  padding-left:0px;
  padding-right:0px;
  margin-bottom:10px;
}

.footerContactLinks
{
  font-family:NoirPro-Regular, sans-serif;
  font-size:16px;

  margin-bottom:30px;
}
.footerContactLinks a
{
  display:inline-block;

  padding-left:0px;
  padding-right:0px;
  margin-bottom:5px;
}


input.text,
div.wpforms-container-full .wpforms-form input[type="text"],
div.wpforms-container-full .wpforms-form input[type="email"]
{
  width:100%;
  height:40px!important;

  padding-left:15px!important;
  padding-right:15px!important;
  padding-top:1px!important;
  padding-bottom:0px!important;

  border:1px solid #0C2F38!important;

  font-family:NoirPro-Regular, sans-serif;
  font-weight:normal;
  font-size:16px!important;
  color:#0C2F38!important;

  margin-top:0px;
  margin-bottom:15px;

  -webkit-appearance:none;
  border-radius:5px 5px 5px 5px!important;
}

input[type="submit"],
div.wpforms-container-full .wpforms-form button[type="submit"]
{
  cursor:pointer;
  display:inline-block;

  padding-left:20px!important;
  padding-right:20px!important;
  padding-top:0px!important;
  padding-bottom:0px!important;

  max-width:100%;
  height:40px;

  border:1px solid #00AAC4!important;
  background-color:transparent;
  color:#00AAC4!important;

  font-family:NoirPro-Regular, sans-serif;
  font-weight:normal;
  font-size:16px!important;
  text-align:center;

  margin-bottom:15px;

  -webkit-appearance:none;
  border-radius:5px 5px 5px 5px!important;
}

select,
div.wpforms-container-full .wpforms-field.wpforms-field-select-style-classic select
{
  width:100%;
  height:40px;

  padding-left:15px!important;
  padding-right:45px!important;

  border:1px solid #0C2F38;
  background-color:white; /*iPhone's*/

  font-family:NoirPro-Regular, sans-serif;
  font-weight:normal;
  color:#0C2F38;

  margin-top:0px;
  margin-bottom:15px;

  -webkit-appearance:none;
  -moz-appearance:none;
  -ms-appearance:none;
  appearance:none;
  border-radius:5px 5px 5px 5px!important;

  background-image:url("images/arrow-select.svg");
  background-repeat:no-repeat;
  background-position:calc(100% - 15px - 2px) center;
  background-size:25px 25px;

  cursor:s-resize;
}

.selectFilter
{
  width:100%;
  min-height:40px;
  /*
  padding-top:12px;
  padding-bottom:12px;

  padding-left:25px!important;
  padding-right:25px!important;
  */

  border:1px solid #0C2F38;
  background-color:white; /*iPhone's*/

  font-family:NoirPro-Regular, sans-serif;
  font-weight:normal;
  font-size:16px;
  color:#0C2F38;

  margin-top:0px;
  margin-bottom:15px;

  -webkit-appearance:none;
  -moz-appearance:none;
  -ms-appearance:none;
  appearance:none;
  border-radius:5px 5px 5px 5px!important;

  position:relative;
}
.selectFilter:hover
{
  background-color:#F2F4F6;
}

.bgGreyWhite .selectFilter:hover
{
  background-color:white;
}

/*
.selectFilter:focus
{
  background-color:white;
}
*/

.selectFilter > a
{
  display:block;
  width:calc(100% - 50px);
  overflow:hidden;
  white-space:nowrap;

  padding-top:12px;
  padding-bottom:12px;

  padding-left:25px;
  padding-right:25px;
}

.selectFilter .selectFilterIcon
{
  transition:all 0.4s;
  position:absolute;
  top:13px;
  right:18px;
}

.rotated180
{
  transform:rotate(180deg);
  transform-origin:center center;
}

.selectFilters
{
  /*padding-top:20px;*/
  padding-top:8px;
  padding-left:25px;
  padding-right:25px;
  display:none;
}
.selectFilters > div
{
  margin-top:0px;
  margin-bottom:12px;
}
.selectFilters input[type='checkbox']
{
  float:right;
  position:relative;
  top:5px;
}


textarea, /*must be commented out for editor-style.css*/
div.wpforms-container-full .wpforms-form textarea
{
  border:1px solid #0C2F38!important;

  width:100%;
  min-height:170px;
  resize:none;

  padding-top:15px!important;
  padding-bottom:15px!important;
  padding-left:15px!important;
  padding-right:15px!important;

  font-family:NoirPro-Regular, sans-serif;
  font-weight:normal;
  font-size:16px!important;
  color:#0C2F38!important;

  margin-top:0px!important;
  margin-bottom:15px!important;

  -webkit-appearance:none;
  border-radius:5px 5px 5px 5px!important;
}



input[type="submit"],
button[type="submit"]
{
  transition:all 0.4s;
  -webkit-filter: brightness(1.0);
  filter: brightness(1.0);
}

input[type="submit"]:hover,
button[type="submit"]:hover
{
  -webkit-filter: brightness(1.13);
  filter: brightness(1.13);
}

/*to override WPForms*/
.wpforms-form .wpforms-field
{
  padding-top:0px!important;
  padding-bottom:0px!important;
}

.wpforms-form .wpforms-field input,
.wpforms-form .wpforms-field select
{
  max-width:none!important;
}

div.wpforms-container-full .wpforms-form .wpforms-submit-container
{
  padding-top:0px!important;
}

div.wpforms-container-full .wpforms-form input[type="submit"],
div.wpforms-container-full .wpforms-form button[type="submit"]
{
  background-color:transparent!important;
  border:1px solid #00AAC4!important;
}

div.wpforms-container-full .wpforms-form input[type="submit"]:hover,
div.wpforms-container-full .wpforms-form input[type="submit"]:focus,
div.wpforms-container-full .wpforms-form input[type="submit"]:active,
div.wpforms-container-full .wpforms-form button[type="submit"]:hover,
div.wpforms-container-full .wpforms-form button[type="submit"]:focus,
div.wpforms-container-full .wpforms-form button[type="submit"]:active
{
	  background-color:#00AAC4!important;
  border:1px solid #00AAC4!important;
  color:white!important;
}

div.wpforms-container-full .wpforms-form input[type="checkbox"]
{
  margin-bottom:15px!important;
}

div.wpforms-container-full .wpforms-form label.wpforms-error
{
  /*display:none;*/
  margin-bottom:15px;
}

div.wpforms-container-full .wpforms-form textarea:focus
{
  border:1px solid #F2F4F6;
}

.wpforms-form ul li::before
{
  content:none;
}

.wpforms-confirmation-container-full
{
  background-color:#00AAC4!important;
  border:0px!important;
}
.wpforms-confirmation-container-full p:last-child
{
  padding-bottom:0px;
}



/* The custom-checkbox */
.custom-checkbox
{
  display:block;
  position:relative;

  margin-bottom:0px;
  cursor:pointer;

  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;

  font-weight:normal;

  padding-top:5px;
  padding-bottom:25px;

  padding-left:45px;
  padding-right:0px;
}

/* Hide the browser's default checkbox */
.custom-checkbox input
{
  position:absolute;
  opacity:0;
  cursor:pointer;
}

/* Create a custom checkbox */
.checkmark
{
  position:absolute;
  top:0px;
  left:0px;
  height:30px;
  width:30px;
  background-color:white;

  border:1px white #CCCCCC;
  border-radius:0px 0px 0px 0px;
}

/* On mouse-over, add a grey background color */
.custom-checkbox:hover input ~ .checkmark
{
  /*background-color:#EEEEEE;*/
}

/* When the checkbox is checked, add a background color */
.custom-checkbox input:checked ~ .checkmark
{
  background-color:white;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after
{
  content:"";
  position:absolute;
  display:none;
}

/* Show the checkmark when checked */
.custom-checkbox input:checked ~ .checkmark:after
{
  display:block;
}

/* Style the checkmark/indicator */
.custom-checkbox .checkmark:after {
  left:10px;
  top:5px;
  width:8px;
  height:15px;
  border:solid #002C56;
  border-width:0px 3px 3px 0px;
  -webkit-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform:rotate(45deg);
}


.buttonSmall
{
  display:inline-block;

  padding-top:2px;
  padding-bottom:2px;
  padding-left:15px;
  padding-right:15px;

  margin-left:3px;
  margin-right:3px;
  margin-bottom:15px;

  font-family:NoirPro-Regular, sans-serif;
  font-size:16px;
  font-weight:normal;
  text-align:center;
  border-radius:15px;
  border:1px solid transparent;

  transition:all 0.3s;
}
.buttonMedium
{
  display:inline-block;

  padding-top:7px;
  padding-bottom:7px;
  padding-left:19px;
  padding-right:19px;

  margin-left:3px;
  margin-right:3px;
  margin-bottom:15px;

  font-family:NoirPro-Regular, sans-serif;
  font-size:16px;
  font-weight:normal;
  text-align:center;
  border-radius:20px;
  border:1px solid transparent;

  transition:all 0.3s;
}
.buttonLarge
{
  display:inline-block;

  padding-top:15px;
  padding-bottom:15px;
  padding-left:35px;
  padding-right:35px;

  margin-left:3px;
  margin-right:3px;
  margin-bottom:15px;

  font-family:NoirPro-Regular, sans-serif;
  font-size:18px;
  font-weight:normal;
  text-align:center;
  border-radius:30px;
  border:1px solid transparent;

  transition:all 0.3s;
}


.buttonRounded
{
  border-radius:5px;
}
.buttonSquared
{
  border-radius:0px;
}


.buttonBorderGreyLight
{
  border:1px solid #F2F4F6;
  color:#0C2F38;
}
.buttonBorderGreyLight:hover
{
  background-color:#F2F4F6;
  color:#0C2F38;
}

.buttonBorderGrey
{
  border:1px solid #4B4B4B;
  color:#0C2F38;
}
.buttonBorderGrey:hover
{
  background-color:#4B4B4B;
  color:#FFFFFF;
}

.buttonBorderWhite
{
  border:1px solid #FFFFFF;
  color:#0C2F38;
}
.buttonBorderWhite:hover
{
  background-color:#FFFFFF;
  color:#0C2F38;
}

.buttonBorderNavy
{
  border:1px solid #0C2F38;
  color:#0C2F38;
}
.buttonBorderNavy:hover
{
  background-color:#0C2F38;
  color:white;
}

.buttonBorderBlue
{
  border:1px solid #00AAC4;
  color:#0C2F38;
}
.buttonBorderBlue:hover
{
  background-color:#00AAC4;
  color:white;
}

.buttonBorderOrange
{
  border:1px solid #F08300;
  color:#0C2F38;
}
.buttonBorderOrange:hover
{
  background-color:#F08300;
  color:#0C2F38;
}

/*
  Remove ugly default square blue outlines on Firefox and Chrome.
  Remove ugly default square black outline on Microsoft Edge (Chromium).
  Safari's is rounded
*/
/*Any Firefox*/
@-moz-document url-prefix()
{
  input:focus,
  select:focus,
  textarea:focus,
  button:focus
  {
    outline:none;
  }
}
/*Chrome 29+*/
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm)
{
  input:focus,
  select:focus,
  textarea:focus,
  button:focus
  {
    outline:none;
  }
}

.socialHolder
{
  position:fixed;
  z-index:2;
  bottom:30px;
  right:40px;
}
.buttonSocial
{
  display:inline-block;
  height:32px;
  width:32px;
  border-radius:50%;
  border:1px solid white;
  overflow:hidden;
  text-align:center;
  color:white!important;
  margin-left:0px;
  margin-right:0px;
  margin-bottom:8px;

  transition:all 0.3s;
}
.buttonSocial *
{
  font-size:18px;
  line-height:30px;
}

.greyLight
{
  color:#F2F4F6;
}
.grey
{
  color:#4B4B4B;
}

.white
{
  color:#FFFFFF;
}

.navy
{
  color:#0C2F38;
}
.blue
{
  color:#00AAC4;
}
.orange
{
  color:#F08300;
}



.bgGreyLight
{
  background-color:#F2F4F6;
}
.bgGrey
{
  background-color:#4B4B4B;
  color:#FFFFFF;
}

.bgWhite
{
  background-color:#FFFFFF;
  color:#0C2F38;
}

.bgNavy
{
  background-color:#0C2F38;
  color:#FFFFFF!important;
}
.bgBlue
{
  background-color:#00AAC4;
  color:#FFFFFF;
}
.bgOrange
{
  background-color:#F08300;
  color:#0C2F38;
}

.roundedBorders
{
  border-radius:8px;
}


/*
.dividerGreyLight
{
  margin-top:20px;
  margin-bottom:20px;
  border-top:1px solid #DEDEDE;
}
*/


img.center
{
  display:block;
  margin-left:auto;
  margin-right:auto;
}
.center
{
  text-align:center;
}


.no-gutter > [class*='col']
{
  padding-left:0;
  padding-right:0;
}

.no-padding
{
  padding:0!important;
}

.padding15
{
  padding:15px;
}
.padding30
{
  padding:30px;
}
.padding40
{
  padding:40px;
}

.padding45
{
  padding:45px;
}

.padding10Percent
{
  padding:10%;
}
.padding15Percent
{
  padding:15%;
}

.paddingLeftRigth5Percent
{
  padding-left:5%;
  padding-right:5%;
}


iframe
{
  width:100%;
  margin-bottom:30px;
}

.fancybox-skin
{
  background-color:#FAFAFA!important;
  color:inherit!important;
}

/*applies to backend editor, no effect to frontend*/
.wp-block-acf-general-spacer
{
  border:1px dashed grey;
}

.has_dark_background {
  background: #0C2F38;
  padding-top: 40px;
  padding-bottom: 40px;
}

.has_dark_background,
.has_dark_background p,
.has_dark_background h1,
.has_dark_background h2,
.has_dark_background h3,
.has_dark_background h4,
.has_dark_background h5,
.has_dark_background h6,
.has_dark_background a,
.has_dark_background span {
  color: #ffffff !important;
}