source for lucas.co
improvements
index.html | 1 +
styles.css | 57 ++++++++++++++++++++++++++++++++++++++-------------------
2 files changed, 39 insertions(+), 19 deletions(-)
diff --git a/index.html b/index.html
index 214eb5c..039b2c5 100644
--- a/index.html
+++ b/index.html
@@ -9,6 +9,7 @@
<body>
<div class="title">Lucas Galante</div>
+ <div class="whitebox"></div>
<div class="boxx">
<img src="horny.gif" class="myimg">
</div>
diff --git a/styles.css b/styles.css
index 55caaba..8153628 100644
--- a/styles.css
+++ b/styles.css
@@ -1,10 +1,18 @@
:root {
--width1: 11%;
--height1: 65%;
+ --height2: 63%;
+ --top1: 3%;
+ --top2: 5%;
+ --bottom1: 3%;
+ --side1: 20%;
}
.title {
- display: block;
- margin-left: 5%;
+ position: absolute;
+ margin-top: 0%;
+ font-size: 1.8vw;
+ margin-left: var(--side1);
+ z-index: 3;
}
.myimg {
@@ -14,25 +22,35 @@
}
.boxx {
position: absolute;
- top: 1%;
- left: 39.5%;
- height: 19%;
- width: 20%;
+ top: var(--top1);
+ left: 36.0%;
+ height:19%;
+ width: 25%;
padding: 1%;
border: 1px solid black;
}
+.whitebox {
+ position: absolute;
+ top: 0%;
+ left: var(--side1);
+ height: 3vw;
+ width: var(--width1);
+ background-color: white;
+ z-index: 2;
+}
.left {
position: absolute;
- top: 1%;
- left: 20%;
- height: var(--height1);
+ top: calc(var(--top1));
+ left: var(--side1);
+ height: calc(var(--height1));
width: var(--width1);
background-color: black;
+ z-index: 1;
}
.right {
position: absolute;
- top: 1%;
- right: 20%;
+ top: var(--top1);
+ right: var(--side1);
height: var(--height1);
width: var(--width1);
background-color: black;
@@ -47,19 +65,20 @@
}
.circle1 {
position: absolute;
- top: 70%;
- left: 20%;
- width: 10%;
+ bottom: var(--bottom1);
+ left: var(--side1);
+ width: var(--width1);
+ padding-bottom: var(--width1);
border-radius: 50%;
border: 1px solid black;
- padding-bottom: 10%;
+
}
.circle2 {
position: absolute;
- top: 70%;
- right: 20%;
- width: 10%;
+ bottom: var(--bottom1);
+ right: var(--side1);
+ width: var(--width1);
+ padding-bottom: var(--width1);
border-radius: 50%;
border: 1px solid black;
- padding-bottom: 10%;
}
\ No newline at end of file