webhadash

[DORMANT] hebrew website design
git clone git://git.figbert.com/webhadash.git
Log | Files | Refs

main.css (2560B)

      1 body {
      2     font-family: 'Rubik', sans-serif;
      3     text-align: right;
      4     margin: auto;
      5 }
      6 
      7 nav {
      8     background-color: #DEDEDE;
      9     padding: 10px;
     10     font-size: calc(15px + 0.5vw);
     11     display: flex;
     12     flex-direction: row-reverse;
     13     flex-wrap: wrap;
     14     justify-content: flex-start;
     15     align-items: center;
     16     position: fixed;
     17     top: 0;
     18     left: 0;
     19     z-index: 9999;
     20     width: 99%;
     21 }
     22 
     23 .nav__link {
     24     color: black;
     25     text-decoration: none;
     26     padding-left: 10px;
     27     padding-right: 10px;
     28     font-weight: 400;
     29 }
     30 
     31 .nav__link--currentPage {
     32     font-weight: 700;
     33 }
     34 
     35 .pageTitle {
     36     position: relative;
     37     text-align: center;
     38     color: white;
     39 }
     40 
     41 .pageTitle__image {
     42     width: 100%;
     43     height: 100vh;
     44     object-fit: cover;
     45 }
     46 
     47 .pageTitle__text {
     48     position: absolute;
     49     top: 50%;
     50     left: 50%;
     51     transform: translate(-50%, -50%);
     52 }
     53 
     54 .pageTitle__text--header {
     55     font-size: 12vw;
     56     font-weight: 900;
     57 }
     58 
     59 .pageTitle__text--subheader {
     60     font-size: 6vw;
     61     font-weight: 400;
     62 }
     63 
     64 .designBackground__div {
     65     position: relative;
     66 }
     67 
     68 .designBackground__img {
     69     width: 100%;
     70     height: 100vh;
     71     object-fit: cover;
     72 }
     73 
     74 .designBackground__text {
     75     position: absolute;
     76     top: 50%;
     77     left: 50%;
     78     transform: translate(-50%, -50%);
     79     font-weight: 700;
     80     font-size: 8vw;
     81 }
     82 
     83 .about {
     84     padding-top: 100px;
     85     padding-bottom: 100px;
     86     width: 100%;
     87     display: flex;
     88     flex-direction: row-reverse;
     89     justify-content: center;
     90     flex-wrap: wrap;
     91 }
     92 
     93 .about__div {
     94     text-align: center;
     95     flex-grow: 1;
     96     margin: 70px 50px 75px 50px;
     97 }
     98 
     99 .about__header {
    100     font-weight: 700;
    101     font-size: calc(20px + 1vw);
    102     color: black;
    103 }
    104 
    105 .about__main {
    106     color: black;
    107     font-size: calc(15px + 0.5vw);
    108     font-weight: 400;
    109 }
    110 
    111 .articlePreview {
    112     width: 100%;
    113     display: flex;
    114     flex-direction: row-reverse;
    115     flex-wrap: wrap;
    116     justify-content: center;
    117     padding-top: 100px;
    118     padding-bottom: 100px;
    119 }
    120 
    121 .articlePreview__div {
    122     text-align: center;
    123     flex-grow: 1;
    124     margin: 75px 50px 75px 50px;
    125 }
    126 
    127 .articlePreview__img {
    128     width: 230px;
    129     height: 230px;
    130     object-fit: cover;
    131     border-radius: 50%;
    132     border: 2px solid #021a40;
    133 }
    134 
    135 .articlePreview__desc {
    136     color: black;
    137     font-size: 25px;
    138     font-weight: 700;
    139 }
    140 
    141 .contact {
    142     text-align: center;
    143     padding-top: 150px;
    144     padding-bottom: 150px;
    145 }
    146 
    147 .contact__header {
    148     font-weight: 700;
    149     font-size: calc(20px + 0.75vw);
    150 }
    151 
    152 .contact__email {
    153     color: black;
    154     font-size: calc(15px + 0.125vw);
    155     text-decoration: underline;
    156 }