/* home page */
body.home {overflow-y:auto}
.home p.intro {width: 90%}
/* hibiscus rules */
#hibiscusPNG {width: 216px; height: 368px}
#hibiscusPNG img {max-width: 100%; height: auto;}
#curveline-Top {position: absolute; left: -70px; top: 70px;}
#curveline-Bottom {position: absolute; width: 100%; left:-50px; top: 200px}
#curveline-Bottom2 {position: absolute; left:-50px; top: 175px; width: 100%}
/*.home .home-clip-path {shape-outside: url('https://xl4u.org/images/clip-paths/clip-path-hibiscusPNG.png'); shape-margin: .5em; float:right; width: 45%; height: 50%; margin-top: 50%;}
.home .aside  {position: absolute; float:right; top: 90%; right: 0; margin-left: 30%; width: 30%; max-width: 35vw;}
.home aside svg {width: 70vw; }
.hero-contact-wrapper {display: table; width: 70%; max-width: 1280px; padding: 10px 60px 80px 60px; margin: 0 auto; height: 100%;text-align: left;box-sizing: border-box; position: absolute; top: 50px;opacity: 0;}

@media (min-width: 600px) {
.home aside  {top: 85%; right: 13vw; width: 45%; max-width: 40vw; }
.home aside svg {width: 50vw; margin-left: 0}
}*/
/*
@media (min-width: 768px){
.home main {margin-top: 8%; width: 65%}
.home aside  {position: absolute; top: 27%; right: 0; width: 35vw;}
.home .home-clip-path {shape-outside: url('https://xl4u.org/images/clip-paths/clip-path-hibiscusPNG.png'); shape-margin: .5em; float:right; width: 45%; height: 50%; margin-top: 20%;}
.home aside svg {width: 35vw; margin-left: 7%}
}*/
@media screen and (min-width: 10px)
  and (max-width: 370px)
  and (orientation: portrait) {
.home aside {top:50%;}
.home .home-clip-path {shape-outside: url('https://xl4u.org/images/clip-paths/clip-path-hibiscusPNG.png'); float:right; shape-margin: .5em; width: 38%; height: 47%; margin-top: 30vh}
.home aside svg {float:right; width: 40vw; }
 }
@media screen and (min-width: 371px)
  and (max-width: 550px)
  and (orientation: portrait) {
.home main {margin-top: 5vh;}
.home p.intro {width: 65%;}
.home aside {position: absolute; top:47%; right: 0;}
.home .home-clip-path {shape-outside: url('https://xl4u.org/images/clip-paths/clip-path-hibiscusPNG.png'); float:right; shape-margin: .5em; width: 40%; height: 50%; margin-top: 38%}
.home aside svg {float:right; width: 40vw; }
}
@media screen and (min-width: 551px)
  and (max-width: 767px)
  and (orientation: portrait) {
.home main {margin-top: 5vh;}
.home p.intro {width: 65%;}
.home aside {top:60%;}

.home aside svg {float:right; width: 45vw; }
}
@media screen and (min-width: 768px)
  and (max-width: 896px)
  and (orientation: portrait) {
.home main {margin-top: 5vh;}
.home aside {top:18vh; right: 0;}
.home aside svg {width: 45vw}
.home #contact-formWrapper {width: 65%;}
}
@media (min-width: 920px){
.home aside {top: 15%;}
}

@media (min-width: 1024px){
.contactXL4U-hero {margin-top: 8vh}
.home .aside  {top: 15%; right: 2vw;}
.home p.intro {width: 100%}
.home .home-clip-path {shape-outside:none; display:none; height: 0; width:0;}
}
@media (min-width: 1366px){
.home aside  {top: 14vh; right: 3vw;}
.home aside svg {width: 25vw}
#curve-lines {position: absolute; top: 0;left: 0; width: 80%;}
}
@media (min-width: 1610px){
}