/* BRAND COLOURS */
.orange_b { background-color:#ff5c00; }
.orange_f { color:#ff5c00; }
.grey_b { background-color:#111111;}
.grey_f { color:#1d1d1d;}
.black_b { background-color:#000; }
.black_f { color:#000; }
.white_B { background-color:#fff; }
.white_f { color:#fff; }
.blue_b {background-color:#00233C;}
.blue_f {color:#00233C;}
.green_b {background-color:#323C19;}
.green_f {color:#323C19;}
.purple_b { background-color:#53328B; }

/* BASIC CONTENT */
body { font-family:'Inter', sans-serif !important; font-weight:400;}
.content h1 {font-size: 70px; margin:0px 0 23px 0; line-height:78px; font-family:'anostencilregular' !important; }
.content h2 {font-size: 50px; margin:0px 0 16px 0; line-height:60px; font-family:'anostencilregular' !important; }
.content h3 {font-size: 30px; margin:0px 0 10px 0; line-height:40px; font-family:'formularregular' !important; }


.content.title {font-size: 20px; margin:0px 0 7px 0; line-height:30px; font-family:'Inter', sans-serif !important; font-weight:700; } 
.content p {font-size: 18px; margin:0px 0 8px 0; line-height:30px; font-family:'Inter', sans-serif !important; font-weight:400; } 
.content p a {text-decoration:underline; font-weight: 400; color:inherit;}
.content .button {font-size: 20px; margin:0px 0 7px 0; line-height:24px; font-family:'Inter', sans-serif !important; font-weight:700; padding:10px 20px; display:inline-block;} 
.content .button.white_f {color:#fff !important;}
.content .small {font-size: 14px; margin:0px 0 5px 0; line-height:20px; font-family:'Inter', sans-serif !important; font-weight:600; } 
.content strong {font-weight: 700;}
.content p a:hover {opacity:0.9;}
.content a.button {text-decoration:none;}
.content ul li {font-size: 18px; margin:0px 0 8px 0; line-height:30px; font-family:'Inter', sans-serif !important; font-weight:400; } 
.content ol li {font-size: 18px; margin:0px 0 8px 0; line-height:30px; font-family:'Inter', sans-serif !important; font-weight:400; } 
.content table {border-collapse:collapse;}
.content table {}
.content table thead {}
.content table thead th {}
.content table tbody {}
.content table tbody tr {}
.content table tbody td {}
.content table tbody th {}
.content table tfoot {}
.content table tfoot td {}
.content table tfoot th {}
 .fab {font-family:'Font Awesome 5 Brands' !important;}

/* MOBILE FONT STYLES */
@media(max-width:768px){
    .content h1 {font-size: 42px; margin:0px 0 14px 0; line-height:46px;}
    .content h2 {font-size: 30px; margin:0px 0 10px 0; line-height:40px;}
    .content h3 {font-size: 24px; margin:0px 0 8px 0; line-height:34px;}
    .content.title {font-size: 18px; margin:0px 0 6px 0; line-height:22px;}
    .content p {font-size: 16px; margin:0px 0 6px 0; line-height:22px;}
    .content.button {font-size: 18px; margin:0px 0 6px 0; line-height:22px;}
    .content p.small {font-size: 14px; margin:0px 0 6px 0; line-height:20px;}
    .content ul li {font-size: 16px; margin:0px 0 6px 0; line-height:22px;}
    .content ol li {font-size: 16px; margin:0px 0 6px 0; line-height:22px;}
}

/* BASIC FORMS*/
.forms fieldset {position:relative;}
.forms .textbox, .forms textarea {display:block; width:100%; padding: 20px; margin-bottom:10px; font-size:18px; color:#444; border:1px solid #000;}
.forms .textbox:focus {border:1px solid #ff5c00;}
.forms .textbox:hover {}
.forms select {width:100%; font-size: 18px; color:#666; height: 60px; padding: 14px;}
.forms select:active {}
.forms input[type="checkbox"] {}
.forms input[type="checkbox"]:checked {}
.forms .error {color:red; border-color:red;}
.forms .mandatory:after {content:"*"; position:absolute; color:red; right:0; top:0;}
.forms input[type="button"] {-webkit-appearance:none; appearance:none; background:#ff5c00; display:block; width:100%; padding: 15px; margin-bottom:10px; font-size:18px; color:#fff; border:none;}
.forms input[type="button"]:hover {background:#222;}
.forms textarea {height: 120px; margin-top: 10px; font-family:Helvetica;}
.forms label {display:block; text-align:left; padding: 14px 10px 18px 10px;}

/* BASIC LAYOUT */
main {min-height: 65vh;}
#wrapper {position:relative;left:0px;padding-top: 75px;}
#mobNav {position:fixed; width: 300px; right:-300px; top:0; bottom:0; z-index:110; background:#ff5c00; box-shadow: 0px 0px 20px rgba(0,0,0,0.3);}
#navBtn {position: absolute;left: -74px; transform:scaleX(1.5);top: 15px;color:#ff5c00; padding: 4px 8px;border-radius: 2px;font-size: 40px; cursor:pointer;}
#navBtn:hover {background:#1d1d1d;}
.mobNavOn #navBtn {background:rgba(0,0,0,0.75);}

/*tooltip hover*/
#toolTip {position:fixed; text-align:center; z-index:10000; line-height: 1.3; padding:5px 8px; font-size: 13px; border-radius: 3px; color:#fff; box-shadow:2px 10px 10px rgba(0,0,0,0.2); background:#222; left:-1000px; top:-1000px; max-width: 200px;  pointer-events: none;}
#toolTip:after {content:"\f0d7"; font-size: 20px; position:absolute; font-family:'fontAwesome'; bottom:-16px; left: 49%; text-shadow:0 6px 3px rgba(0,0,0,0.1); color:#222;}

/* MOBILE NAVIGATION*/
.mobNavOn {right:0px !important;}
.wrapperOn {left:-320px !important;}
#newNav { position: fixed; width: 320px; right: -320px; top: 0; bottom: 0; z-index: 500; background: #ff5c00; box-shadow: 0 0 20px rgba(0,0,0,.52); padding-top: 72px;}
#newNav .nav_first { padding-bottom: 100px; min-width: 110%; display: block;}
#newNav .noMobNav {display:none;} 
#newNav .bigNAV a {font-size: 32px !important;}
#newNav .nav_first li { position: relative;}
#newNav .nav_first>li>a { font-size: 17px; width: 100%; display: block; color: #fff; font-weight: 300; padding: 10px 15px 11px 15px; border-bottom: 1px solid #f39378; border-top: 1px solid #f39378; margin-top:-1px;}
#newNav .nav_first>li>a:hover { background: #1d1d1d;}
#newNav .nav_first>li>.staticNav { position: relative;}
#newNav .nav_second {margin-top:-0px;}
#newNav .nav_second>li>a { padding: 6px 5px 0 40px; line-height: 1.4; display: block; width: 90%; margin-left:5%; position: relative; color: #fff; font-size: 20px !important; border-bottom:1px solid #f39378; height:40px; border-left:1px solid #f39378; border-top:1px solid #f39378; margin-top:-1px;}
#newNav .nav_second>li>a:before { position: absolute; content: ">"; left: 18px; color: #fff; opacity:0.5; transition: all .3s ease-in-out;}
#newNav .nav_second>li>a:hover { padding-left: 40px; background:rgba(0,0,0,0.1) !important;}
#newNav .nav_second>li>a:hover:before { left: 22px; color: #fff; opacity:1;}
#newNav .nav_third>li>a { padding: 9px 5px 4px 36px; margin-bottom: 0; line-height: 1.2; display: block; width:80%; margin-left: 10%; position: relative; color: #fff; font-size: 20px !Important; border-bottom:1px solid #f39378; height:40px; margin-top:1px solid 1px; border-left:1px solid #f39378 !important;}
#newNav .nav_third>li>a:before { position: absolute; content: ">"; left: 12px; color: #fff; opacity:0.5; transition: all .3s ease-in-out;}
#newNav .nav_third>li>a:hover {  background:rgba(0,0,0,0.1) !important;}
#newNav .nav_third>li>a:hover:before { left: 18px; color: #fff; opacity:1 !important;}
#newNav .nav_fourth>li { margin-left: 5px;}
#newNav .nav_fourth>li>a { padding: 8px 5px 0 55px; margin-bottom: 4px; line-height: .8; display: block; width: 100%; position: relative; color: #ddd; color: rgba(255,255,255,.6); font-size: 11px;}
#newNav .nav_fourth>li>a:before { position: absolute; content: ">"; left: 40px; color: rgba(255,255,255,.2); transition: all .3s ease-in-out;}
#newNav .nav_fourth>li>a:hover { padding-left: 60px;}
#newNav .nav_fourth>li>a:hover:before { left: 46px; color: #fff;}

.subMenu { position: absolute; right: 30px; top: 1px; height: 39px; width: 37px; background: #ff5c00; color: #fff; z-index: 100; text-align: center; padding-top: 3px; border-left:1px solid rgba(255,255,255,0.2); border-bottom:1px solid rgba(255,255,255,0.2);}
.bigNAV>.subMenu {height: 54px; padding-top: 9px !important;}
.subMenu:hover {background:#1d1d1d; border-bottom:1px solid rgba(255,255,255,0.3);}
.subMenu:before { content: "-"; font-size: 28px;}
.subMenu.closed { padding-top: 3px;}
.subMenu.closed:before { content: "+"; font-size: 28px;}
#navSocial {position:fixed; bottom:0; width:320px; padding: 0 25px 50px 25px; font-size: 32px; text-align:center;}
#navSocial a {margin:0px 10px;}
#navSocial h3 {display:none;}


/* BREADCRUMBS */

#breadcrumbs { padding:12px 0px; border-top:1px solid #333; font-size: 9px; white-space:nowrap; color:#444; overflow:auto; }
#breadcrumbs a {font-weight: 300; color:inherit; font-size: 13px; padding:0px 10px 0px 5px;}
#breadcrumbs a:hover {text-decoration:underline;}
#breadcrumbs .col-xs-12:before {content:"You are here: "; display:inline-block; padding-right: 10px;font-size: 12px; color:#666; font-weight: 200; font-style:italic;}


/* DESKTOP NAVIGATION*/
header {border-bottom:1px solid #333;position: fixed;top: 0;left: 0; width: 100%;height: 75px;z-index: 100;}
#topNav {font-size:0px; text-align:center; padding: 25px 100px 25px 0;}
#topNav .noTopNav {display:none;}
#topNav input {display:inline-block;}
#topNav>ul {display:inline-block;}
#topNav li {display:inline-block;margin:0 45px; position:relative;}

#topNav li a { color:#fff;  font-size: 27px; font-family:'formularregular' !important; text-transform:uppercase;}
#topNav li:hover a {color:#ff5c00;}

#bookNowBtn {position:absolute; right:100px; top: 22px; background:#ff5c00; border:2px solid #ff5c00; color:#fff; font-size: 18px; 
padding:7px 10px 5px 10px; border-radius: 0px;font-weight:bold;}
#bookNowBtn a {color:#fff;}
#bookNowBtn:hover {background:#000; border:2px solid #fff;}

@media(min-width:768px) and (max-width:1000px){ #topNav li { margin:0px 30px;}
    #topNav li {padding-top: 5px;}
    #topNav li a {font-size: 20px;}

}
@media(max-width:768px){
   #topNav  {height: 60px;} 
   #topNav li {display:none;} 
   header {height: 60px;} #wrapper {padding-top: 60px;}
   #bookNowBtn  {top:14px;}
}
/* MOBILE SITE SEARCH*/

.siteSearch {z-index:100;width: 100%; position:relative; display:none;}
.siteSearch .fa-search {position:absolute; top: 6px; left:8px; color:#fff; font-size: 23px;}
.siteSearch .fa-times-circle {position:absolute; top: 4px; right: 6px; cursor:pointer; font-size: 26px; color:#fff;}
.siteSearch .fa-times-circle:hover {color:#000;}
.siteSearch input {max-width: 100% !important; width: 100%; padding: 8px 20px 8px 35px !important; color:#fff; outline:none; border:none; border-radius: 0px; background:#000;}
.siteSearch input:focus {outline:0 !important; border:none; box-shadow:none; background:#1a339a;}

/*search results*/
#searchResults {background:#515457; position: relative; z-index: 999;}
#searchResults li {color:#999; font-weight: 100; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative; padding: 6px 10px 6px 30px; border-bottom:1px solid rgba(255,255,255,0.1);}
#searchResults li a {color:#fff; font-weight: 200; font-size: 14px;}
#searchResults li:hover {background-color:#1a339a;}
#searchResults .search_News:before {position:absolute; content:"\f1ea"; color:#1a339a; left: 6px; top: 5px; font-size: 16px; font-family:'fontAwesome';}
#searchResults .search_Navigation:before {position:absolute; content:"\f054"; color:#ddd; left: 10px; top: 5px; font-size: 16px; font-family:'fontAwesome';}
#searchResults .selected {background-color:#1a339a;}


/* FOOTER */
 .footerLine {border-bottom:4px solid #ff5c00; padding-top:11%;}
 .social i {font-size: 40px; margin-right:20px;}
 footer img {margin:0 9%;}
 @media(max-width:480px){ footer img {margin:40px auto 20px auto !important; max-width: 100px;}}
 @media(max-width:768px){ .footHeader {margin-bottom: -20px !important; margin-top: 20px !important;}}
 @media(min-width:769px){ .logocol {padding: 20px 30px 0 30px;} }
footer a:hover {color:#ff5c00;}

/*CAROUSEL*/

.carouselWrapper {padding:20px 50px !important; position:relative;}
.carousel {margin-left:-15px; margin-right:-15px; height:auto; position:relative; font-size:0px; padding-bottom: 12px;}
.carouseltem  {width:250px; padding:0px 15px; display:inline-block; }
.carouseltem>a>div {border:1px solid #555;}
.carouseltem h4 {font-size:16px;}
.carLeft,.carRight {cursor:pointer; position:absolute; font-size:32px; color:rgba(0,0,200,0.4); top:38%;}
.carLeft {left:5px;}
.carRight {right: 5px;}
.carLeft:hover,.carRight:hover {color:rgba(0,0,255,0.9);}
.infoPanel {padding-top: 70%; transform:scale(1); overflow:hidden !important; width:100%; position:relative;}


/*GALLERY*/
.gallery {/* background-size:cover !important; *//* background-position:center center !important; */display:inline-block;position:relative;border-left:1px solid rgba(0,0,0,0.2);border-right:1px solid rgba(255,255,255,0.2);margin-bottom: -5px;vertical-align: top;}
.gallery .fa-search-plus {position:absolute; bottom: 10px; font-size: 36px; right: 10px; color:#fff; text-shadow:1px 1px 2px rgba(0,0,0,0.7);}
.gallery img {max-height:256px; display:inline-block;}
#gallery {position:fixed; padding: 40px; top:0; left:0;right:0;bottom:0; background:#000; background:rgba(0,0,0,0.8); z-index:2000;}
#gallery ul {display:block; position:relative; text-align:center; height: 100%;}
#gallery li {position:absolute; top: 0px; left: 0px; width: 100%; text-align:center; pointer-events:none;}
#gallery li img {max-width: 100%; max-height:90vh;}
#gallery li p {position:absolute; bottom:0;left:-20%;right:-20%;padding:20px 10px; color:#fff;background:rgba(0,0,0,0.6); text-align:center; font-size:18px;}
#gallery .galClose,#vrgallery .vrClose {opacity:0.8; position:absolute; top: 12px; right: 12px; z-index:201; color:#fff; font-size: 48px;}
#gallery .galPrev  {opacity:0.8; position:absolute; top: 48%; left: 5px; z-index:201; color:#fff; font-size: 36px;}
#gallery .galNext  {opacity:0.8; position:absolute; top: 48%; right: 5px; z-index:201; color:#fff; font-size: 36px;}
#gallery i:hover {opacity:1;}
.basicPanel {position:relative; background:#fff; box-shadow:0px 0px 4px rgba(0,0,0,0.3); padding:50% 0px;}
.showGallery {cursor:pointer;}


/*404*/
.error404 { transition:all 4s ease-out; transform:scale(0.5); max-width:300px; width:100%; background:rgba(255,255,255,0.9); border-radius: 10px; box-shadow:0px 0px 20px rgba(0,0,0,0.3);padding: 10px 25px; border:6px solid #1a339a;  position:absolute; margin-top: 15%; left: 50%; margin-left: -150px; z-index:100;}
.error404 h1 {font-size: 48px; letter-spacing:1px;color:#1a339a;}
.error404 h2 {font-size: 20px; letter-spacing:1px;color:#444;}
.error404 p {font-size: 11px; margin-top: 10px;}
.error404 p a {color:#1a339a; font-weight:bold;}
.error404grow {transform:scale(1.1) !important;}


/*MODAL BOX */

#modal {position:fixed; z-index:999999; top:0; left:0; right:0; bottom:0; background:rgba(240,240,240,0.8);}
#modalBox {box-shadow:0px 0px 10px rgba(0,0,0,0.1); background:#fff; padding: 25px; border:1px solid #ddd;position:relative; margin:100px auto; width:90%; max-width: 640px; transform:scale(1.0);}
#modalBox .closeModal {position:absolute; right: 10px; top: 10px; font-size: 24px; color:#999; cursor:pointer;}
#modalBox .closeModal:hover {color:#1a339a;}
#modalBox.shrunk {transform:scale(0.9) !important; opacity:0;}
#modalBox h3 {font-weight: 100; color:#1a339a; font-size: 24px !important;}
#modalBox p {color:#444; font-weight: 300; margin:5px 0px; font-size: 14px; line-height: 1.6;}
#modalBox fieldset {padding:0; margin:0;}
#modalBox fieldset label {font-size: 12px !important; padding:5px 0;}

#modalBox h4 {font-weight: 100; color:#333; font-size: 18px !important; margin: 10px 0;}
#modalBox .modalBtn {display:inline-block; margin:5px 10px 0px 0px;; font-size: 14px; background:#1a339a; color:#fff; padding: 4px 12px; border-radius: 2px;}
#modalBox .modalBtn:hover {background:#111;}

@media(max-width:768px){ #modalBox {position:absolute; margin:0px auto; top: 10px; left: 5px; right: 5px; max-height: 95vh; overflow:auto;}
     .footerNote p {text-align:center; padding: 2px;}
}


/* PARALAX */

.parallax600 {width: 100%; height: 600px; overflow: hidden; position:relative;}
.parallax500 {width: 100%; height: 500px; overflow: hidden; position:relative}
.parallax400 {width: 100%; height: 400px; overflow: hidden; position:relative}
.parallax300 {width: 100%; height: 300px; overflow: hidden; position:relative}

@media(min-width:961px){.px_content h5 {padding:0px 20%;} }
@media(max-width:960px){ 
.parallax600 {height:500px;}.parallax500 {height:400px;}.parallax400 {height: 320px;}.parallax300 {height: 240px;}
}
@media(max-width:767px){ 
.parallax600 {height:420px;}.parallax500 {height:400px;}.parallax400 {height: 300px;}.parallax300 {height: 240px;}
}
@media(max-width:480px){ 
.parallax600 {height:400px;}.parallax500 {height:360px;}.parallax400 {height: 280px;}.parallax300 {height: 200px;}
.px_content {padding-top:5px !important; padding-bottom:5px !important;}
}
.px_content {position:absolute; z-index:50; top:0;left:0;right:0;}
.px_tint {position:absolute; z-index:1; background:rgba(0,0,70,0.85); top:0;left:0;right:0;bottom:0;}
.px {background-repeat:no-repeat; background-size:cover; background-attachment:fixed; z-index:-2; height:100%;}



/* BLOG */


.developerFilters { background: #1d1d1d; text-align: center; padding: 7px 0 10px 0; margin: 0 0 20px 0;}
.developerFilters label { font-size: 12px; display: inline-block; padding: 0px 5px 0 5px; position: relative; top: 2px; vertical-align: bottom; color:#ccc;}
.developerFilters input[type=text] { min-width: 280px; margin-bottom: 2px; border: 1px solid #ddd; font-size: 16px; padding: 8px 10px; margin-left: 8px; border-radius: 2px;}
.developerFilters select { height: 40px; font-size: 14px; font-weight: 200; margin: 0 0 0 8px; padding: 10px; border-radius: 2px;}
.developerFilters input[type=submit] { display: inline-block; font-size: 20px; margin-left: 10px; height: 40px; vertical-align: bottom; position: relative; top: 3px; padding: 2px 20px; border: none; font-weight: 600; background: #ff5c00; color: #fff;}
.developerPaging a { border: 1px solid #ddd; border-radius: 4px; min-width: 25px; height: 25px; display: inline-block; padding: 3px 2px 2px 2px; text-align: center; font-weight: 100; margin: 0 5px 20px 5px; text-shadow: 1px 1px 0 rgba(0,0,0,.2);}
.developerPaging .pagingLess,.developerPaging .pagingMore { border: none!important;}
.developerPaging .pagingCurrent { background: #ff5c00; color: #fff;}
@media(max-width: 768px) { 
	.developerFilters label {width:95%; padding:6px; text-align: left; position: relative; height: 42px;}
    .developerFilters input[type=text],.developerFilters select {width: 70%; position: absolute; right: 0; top: 1px;}
    .developerFilters input[type=submit] { width: 95%; margin: 5px 0;}
    .developerFilters select {height: 37px;}
}
.developerFilterBy { margin-top: 5px;}
.developerFilterBy label { display: inline-block; vertical-align: middle;}
.developerFilterBy ul { display: inline-block;}
.developerFilterBy li { cursor: pointer; font-size: 12px; color: #444; font-weight: 400; background: #ddd; display: inline-block; margin: 4px; padding: 3px 12px 1px 11px; border-radius: 10px;}
.developerFilterBy li.selected { background: #f90; color: #fff;}

.newsPanel {padding: 0px 20px 0 20px;}
.newsPanel h3 {font-size: 28px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.newsPanel p {font-size: 18px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.newsPanel .button {display:block; margin:0px -20px; text-align:center;}
.newsNanoImage {padding-top: 50%; display:block; margin:0 -20px 10px -20px; background-size:cover; background-position:50%; }

/* NEWS ITEM */









.h2_hatching {position:relative; z-index:10;}
.h2_hatching:before {content:""; position:absolute; left: 50px; top:-10px; bottom:-10px; right:-38px; background-image:url(files/image/vector/hatching_b_2.svg); background-size:600%; background-repeat:no-repeat; background-position:0% top; z-index:-1;}

@media(max-width:480px){.h2_hatching {text-align:center !important;} .h2_hatching:before {top: -142px; bottom: 130px;left:0; right:-14px;} .leftPic {padding-top:100%; margin:5px -15px;} .rightPic {padding-top:100%; margin:5px -15px;}}
@media(min-width:480px){.leftPic {position:absolute; left:0; right:55%; top:0; bottom:0; background-size:cover;} .rightPic {position:absolute; right:0; left:55%; top:0; bottom:0; background-size:cover;}}

/* F51 CAREOUSEL */
.f51_carousel {position:relative;}
.f51_carousel ul {display:block; overflow:hidden; text-align:center; position:relative;}
.f51_carousel li {width:90%; max-width:640px; margin:0px auto; display:inline-block; transform-origin:50% 100%; transform:scale(1); white-space:initial;}
.carousel_circ li span {padding-top:90%; display:block; max-width:90%; margin:15px; border-radius:100%; border:1px solid rgba(255,255,255,0.1); background-size:cover; background-position:50% 50%;}
.carousel_pop li span {padding-top:90%; display:block; max-width:90%; margin:0px 5% 15px 5%; /*15px*/ border:1px solid rgba(255,255,255,0.1); background-size:cover; background-position:50% 50%;}
.carousel_pop li h2 {font-family: 'Inter' !important; background:#ff5101; position:absolute; left:5%; right:20%; width:75%; bottom: 0px; height: 93px; font-size: 20px; text-align:left; padding-left: 20px;}
.carousel_pop li h2:after {position:absolute; content:""; top:0; bottom:0; right:-20px; width: 50px; background:#ff5101; transform: skew(-20deg, 0deg);}
.carousel_pop li p {font-family: 'Inter' !important;  position:absolute; left:5%; right:5%; width:90%; bottom: 15px; height: 42px; font-size: 16px; text-align:left; padding-left: 20px;}   
.carousel_circ li .button {margin-top: 20px !important; display:inline-block;}
.f51_carousel .hatching_top {height: 200px; position:absolute; right:0; top:0; width:50%; max-width:600px; background-image:url(files/image/vector/hatching_b_3.svg); background-size:260%; background-repeat:no-repeat; background-position:80% bottom;}
.f51_carousel .hatching_bottom {height: 130px; position:absolute; right:0; bottom:-65px; width:100%; max-width:960px; background-image:url(files/image/vector/hatching_o_2.svg); background-size:180%; background-repeat:no-repeat; background-position:0% top;}
.f51_carousel.carousel_pop .hatching_bottom  {display:none;}
.f51_carousel.carousel_pop .hatching_top {top:auto; bottom:0; right:auto; left:0; background-size:300%; max-width:800px;  background-position:100% bottom; height: 120px;}
.carousel_nav {position:absolute; top:30%; height: 30%; left:5%; width:90%; display:none;}
.carousel_nav i {position:absolute; width:95px; height:95px; background-image:url(files/image/vector/arrow_right.svg); background-size:contain; transform:scale(1); display:none;}
.carousel_nav i.carousel_next {right:0; top:0;}
.carousel_nav i.carousel_prev {left:0; bottom:0; transform:scaleX(-100%);}    
.f51_carousel.active ul {white-space:nowrap; font-size:0; overflow-x:hidden;} 
.f51_carousel li.live {position:absolute; left:0; top:0; opacity:0.4;}
.f51_carousel li.live h2 {opacity:0;}
.f51_carousel li.live p {opacity:0;}
.f51_carousel li.live a {opacity:0;}
.f51_carousel li.active {opacity:1 !important; z-index:10;}
.f51_carousel li.active h2 {opacity:1 !important;}
.f51_carousel li.active p {opacity:1 !important;}
.f51_carousel li.active a {opacity:1 !important;}
.carousel_pop ul {overflow-y:visible !important; overflow-x:hidden;}
.f51_carousel.carousel_pop li:not(.active) {margin-top: -20px;} /*50px*/
@media(max-width:768px){ .f51_carousel.carousel_pop li:not(.active) {margin-bottom:25px;} .carousel_pop li h2a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .carousel_pop li span  {margin-bottom:10px; } .carousel_pop li p {padding-right: 80px !important; max-height:80px; overflow:hidden;}}

/* F51 SLIDER */
.f51_slider {position:relative; }
.f51_slider.active .slider_images {position:relative; white-space:nowrap; background:#000; box-shadow:inset 0px 0px 0px rgba(0,0,0,0.8); font-size:0; overflow:hidden;}
.f51_slider.active .slider_images:after {content:""; position:absolute; left:0; top:0; width:100%; height:100%; box-shadow:inset 0px 0px 0px rgba(0,0,0,0.8); transition:all 0.3s ease-out;}
.f51_slider.active .slider_images li img {width:1px; height:1px; opacity:0; position:absolute;}
.f51_slider.active .slider_images li {padding-top:60%; display:inline-block; position:relative; background-size:cover; width:100%; background-position:50%;}
.f51_slider.active .slider_images li {position:absolute !important; left:0; top:0;}
.f51_slider .slider_navigation {position:absolute; left:0; right:0; top: 45%; display:none;}
.f51_slider .slider_navigation  i {position:absolute; width:95px; height:95px; background-image:url(files/image/vector/arrow_right.svg); background-size:contain; transform:scale(1); display:none;}
.f51_slider .slider_navigation  i.slider_next {right:5%; top:0;}
.f51_slider .slider_navigation  i.slider_prev {left:5%; top:0; transform:scaleX(-100%);}    
.f51_slider .slider_nano {position:absolute; bottom: 15px; left:0; right:0; width:100%; text-align:center;}
.f51_slider .slider_nano ul {padding: 10px; display:inline-block; background:rgba(255,255,255,0.4); font-size:0px; border-radius: 6px; border:1px solid rgba(255,255,255,0.2); white-space:nowrap;}
.f51_slider .slider_nano ul li {width:70px; opacity:0.9; height: 40px; margin:0px 5px; display:inline-block; border-radius: 3px; border:1px solid rgba(255,255,255,0.5); background-size:cover; background-position:50% 50%;}
.f51_slider .slider_nano ul li:hover {border-color:#ff5c00; opacity:1;}
@media(max-width:480px){
 .f51_slider.active .slider_images li {padding-top:100%;}
 .carousel_pop ul {overflow-y:visible !important; overflow-x:visible !important;}
}
.f51_slider.active .slider_images.shad:after {content:""; position:absolute; left:0; top:0; width:100%; height:100%; box-shadow:inset 50px 50px 25px rgba(0,0,0,0.6);}


/*F51 WORDSTREAM */

.f51_wordstream {padding-top: 40% !important; position:relative; overflow:hidden;}
.f51_wordstream ul {position:absolute; left:33%}
.f51_wordstream ul li {padding: 20px; background:#fff; position:relative;} 
.f51_wordstream ul li h1 {margin-bottom: 0px !important; padding-right: 120px;}
.f51_wordstream ul li p {margin-bottom: 0px !important; line-height:1.2 !important;}
.f51_wordstream ul:before {content:""; position:absolute; left:-2000px; width:2005px; height:100%; bottom:0px; top:0; background:#fff;}
.f51_wordstream ul:after {content:""; position:absolute; left:99%; width:2005px; height:100%; bottom:0px; top:0; background:#fff;}
.f51_wordstream.active ul li {position:absolute;}
.f51_wordstream li h1 {font-size:70px !important;}
.f51_wordstream li p {font-size:18px !important;} 
@media(max-width:768px){
    .f51_wordstream {padding-top: 70% !important;}
}



/*F51 CTA*/
.F51_CTA {position:relative;}
.F51_CTA {overflow:hidden;}
.F51_CTA .cta_image {padding-top: 40%; background-size:cover; margin-bottom:-20%;}
.F51_CTA.white_b .cta_content {background:#fff; position:relative; z-index:10; padding-top:100px !important;}
.F51_CTA.white_b .cta_content:before {background:#fff; position:absolute; content:""; left:-200px; width:400px; height:100%; top:0; transform:skewX(-30deg); z-index:-1;}
.F51_CTA.white_b .cta_content:after {background:#fff; position:absolute; content:""; right:-500px; width:500px; height:100%; top:0; z-index:-1;}
.F51_CTA .hatching-top {position:absolute; width:50%; height: 60px;  background-image:url(files/image/vector/hatching_o_4.svg); background-size:350%; background-repeat:no-repeat; background-position:90% top; margin-top:-30px; right:0; z-index:50;}

.F51_CTA.grey_b .cta_content {background:#1d1d1d; position:relative; z-index:10; padding-top:100px !important; color:#fff;}
.F51_CTA.grey_b .cta_content:before {background:#1d1d1d; position:absolute; content:""; left:-200px; width:400px; height:100%; top:0; transform:skewX(-30deg); z-index:-1;}
.F51_CTA.grey_b .cta_content:after {background:#1d1d1d; position:absolute; content:""; right:-500px; width:500px; height:100%; top:0; z-index:-1;}
 .grey_b .cta_content:after {background:#1d1d1d; position:absolute; content:""; right:-500px; width:500px; height:100%; top:0; z-index:-1;}
@media(max-width:768px){
    .F51_CTA .cta_image {padding-top: 100%; margin-bottom:-30%;}
    .F51_CTA .hatching-top {position:absolute; width:70%; height: 40px; background-size:800%; background-repeat:no-repeat; background-position:90% top; margin-top:-20px; right:0; z-index:50;}
    .F51_CTA .cta_content:before {left:-168px !important; top:-00px !important;}
} 

/* F51 QUICK LINKS */
.quicklink:hover {transform:scale(1.05);}
.quicklink span {padding-top: 80%; display:block; background-size:cover;}
.quicklink h3 {padding:10px 0 8px 0}
.quicklink {border-bottom: 8px solid #000; transition:all 0.5s ease-in-out; margin-bottom:10px;}
.quicklink a {display:block;}

/* F51 STATIC */
.staticHeader {position:relative;}
.staticHeader h1 {position:relative; z-index:10; margin-bottom:-35px;}
.staticHeader span {padding-top: 50%; background-size:cover; display:block;}
.staticHeader .hatching_bottom {height: 160px; position:absolute; right:0; bottom:0px; width:100%;  background-image:url(files/image/vector/hatching_o_1.svg); background-size:180%; background-repeat:no-repeat; background-position:100% top;}



/*F51 FAQ LISTING*/
.F51_faqs {border-top:1px solid #444;}
.F51_faqs li {border-bottom:1px solid #444; padding:15px 100px 15px 0; position:relative;}
.divider {display:block; margin:0px auto; border-bottom: 5px solid #ff5c00; width:100%;}
.divider.narrow {max-width: 300px;}
.F51_faq_control {position:absolute; cursor:pointer; right:10px; top:20px; width: 50px; height: 50px;}
.F51_faq_control:after {position:absolute; content:""; height: 4px; background:#000; left:0; right:0; top:23px;}
.F51_faq_control span {transition:all 0.5s ease-in-out; position:absolute; width: 4px; left: 23px; top:0; bottom:0; background:#000;}

.F51_faqlist .F51_faqs li p {display:none;}
.F51_faqlist .F51_faqs li.active .F51_faq_control span {top:23px; bottom: 23px;}

.F51_faqlist.grey_b h2 {color:#fff;}
.F51_faqlist.grey_b p {color:#fff;}
.F51_faqlist.grey_b h3 {color:#fff;}
.F51_faqlist.grey_b .F51_faqs {border-color:#fff;}
.F51_faqlist.grey_b .F51_faqs li {border-color:#fff;}
.F51_faqlist.grey_b .F51_faq_control:after {background:#fff;}
.F51_faqlist.grey_b .F51_faq_control span {background:#fff;}

#rgeWrapper  .F51_faqlist .F51_faqs li p {display:block !important;}    

@media(max-width:768px){
    .F51_faqs {padding-top: 6px;}
    .F51_faqs li {padding: 30px 80px 30px 0;}
    .F51_faq_control {right:0px; top:-27px; width: 60px; height: 40px; border-left: 20px solid #fff;}
    .F51_faq_control:after {height: 3px; top:19px;}
    .F51_faq_control span {width: 3px; left: 19px;}
    .F51_faqs li:last-child {border:none;}
    .F51_faqlist.grey_b .F51_faq_control {border-color:#1d1d1d;}
}


/*F51 FAQ Search */
.F51_faqsearch .forms {max-width: 80%; margin:0px auto; font-size:0;}
.F51_faqsearch .forms input.textbox {width:70%; display:inline-block;}
.F51_faqsearch .forms input[type="button"] {width:29%; display:inline-block; padding:20px; margin-left:-1px;}




/*PRICING BLOCK*/
.pricingBlock {position:relative; padding:22px 27px 0 27px; margin-bottom: 20px;}
.pricingBlock li {position:relative; padding-left: 50px; margin-bottom: 16px !important;}
.pricingBlock li i {background:#fff; padding-top: 11px; text-align:center; width:40px; height: 40px; position:absolute; left:0; border-radius: 40px;}
.pricingBlock ul {margin-bottom: 16px; margin-top:25px;}
.pricingBlock li {font-size: 16px !important; padding-right: 40px; line-height: 1.6 !important;}
.pricingBlock .button {position:relative; margin:0 -27px; font-size: 24px; font-weight: 400; bottom:0; padding:25px 0; left:0; right:0; display:block; margin-top: 20px;}


/*F51 Anims*/
.scrolling {position:relative;}
.showStatic {opacity:1; left:0; top:0;}

@media(min-width:768px){
.inFromLeft {left:-50px; opacity:0;}
.inFromTop {top:-50px; opacity:0;}
.inFromBottom {top:50px; opacity:0;}
.inFromRight {left:50px; opacity:0;}
}
 #rgeWrapper .inFromLeft,  #rgeWrapper .inFromRight,  #rgeWrapper .inFromTop,  #rgeWrapper .inFromBottom {opacity:1;}


/* HERO */
#intro {position:relative; padding-top: 45%;}
.intro_contain {background:url(files/image/land/videoFallback.jpg) no-repeat 50% 50% / cover; position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height: 100%; }
.intro_overlay {position:absolute;left:0;right:0;bottom:0;width:100%;}
.introLogo {width: 30%; margin:0px auto; position:relative; top:-20px; display:block;}
.introLogoC {position:absolute;left:0;top:0;width:100%;height: 100%;background:url(files/image/land/f51_logo_white.svg) no-repeat 50% 30%;background-size: 20vw;}
.stay_connected {position:relative; cursor:pointer; display:inline-block; width: 120px; height: 120px; border-radius: 120px; padding-top: 35px; line-height: 1.3; transform:scale(1.2) rotate(20deg); }
.stay_connected:after {content:""; position:absolute; background:#fff; height: 3px; border-radius:6px; left:50%; margin-left:-35px; width:70px; margin-top:10px; }
.stay_connected:hover {transform:scale(1.3) rotate(-20deg); box-shadow:20px 20px 30px rgba(0,0,0,0.3);}
@media(min-width:768px) and (max-width:960px){ #intro {padding-top:50%;} .introLogo {top:15px;} }
@media(min-width:550px) and (max-width:768px){
.intro_contain {height: 65% !important;} .introLogo {width: 40%;} #intro {padding-top: 85%;} .intro_video {padding-top: 20% !important;margin-top: -20px;} .intro_video iframe {left: -22% !important;right: -22% !important;width: 144% !important;top: 0px !important;} .intro_content{ min-height:0 px !important;  padding:0px !important; display:none; }    }
@media(max-width:481px){
 #intro {padding-top: 260%; margin-bottom:-110% !important; }
.intro_video {display:none;}
.intro_video_mobile {display:block !important;}
.intro_video_mobile iframe {left:0% !important; right:0% !important; width:100% !important; top:-25% !important; bottom:-25%  !important; height: 150% !important;}
.social i {font-size: 36px; margin-right: 8px;}
.introLogoC {background-size:35vw !important; background-position:50% 23%;}
.blend_up {display:none;} 	
}




/* OTHER */
.info_info_bg {position:relative;}
.info_info_bg>span {position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden;}
.info_info_bg>span>span {position:absolute; left:-5%; top:-5%; right:-5%; bottom:-5%; width:110%; height: 110%; background:url(files/image/land/intro_lines.svg) no-repeat 50% 50% / cover;}
.info_info_bg img {position:relative; max-width:100%;}
#intro_info {position:relative;}
#intro_info .hatching_top {position:absolute; width:50%; min-width: 320px; left:0; top:-40px; height:80px; background:url(files/image/vector/hatching_b_3.svg) no-repeat right bottom; background-size:400%; z-index:100;}
.climb_top {padding: 100px 20px;} .climb_top img {max-width:80%;}
.climb_pattern {position:absolute; left:0; top: 20px; width:50%; bottom:-20%; background:url(files/image/land/climb-pattern.svg) repeat-y fixed 10% 5% / 40%;}
.climb_dtop_pic {position:absolute; top:0; left:50%; right:0; width:50%; bottom:0; background:url(files/image/land/climb_bouldering_high.jpg) no-repeat 50% / cover;}
.climb_bottom h3 {font-size: 32px; max-width:330px; line-height:1.3; margin-bottom: 40px;}
.climb_bottom p {font-size: 18px; line-height: 1.5; margin-bottom:40px; max-width:420px;}
.climb_bottom {padding-bottom: 50px;}
.climb_pic1 {margin-top: 70px;}
.climb_bottom img {max-width:100%;}
@media(max-width:768px){
.homeSkateLogo {left:20% !important; position:relative; margin-top:-200px; margin-bottom: 100px; transform:rotate(0deg); transform-origin:50% 50%; top: auto !important; bottom: 8% !important; max-width: 240px !important;}

.leftPic.orange_b {margin:0 -30px !important;}


.container-fluid {max-width: 92%; margin:0px 4%;}
.F51_CTA .col-xs-10 {width:96%;}
}

@media(min-width:768px){
    .homeSkateLogoWrap {position:absolute; top: 50%; right:-25px;}
    .homeSkateLogo {transform:rotate(0deg); transform-origin:50% 50%; max-width: 350px; width:100%; margin-top:-155px;}
    .skateOff {transform:translatex(-450px); opacity:0.1 }
    .skateOff>img {transform:rotate(-180deg);}
}

.featureBox {padding: 0 30% 0 30%; margin:50px 0 50px 0;}
.featureBox span {background-color:#2e1f19; display:block; border-radius: 100%; padding-top:100%; position:relative; overflow:hidden;}
.featureBox span img {position:absolute; width:50%; left:25%; top:25%;}
.featureBox p {margin:0 -30px;}
@media(max-width:768px){ .featureBox {margin:20px 0 20px 0;}}

/*RGE OVERRIDE*/
#rgeWrapper .f51_slider img {max-width:300px;} #rgeWrapper .f51_slider li {display:inline-block;}

#returnHome {position:fixed; z-index:999; display:block !important; margin-top:0px; margin-bottom:-75px; width:150px; height:150px; top:0; left:0; background:#080808 url(files/image/land/f51_logo_white.svg) no-repeat 50% 50% !important; background-size:60% !important; }

#homeHide {position:fixed; top:0; left:0; width:150px; height: 150px; overflow:hidden; z-index:100;}
.homeHide {opacity:0; margin-left:-150px; margin-top:0 !important; margin-bottom:0 !important;}
.homeShow {opacity:1 !important; margin-left:0px !important;}

@media(max-width:768px){
 #topNav {padding: 15px 0 !important;}
 #navBtn {top: 7px !important;}
 #returnHome {margin-top:0px; margin-bottom:-60px; width:120px; height:120px; }   

.staticHeader {padding-top:0 !important; }
.staticHeader .col-xs-12 {padding:0px !important;}
.staticHeader span {padding-top:90%; margin-bottom:100px; width:100%;   }
.staticHeader .hatching_bottom {height: 100px; bottom: 120px; background-size: 300%; background-position:80% 100%}
.staticHeader h1 {margin-bottom:0px; position:absolute; width:100%; bottom:40px;}

}

@media(max-width:768px){
.staticHeader span {background-position:50% 50% !important;}
.forceMobCentre {background-position:50% 50% !important; background-size:cover;}
img[alt="CLIMB Logo"] {max-width:240px !important;}
.climb_pattern {width:100% !important; background: url(files/image/land/climb-pattern.svg) repeat-y fixed 20% 2% / 90% !important;}


}


#bookNowTab {position:fixed; z-index:200; top: 120px; left:0; overflow:hidden; padding:10px 10px 10px 0; height:250px;}
#bookNowTab>div {background:#ff5c00; border-radius: 6px 6px 0 0; 
 transform-origin:left bottom; transform:rotate(90deg); box-shadow: 0 4px 12px rgba(0,0,0,0.4); }
#bookNowTab>div:hover {background:#111;}
#bookNowTab>div a {color:#fff; display:block; box-shadow:inset 0 -6px 6px rgba(0,0,0,0.2); padding: 8px 20px; font-family:'anostencilregular' !important; font-size: 24px;}
#bookNowTab>div.closed {margin-left:-50px;}


@media(max-width:768px){
    .mobH2 {font-size: 40px !important; margin:0px 0 16px 0 !important; line-height:50px !important; font-family:'anostencilregular' !important; }
    .mobH3 {font-size: 27px !important; margin:0px 0 10px 0 !important; line-height:32px !important; font-family:'formularregular' !important; }
}
