/* device width adjustments, based on default of 320px wide.  something that looked good at 16px on device 320 wide would be 16/320, or 5vw (5 percent of width). */
/* list page elements */
.ui-li-heading { font-size: 5vw; }  /* default 16px */
.ui-li-desc { font-size: 3.75vw; }  /* default 12px */

/* when the device reaches 375 wide, or the larger iphone display width, then cap the sizes at what the scaled size would be, based on above vw units. */
@media all and (min-width: 375px) {
	.ui-li-heading { font-size: 19px; }  /* 375 x .05 = 18.75, or 19 rounded */
	.ui-li-desc { font-size: 14px; }  /* 375 x .0375 = 14.06, or 14 rounded */
}


@font-face {
	font-family: HelveticaNow;
	src: url("../../fonts/HelveticaNow/HelveticaNowText.ttf");
  }

@font-face {
	font-family: myFirHelveticaNowtFont;
	src: url("../../fonts/HelveticaNow/HelveticaNowTextBold.ttf");
	font-weight: bold;
  }

#login-header {
	xbackground: url(../../images/1FS-hdr-background-login.png);
	background-position: 0px 0px; 
	background-repeat: repeat-x;
	xheight: 62px;
	height: 0px;
	border-bottom: 0px;
	padding-top: 6px;
}

#login-header h1 { 
	font-size:22px; 
	text-shadow: none;
	font-weight: normal;
	color: rgb(10,87,140);
	padding-top: 11px;
	margin-left: 100px;
	margin-bottom: 0; 
	text-transform: none;
	text-align:left;
	font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
	font-variant: small-caps;
}

#home-header { 
	background: url(../../images/1FS-hdr-background3a.png);
	background-position: left bottom;
	background-repeat: repeat-x;
	height: 12vw;
	max-height: 50px;
	border-bottom:0px;
	padding:0px;margin:0px;
	background-color:white;
}


#home-header-playing { 
	height: 13vw;
	max-height: 50px;
	padding:0px;margin:0px;
}

.app-header-playing {
	background-image: linear-gradient(#ffffff,#ffffff);
	xbackground-color:white !important;
	border-bottom: 3px solid #ffcb00;
}



#home-header h1 { 
	color: rgb(10,87,140);
	text-shadow: none;
	xfont-size:16px; 
	xpadding-top:12px;
	xfont-weight:normal;
	
	padding-top:9px;
	xfont-size: 20px !important; 
	font-size: 6.2vw !important; 
	text-transform: none !important;
	font-weight: normal;
	xfont-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
	xfont-variant: small-caps;	
	font-family: HelveticaNow;
	color: #4b286d;
}


@media all and (min-width: 375px) {
	#xhome-header { 
		height: 149px;
	}
	#home-header h1 { 
		font-size: 23px !important; 
	}
}



body { xbackground-color: #2952A4; background-color: #3a274d ;  } /* must match fse-master-page background-color */


#fse-login-page {
	xbackground: url(../../images/background-1FS-blue.jpg);
	background: url(../../images/background-1FS-purple-nologo.jpg);
	background-color: #3a274d; 
    background-repeat: no-repeat;
	background-size: 100%;
	background-position: 0px 0px;
	background-attachment: fixed;
}



.login-page-logo {
	text-align:center;
	width: 100%;	
	margin-top:100px;
}

.login-page-logo img {
	content:url("../../images/background-telus-logo-overlay.png");
	width: 80%;
	max-width:500px;
	margin:auto;
	
}



#fse-master-page {
 	xbackground: url(../../images/background-1FS-blue-nologo.jpg);	
 	xbackground: url(../../images/background-16c.jpg);	
 	background: url(../../images/background-17P.jpg);	
	xbackground-color: #3367CD; 
	xbackground-color: #2952A4; 
	background-color: #3a274d; 
    background-repeat: no-repeat;
	background-size: 100%;
	background-position: 0px 0px;
	background-attachment: fixed;
}

