* {
	padding: 0px;
	margin: 0px;
	border: 0px;
	outline:none;
	box-sizing:border-box;
	position:relative;
}
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  --scrollbarBG: transparent;
  --thumbBG: var(--blue2);
}

::-webkit-scrollbar {
  width: 5px;
}

body {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 4px solid transparent;
}

::-moz-selection {
	color: var(--blue2);
	background: var(--yellow);
}

::selection {
	color: var(--blue2);
	background: var(--yellow);
} 

:root {
  --white: #f1f6f4;
  --white2: #d9e8e2;
  --yellow: #ffc800;
  --yellow2: #ff9700;
  --blue: #114c5a;
  --blue2: #172b36;
}

body{
	font-family: 'Gilroy', Arial, sans-serif;
	font-weight: 400;
	color: var(--blue2);
}

.wrapper{
	padding-left:15px;
	padding-right:15px;
	max-width:1280px;
	margin:0 auto;
	width:100%;
}
.burger{
	display: none;
}
.btn{
	background-color: var(--yellow);
    text-decoration: none;
    color: var(--blue2);
    display: inline-block;
    border-radius: 4px;
    font-weight: 700;
    padding: 0 20px;
    font-size: 18px;
    line-height: 48px;
	transition: .2s;
}

.btn:hover{
	background-color: var(--blue2);
	color:var(--white);
}

.btn:active{
	background-color: var(--blue);
}


.btn2{
	background-color: var(--blue2);
	color:var(--white);
    text-decoration: none;
    display: inline-block;
    border-radius: 4px;
    font-weight: 700;
    padding: 0 20px;
    font-size: 18px;
    line-height: 48px;
	transition: .2s;
}

.btn2:hover{
	background-color: var(--blue);
}

.btn2:active{
	background-color: var(--yellow);
	color:var(--blue2);
}

.btn.sm, .btn2.sm{
    font-size: 14px;
    line-height: 38px;
}

a{
	text-decoration: none;
	color:var(--yellow2);
}



a.logo img{
	display: block;
	height: auto;
	max-width: 120px;
}
header{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top:30px;
	padding-bottom: 30px;
}

header nav ul{
	list-style: none;
	display: flex;
	align-items: center;

}

header nav ul li{
	padding: 0 20px;
}

header nav ul li a{
	font-size: 18px;
	font-weight: 500;
	color: var(--blue2);
	transition: .2s;
    text-transform: lowercase;
}

header nav ul li a:hover{
	color:var(--yellow2);
	transition: .2s;

}
header nav ul li.all a{
	color:var(--yellow2);
	font-weight: bold;
}

