/* Ba Styleguide Colors */
/* #3B5772;  ba corp navy */
/* #45AEB1;  ba corp green-blue */
/* #81BF8C;	 ba be green */
/* #D8C096;  ba meta brown */
/* #6CBBE3;  ba wd blue */
/* #E79594;  ba gds red */
/* #F9D776;  ba dm yellow */
/* #F1C1BB;  ba bi pink */ 
/* #9AADD0;  ba cm blue */ 
/* #2D2926;  ba subtle black */
/* #606566;  ba dark grey */
/* #999999;  ba medium grey */
/* #DDDDDD;  ba light grey */
/* #DBDFE1;  ba bluegrey */
/* #E9E9E9;  ba subtle grey hover */
/* #F9F9F9;  ba subtle grey */
/* #E8E264;  ba warning yellow */
/* #D24D57;  ba error red */
/* #FE0202;  ba alert red */
/* #F1742D;  ba hilite orange */


@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;700;900&display=swap');

html, body {
    overflow-x: hidden;
    height: 100%;
}
body {
    background: #fff;
    padding: 0;
    margin: 0;
    font-family: 'Roboto', Arial, sans-serif;
    font-size:14px;
    font-weight:300;
    letter-spacing:-0.01em;
}




/* Main Content Container */
#BaXcontainer {
	margin-left:72px;
	margin-top:140px
}

.advert {
	font-weight:900;
	color:#D24D57;  /* ba error red */
}


/* App Identifier Bar */
.BaXApp, 
.BaXApp-be,
.BaXApp-meta,
.BaXApp-wd,
.BaXApp-gds,
.BaXApp-dm,
.BaXApp-bi,
.BaXApp-cm {
	display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-image: linear-gradient(to right, #45AEB1, #45AEB1, #3B5772);
    position: fixed;
    top:68px;
    height: 8px!important;
    overflow: hidden;
    z-index: 1;
}
.BaXApp-be   {background-image: linear-gradient(to right, #81BF8C, #81BF8C, #3B5772);}
.BaXApp-meta {background-image: linear-gradient(to right, #D8C096, #D8C096, #3B5772);}
.BaXApp-wd   {background-image: linear-gradient(to right, #6CBBE3, #6CBBE3, #3B5772);}
.BaXApp-gds  {background-image: linear-gradient(to right, #E79594, #E79594, #3B5772);}
.BaXApp-dm   {background-image: linear-gradient(to right, #F9D776, #F9D776, #3B5772);}
.BaXApp-bi   {background-image: linear-gradient(to right, #F1C1BB, #F1C1BB, #3B5772);}
.BaXApp-cm   {background-image: linear-gradient(to right, #9AADD0, #9AADD0, #3B5772);}




/* Main Header Bar */
.BaXheader {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-color: #3B5772; /* ba navy */
    background-image: url('/hotel_admin/images/bg-topbar.png#2');
    opacity: 0.99;
    background-position: 50px 0px;
    position: fixed;
    height: 70px!important;
    overflow: hidden;
    z-index: 1;
}
.BaXheaderTitle p, 
.BaXsidebarTitle p{
    clear:both;
    font-family: 'Montserrat', Arial, sans-serif;
    font-weight: 900;
    letter-spacing:-0.005em;
    display: block;
    font-size: 24px;
    color: #F9F9F9; /* ba subtle grey */
    position: fixed;
    left:210px;
    top:-1px;
    z-index:2;
}

.BaXsidebarTitle p:before {
	content:'';
}

/* Hide title on screens that are 600px wide or less */
@media screen and (max-width: 600px) {
.BaXheaderTitle,
.BaXsidebarTitle {
	height:60px;
	width:120px;
	background-image: url('/hotel_admin/images/icon-ba-2021.png');
	background-size: 40px 40px;
	background-repeat: no-repeat;
	background-position-x: 60px;
	position: fixed;
    left:10px;
    top:15px;
    z-index:2;
}
.BaXheaderTitle p,
.BaXsidebarTitle p,
.BaXheaderTitle img,
.BaXsidebarTitle img{
    display: none;
	}
}

.BaXsidebarTitle p {
	color: #3B5772; /* ba navy */
	z-index:3;
}
.BaXmain {
    margin: 0 auto;
    display: block;
    height: 100%;
    margin-top: 60px;
}
.BaXmainInner{
    display: table;
    height: 100%;
    width: 100%;
    text-align: center;
}
.BaXmainInner div{
    display:table-cell;
    vertical-align: middle;
    font-size: 3em;
    font-weight: bold;
    letter-spacing: 1.25px;
}

#BaXfooter{
 	color:#f9f9f9;
 	position: absolute;
 	bottom:50px;
 	left:70px;
    z-index: 2;
 }
#BaXfooter a {
 	text-decoration:none;
 	color:#dddddd;
 }

/* Top Menu Bar */
#BaXtopmenuBar {
}
.BaXtopmenubarInner {
    position:absolute;
    right:0;
    top:25px;
    margin:0;
    padding:0;
    z-index: 2;
}
.BaXtopmenubarInner li{
    text-transform:capitalize;
    list-style: none;
    display:inline;
    color: #DDDDDD;  /* ba light grey */
	font-size:13px;
	font-weight:400;
    padding: 20px;
    cursor: default;
    z-index: 2;
}
.BaXtopmenubarInner li a{
    color: #DDDDDD;  /* ba light grey */
    cursor: pointer;
    text-decoration: none;
}
.BaXtopmenubarInner li a:hover{
    color: #FFFFFF;  
    cursor: pointer;
}
.BaXtopmenubarInner li:last-child {
	padding-right:50px;
}

/* Reduce right menu padding on screens that are 600px wide or less */
@media screen and (max-width: 600px) {
.BaXtopmenubarInner li:last-child {
	padding-right:20px;
}
}
.BaXtopmenubarInner li ul {
  	display:none;
 	visibility:hidden;
 	clear:both;
  	margin:0;
  	padding:0;
  	padding-top:10px;
  	padding-bottom:15px;
  	min-width:150px;
  	border-radius: 8px;
  	background-color: #DDDDDD;  /* ba light grey */
  	opacity:0.97;
  	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.08), 0 0 20px 0 rgba(0, 0, 0, 0.04);
  	margin-top: 7px;
  	position: absolute;
  	right:50px;
  	top:40px;
    transition: all 0.3s ease;
}
.BaXtopmenubarInner li ul li:hover, 
.BaXtopmenubarInner li ul li:focus-within{
    background-color: #E9E9E9;  
    cursor: pointer;
}
.BaXtopmenubarInner li ul li,
.BaXtopmenubarInner li ul li a{
    font-weight:400;
    color: #3B5772;  /* ba navy */
    cursor: pointer;
    text-decoration: none;
}
.BaXtopmenubarInner li ul li {
  	clear:both;
  	min-width:150px;
  	padding-right:50px;
  	transition: all 0.3s ease;
}
.BaXtopmenubarInner li ul li:hover > ul,
.BaXtopmenubarInner li ul li:focus-within > ul,
.BaXtopmenubarInner li ul li ul:hover,
.BaXtopmenubarInner li ul li ul:focus {
  	visibility: visible;
  	opacity: 0.97;
  	display: block
}





/* Sub Menu Bar */
#BaXsubmenuBar {
    position:absolute;
    top:76px;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-color: #DDDDDD;  /* ba light grey */
    height: 30px!important;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.08), 0 0 20px 0 rgba(0, 0, 0, 0.04);
}
.BaXsubmenubarInner {
    list-style: none;
    position:absolute;
    top:76px;
    margin:0;
    padding:0;
    padding-left:60px;
    padding-top:1px;
    z-index: 1;
}
.BaXsubmenubarInner li {
    text-transform:capitalize;
	display: inline;
  	float: left;
    color: #3B5772;  /* ba navy */
	font-size:13px;
    padding: 7px 12px 7px 12px;
    cursor: pointer;
    z-index: 2;
    transition: all 0.3s ease;
}
.BaXsubmenubarInner li ul {
  	display:none;
 	clear:both;
  	visibility:hidden;
  	margin:0;
  	padding:0;
  	padding-top:10px;
  	padding-bottom:15px;
  	margin-left:-12px;
  	min-width:150px;
  	border-radius: 0 0 8px 8px;
  	background-color: #DDDDDD;  /* ba light grey */
  	opacity:0.97;
  	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.08), 0 0 20px 0 rgba(0, 0, 0, 0.04);
  	margin-top: 7px;
  	position: absolute;
    transition: all 0.3s ease;
}
.BaXsubmenubarInner li:hover, 
.BaXsubmenubarInner li:focus-within{
    background-color: #E9E9E9;  
    cursor: pointer;
}
.BaXsubmenubarInner li a{
    font-weight:400;
    color: #3B5772;  /* ba navy */
    cursor: pointer;
    text-decoration: none;
}
.BaXsubmenubarInner li ul li {
  	clear:both;
  	min-width:150px;
  	padding-right:50px;
  	transition: all 0.3s ease;
}
.BaXsubmenubarInner li:hover > ul,
.BaXsubmenubarInner li:focus-within > ul,
.BaXsubmenubarInner li ul:hover,
.BaXsubmenubarInner li ul:focus {
  	visibility: visible;
  	opacity: 0.97;
  	display: block
}
ul.BaXsubmenubarInner li ul li {
  clear: both;
}



/* Sub Menu Divider */
.BaXdivider {}
.BaXdivider:hover {
    cursor: default!important;
    background-color: #DDDDDD!important; 
}




/* Sidebar Component */
#BaXsidebarMenu {
    font-family: 'Roboto', Arial, sans-serif;
    height: 100%;
    position: fixed;
    left: 0;
    width: 425px;
    margin-top: 0px; /* match top bar */
    transform: translateX(-375px);
    transition: transform 200ms ease-in-out;
    background-image: url('/hotel_admin/images/bg-sidebarMenu-trans.png#2');
    opacity: 0.99;
    background-position: top 0px left -75px;
	z-index: 3;
}

/* Narrower menu on screens that are 600px wide or less */
@media screen and (max-width: 600px) {
#BaXsidebarMenu {
    width: 375px;
    transform: translateX(-325px);
    transition: transform 200ms ease-in-out;
    background-position: top 0px left -125px;
}
}

/* Sidebar title and system title */
.BaXsidebarTitle p::before {
	content:'Portal'
}

.BaXsidebarMenuInner {
    margin:0;
    padding:0;
    padding-top:100px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}
.BaXsidebarMenuInner li {
    text-transform:capitalize;
    list-style: none;
    color: #3B5772;  /* ba navy */
    font-family: 'Roboto', sans-serif;
	font-size:15px;
    padding: 8px 70px;
    width:150px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.BaXsidebarMenuInner li:hover{
    background-color: #E9E9E9;  /* ba subtle grey hover */
    cursor: pointer;
}
.BaXsidebarMenuInner li a{
    color: #3B5772;  /* ba navy */
    cursor: pointer;
    font-weight: 400;
    text-decoration: none;
}

input[type="checkbox"]:checked ~ #BaXsidebarMenu {
    transform: translateX(0);
}
input[type=checkbox] {
    transition: all 0.3s;
    box-sizing: border-box;
    display: none;
}
.BaXsidebarIconToggle {
    transition: all 0.3s;
    box-sizing: border-box;
    cursor: pointer;
    position: absolute;
    z-index: 99;
    height: 100%;
    width: 100%;
    top: 28px;
    left: 12px;
    height: 22px;
    width: 22px;
}
.BaXspinner {
    transition: all 0.3s;
    box-sizing: border-box;
    position: absolute;
    height: 3px;
    width: 100%;
    background-color: #3B5772;  /* ba navy */
}
.BaXhorizontal {
    transition: all 0.3s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 3px;
}
.BaXdiagonal.part-1 {
    position: relative;
    transition: all 0.3s;
    box-sizing: border-box;
    float: left;
}
.BaXdiagonal.part-2 {
    transition: all 0.3s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 3px;
}
input[type=checkbox]:checked ~ .BaXsidebarIconToggle > .BaXhorizontal {
    transition: all 0.3s;
    box-sizing: border-box;
    opacity: 0;
}
input[type=checkbox]:checked ~ .BaXsidebarIconToggle > .BaXdiagonal.part-1 {
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 8px;
}
input[type=checkbox]:checked ~ .BaXsidebarIconToggle > .BaXdiagonal.part-2 {
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -9px;
}

/* Sidebar Compnent dots */
.BaXdot, 
.BaXdot-navy, 
.BaXdot-be, 
.BaXdot-bi, 
.BaXdot-cm, 
.BaXdot-dm, 
.BaXdot-gds, 
.BaXdot-meta, 
.BaXdot-wd, 
.BaXdot-white {
	display: inline;
    font-size: 0px;
    background-color:#45AEB1;  /* ba corp green-blue */
    border-radius: 5px;
    padding: 5px;
    margin-right: 5px;
    position: relative;
    bottom: 5px;
}
.BaXdot-navy  {background-color:#3B5772;  /* ba corp navy */}
.BaXdot-be    {background-color:#81BF8C;  /* ba be green */}
.BaXdot-meta  {background-color:#D8C096;  /* ba meta brown */}
.BaXdot-wd    {background-color:#6CBBE3;  /* ba wd blue */}
.BaXdot-gds   {background-color:#E79594;  /* ba gds red */}
.BaXdot-dm    {background-color:#F9D776;  /* ba dm yellow */}
.BaXdot-bi    {background-color:#F1C1BB;  /* ba bi pink */ }
.BaXdot-cm    {background-color:#9AADD0;  /* ba cm blue */ }
.BaXdot-white {background-color:#ffffff;}



/* Logo */
.BaXBaLogo {
	position: absolute;
	top:26px;
	left:72px;
	width:131px;
	z-index:1;
}

@media screen and (max-width: 850px) {
.BaXlogo,
.BaXlogoInv {
	display:none;
	}
}





/* Icons */
.BaXiconLogout {
	padding-right:5px;
	background-image: url('/hotel_admin/images/icon-logout.png') ;
	background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 0 18px;
    display: inline-block;
    width: 16px; 
    height: 16px;
    content:"";
}
.BaXiconUser {
	padding-right:5px;
	background-image: url('/hotel_admin/images/icon-profile.png') ;
	background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 0 18px;
    display: inline-block;
    width: 16px; 
    height: 16px;
    content:"";
}
.BaXiconProperty a{
	border-radius: 5px;
	border: 1px solid #DDDDDD;  /* ba light grey */
	padding: 5px 8px;
    font-weight:300;
  	display:inline-block;
  	text-align:center;
}
.BaXiconLang {
	padding-right:5px;
	background-image: url('/hotel_admin/images/icon-lang.png') ;
	background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 0 18px;
    display: inline-block;
    width: 16px; 
    height: 16px;
    content:"";
}
.BaXiconLocation {
	padding-right:5px;
	background-image: url('/hotel_admin/images/icon-location.png') ;
	background-repeat: no-repeat;
    background-size: 15px 15px;
    background-position: 0 19px;
    display: inline-block;
    width: 16px; 
    height: 16px;
    content:"";
}
.BaXiconDivider{
	font-weight:200!important;
	padding-left:0!important;
}
.BaXiconDivider:hover {
    cursor: default!important;
}

@media screen and (max-width: 600px) {
li.BaXiconUser,
li.BaXiconLang,
li.BaXiconLocation,
li.BaXiconDivider	{
	display:none;
	}
}
@media screen and (max-width: 750px) {
li.BaXiconLang,
li.BaXiconDivider	{
	display:none;
	}
}


/* Login, Logout Page Styles */
.BaXloginBody,
.BaXlogoutBody,
.BaXloginBG,
.BaXlogoutBG  {
	min-width:1000px;
	background-color: #3B5772;  /* ba corp navy */  
	background-image: url('/hotel_admin/images/bg-logout.jpg');
	background-position-y: 60%;
	background-repeat: repeat-x;
}
.BaXloginBG,
.BaXlogoutBG {
  	height: 100vh;
  	background: linear-gradient(84deg, rgba(58,87,114,0.5) 70%, #DBDFE1 30%);    
}
#BaXloginContainer,
#BaXlogoutContainer {
	padding: 0 60px;
}
.BaXloginInner,
.BaXlogoutInner {
	clear:both;
	margin: auto;
	position:fixed;
	top:45%;
	left:50%;
	transform: translate(-50%, -50%);
	text-align:center;
	padding: 0 60px;
}
.BaXloginbigButton,
.BaXlogoutbigButton{
	padding:20px;
}
.BaXloginbigButton a,
.BaXlogoutbigButton a{
	text-transform: uppercase;
	text-decoration:none;
	white-space: nowrap;
	font-size:14px;
	font-weight:900;
	color: #F9F9F9;  /* ba subtle grey */
	background-color: #45AEB1;  /* ba corp green-blue */
	border-radius: 25px;
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1), 0 0 20px 0 rgba(0, 0, 0, 0.05);
	padding: 15px 30px;
}
.BaXloginbigButton a:hover,
.BaXlogoutbigButton a:hover{
	color: #ffffff;  /* ba subtle grey */
	background-color: #6CBBE3;  /* ba wd blue */
}
.BaXloginTracking,
.BaXlogoutTracking {
  	position: fixed;
  	width: 100%;
  	bottom: 0px;
  	height:50px;
  	background-color: #E8E264;  /* ba warning yellow */
  	transition: all 0.9s ease;
}
/*
.BaXloginInner input[type=text], select {
	width: 80%;
	padding: 12px 20px;
  	margin: 8px 0;
  	display: inline-block;
  	border: 1px solid #ccc;
  	border-radius: 4px;
  	box-sizing: border-box;
}
*/
.BaXloginInner h1, h2 {
	font-family: 'Montserrat', Arial, sans-serif;
    font-size:180%;
    font-weight:900;
    letter-spacing:-0.01em;
    color:#F9F9F9;	
}
.BaXloginInner h2 {
    font-size:120%;
}
.BaXloginInner p,
.BaXlogoutInner p{
	color: #F9F9F9;  /* ba subtle grey */
}



/* stickers */
.BaXsticker, 
.BaXsticker-green, 
.BaXsticker-red,
.BaXsticker-orange,
.BaXsticker-notify  {
	display: inline;
	text-transform: uppercase;
	font-family: 'Montserrat', Arial, sans-serif;
    font-weight: normal;
    letter-spacing:-0.005em;
    font-size: 9px;
    color: #fff;
    background-color:#F1742D;  /* ba hilite orange */
    border-radius: 5px;
    padding: 2px 4px;
    margin-left:5px;
    position: relative;
    bottom: 1px;
}
.BaXsticker-green {
    background-color:#45AEB1;  /* ba corp green-blue */
}
.BaXsticker-red {
    background-color:#FE0202;  /* ba alert red */
}
.BaXsticker-orange {
    background-color:#F1742D;  /* ba alert red */
}
.BaXsticker-shift {
    position: relative;
    bottom: 7px;
}
.BaXsticker-notify {
	font-family: 'Roboto', Arial, sans-serif;	
	border-radius: 8px;
    background-color:#FE0202;  /* ba alert red */
    bottom: 2px;
}
.BaXsticker-sm {
    font-size:7px;
    font-weight:400;
    border-radius: 3px;
    padding: 1px 2px;
    position: relative;
    bottom: 7px;
}
.BaXsticker2 {
	display: inline;
	text-transform: uppercase;
	font-family: 'Montserrat', Arial, sans-serif;
    font-weight: 600;
    letter-spacing:-0.005em;
    font-size: 9px;
    color: #F1742D;
    margin-left:5px;
    position: relative;
    bottom: 7px;
}




