*{ padding: 0; margin:0; } .Link{ color:inherit; text-decoration: none; } .AuthPage{ display: flex; justify-content: center; min-width: 100%; height: 100vh; align-items: center; & .AuthForm{ min-width: 400px; } } .carousel { & .thumb { border: 1px solid rgba(0,0,0,0)!important; cursor:pointer; &:hover{ border:1px solid #C9C5CA!important; } } } .GoodCard{ & .BuyButton{ margin-left: auto; } } .DrawerCart{ width:350px; & .header{ justify-content: space-between; width: 100%; } & .header{ padding: 10px; } & .DrawerCartItem{ width:100%; display: flex; & .content{ flex:1; } & .buttons{ padding: 10px; display: flex; align-items: center; } } & .list{ } } .App{ & .Header{ margin-bottom: 30px; & .AppBar{ background: white; color:#6750A4; & .ToolBar{ padding-left: 50px; padding-right: 50px; & .Logo{ width:50px; height:50px; margin-right: 10px; } & .SearchBarWrapper{ flex-grow: 1; margin-left: 10px; & .SearchBar{ position: relative; & .SearchBarInput{ width: 100%; max-width: 500px; } & .SearchResults{ position: absolute; width: 100%; max-width: 480px; background: white; padding: 10px; z-index: 2; & .SearchGoodResultItem{ text-align: left; & img{ width:100%; max-height: 100px; } &:hover{ background: #F1F2F4; } } } } } & .CartIcon{ & .MuiBadge-badge{ right: 4px; top: 35px; padding: 0 4px; } & .CartLogo{ color:#6750A4; width:30px; height:30px; } } } } } & .Aside{ margin-left: 50px; & .body{ padding: 10px 0px 100px 0px; border-radius: 5px; border:1px solid #C9C5CA ; & .Categories{ } } } & .Content{ margin-left: 25px; margin-right: 50px; min-height: 600px; border-radius: 5px; flex:1; border:1px solid #C9C5CA ; & .MainPage{ padding: 10px; & .MainPageImage{ width: 1005; border-radius: 10px; } } & .CartPage{ & .OrderForm{ padding: 10px 15px; text-align: left; } } & .GoodPage{ padding:10px; & .content{ text-align: left; } } } & .Footer{ margin-top:70px; background-color: #F4EFF4; padding: 25px 0px; & .TableCell{ border-bottom: none; padding: 0; padding-top: 5px; } } }