init

css/index/about_us.css

@@ -0,0 +1,94 @@
+.about-us{
+    margin-top: -6em;
+    margin-bottom: -3em;
+    padding-top: 5em;
+    padding-bottom: 5em;
+
+    clip-path: polygon(0 93%, 19% 93%, 27% 106%, 50% 106%, 56% 98%, 76% 98%, 79% 93%, 100% 93%, 100% 7%, 79% 7%, 73% -6%, 50% -6%, 44% 2%, 24% 2%, 21% 7%, 0 7%);
+
+    width: 100%;
+    position: relative;
+    display: flex;
+    z-index: 5;
+    flex-direction: column;
+    background: url(/img/sluzby-background.jpg) no-repeat center center, rgb(255 255 255 / 90%);
+    background-blend-mode: overlay;
+    background-size: cover;
+
+
+}
+
+.about-us div img{
+    -webkit-transition: transform 0.5s ease; 
+    -moz-transition: transform 0.5s ease; 
+    -ms-transition: transform 0.5s ease; 
+    -o-transition: transform 0.5s ease; 
+    transition: transform 0.5s ease;
+    width: 5em;
+}
+
+.about-us div img:hover{
+    transform: scale(1.2);
+}
+
+
+.about-us .sluzby{
+    width: 25em;
+    margin: auto;
+    margin-top: 2em;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 3em;
+    justify-content: center;
+    align-items: center;
+}
+
+.about-us-big{
+    display: none;
+}
+.about-us-small{
+    margin: auto;
+    width: 90%;
+    display: flex;
+    flex-direction: column;
+}
+.about-us-small header{
+    text-align: center;
+    margin: auto;
+    width: 80%;
+}
+.about-us-small header hr{
+    height: 0;
+    border-style: solid;
+}
+
+.about-us-small main{
+    margin: auto;
+    width: 80%; 
+}
+.about-us-small h2{
+    font-size: 1.2em;
+    text-align: center;
+}
+.about-us-small main p{
+    text-align: center;
+    margin: 1em;
+}
+
+
+@media screen and (max-width: 1000px){
+    .about-us .sluzby{
+        width: 100%;
+    }
+    .about-us div img{
+        width: 8em;
+    }
+    .about-us {
+        margin-top: -5em;
+        margin-bottom: -5em;
+        padding-top: 5em;
+        padding-bottom: 5em;
+        clip-path: polygon(0% 99%, 10% 99%, 39% 99%, 63% 95%, 100% 95%, 100% 90%, 100% 2%, 90% 2%, 65% 2%, 35% 5%, 0% 5%, 0% 10%);
+    }
+}