@media all and (min-width: 650px) {
	body { background-color: #BDBDBD; }
	#fse-master-page {
	    background: url(../../images/background-12Pabw2.jpg);	/* dining scene 2 */
		background-color: #BDBDBD;
	    background-repeat: no-repeat;
		background-size: 100%;
		background-position: 0px 0px;
		height: 1500px;
	}
	#fse-login-page {
		xbackground: url(../../images/background-1FS-L-blue.jpg);
		background: url(../../images/background-1FS-L-purple-nologo.jpg);
		background-color: #3a274d; 
	    background-repeat: no-repeat;
		background-size: 100%;
		background-position: 0px 0px;
	}

}


.menu-icons-panel-transparency  {  
    xopacity: .2;  
    opacity: 0;  
}  

#left-panel { 
	xbox-shadow: none;
}



/* home bottom ul/li styles 4D7797 000000 */

#homepg-listarea .main-menu-expander { padding-bottom: 10px; }

#homepg-listarea .ui-collapsible-set { border: none; }
#homepg-listarea .ui-collapsible-heading-toggle { box-shadow: none; opacity: .75; border-radius: 5px; background-color:#000000 ;}
#homepg-listarea .ui-btn-inner { color: white; font-weight:700;text-shadow: none;border-radius: 5px; background-color:#000000 ; font-size:.84em;font-family:Helvetica,Arial,sans-serif; }
#homepg-listarea .ui-btn-inner { border-top: 0px; }
#homepg-listarea .ui-collapsible-heading-toggle { border-top-color: #000000 ; }

#homepg-listarea .ui-icon-shadow { box-shadow: none; }
#homepg-listarea .ui-icon-plus { background-position: 1px 1px !important; background-color:#000000 ; }
#homepg-listarea .ui-icon-minus { background-position: -35px 1px !important; background-color:#000000 ; }

#homepg-listarea .ui-icon-info { background-position: -537px 1px !important;  }
#homepg-listarea .ui-icon-refresh { background-position: -322px 1px !important;  }
#homepg-listarea .ui-icon::before  { margin-left: 4px; margin-top:2px;  } /* logout and barcode icons */

#homepg-listarea .ui-collapsible-content { background-color: none; padding: 10px; }
#homepg-listarea .ui-body-c { color: white; background: none; opacity: 1; text-shadow: none; border: 0px;}

#homepg-listarea .ui-btn-up-b { border: none; }
#homepg-listarea .ui-btn-down-b { border: none; }
#homepg-listarea .ui-btn-hover-b { border: none; }

#homepg-listarea a { border-radius: 0px; color: white; font-weight: 500; xborder-bottom: 1px solid grey; text-decoration: none; }

#homepg-listarea .ui-li { border: none; padding: 0px 5px 0px 0px; margin: 0px 0px 5px 15px; background-color:transparent; background-image: none; }
#homepg-listarea .ui-link-inherit { padding: 0px 0px 0px 0px; xmargin: 0px 35px 0px -15px; margin: 0px 35px 0px 0px; }
#homepg-listarea .ui-li-heading { font-size: 14px; }

#homepg-listarea .ui-bar-d { background-image: none; border: none; }
#homepg-listarea .ui-li-divider {  font-size: 16px; padding: 20px 0px 5px 0px; xtext-decoration:underline; background: none; text-shadow: none; color: #FFFFCC; }
#homepg-listarea div.ui-btn-text { border-radius: 0px; border-bottom: 1px solid silver; padding-left: 0px; margin-left: -17px; }

#homepg-listarea .ui-btn-down-c { position:relative; bottom:-2px; left: 2px; }


@media all and (min-width: 600px) {
	#homepg-listarea .ui-li { border: none; padding: 0px 5px 0px 0px; margin: 0px 0px 5px 10px; background-color:transparent; background-image: none; }
	#homepg-listarea .ui-link-inherit { padding: 0px 0px 0px 0px; xmargin: 0px 35px 0px -10px; margin: 0px 35px 0px 0px; }
}


/* END HOME PAGE STYLES */







/* style for collapsibles on detail displays VERSION 1  ( old-336489 new-4D7797  8F9F2F) */

