Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"liveServer.settings.port": 5501

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this file shouldn't be here add a .gitignore file

}
296 changes: 296 additions & 0 deletions 1.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,296 @@
/*# sourceMappingURL=index.css.map */
body{
background: url(mainmenu.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
margin: auto;
display: flex;
flex-direction: column;
width: 90%;
}
.main{
display: flex;
justify-content: space-between;
flex-flow:row nowrap;
align-items: center;
flex-direction: row;
width: 68%;
margin: 20px auto;
}
a{
display: inline-block;
word-break: keep-all;
text-decoration: none;
color: #fff;
font-family: "Montserrat";
border-radius: 29px;
border: solid 1px rgb(53, 81, 93) ;
background: rgb(17, 52, 70, 53%);
text-transform: uppercase;
overflow: hidden;
padding: 8px 14px;
font-size: 16px;
}

.next{
padding: 0px 8px 0px 8px;
text-align: center;
font-weight: 500;
}
.logo{
align-items: center;
}
.logo1{
margin-right: 26px;
height: 35px;
width: 137.79px;
align-items:center;
}
.logo2{
height: 38px;
width: 99px;
margin-top: 6px;
}

.button{
display:inline-block;
text-align: center;
margin-top: 12px;
overflow: hidden;

}
.button1{
margin-right: 16px;
padding: 10px 8px;
width: 200px;
text-align: center;
}
.button2{
width: 141px;
padding: 10px 8px;
text-align: center;
}
.container{
display: flex;
flex-direction: column;
width: 100%;
}
.tag{
margin-top: 200px;
display: flex;
flex-direction: column;
justify-content: center;
}
.tag1{
font-size: 30px;
margin: 4px 0px 1px 0px;
font-family: "Montserrat";
color: #fff;
text-align: center;
font-weight: lighter;
text-transform: uppercase;

}
.tag2{
font-size: 60px;
margin: 0px auto;
font-family: "Montserrat";
color: #fff;
text-align: center;
font-weight: 500;
text-transform: uppercase;
}

.group{
display: flex;
min-block-size: 600px;
flex-direction: row;
flex-wrap: wrap;
justify-content:center;
min-width: 281.44px;
gap: 10px ;
}
.group > * {
align-items: center;
margin: 10px;
}

.group1{
background-image: url("Path 6 Copy.png");
position: relative;
background-repeat: no-repeat;;
min-height: 350px;
min-width: 281.44px;
margin-top: 150px;
}
.group1 h1{
font-size: 32px;
font-family: "Montserrat";
font-weight: 500;
color: rgb(255, 255, 255, 0.5);
text-transform: uppercase;
margin-top: 280px;
margin-left: 35px;
}

.oval{
margin: 70px 10px 10px 70px;
overflow: hidden;
position: absolute;
opacity: 50%;
}

.bglogo{
position: absolute;
margin-top: 115px;
margin-left: 115px;
height: 52px;
width: 60.54px;
opacity: 50%;

}
.group2{
background-image: url("Path 6 Copy.png");
background-repeat: no-repeat;
height: 350px;
min-width: 281.44px;
margin-top: 150px;

}
.group3{
background-image: url("Path 6 Copy.png");
background-repeat: no-repeat;
height: 350px;
min-width: 281.44px;
margin-top: 150px;

}
.group4{
background-image: url("Path 6 Copy.png");
background-repeat: no-repeat;
height: 350px;
min-width: 281.44px;
margin-top: 150px;
}
.group2 h1{
font-size: 32px;
font-family: "Montserrat";
font-weight: 500;
color: rgb(255, 255, 255, 0.5);
text-transform: uppercase;
margin-top: 280px;
margin-left: 10px;
}
.oval0{
margin: 70px 10px 10px 70px;
overflow: hidden;
position: absolute;
opacity: 50%;
}

.bglogo0{
position: absolute;
margin-top: 105px;
margin-left: 120px;
height: 69px;
opacity: 50%;

}

.group3 h1{
font-size: 32px;
font-family: "Montserrat";
font-weight: 500;
color: rgb(255, 255, 255, 0.5);
text-transform: uppercase;
margin-top: 280px;
margin-left: 25px;
}
.oval1{
margin: 70px 10px 10px 70px;
overflow: hidden;
position: absolute;
opacity: 50%;
}

.bglogo1{
position: absolute;
margin-top: 100px;
margin-left: 130px;
height: 82px;
opacity: 50%;
}

.group4 h1{
font-size: 32px;
font-family: "Montserrat";
font-weight: 500;
color: rgb(255, 255, 255,0.53);
text-transform: uppercase;
margin-top: 280px;
margin-left: 35px;
}
.oval2{
margin: 70px 10px 10px 70px;
overflow: hidden;
position: absolute;
opacity: 50%;
}

.bglogo2{
position: absolute;
margin-top: 120px;
margin-left: 130px;
height: 44px;
opacity: 50%;

}
.group1:hover,.group2:hover,.group3:hover,.group4:hover{
background-image: url("Path 6.png");
color: #fff;
}
.group4:hover h1,.group3:hover h1,.group2:hover h1,.group1:hover h1{
color: #fff;
opacity: 100%;
}
.group1:hover .bglogo,.group2:hover .bglogo0, .group3:hover .bglogo1, .group4:hover .bglogo2,.group1:hover .oval,.group2:hover .oval0,.group3:hover .oval1,.group4:hover .oval2{
opacity: 100%;
}

@media screen and (max-width: 1600px) {
.main{
width: 90%;
}

}
@media screen and (max-width: 1400px) {
.container{
width: 72%;
display: flex;
flex-direction: column;
margin: auto;
justify-content: center;
}
.tag{
margin-top: 100px;
}
.group1{
margin-top: 50px;
}
.group2{
margin-top: 50px;
}
.group3{
margin-top: 20px;
}
.group4{
margin-top: 20px ;
}
.main{
width: 100%;
}

}

56 changes: 56 additions & 0 deletions 1.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="./1.css">
<title>Game Rules-1</title>
</head>
<body>
<div class="main">
<div class="logo">
<img class="logo1" src="./logo2.png" alt="Logo">
<img class="logo2" src="./logo1.png" alt="Logo">
</div>
<div class="button">
<a href="#" class="button1"><img class="next" src="Image 7.png" alt="Next">6 CONNECTED</a>
<a href="#" class="button2"><img class="next" src="Image 8.png" alt="Next">Log out</a>
</div>
</div>
</div>

<div class="container">
<div class="tag">
<h1 class="tag1">Virtual Escape Presents </h1>
<h1 class="tag2">Time's Ticking</h1>
</div>
<div class="group">
<div class="group1">
<img class="bglogo" src="Group 4.png" alt="bglogo"/>
<img class="oval" src="Oval 3.png" alt="oval"/>
<h1 >OUr games</h1>

</div>
<div class="group2">
<img class="bglogo0" src="Group 8.png" alt="bglogo"/>
<img class="oval0" src="Oval 3.png" alt="oval"/>
<h1 >Leaderboard</h1>

</div>
<div class="group3">
<img class="bglogo1" src="asset1.png" alt="bglogo"/>
<img class="oval1" src="Oval 3.png" alt="oval"/>
<h1 >How TO PLAY</h1>

</div>
<div class="group4">
<img class="bglogo2" src="Path 5.png" alt="bglogo"/>
<img class="oval2" src="Oval 3.png" alt="oval"/>
<h1 >START GAME</h1>

</div>
</div>
</div>
</body>
</html>
Binary file added Group 3 Copy 2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Group 4.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Group 8.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Image 7.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Image 8.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Oval 3.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Path 5.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Path 6 Copy 3.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Path 6 Copy.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Path 6.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added asset1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading