H1QP2UNI0Q5

src/App — копия.css

@@ -0,0 +1,264 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+body {
+  margin: 0;
+}
+
+/*Всегда пишем:*/
+html {
+  box-sizing: border-box;
+}
+
+/*Всегда пишем:*/
+*,
+*::before,
+*::after {
+  box-sizing: inherit;
+}
+
+/*Всегда пишем:*/
+.wrapper {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+  min-height: 100vh;
+  /*задавливание футера вниз*/
+  display: flex;
+  /*задавливание футера вниз*/
+  flex-direction: column;
+  /*задавливание футера вниз*/
+}
+
+/*Всегда пишем:*/
+.container {
+  max-width: 1330px;
+  /*компенсация паддингов по 15рх*/
+  padding: 0 15px;
+  margin: 0 auto;
+}
+
+/*Всегда пишем:*/
+img {
+  max-width: 100%;
+  height: auto;
+  vertical-align: top;
+}
+
+/*Всегда пишем:*/
+ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+
+.section-skills {
+  padding: 100px 0 70px;
+}
+
+.section-skills .row {
+  display: flex;
+  align-items: center;
+  margin: 0 -15px;
+}
+
+.section-skills .col {
+  width: 50%;
+  padding: 0 15px;
+}
+
+.skill-holder .section-title {
+  margin: 0 0 50px;
+  font-size: 32px;
+  line-height: 1.15;
+}
+
+.skill-list {
+  max-width: 445px;
+  width: 100%;
+}
+
+.skill-item {
+  margin-bottom: 30px;
+}
+
+.skill-item:last-child {
+  margin-bottom: 0;
+}
+
+.skill-title {
+  font-size: 16px;
+  line-height: 1.6;
+  display: inline-block;
+  margin-bottom: 20px;
+  color: #727272;
+}
+
+.skill-loader {
+  position: relative;
+  height: 4px;
+  background: #c4c4c4;
+}
+
+.skill-load {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  background: #34547A;
+}
+
+.col-img {
+  background-position: center;
+  background-size: cover;
+  padding-top: 81%;
+}
+.my-work{
+  margin: auto;
+  position: relative;
+  background-color: lightgrey;
+}
+
+.my-work-text {
+  margin: auto;
+  text-align: center;
+  max-width: 40%;
+  font-size: 32px;
+}
+
+.my-work-video {
+  position: relative;
+  display: flex;
+  flex-wrap: nowrap;
+  
+}
+.video-main{
+  position: relative;
+  display: flex;
+  padding-bottom: 100px;
+  margin: auto;
+}
+.button-play{
+  position: absolute;
+  left: 48%;
+  top: 38%;
+}
+
+.section-gallery {
+  position: relative;
+  max-width: 1330px;
+  margin: auto;
+  background-color: #727272;
+
+}
+
+.gallery-list {
+  display: flex;
+  flex-wrap: wrap;
+
+}
+
+.gallery-item {
+  display: block;
+  height: 100px;
+  width: 25%;
+  padding-top: 25%;
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  position: relative;
+}
+
+.gallery-item:before {
+  content: '';
+  position: auto;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  background: rgba(52, 84, 122, 0.8);
+
+}
+
+.gallery-item:after {
+  content: '';
+  height: 58px;
+  width: 100px;
+  background: url('img/eye.png');
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.gallery-item:before,
+.gallery-item:after {
+  opacity: 0;
+  visibility: hidden;
+}
+
+.gallery-item:hover:before,
+.gallery-item:hover:after {
+  transition: opacity .3s ease-in-out;
+  opacity: 1;
+  visibility: visible;
+}
+.clients{
+  position: relative;
+  display: flex;
+  flex-wrap: nowrap;
+  max-width: 1330px;
+  height: 40%;
+  margin: auto;
+ 
+}
+.client-logo{
+ 
+  max-width: 15%;
+  justify-content: space-around;
+  flex-direction: row;
+  align-self: center;
+  margin: auto;
+}

src/App.js

@@ -14,6 +14,7 @@
           <Footer />
         </WrapperMain>
       </Wrapper>
+      
 */
 
 import logo from './logo.svg';