Homework/js/18_redux-thunk-3/style.css

a {
   display: block;
   text-decoration: none;
}

a.btn {
   width: max-content;
}

img {
   max-width: 300px;
}


.wrapper {
   display: flex;
   flex-direction: column;
}


header {
   display: flex;
   align-items: center;
   height: 60px;
}

.head-info {
   display: flex;
   justify-content: space-between;
   align-items: center;
   height: 100%;
   flex: 0 1 90%;
   padding: 0 20px;
}

.logo {   
   flex: 0 1 10%;
   padding: 0 20px;
}

.catBtn {
   width: 100%;
   min-height: 40px;
   margin: 5px 0;   
   text-align: start;
   padding: 5px;
}

.logBtn {
   margin: 10px;
}

   #mainContainer {
      display: flex;
   }

   #aside {
      flex: 0 1 30%;
      padding: 0 5px;
   }

   #main {
      flex: 0 1 70%;
      padding: 0 5px;
      display: flex;
      flex-direction: column;
      align-items: center;
   }


.form {
   margin: 50px auto;
}

.cardBody {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: start;
   align-items: start;
}

   .goodCard {
      flex: 0 1 25%;
      padding: 10px;
      margin: 20px;
   }

   .goodCard .btn {
      margin: 5px;
   }

.catBody .catHead {
   max-width: max-content;
   margin: 10px auto;
}

.goodPage {
   padding: 10px;
   margin: 20px;
}



.cartPage {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: stretch;
}

.cartCard {
   flex: 0 1 50%;
   margin: 10px;
}

.cartCard .inputGr {
   margin: 10px 0;
}

.cartCard .btn {
   margin: 10px 0 10px auto;
}

.cartCard .inputGr .btn {
   margin: 5px;
}
.cartCard .inputGr input {
   height: 100%;
   max-width: 50%;
}

.cartBtn {
   margin: 20px auto;
}