header nav ul li.all:hover{
	opacity: .9;
}
header nav ul li.all:before{
	content:'';
	transform: rotate(0);
	transition: .2s;
	position: absolute;
	left:-15px;
	top:0;
	width:24px;
	height:24px;
	background-image: url(../img/gift2.svg);
	background-size: contain;
	background-repeat: no-repeat;
}
header nav ul li.all:hover:before{
    transform: rotate(-15deg);
}
.slider{
	position: relative;
	background-color: var(--white);
	background-image: url(../img/bigbg.webp);
    background-size: cover;
    background-position: 0 55%;
	padding-top:50px;
	padding-bottom: 50px;
	overflow: hidden;
}
.slider:before{
	content:'';
	background-color: var(--white);
	background-size: contain;
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: .12;
}
h2 {
    font-size: 26px;
    margin-bottom: 25px;
    font-weight: bold;
}
.slider h1{
    font-size: 50px;
    font-weight: bold;
    line-height: 1;
}
.slider h1 + p{
	font-size: 20px;
	margin: 25px 0;
    max-width: 624px;
}
.slider h1 + p span{
	color:var(--yellow2);
	font-weight: 600;
}
.sert-list{
	display: flex;
	justify-content: space-between;
}
.home .sert-list{
	margin-bottom: 50px;
}
.sert{
	flex:0 0 24%;
    margin-bottom: 25px;
    margin-right: 20px;
}
.logotype {
	display: flex;
	align-items: center;
	justify-content: center;
    border-radius: 24px;
	height:150px;
	opacity: 1;
	transition: .2s;
}
.logotype img{
	display: block;
    max-width: 65%;
	max-height: 80%;
}
.blog .slider,
.cert .slider{
	background-image: none;
    padding-bottom: 0px;
}
.blog .blog-list a {
    margin-bottom: 20px;
}
.blog-cats ul{
	list-style: none;
	display: flex;
    padding-top: 10px;
    flex-wrap: wrap;
}
.tabs {    
	background-color: #fff;
    padding: 0 20px 20px;
	border-radius: 0 0 32px 32px;
}
.tabs p {
    margin: 10px 0;
    font-size: 17px;
    line-height: 1.5;
}
.tabs h3{
    margin-bottom: 20px;
    text-transform: uppercase;
    font-weight: 700;
    padding-top: 30px;
}
.blog-cats ul a{
    display: block;
    border:1px solid #cdcdcd;
    color: #4a5c61;
    padding: 10px;
    border-radius: 4px;
    margin-right: 10px;
	transition: .2s;
	margin-bottom: 4px;
}
.blog-cats ul li:last-child a{
	margin-right: 0;
}
.blog-cats ul a:hover,
.blog-cats ul li.active a{
	background-color: var(--blue2);
	color:var(--white2);
}
.blog .breadcrumbs,
.cert .breadcrumbs{
    padding-bottom: 10px;
}
.breadcrumbs ul{
    display: flex;
    padding-top: 20px;
    list-style: none;
    flex-wrap: wrap;
    font-size: 14px;
}
.breadcrumbs ul li{
	padding-right: 20px;
}
.breadcrumbs ul li:last-child {
    padding-right: 0;
}
.breadcrumbs ul li:after{
	content: '/';
	font-size: 14px;
	position: absolute;
	right:6px;
	top:0;
    color: #a2a2a2;
}
.breadcrumbs ul li:last-child:after{
	display: none;
}
.breadcrumbs a{
    color: var(--blue2);
}
.breadcrumbs a:hover{
	color: var(--yellow2);
}
.sertificat{
	background-color: var(--white);
	padding-bottom: 30px;
}
.sertificat .wrapper{
	padding-top: 20px;
}
.main-info{
	background-color: #fff;
	padding: 20px;
	border-radius: 32px 32px 0 0;
	display: flex;
    align-items: center;
}
.article{
	background-color: var(--white);
    padding-top: 20px;
    padding-bottom: 50px;
}
.article .content{
	background-color: #fff;
	padding: 20px;
	border-radius: 32px;
    font-size: 17px;
    line-height: 1.5;
}
.article .content .meta{
    display: flex;
    align-items: center;
    font-size: 16px;
    opacity: .8;
}
.article .content .meta svg{
	width:24px;
	height: 24px;
    fill: var(--blue2);
	margin-left: 10px;
}
.article .content p{
    margin: 10px 0;
    font-size: 17px;
    line-height: 1.5;
}
.article .content .main-image{
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
	border-radius: 24px;
	max-width: 400px;
	width: 100%;
	height: auto;
}
.sertificat .logotype{
	width: 300px;
	margin-right: 30px;
	flex:0 0 300px;
	height: 300px;
}
.sertificat div.bottom{
    padding-top: 15px;
}
.sertificat div.bottom p{
    font-weight: 300;
    font-size: 16px;
    margin-bottom: 10px;
}
.sertificat .desc p{
	font-size: 18px;
	margin: 0 0 15px;
}
.sertificat .desc li {
    font-size: 18px;
    margin: 4px 0px 9px 18px;
}
.sertificat .desc li span{
	font-weight: 600;
}
.sertificat .desc li a{
	font-weight: 500;
}
.sertificat .desc li a:hover{
	color: var(--yellow);
}
.sert span{
	color:var(--blue2);
    font-size: 18px;
    transition: .2s;
    font-weight: 500;
    display: block;
    margin-top: 10px;
}
.sert:hover .logotype{
	opacity: .85;
}
.sert:hover span{
	color: var(--yellow2);
}
.catli{
	display: flex;
	justify-content: space-between;
}
.catli + .btn-stroke{
	text-align: center;
	margin-bottom: 50px;
}
.catli .shops{
	position: relative;
	flex: 0 0 24%;
	background-image: url(../img/seller.webp);
	background-size: cover;
	background-position: 50% 50%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 20px;
	padding: 15px;
}
.catli .shops:after{
	content:'';
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color: #ededeb;
    opacity: .8;
}
.catli .shops a{
	flex:0 0 49%;
	position: relative;
    color: var(--blue2);
	z-index: 1;
}
.catli .right > div:after{
	content:'';
	position: absolute;
	top:0;
	left:0;
	width:100%;
    border-radius: 4px;
	height:100%;
	background-color: #000;
	opacity: .4;
}
.catli .right > div:nth-child(odd) span {
    color: var(--white);
}
.catli .right > div:nth-child(even):after{
	background-color: #ededeb;
    opacity: .8;
}
.catli .shops span{	
    flex: 0 0 100%;
}
.catli span{
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 15px;
	position: relative;
	z-index: 1;
}
.catli .right > div:nth-child(even) a{
    color: var(--blue2);
}
.catli a{
	position: relative;
	z-index: 1;
    color: var(--white);
    padding: 4px 0px;
    text-transform: lowercase;
}
.catli a:hover{
	color: var(--yellow);
}
.catli .right > div:nth-child(even) a:hover,
.catli .shops a:hover{
	color: var(--yellow2);
}
.catli .right{
	flex: 0 0 75%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.catli .right div{
	flex:0 0 32%;
	margin-bottom: 20px;
	padding: 15px;
	position: relative;
    flex-direction: column;
    display: flex;
    align-items: flex-start;
	background-size: cover;
	background-position: 50% 50%;
    border-radius: 4px;
}
.categories{
	padding-top: 50px;
	padding-bottom: 50px;	
    overflow-x: hidden;
}
.cat-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    margin-bottom: 20px;
}
.cat-list a{
	flex:0 0 24%;
	margin-bottom: 25px;
	text-align: center;
	transition: .2s;
	opacity: 1;
}
.cat-list a:hover{
	opacity: .9;
}
.cat-list a img{
	display: block;
	max-width: 100%;
	height: auto;
	margin-bottom: 10px;
}
.cat-list a span{
	color:var(--blue2);
	font-size: 18px;
	transition: .2s;
}
.cat-list a:hover span{
	color:var(--yellow2);
}
.pagination{
	padding-top: 20px;
}
.pagination ul{
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: center;
}
.pagination ul li {
	margin: 0 5px;
}
.pagination ul li a{
	display: block;
	width:32px;
	height:32px;
	line-height: 32px;
	text-align: center;
	background-color: var(--yellow2);
	color: #fff;
	font-size: 16px;
	border-radius: 4px;
	transition: .2s;
}
.pagination ul li a:hover{
	background-color: var(--blue2);
}
.pagination ul li span{
	background-color: #fff;
	border-radius: 4px;
	font-size: 16px;
	display: block;
	width:32px;
	height:32px;
	line-height: 32px;
	text-align: center;
}
.blog-preview{
	background-color: var(--white);
	padding-top: 50px;
	padding-bottom: 50px;
}
.article + .blog-preview{
	padding-top: 0;
}
.blog-preview .btn-stroke{
	text-align: center;
	margin-top: 25px;
}
.blog-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

}
.blog-list a{
	flex:0 0 32%;
}

