From 9b1cedc35b57511601a6d64f140bd5878b9a23ec Mon Sep 17 00:00:00 2001 From: Swapnilkumar Dwivedi <122719184+swappy-2003@users.noreply.github.com> Date: Fri, 2 Feb 2024 22:44:35 +0530 Subject: [PATCH] Update style.css added more styles --- style.css | 130 ++++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 91 insertions(+), 39 deletions(-) diff --git a/style.css b/style.css index df1b636..1bbb305 100644 --- a/style.css +++ b/style.css @@ -8,17 +8,17 @@ padding:0; font-family: swapnil; box-sizing: border-box; -} -body{ +} +html, body { width: 100%; - height: 100%; - - + height: 100%; + } -main{ + +#main{ width: 100%; - height: auto; + background-color: #000000; } #cursor-dot { position: relative; @@ -28,21 +28,24 @@ main{ border-radius: 50%; pointer-events: none; /* Ensure the dot doesn't interfere with cursor events */ z-index: 1000; /* Set a high z-index to make sure the dot appears above other elements */ - transition:ease-in-out; - transition-delay: 0.5ms; + transition:cubic-bezier(0.19, 1, 0.22, 1) 1s; + /* transition-delay: 1s; */ } #hero{ + position: relative ; color: aliceblue; width: 100%; height: 100vh; background-color:#000000; + } nav{ display: flex; align-items: center; justify-content: space-between; + width: auto; padding: 20px 40px; /* background-color: blue; */ @@ -76,17 +79,24 @@ a{ margin-left: 194px; } .blocktext{ + display: flex; + flex-direction: column; + align-items: end; width: fit-content; text-align: right } #heading2{ + display: flex; + flex-direction: column; + align-items: end; margin-top: 100px; padding-right: 30px; } #heading2 h5{ + text-transform: uppercase; font-size: 1vw; text-align: right; @@ -94,49 +104,36 @@ a{ font-weight:600; } -#chotafooter{ - /* background-color: aquamarine; */ - height: 10vh; - color:#fff; +#chotafooter { + padding: 0 2vw; width: 100%; position: absolute; bottom: 3%; display: flex; align-items: center; - justify-content: space-around; - padding-right: 37px; - gap: 5px; -} -footer a{ - padding-left: 41px; - text-transform: uppercase; - font-size: 2vh; -} -#diva{ - text-transform: uppercase; - width: inherit; - height: inherit; + justify-content: space-between; } -#diva2{ + +#chotafooter a { + color: #fff; text-transform: uppercase; - width: inherit; - height: inherit; + text-decoration: none; } - .circle{ - box-sizing: border-box; +#chotafooter #iconset { + color: #000000; + display: flex; + gap: 5px; +} +#chotafooter .circle { display: flex; - justify-content: center; align-items: center; - gap: 10px; - width: 50px; + justify-content: center; + width: 25px; height: 25px; - color: #000000; - /* border: solid 1px; */ border-radius: 50%; - background-color: #c8c8c8; - + background-color: #c5bdbd; } #second { @@ -179,7 +176,7 @@ footer a{ } .elem img{ height: 140%; - display: none; + opacity: 0; z-index: 999; position: absolute; @@ -223,4 +220,59 @@ opacity: .6; #textarea a:hover{ background-color: #fff; color: #000000; + +} +#subscribe{ + color: #fff; + background-color: #000000 ; + padding-bottom: 7vw; + padding: 20px 30px ; +} +#subscribe h5{ + text-transform: uppercase; + opacity: .6; +} +#subscribe h3{ + text-transform: uppercase; + font-size: 14px; + margin-top: 10px; + +} +#footer{ + background-color: #000000; + display: flex; + align-items: center; + justify-content: space-between; + padding: 20px 30px; +} +#footerlef{ + color: #fff; + display: flex; + padding: 10px 20 px; + gap: 20px; + +} +#footer a{ + color: #fff; + text-transform: uppercase; + font-weight: 500; + text-decoration: none; + font-size: 14px; +} +#footerright{ + display: flex; + gap: 20px; +} +.bounding{ + width: fit-content; + /* background-color: red; */ + overflow: hidden; + +} + +.boundingelem{ + transform: translatey(100%); +} +nav h1:hover{ + cursor: pointer; }