
.site_width{width:var( --site_width);}
.bar{width:100%; background-color: rgba(var(--tcm),1); color:rgb(var(--tcm_text)); }
.bar a {color:rgb(var(--tcm_text))!important;}

.top_bar { top:0; height:var(--top_bar_height); overflow:hidden; position:fixed; z-index:99;}
.top_bar table{width:var(--site_width); height:var(--top_bar_height); margin:auto; font-size:1.5rem;}
.top_bar_dark { background-color:rgba(0,0,0,0.5)} /*#6D745C;*/


.bottom_bar {height:var(--bottom_bar_height); }
.bottom_bar table{height:var(--bottom_bar_height); font-size:1.5rem;}
.late_booking_button {position:absolute; font-size:1rem; width:25px; padding:2px; text-align:center; border-radius:2px; background-color:yellow;}


.top_basket {position:absolute; top:0; left:0; width:100%; line-height:var(--top_bar_height); text-align:center; vertical-align:middle;}
.top_basket_items {position:absolute; top:0; left:0; width:100%; font-weight:bold; font-size:1.6rem; line-height: 15px; z-index:2}
.top_basket_items a {color:#fff!important;}

.banner {position:relative; width:100%; height:var(--banner_height); margin-top:var(--top_bar_height); overflow:hidden;}
.banner_image{ display: flex;justify-content: center; height:var(--banner_height); overflow: hidden;}
.banner_logo {position:absolute; z-index:9;}
.banner_text{font-family:tcm_banner_text; position:absolute; color:#fff;}
.banner_text_small{font-weight:lighter;}


.search_box input[type=text] {border-radius: 3px;border: solid 1px #fff;height: 22px; color: #888;text-align: right; font-size:11pt; width: 150px; padding-top: 0;margin-right: 0px;}
.search_button {width:22px; margin-left:2px; border:2px solid #fff; border-radius:3px; display:block;}

.link {color:#788CA8;}




.title {font-weight:bold; color: rgb(var(--title));}

.header_promo {padding:5px; margin-bottom:10px; min-height:10px;  background-color: #dfdfdf; border:2px solid black; border-radius:5px; font-size:1.7rem}
.header_promo .headline {color:#fff; text-shadow:1px 1px 1px #000; animation: blinker 4s linear infinite;}
@keyframes blinker {40%{text-shadow:1px 1px 1px #000; color:#fff;}50%,90%{text-shadow:1px 1px 1px #fff; color:#000;}}



.main_menu {width:100%; height:var(--menu_height); background-color:rgba(var(--tcm),1); text-align:center;}
.main_menu .menu_block:last-child{ margin-right: 0px;} 
.main_menu .menu_block {position:relative; width:calc( calc( var(--site_width) - calc( calc( var(--menu_items) - 1 ) * 4px) ) / var(--menu_items) ); margin-right: 4px; vertical-align:top; display:inline-flex; align-items:center;} 
.main_menu .menu_block > div {position:absolute; top:0px; left:0px; width:100%;}
.main_menu .menu_block .menu_item { display:flex;height:var(--menu_height);  }

.menu_block .menu_item {height:100%; width:100%; align-items:center; vertical-align:middle;  padding-left:6px; border-style:solid; box-sizing:border-box; background-position:right; background-repeat:no-repeat; background-size:auto 100%; background-color:#777777; text-align:left; color: #fff!important;  font-weight: bold; line-height: 1.3; }

.main_menu_top .menu_block .menu_item {border-top-width:8px; border-bottom-width:2px!important;}
.main_menu_bottom .menu_block .menu_item  {border-bottom-width:8px; border-top-width:2px!important;}

.main_menu .menu_block .has_sub {position:absolute; left:0px; top:0px; width:100%; z-index:999;}

.main_menu .menu_block .sub_menu { display:none; width:100%; text-align:center; font-size:1.3rem; font-weight:normal; background-color:rgba(100,100,100,0.95); background-image:none!important; box-sizing:border-box;}
.main_menu .menu_block .sub_menu .text_menu div { border-bottom-width:2px; border-style:solid;  padding:3px; color:#fff;}

.main_menu_fixed {position:fixed; top:var(--top_bar_height); width:100%; z-index:100; height:50px!important; }
.main_menu_fixed .menu_block .menu_item  {height:50px!important;}
.main_menu_top.main_menu_fixed .menu_block .menu_item {border-top-width:2px!important; border-bottom-width:2px!important;}


.mobile_menu { position:fixed; width:100%; ;border-top:4px solid rgb(var(--tcm)); z-index:999;}
.mobile_menu .mobile_menu_inner {display:none; position:fixed; right:0; width:225px; height:calc(100vh - (var(--banner_height) + var(--top_bar_height) ) ); z-index:99; background-color:rgb(var(--tcm)); padding:2px; font-size:1.6rem; text-align:left;}
.mobile_menu .menu_block {margin:2px 0 0 2px; height:40px; width:100%; border-left-width:8px; background-color:#777; }
.mobile_menu .menu_block .has_sub {height:100%; height:100%; display:block;}
.mobile_menu .menu_block .menu_item {display:inline-grid; vertical-align:top; border-left-width:10px;}



.menu_item_reeds {border-color: rgb(var(--guided)); background-image:url('/images/site/menu/menu_reeds.png');}
.menu_item_reeds div {border-color: rgb(var(--guided));}

.menu_item_tent {border-color:  rgb(var(--overnight)); background-image:url('/images/site/menu/menu_tent.png');}

.menu_item_paddles {border-color:  rgb(var(--hire)); background-image:url('/images/site/menu/menu_paddles.png');}
.menu_item_paddles div {border-color: rgb(var(--hire));}
 
.menu_item_leaf {border-color:  rgb(var(--adventure_days)); background-image:url('/images/site/menu/menu_leaf.png');}
.menu_item_float {border-color:  rgb(var(--angling)); background-image:url('/images/site/menu/menu_float.png');}
.menu_item_fungi {border-color:  rgb(var(--fungi)); background-image:url('/images/site/menu/menu_fungi.png');}
.menu_item_steamer {border-color:  rgb(var(--paddle_steamer)); background-image:url('/images/site/menu/menu_steamer.png');}
.menu_item_lessons {border-color:  rgb(var(--lessons)); background-image:url('/images/site/menu/menu_sup.png');}
.menu_item_lessons div {border-color: rgb(var(--lessons)););}

.menu_item_fire {border-color:  rgb(var(--bushcraft)); background-image:url('/images/site/menu/menu_fire.png');}

.menu_item_trips {border-color: rgb(var(--trips)); background-image:url('/images/site/menu/menu_waddle.png');}
.menu_item_trips div {border-color: rgb(var(--trips)););}

.menu_item_xmas {border-color:  rgb(var(--xmas)); background-color:#112369; background-image:url('/images/site/menu/menu_xmas.png'); font-family: 'segoe script', arial;}
.menu_item_voucher {border-color: rgb(var(--vouchers)); background-color:#383428!important; background-image:url('/images/site/menu/menu_voucher.png');}


.popup_message_div{position:fixed; left: 50%; top: 40%; transform: translate(-50%, -50%); width:80%; max-width:500px; height:80%; max-height:500px; background-color:#fff; color:#000; border:5px solid #ddae4f; border-radius:10px; padding:30px; font-size:2rem; box-sizing:border-box; box-shadow: 0px 0px 10px #000; z-index:9999;}
.popup_message_corner {position:absolute; top:0px; right:0px; width:26px; height:26px;box-sizing:border-box; background-color:#fff;z-index:202;border-radius: 0 0 0 25px;}
.popup_message_close_div {position:absolute; top:-25px; right:-25px; width:50px; height:50px; box-sizing:border-box; border:5px solid #ddae4f; background-color:#fff; border-radius:25px; z-index:201;} 
.popup_message_close {position:absolute; cursor:pointer; top:-25px; right:-25px; width:50px; height:50px; box-sizing:border-box; border-radius:25px; z-index:203; font-size:3rem; color: #dfdfdf; text-align: center; font-weight: bold; font-family: arial; display: inline-block;} 
.popup_message_background {position:fixed; top:0; left:0px; width:100%; height:100vh; background-color:rgba(0,0,0,0.65); border:black 2px solid; z-index:9999; text-align:center;}


.popup_message h2 {text-align:center; margin-bottom:6px; font-size:2.5rem;}
.popup_message_div{padding:30px; }
.popup_message {font-size:1.9rem;}
.popup_message_image {width:300px}




.popup {position:fixed; left: 50%; transform: translateX(-50%); top:10px; text-align:left; background-color:white; display:none; min-width:200px; max-width:98vw; border-radius:10px; overflow:hidden; z-index:10000; box-shadow:2px 2px 5px #000;}
.popup_background {position:fixed; top:0; left:0px; width:100%; height:100vh; background-color:rgba(0,0,0,0.65); border:black 2px solid; z-index:9999; display:none; text-align:center;}
.popup_close {position:absolute; right:5px; top:5px; font-size:14px; color:#888; cursor:pointer; width:22px; height:22px; border-radius:11px; background-color:#ddd; text-align: center;font-weight: bold;line-height: 17px;border: 2px solid #aaa;box-sizing: border-box; z-index:9;}
.popup_logo {position:absolute; left:0px; top:0px; width:100%; padding:5px; background-color:rgba(230,230,230,0.65); height:65px; box-sizing:border-box; box-shadow:0 2px 2px 0px #000;}
.popup_content {text-align:left; overflow-y:auto; height:100%; width:100%; margin-top:65px; box-sizing:border-box;}

.page_content {min-height:calc(100vh - calc( (var(--top_bar_height) + var(--bottom_bar_height)) + var(--banner_height) + (2 * var(--menu_height))) ); width:var(--site_width); box-sizing:border-box; margin:auto;}
.page_content p {margin-bottom:12px;}
.page_content a {color:#788CA8;}
.ul_list, .itinerary ul, .faqs ul{list-style-type:disc; list-style-position: outside; margin-bottom:10px;}
.ol_list {list-style-type:decimal; list-style-position: outside; margin-bottom:10px;}
.ul_list li, .ol_list li, .itinerary li, .faqs li {margin-left:30px; margin-bottom:3px;}




.terms_box {border:1px solid #cfcfcf; background-color:#efefef; padding:10px; font-size:1.4rem; margin-bottom:10px;}
.terms_box .title {font-size:1.8rem; font-weight:bold; color: rgb(var(--title)); padding-bottom:3px; border-bottom:1px solid #cfcfcf; margin-bottom:10px;}
.terms_box .footnote {font-size:1rem; text-align:right; margin-top:5px; }

.review {padding:20px; font-size:smaller; background-color:#dfdfdf; margin:20px; font-style: italic;}
.review p:last-of-type {text-align:right;}
.itinerary {padding:20px; font-size:smaller;  margin:20px; background-color:rgb(250,249,235);}
.standout {padding:20px; margin:20px; border:2px solid #888; border-radius:5px; background-color:rgb(242,241,148);}




.booking_table {border:3px solid #efefef;}
.booking_table td  {border-bottom:3px solid #efefef;}

.basket_section > tbody  > tr:last-child  > td > hr {display:none;} 


.hire_matrix_tabbed_box{min-height: 500px; max-width:500px; margin:0 auto;}
.hire_matrix_tabbed_box > .tabs {height: 25px; font-size:1.2rem}
.hire_matrix_tabbed_box > .tabs > .tab {padding: 5px;}
.hire_matrix_tabbed_box > .open_tab {padding:0 10px 10px 10px ;height: calc(100% - 25px);}

.hires_booking_form  {max-width:100%; min-width:250px;}

.flexpass {color:#2f4f4f; background-color: #f0e68c; padding:3px 0px 3px 3px; display:flex; text-align:left;}

.notice {border-width:3px; border-style:solid; background-color:#efefef; border-radius:10px; box-sizing:border-box;}
.notice img {border-radius: 8px 0 0 8px; }
.hire .notice {border-color: rgb(var(--hire));}

.youtube {width:100%; max-width:600px; height:calc(attr(width) / 1.77); aspect-ratio:1.777}



.move_booking_title {position:absolute; top:40px; width:100%; text-align:center; font-size:1.5rem;font-weight:bold;}
.move_time {display:inline-block; margin:5px; font-size:1.3rem; padding:2px; background-color:#dfdfdf; border-radius:3px;}
.move_time.light_grey.hire_slot {display:none;}
.move_time.in_basket {background-color:#444; color:#fff!important;}

.move_session_list {border-collapse: separate;}
.move_session_list > tbody > tr:nth-child(odd) {background-color:#dfdfdf;}
.move_session_list > tbody > tr:nth-child(even) {background-color:#fff;} 
.move_session_list > tbody > tr > th {border-top: 2px solid #888; border-bottom: 1px solid #888; background-color: #f5f5f5; font-weight:bold; box-sizing:border-box;border-collapse: unset;}


.faq {font-size:1.8rem; margin-bottom:10px; padding-bottom:10px; border-bottom:2px solid #dfdfdf;}


@keyframes fadeIt {  
  0%   { background-color: rgba(var(--tcm),1);}  
  25%   { background-color: rgba(var(--tcm),1);}
  100% { background-color: rgba(var(--tcm),0);}
}

.greenFade{ background-image:none !important;  animation: fadeIt 1s ease-in;}


/* desktop */
#desktops{}
@media screen and (min-width : 1024px)
{
.not_for_desktop {display:none!important;}   
.for_phones {display:none!important;}
.for_tablets {display:none!important;}

.banner_text{left:75px; bottom:10px;}
.banner_text_small{text-align:center; display:inline-block; margin-right:10px;}
.banner_text_large{text-align:left; display:inline-block; margin-right:10px}
.bottom_bar table{width:calc( var(--site_width) - 30px ); margin-right:30px; text-align:right;}
.photo_menu {font-size:28px;}
.photo_menu_item {width:calc((100% / 3) - 10px);} 
.page_content{font-size:1.8rem;} 
h1 {font-size:2.6rem;}
h2 {font-size:2.4rem;}
h3 {font-size:2.2rem;}
.drop_item_left {width:calc(100% - 500px);} 
.drop_item_right {width:500px;} 
}




/* desktop & landscape tablets*/
#portrait_tablets_and_up{}
@media screen and (min-width : 801px)
{
:root {
  --banner_height: 200px;
  --menu_height: 78px;  
  --bottom_bar_height:48px;  
  --top_bar_height:32px;
}
.not_for_desktop {display:none!important;}
.for_portrait_phones {display:none!important;}
.late_booking_button {top:5px; right:5px;} 
.bottom_bar table{width:calc( var(--site_width) - 30px ); margin-right:30px; text-align:right;} 

.responsive_25 {width:25%;}
.responsive_33 {width:calc(100%/ 3)} 
.responsive_50 {width:50%;}
.responsive_66 {width:calc((100%/ 3) *2);}
.responsive_75 {width:75%;}

.has_voucher {top:-18px; right:-4px; width:100px;}

}





/* phones/tablets */
#landscape_tablets_and_down{}
@media screen and (max-width : 1023px)
{
.not_for_tablets {display:none!important;}
.splash_text_small {font-size:4vw; line-height:4vw;} 
.splash_text_medium {font-size:5vw; line-height:5vw;}
.splash_text_large {font-size:7.5vw; line-height:7.5vw;}

}



/* landscape phones/portrait tablets */
#portrait_tablets_and_down{}
@media screen and (max-width : 800px)
{

:root {
  --site_width: 100%;
  --menu_height: 2px;
  --bottom_bar_height:45px; 
  --top_bar_height:40px;
}
       
.for_desktop {display:none!important;}
.fix_top_margin {margin-top: calc(var(--banner_height) + var(--top_bar_height));}
.banner {position:fixed; z-index:99; top:0;}
.mobile_menu_button {position:absolute; background-color:rgba(0,0,0,0.4); padding:3px; border-radius:5px; right:5px; bottom:5px;}    
.for_phones {display:none!important;}  
.not_for_portrait_tablets {display:none!important;}

.bottom_bar table{width:100%; text-align:center;}
.late_booking_button {top:5px; right:5px;} 
.page_content {padding:5px;}
.responsive {width:100%;}
.responsive_50 {width:100%;}
.has_voucher {top:-15px; right:-4px; width:85px;}
.drop_item_left {width:100%;}
.drop_item_right {width:100%;}  
    }







/* Over 1800px wide */
#over_1800{}
@media screen and (min-width : 1800px){   
:root {
  --site_width: 1200px;
 
}

.banner_logo {width:420px; bottom:20px; right:75px;}
.banner_text_small{font-size:5rem;}
.banner_text_large{ font-size:8rem;}
.main_menu .menu_item {font-size:1.6rem;}
/*splah_text clases in shared*/
    }


/* Over 1200px and 1799px wide */
#over_1200_under_1799{}
@media screen and (min-width : 1200px) and (max-width : 1799px){
:root {
  --site_width: 1200px;
}
.banner_logo {width:380px; bottom:20px; right:75px;}
.banner_text_small{font-size:5rem;}
.banner_text_large{ font-size:8rem;}
.main_menu .menu_item {font-size:1.6rem;}
.splash_text_small {font-size:5rem; line-height:5rem;}
.splash_text_medium {font-size:7rem; line-height:7rem;}
.splash_text_large {font-size:9rem; line-height:9rem;} 

    
    }
    
    
/* Over 1024px and 1199px wide */
#over_1024_under_1199{}    
@media screen and (min-width : 1024px) and (max-width : 1199px){
:root {
  --site_width: 1024px;
}

.banner_logo {width:280px; top:20px; right:50px;}
.banner_text_small{font-size:3rem;}
.banner_text_large{ font-size:6rem;}
.main_menu .menu_item {font-size:1.5rem;}
.splash_text_small {font-size:4vw; line-height:4vw} 
.splash_text_medium {font-size:5.5vw; line-height:5.5ve}
.splash_text_large {font-size:8vw; line-height:8vw}
    }


/* Over 800px and 1023px wide */
#over_801_under_1023{}   
@media screen and (min-width : 801px) and (max-width : 1023px)
{
:root {
  --site_width: 800px; 
}
.photo_menu {font-size:26px;}
.photo_menu_item {width:calc((100% / 2) - 10px);}  
.for_phones {display:none!important;}  
.not_for_landscape_tablets {display:none!important;}
.banner_logo {width:250px; top:20px; right:50px;}
.banner_text{left:50px; bottom:30px;}
.banner_text_small{font-size:4rem; line-height:4rem; margin-left:10px}
.banner_text_large{font-size:6rem; line-height:6rem;}
.menu_item {font-size:1.2rem;}
.bottom_bar table{width:calc( var(--site_width) - 30px ); margin-right:30px; text-align:right;} 
.page_content{font-size:1.6rem;}  
h1 {font-size:2.2rem;}
h2 {font-size:2.0rem;}
h3 {font-size:1.8rem;}
.drop_item_left {width:calc(100% - 450px);} 
.drop_item_right {width:450px;} 
    }   


/* Between 551px and 800px wide */
#over_550_under_800{}   
@media screen and (min-width : 550px) and (max-width : 800px)
{
    
:root {
  --banner_height: 120px;  
}        
.for_portrait_phones {display:none!important;}     
.banner_logo {width:175px; top:10px; left:15px;}
.banner_text{left:30px; bottom:5px;}
.banner_text_small{display:inline-block; font-size:3rem; line-height:3rem; margin-right:6px}
.banner_text_large{display:inline-block; font-size:4.5rem; line-height:4.5rem;}

.mobile_menu_button {width:50px;}
.photo_menu {font-size:24px;}
.photo_menu_item {width:calc((100% / 2) - 10px); max-width:350px;} 
.page_content{font-size:1.9rem;} 

h1 {font-size:2rem;}
h2 {font-size:1.9rem;}
h3 {font-size:1.8rem;}

.inline_images.large_images > div {width:80%; max-width:800px;}
.inline_images.medium_images > div {width:40%; max-width:600px;}
.inline_images.small_images > div {width:30%;  min-width:200px; max-width:400px;}
.inline_images.very_small_images > div {width:30%; min-width:200px; max-width:300px;}
.framed_images img {padding:10px;}


.images.large > div {width:80%; max-width:800px;}
.images.medium > div {width:40%; max-width:600px;}
.images.small > div {width:30%;  min-width:200px; max-width:400px;}
.images.very_small > div {width:30%; min-width:200px; max-width:300px;}
.framed img {padding:10px;}



}  


/* Over 441px and 549px wide */
#over_440_under_549{}   
@media screen and (min-width : 441px) and (max-width : 549px)
{
:root {
  --banner_height: 100px;  
}
.for_portrait_phones {display:none!important;} 
.banner_logo {width:120px; top:20px; left:10px;}
.banner_text{left:30px; bottom:5px;}
.banner_text_small{display:inline-block; font-size:2rem; line-height:2rem; margin-right:6px}
.banner_text_large{display:inline-block; font-size:3rem; line-height:3rem;}

.mobile_menu_button {width:50px;}
.photo_menu {font-size:4vw;}
.photo_menu_item {width:calc((100% / 2) - 10px); max-width:300px;} 
.page_content{font-size:1.5rem;} 
h1 {font-size:1.8rem;}
h2 {font-size:1.7rem;}
h3 {font-size:1.6rem;}

.inline_images.large_images > div {width:80%; max-width:800px;}
.inline_images.medium_images > div {width:60%; max-width:600px;}
.inline_images.small_images > div {width:40%;  min-width:200px; max-width:400px;}
.inline_images.very_small_images > div {width:30%; min-width:200px; max-width:300px;}
.framed_images img {padding:10px;}

.images.large > div {width:80%; max-width:800px;}
.images.medium > div {width:60%; max-width:600px;}
.images.small > div {width:40%;  min-width:200px; max-width:400px;}
.images.very_small > div {width:30%; min-width:200px; max-width:300px;}
.framed img {padding:10px;}

    }


#over550{}
@media screen and (min-width : 551px)
{
.popup {max-height:95vh;}
}    




/* Under 550px */
#under_550{}   
@media screen and (max-width : 550px)
{
.popup {height:95vh;}
.guided_move_date {width:95px;}


}





#over440{}
@media screen and (min-width : 441px)
{
.participants_form {width:420px;} 
.hire_matrix th {font-size:1.1rem;}  
.hires_booking_form .session_details {display: flex;}
.hires_booking_form .session_details > div:first-of-type {display:inline-block; flex-grow: 1; width: 1px;} 
.hires_booking_form .session_details > div:first-of-type {display:inline-block; width:150px; } 
.phone_min_width {min-width:290px;}
}    








/* Under 440px */
#under_440{}   
@media screen and (max-width : 440px)
{
:root {
  --banner_height: 50px;      
}
.not_for_portrait_phones {display:none!important;}        
.banner_logo {width:70vw; max-width:125px; bottom:0px; left:10px;}
.banner_fixed .banner_logo {max-width:100px!important; top:10px;}

.mobile_menu_button {width:30px};
.photo_menu {font-size:8vw;}
.photo_menu_item {width:calc((100%) - 10px);  max-width:350px;} 
.page_content{font-size:1.5rem;} 
h1 {font-size:1.7rem;}
h2 {font-size:1.6rem;}
h3 {font-size:1.5rem;}

.inline_images.large_images > div {width:80%; max-width:300px;}
.inline_images.medium_images > div {width:80%; max-width:300px;}
.inline_images.small_images > div {width:80%; max-width:300px;}
.inline_images.very_small_images > div {width:80%; max-width:300px;}
.framed_images img {padding:10px;}

.images.large > div {width:80%; max-width:300px;}
.images.medium > div {width:80%; max-width:300px;}
.images.small > div {width:80%; max-width:300px;}
.images.very_small > div {width:80%; max-width:300px;}
.frames img {padding:10px;}


.phone_min_width {width:290px;}
.participants_form {width:290px;}
.basket_item, .basket_options {font-size:1.3rem;}
.basket_adjust.plus {line-height:18px!important;}
.basket_adjust.minus {line-height:20px!important;}
.hire_matrix th {font-size:0.9rem;} 
.hires_booking_form .session_details > div {width:100%; text-align:left!important;}
}



