/* ================================= MAIN =================================*/
html, body {height:100%;}
body { background:#FFFBF7; margin:0; padding:0; font-size:20px; font-family: Times New Roman, serif; color:#212529; min-height:100%; height:auto!important; height:100%; position:relative; line-height: 30px;}
img {border:none; outline:none;}
.clear { clear:both; font-size:0; line-height:0;}

/*font-family: 'Aclonica', sans-serif;
font-family: 'Arapey', serif;*/

h1 {font-family: 'Aclonica', sans-serif; font-size:34px; color:#ffffff; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);}
h2 {font-family: 'Arapey', serif; font-size:34px; text-transform: uppercase;}
h3 {}
h4 {}
h5 {}
h6 {}

#container {margin:0 auto; padding:0; position: relative; overflow:hidden; background: url('/catalog/view/theme/cleanstyle/images/bg.png') repeat left top;}
/* ================================= header =================================*/
.home {background: url('/catalog/view/theme/cleanstyle/images/home.png') no-repeat center center; height: 800px; position: relative; z-index: 100;}

.btn {padding: 10px 20px; text-transform: uppercase; font-weight: 600;}

.btn-primary {background: #C2D55E; color: #212529; border:2px solid #C3DA4C;}
.btn-primary:first-child:active {background: #C4E41A;}
.btn-primary:focus-visible {background: #C4E41A; box-shadow: 0 0 0 0.25rem rgba(139, 175, 10, 0.5);}
.btn-primary:hover {background: #E2FD55; color: #212529; border:2px solid #BADC07;}
.btn-primary.active, .btn-primary:active {background: #D6FF00!important; color: #212529!important; border:2px solid #C3E413!important;}

.btn-secondary {background: #238dde; color:#ffffff; border:none;}
.btn-secondary:first-child:active {background: #565e64; color:#ffffff!important;}
.btn-secondary:focus-visible {background: #D1D1D1; box-shadow: 0 0 0 0.25rem rgba(240, 240, 217, 0.5);}
.btn-secondary:hover {background: #ffffff; color:#212529; border:none;}

.btn-default {background: #ffffff; color:#212529; border:2px solid #C2D55E;}
.btn-default:first-child:active {background: #F0F0D9;}
.btn-default:focus-visible {background: #F0F0D9; box-shadow: 0 0 0 0.25rem rgba(240, 240, 217, 0.5);}
.btn-default:hover {background: #C2D55E; color:#212529; border:2px solid #A3B449;}

.homeImage {width: 100%; min-height: 150px; z-index: 90; position: absolute; left: 0px; top: 0px;}
.detailsImage {width: 100%; min-height: 150px; z-index: 90; position: absolute; left: 0px; top: 0px;}
.detailsImage img {width: 200%; margin-left:-50%;}
.mainImage {width: 100%; min-height: 150px; z-index: 90;}
.mainImage img {width: 200%; margin-left:-50%;}

.mainTitle {position: relative; z-index: 106; margin-top:100px;}

.bookTitle {min-height: 240px;}
.bookTitle h1 {position: relative; z-index: 106; margin-top:140px; background: rgba(33, 37, 41, 0.80); display: inline-block; padding: 10px; font-size: 20px;}

.top {position: fixed; top: 0px; left: 0px; width: 100%; z-index: 115; background: linear-gradient(180deg, rgba(33, 37, 41, 0.70) 0%, rgba(33, 37, 41, 0.00) 100%); height: 100px; transition: background 1s; animation: gradient 15s ease infinite;}
.top::before {transition: background .5s;content: ''; width: 100%; height: 100px; background: rgba(33, 37, 41, 0); position: absolute; left: 0px; top:0px; height: 100px; display: block;}
.top.active {}
.top.active::before {background: rgba(33, 37, 41, 1.0);}
.top .logo {margin: 20px 0; height: 60px;}
.top .logo img {height: 100%;}
.top .container {position: relative; z-index: 102;}
.top .menu {margin:10px 0; background: #ffffff; padding: 30px; border-radius: 8px; box-shadow:0 0.5rem 1rem rgba(0, 0, 0, .15); display: none;}
.top .menu li {list-style: none; display: block;}
.top .menu li a {display: inline-block; color: #212529; text-decoration: none; line-height: 40px; padding: 0 10px; transition: color .3s; font-size: 18px;}
.top .menu li a:hover {color:#A8D30D;}
.top .menu li a.active {color:#A8D30D;}

.top .social {margin: 10px 0px; position: relative; z-index: 102; padding: 10px 0; background: #ffffff; border-radius: 8px; box-shadow:0 0.5rem 1rem rgba(0, 0, 0, .15); display: none;}
.top .social li {list-style: none; display: inline-block;}
.top .social li a {display: inline-block; color: #212529; text-decoration: none; line-height: 40px; padding: 0 10px; font-size: 18px; transition: color .3s;}
.top .social li a:hover {color:#A8D30D;}
.top .navButton {line-height: 100px; color:#ffffff; cursor: pointer;}

.welcome {font-size: 20px; margin-top: 0px;}
.welcome p {margin-bottom:0px;}

.about img {border-radius:20px;}

.list {}
.list h2 {font-size: 34px;}
.list .item i {width: 40px; text-align: center; margin-right: 5px; font-size: 18px;}
.list .item a {text-decoration: none; color:#212529; transition: color .3s, background .3s;}
.list .item a:hover {color:#212529;}
.list p {margin-bottom: 5px;}

.item .name {font-size: 48px; font-weight: bold; line-height: 56px;}
.item .description {font-size: 20px;}
.item .image img {border-radius: 20px;}

.recently {}
.recently .item {}
.recently .item .image {}
.recently .item .image img {border-radius: 20px;}
.recently .item .title {font-weight: bold; font-size: 24px;}

.green {background: url('/catalog/view/theme/cleanstyle/images/green.png') no-repeat center top; padding-top:40px;}

.bgGreen {background: #C2D55E;}
.bgGreen p b {display: inline-block; width: 100px;}

.contacts {}
.contacts li {}
.contacts li i {width: 40px; height: 40px; border:1px solid #c4c4c4; border-radius: 5px; line-height: 38px; text-align: center;}
.contacts li a {text-decoration: none; color:#212529; display: inline-block;}

/* ================================= content =================================*/
.g-recaptcha > div {text-align: center; margin:0 auto;}

/* ================================= footer =================================*/
.footer {}
.footer a {transition: color .3s;}
.footer a:hover {color:#A8D30D;}
.footer .logo {margin: 20px 0; height: 60px;}
.footer .logo img {height: 100%;}
.footer ul li {list-style: none; display: inline-block;}
.fmenu li {list-style: none; display: inline-block; width: 100%;}
.footer ul li a {color:#ffffff; text-decoration: none; padding: 0 10px;}





/*  SM  Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
	
}

/*  MD  Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
	
}

/*  LG  Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
	h1 {font-size:64px; color:#ffffff; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);}
	h2 {font-size:64px;}

	.top .menu {margin:0; background: transparent; padding: 30px 0; border-radius: 8px; display: inline-block; box-shadow: none;}
	.top .menu li {list-style: none; display: inline-block;}
	.top .menu li a {color: #ffffff;}

	.top .social {margin: 0px; position: relative; z-index: 102; padding: 30px 0; background: transparent; border-radius: 8px; display: inline-block; box-shadow: none;}
	.top .social li a {color: #ffffff;}

	.mainImage {height: 440px; position: absolute; left: 0px; top: 0px; width: 100%; z-index: 90;}
	.detailsImage {width: 100%; height: 440px; z-index: 90; position: absolute; left: 0px; top: 0px;}
	.mainImage img {width: 100%; margin-left:0;}
	.detailsImage img {width: 100%; margin-left:0;}
	.list {margin-top: 440px;}
	.list h2 {font-size: 64px;}

	.bookTitle {height: 440px;}
	.bookTitle h1 {position: relative; z-index: 106; margin-top:100px; background: rgba(33, 37, 41, 0.80); display: inline-block; padding: 30px 90px; font-size: 64px;}

	.welcome {font-size: 24px; margin-top: 500px;}
	.fmenu li {width: auto;}

	.green {background: url('/catalog/view/theme/cleanstyle/images/green.png') no-repeat center top; height: 660px; padding-top:240px;}
}

/*  XL  Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
	
}

/*  XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
	
}