.bgpix {
	background-image:url(bally-quartz/bally-pc-bkgd.png);
	background-repeat:repeat;background-size:100%;
	}
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
div.MainCtn {position:relative; top:0; left:0px; width:100%; height:auto; display:flex; flex-wrap:wrap; }
div.ban-PCcnt {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  display: block;
}
div.ban-MPcnt {position:relative; top:0, left:0; width:100%; display: none;}
img.ban-size  {width:90%; height:auto; }

/* Shared text box styles (text always visible) */
div.publicity,
div.Bally,
div.bally-edge {
  position: absolute; z-index: 2; border-radius: 20px; }
  /* Background starts transparent; text remains visible */

div.publicity, div.bally-edge {
  padding: 15px 2%;
  font-family: "Arial", "Helvetica", "sans-serif";
  line-height: 1.5;
  transition: background-color 0.8s ease; }
  /* only animate bg */

/* PC setting  PC setting  PC setting  PC setting  PC setting  */
div.publicity {
  top: 15px; left: 39%; width:auto; font-size: 23px; color: red; font-weight: bold; 
  line-height: 1.3;  background-color: rgba(255, 255, 255, 0.7); text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); }

div.Bally {
  top: 18px; left: 82%; width:10%; padding: 13px 1.3%; height:auto; background-color: rgba(255, 255, 255, 0.8); }
img.BaLogo {width:100%; height:auto; }

/* PC setting  PC setting  PC setting  PC setting  PC setting  */
div.bally-edge {
  top: 190px; left:39%; width: 29%; font-size: 18px; color: white; line-height: 1.4; font-weight: normal; 
  background-color: rgba(255, 255, 255, 0); text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); }

/* Hover the banner: only the background fades in */
div.ban-PCcnt:hover div.publicity  {
  font-size: 26px; color: white ; background-color: rgba(255, 255, 255, 0); 
  /* Optional: add a subtle pop */
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  backdrop-filter: blur(4px);  }
div.ban-PCcnt:hover div.bally-edge  {
  color: #303030 ; background-color: rgba(255, 255, 255, 0.7); 
  /* Optional: add a subtle pop */
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  backdrop-filter: blur(4px);  }

/* PC setting  PC setting  PC setting  PC setting  PC setting  */
div.Certs-Cnt {position:relative; display:flex; flex-wrap:wrap; top:0; left:0; width:100%; height:auto; 
               padding-top:50px; padding-left:0; padding-right:0; padding-bottom:30px; }

div.cert-gapL, div.cert-gapR		{width:10%; height:auto;}
div.cert1, div.cert2, div.cert3    {width:7.5%; height:auto; padding-top:13px; padding-bottom:13px; padding-left:0; padding-right:0; }
div.certGr   {width:7.5%; height:auto; padding-top:10px; padding-bottom:13px; padding-left:0; padding-right:0; }
img.cert-w  {width:45%; height:auto; border:0 ; }

div.Bally-gallery {width:25%; height:auto; padding-top:5px ; padding-left:0; padding-right:0; padding-bottom:10px; line-height: 1.5;  }

a.Bally-all:link   {font-size:22px; color:#0000f0; font-weight:normal; font-style:standard; text-decoration:underline; 
			        font-family: "Arial", "Helvetica", "sans-serif"; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); }
