*{
	margin: 0;
	padding: 0;
	font-family: sans-serif;
}


body{
	height: 100%;
}
/*Header*/
.container {
      width: 80%;
      max-width: 1000px;
      margin: 1em auto
    }

    .dropdown {
      display: inline-block;
      position: relative;
    }

    .dropdown-label {
      padding: 0.5em 2em 0.5em 1.5em;
      /*border: 1px solid #ccc;*/
      background-color:#f3f4f6/* #eee*/;
      color: #424144;
      font-size: 20px;
      font-weight: bold;
    }

    .dropdown-label::after {
      content: "";
      position: absolute;
      right: 1em;
      top: 1em;
      border: 0.3em solid;
      border-color: black transparent transparent;
      
    }
    .dropdown:hover .dropdown-label:after {
      top: 0.7em;
      border-color: transparent transparent black;
    }

    .dropdown-menu {
      display: none;
      position: absolute;
      left: 0;
      top: 2.1em;
      min-width: 100%;
      background-color: #eee;
    }
    .dropdown:hover .dropdown-menu {
      display: block;
    }

    .submenu {
      padding-left: 0;
      margin: 0;
      list-style-type: none;
      border: 1px solid #999;
    }

    .submenu > /*li*/ul + li {
      border-top: 1px solid #999;
    }

    .submenu > li > a {
      display: block;
      padding: .5em 1.5em;
      background-color:#f3f4f6/* #eee*/;
      color: #369;
      text-decoration: none;
    }

    .submenu > li > a:hover {
      background-color: /*#f3f4f6*/#fff;
    }
/*.dropdown-menu {
display: none;
position: absolute;
left: 0;
top: 2.lem;
min-width: 100%;
background-color: #eee;}
}
.dropdown:hover .dropdown-menu {
display: block;
}


.submenu {
padding-left: 0;
margin: 0;
list-style-type: none;
border; lpx solid #999;
}
.submenu > li + li {
border-top: lpx solid #999;
}
.submenu > li > a {
display: block;
padding: 0.5em 1.5em;
background-color: #eee;
color: #369;
text-decoration: none;
}
.submenu > li > a:hover {
background-color: #fff;
}*/

.menu-btn{
	color: #424144;
	font-size: 23px;
	cursor: pointer;
	display: none;
}

.navbar{
	padding: 20px 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: sticky;
	z-index: 999;
	background-color: #f3f4f6;
	box-shadow: 0 0 14px rgba(0, 0, 0, 0.3);
}

.navbar .logo h1{
	color: #424144;
	/*border-bottom: 4px solid#fd6561; /* подчеркивание логотипа*/
	font-size: 3.25rem;
}

.navbar .menu li {
	list-style: none;
	display: inline-block;
}

.navbar .menu li a {
	display: /*none;*/block;
	margin-left: 20px;
	color: #424144;
	/*border-bottom: 4px solid transparent;*/
	text-decoration: none;
	font-size: 20px;
	font-weight: bold;
}

.navbar .menu li .active{
	border-bottom: 4px solid #f63e4e;
}
.navbar .menu li a i {
	color: #f63e4e;
}
.navbar .menu li a:hover{
	border-bottom: 4px solid #f63e4e; /* цвет значка корзина*/	
}

/* Content*/

.content{
	background-image: url(img/Fil_2.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 0 5%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	color: #424144;
	height :70vh;
}

.content h1 {
	font-size: 60px;
	padding: 2em 1em;
    text-align: center;
    background-size: 100%;
    color: #fff;
    text-shadow: 0.1em 0.1em 0.3em #000;
    padding: 5em 3em;
        /*font-size: 1.2rem;*/
}
.content p{
	font-size: 40px;
	
	margin-top: 20px;
	color: #fff;

}

/*Products*/

.sec{
	padding: 10px 5%; 

}

.products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.products .card {
	width: 310px;
	background-color: #f5f5f5;
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
	border-radius: 5px;
	padding: 5px;
	margin-bottom: 20px;
}

.products .card img{
	height: 200px;
	width: 100%;
}

.products .card .desc{
	padding: 5px 20px;
	opacity: 0.8;
}

.products .card .title {
	font-weight: 900;
	font-size:  20px;
	color: #424144;
	padding: 0 20px;
}
.products .card .box {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px;
}


.products .card .box .price{
	color: #424144;
	font-size: 20px;
	font-weight: bold;
}

.products .card .box .stoc{
	color: #009B00;
	font-size: 20px;
	font-weight: bold;
}



.products .card .box .btn{
	font-size: 13px;
	color: #f63e4e;
	padding: 10px 18px;
	font-weight: 900;
	border: 1px solid #f63e4e;
	border-radius: 20px;
}

.products .card .box .btn:hover{
	cursor: pointer;
	background-color: #f63e4e;
	color: white;
}