The following files exists in this folder. Click to view.
wesstyle.css193 lines ASCII Unix (LF) 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
@font-face {
font-family: Rubik;
src: url(/fonts/Rubik-VariableFont_wght.ttf);
}
*{
box-sizing: border-box;
font-family: Rubik, sans-serif;
}
body{
margin: 0;
padding: 0;
background-color: rgb(247, 250, 241);
text-rendering: optimizeSpeed;
}
.navbar ul{
list-style-type: none;
padding: 0px;
margin: 0%;
overflow: hidden;
}
.navbar a{
color: black;
text-decoration: none;
padding: 15px;
display: block;
text-align: center;
font-size: 25px;
color: rgb(67, 24, 255);
text-shadow:
-2px -2px 0 black,
2px -2px 0 black,
-2px 2px 0 black,
2px 2px 0 black;
}
.navbar a:hover{
background-color: rgba(71, 71, 71, 0.21);
}
@media all and (min-width: 600px) {
.header{
width: 100vw;
height: 90vh;
display: flex;
flex-direction: column;
justify-content: center;
}
main img{
max-width: 500px;
}
.Momentholder{
min-width: 200px;
max-width: 200px;
min-height: 200px;
}
}
@media all and (max-width: 599px) {
.header{
width: 100vw;
display: flex;
flex-direction: column;
justify-content: center;
}
main p{
font-size: 1.5rem;
}
main img{
max-width: 80vw;
transform: translateX(10%);
}
.Momentholder{
width: 40vw;
height: 40vw;
}
}
#Iheader{
background: url(/webbutveckling/images/monkey.jpg) no-repeat center center/cover;
}
#Mheader{
background: url(/webbserver/wesbilder/USETHISONE.webp) no-repeat top/cover;
}
#Pheader{
background: url(/webbserver/wesbilder/serverrack.webp) no-repeat center/cover;
}
nav h1{
font-size: 50px;
color: rgb(67, 24, 255); /* Text color */
text-shadow:
-2px -2px 0 black,
2px -2px 0 black,
-2px 2px 0 black,
2px 2px 0 black;
}
main h2{
text-align: center;
padding: 10px;
}
main p{
padding: 1em;
margin: 1em;
}
main img{
border-radius: 50px;
float: left;
padding: 30px;
}
.bild{
position:fixed;
bottom:0;
right: 75vw;
width: 18rem;
display: none;
}
#teckna:hover #tbild{
display:block;
cursor: pointer;
}
#foto:hover #fbild{
display:block;
cursor: pointer;
}
#photoshop:hover #pbild{
display:block;
cursor: pointer;
}
#flim:hover #berry{
display: block;
}
#flim{
text-decoration: none;
color: black;
}
footer{
background-color: rgb(67, 24, 255);
clear: both;
padding: 3px;
width: 100vw;
}
footer p{
padding: 1em;
}
.Momentholder{
margin: 1em;
padding:1em;
background-color: rgb(67, 24, 255);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border: 2px solid black;
float: left;
}
.momentlink{
text-decoration: none;
color: black;
}
.Momentholder h3{
text-align: center;
transform: translateY(250%);
background-color: rgba(67, 24, 255, 0.744);
}
#M01{
background-image: url(/images/showcase/m02u01showcase.png);
}