@import url('uikit.min.css');
@import url('https://fonts.googleapis.com/css?family=Kanit:200,400,700&display=swap&subset=latin-ext');
  
/** SVETLO LJUBICASTA: #bd9fc6 **/
/** TAMNO LJUBICASTA: #804994 **/

::-moz-selection { color: #ffffff; background: #804994;}
::selection { color: #ffffff; background: #804994;}

body {font-size: 16px; font-family: 'Kanit', sans-serif; font-weight: lighter; color: #333;}
a {color: #001C37;}
a:hover {text-decoration: none; color: #804994;}
p {margin: 0px 0px 15px;}
em {color: #3a2218;}
.highlight {font-weight: bold; margin: 0px 5px; color: #005377;}

h1, h2 {font-weight: bold; font-family: 'Kanit', sans-serif;}
h3 {font-family: "Kanit", serif;}

.navigation {background: #fff; padding: 15px 0px; text-align: center;}
.navigation .logo {width: 250px; float: left;}
.navigation ul {float: right; margin: 15px 0px 0px;}
.navigation ul li {list-style: none; display: inline;}
.navigation ul li a {background: #804994; color: #fff; text-transform: uppercase; padding: 10px 30px; border-radius: 50px;}
.navigation ul li a:hover {background: #bd9fc6; color: #000;}
.navigation .hamburger {float: right;}
.offcanvas {width: 100%;}
.offcanvas .menu {background: rgba(128,73,148,0.9); width: 100%; height: 100%; text-align: center;}
.offcanvas .menu img {padding: 50px;}
.offcanvas .menu ul {margin: 0px; padding: 50px;}
.offcanvas .menu ul li {list-style: none;}
.offcanvas .menu ul li a {color: #fff; display: block; border-bottom: 1px solid rgba(255,255,255,0.2); text-transform: uppercase; font-size: 21px; padding: 10px 0px;}

.slider .left {margin-left: 0px;}
.slider .right {margin-right: 0px;}
.slider .left h2 {text-transform: uppercase; background: rgba(0,0,0,0.2); font-weight: 200; font-size: 21px; padding: 10px 20px; line-height: 21px; border-left: 5px solid #bd9fc6;}
.slider .right h2 {text-transform: uppercase; background: rgba(0,0,0,0.2); font-weight: 200; font-size: 21px; padding: 10px 20px; line-height: 21px; border-right: 5px solid #bd9fc6;}

.spotlight {background: #804994; padding: 50px 0px; text-align: center; color: #fff; font-size: 18px; font-weight: 200; z-index: 10; position: relative;}
.spotlight .smile {width: 70px; margin-bottom: 30px; opacity: 0.2;}

.therapy {background-image: linear-gradient(-45deg, #804994, #bd9fc6, #804994); padding: 50px 0px;}
.therapy h1 {font-weight: 200; text-align: center; color: #fff; border-bottom: 1px solid #804994; padding-bottom: 10px;}
.therapy .card {background: rgba(255,255,255,0.8); padding: 20px; border-radius: 0px; text-align: left; border-left: 10px solid #804994;}
.therapy .prevention {text-align: center; color: #fff; font-size: 21px; margin-top: 20px; padding: 20px; background: rgba(128,73,148,0.7); border: 5px solid #804994;}

.services {padding: 50px 0px;}
.services h2 {font-weight: 200; text-align: center; color: #804994; border-bottom: 1px solid #bd9fc6; padding-bottom: 10px;}
.services .gallery {margin: 20px 0px;}
.services .gallery img {opacity: 0.7;}
.services .gallery img:hover {opacity: 1.0;}
.services .pricelist {text-align: center; font-size: 21px;}

.contact {background: #bd9fc6; text-align: center; padding: 50px 0px 0px 0px; border-bottom: 15px solid #fff; font-size: 18px;}
.contact h1 {font-weight: 200; text-align: center; color: #fff; border-bottom: 1px solid #804994; padding-bottom: 10px;}
.contact span {color: rgba(255,255,255,0.7);}
.contact span.highlight {background: #804994; color: #fff; font-weight: 200; padding: 2px 20px; border-radius: 20px; line-height: 35px; display: inline-block;}
.contact .social {margin: 50px 0px 0px; padding: 0px;}
.contact .social li {list-style: none; display: inline; padding: 0px 5px;}
.contact .googlemap {margin-top: 50px; border-top: 15px solid #fff;}

.footer {padding: 50px 0px 30px; background: #555; text-align: center; color: #fff; border-bottom: 20px solid #804994;}
.footer a {color: #bd9fc6;}
.footer a:hover {color: #fff;}
.footer ul {text-align: center; padding: 30px 0px;}
.footer ul li {list-style: none; display: inline; padding: 0px 5px;}
.footer ul li a {background: #4d048c; color: #fff; width: 56px; height: 56px;}
.footer ul li a:hover {background: #0c0077; color: #fff;}

/** UI KIT **/
.uk-lightbox {background: rgba(0,0,0,0.7);}
.uk-lightbox img {border: 10px solid #fff;}
.uk-lightbox-toolbar {background: #804994;}
.uk-lightbox-caption {font-size: 14px; padding: 20px;}
.uk-accordion li {border-bottom: 1px dotted #ccc;}
.uk-accordion li.uk-open .uk-accordion-title {font-weight: normal;}
.uk-accordion-content {padding: 20px; background: #f5f5f5; margin-bottom: 20px; border-left: 5px solid #bd9fc6; font-size: 18px;}
.uk-offcanvas-close {bottom: 20px; color: #fff; top: auto;}

/** ERROR PAGE **/
.errorPage {text-align: center; margin-top: 100px;}
.errorPage .error {background: #fff; padding: 100px 0px;}
.errorPage .error img {width: 500px;}
.errorPage .error p {font-size: 18px; margin-bottom: 50px;}
.errorPage .error .button {background: #804994; font-weight: normal; text-transform: uppercase; padding: 5px 20px; border-radius: 50px; color: #fff;}
.errorPage .error .button:hover {background: #bd9fc6; text-decoration: none;}
.errorPage .error h3 {font-size: 140px; font-weight: bold; font-style: italic; color: #804994; padding: 50px 0px; border-bottom: 1px solid #ccc; line-height: 110px;}

@media (max-width: 768px) {

}

@media (min-width: 768px) {
	.reward h3 {padding: 0px 300px;}
	.reward input {width: 60%;}
	.footer ul {padding: 0px;}
	.footer .link {text-align: right;}
	.uk-lightbox-caption {font-size: 18px; padding: 20px 200px;}
	.slider .left {margin-left: 20px;}
	.slider .right {margin-right: 20px;}
	.slider .left h2 {font-size: 28px; padding: 10px 20px; line-height: 28px; border-left: 7px solid #bd9fc6;}
	.slider .right h2 {font-size: 28px; padding: 10px 20px; line-height: 28px; border-right: 7px solid #bd9fc6;}

}

@media (min-width: 1024px) {
}

@media (min-width: 1025px) {
	.slider .left {margin-left: 150px;}
	.slider .right {margin-right: 150px;}
	.slider .left h2 {font-size: 68px; padding: 20px 50px; line-height: 60px; border-left: 20px solid #bd9fc6;}
	.slider .right h2 {font-weight: 200; font-size: 68px; padding: 20px 50px; line-height: 60px; border-right: 20px solid #bd9fc6;}
}