.blog-list a{
	background-color: #fff;
}
.blog-list a img{
	display: block;
	max-width: 100%;
	height: auto;
	opacity: 1;
	transition: .2s;
}

.blog-list a .desc{
	padding: 40px 30px;
}
.blog-list a .cat{
	color:var(--blue2);
	text-transform: uppercase;
	margin-bottom: 15px;
	display: block;
	opacity: .5;
    font-size: 13px;
    letter-spacing: 1.5px;
}
.blog-list a .title{
	color:var(--blue2);	
    font-size: 20px;
    display: block;
	transition: .2s;
}
.blog-list a:hover .title{
	color:var(--yellow2)
}
.blog-list a:hover img{
    opacity: .85;
}
footer{
	padding-top:50px;
	padding-bottom: 20px;
	background-color: var(--blue2);
	color: var(--white2);
}
footer .wrapper{	
    display: flex;
    justify-content: space-between;
}
footer .wrapper .col{
	flex:0 0 13%;
}
footer .wrapper .col li{
	list-style: none;
    margin-bottom: 10px;
}
footer .wrapper .col li a{
	font-size: 16px;
	color:var(--white);
}
footer .wrapper .col li a:hover{
	color:var(--yellow);
}
footer .wrapper .col:nth-child(1){
	flex:0 0 60%;
}
footer .wrapper .col:nth-child(1) ul{
	display: flex;
	flex-wrap: wrap;
}
footer .wrapper .col:nth-child(1) ul li{
	flex:0 0 19%;
}
footer .col p{
	color:var(--white2);
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 300;
    margin-bottom: 20px;
}
footer .bottom{
	border-top: 1px solid var(--blue);
    font-size: 14px;
    margin-top: 40px;
    padding-top: 20px;
}
footer .bottom a{
	color:var(--yellow);
}
footer .bottom a:hover{
	color: var(--yellow2);
}

