html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}









/* @import url(http://fonts.googleapis.com/css?family=Comfortaa:300&subset=cyrillic-ext,latin); */
@font-face {
    font-family: myfont;
    src: url(a.otf); /*otf e bez  format('truetype'), just src*/
}
body {
background:#ffffff;
/* font-family: 'Comfortaa', cursive; */
font-family: myfont;
}
#header {
float:left;
position:relative;
width:100%;
min-height:150px;
background: url(img/header.jpg)  repeat-y;
background-size: 100%;
color:#ffffff;
}
#header ul {
width:1040px;
left:50%;
margin-left: -520px;
position: absolute;
bottom: 25px;
font-size: 22px;
text-transform: uppercase;
}
#header ul li img{
width:36px;
position: absolute;
top: -7px;/*half of the difference between img size and font size (or it's line height)*/
}
#header ul li{
float:left;
margin-left:46px;/*35 for the regular font*/
letter-spacing:-0.5;
}
#header ul li:nth-child(1) {
margin-left:0px;
}
#header ul li:nth-child(4) {
margin-left:450px;
}
#header ul li a {
color: #ffffff;
text-decoration:none;
}
#header ul li a:hover, #header ul li a.active {
color:#abb741;
}




#content {
padding:100px 0 90px 0;
z-index:0;
float:left;
position:relative;
width:100%;
min-height:450px;
background: url(img/bg.png)  repeat-y;
background-size: 100%;
color:#abb741;
/* color:#d85394; pink*/
}

#home {
width:1040px;
left:50%;
margin-left: -520px;
position: relative;
color:#d85394;
margin-top: 70px;
text-align:center;
line-height: 1.3;
}
#home li {
float:left;
margin-left:25px;
width:330px;
}
#home li:nth-child(1){
margin-left:0px;
}
#home li img{
width:330px;
height:330px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
#home h3 {
color:#abb741;
padding-bottom: 40px;
font-size:24px !important;
}
#home_smaller {
font-size:20px;
}












#footer {
float:left;
position:relative;
width:100%;
min-height:143px;
background: url(img/header.jpg)  repeat-y;
background-size: 100%;
color:#abb741;
}
#footer > center {
padding: 25px 0 0 0;
}
#logo {
z-index:3;
width: 375px;
top: 0px;
position: absolute;
margin-left: -187px;
left: 50%;
  -moz-box-shadow:    0px 3px 5px 3px #999;
  -webkit-box-shadow: 0px 3px 5px 3px #999;
  box-shadow:         0px 3px 5px 3px #999;
}
#logo a {
display:flex;
}
#phones {
position:absolute;
top:25px;
right: 65px;
width:150px;
font-size:22px;
color:#abb741;
}


/*contacts*/

#contacts {
width:1040px;
left:50%;
margin-left: -520px;
position: relative;
color:#d85394;
margin-top: 70px;
text-align:left;
line-height: 1.3;
font-weight: bold;
}
#contacts li {
float:left;
margin-left:120px;
width:360px;
}
#contacts li:nth-child(2){
margin-left:73px;
}

#contacts h3 {
color:#abb741;
padding-bottom: 0px;
font-size:22px;
}
#mapholder {
position: relative;
width: 1050px;
margin: 0 auto;
padding-top:150px;
}

/*services*/

#services {
width:1040px;
left:50%;
margin-left: -520px;
position: relative;
color:#d85394;
margin-top: 40px;
text-align:left;
line-height: 1.3;
--font-weight: bold;
}
#services .left {
width:750px;
float:left;
}
#services h3 {
color:#abb741;
padding-bottom: 0px;
font-size:26px;
font-weight: bold;
}
#services #home_smaller {
padding-bottom: 50px;
font-size:24px;
}
#services .right {
width: 300px;
top: 0px;
right: 0px;
position: absolute;
}
.services_img {
width:250px;
height: 221px; 
float:right;
margin-top: 25px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}



