*{
margin: 0;
padding: 0;
border: 0;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
display: block;
}
@font-face {
font-family: roboto;
src: url(//fam-alliance.kz/wp-content/themes/0-57alliance/font/robotoregular.ttf);
}
@font-face {
font-family: fedrasans;
src: url(//fam-alliance.kz/wp-content/themes/0-57alliance/font/fedrasanspro.ttf);
}
@font-face {
font-family: bounded;
src: url(//fam-alliance.kz/wp-content/themes/0-57alliance/font/montserrat.otf);
font-display: swap;
}    
body {
font: 16px/25px roboto;
}
#top_header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 164px;
z-index: 9;
}
#wrap {
margin: 0 auto;
padding: 164px 0 0 0;
width: 100%;
min-width: 300px;
overflow-x: hidden;
background: #fff;
line-height: 1.4;
color: #333;
}
img {
padding: 0;
margin: 0;
border: 0;
max-width: 100%;
height: auto;
}
p {
margin: 0 0 1em 0;
}
a {
text-decoration: none;
color: #6c517c;
}
#top {
width: 100%;
height: 54px;
background: #6c517c;
}
#top .center {
position: relative;
}
#menu {
position: absolute;
top: 0;
left: 0;
}
#top_right {
position: absolute;
top: 7px;
right: 0px;
}
#top_right img {
width: 32px;
}
#header {
width: 100%;
background: #f8f7ff;
padding: 10px 0 10px 0;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
header {
position: relative;
margin: 0 auto;
width: 100%;
max-width: 1300px;
height: 68px;
}
#logo {
position: absolute;
top: 5px;
left: 1px;
}
#logo img {
width: 64px;
display: block;
}
#callback {
position: absolute;
top: 27px;
left: 180px;
}
#callback a {
font: 16px roboto;
display: inline-block;
border: 2px solid #333;
color: #333;
padding: 8px 15px;
border-radius: 25px;
}
#callback2 {
margin: 20px 0 20px 0;
}
#callback2 a {
font: 16px roboto;
display: inline-block;
border: 2px solid #333;
color: #333;
padding: 8px 15px;
border-radius: 25px;
}
#mobilesearch, #mysearch {
display: none;
}
#bigsearch {
position: absolute;
top: 18px;
right: 1px;
}
#bigsearch > div {
position: relative;
}
#search form {
position: relative;
overflow: hidden;
border-radius: 5px;
width: 100%;
display: block;
}
#search input {
border: 1px solid #ccc;
border-radius: 30px;
background: #fff;
padding: 6px 7px 7px 10px;
margin: 0 0 0 0;
font: 16px/16px roboto;
display: inline-block;
min-width: 40px;
width: 100%;
text-align: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#search button {
position: absolute;
top: 0;
right: 0;
background: #6c517c;
color: #fff;
border-radius: 0 30px 30px 0;
padding: 7px 10px;
margin: 0 0 0 0;
width: 40px;
cursor: pointer;
text-align: center;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#search button img {
display: block;
}
.search_result {
position: absolute;
top: 35px;
left: 0;
width: 280px;
padding: 0 10px 0 10px;
background: #fff;
overflow: hidden;
z-index: 100;
}
.search_result a {
display: block;
margin: 10px 0 10px 0;
font: 14px roboto;
color: #333;
}
#phone {
position: absolute;
top: 22px;
right: 600px;
padding: 4px 0 10px 35px;
background: url(//fam-alliance.kz/wp-content/themes/0-57alliance/img/whatsapp1.png) no-repeat;
background-size: 30px auto;;
}
#phone a {
font: 16px roboto;
color: #333;
}
#mail {
position: absolute;
top: 22px;
right: 300px;
padding: 4px 0 10px 35px;
background: url(//fam-alliance.kz/wp-content/themes/0-57alliance/img/mail1.png) no-repeat;
background-size: 30px auto;;
}
#mail a {
font: 16px roboto;
color: #333;
}
#breadcrumb {
margin: 15px 0 15px 0;
}
.center {
margin: 0 auto;
width: 100%;
max-width: 1300px;
}
#homeslider h1 {
font: 60px/60px bounded;
margin: 0 0 30px 0;
}
h1 span {
color: #6c517c;
}
#homeslider p {
font: 20px/20px bounded;
margin: 0 0 50px 0;
}
#homelinks {
width: 100%;
max-width: 700px;
margin: 0 auto;
}
#homelinks > div {
margin: 0 0 10px 0;
}
#homelinks a {
font: 25px/25px bounded;
display: block;
border: 2px solid #333;
color: #333;
padding: 20px 0;
border-radius: 30px;
text-decoration: none;
}
#homelinks a:hover {
border: 2px solid #6c517c;
color: #fff;
background: #6c517c;
}
.about {
display: grid;
grid-gap: 10px 0;
grid-template-columns: 50% 50%;
}
.about img {
display: block;	
}
.text {
padding: 0 40px 0 40px;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
align-items: center;
background: #6c517c;
color: #fff;
}
.about h1, .about h2, .about h3 {
font: bold 40px fedrasans;
text-align: left;
margin: 0 0 10px 0;
}
.about p {
margin: 0 0 20px 0;
display: flex;
align-items: center;
}
.text img {
margin: 0 10px 0 0;
}
.about p:last-child {
margin: 0 0 0 0;
}
.catalog {
text-align: center;
}
.catalog a {
color: #333;
}
.in {
padding: 0 20px 0 20px;
box-sizing: border-box;
text-align: center;
}
.in h3 {
margin: 25px 0 20px 0;
font: bold 18px roboto;
height: 2.4em;
overflow: hidden;
color: #6c517c;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.in p {
margin: 0 0 1em 0;
font: 16px/18px roboto;
display: block;
}    
.catalog > a > img {
display: block;
border: 1px solid #6c517c;
}
.price {
font: bold 25px roboto;
}
.cart a {
padding: 12px 25px;
background: #6c517c;
border-radius: 2px;
color: #fff;
display: block;
box-sizing: border-box;
margin: 20px 0 20px 0;
font: bold 16px/18px roboto;
text-align: center;
cursor: pointer;
}
.modal {
z-index: 9999999 !important;
max-width: 700px !important;
}
#ex1 h2 {
font: bold 25px roboto;
margin: 20px 0 20px 0;
text-align: left;
color: #333;
}
.mycart {
margin: 0 0 20px 0;
}
.mycart > div {
display: grid;
grid-gap: 10px 1%;
grid-template-columns: 40px 1fr 100px 140px 100px 30px;
word-break: break-all;
padding: 30px 10px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mycart > div:hover {
background: #f5f5f5;
}
.mycart > div > div {
display: flex;
align-items: center;
}
.mycart a {
color: #333;
}
.cartprice {
justify-content: left;
font: bold 16px roboto;
}
.mycart input {
border: 1px solid #eee;
border-radius: 5px;
background: #fff;
padding: 5px 2px;
margin: 0 5px 0 5px;
font: 16px/16px roboto;
display: inline-block;
min-width: 60px;
width: 100%;
text-align: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mycart button {
border-radius: 2px;
background: #a0252a;
color: #fff;
padding: 5px 10px;
cursor: pointer;
text-align: center;
display: inline-block;
max-width: 40px;
width: 100%;
font: 16px roboto;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.btn {
background: transparent !important;
color: #333 !important;
}
#totalprice {
font: bold 18px roboto;
}
#cart_link a {
border-radius: 5px;
background: #6c517c;
color: #fff;
padding: 15px 10px;
margin: 30px 0 20px 0;
cursor: pointer;
text-align: center;
display: block;
width: 100%;
font: bold 16px roboto;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cart_show {
max-width: 800px;
margin: 0 auto;
}
.compare {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.mycompare {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 1fr 1fr;
margin: 0 0 30px 0;
text-align: center;
}
.compareprice {
font: bold 16px roboto;
margin: 0 0 15px 0;
}
.compare_title {
margin: 10px 0 0 0;
}
.compare_title a {
color: #333;
}
#cartform {
max-width: 500px;
}
#cart_show h2 {
margin: 50px 0 10px 0;
text-align: left;
}
#cartform input {
border: 1px solid #ccc;
border-radius: 2px;
background: #fff;
padding: 10px;
font-size: 16px;
margin: 0 0 20px 0;
display: block;
width: 100%;
text-align: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cartform button {
border-radius: 5px;
background: #a0252a;
color: #fff;
padding: 15px 10px;
cursor: pointer;
text-align: center;
display: block;
width: 100%;
font: 16px roboto;
}
#download_Btn {
border-radius: 5px;
background: #6c517c;
color: #fff;
padding: 15px 10px;
margin: 20px 0 20px 0;
cursor: pointer;
text-align: center;
display: block;
width: 100%;
max-width: 200px;
font: 16px roboto;
}
#pdf {
display: none;
font: 14px roboto;
}
#pdf_basy {
position: relative;
height: 200px;
}
#pdf_logo {
position: absolute;
top: 10px;
left: 1px;
width: 150px;
}
#pdf_address {
position: absolute;
top: 45px;
right: 1px;
font: 14px roboto;
}
#tizim > div {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 100px 1fr 100px 100px;
margin: 0 0 30px 0;
}
#tizim > div > div {
display: flex;
align-items: center;
}
#tizim2 {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 1fr 1fr;
margin: 0 0 30px 0;
text-align: center;
}
#catalog_links {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 1fr 1fr;
margin: 0 0 30px 0;
text-align: center;
}
#catalog_links div {
border: 3px solid #fff;
}
#catalog_links div:hover {
border: 3px solid rgb(108, 81, 124);
}
#catalog_links img {
display: block;
}
#catalog_links p {
padding: 20px 0 20px 0;
background: #ccc;
margin: 0 0 0 0;
}
#catalog_links a {
color: #333;
font: 18px roboto;
}
#eki {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 500px 1fr;
margin: 30px 0 30px 0;
}
#eki img {
display: block;
}
#eki h1 {
font: 28px/32px bounded;
color: #6c517c;
text-align: left;
margin: 0 0 20px 0;
}
.single_compare {
justify-content: left !important;
margin: 0 0 20px 0;
}
#single_gallery {
display: grid;
grid-gap: 10px 2%;
grid-template-columns: 1fr 1fr 1fr;
margin: 10px 0 30px 0;
}
#small {
max-width: 500px;
}
#small > a {
display: flex;
align-items: center;
border: 1px solid #6c517c;
padding: 10px 5px;
}
#small img {
margin: 0 5px 0 0;
}
#kaspi {
margin: 20px 0 0 0;
}
#kaspi a {
color: #333;
text-decoration: underline;
}
#qyzyl {
padding: 50px 0 50px 0;
margin: 0 0 100px 0;
background: #fff;
color: #000;
}
.tabs-wrapper .active {
color: #6c517c;
border-bottom: 2px solid #6c517c;
}
.tab {
font: 30px bounded;
margin: 0 20px 20px 0;
display: inline-block;
cursor: pointer;
}
.tabs {
border-bottom: 1px solid #ddd;
padding-bottom: 10px;
}
#like {
margin: 0 0 100px 0;
}
#history {
max-width: 500px;
margin: 0 auto;
border-left: 1px solid #333;
} 
#history h3 {
text-align: left;
border-bottom: 1px solid #333;
display: inline-block;
padding: 0 200px 10px 20px;
margin: 50px 0 30px 0;
color: #6c517c;
}
#history p {
display: flex;
align-items: center;
margin: 0 0 20px 20px;
}
#history img {
margin: 0 10px 0 0;
}
#section {
margin: 0 auto;
width: 94%;
max-width: 1300px;
padding: 0 0 50px 0;
}
h1 {
font: 35px/35px bounded;
margin: 40px 0 20px 0;
text-align: center;
}
h2 {
font: 30px/30px bounded;
margin: 0 0 20px 0;
text-align: center;
color: #6c517c;
}
h3 {
font: 25px/25px bounded;
margin: 40px 0 20px 0;
text-align: center;
}
#whatsapp {
position: fixed;
right: 10px;
bottom: 10px;
z-index: 99999999;
width: 50px;	
}
#specialist-widget {
position: fixed;
left: 10px;
bottom: 10px;
z-index: 99999999;
width: 50px;
}
#specialist-widget a {
display: block;
width: 50px;
height: 50px;
box-sizing: border-box;
border-radius: 50%;
background: #fff;
padding: 9px;
box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
#specialist-widget img {
display: block;
width: 100%;
height: 100%;
}
#whatsapp img {
display: block;
margin: 0 0 10px 0;	
}
#ex2 {
padding: 40px 30px 40px 30px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#ex2 h2 {
margin: 0 0 10px 0;
}
#mymail input {
padding: 15px;
color: #333;
border: 1px solid #333;
font: 16px roboto;
margin: 0 0 15px 0;
display: block;
border-radius: 15px;
width: 100%;
text-align: center;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#mymail button {
background: #6c517c;
color: #fff;
padding: 15px;
display: block;
cursor: pointer;
text-align: center;
width: 100%;
height: auto;
font: 16px roboto;
border-radius: 15px;
}  
#result {
margin: 10px 0 0 0;
}    
#myfooter {
width: 100%;
background: #ccc;
}
footer ul li a {
font: 16px roboto;
color: #333;
text-decoration: none;
display: block;
margin: 0 0 10px 0;
}
footer {
margin: 0 auto;    
width: 94%;
max-width: 1300px;
padding: 50px 0 50px 0;
display: grid;
grid-gap: 20px 4%;
grid-template-columns: 48% 48%;
}
#footer_right {
text-align: right;
}
#footer_right img {
width: 32px;
}
footer ul li {
list-style: none;
}
#copy {
border-top: 1px solid #333;
background: #ccc;
padding: 15px 0 25px 0;
}
#copy p {
font: 14px roboto;
margin: 0 0 0 0;
padding: 10px 0 0 0;
color: #333;
}
#copy a {
font: 14px roboto;
text-decoration: none;
color: #000;
}
#gallery {
display: grid;
grid-gap: 20px 2%;
grid-template-columns: 32% 32% 32%;
text-align: center;
}
#bigcatalog {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 1fr 1fr;
margin: 0 0 50px 0;
}
#bigcatalog a {
text-decoration: none;
color: #333;
}
#bigcatalog img {
display: block;
}
#bigcatalog p {
font: 18px/18px roboto;
margin: 0 0 0 0;
padding: 20px 20px 20px 20px;
color: #fff;
background: #6c517c;
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 30px;
vertical-align: baseline;
}
#catalog {
display: grid;
grid-gap: 30px 2%;
grid-template-columns: 1fr 1fr 1fr 1fr;
margin: 0 0 30px 0;
}
#catalog > div {
border: 3px solid #fff;
padding: 5px;
}
#catalog > div:hover {
border: 3px solid rgb(108, 81, 124);
}
#mylinks {
text-align: center;
margin: 0 0 40px 0;
}
#last {
margin: 50px 0 0 0;
}
table {
border-collapse: collapse;
width: 100%;
}
td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
img.alignright {
float: right;
margin: 0 10px 3px 5px;
}
img.alignleft {
float: left;
margin: 0 10px 3px 0;
}
img.aligncenter {
display: block;
margin: 0 auto;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
.aligncenter {
display: block;
margin: 0 auto;
}
.error {
color: red;
}
.clear {
width: 100%;
height: 1px;
clear: both;
}
.myvideo {
position: relative;
padding: 30px 0 56.25% 0;
height: 0;
overflow: hidden;
border: 1px solid #ccc;
}
.myvideo iframe,.myvideo object,.myvideo embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
article ul, article ol {
margin: 0 0 0 20px;
}
article ul li, article ol li {
margin: 0 0 10px 0;
}
.closebtn, #hamburger, #menucontact, #language2 {
display: none;
}
#mymenu {
width: 100%;
max-width: 1330px;
margin: 0 auto;
}
#mymenu ul li {
float: left;
list-style: none;
position: relative;	
}
#mymenu ul li a {
font: 16px/18px fedrasans;
padding: 18px 20px;
color: #fff;
text-decoration: none;
display: block;
}
#mymenu ul li ul {
display: none;	
}
#mymenu ul li:hover ul {
position: absolute;
top: 54px;
display: block;
z-index: 9;
}
.myspan {
position: relative;
}
.myspan span {
cursor: pointer;
color: red;
}
#mymenu ul li span {
position: absolute;
top: 21px;
right: 0;
display: block;
border: solid #fff;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 3px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#mymenu ul li ul li a {
font: 14px roboto;
padding: 15px 20px;
color: #fff;
background: #6c517c;
text-decoration: none;
display: block;
width: 200px;
}
button {
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
}
.slide-arrow {
position: absolute;
top: 50%;
margin-top: -15px;
z-index: 1;  
}
.prev-arrow {
left: 20px;
width: 0;
height: 0;
border: solid #fff;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 8px;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}
.next-arrow {
right: 20px;
width: 0;
height: 0;
border: solid #fff;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 8px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
@media only screen and (max-width:1350px){
.center {
width: 96%;
padding: 0 2% 0 2%;	
}
}
@media only screen and (max-width:1100px){
body {
font: 15px/20px roboto;
}
#top_header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100px;
z-index: 9;
}
#wrap {
margin: 0 auto;
padding: 100px 0 0 0;
}
#top {
height: 40px;
}
#top_right {
position: absolute;
top: 1px;
right: 0px;
}
#top_right img {
width: 28px;
}
#header {
padding: 0 0 0 0;
}
header {
position: relative;
margin: 0 auto;
width: 100%;
max-width: 1200px;
height: 60px;
}
#logo {
top: 5px;
}
#logo img {
width: 55px;
}
#hamburger {
position: absolute;
left: 1px;
top: 3px;
cursor: pointer;
display: inline-block;
}
#phone {
position: absolute;
top: 10px;
right: 40px;
padding: 0 0 0 0;
background: transparent;
}  
#phone a {
font: 16px roboto;
color: #333;
}
#callback {
display: none;
}
#mail {
position: absolute;
top: 33px;
right: 40px;
padding: 0 0 0 0;
background: transparent;
}      
#mail a {
font: 16px roboto;
color: #333;
}
#search {
display: none;
}
#mobilesearch {
position: absolute;
right: 1px;
top: 16px;
cursor: pointer;
display: inline-block;
width: 27px;
}
#mobilesearch img {
cursor: pointer;
}
#mysearch {
position: absolute;
top: 60px;
width: 100%;
background: #f5f5f5;
width: 90%;
padding: 20px 5% 20px 5%;
z-index: 9;
}
#mysearch form {
position: relative;
overflow: hidden;
border-radius: 5px;
}
#mysearch input {
border: 1px solid #ccc;
border-radius: 5px;
background: #fff;
padding: 6px 7px 7px 7px;
margin: 0 0 0 0;
font: 16px/16px roboto;
display: inline-block;
min-width: 40px;
width: 100%;
text-align: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#mysearch button {
position: absolute;
top: 0;
right: 0;
background: #6c517c;
color: #fff;
border-radius: 0 5px 5px 0;
padding: 8px 10px;
margin: 0 0 0 0;
width: 40px;
cursor: pointer;
text-align: center;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#mysearch button img {
display: block;
}
#menu {
background: rgba(255, 255, 255, 1);
margin: 0 0 0 0;
min-height: 100vh;
width: 0;
max-width: 800px;
position: fixed;
z-index: 9999999;
top: 0;
left: 0;
overflow-x: hidden;
transition: 0.2s;
}
#menu .closebtn {
position: absolute;
top: 0;
right: 0;
font-size: 36px;
padding: 0 10px 0 10px;
line-height: 1;
background: #6c517c;
color: #fff;
text-decoration: none;
display: block;
}
#menucontact {
display: block;
margin: 30px 0 0 20px;
}
#mymenu ul li {
float: none;
display: block;
list-style: none;
position: relative;	
}
#mymenu ul li a {
font: bold 18px roboto;
padding: 15px 20px;
color: #333;
text-decoration: none;
display: block;
width: 70%;
}
#mymenu ul li span {
position: absolute;
top: 15px;
right: 20px;
border: none;
display: block;
border: solid #333;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 5px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#mymenu ul li:hover ul {
position: relative;
top: 0;
display: none;
}
#mymenu ul li ul {
display: none;	
}
#mymenu ul li ul li a {
font: 16px roboto;
padding: 15px 30px;
color: #333;
background: transparent;
text-decoration: none;
display: block;
width: 100%;
}
}
@media only screen and (max-width:950px){     
#homeslider h1 {
font: 30px/30px bounded;
margin: 0 0 30px 0;
}
#homeslider p {
font: 16px/16px bounded;
margin: 0 0 20px 0;
} 
#homelinks a {
font: 18px/18px bounded;
display: block;
border: 2px solid #333;
color: #333;
padding: 15px 0;
border-radius: 30px;
text-decoration: none;
}
.about {
display: grid;
grid-gap: 0 0;
grid-template-columns: 100%;
}
.text {
padding: 30px 20px 30px 20px;
}                 
.about h1, .about h2, .about h3 {
font: 25px bounded;
margin: 0 0 10px 0;
}   
.reverse {
display: flex;
flex-direction: column-reverse;
}
#catalog_links {
grid-template-columns: 100%;
}   
#catalog_links a {
font: 15px roboto;
}       
h1 {
font: 35px/35px bounded;
margin: 20px 0 10px 0;
}
h2 {
margin: 40px 0 10px 0;
font: 25px/25px bounded;
}
h3 {
margin: 40px 0 20px 0;
font: 23px/23px bounded;
}
footer {
padding: 20px 0 10px 0;
grid-gap: 10px 0;
grid-template-columns: 100%;
}
#footer_right {
text-align: left;
}
#gallery {
display: grid;
grid-gap: 10px 4%;
grid-template-columns: 48% 48%;
text-align: center;
}
#catalog {
display: grid;
grid-gap: 30px 0;
grid-template-columns: 100%;
}
#bigcatalog {
display: grid;
grid-gap: 30px 0;
grid-template-columns: 100%;
margin: 0 0 30px 0;
}
#bigcatalog p {
font: 16px roboto;
padding: 15px 15px 15px 15px;
}
#eki {
grid-gap: 20px 0;
grid-template-columns: 100%;
margin: 30px 0 30px 0;
}
#eki h1 {
font: 22px/26px bounded;
margin: 0 0 20px 0;
}
#history h3 {
padding: 0 20px 10px 20px;
margin: 20px 0 30px 0;
}
#history p {
display: block;
margin: 0 0 20px 20px;
}    
#history img {
margin: 0 0 10px 0;
display: block;
}
.mycompare {
grid-gap: 30px 0;
grid-template-columns: 100%;
}
.blocker {
padding: 5px !important;
}
.modal {
padding: 20px 5px !important;
width: 98% !important;
max-width: 900px !important;
}
.mycart > div {
grid-gap: 10px 4%;
grid-template-columns: 28% 48% 10%;
}    
} #top_right {display: flex; align-items: center; gap: 8px; top: 9px;}
#top_right a.ti {position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 36px; height: 36px; border: 1.5px solid rgba(255,255,255,.85); border-radius: 50%; color: #fff; font: 600 13px/1 Roboto, Arial, sans-serif; letter-spacing: .3px; text-decoration: none; transition: transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;}
#top_right a.ti svg {display: block; width: 19px; height: 19px;}
#top_right a.ti img {display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
#top_right a.ti-wa, #top_right a.ti-kaspi {border: 0;}
#top_right a.ti-kaspi {overflow: hidden;}
#top_right a.ti-kaspi img {transform: none;}
#top_right a.ti-lang.is-active {background: #fff; color: #6c517c;}
#top_right a.ti-wa::after {content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; pointer-events: none; animation: tiPulse 2.2s ease-out infinite;}
@keyframes tiPulse {
0% {box-shadow: 0 0 0 0 rgba(37,211,102,.7);}
70%, 100% {box-shadow: 0 0 0 10px rgba(37,211,102,0);}
}
@media (hover: hover) {
#top_right a.ti:hover {transform: translateY(-2px) scale(1.1); background-color: #fff; color: #6c517c; box-shadow: 0 4px 12px rgba(0,0,0,.25);}
}
@media only screen and (max-width:1100px) {
#top_right {top: 4px; gap: 6px;}
#top_right a.ti {width: 32px; height: 32px; font-size: 12px;}
#top_right a.ti svg {width: 17px; height: 17px;}
}
@media (prefers-reduced-motion: reduce) {
#top_right a.ti {transition: none;}
#top_right a.ti-wa::after {animation: none;}
}
#top_right a.ti-cart::before, #top_right a.ti-compare::before {content: ""; display: block; width: 19px; height: 19px; background-color: currentColor; -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;}
#top_right a.ti-cart::before {-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h3l2.7 12.4a1.5 1.5 0 0 0 1.5 1.1h8.6a1.5 1.5 0 0 0 1.5-1.1L21 7H6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h3l2.7 12.4a1.5 1.5 0 0 0 1.5 1.1h8.6a1.5 1.5 0 0 0 1.5-1.1L21 7H6'/%3E%3C/svg%3E");}
#top_right a.ti-compare::before {-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20h18M6 20v-8M12 20V5M18 20v-5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20h18M6 20v-8M12 20V5M18 20v-5'/%3E%3C/svg%3E");}
@media only screen and (max-width:1100px) {
#top_right a.ti-cart::before, #top_right a.ti-compare::before {width: 17px; height: 17px;}
} @media only screen and (min-width:1101px) {
#mymenu > ul > li > a {transition: background-color .2s ease;}
#mymenu > ul > li:hover > a {background-color: rgba(255,255,255,.12);}
#mymenu ul li ul {margin: 0; padding: 0; border-radius: 0 0 10px 10px; overflow: hidden; box-shadow: 0 14px 28px rgba(0,0,0,.22);}
#mymenu ul li ul li {float: none;}
#mymenu ul li ul li + li a {border-top: 1px solid rgba(255,255,255,.16);}
#mymenu ul li ul li a {transition: background-color .2s ease, padding .2s ease, box-shadow .2s ease;}
#mymenu ul li ul li a:hover {background-color: #876c98; padding: 15px 12px 15px 28px; box-shadow: inset 4px 0 0 #fff;}
} @media only screen and (max-width:1350px) {
#top .center, header {width: auto; padding: 0; margin: 0 24px;}
}
@media only screen and (max-width:1100px) {
#top .center, header {margin: 0 10px;}
} @media only screen and (max-width:950px) {
#homeslider h1 {font-size: clamp(30px, 10vw, 48px); line-height: 1.05;}
} @font-face {font-family: famnav; font-style: normal; font-weight: 100 900; font-display: swap; src: url(//fam-alliance.kz/wp-content/uploads/elementor/google-fonts/fonts/roboto-f6655444.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face {font-family: famnav; font-style: normal; font-weight: 100 900; font-display: swap; src: url(//fam-alliance.kz/wp-content/uploads/elementor/google-fonts/fonts/roboto-0f7fcdc8.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F;}
#mymenu ul li a {font-family: famnav, roboto, Arial, sans-serif; font-weight: 500; letter-spacing: .2px;}
#mymenu ul li ul li a {font-weight: 400; letter-spacing: 0;}
@media only screen and (max-width:1100px) {
#mymenu ul li a {font-weight: 600;}
#mymenu ul li ul li a {font-weight: 400;}
}
@media only screen and (min-width:1101px) {
#mymenu ul li.myspan > a {padding-right: 38px;}
#mymenu ul li.myspan > span {right: 16px;}
} .fh {padding: 70px 0;}
.fh-alt {background: #f8f7ff;}
.fh h2, .fh-cta h2 {font: 34px/1.15 bounded; color: #333; margin: 0 0 14px 0; text-align: center;}
.fh h2 span {color: #6c517c;}
.fh-lead {font: 17px/1.55 roboto; color: #555; max-width: 820px; margin: 0 auto 36px auto; text-align: center;}
.fh-grid {display: grid; gap: 24px;}
.fh-cats .fh-grid {grid-template-columns: repeat(5, 1fr);}
.fh-service .fh-grid {grid-template-columns: repeat(3, 1fr);}
.fh-card {display: block; background: #fff; border-radius: 16px; overflow: hidden; text-decoration: none; color: #333; box-shadow: 0 2px 10px rgba(60,40,80,.08); transition: transform .25s ease, box-shadow .25s ease;}
.fh-card img {display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .4s ease;}
.fh-card b {display: block; padding: 16px 18px; font: 600 16px/1.3 famnav, roboto, Arial, sans-serif; color: #333; transition: color .2s ease;}
.fh-stats {background: #6c517c; color: #fff; padding: 50px 0;}
.fh-stats .fh-grid {grid-template-columns: repeat(5, 1fr); text-align: center;}
.fh-stats strong {display: block; font: 38px/1 bounded; margin: 0 0 10px 0;}
.fh-stats span {display: block; font: 15px/1.35 roboto; opacity: .9;}
.fh-split {display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center;}
.fh-split > img {display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px;}
.fh-split h2, .fh-split .fh-lead {text-align: left; margin-left: 0;}
.fh-split .fh-lead {margin-bottom: 24px;}
.fh-duo {display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
.fh-list {list-style: none; margin: 0 0 28px 0; padding: 0;}
.fh-list li {position: relative; padding: 0 0 12px 30px; font: 16px/1.45 roboto; color: #333; list-style: none;}
.fh-list li::before {content: ""; position: absolute; left: 5px; top: 3px; width: 6px; height: 12px; border: solid #1aa037; border-width: 0 3px 3px 0; transform: rotate(45deg);}
.fh-btns {display: flex; flex-wrap: wrap; gap: 14px;}
.fh-center {text-align: center; margin: 30px 0 0 0;}
.fh-btn {display: inline-block; padding: 14px 28px; border: 2px solid #6c517c; border-radius: 40px; background: #6c517c; color: #fff; font: 600 16px/1 famnav, roboto, Arial, sans-serif; text-decoration: none; transition: transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;}
.fh-btn-ghost {background: transparent; color: #6c517c;}
.fh-btn-wa {background: #25d366; border-color: #25d366;}
.fh-btn-light {background: #fff; border-color: #fff; color: #6c517c;}
.fh-certs .fh-grid {grid-template-columns: repeat(2, 1fr); max-width: 720px; margin: 0 auto;}
.fh-certs .fh-grid img {display: block; width: 100%; border-radius: 10px; box-shadow: 0 2px 12px rgba(60,40,80,.14); transition: transform .25s ease;}
.fh-text {max-width: 900px; margin: 0 auto; font: 16px/1.7 roboto; color: #444;}
.fh-text p {margin: 0 0 16px 0;}
.fh-faq {max-width: 900px; margin: 30px auto 0 auto;}
.fh-faq details {border-bottom: 1px solid #e3dfea; padding: 16px 0;}
.fh-faq summary {position: relative; padding: 0 34px 0 0; cursor: pointer; list-style: none; font: 600 17px/1.4 famnav, roboto, Arial, sans-serif; color: #333;}
.fh-faq summary::-webkit-details-marker {display: none;}
.fh-faq summary::after {content: "+"; position: absolute; right: 4px; top: -4px; font: 400 26px/1 roboto; color: #6c517c;}
.fh-faq details[open] summary::after {content: "\2013";}
.fh-faq details p {margin: 10px 0 0 0; font: 16px/1.6 roboto; color: #555;}
.fh-cta {background: linear-gradient(135deg, #6c517c, #4d3a5a); color: #fff; text-align: center; padding: 64px 0;}
.fh-cta h2 {color: #fff;}
.fh-cta p {font: 17px/1.5 roboto; margin: 0 auto 28px auto; max-width: 640px; opacity: .92;}
.fh-cta .fh-btns {justify-content: center;}
.fh-footer {background: #2f2538; color: #cfc8d6; padding: 56px 0 0 0; font: 15px/1.6 roboto;}
.fh-footer .fh-grid {grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 40px;}
.fh-flogo {font: 22px/1 bounded; color: #fff; margin: 0 0 16px 0;}
.fh-footer h3 {font: 600 16px/1.2 famnav, roboto, Arial, sans-serif; color: #fff; margin: 0 0 14px 0;}
.fh-footer p {margin: 0 0 12px 0;}
.fh-footer a {display: block; padding: 3px 0; color: #cfc8d6; text-decoration: none; transition: color .2s ease;}
.fh-footer-bottom {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin: 40px 0 0 0; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.12); font-size: 13.5px;}
@media (hover: hover) {
.fh-card:hover {transform: translateY(-6px); box-shadow: 0 14px 30px rgba(60,40,80,.18);}
.fh-card:hover img {transform: scale(1.05);}
.fh-card:hover b {color: #6c517c;}
.fh-btn:hover {transform: translateY(-2px); background: #563f64; border-color: #563f64; color: #fff; box-shadow: 0 8px 18px rgba(60,40,80,.25);}
.fh-btn-wa:hover {background: #1eb858; border-color: #1eb858;}
.fh-btn-light:hover {background: #f0ebf4; border-color: #f0ebf4; color: #6c517c;}
.fh-certs .fh-grid a:hover img {transform: scale(1.03);}
.fh-footer a:hover {color: #fff;}
}
@media only screen and (max-width:1100px) {
.fh {padding: 50px 0;}
.fh h2, .fh-cta h2 {font-size: 28px;}
.fh-cats .fh-grid {grid-template-columns: repeat(3, 1fr);}
.fh-stats .fh-grid {grid-template-columns: repeat(3, 1fr);}
.fh-service .fh-grid {grid-template-columns: repeat(2, 1fr);}
.fh-split {grid-template-columns: 1fr; gap: 30px;}
.fh-footer .fh-grid {grid-template-columns: 1fr 1fr;}
}
@media only screen and (max-width:600px) {
.fh {padding: 40px 0;}
.fh h2, .fh-cta h2 {font-size: 23px;}
.fh-lead {font-size: 16px; margin-bottom: 26px;}
.fh-grid {gap: 14px;}
.fh-cats .fh-grid, .fh-stats .fh-grid, .fh-service .fh-grid {grid-template-columns: repeat(2, 1fr);}
.fh-card b {padding: 12px; font-size: 14px;}
.fh-stats strong {font-size: 28px;}
.fh-duo {gap: 14px;}
.fh-btn {padding: 13px 22px; font-size: 15px;}
.fh-footer .fh-grid {grid-template-columns: 1fr; gap: 26px;}
}
@media (prefers-reduced-motion: reduce) {
.fh-card, .fh-card img, .fh-btn {transition: none;}
} .fh-footer h3, .fh-footer p, .fh-flogo {text-align: left;}
@media only screen and (max-width:600px) {
.fh .center, .fh-stats .center, .fh-cta .center, .fh-footer .center {width: auto; padding: 0 16px;}
} #specialist-widget {left: 16px; bottom: 16px; width: auto;}
#specialist-widget a {display: flex; align-items: center; gap: 10px; width: auto; height: auto; padding: 6px 20px 6px 6px; border-radius: 40px; background: #fff; text-decoration: none; box-shadow: 0 4px 16px rgba(60,40,80,.28); transition: transform .2s ease, box-shadow .2s ease;}
#specialist-widget .sw-ava {flex: none; display: block; box-sizing: border-box; width: 44px; height: 44px; padding: 8px; border-radius: 50%; background: #f1edf5; overflow: hidden;}
#specialist-widget .sw-ava.sw-photo {padding: 0;}
#specialist-widget .sw-ava.sw-photo img {object-fit: cover;}
#specialist-widget .sw-text {display: block;}
#specialist-widget .sw-text b {display: block; font: 600 14px/1.2 famnav, roboto, Arial, sans-serif; color: #333;}
#specialist-widget .sw-text i {display: block; margin: 2px 0 0 0; font: normal 12.5px/1.3 roboto, Arial, sans-serif; font-style: normal; color: #6c517c;}
@media (hover: hover) {
#specialist-widget a:hover {transform: translateY(-3px); box-shadow: 0 10px 24px rgba(60,40,80,.34);}
}
@media only screen and (max-width:600px) {
#specialist-widget {left: 10px; bottom: 10px;}
#specialist-widget a {padding: 4px;}
#specialist-widget .sw-text {display: none;}
} .fh-stats strong {font-variant-numeric: tabular-nums;}
@media only screen and (max-width:600px) {
.fh-stats {padding: 26px 0;}
.fh-stats .fh-grid {grid-template-columns: 1fr; gap: 0;}
.fh-stats .fh-grid > div {padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.16);}
.fh-stats .fh-grid > div:last-child {border-bottom: 0;}
.fh-stats strong {font-size: 34px;}
} @media only screen and (max-width:600px) {
.fh-footer-bottom {padding-bottom: 76px;}
} .fh-fbtns {display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0 0;}
.fh-footer .fh-fbtns a {display: inline-flex; align-items: center; gap: 8px; padding: 7px 16px 7px 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 30px; background: rgba(255,255,255,.07); color: #fff; font: 600 14px/1 famnav, roboto, Arial, sans-serif; transition: transform .2s ease, background-color .2s ease, border-color .2s ease;}
.fh-fbtns i {flex: none; display: block; width: 26px; height: 26px; border-radius: 50%; background: #6c517c center / 14px no-repeat;}
.fh-fbtns .fb-wa i {background: url(//fam-alliance.kz/wp-content/themes/0-57alliance/img/whatsapp.svg) center / cover no-repeat;}
.fh-fbtns .fb-kaspi i {background: url(//fam-alliance.kz/wp-content/uploads/2026/10/kaspi-logo.png) center / cover no-repeat;}
.fh-fbtns .fb-tel i {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");}
.fh-fbtns .fb-2gis i {background-color: #19aa1e; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");}
.fh-footer-bottom {padding-bottom: 84px;}
@media (hover: hover) {
.fh-footer .fh-fbtns a:hover {transform: translateY(-2px); background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.4);}
} .fh-fbtns {gap: 12px;}
.fh-footer .fh-fbtns a {display: block; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 12px; overflow: hidden; background: none; transition: transform .2s ease, box-shadow .2s ease;}
.fh-fbtns i {width: 100%; height: 100%; border-radius: 0; background-size: 24px;}
.fh-fbtns .fb-wa i, .fh-fbtns .fb-kaspi i {background-size: cover;}
@media (hover: hover) {
.fh-footer .fh-fbtns a:hover {transform: scale(1.14); background: none; box-shadow: 0 6px 16px rgba(0,0,0,.35);}
}