198 lines
3.8 KiB
CSS
198 lines
3.8 KiB
CSS
|
|
a{
|
|
color: #1775BB;
|
|
}
|
|
|
|
#navbutton{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
border-radius: 10px;
|
|
font-size: large;
|
|
text-align: center;
|
|
margin-left: 5%;
|
|
margin-right: 5%;
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
background: #EFFF96;
|
|
font-size: 100%;
|
|
}
|
|
|
|
#selfportrait-container{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
border-radius: 10px;
|
|
margin-left: 1%;
|
|
margin-right: 1%;
|
|
margin-top: 5px;
|
|
margin-bottom: 10%;
|
|
font-weight: bold;
|
|
background: #EFFF96;
|
|
}
|
|
|
|
#selfportrait{
|
|
width: 100%;
|
|
margin-bottom:-15% ;
|
|
margin-top:-9%;
|
|
}
|
|
|
|
#navbutton:hover{
|
|
background: #FEFFCC;
|
|
}
|
|
|
|
#navbutton:active{
|
|
background: #102C22;
|
|
}
|
|
|
|
#navbuttonactive{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
border-radius: 10px;
|
|
font-size: large;
|
|
text-align: center;
|
|
margin-left: 5%;
|
|
margin-right: 5%;
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
background: #102C22;
|
|
font-size: 100%;
|
|
}
|
|
|
|
body{
|
|
background-color: #1E3B27;
|
|
background-image: url(./images/bubblebg.png);
|
|
background-attachment: scroll;
|
|
background-repeat: repeat;
|
|
color: #181917;
|
|
font-family: Georgia, 'Times New Roman', Times, serif;
|
|
}
|
|
|
|
|
|
#content-container{
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items:top;
|
|
margin-top: 10px;
|
|
margin-left: 10%;
|
|
margin-right: 10%;
|
|
height: auto;
|
|
margin-bottom: 10px;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
#content-header{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
text-align: center;
|
|
margin-left: 10%;
|
|
margin-right: 10%;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
margin-top: 2px;
|
|
background-color: #B3EB79;
|
|
}
|
|
|
|
#sidebar{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
position: -webkit-sticky; /* Safari */
|
|
position: sticky;
|
|
flex: 20%;
|
|
margin-right: 5px;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
background-color: #B3EB79;
|
|
max-width: 600px;
|
|
}
|
|
|
|
#main-content{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
flex: 80%;
|
|
margin-left: 5px;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
background-color: #B3EB79;
|
|
}
|
|
|
|
|
|
footer{
|
|
border: 4px 2px 2px 4px;
|
|
border-color: #181917;
|
|
border-style: double solid solid double ;
|
|
text-align: center;
|
|
margin-left: 10%;
|
|
margin-right: 10%;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
margin-top: 2px;
|
|
background-color: #B3EB79;
|
|
}
|
|
|
|
.logo{
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 50%;
|
|
max-width: 184px;
|
|
-ms-interpolation-mode:nearest-neighbor;
|
|
/*IE 7-11*/
|
|
image-rendering: -o-crisp-edges;
|
|
/*Opera 12*/
|
|
image-rendering: -webkit-crisp-edges;
|
|
/*Safari 6-9*/
|
|
image-rendering:-moz-crisp-edges;
|
|
/*Firefox 3.6-64*/
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/*Undersize.*/
|
|
|
|
@media only screen and (max-width: 800px) {
|
|
#content-header{
|
|
width: 100%;
|
|
display: block;
|
|
max-width: 100%;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
}
|
|
|
|
#content-container{
|
|
width: 100%;
|
|
display: block;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
}
|
|
#main-content{
|
|
width: 100%;
|
|
order: 1;
|
|
display: block;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
}
|
|
#sidebar{
|
|
width: 100%;
|
|
order: 2;
|
|
display: block;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
}
|
|
|
|
footer{
|
|
width: 100%;
|
|
max-width: 100%;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
}
|
|
}
|