.item-detail-collapsible h3 .ui-btn-inner { xcolor: #505050; color: #000000; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:silver ; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color: #959595 !important; opacity: 1;}
.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color: transparent; }
.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color: transparent; }


/* style for collapsibles on detail displays VERSION 2 */
/*
.item-detail-collapsible h3 .ui-btn-inner { xcolor: #505050; color: #000000; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:silver ; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color: red; opacity: .9; border:1px;}
.item-detail-collapsible { box-shadow: rgba(0, 0, 0, 0.75) 1px 1px 2px 0px; }
.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:silver ; }
.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:silver ; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-first-child { border-top-right-radius: 0px; border-top-left-radius: 0px; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }

.disp-panel {
	xborder-radius: 0px;
	border-top-right-radius: 5px; border-top-left-radius: 5px;
	border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;
	margin-bottom: 12px !important;
}

.disp-panel-with-expanders {
	border-top-right-radius: 0px; border-top-left-radius: 0px;
	border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;
}
*/


/* style for collapsibles on detail displays VERSION 3 */
/*
.item-detail-collapsible h3 .ui-btn-inner { xcolor: #505050; color: #000000; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:silver ; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color:WHITE ; xopacity: .9; opacity: 1; border: 0px;}
.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:silver ; }
.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:silver ; }

.item-detail-collapsible.ui-collapsible-set .ui-collapsible { border-bottom: 1px solid blue; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom: 0px; }

.data-set-background { box-shadow: rgba(0, 0, 0, 0.75) 1px 1px 2px 0px; }
*/




/* style for collapsibles on detail displays VERSION 4 */
/*
.item-detail-collapsible h3 .ui-btn-inner { color: #000000; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:silver;  font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color:#d9d9d9; xborder:0px solid blue; opacity: 1; }
.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:silver; }
.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:silver; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-first-child { border-top-right-radius: 5px; border-top-left-radius: 5px; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }

.item-detail-collapsible  .ui-btn-up-b { background-image: none; }
.item-detail-collapsible  .ui-btn-up-b { background: none; }
.item-detail-collapsible  .ui-btn-hover-b { background-image: none; }
.item-detail-collapsible  .ui-btn-hover-b { background: none; }


@media all and (min-width: 650px) {
	.item-detail-collapsible h3 .ui-btn-inner { color: white; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:#4D7797; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
	.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color:#4D7797; opacity: .9;}
	.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
	.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:#4D7797; }
	.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:#4D7797; }
	.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-first-child { border-top-right-radius: 5px; border-top-left-radius: 5px; }
	.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
}
*/


/* style for collapsibles on detail displays VERSION 5, transparent look */
/*
.item-detail-collapsible h3 .ui-btn-inner { color: #FFFFFF; font-weight:normal;text-shadow: none; xborder-radius: 5px; xbackground-color:silver; background-color:transparent; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color:silver; xborder:0px solid blue; opacity: 1; border-left:0px; border-right: 0px;}
.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:transparent; }
.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:transparent; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-first-child { border-top-right-radius: 0px; border-top-left-radius: 0px; }
.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; }

.item-detail-collapsible  .ui-btn-up-b { background-image: none; }
.item-detail-collapsible  .ui-btn-up-b { background: none; }
.item-detail-collapsible  .ui-btn-hover-b { background-image: none; }
.item-detail-collapsible  .ui-btn-hover-b { background: none; }

@media all and (min-width: 650px) {
	.item-detail-collapsible h3 .ui-btn-inner { color: white; font-weight:normal;text-shadow: none; xborder-radius: 5px; background-color:#4D7797; font-size:.84em; font-family:Helvetica,Arial,sans-serif; }
	.item-detail-collapsible h3 .ui-collapsible-heading-toggle { border-color:#4D7797; opacity: .9;}
	.item-detail-collapsible h3 .ui-icon-shadow { box-shadow: none; }
	.item-detail-collapsible h3 .ui-icon-plus { background-position: 1px 1px !important; background-color:#4D7797; }
	.item-detail-collapsible h3 .ui-icon-minus { background-position: -35px 1px !important; background-color:#4D7797; }
	.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-first-child { border-top-right-radius: 5px; border-top-left-radius: 5px; }
	.item-detail-collapsible.ui-collapsible-set .ui-collapsible.ui-last-child { border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
}
*/







