You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
280 lines
3.8 KiB
280 lines
3.8 KiB
3 years ago
|
*
|
||
|
{
|
||
|
padding: 0;
|
||
|
margin: 0;
|
||
|
box-sizing: border-box;
|
||
|
|
||
|
}
|
||
|
body
|
||
|
{
|
||
|
background-image: url(background.jpeg);
|
||
|
background-size: cover;
|
||
|
background-position: center;
|
||
|
|
||
|
font-family: sans-serif;
|
||
|
}
|
||
|
.menu-bar
|
||
|
{
|
||
|
background: rgb(100,100,100);
|
||
|
text-align: center;
|
||
|
}
|
||
|
.menu-bar ul
|
||
|
{
|
||
|
display: inline-flex;
|
||
|
list-style: none;
|
||
|
color: #000;
|
||
|
}
|
||
|
.menu-bar ul li
|
||
|
{
|
||
|
width: 120px;
|
||
|
margin: 15px;
|
||
|
padding: 15px;
|
||
|
}
|
||
|
.menu-bar ul li a
|
||
|
{
|
||
|
text-decoration: none;
|
||
|
color: #000;
|
||
|
}
|
||
|
.active, .menu-bar ul li:hover
|
||
|
{
|
||
|
background: #F2F2F2;
|
||
|
border-radius: 3px;
|
||
|
}
|
||
|
.menu-bar .fa
|
||
|
{
|
||
|
margin-right: 8px;
|
||
|
}
|
||
|
.sub-menu-1
|
||
|
{
|
||
|
display: none;
|
||
|
}
|
||
|
.menu-bar ul li:hover .sub-menu-1
|
||
|
{
|
||
|
display: block;
|
||
|
position: absolute;
|
||
|
background: rgb(100,100,100);
|
||
|
margin-top: 15px;
|
||
|
margin-left: -15px;
|
||
|
}
|
||
|
.menu-bar ul li:hover .sub-menu-1 ul
|
||
|
{
|
||
|
display: block;
|
||
|
margin: 10px;
|
||
|
}
|
||
|
.menu-bar ul li:hover .sub-menu-1 ul li
|
||
|
{
|
||
|
width: 150px;
|
||
|
padding: 10px;
|
||
|
border-bottom: 1px dotted #fff;
|
||
|
background: transparent;
|
||
|
border-radius: 0;
|
||
|
text-align: left;
|
||
|
}
|
||
|
.menu-bar ul li:hover .sub-menu-1 ul li:last-child
|
||
|
{
|
||
|
border-bottom: none;
|
||
|
}
|
||
|
.menu-bar ul li:hover .sub-menu-1 ul li a:hover
|
||
|
{
|
||
|
color: #fff;
|
||
|
}
|
||
|
.fa-angle-right
|
||
|
{
|
||
|
float: right;
|
||
|
}
|
||
|
.sub-menu-2
|
||
|
{
|
||
|
display: none;
|
||
|
}
|
||
|
.hover-me:hover .sub-menu-2
|
||
|
{
|
||
|
position: absolute;
|
||
|
display: block;
|
||
|
margin-top: -40px;
|
||
|
margin-left: 140px;
|
||
|
background: rgb(100,100,100);
|
||
|
}
|
||
|
.loginbox
|
||
|
{
|
||
|
width: 320px;
|
||
|
height: 420px;
|
||
|
background: #151515;
|
||
|
color: #fff;
|
||
|
top: 50%;
|
||
|
left: 50%;
|
||
|
position:absolute;
|
||
|
transform: translate(-50%,-50%);
|
||
|
box-sizing: border-box;
|
||
|
padding: 70px 30px;
|
||
|
}
|
||
|
.avatar
|
||
|
{
|
||
|
width: 100px;
|
||
|
height: 100px;
|
||
|
border-radius: 50%;
|
||
|
position: absolute;
|
||
|
top: -50px;
|
||
|
left: calc(50% - 50px);
|
||
|
}
|
||
|
h1
|
||
|
{
|
||
|
margin: 0;
|
||
|
padding: 0 0 20px;
|
||
|
text-align: center;
|
||
|
font-size: 22px;
|
||
|
}
|
||
|
.loginbox p
|
||
|
{
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
font-weight: bold;
|
||
|
}
|
||
|
.loginbox input
|
||
|
{
|
||
|
width: 100%;
|
||
|
margin-bottom: 20px;
|
||
|
}
|
||
|
#div1
|
||
|
{
|
||
|
background-image: url(bcka.jpeg);
|
||
|
width: 1600px;
|
||
|
height: 750px;
|
||
|
}
|
||
|
#div2
|
||
|
{
|
||
|
background-image: url(cos.jpeg);
|
||
|
width: 1600px;
|
||
|
height: 750px;
|
||
|
}
|
||
|
#div3
|
||
|
{
|
||
|
background-image: url(bcksx.jpeg);
|
||
|
width: 1600px;
|
||
|
height: 750px;
|
||
|
}
|
||
|
.image1
|
||
|
{
|
||
|
background-image: url(serie1.jpeg);
|
||
|
width: 600px;
|
||
|
height: 371px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image2
|
||
|
{
|
||
|
background-image: url(serie2.jpg);
|
||
|
width: 474px;
|
||
|
height: 316px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image3
|
||
|
{
|
||
|
background-image: url(serie3.jpeg);
|
||
|
width: 600px;
|
||
|
height: 427px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image4
|
||
|
{
|
||
|
background-image: url(serie4.jpeg);
|
||
|
width: 600px;
|
||
|
height: 330px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image5
|
||
|
{
|
||
|
background-image: url(serie5.jpeg);
|
||
|
width: 600px;
|
||
|
height: 430px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image6
|
||
|
{
|
||
|
background-image: url(serie6.jpeg);
|
||
|
width: 600px;
|
||
|
height: 430px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image7
|
||
|
{
|
||
|
background-image: url(serie7.jpeg);
|
||
|
width: 600px;
|
||
|
height: 420px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image8
|
||
|
{
|
||
|
background-image: url(x1.jpeg);
|
||
|
width: 600px;
|
||
|
height: 430px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image9
|
||
|
{
|
||
|
background-image: url(x2.jpeg);
|
||
|
width: 600px;
|
||
|
height: 360px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image10
|
||
|
{
|
||
|
background-image: url(x3.jpeg);
|
||
|
width: 600px;
|
||
|
height: 460px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image11
|
||
|
{
|
||
|
background-image: url(x4.jpeg);
|
||
|
width: 600px;
|
||
|
height: 400px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image12
|
||
|
{
|
||
|
background-image: url(x5.jpeg);
|
||
|
width: 600px;
|
||
|
height: 460px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image13
|
||
|
{
|
||
|
background-image: url(x6.jpeg);
|
||
|
width: 600px;
|
||
|
height: 470px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|
||
|
.image14
|
||
|
{
|
||
|
background-image: url(x7.jpeg);
|
||
|
width: 600px;
|
||
|
height: 375px;
|
||
|
position: relative;
|
||
|
left: 50px;
|
||
|
top: 30px;
|
||
|
}
|