a.Bally-all:active  {font-size:22px; color:#0000ff;text-decoration:none; }
a.Bally-all:visited {font-size:22px; color:#0000f0; text-decoration:underline; }
a.Bally-all:hover   {font-size:24px; color:#0000ff; text-decoration:none; }

a.bally-class:link  {font-size:21px; color:#0000f0; font-weight:normal; font-style:standard; text-decoration:underline; 
			         font-family: "Arial", "Helvetica", "sans-serif"; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);}
a.bally-class:active {font-size:21px; color:#0000ff;text-decoration:none; }
a.bally-class:visited {font-size:21px; color:#0000f0; text-decoration:underline; }
a.bally-class:hover  {font-size:23px; color:#0000ff; text-decoration:none; }

/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */

#bally-qz, #bally-basic, #bally-carrara, #bally-calacatta {scroll-margin-top: 110px; }

div.Quartz {position:relative; top:0; left:0px; width:100%; height:auto; display:flex;flex-wrap:wrap; }
div.Intro-L, div.Intro-R    {width:25%; padding-top:20px; padding-bottom:30px; padding-left:30px; padding-right:30px; font-size:16px;color:#303030;
                             font-weight:bold;font-style:italic; font-family: "Arial", "Helvetica", "sans-serif";  line-height: 1.5; }
img.intro-size {width:100%; height:auto; border:0; }

div.Bally-Quartz-L, div.Bally-Quartz-R {width:50%; padding-top:30px; padding-bottom:30px; font-size:22px;color:#303030; font-weight:bold;
                                        font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; }
div.Bally-Quartz-L {padding-left:30px; padding-right:10px; }
div.Bally-Quartz-R {padding-left:10px; padding-right:30px; }

img.sep {width:95%; height:auto; border:0; }

/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
a.B:link {text-decoration:none;font-size:20px;color:#303030;font-family="arial";font-weight:bold;}
a.B:active {color:#806060;}
a.B:visited {text-decoration:none;color:#303030;font-weight:bold;}
a.B:hover {text-decoration:underline;color:#303030;font-weight:bold;}

a.inqa {text-decoration:underline; font-size:20px;color:#0000c0;font-weight:bold; font-family: "Arial", "Helvetica", "sans-serif";}
a.inqa:active {color:#0000c0;}
a.inqa:visited {color:#0000c0;}
a.inqa:hover{color:#0000f0; }
div.Lft {width:42.5%; padding-left:0.5%; height:auto ;}
div.Rgt {width:57.5%; padding-right:1%; height:auto ;}
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
img.detail {position:relative; width:100%; height:auto; border:0; }
img.slab {position:relative; width:100%; height:auto; border:0; }

div.Prom {width:100%; height:auto; padding-top:50px; padding-bottom:10px; padding-left:7.5%; padding-right:7.5%; 
		  font-size:22px;color:#606060;font-weight:normal; font-style:standard ; font-family: "Arial", "Helvetica", "sans-serif"; }
font.ProB {font-size:20px;color:#606060;font-weight:bold; font-style:standard ; font-family: "Arial", "Helvetica", "sans-serif"; }
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */
/* PC display   PC display   PC display    PC display    PC display    PC display    PC display    PC display */


/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
@media only screen and (max-width: 760px) {

.bgpix {position:absolute; left:0; top:0; bgcolor:#ffffff;
	background-image:url(bally-quartz/bally-quartz-.png);
	background-repeat:repeat; background-size:100%;  
	}

div.MainCtn {position:relative; top:0; left:0px; width:100%; height:auto; display:flex; flex-wrap:wrap; }
div.ban-PCcnt {position:relative; top:0, left:0; width:100%; display: none; }
div.ban-MPcnt {position:relative; top:0, left:0; width:100%; display: block; }
img.ban-size  {width:95%; height:auto; }

/* Shared text box styles (text always visible) */
div.publicity,
div.Bally,
div.bally-edge {
  position: absolute; z-index: 2; border-radius: 5px; }

/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
div.publicity, div.bally-edge {
  padding: 3px 8px;
  font-family: "Arial", "Helvetica", "sans-serif";
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
  /* Background starts transparent; text remains visible */
  transition: background-color 0.8s ease; /* only animate bg */
}

/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
div.publicity {
  top: 8px; left: 25%; padding: 5px 7px; width:auto; font-size: 12px; line-height: 1.2; color: red; font-weight: bold;
  background-color: rgba(255, 255, 255, 0.7); }

div.Bally {
   top: 8px; left: 75%; width:20%; padding: 5px 7px; height:auto; background-color: rgba(255, 255, 255, 0.7); }
img.BaLogo {width:100%; height:auto; }

div.bally-edge {top: 140px; left: 34.5%; width: 48%; font-size: 10px; line-height: 1.2; color: white ; font-weight: bold;
  				background-color: rgba(255, 255, 255, 0); }

/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
/* Hover the banner: only the background fades in */
div.ban-MPcnt:active div.publicity {
  font-size: 14px; color: white ; background-color: rgba(255, 255, 255, 0); }
div.ban-MPcnt:active div.bally-edge {
  color: #303030 ; background-color: rgba(255, 255, 255, 0.7); }
  /* Optional: add a subtle pop
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  backdrop-filter: blur(2px);   */

/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
div.Certs-Cnt {position:relative; display:flex; flex-wrap:wrap; top:0; left:0; width:100%; height:auto; 
               padding-top:20px; padding-left:0; padding-right:0; padding-bottom:20px; }

div.cert-gapL  {width:10%; height:auto;}
div.cert1, div.cert2, div.cert3    {width:20%; height:auto; padding-top:3px; padding-bottom:3px; padding-left:0; padding-right:0; }
div.certGr   {width:20%; height:auto; padding-top:0; padding-bottom:0; padding-left:0; padding-right:0; }
img.cert-w    {width:50%; height:auto; border:0 ; }

div.cert-gapR      {width:11%; height:auto;}
div.Bally-gallery  {width:39%; height:auto; padding-top:25px ; padding-left:2%; padding-right:0; padding-bottom:5px; line-height: 2.0;  }
a.Bally-all:link   {font-size:13px; color:#0000f0; font-weight:bold; font-style:standard; text-decoration:underline; 
			        font-family: "Arial", "Helvetica", "sans-serif"; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); }
a.Bally-all:active  {font-size:15px; color:#0000ff;text-decoration:none; }
a.Bally-all:visited {font-size:13px; color:#0000f0; text-decoration:underline; }
a.Bally-all:hover   {font-size:15px; color:#0000ff; text-decoration:none; }

a.bally-class:link  {font-size:13px; color:#0000f0; font-weight:bold; font-style:standard; text-decoration:underline; 
			         font-family: "Arial", "Helvetica", "sans-serif"; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);}
a.bally-class:active {font-size:15px; color:#0000ff;text-decoration:none; }
a.bally-class:visited {font-size:13px; color:#0000f0; text-decoration:underline; }
a.bally-class:hover  {font-size:15px; color:#0000ff; text-decoration:none; }

/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */

#bally-qz {scroll-margin-top: 70px; }
#bally-basic     {scroll-margin-top: 70px; }
#bally-carrara   {scroll-margin-top: 70px; }
#bally-calacatta {scroll-margin-top: 70px; }

div.Quartz {position:relative;top:0; left:0; width:100%; height:auto; display:flex;flex-wrap:wrap;}
div.Intro-L    {width:50%; padding-top:30px; padding-bottom:30px; padding-left:3%; padding-right:3%;
                font-size:10px;color:#303030;font-weight:bold;font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; line-height: 1.2; }
div.Intro-R    {width:50%; padding-top:30px; padding-bottom:30px; padding-left:3%; padding-right:3%;
                    font-size:10px;color:#303030;font-weight:bold;font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; line-height: 1.2; }
div.Bally-Quartz-L {width:100%; padding-top:10px; padding-bottom:10px; padding-left:2%; padding-right:1%; 
                    font-size:15px; color:#303030;font-weight:bold; font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; line-height: 1.2; }
div.Bally-Quartz-R {width:100%; padding-top:10px; padding-bottom:10px; padding-left:1%; padding-right:2%; 
                    font-size:15px; color:#303030;font-weight:bold; font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; line-height: 1.2; }
img.sep {width:100%; height:auto; border:0; }
a.inqa {font-size:8px;color:#0000c0;font-weight:bold;text-decoration:underline; font-family: "Arial", "Helvetica", "sans-serif";}
a.inqa:hover {color:#0000f0; }
div.Lft {width:42.5%; padding-left:0.5%; height:auto ; }
div.Rgt {width:57.5%; padding-right:1%; height:auto ; }
a.B:link {text-decoration:none;font-size:10px;color:#606060; font-weight:bold; font-family: "Arial", "Helvetica", "sans-serif";}
a.B:active {color:#806060;}
a.B:visited {text-decoration:none;color:#606060;font-weight:bold;}
a.B:hover{text-decoration:underline;color:#606060;font-weight:bold;}
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
div.Prom  {width:100%; height:auto; padding-top:3%; padding-bottom:0.5%; font-size:9px; color:#606060;font-weight:normal;
		  font-style:normal; font-family: "Arial", "Helvetica", "sans-serif"; }
font.ProB  {font-size:10px; color:#606060;font-weight:bold;
		  font-style:normal; font-family: "Arial", "Helvetica", "sans-serif"; }
}
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */
/* MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  MOBILE display  */