/* horizontal radio button - selected state, green background */
/*
.radio-toolbar label { background-color: white !important; color: silver !important; border: 1px solid white; }
.radio-toolbar input[type="radio"]:checked + label { background-color: #A6B738 !important; border: 1px solid #A6B738; color: white !important; }
@media all and (min-width: 650px) {
	.radio-toolbar label { border: 1px solid silver; }
}
*/



/* home screen icons */
.home-app-icon-container { color: white;  }

.home-app-icon-content {
	/* Positioning */
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;

	background-image: none;

	opacity: 1;
	border-radius: 50%;
	xbox-shadow: 1px 2px 2px rgba(0, 0, 0, .4);
	xbox-shadow: none;
	xborder: 0px solid lightblue;
	
	/* sabres theme (dark blue) */
	box-shadow: none;
	box-shadow: 1px 2px 2px rgba(0, 0, 0, .4);
	border: 0px;
	border: 1px solid #4d88ff;

	/* playing around */
	box-shadow: none;
	box-shadow: 1px 2px 2px rgba(0, 0, 0, .4);
	border: 0px;

	/* current production */
	box-shadow: 1px 2px 2px rgba(0, 0, 0, .4);
	border: 0px;

 }


.home-app-icon-underlay {
	border-radius: 50%;
	background-image: none;
	
	/* light blue */	
	background-color: #9bedfd;
	opacity: .4;
	
	/* sabres theme (dark blue) */
	background-color: #000033;
	opacity: .5;
	
	/* playing around */
	background-color: #6495ED    ;
	background-color: lightskyblue;  /* nice */
	opacity: .4;
	
	/* gold */
	background-color: #FFC90E;
	opacity: .3;
	
	/* current production */
	background-color: #ffffff;
	opacity: .4;
	
}


.xhome-app-icon-underlay-1FS {
	background-color: #000033;
	opacity: .4; 
	}


.xhome-app-icon-underlay-bs {
	xbackground-color: #88272d;
	xbackground-color: #008080;
	background-color: #009999;
	opacity: .5; 
	}


/* responsive icons */
.home-app-icon {
	xwidth: 70px;
	width: 22vw;
}

.home-app-icon-div {
	xbackground-size: 40px;
	background-size: 12vw;
}

@media all and (min-width: 375px) {
	.home-app-icon {
		width: 83px;
	}
	.home-app-icon-div {
		background-size: 45px;
	}
}
/* end responsive icons */


.tab-home-app-icon {
	background-image: none;
	background-color: gray;
	margin-left:-5px;
	margin-right:10px;
	height:22px;
	width:22px;
	float:left;
	xborder-radius:2px;
	border-radius:50%;
	opacity: 1;
}

.tab-home-app-icon-1FS { background-color: lightblue !important; }

.tab-home-app-icon-inner {
	height: 100%; 
	background-repeat: no-repeat;
	background-position:center;
	background-size: 65%;
}




.search-container2-transparency  {  
    opacity:.2;  
    background-color:#000000;  
    width:100%;  
    height:100%;   
    position:absolute;  
    top:0px;  
    left:0px;  
    z-index:0;
}  


/* contacts listing thumbnails - round style */
#contacts-results .li-icon-wrap { border-radius: 50%; margin: -3px 15px -10px -6px; width:70px; height:70px; }
#contacts-results .li-icon-wrap img { width:70px; }
#contacts-results .li-icon-head { border-radius: 50%; margin: -3px 15px -10px -6px; width:70px; height:70px; border:1px solid silver; }
#contacts-results .li-icon-head img { width:70px; }



#useful-links .ui-link { border-bottom: 1px dashed #aaa !important; }
.useful-links-label { color: yellow; padding-right:10px; }