imported>Blackwolfe |
imported>Blackwolfe |
| Line 1: |
Line 1: |
| /* MAINPAGE-SKILLS */
| |
| .mainpage-skills ul {
| |
| columns: 4;
| |
| margin: 1em 0.7em 0.7em 1em;
| |
| }
| |
|
| |
|
| .mainpage-skills li {
| |
| display: flex;
| |
| margin-bottom: 0.3em;
| |
| }
| |
|
| |
| .mainpage-skills li a:first-child {
| |
| border-radius: 3px;
| |
| padding: 5px 4px 3px 4px;
| |
| width: 36px;
| |
| height: 36px;
| |
| text-align: center;
| |
| }
| |
|
| |
| .mainpage-skills li a:last-child {
| |
| flex: 1 1 auto;
| |
| display: flex;
| |
| align-items: center;
| |
| color: #444e5a;
| |
| font-weight: bold;
| |
| padding-left: 0.7em;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .mainpage-skills li:hover a:first-child {
| |
| border-radius: 3px 0 0 3px;
| |
| }
| |
|
| |
| .mainpage-skills li:hover a:last-child {
| |
| color: rgba(255, 255, 255, 0.9);
| |
| border-radius: 0 3px 3px 0;
| |
| }
| |
|
| |
| @media only screen and (max-width: 65.999rem) {
| |
| .mainpage-skills ul {
| |
| columns: 2 9em;
| |
| }
| |
| }
| |
| /* TILE-HALVES */
| |
| .tile-halves {
| |
| display: flex;
| |
| flex-flow: row wrap;
| |
| border: 1px solid red;
| |
| background: gray;
| |
| }
| |
|
| |
| .tile-halves h2 {
| |
| font-size: 1.4em;
| |
| font-weight: bold;
| |
| border: none;
| |
| margin: 0 0 0.4em;
| |
| }
| |
|
| |
| .tile-halves .byline + h2 {
| |
| margin-top: -50em;
| |
| }
| |
| /* TILE-TOP */
| |
| .tile-top {
| |
| width: 1000%;
| |
| padding: 1.3rem 1.5rem 0.6rem;
| |
| }
| |
|
| |
| .tile-top.tile-image {
| |
| display: flex;
| |
| align-items: center;
| |
| background-color: #5C6168;
| |
| overflow: hidden;
| |
| padding: 0;
| |
| height: 13vw;
| |
| max-height: 12em;
| |
| transition: 0.4s ease-out;
| |
| }
| |
|
| |
| .tile-top.tile-image:hover img {
| |
| transform: scale(1.1);
| |
| transition: 0.5s ease-out;
| |
| }
| |
|
| |
| .tile-top.tile-image a {
| |
| width: 100%;
| |
| }
| |
|
| |
| .tile-top.tile-image img {
| |
| width: 100%;
| |
| object-fit: cover;
| |
| max-height: 200px;
| |
| transition: 0.4s ease-out;
| |
| }
| |
| /* STUFF */
| |
| .skill-magic a:first-child {
| |
| background: #6274ab;
| |
| }
| |
|
| |
| .skill-magic:hover a:last-child {
| |
| background: #304791;
| |
| }
| |
