html{color:#222;font-size:1em;line-height:1.4}::-moz-selection{background:var(--main);text-shadow:none;color:#fff;}::selection{background:var(--main);text-shadow:none;color:#fff;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.browserupgrade{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
:root {
  --main: #002E5E;
  --maindarker: #001c38;
  --grey: #939598;
  --darker: #1a1a1a;

}

@font-face {font-family: "Combi Sans W01 Medium";
  src: url("fonts/072548a65e217b69b29087e11175c486.eot"); /* IE9*/
  src: url("fonts/072548a65e217b69b29087e11175c486.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("fonts/072548a65e217b69b29087e11175c486.woff2") format("woff2"), /* chrome、firefox */
  url("fonts/072548a65e217b69b29087e11175c486.woff") format("woff"), /* chrome、firefox */
  url("fonts/072548a65e217b69b29087e11175c486.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("fonts/072548a65e217b69b29087e11175c486.svg#Combi Sans W01 Medium") format("svg"); /* iOS 4.1- */
}

body::-webkit-scrollbar {
  width: 11px;
}
body {
  scrollbar-width: thin;
  scrollbar-color: var(--main) var(--darker);
}
body::-webkit-scrollbar-track {
  background: var(--darker);
}
body::-webkit-scrollbar-thumb {
  background-color: var(--main);
  border-radius: 6px;
  border: 3px solid var(--darker);
}

html { box-sizing: border-box; font-size: 16px;} *, *:before, *:after { box-sizing: inherit; }
a{-webkit-transition:all 0.3s ease;
         -moz-transition:all 0.3s ease;
               -o-transition:all 0.3s ease;
                     transition:all 0.3s ease;
text-decoration: none;
color: var(--main); font-weight: 600;}
a img{-webkit-transition:all 0.3s ease;
         -moz-transition:all 0.3s ease;
               -o-transition:all 0.3s ease;
                     transition:all 0.3s ease;}
a:hover{}
.smoothie{-webkit-transition:all 0.3s ease;
         -moz-transition:all 0.3s ease;
               -o-transition:all 0.3s ease;
                     transition:all 0.3s ease;}
h1,h2,h3,h4,h5,h6{margin: 0 0 10px 0; color: var(--main); text-transform: uppercase; font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif;}
h1{font-size: 2.5em}
.whiteheader{color: #fff;}
p{margin: 0 0 10px 0;}
strong{font-weight: 800; color: var(--grey);}
img, iframe{max-width: 100%;}
.pinkh{color: var(--main);}
.container{width: 100%; max-width: 1920px; margin: 0 auto; font-family: 'Open Sans', sans-serif; font-weight: 400; color: #222; box-shadow: 0 30px 90px rgba(0,0,0,0.25), 0 7px 20px rgba(0,0,0,0.05); border-radius: 5px;}
body{background: var(--main);}
.header{width: 100%; max-width: 1920px; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap; position: fixed; top: 0; z-index: 2046; transition: all 0.3s ease; background: #fff;  box-shadow : rgb(0, 0, 0) 0px -20px 30px 6px;}
.thelogo{transition: all 0.3s ease; }
.logoholder{outline: 0px solid red; line-height: 30px; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; padding: 0 40px; width: 300px; order: 1;}
.logo{width: 300px; position: relative;}

.headcontact{outline: 0px solid red; flex-grow: 1; display: flex;  order:2; padding-top: 3px;}
.headcontact a{font-size: 14px;}
.headcontactlarge{justify-content: center; align-content: flex-start; flex-direction: column; flex-wrap: wrap;}
.headcontactsmall{display: none;justify-content: flex-start; flex-wrap: wrap;}
.navigation{display: flex; justify-content: flex-end; flex-wrap: wrap; order: 3; flex-grow: 1; outline: 0px solid red; align-content: center; margin: 0; padding: 0 40px;}
.navlink{color: var(--grey); letter-spacing: 1px; font-size: 16px; position: relative; text-transform: uppercase; font-weight: 400; letter-spacing: 1px; font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif; display: flex; justify-content: center; align-items: center; padding: 40px 20px; margin-right: 0; }


.navlink:hover{opacity: 1; color: var(--main); background: #f1f1f2;}
.navlink:hover .navlinker{opacity: 1; height: 20px;background: var(--main);}

.navcalllink{display: flex; justify-content: center; align-items: center; flex-direction: column; background: var(--main); font-size: 32px; color: #fff; padding: 20px 40px; order:3; position: relative;}
.navspan{width: 100%; font-size: 14px; margin-bottom: 0px; text-align: center;color: var(--grey);}

.navplus{position: absolute; right: 10px; top: 0px; width: 25px;}

.navcalllink:hover{background: #fff; color: var(--main);}

.current{font-weight: 900; color: var(--main); background: #f1f1f2;}
.current .navlinker{height: 20px; background: var(--main); opacity: 1;}

.headerphone{font-size: 30px; font-weight: 700; margin: 0; line-height: 24px; position: relative; color: #fff}
.headercallnow{position: absolute; top: -25px; left: 0; font-size: 14px; color: #ccc; font-weight: 300;}
.headerphoneholder{outline: 0px solid red; display: flex; justify-content: flex-end; align-items: flex-end; flex-wrap: wrap; padding: 0 0 20px 0; width: 25%; order: 3;}


.arrowholder{width: 100%; position: absolute; bottom: 0; left: 0; display: flex; justify-content: center; flex-wrap: wrap; z-index: 30;}
.arrow{

}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 5px solid #fff;
    border-right: 5px solid #fff;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    animation-delay: -0.4s;
}
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}

 /* ==========================================================================
   NAV
   ========================================================================== */   

.navigation li{margin: 0; padding: 0;}


ul.primary,ul.sub{list-style: none; list-style-type: none; position: relative; text-align: left;}
/* prime */
ul.primary li a {display: block;}

ul.primary li.dropper:hover{ }
/* subs */
ul.sub {position: absolute; z-index: 200; width: auto; margin: 0; padding: 0;transition:all 0.3s; height: 0; left: 0px; overflow: hidden;}

ul.sub li {float: none; margin: 0; background: var(--grey); background: var(--main); transform: translateY(-100%); transition: all 0.3s ease; opacity: 0;box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.3);}

ul.sub li a {border-bottom: 1px solid #f1f1f2; padding: 20px; text-transform: capitalize; font-size: 14px; font-weight: 700;}


ul.sub li:last-child a {border-bottom: none; overflow: hidden;}
ul.sub:last-child { overflow: hidden;}
/* sub display*/
ul.primary li:hover ul {display: flex; opacity: 1; height: 65px; }
ul.primary li a.drop{transition: 0.3s all ease; border-top-left-radius: 10px; border-top-right-radius: 10px;/*border-top-left-radius: 10px; border-top-right-radius: 10px;*/}
/* keeps the tab background white */
ul.primary li:hover a.drop {background: #fff;background: rgba(246,246,246,0.9); color: #1a1a1a; }
ul.sub li a{color: #1a1a1a;}
ul.sub li a:hover {background: #fff;}
/*PINK DROPDOWN*/

ul.sub li a {border-bottom: 1px solid rgba(255,255,255,0.3); font-size: 14px; text-transform: uppercase;}
ul.sub li a:hover {background: #fff; color: var(--main);}
ul.sub li a{color: #fff;}
ul.primary li:hover a.drop {background: var(--main); color: #fff; }

ul.sub li{--index:1;transition-delay: calc(0.025s * var(--index));}
ul.primary li:hover ul.sub li {transform: translateY(5px); opacity: 1;}

.subarrow{position: absolute; bottom: -6px; left: 0; width: 100%; display: flex; justify-content: center; flex-wrap: wrap; color: var(--main);display: none; }

.menu{background-color:transparent;border:none;cursor:pointer;display:flex;padding:0}.line{fill:none;stroke:var(--main);stroke-width:6;transition:stroke-dasharray 600ms cubic-bezier(.4,0,.2,1),stroke-dashoffset 600ms cubic-bezier(.4,0,.2,1)}.line1{stroke-dasharray:60 207;stroke-width:6}.line2{stroke-dasharray:60 60;stroke-width:6}.line3{stroke-dasharray:60 207;stroke-width:6}.opened .line1{stroke-dasharray:90 207;stroke-dashoffset:-134;stroke-width:6}.opened .line2{stroke-dasharray:1 60;stroke-dashoffset:-30;stroke-width:6}.opened .line3{stroke-dasharray:90 207;stroke-dashoffset:-134;stroke-width:6}

.herobutton{padding-top: 20px;}
.btn:link,.btn:visited{font-weight:700;text-decoration:none;font-size:18px;padding:10px 30px;display:flex;align-items: center; border-radius:100px;transition:all .2s;position:absolute}.btn:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(0,0,0,.2);color: #fff;}.btn:active{transform:translateY(-1px);box-shadow:0 5px 10px rgba(0,0,0,.2)}.btn::after{content:"";display:inline-block;height:100%;width:100%;border-radius:100px;position:absolute;top:0;left:0;z-index:-1;transition:all .4s}.btn:hover::after{transform:scaleX(1.4) scaleY(1.6);opacity:0}.btn-animated{animation:moveInBottom 5s ease-out;animation-fill-mode:backwards}.btn-pink{background-color:var(--pink,#e4067e);color:#fff}.btn-pink::after{background-color:var(--pink,#e4067e)}.btn-white{background-color:#fff;color:var(--purple,#311e4b)}.btn-white::after{background-color:#fff;}@keyframes moveInBottom{0%{opacity:0;transform:translateY(30px)}100%{opacity:1;transform:translateY(0)}}
.btn-white:hover{color:var(--purple,#311e4b);}
.buttonplus img{width: 24px;}
.btn:hover img{transform: rotate(360deg);}


.modalbtn{padding: 10px 30px; background: var(--main); color: #fff; border-radius: 3px; margin-right: 10px; display: inline-block;}
.modalbtn:hover{background: var(--maindarker); color: #fff;}

.hero{width: 100%; padding: 0; height: 95vh; overflow: hidden; position: relative; z-index: 5; border-bottom: 0px solid #f1f1f2; display: flex; justify-content: flex-end; flex-wrap: wrap;}



.swiperholders{position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.swiper-slide{outline: 0px solid red;}

.swiper-buttons{position: absolute; top: 70px; /*left: calc((100% - 1200px) / 2);*/ right:0; z-index: 10; display: flex; justify-content: flex-start; flex-wrap: wrap;}
.swiper-button{padding: 5px 10px; color: var(--main); background: #fff; cursor: pointer; outline: none;}

.herocover{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: flex-start; align-items: center; padding: 0 40px; background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,0.8) 300px, rgba(0,0,0,0.61) 100%); background: none; z-index: 5;}


.herotext{max-width: 60%; z-index: 4; padding: 40px; backdrop-filter: blur(10px);  background: rgba(0,0,0,0.05); border-left: 5px solid var(--main); border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
.heroheader{font-size: 80px; line-height: 90px; color: #fff; margin:0; opacity: 1; font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif; letter-spacing: 1px; font-weight: 700;text-shadow: 0px 0px 7px rgba(0,0,0,0.6); margin-bottom: 20px;}

.herofade{margin-right: 10px;}

.herosub{font-size: 16px; line-height: 26px; font-weight: 500; color: #fff;text-shadow: 0px 0px 7px rgba(0,0,0,0.6);}

.herosub ul li{margin: 0; padding: 0;text-shadow: 0px 0px 7px rgba(0,0,0,0.6);}
.homeherosub{margin-bottom: 40px;}

.herolink{padding: 10px 20px; background:var(--main); border-radius: 5px; text-transform: uppercase; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: 0px;}
.herolink:hover{opacity: 1; background: #505055;}

.heroslideshow{width: 100%; height: 100%; position: relative; z-index: 1; position: relative; }
.heroslideshow img{width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 4;}

.heroslide{width: 100%; height: 100vh; z-index: 4; position: relative; }
.heroslide img{width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 4;}

.topslide{object-position: top center;}
.centerslide{object-position: center center;}
.bottomslide{object-position: bottom center;}


.shallowhero{width: 100%; padding: 0; height: 60vh; overflow: hidden; position: relative; z-index: 5; border-bottom: 0px solid #f1f1f2; display: flex; justify-content: flex-end; flex-wrap: wrap;}
.shallowherocover{width: 100%; background: linear-gradient(to right, rgba(49,30,75,1) 0%,rgba(39,24,60,1) 300px, rgba(0,0,0,0.3) 301px, rgba(0,0,0,0.3) 100%); z-index: 5;}

@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
  .newsherotext {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
      padding: 40px;
      margin-top: 60px;
      border-radius: 20px;
  }
    .newscover{background: linear-gradient(to right, rgba(49,30,75,1) 0%,rgba(39,24,60,0) 300px, rgba(0,0,0,0.0) 301px, rgba(0,0,0,0.0) 100%); padding-left: 0;}
}

.shallowheroslideshow{width: 100%; height: 100%; position: relative; z-index: 1; position: relative; }
.shallowherotext{max-width: 60%; z-index: 4; padding: 20px; backdrop-filter: blur(10px);  background: rgba(0,0,0,0.05); border-left: 5px solid var(--main); border-top-right-radius: 10px; border-bottom-right-radius: 10px; margin-top: 40px;}
.shallowheroheader{font-size: 60px; line-height: 70px; color: #fff; margin:0; opacity: 1; font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif; letter-spacing: 1px; font-weight: 700;text-shadow: 0px 0px 7px rgba(0,0,0,0.6); }
/* ==========================================================================
   SUBSCRIPTION BAR
   ========================================================================== */
.contactbar{width: 100%; padding: 100px 40px; position: relative; background: var(--main);} 
.contactbarcover{position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
background: linear-gradient (to right, rgba(227,30,36,1) 0%, rgba(227,30,36,0.5) 5%, rgba(227,30,36,0.5) 95%, rgba(227,30,36,1) 100%); 
background: linear-gradient(to right, rgba(227,30,36,1) 0%,rgba(227,30,36,0.8) 25%,rgba(227,30,36,0.8) 75%, rgba(227,30,36,1) 100%);
z-index: 5; opacity: 0.7;  /*mix-blend-mode: screen;*/}
.contactbarimage{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; mix-blend-mode: luminosity;}
.contactbarimage img{width: 100%; height: 100%; object-fit: cover; object-position: center center;}

.contactbarcontent{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start; position: relative; z-index: 6; outline: 0px solid red;}

.contactbartext{font-size: 20px; text-shadow: 0px 0px 7px rgba(0,0,0,0.6); color: #fff; font-weight: 700; width: 60%;font-family:'Open Sans', sans-serif;}



.contactbarcontent1{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; position: relative; z-index: 6; outline: 0px solid red;}
.contactbartext1{font-size: 20px; text-shadow: 0px 0px 7px rgba(0,0,0,0.6); color: #fff; font-weight: 700; width: 50%;font-family:'Open Sans', sans-serif;}
.contactbarform{width: 45%;}
.subform{width: 100%; display: flex; justify-content: flex-end; flex-wrap: wrap}
.subscribesubmit{font-weight: 700; background:var(--main);padding:10px 30px; border-top-right-radius: 100px; border-bottom-right-radius: 100px; color: #fff; border: none; cursor: pointer;}
.subscribesubmit:hover{transform:translateY(1px);box-shadow:inset 0 10px 20px rgba(0,0,0,.2)}
.subscribesubmit:active{transform:translateY(2px);box-shadow:inset 0 10px 20px rgba(0,0,0,.2); outline: none;}

.subinput{border:1px solid #f9f9f9; padding: 10px; font-size: 0.8rem; background: #fff; color: #0C0C0B; max-width: 38%;}
.subinputemail{flex-grow: 1;}
.subinputname{border-right: 1px solid var(--main);}
.subinputname{border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
.subinput:focus{outline: 0px solid var(--main); background: #f5f5f5;}


.contactbarbutton{width: 20%;}
.subsuccess{width: 100%; text-align: right;}
.subsuccess h3{font-size: 20px; text-shadow: 0px 0px 7px rgba(0,0,0,0.6); color: #fff; font-weight: 700; font-family:'Open Sans', sans-serif;}
/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer{width: 100%; font-size: 12px; background: linear-gradient(#311e4b,#1E002E); color: #fff; position: relative; overflow: hidden;box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.3);}
.innerfooter{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; width: 100%; margin: 0 auto; padding: 40px 40px 20px;}
.footleft{width: 300px; border-right: 0px solid rgba(255,255,255,0.2); padding: 0 20px 20px 0;outline: 0px solid white; }
.footleft img{width: 200px;}
.footright{width: calc(100% - 320px); outline: 0px solid white; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.footright1{width: 33%;}
.footright2{width: 33%;}
.footright3{width: 33%;}

.footbottom{width: 100%; text-align: left;border-top: 1px solid rgba(255,255,255,0.5); padding-top: 20px; margin-top: 20px;}

.foothead{width: 100%; font-size: 24px; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px; font-weight: 800; font-family:'Open Sans', sans-serif; }

.footaddress{padding: 0 0 20px;}
.footnav{width: 100%;}
.footnavflex{width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 20px;}
.footnav a{display: block; margin-bottom: 2px;}
.footnavlink{color: #fff;}
.footnavlink:hover{color: var(--grey);}

.leftfootnav{display: flex; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 20px; display: none;}
.leftfootnav span{color: #fff; margin: 0 5px;}
.leftfootnav a{color: #fff;}
.leftfootnav a:hover{color: var(--main);}

.footnavigation{padding: 0;}
.footnavlink{display: block; margin-bottom: 5px;}

.contactsocial{display: flex; justify-content: flex-start; flex-wrap: wrap; padding: 0;}
.contactsocial a{color: #fff; margin-right: 10px; font-size: 16px;}
.contactsocial a i{width: 24px; text-align: center;}

.contactsocial a.lilink{background: #0077B5; padding: 5px; border-radius: 3px; color: #fff;}
.contactsocial a.fblink{background: #4267B2; padding: 5px; border-radius: 3px; color: #fff;}
.contactsocial a.twlink{background: #55acee; padding: 5px; border-radius: 3px; color: #fff;}
.contactsocial a.instalink{background: #DD2A7B; padding: 5px; border-radius: 3px; color: #fff;}
.contactsocial a.whatsapplink{background: #25D366; padding: 5px; border-radius: 3px; color: #fff;}


.contactsocial a:hover{background: #fff; color: var(--main);}
.footersocial a:hover{background: var(--main);}
.copy span{margin: 0 5px;}
.copy a{color: var(--main); font-weight: 700;}

.copyright{padding-bottom: 15px; border-bottom: 1px solid rgba(255,255,255,0.2); margin-bottom: 15px; display: inline-block;}
.vat{ color: #fff; margin-bottom: 5px;}

/*ALT FOOTER COLORS*/
.footer{ } 
.footer{background: linear-gradient(var(--main),var(--maindarker)); } 


.copy a{color: #fff; }
.copy a:hover{color: var(--grey);}
.logogrid{display: flex; justify-content: space-evenly; flex-wrap: wrap; align-items: center;}

.eachlogo{margin: 20px 20px 0 0; outline: 0px solid white}
.eachlogo img{height: 60px; width: auto;}

.eachlogo a:hover{opacity: 0.8;}


.homemain{width: 100%; padding: 40px; background: #fff url(../img/towerbg.png) top center no-repeat; background-size: cover;}


.homeservicesgrid{width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 30px; }
.eachhomeservice{padding: 40px 20px; box-sizing: border-box; text-align: left; position: relative; overflow: hidden; border-left: 5px solid var(--main); background: var(--main);}
.eachhomeservicetitle{position: relative; z-index: 5;transition: all 0.3s ease; transform:translateY(50px); transition: all 0.5s ease;}
.eachhomeservicetitlename{font-size: 20px; line-height: 24px; letter-spacing: 1px; color:#fff; text-transform: uppercase;font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif;}
.eachhomeservicetext{margin-bottom: 30px; font-size: 14px; font-weight: 300; line-height: 20px; transform:translateY(100px); transition: all 0.5s ease; position: relative; z-index: 5;transition: all 0.5s ease; opacity: 0; color: #fff;}
.eachhomeservicelink{font-size: 14px; text-transform: capitalize; padding: 5px 10px; background: var(--red, #cd1719); color: #fff; position: relative; z-index: 5;}
.eachhomeservicelink:hover{color: var(--red, #cd1719); background: #fff;}
.eachhomeserviceimageholder{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; filter: grayscale(0); opacity: 1; transition: all 0.3s ease;}
.eachhomeserviceimage{object-fit: cover; width: 100%; height: 100%; top: 0; left: 0;}
.eachhomeservicecover{position: absolute; z-index: 3; top: 0; left: 0; width: 100%; height: 100%; background: rgba(22,22,22,.78) url(../img/tower-corner.png) top right no-repeat; transition: all 0.3s ease;}
.homeservicewhite{background: rgba(255,255,255,0.4); transition: all 0.3s ease;}
.homeservicegrey{background: rgba(255,255,255,0.1); transition: all 0.3s ease;}
.eachblogdate{font-size: 12px;}


.homeservicegrey:hover{background: rgba(255,255,255,0.4);}
.homeservicewhite:hover{background: rgba(255,255,255,0.1);}
.eachhomeservice:hover .eachhomeservicetext{transform:translateY(0px); opacity: 1;}
.eachhomeservice:hover .eachhomeservicetitle{transform:translateY(0px); color: #fff;}

.eachhomeservice:hover .eachhomeserviceimageholder{opacity: 1;}
.eachhomeservice:hover .eachhomeserviceimageholder{transform: scale(1.1,1.1);}


.buffer{width: 100%; height: 20px;}

.mainsections{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; background: var(--grey); position: relative; }
.maincontent{width: 70%; padding: 0; position: relative; z-index: 5; background: #fff;}
.widecontent{width: 100%; padding: 0; position: relative; z-index: 5; background: #fff;}
.sidebar{width: 30%; padding: 0 40px 0 0; background: var(--main); background: #f6f6f6 url(../img/sidebar-bg.png) center center no-repeat;}


.homeaboutcontent{position: relative; z-index: 6; padding: 80px 40px;}
.admincontent{position: relative; z-index: 6; padding: 0 40px 80px;}
.adminmenu{padding: 20px; background: #f6f6f6; margin-bottom: 40px; display: inline-block;}
.adminmenu span{margin: 0 10px;}

.homeopening{width: 40%; padding: 0 40px 0 0; background: var(--grey); background: rgba(34,21,53,1);}

.homerightbox{position: relative; width: 100%; height: 100%; padding: 80px 0; }
.homerightboximage{position: absolute; top: 0; left: 0; width: 80%; height: 100%;}
.homerightboximage img{width: 100%; height: 100%; object-fit: cover;}
.homerightinner{position: relative; width: 80%; height: auto; padding: 100px 40px; background: rgba(255,255,255,0.95);background:var(--main); background: linear-gradient(to bottom, rgba(0,46,94,0.9), rgb(184,0,101,0.9));box-shadow: 0 15px 45px rgba(0,0,0,0.25), 0 7px 10px rgba(0,0,0,0.05); border-radius: 10px;text-align: center; margin: 0 auto;}
.homerightinner h2{color: var(--main); color: #fff; font-size: 24px; line-height: 28px; text-align: center; margin-bottom: 40px;}
.homerightinner p{color: #fff; text-align: center;}




.anotherswiper{z-index: 44 !important;}
.homeservices{width: 100%; background-color: var(--grey); background: #f1f1f2; background-image: url(../img/darktowercornerfade.png), url(../img/quotesfade.png);background-position: bottom right, top left; background-repeat:
    no-repeat; position: relative; padding: 40px 0; outline: 0px solid red;}

.serviceslide{display: flex; justify-content: center; align-content: center; flex-direction: column; flex-wrap: wrap; text-align: center; padding: 40px;}
.homeserviceimage{width: 100%; margin-bottom: 20px;}
.homeservicetitle{font-weight: 200; font-size: 20px; color: var(--main); margin-bottom: 40px;}
.homeservicebody{font-weight: 400; color: var(--grey); font-size: 16px; font-style: italic; margin-bottom: 20px;font-family:sans-serif; min-height: 50px; max-width: 800px;}

.homeservicelink{display: flex; justify-content: center; flex-wrap: wrap;}


.aboutlink{display: block; padding: 20px 0 40px;}


.mainlink{padding: 10px 20px; background: var(--main); color: #fff; border-radius: 5px;}
.mainlink:hover{background: var(--maindarker); color: #fff;}






.bodyh{margin: 30px 0 20px 0; font-weight: 500; letter-spacing: 0px;}


.singleimage{width: 100%; margin:40px auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
.singleimage img{width: 100%;}
.halfsingleimagewidth img{width: 50%;}

.centersingleimagealign{justify-content: center;}
.rightsingleimagealign{justify-content: flex-end;}
.leftsingleimagealign{justify-content: flex-start;}

.tabsection{margin: 40px 0;}


.newsimagecontent{width:100%; margin: 40px auto; outline: 0px solid red;box-shadow: 0 30px 90px rgba(0,0,0,0.25), 0 7px 20px rgba(0,0,0,0.05);}

.accordionholder{width: 100%; margin: 40px auto;}

.azfilter{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 20px;}


.expander{width: 50%; text-align: center; font-size: 14px; position: relative; display: flex;  justify-content: center; align-items: center;}
.expander a{color: #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.openall{background: var(--main);}
.closeall{background: var(--grey);}
.closeall:hover{background: var(--main); color: #fff;}
.openall:hover{background: var(--grey); color: #fff;}

.field{width: 50%; border:1px solid rgba(26,26,26,0.2); padding: 10px; }
.field:focus{outline: 1px solid rgba(26,26,26,0.3);}


.thedetails{padding: 30px; display: block;}

.detailsearch{margin-bottom: 10px; /*box-shadow: 0 5px 15px rgba(0,0,0,0.25), 0 4px 10px rgba(0,0,0,0.05); */ border: 2px solid #f1f1f2;}
.detailsbooking{background: #f1f1f2;}
summary{font-weight: 500;}
summary span{width:calc(100% - 30px);}
.summaryicon{margin-right: 20px; width: 30px; text-align: center}
.summaryarrow{transition: all 0.3s; width: 20px; margin-left: 10px;}
details[open] summary .summaryarrow {
 transform: rotate(-180deg);
}

summary{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; padding: 20px; outline: none; background: #f1f1f2; color: var(--grey); font-size: 20px; cursor: pointer; transition: all 0.3s ease;}
summary:hover{background: #fff;}
summary::-webkit-details-marker {display: none;}

summary img{width: 26px; margin-right: 20px;}

.accordionheader{font-weight: 700; color: var(--grey);}


@keyframes open {
  0% {opacity: 0; margin-left: -20px}
  100% {opacity: 1; margin-left: 0px}
}
details[open] summary ~ * {
  animation: open .5s ease-in-out;
}

/* add wrapper, continue with font-size /
details[open] .thedetails{
    animation-name: invisiblyGrowFontSize, fadeIn;
  animation-duration: 500ms, 200ms;
  animation-delay: 0ms, 500ms;
}
@keyframes invisiblyGrowFontSize {
	0% {
    font-size: 0;
    opacity: 0;
	}
	100% {
    font-size: 1em;
    opacity: 0;
	}
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
	100% {
		opacity: 1;
	}
}
.details7[open] .content {
	animation-name: invisiblyGrowFontSize, fadeIn;
  animation-duration: 500ms, 200ms;
  animation-delay: 0ms, 500ms;
}

*/



.aboutrightbox{position: relative; width: 100%; height: auto; padding: 80px 0; display: flex; justify-content: flex-end; flex-wrap: wrap;}
.aboutrightboximage{position: absolute; top: 0; left: 0; width: 80%; height: 100%;}
.aboutrightboximage img{width: 100%; height: 100%; object-fit: cover;}
.aboutrightinner{position: relative; width: 80%; height: auto; padding: 80px 40px; background: rgba(255,255,255,0.95);background:var(--main); background: linear-gradient(to bottom, rgba(0,46,94,0.9), rgb(184,0,101,0.9));box-shadow: 0 15px 45px rgba(0,0,0,0.25), 0 7px 10px rgba(0,0,0,0.05); border-radius: 10px;text-align: center;}
.aboutrightinner h2{color: var(--main); color: #fff; font-size: 24px; line-height: 28px; text-align: center; margin-bottom: 20px;}
.aboutrightinner p{color: #fff; text-align: center;}


.aboutgrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;}
.eachaboutgrid{padding: 100px 40px; background: var(--grey); text-align: center; color:#fff;}

.display{font-size: 12px;}
/* ==========================================================================
   NEWSGRID
   ========================================================================== */
.newsholder{width: 100%; background: var(--grey); padding: 0;}
.newsinner{width: 100%; margin: 0 auto; background: #fff; padding: 80px 300px ;box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.3);}



.newsholder{padding: 0px;}
.newsinner{width: 100%; margin: 0 auto; background: #fff; padding: 80px 300px;}
.newsgridinner{width: 100%; margin: 0 auto; background: #fff; padding: 80px 40px;}



.homegridholder{width: 100%; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap; }


.homegrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;}
.networkgrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;}
.servicegrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr; width: 100%; margin: 0 auto;}
.servicepagegrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;}
.newsbuffer{width: 100%; margin: 10px 0 20px; height: 3px; position: relative;}

.homegridintro{background: #fff; padding: 20px;}

.eachhomegrid{background: var(--grey); background: rgba(49,30,75,0.8); background: rgba(0,46,94,1); transition: all 300ms ease;  overflow: hidden; position: relative; display: flex; justify-content: flex-start;  min-height: 300px; padding-bottom: 40px;}
.eachnetworkgrid{background: var(--grey);transition: all 300ms ease;  overflow: hidden; position: relative; display: flex; justify-content: flex-start;  min-height: 300px; padding-bottom: 40px;}

.eachhomegrid:hover{box-shadow:  0rem 0.875rem 1.5rem 0rem rgba(32,46,66,0.059);}
.eachgridcover{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; transition: all 0.3s ease; background: rgba(22,22,22,.78) url(../img/tower-corner.png) bottom right no-repeat; }
.eachgridplus{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 6; transition: all 0.3s ease;}

.eachhomegrid:hover .eachgridcover{}
.eachhomegrid:hover .eachgridplus{transform: rotate(360deg) scale(1.3,1.3);}
.eachgridimage{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 4; transition: all 0.3s ease; filter: grayscale(0);}
.eachgridimage img{object-fit: cover; width: 100%; height: 100%; }
.eachhomegrid:hover .eachgridimage{transform: scale(1.1,1.1);filter: grayscale(1);}
.eachnetworkgrid:hover .eachgridimage{transform: scale(1.1,1.1);filter: grayscale(1);}
.eachhomegrid:hover{background: rgba(0,46,94,0.2);}
.eachgridcontent{position: relative;z-index: 10;padding: 20px; }
.eachgridtitle{transform:translateY(50px); transition: all 0.5s ease;}
.eachgridtitlename{text-transform: uppercase; font-size: 24px; line-height: 26px; color: #fff; font-family:'Red Hat Display', sans-serif; font-weight: 400; margin-bottom: 10px;}
.eachgridtitledate{font-size: 14px; color: #fff;}
.eachgridtitleservice{font-size: 14px; color: #fff; opacity: 0; transition: 0.3s all ease;}
.eachnetworkgrid:hover .eachgridtitle{transform:translateY(0px);}
.eachnetworkgrid:hover .eachgridtitleservice{opacity: 1;}
.eachgridlist{font-weight: 300; color: rgba(255,255,255,1); font-style: italic; font-size: 14px; transform:translateY(100px); transition: all 0.5s ease; opacity: 0;}
.eachnetworkgrid:hover .eachgridlist{transform:translateY(0px); opacity: 1;}
.eachgridlink{position: absolute; bottom: 0; right: 0; width: auto; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;background: rgba(80,80,85,0.7); z-index: 10; transition: all 0.3s ease; opacity: 0; transform: translateX(100%); transition: all 0.5s ease; display: none;}

 


.testimonial{width:100%; margin: 40px auto; outline: 0px solid red;box-shadow: 0 30px 90px rgba(0,0,0,0.25), 0 7px 20px rgba(0,0,0,0.05); background: var(--main); text-align: center; position: relative; padding: 40px 80px; border-radius: 20px;}
.testimonialbody{color: #fff; font-weight: 400; }
.testimonialname{color: #fff; font-weight: 700; font-size: 20px; margin-bottom: 20px;}
.testimonialcase{margin-bottom: 20px;}
.testimonialcase a{color: orange; font-weight: 700; font-size: 16px;}
.testimonialcase a:hover{color: var(--grey); }
.testimonialstars{color: #fff; font-weight: 700; font-size: 20px; width: 100%; text-align: center;}
.testimonialquote{width: 100%; text-align: center; opacity: 1; font-size: 144px; line-height: 84px; color: var(--main); color: #fff; font-family: "Times New Roman", Times, serif;}
.checked {color: orange;}

.step{width:100%; margin: 40px auto; box-shadow: 0 30px 90px rgba(0,0,0,0.25), 0 7px 20px rgba(0,0,0,0.05); background: #fff; padding: 40px; border-radius: 20px; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.stepbody{color: var(--grey); font-weight: 400; width: calc(100% - 100px); }
.stepplus{width: 60px; }

.servicegridheader{padding: 20px; font-family:sans-serif; font-size: 20px; font-weight: 700; position: relative; text-align: left; box-shadow: 0 0 15px rgba(0,0,0,0.1); margin-bottom: 20px; border-radius: 5px; overflow: hidden; background: var(--main); color: #fff;}

.azgrid{width: 100%; display: grid; grid-gap: 20px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;
  list-style: none;
  margin: 0;
  padding: 0;}
.eachazgrid{padding: 0; display: flex; justify-content: flex-start; align-content: center; background: #ECF0F1; border-radius: 5px; position: relative; text-align: left; box-shadow: inset 0 2px 20px #e6ebed; }
.azbgtitle{font-family:sans-serif; font-size: 20px; font-weight: 700;}
.eachazbgtitle{position: absolute; width: 100%; height: 100%; top: 0; left: 0; font-family:sans-serif; font-size: 20px; font-weight: 700;display: flex; justify-content: center; align-items: center; flex-direction: column; z-index: 4;}
.azinfo{position: relative; transform: translateX(calc(100% + 20px)); transition: all 0.3s ease; padding: 0; display: flex; justify-content: center; align-content: center; flex-direction: column; z-index: 5; color: #fff; padding: 20px;}
.azinfo h3{color: #fff;}
.eachazgrid:hover .azinfo{transform: translateX(0);}
.azbox1 {grid-column: 1 / 4; grid-row: 1 / 2; padding: 20px;}

.card{perspective: 500px;}

.cardfill{position: relative; z-index: -1; opacity: 0; padding: 20px;}
/*
.cardcontent {
  position: absolute;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 15px rgba(0,0,0,0.1);

  transition: transform 1s;
  transform-style: preserve-3d;
    
}

.card:hover .cardcontent {
  transform: rotateY( 180deg ) ;
  transition: transform 0.5s;
}*/

.cardcontent {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.1);
          box-shadow: 0 0 15px rgba(0,0,0,0.1);

  -webkit-transition: -webkit-transform 1s;

  transition: -webkit-transform 1s;

  -o-transition: transform 1s;

  transition: transform 1s;

  transition: transform 1s, -webkit-transform 1s;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
   /* -webkit-backface-visibility: hidden;*/
    
}

.card:hover .cardcontent {
  -webkit-transform: rotateY( 180deg ) ;
          transform: rotateY( 180deg ) ;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  -o-transition: transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.front{
  position: absolute;
  height: 100%;
  width: 100%;
  background: white;

  color: #03446A;
  text-align: left;
  
  border-radius: 5px;
  backface-visibility: hidden;
  display: flex; justify-content: center; align-items: center; padding: 20px; flex-direction: column;
}
.fronttitle{font-family:sans-serif; font-size: 20px; font-weight: 700; color: var(--main); margin-bottom: 20px; }
.back {
  position: absolute;
  height: 100%;
  width: 100%;
  text-align: left;
  border-radius: 5px;
  backface-visibility: hidden;
  display: flex; justify-content: center; align-content: center; flex-direction: column; z-index: 5; color: #fff; padding: 20px;
}

.back {
  background: var(--main);
  color: #fff;
  transform: rotateY( 180deg );
}
.back h3{color: #fff;}


/* ==========================================================================
   TEAMGRID
   ========================================================================== */




.teamgridholder{width: 100%; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap; }


.teamgrid{width: 100%; display: grid; grid-gap: 30px; grid-template-columns: 1fr 1fr 1fr; width: 100%; margin: 0 auto;}
.newsbuffer{width: 100%; margin: 10px 0 20px; height: 3px; position: relative;}

.homegridintro{background: #fff; padding: 20px;}

.eachteamgrid{transition: all 300ms ease;  overflow: hidden; position: relative; display: flex; justify-content: flex-start;  min-height: 400px; padding-bottom: 40px;}

.eachteamgridtextonly{min-height: 200px;}

.tgpink{background: #f1f1f2; }
.tgpurple{background: #f1f1f2; }
.tgpink:hover{background: var(--main);}
.tgpurple:hover{background: var(--grey); }

.tgpink1{background: var(--main);}
.tgpurple1{background: var(--grey);}




.eachteamgrid:hover{box-shadow:  0rem 0.875rem 1.5rem 0rem rgba(32,46,66,0.059);}

.eachteamgridplus{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 6; transition: all 0.3s ease; display: flex; justify-content: center; align-content: center; flex-wrap: wrap;}



.eachteamgridimage{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 4; transition: all 0.3s ease; filter: grayscale(0);}
.eachteamgridimage img{object-fit: contain; width: 100%; height: 100%; }
.eachteamgrid:hover .eachgridimage{transform: scale(1.1,1.1);filter: grayscale(0);}

.eachteamgridcontent{position: relative;z-index: 10;padding: 20px; }
.eachteamgridtitle{transform:translateY(0px); transition: all 0.5s ease; }
.eachteamgridtitlename{text-transform: uppercase; font-size: 24px; line-height: 26px; color: var(--grey); font-family:'Red Hat Display', sans-serif; font-weight: 400; margin-bottom: 10px;transition: all 0.3s ease;}


.ttitlepurple{color: var(--main);}
.ttitlepink{color: var(--grey);}

.eachteamgridtitledate{font-size: 14px; color: #fff;}
.eachteamgrid:hover .eachteamgridtitlename{color: #fff;}
.eachteamgridlist{font-weight: 300; color: rgba(255,255,255,1); font-style: italic; font-size: 14px; transform:translateY(100px); transition: all 0.5s ease; opacity: 0;}
.eachteamgrid:hover .eachteamgridlist{transform:translateY(0px); opacity: 1;}
.eachteamgridlink{position: absolute; bottom: 0; right: 0; width: auto; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;background: rgba(80,80,85,0.7); z-index: 10; transition: all 0.3s ease; opacity: 0; transform: translateX(100%); transition: all 0.5s ease; display: none;}



.teamabout{width: 70%;}
.teamopening{width: 30%;}

.teamrightboximage{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.teamrightboximage img{width: 100%; height: 100%; object-fit: contain; object-position: bottom center;}




/*PLUS SVG*/
.buttonplus img{width: 24px;}
.btn:hover svg{transform: rotate(360deg);}

.navcalllink:hover .whitesvgplus{color: var(--grey);}
.navcalllink:hover svg{transform: rotate(360deg);}

.svgplus{width: 32px;}
.svgplusdetails{width: 24px; margin-right: 20px;}
.svgplusfront{width: 24px;}
.svg{transition: all 0.3s ease;}
.pinksvgplus{color: var(--main);}
.whitesvgplus{color: #fff;}

.logoplus{position: absolute; top: -2px; right: 0; width: 20px;}
.logo:hover .pinksvgplus{color: #fff;}
.logo:hover svg{transform: rotate(360deg);}

.logofooterplus{position: absolute; top: 2px; right: 0; width: 20px;}
.logofooter{position: relative; display: inline-block;}
.logofooter:hover .whitesvgplus{color: var(--grey);}
.logofooter:hover svg{transform: rotate(360deg);}

.eachteamgrid:hover svg{transform: rotate(360deg) scale(1.5,1.5); transform-origin: center;}
/*.eachteamgrid:hover .whitesvgplus {color: var(--main);}*/

.eachhomegrid:hover svg{transform: rotate(360deg) scale(1.5,1.5); transform-origin: center;}
.eachteamgrid:hover .wsvgpink {color: var(--main);}
.eachteamgrid:hover .wsvgpurple {color: var(--grey);}

summary:hover .pinksvgplus{color: var(--grey);}
summary:hover svg{transform: rotate(360deg);}

.svgstar{width: 150px;}
.whitesvgstar{color: #fff;}
.whitesvgstar:hover{color: var(--grey);}
/*
.pinksvgplus:hover{color: var(--grey);}
.whitesvgplus:hover{color: var(--grey);}



/*FLAT COLORS*/
.footerflat{background: #e4067e; }
.headerflat{background: var(--grey);}
.herocoverflat{background: linear-gradient(to right, rgba(49,30,75,1) 0%,rgba(49,30,75,1) 300px, rgba(0,0,0,0.3) 301px, rgba(0,0,0,0.3) 100%);}
.homeservicesflat{width: 100%; background: var(--grey);}
.homeopeningflat{background: var(--grey);}
.shallowherocoverflat{background: linear-gradient(to right, rgba(49,30,75,1) 0%,rgba(49,30,75,1) 300px, rgba(49,30,75,0) 301px, rgba(49,30,75,0) calc(100% - 41px), rgba(49,30,75,0) calc(100% - 40px), rgba(49,30,75,0) 100%);}
.aboutopeningflat{width: 40%; padding: 0 40px 0 0; background: var(--grey); background: linear-gradient(to right, #fff 0%, #fff 30%, rgba(49,30,75,1) 30.1%, rgba(49,30,75,1) 100%);}
/*
.footbottomflat{ border-top: 1px solid rgba(49,30,75,1); }
.vatflat{color: var(--grey); }




/*.homesections{padding-left: 40px;}
    .newsholder{padding: 0 0 0 40px;}

/* ==========================================================================
   MODAL
   ========================================================================== */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0vh;
  background-color: transparent;
  overflow: hidden;
  transition: background-color 0.25s ease;
  z-index: 2047;
}
.modal.open {
  position: fixed;
  width: 100%;
  height: 100vh;
  
  background-color: rgba(0, 0, 0, 0.5); 
  transition: background-color 0.25s;
}
.modal.open > .content-wrapper {
  transform: scale(1);
}
.modal .content-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 50%;
  margin: 0;
  padding: 2.5rem;
  background: #FAFBFC;
  border-radius: 0.3125rem;
  box-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.5);
  transform: scale(0);
  transition: transform 0.25s;
  transition-delay: 0.15s;
      max-height: 100vh; overflow: auto;
}
.modal .content-wrapper .close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: none;
  background-color: transparent;
  font-size: 1.5rem;
  transition: 0.25s linear;
    cursor: pointer;
}
.modal .content-wrapper .close:before, .modal .content-wrapper .close:after {
  position: absolute;
  content: '';
  width: 1.25rem;
  height: 0.125rem;
  background-color: black;
}
.modal .content-wrapper .close:before {
  transform: rotate(-45deg);
}
.modal .content-wrapper .close:after {
  transform: rotate(45deg);
}
.modal .content-wrapper .close:hover {
  /*transform: rotate(360deg);*/
}
.modal .content-wrapper .close:hover:before, .modal .content-wrapper .close:hover:after {
  background-color: tomato;
}
.modal .content-wrapper .modal-header {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0;
  padding: 0 0 1.25rem;
}
.modal .content-wrapper .modal-header h2 {
  font-size: 1.5rem;
  font-weight: bold;
}
.modal .content-wrapper .content {
  position: relative;
  display: flex;
width: 100%;
}
input{max-width: 100%;}
table{max-width: 100%;}
.modal .content-wrapper .content p {
  font-size: 0.875rem;
  line-height: 1.75;
}
.modal .content-wrapper .modal-footer {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  margin: 0;
  padding: 1.875rem 0 0;
}
.modal .content-wrapper .modal-footer .action {
  position: relative;
  margin-left: 0.625rem;
  padding: 0.625rem 1.25rem;
  border: none;
  background-color: slategray;
  border-radius: 0.25rem;
  color: white;
  font-size: 0.87rem;
  font-weight: 300;
  overflow: hidden;
  z-index: 1;
}
.modal .content-wrapper .modal-footer .action:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
  transition: width 0.25s;
  z-index: 0;
}
.modal .content-wrapper .modal-footer .action:first-child {
  background-color: #2ecc71;
}
.modal .content-wrapper .modal-footer .action:last-child {
  background-color: #e74c3c;
}
.modal .content-wrapper .modal-footer .action:hover:before {
  width: 100%;
}

.modalform{width:100%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0; margin:0;}
.modalform label{font-size: 12px;}

.sidebarform{width:100%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0; margin:0; background: rgba(255,255,255,0.5);}
.sidebarform label{font-size: 12px;}

.profilesidebar{width: 30%; padding: 40px; background: #f6f6f6 url(../img/sidebar-bg.png) center center no-repeat;}

.selectinput select{width: 100%; border:1px solid #f9f9f9; padding: 10px; font-size: 0.8rem; background: rgba(0,0,0,0.05); background: #fff; outline: 1px solid #aaa; color: #0C0C0B; margin-bottom: 20px;}

.dt_container{display: flex; justify-content: flex-start; flex-wrap: wrap;}
.dt_sep{margin: 0 5px;}
.embed-container {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 0;
	height: 0;
}
.embed-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
    border: none;
}
.modalimage{margin-bottom: 20px;}






.userprofile{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.userleft{width: 300px;}
.userimage{width: 100%; margin-bottom: 20px;}
.userimage img{width: 100%;}
.usercontact{width: 100%; font-size: 14px;}
.usercontact span{ color: var(--main); font-weight: 700;}

.userright{width: calc(100% - 300px); padding-left: 40px;}

.userh{color: var(--grey);}

.userlabel{color: var(--main); font-weight: 700; width: 30%;}
.usertext{width: 65%;}
.usersection{font-size: 14px; margin-bottom: 10px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.userhead{width: 100%;}
/*
.modalimage{width: 100%; margin-bottom: 20px;}
.modalimage img{width: 100%;}

/* ==========================================================================
   FORM
   ========================================================================== */

.contactbuttons{display: flex; justify-content: flex-start; flex-wrap: wrap;}
.eachcontactbutton{margin-right: 20px; margin-bottom: 20px;}
.contactbuttontext{width: 100%; padding-bottom: 20px;}
.contactcontent{display: flex; justify-content: space-between; flex-wrap: wrap;}
.contactinfo{width: 100%;}
.contactmap{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.eachcontact{display: flex; justify-content: flex-start; flex-wrap: wrap; align-items: center; margin-bottom: 10px;}
.contacticon{margin-right: 20px; min-width: 20px; text-align: right; color: var(--main); text-align: center;}
.contactdetails{width: calc(100% - 40px);}
.gm-style-mtc div{font-size: 12px !important;}

.contactsocial{display: flex; justify-content: flex-start; flex-wrap: wrap; padding: 0;}
/*
.contactsocial a{color: #1a1a1a; margin-right: 20px; font-size: 16px;}
.contactsocial a:hover{ }
.contactsocial a.gplink:hover{color: #ff0000;opacity: 1;}
.contactsocial a.twlink:hover{color: #55acee;opacity: 1;}
.contactsocial a.lilink:hover{color: #0077B5;opacity: 1;}
.contactsocial a.fblink:hover{color: #3b5998;opacity: 1;}
*/
.contactsociallink{}
.contactsocial a{color: #fff; margin-right: 10px; font-size: 16px;}
.theform{width:100%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0; box-shadow: 0 15px 45px rgba(0,0,0,0.25), 0 7px 10px rgba(0,0,0,0.05); padding: 40px; margin: 40px 0 0; background: #fff;}
.halfinput{width:  49%; position: relative;}
.fullinput{width: 100%; position: relative;}
.theform label{font-size: 12px;}
.textinput{width: 100%; border:1px solid #f9f9f9; padding: 10px; font-size: 0.8rem; background: rgba(0,0,0,0.05); background: #fff; outline: 1px solid #aaa; color: #0C0C0B; margin-bottom: 20px;}
.textinput:focus{outline: 1px solid #0f0f0f; background: #f1f1f2;}
.submitbutton{width: 100%; border:1px solid var(--main); border-radius: 40px; color: #fff; font-weight: 700; padding: 15px; font-size: 18px; transition: 0.4s; cursor: pointer; margin-bottom: 20px; background: var(--main)}
.submitbutton:hover{background: #fff; color: var(--main);}
textarea{height: 200px; text-align: left;}
.smallprint{font-size: 12px;}
.subsmallprint{font-size: 12px;}


.linkemail{word-break: break-all;}


/* ==========================================================================
   GDPR
   ========================================================================== */

.privacylinks{width: 100%; padding: 40px 40px 20px; background: var(--main); display: flex; justify-content: space-between; flex-wrap: wrap; }
.privacylink{width: calc(50% - 10px); margin-bottom: 20px; padding: 10px; background: #fff; color: #00134E; transition: all 0.3s cubic-bezier(.25,.8,.25,1); text-transform: uppercase; font-weight: 600; font-size: 14px;}
.privacylink:hover{background: rgba(255,255,255,0.5); }
.privacycontent{padding: 40px 0;}



.ptable{margin: 20px 0;}
.ptable tr td{padding: 20px; border: 1px solid #ccc;}
.ptable th{padding: 20px; background: var(--main); }
.ptable td.tpink{padding: 20px; background: var(--main); }
.ptable th p strong{font-weight: 700; color: #fff;}
.ptable td.tpink p strong{font-weight: 700; color: #fff;}

.sitemapul{}
.sitemapul ul{padding: 10px 0 0 20px; margin-bottom: 20px;}
.sitemapul li{margin-bottom: 5px;}


.eachuseful{width:100%; background:#f7f7f7; padding:20px 20px 40px 20px; margin-bottom:20px; position:relative;}

.usefullink{position:absolute; bottom:0; right:0; padding:10px; color: #fff; background: var(--main);}
.usefullink:hover{background: #fff; color: var(--main);}


.has-tooltip:hover + .tooltip,
.has-tooltip:focus + .tooltip,
.has-tooltip.hover + .tooltip {
  opacity: 1;
  transform: translate(-50%, -100%) scale(1) rotate(0deg);
  pointer-events: inherit;
}
.has-tooltip:hover + .textinput { background-color: yellow;}
.has-tooltip{color: var(--main);}
.tooltipper{font-weight: 700; width: 16px; height: 16px; display: flex; justify-content: center; align-content: center; flex-wrap: wrap; background: var(--main); color: #fff; border-radius: 8px; font-size: 10px;}
.fullinput label{display: flex; justify-content: flex-start; flex-wrap: wrap; padding-bottom: 5px;}
.tooltip {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
  transform-origin: bottom center;
  padding: 10px 30px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.75);
  text-align: center;
  color: #fff;
  transition: 0.15s ease-in-out;
  opacity: 0;
  width: 100%;
  max-width: 100%;
  pointer-events: none;
  z-index: 5;
}
.tooltip.blue {
  background: rgba(0,46,94, 0.75);
}
.tooltip.blue:after {
  border-top: 5px solid rgba(0,46,94, 0.75);
}

.tooltip:hover {
  opacity: 1;
  transform: translate(-50%, -100%) scale(1) rotate(0deg);
  pointer-events: inherit;
}
.tooltip img {
  max-width: 100%;
}
.tooltip:after {
  content: "";
  display: block;
  margin: 0 auto;
  widtH: 0;
  height: 0;
  border: 5px solid transparent;
  border-top: 5px solid rgba(0, 0, 0, 0.75);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
}

/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should be a color other than white */
	z-index:9999999; /* makes sure it stays on top */
    display: flex;
    justify-content: center;
    align-items: center;
    animation: fadeout forwards;
    animation-delay: 2s;
    animation-duration: 2s;
    transition: all ease 1s;
}

@keyframes fadeout {
    from { opacity: 1;}
    to { opacity: 0; z-index: -1000;}
}

a:hover{color: var(--grey);}


.thecontact{width: 100%; margin-bottom: 40px;}
.thecontacthead{background: var(--main); padding: 10px 20px; color: #fff; text-transform: uppercase;font-family: "Combi Sans W01 Medium", 'Open Sans', sans-serif;}
.thecontactdetails{display: flex; justify-content: flex-start; background: #f6f6f6; font-size: 12px;}
.thecontactdetailstitle{width: 25%; padding: 10px 20px;}
.thecontactdetailsbody{width: 75%; padding: 10px 20px;}

textarea{max-width: 100%;}
/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 1920px) {.header{padding:30px 192px; width: 1920px;}}

@media only screen and (min-width: 1220px) {.navigation{display: flex!important;}.ham{display: none; order: 4;}}
@media only screen and (max-width: 1220px) {
    .navcalllink{display: none;}
    .header{align-items: center; z-index: 501; padding-right: 40px;}
    .logoholder{order: 1; padding: 10px 40px;}
    .ham{display: block; order: 3;}
    
    .navigation{display: none; width: 100%; height: auto; text-align: right; padding: 40px; order: 4;}
    .navigation a{display: block; width: 100%; margin: 0; font-size: 18px; margin-bottom: 10px; padding: 0 0 20px 0; color: var(--grey);}
    .current{background: none;}
    ul.primary li:hover ul { display: none;}
    .navlink i{display: none;}
    
   
    .herotext{max-width: 100%; z-index: 4;}
    .heroheader{font-size: 40px; line-height: 45px; }
    .shallowheroheader{font-size: 60px; line-height: 60px; }
    .contactinfo{width: 100%; margin-bottom: 20px;}
    .mapopening{height: 400px;}
    
    .homeabout{width: 100%; padding: 0; border-right: 0px solid #f1f1f2;}
    .homeopening{width: 100%; padding: 0;}
    
    .nocontent{display: none;}
    
.homerightbox{padding: 5px 0;}
.homerightboximage{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.homerightboximage img{width: 100%; height: 100%; object-fit: cover;}
.homerightinner{position: relative; width: calc(100% - 80px); height: auto; margin: 40px auto; padding: 100px 40px; background: rgba(255,255,255,0.95);background:var(--main); box-shadow: 0 15px 45px rgba(0,0,0,0.25), 0 7px 10px rgba(0,0,0,0.05); opacity: 0.95; border-radius: 10px; text-align: center; margin: 40px auto;}
.homerightinner h2{color: #fff; font-size: 24px; line-height: 28px; text-align: center; margin-bottom: 40px;}

.aboutopening{width: 100%; padding: 0; background: var(--grey);} 
.aboutrightbox{padding: 0;}
.aboutrightboximage{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.aboutrightboximage img{width: 100%; height: 100%; object-fit: cover;}
.aboutrightinner{position: relative; width: calc(100% - 80px); height: auto; margin: 40px auto; padding: 100px 40px; background: rgba(255,255,255,0.95);background:var(--main); box-shadow: 0 15px 45px rgba(0,0,0,0.25), 0 7px 10px rgba(0,0,0,0.05); opacity: 0.95; border-radius: 10px; text-align: center;}
.aboutrightinner h2{color: #fff; font-size: 24px; line-height: 28px; text-align: center; margin-bottom: 40px;}

    
.contactbartext{width: 100%; margin-bottom: 20px;}
.contactbarbutton{width: 100%;}
.innerfooter{}
.footleft{width: 100%; margin-bottom: 20px; text-align: center; padding: 20px 0;}
.logofooter{ margin: 0 auto; width: 200px;}

    
    
    
.footleft{}

.footright{width: 100%; padding: 0;}
    
    .footright1{width: 100%; text-align: center; margin-bottom: 10px;}
    .footright2{width: 100%; text-align: center; margin-bottom: 10px;}
    .footright3{width: 100%; text-align: center; margin-bottom: 10px;}
    .contactsocial{display: flex; justify-content: center; flex-wrap: wrap; padding: 0;}
    .contactsocial a{color: #fff; margin: 0 10px; font-size: 16px;}
   .footnavlink{display: inline-block; margin: 0 10px 5px;} 
    .footbottom{text-align: center;}
    
.newsinner{padding: 80px 40px;}
    .homegrid{grid-template-columns: 1fr 1fr;}
    .teamgrid{grid-template-columns: 1fr 1fr;}
    
    .azgrid{grid-template-columns: 1fr 1fr;}
    .servicepagegrid{grid-template-columns: 1fr;}
    
    .teamabout{width: 70%;}
.teamopening{width: 30%;}
  
    .contactbartext1{width: 100%; margin-bottom: 20px;}
.contactbarform{width: 100%;}
    .subinput{flex-grow: 1; max-width: 40%;}
    .subform{justify-content: flex-start;}
    .subsuccess{width: 100%; text-align: left;}
      .homeservicesgrid{grid-template-columns: 1fr 1fr;}
    
    .networkgrid{grid-template-columns: 1fr 1fr;}
    .maincontent{width: 100%;}
    .sidebar{width: 100%;}
    .emptysidebar{display: none;}
}



@media only screen and (max-width: 800px) {
    .container{width: 100%; margin: 0 auto;}
    
    h1{font-size: 26px;}
    .herotext{max-width: 90%;}
 

.heroslideshow{width: 100%;} 


    .privacylink{width: 100%; }

    .heroheader{font-size: 30px; line-height: 40px; }
    .shallowheroheader{font-size: 60px; line-height: 60px; }
   
    
.ptable tr td{padding: 5px;}
.ptable thead th{padding: 5px; }


   
.homegrid{grid-template-columns: 1fr;}
.servicegrid{grid-template-columns: 1fr;}
.aboutgrid{grid-template-columns: 1fr;}
.teamgrid{grid-template-columns: 1fr;}
    .azgrid{grid-template-columns: 1fr;}
    summary{font-size: 16px;}
    
    .eachlogo img{height: 40px; width: auto;}
    
    .teamabout{width: 100%;}
.teamopening{width: 100%; min-height: 300px;}
    .subinput{flex-grow: 1; max-width: 25%;}
    .testimonial{ padding: 40px;}
    .theform{padding: 20px;}
   
     .homeservicesgrid{grid-template-columns: 1fr;}
    .homeservices{background: #f1f1f2;}
    
    .modalimage{display: none;}

.modalbody{width: 100%; padding: 20px;}
    
    .networkgrid{grid-template-columns: 1fr;}
    .modal .content-wrapper{width: 90%;}
    
    .userprofile{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.userleft{width: 100%;}
.userimage{width: 300px;}


.userright{width:100%; padding: 40px 0 0 0;}
    
    .eachcontactbutton{padding-bottom: 20px;}

}

@media only screen and (max-width: 700px) {
    .subinput{width: 100%; max-width: 100%;}
    .subinputname{border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-right: 0px solid #fff; border-bottom: 1px solid var(--main);}
    .subscribesubmit{width: 100%; border-radius: 0px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
    /*.logo{width: 200px;}
    .logoholder{width: 200px;}
    .headcontact a{font-size: 12px;}
    */
    .headcontactlarge{display: none;}
    .headcontactsmall{display: flex; justify-content: flex-start; flex-wrap: wrap;}
    .headcontactsmall a{margin-right: 10px; font-size: 16px;}

}
/*ANIMATE
@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{from{opacity:1}to{opacity:0}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.delay-1s{-webkit-animation-delay:1s;animation-delay:1s}.animated.delay-2s{-webkit-animation-delay:2s;animation-delay:2s}.animated.delay-3s{-webkit-animation-delay:3s;animation-delay:3s}.animated.delay-4s{-webkit-animation-delay:4s;animation-delay:4s}.animated.delay-5s{-webkit-animation-delay:5s;animation-delay:5s}.animated.fast{-webkit-animation-duration:800ms;animation-duration:800ms}.animated.faster{-webkit-animation-duration:500ms;animation-duration:500ms}.animated.slow{-webkit-animation-duration:2s;animation-duration:2s}.animated.slower{-webkit-animation-duration:3s;animation-duration:3s}@media (print),(prefers-reduced-motion:reduce){.animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important}}*/

.hidden{display:none!important}.sr-only{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sr-only.focusable:active,.sr-only.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;white-space:inherit;width:auto}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,*:before,*:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}