You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

258 lines
4.0 KiB
CSS

@media screen and (max-width: 1920px) {
@import url("ext/8a7380f228a12515c367465bc33bb013/css2.css");
#home {
top: 4%;
left: 2.5%;
font-size: 0.8rem;
letter-spacing: 0.03rem;
letter-spacing: 0.01rem;
padding: 0.5% 0.8%;
}
#designer{
position: absolute;
z-index: 999;
width: 6%;
bottom: 4%;
right: 3%;
cursor: pointer;
}
#title {
padding: 0.2% 1%;
}
#title h1 {
font-size: 2rem;
letter-spacing: 0.02rem;
}
#tape {
transform: rotate(-45deg);
width: 4.5%;
left: 29.5%;
top: 1.6%;
}
#tape img{
width:80%;
}
.bar {
position: absolute;
padding: 0;
margin: 0;
box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 16px,
rgba(0, 0, 0, 0) 0px 7px 13px 3px, rgba(0, 0, 0, 0.1) 0px -3px 0px inset;
cursor: url("hand1.png"), auto;
/* box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; */
/* box-shadow: rgba(0, 0, 0, 0.35) 0px -50px 36px -28px inset; */
}
.bar h3 {
text-align: center;
}
.bar1 {
top: 30%;
left: 7.5%;
width: 18%;
height: 38.5%;
}
.bar1 .frame {
width: 85%;
height: 90%;
}
.bar1 h3 {
font-size: 1.3rem;
line-height: 0.2;
padding-top: 4%;
}
#adobe,
#nomore {
width: 28%;
top: 40%;
}
.bar1 p {
font-size: 0.9rem;
line-height: 133%;
padding: 5% 10%;
margin-bottom: 5%;
}
.bar2 {
top: 22%;
left: 31.5%;
width: 16%;
height: 31.5%;
background: #fff8eb;
background: linear-gradient(
to bottom right,
#fff8eb 0%,
#faebd7 39%,
#d4c9bf 90%
);
display: inline-block;
}
.bar2:hover {
transform: rotate(30deg);
}
.deco1 {
width: 5%;
height: 100%;
margin-left: 0;
background-color: rgb(213, 31, 3);
}
.bar2 .frame {
top: 0;
left: 5%;
width: 97%;
height: 100%;
padding: 1% 2%;
}
.bar2 h3 {
font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
font-size: 1.35rem;
width: 80%;
margin-bottom: 0;
margin-top: 0;
}
.bar2 p {
font-size: 0.75rem;
line-height: 125%;
width:65%;
margin-top: 5%;
margin-bottom: 9%;
}
.bar2 img {
width: 42.5%;
}
.bar3 {
top: 58%;
left: 45.5%;
width: 16%;
height: 34.5%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.bar3 h3 {
font-style: bold;
font-size: 1.75rem;
line-height: 0.25;
margin-bottom: 7%;
}
#t1,
#t5 {
color: #2b710c;
}
#t2,
#t6 {
color: #c11818;
}
#t3,
#t4 {
color: #0b0d7f;
}
#t6 {
text-align: center;
width: 100%;
font-style: italic;
font-size: 0.77rem;
line-height: 130%;
margin-left: auto;
margin-right: auto;
padding-top: 0;
}
#note {
top: 58%;
left: 45.5%;
width: 32%;
height: 34.5%;
}
.page1 p {
font-size: 0.75rem;
line-height: 1.5;
padding: 2% 5%;
}
.page2 p {
font-size: 0.85rem;
line-height: 1.6;
padding: 2% 8%;
}
.bar4 {
left: 66.5%;
width: 22%;
height: 44.5%;
}
.bar4 .frame {
width: 85%;
height: 100%;
justify-content: space-around;
}
.bar4 .frame img {
width: 38%;
margin-top: 0%;
margin-bottom: 0%;
}
.bar4 h3 {
font-family: "Archivo Black", sans-serif;
color: rgb(24, 42, 146);
font-size: 1.7rem;
line-height: 1;
margin-bottom: 0%;
}
.bar4 p {
font-family: "Arsenal", sans-serif;
font-size: 0.9rem;
line-height: 132%;
padding-top: 0;
margin-top: 4%;
margin-bottom: 0;
}
.bar5 {
transform: rotate(20deg);
top: 55%;
left: 50%;
width: 20%;
padding: 0;
display: inline-block;
height: min-content;
padding: 0 0.75%;
margin: 0;
background-color: #e2eeec;
box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
}
.bar5 p {
margin: 1% auto;
padding: 1% 2%;
font-family: "Libre Baskerville", serif;
font-size: 0.85rem;
letter-spacing: 0.03rem;
}
}