@media (max-width:980px){
	header {
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.burger{
		display: block;
	}
	.burger svg{
		width:39px;
	}
	header .btn2, header nav{
		display: none;
	}
	.open header .btn2, .open header nav{
		display: block;
	}
	.open header{
        flex-direction: column;
        position: fixed;
        z-index: 9;
        background: rgba(255,255,255,.95);
        height: 100%;
	}
	.open header nav ul li {
		padding: 14px;
	}
	.open .burger{
		position: absolute;
		top: 15px;
		right:15px;
	}
	
	.open .logo{
		position: absolute;
		top: 15px;
		left:15px;
	}
	body.open{
		overflow: hidden;
	}
	.open header nav{
		flex: 1;
	}
	.open header nav ul li.all:before {
	    left: -20px;
    	top: 12px;
	}
	.open header .btn2.sm {
		font-size: 18px;
		line-height: 50px;
	}
	.open header nav ul {
		align-items: center;
		flex-direction: column;
        height: 100%;
		justify-content: center;
	}
	.catli .right div {
    	flex: 0 0 48%;
	}
	.catli .right {
    	flex: 0 0 66%;
	}
	.catli .shops {
	    flex: 0 0 32%;
	}
}

@media (max-width:800px){	
	.sertificat .logotype {
		width: 200px;
		flex: 0 0 200px;
		height:200px;
	}
	.main-info {
		align-items: flex-start;
	}
	footer .wrapper .col:nth-child(1) ul li {
		flex: 0 0 32%;
	}
	footer .wrapper .col:nth-child(1) {
		flex: 0 0 52%;
	}
	footer .wrapper .col {
		flex: 0 0 15%;
	}
}

@media (max-width:768px){
	.blog .blog-preview {
    padding-top: 20px;
	}
	.blog .slider {
		background-image: none;
		padding-bottom: 0;
	}
	.slider h1 {
    	font-size: 33px;
	}
	.slider h1 + p {
		font-size: 20px;
		max-width: 400px;
	}
	.blog-list a .desc {
		padding: 20px 15px;
	}
	.blog-list a .title{
		font-size: 18px;
	}
}
@media (max-width:767px){
	.catli{
		flex-wrap: wrap;
	}
	.catli .shops {
        flex: 0 0 100%;
    }
	.catli .right{
        flex: 0 0 100%;

	}
	.catli .shops a {
    	flex: 0 0 32%;
	}
	footer .wrapper {
		flex-wrap: wrap;
	}
	footer .wrapper .col:nth-child(1) {
		flex: 0 0 100%;
		margin-bottom: 30px;
	}
	footer .wrapper .col {
		flex: 0 0 33%;
	}
	footer .wrapper .col:nth-child(1) ul li {
        flex: 0 0 33%;
    }
	footer .bottom span{
		display: none;
	}
	footer .bottom a{		
		display: block;
		margin-top: 5px;
	}
}

@media (max-width:680px){
	.article .content .main-image {
		float: none;
		margin-right: 0;
		max-width: 500px;
	}
}

@media (max-width:640px){
	.cat-list a {
		flex: 0 0 48%;
	}
	.cat-list a span {
	    font-size: 16px;
	}
	.slider:before {
		opacity: .62;
	}
}
@media (max-width:639px){
	.main-info {
		flex-direction: column;
	}
	.sertificat .logotype {
        width: 100%;
        max-width: none;
		margin-right: 0;
		margin-bottom: 20px;
	}
}

@media (max-width:550px){
	.slider {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.home .slider {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	.catli .right > div:after {
		opacity: .8;
	}
	.catli a {
		font-size: 14px;
	}
	footer .col p {
		font-size: 12px;
		margin-bottom: 15px;
	}
	footer .wrapper .col li a {
    	font-size: 14px;
	}
	.blog-list{
		flex-wrap: wrap;
	}
	.blog-list a {
		flex: 0 0 100%;
		margin-bottom: 20px;
	}	
	.blog-list a:last-child{
		margin-bottom: 0;
	}
	.sert .logotype {
		border-radius: 20px;
		height: 100px;
	}
}
@media (max-width:480px){
	.catli .shops a {
        flex: 0 0 48%;
    }
	.catli span {
    	font-size: 16px;
	}
	.catli .right div,
	.catli .shops {
   		padding: 12px 8px;
        margin-bottom: 10px;
	}
}
@media (max-width:450px){
	.slider h1 {
        font-size: 26px;
    }
	.slider h1 + p {
        font-size: 17px;
    }
	.categories .btn{
		width:100%
	}
	.sert span {
		font-size: 16px;
		margin-top: 6px;
	}
	.sertificat .desc li {
   		font-size: 16px;
	}
}

@media (max-width:370px){
	.main-info{
		padding: 10px;
	}
	.tabs p {
		font-size: 16px;
		line-height: 1.3;
	}
	.tabs {
	    padding: 0 10px 10px;
	}
	.sertificat .desc li {
    	font-size: 16px;
	}
	.slider h1 {
        font-size: 24px;
    }
	h2 {
		font-size: 20px;
		margin-bottom: 20px;		
        max-width: 170px;
        line-height: 1.1;
	}
	.sertificat .logotype {
        flex: 0 0 150px;
        height: 150px;
    }
	.article .content {
	    padding: 15px;
	}
}

@media (max-width:340px){
	.slider h1 {
        font-size: 22px;
    }
}