/*prices*/
#prices {
width:1040px;
left:50%;
margin-left: -520px;
position: relative;
color:#d85394;
margin-top: 20px;
text-align:left;
line-height: 1.3;
--font-weight: bold;
}
.pink {
float:left;
background:#deb5d9;  
width:460px;
height: 460px;
overflow:hidden;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
.pink.second {
margin-left:95px;
}
.pink.third {
margin-left:277px;
}
.pink center {
margin-top:69px;
font-size: 26px;
color: #9f268f;
padding:0 60px 0 60px;
}
.pink center h3 {
font-weight:bold;
font-size: 36px;
padding-bottom:25px;
}
.pink center img {
width:60px;
margin-bottom: -12px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}

/*gallery*/

#gallery {
width:1040px;
left:50%;
margin-left: -520px;
position: relative;
color:#d85394;
margin-top: 40px;
text-align:left;
line-height: 1.3;
--font-weight: bold;
}
#gallery .left {
width:740px;
float:left;
background: #deb5d9;
color:#8eb644;
min-height:770px;
padding-bottom:30px;
}
.leftmenu, .rightmenu {
height: 45px;
font-size:34px;
position:absolute;
top:0px;
left:0px;
margin-top: -45px;
background: #deb5d9;
color:#9f268f;
padding:5px 25px 0 25px;
}
.rightmenu {
background: #d7e89a;
color:#a8c862;
}
#gallery h3 {
color:#abb741;
padding-bottom: 0px;
font-size:26px;
font-weight: bold;
}
#gallery #home_smaller {
padding-bottom: 50px;
font-size:24px;
}
#gallery .right {
background: #d7e89a;
color: #a8c862;
width: 300px;
top: 0px;
right: 0px;
position: relative;
min-height: 800px;
float: left;
padding-bottom: 30px;
}
#gallery .left img {
width:200px;
height: 177px;/*150px is for 3/4*/
margin: 25px 0 0 35px;
float:left;
opacity:0.8;
} 
.video img, .video iframe {
width: 240px; /*16/9 youtube 200/113*/
height:180px;
float:left;
margin: 64px 0 0 30px;
}
/*
			<img class="play" src='img/play_btn_right.png' />
			<img src='img/dog_square.jpg' />
*/

.fancybox-wrap {
font-size: 22px;
font-weight: normal;
}
.fancybox-wrap span>a{ /*share link*/
text-decoration:none;
}
.video {
overflow:hidden;
position:relative;
}
.play {
width: 80px !important;
height: 80px !important;
position: absolute;
left: 80px;
top: 50px;
}


/*
fb link is possible only if we redirect to fb page
can we ad shadow on the pics in the gallery?
snimkite - nqkoi sa po-kvadratni ot 3/4, taka li da gi ostavqm i kakvo se poluchava ako nqkoi kachi 16-9 primerno. 
*/









/*slider*/
.device {
 /*
  --width: 640px;
  --height: 300px;
 590 for 16/9*/
  margin-top:50px;
  width: 1040px;
  height: 441px; 
  --padding: 30px 40px;
  border-radius: 20px;
  --background: #111;
  border: 3px solid white;
  margin: 5px auto;
  position: relative;
  --box-shadow: 0px 0px 5px #000;
}
.device .arrow-left {
  background: url(img/arrows.png) no-repeat left top;
  position: absolute;
  left: 10px;
  top: 50%;
  margin-top: -15px;
  width: 17px;
  height: 30px;
}
.device .arrow-right {
  background: url(img/arrows.png) no-repeat left bottom;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -15px;
  width: 17px;
  height: 30px;
}
.swiper-container {
  --height: 300px;
  --width: 640px;
    width: 1040px;
  height: 441px;
}
.content-slide {
  padding: 20px;
  color: #fff;
}
.title {
  font-size: 25px;
  margin-bottom: 10px;
}
.pagination {
  position: absolute;
  left: 0;
  text-align: center;
  bottom:5px;
  width: 100%;
  margin-bottom:-35px;
}
.swiper-pagination-switch {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background: #b0d136;
  margin: 0 3px;
  cursor: pointer;
}
.swiper-active-switch {
  background: #9f268f;
}




/*