html, body {
bgcolor:#ffffff; margin: 0;
padding: 0;
box-sizing: border-box;
}
*, *::before, *::after {
box-sizing: inherit;
}
div.MainCtn {position:relative; top:0px; left:0px; width:100%; height:auto; display:flex;flex-wrap:wrap; }
/* These part of the css code for the new top-menu bar were saved into the construction-nav.css file in the css directory */
/* The container is loaded by /sdcstone/top-menu-container.html by "/js/sdc-top-menu.js" Java program */
div.top-menu-container {position:relative; display:block; }
/* These part of the css code for the new top-menu bar were saved into the construction-nav.css file in the css directory */
div.ban-PCcnt {position: absolute; z-index:11; top:-6.59vw; transform: translateY(-20px); left: 0; width: 100vw; display: block; }
div.ban-MPcnt {position:relative; display: none;}
img.ban-size {width:97.5%; height:auto; background-color:white; border-radius:2.2vw; }
div.SDCIntro, div.intro, div.addr
{position: absolute; z-index: 12; width:auto; height:auto; padding: 10px 15px; font-style:italic;
font-family: "Arial", "Helvetica", "sans-serif"; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25); line-height: 1.2;;
border-radius: 1.1vw; transition: background-color 1.2s ease, transform 1s ease, opacity 1.2s ease; }
div.SDCIntro {top:10vw; left:5.0%; font-size:1.9vw; color:white; font-weight:bold; background-color: rgba(208, 208, 255, 0.4); }
div.intro {top:10vw; left:57%; font-size:1.54vw; color:white ; font-weight:normal; background-color: rgba(255, 255, 255, 0.2); }
div.addr {top:25vw; left:5.0%; font-size:1.9vw; color:0000f0; font-weight:bold; background-color: rgba(255, 255, 255, 0.5); }
div.intro.active {color:black; background-color: rgba(255, 255, 255, 0.3); transform: scale(1.35); opacity: 1; }
div.to-smpl, div.to-inq
{position: absolute; z-index:12; top:26.5vw; width:auto; height:auto; }
div.to-smpl {left:77%; }
div.to-inq {left:88%;}
a.inq-color, a.inq-color:visited, a.inq-sales, a.inq-sales:visited
{font-size:1.17vw; color:#ffffff; background-color:#f00000; padding:5px 8px; border-radius: 5px; transition: background-color 0.8s ease;
font-weight:normal; text-decoration:underline; font-family: "Arial", "Helvetica", "sans-serif"; }
a.inq-color, a.inq-color:visited
{background-color:#f00000 ; }
a.inq-sales, a.inq-sales:visited
{background-color:#0000f0 ; }
a.inq-color:active, a.inq-color:hover, a.inq-sales:active, a.inq-sales:hover
{color:#000000; text-decoration:none; font-weight:bold; }
#smple { scroll-margin-top: 120px; }
img.banpix {width:95%; height:auto; border:0; border-radius: 1.65vw; }
div.BanCnt {position:relative; top:365px; left:0px; width:100%; height:auto;display:flex;flex-wrap:wrap;}
h1, h3 {color:#303030; font-weight:bold; font-style:standard; font-family: "Arial", "Helvetica", "sans-serif"; }
h1 {font-size:22px; line-height: 1.7; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); }
h3 {font-size:21px; line-height: 1.7; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); }
div.banT, div.banL, div.banR, div.Prom
{height:auto; display:flex; flex-wrap:wrap; text-decoration:none;
font-weight:bold; font-style:italic; font-family: "Arial", "Helvetica", "sans-serif";
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); }
div.banT {width:96%; margin-left:2%; margin-right:2%; padding-top:0; padding-left:20px; padding-right:20px; padding-bottom:10px; font-size:20px;color:#303030; }
div.banL {width:48%; margin-left:2%; margin-right:0; padding-top:0; padding-left:20px; padding-right:0; padding-bottom:50px; font-size:22px; color:red; }
div.banR {width:48%; margin-left:2%; margin-right:2%; padding-top:0; padding-left:0; padding-right:20px; padding-bottom:50px; font-size:22px; color:red; }
div.Prom {width:96%; margin-left:2%; margin-right:2%; margin-bottom:100px; padding:0 7.5%; font-size:18px; color:#303030; }
a.ProB:link {text-decoration:underline; font-size:24px; color:#0000f0; font-family: "Arial", "Helvetica", "sans-serif"; font-weight:bold;
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); }
a.ProB:active {color:#0000f0;}
a.ProB:visited {text-decoration:none; color:#0000f0; font-weight:bold;}
a.ProB:hover {text-decoration:none; color:#f0f0f0; font-weight:bold;}
div.sdc-footer-mp {position:fixed; display:none; }
div.sdc-footer-pc {position:fixed; display:block; z-index:5; background-color:white; bottom:0; width:95%; padding:0.5vw 0.5vw;
height:auto; font-size:1.3vw; font-family: "Arial", "Helvetica", "sans-serif"; font-weight:bold;}
@media only screen and (max-width: 580px) {
html, body { bgcolor:#ffffff; margin: 0; padding: 0; box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
div.MainCtn {position:relative; top:0px; left:0px; width:100%; height:auto; display:flex;flex-wrap:wrap; }
div.top-menu-container {position:relative; display:block; }
/* These part of the css code for the new top-menu bar were saved into the construction-nav.css file in the css directory */
/* My Mobile viewpoint 720 x 1600px, 1vw=7.20px 1vh=16.00px my MP viewpoint */
div.Construction-content {position:relative; display:block; 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; }
/* My Mobile viewpoint 720 x 1600px, 1vw=7.20px 1vh=16.00px my MP viewpoint */
div.ban-MPcnt {position:relative; top:0; left:0; width:100%; height:auto; display: block; }
img.ban-size {width:100%; height:auto; border-radius: 12px; }
div.SDCIntro, div.intro, div.addr
{position: absolute; z-index:3; width:auto; height:auto; padding: 5px 5px;
font-style:italic; font-family: "Arial", "Helvetica", "sans-serif";
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); line-height: 1.2; background-color: rgba(255, 255, 255, 0.5);
border-radius: 10px; transition: background-color 1s ease, transform 1s ease, opacity 1s ease; }
div.SDCIntro {top:0; left:3.47%; font-size:clamp(16px, 3.47vw, 40px); font-weight:bold; color:white; }
div.addr {top:8.5vw; left:3.47%; font-size:clamp(13px, 3.25vw, 39px); font-weight:bold; color:#0000f0; }
div.intro {top:51vw; left:3.47%; font-size:clamp(12px, 3.0vw, 36px); font-weight:normal; color:#303030; }
div.intro.active { color:black; background-color: rgba(255, 255, 255, 0.75); transform: scale(1.3); opacity: 1; transition: background-color 1.5s ease;}
div.to-smpl, div.to-inq
{position: absolute; z-index:3; top:57.5vw; width:auto; height:auto; }
div.to-smpl {left:69%; }
div.to-inq {left:86%; }
a.inq-color, a.inq-color:visited, a.inq-sales, a.inq-sales:visited
{font-size:9px;color:#ffffff; padding-left:2px; padding-top:1px; padding-right:2px; padding-bottom:1px;
font-weight:normal; text-decoration:underline; font-family: "Arial", "Helvetica", "sans-serif";}
a.inq-color, a.inq-color:visited {background-color:#0000f0 ; }
a.inq-sales, a.inq-sales:visited {background-color:#f00000 ; }
a.inq-color:active, a.inq-color:hover,a.inq-color:focus, a.inq-sales:active, a.inq-sales:hover,a.inq-color:focus
{color:#000000 }
#smple { scroll-margin-top: 70px; }
/* My Mobile viewpoint 720 x 1600px, 1vw=7.20px 1vh=16.00px my MP viewpoint */
div.BanCnt {position:relative; top:0; left:0px; width:100%; height:auto;display:flex;flex-wrap:wrap;}
img.banpix {width:95%; height:auto; border:0; border-radius: 8px; }
h1, h3 {color:#303030; font-weight:bold; font-style:standard; font-family: "Arial", "Helvetica", "sans-serif"; }
h1 {font-size:16px; line-height: 1.7; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); }
h3 {font-size:15px; line-height: 1.7; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); }
div.banT, div.banL, div.banR
{width:95%; height:auto; display:flex; flex-wrap:wrap; padding:2vw 2.77vw;
line-height: 1.3; font-style:italic; font-family: "Arial", "Helvetica", "sans-serif"; }
div.banT {font-size:14px; color:#303030; font-weight:normal; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); }
div.banL {font-size:15px; color:red; font-weight:bold; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); }
div.banR {font-size:15px; color:red; font-weight:bold; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); }
div.Prom {width:90vw; margin-right:10vw; height:auto; padding:2.77vw 2.77vw; line-height: 1.3;
text-decoration:none; font-size:12px; color:#303030; font-family: "Arial", "Helvetica", "sans-serif"; font-weight:normal;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); }
a.ProB:link {text-decoration:underline; font-size:16px; color:#0000f0; font-family="arial";font-weight:bold;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); }
a.ProB:active {color:#0000f0;}
a.ProB:visited {text-decoration:none;color:#0000f0;font-weight:bold;}
a.ProB:hover {text-decoration:none; color:#f0f000; font-weight:bold;}
div.sdc-footer-pc {position:fixed; display:none; }
div.sdc-footer-mp {position:fixed; display:block; bottom:0; z-index:5; width:90%; margin-left:2%; margin-right:8%; margin-bottom:0.3vw;
height:auto; background-color:white; font-size:2.62vw; padding:0; line-height:1.2;
font-family: "Arial", "Helvetica", "sans-serif"; font-weight:bold;}