body {font-family: 'Source Sans Pro', sans-serif; font-weight: normal; font-size: 17px; line-height: 1.6; overflow-x: hidden; color: #333}
h1, h2, h3, h4, h5 {font-family: 'Exo 2', sans-serif; font-weight: bold;}
strong, b, .btn {font-family: 'Exo 2', sans-serif; font-size: 15px; font-weight: normal}
img {display: block}

/* Preloader
============================== */
#preloader {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #ecf0f1; z-index: 10000; text-align: center}
#preloader img {margin: 0 auto}

/* Header
============================== */
#header-wrapper {position: relative; z-index: 1000; text-align: center; padding: 10px 0; background: #fff}
#top-bar {background: #dd5f56; color: #fff; padding: 10px 0; line-height: 1.2}
#top-bar a {color: inherit; text-decoration: none}
.secondary-menu {list-style: none; margin: 0; padding: 0}
.secondary-menu li {padding: 0 15px 0 30px; position: relative; font-weight: bold; border-bottom: 1px solid #b3352c; padding-bottom: 5px; margin-bottom: 5px}
.secondary-menu li a:last-of-type {display: block; font-weight: normal}
.secondary-menu li i {display: none; position: absolute; left: 0; top: 0; font-size: 25px;}

/* Page Header
============================== */
#page-header {background-size:cover; background-repeat: no-repeat; padding: 100px 0; text-align: center; color: #fff}
#page-header h1 {margin: 0 auto; color: #dd5f56; font-size: 2em;}
#breadcrumbs {list-style: none; margin: 0; padding: 0; font-family: 'Exo 2', sans-serif}
#breadcrumbs li {display: inline-block}
#breadcrumbs li:not(:last-child):after {content: "\F0142"; display: inline-block; margin: 0 1px 0 5px; font: normal normal normal 17px/1 "Material Design Icons"; vertical-align: middle;}

/* Navigation
============================== */
#menu {text-align:left; font-family: 'Exo 2', sans-serif; font-size: 15px}
#menu ul {display: none; list-style:none; margin:0; padding:0; color: #3f5251; }
#menu ul li {position:relative}
#menu ul li a {display:block; padding:15px; text-decoration:none; color:inherit; position:relative;}
#menu ul li a:hover {color:#d63628}
#menu ul li a i {font-size: 18px; position: relative; top: 2px}
#menu ul li ul {display: none;}
#menu ul li:last-child ul {left:auto; right:0}
#menu ul li ul.expand {display:block}
#menu ul li ul li {position:relative; float:none; display:block; text-align:left;}
#menu ul li ul li:last-child {border-bottom:none}
#menu ul li ul li:last-child:after {display:none}
#menu ul li ul li a:hover {background:#f3f3f3; color: inherit}
#menu ul li ul li a {color:#333; padding: 15px 20px; font-weight: normal}
#menu ul li.contact a {background: #00a78c; color: #fff; border-radius: 50px; padding: 6px 30px; text-transform: uppercase; letter-spacing: 0.3px; font-size: 12px;}
#menu ul li.contact a:hover {color:#fff; background:#039880}
#nav-btn {display: block; color: inherit; text-align: left; width: 100%; position: relative; background: none; border: 1px solid #dedede; padding: 12px 10px; margin-top: 25px; font-family: inherit; outline: none}
#nav-btn i {position: absolute; right: 10px; font-size: 25px; color: #777; top: 7px;}

/* Social Icons
============================== */
.social-icons {list-style: none; margin: 0; padding: 0; color: #fff; font-size: 20px}
.social-icons li {display: inline-block; margin: 0 5px}
.social-icons li a {color: inherit}
.social-icons li a:hover {opacity: 0.8}

/* Slide
============================== */
#slide {padding-bottom: 0; border-bottom: 1px solid #dedede; position: relative}
#slide h1 {font-size:2.4em}
#slide p {margin-bottom: 25px}
#slide .title {font-size: 18px; color: #7bb3af;}
#slide .title span {display: block; font-size: 4em; line-height: 1; color: #dd5f56;}
#slide img {display: block}
#slide ul {padding: 0}
#slide > ul > li {padding-top: 170px; background-size: cover; background-repeat: no-repeat; background-position: center}
.cycle-slideshow {margin: 0; overflow: hidden}
.cycle-slideshow li:first-child {display: block}
.cycle-slideshow li {display: none; width: 100%; position: relative}
#slide .nav-bullets {position:absolute; z-index:100; display:block; width:100%; left: 0; bottom:0; text-align:center}
#slide .nav-bullets span {cursor:pointer; display:inline-block; text-indent:-9000px; width:14px; height:14px; margin-right:5px; background:url(../images/slider-bullets.png)no-repeat; background-position:0 -14px}
#slide .nav-bullets span.cycle-pager-active {background-position:0 0}
#slide .nav-arrows {display: none}
#slide .nav-arrows a {position:absolute; z-index:100; top:45%; background:url(../images/slider-arrows.png)no-repeat; width:48px; height:83px; transition:0.3s all}
#slide .nav-arrows #prev {background-position:0 0; left:-100px}
#slide .nav-arrows #next {background-position:0 -83px; right:-100px}
#slide:hover .nav-arrows #prev {left:50px}
#slide:hover .nav-arrows #next {right:50px}

/* Button
============================== */
.btn {display: inline-block; padding: 15px 30px; border-radius: 0; letter-spacing: 0; font-weight: normal; color: #fff; text-decoration: none; text-transform: none}
.btn:hover {opacity: 0.9;}
.btn-primary {background: #336e6a}

/* Boxed Items
============================== */
.boxed {text-align: center; border-radius: 10px}
.boxed [class^="col-"] > div {padding: 60px 30px 20px; background: #fff; position: relative; box-shadow: 0px 1px 0px 0px rgba(227, 227, 227, 0.75)}
.boxed i {font-size: 2.5em; color: #427975; display: block; width: 90px; height: 90px; line-height: 90px; border-radius: 50%; margin: 0 auto; background: #fff; position: absolute; top: -40px; left: 0; right: 0;}
.boxed p {margin-bottom: 20px}

/* Boxes
============================== */
.box {background: #fff; box-shadow: 0px 1px 0px 0px rgba(227, 227, 227, 0.75); transition: transform 300ms ease 0ms; border: 1px solid #f1f1f1}
.box:hover {transform: scale(1.05, 1.05)}
.box picture, .box img {margin-bottom: 0}
.box h3 {font-size: 20px; font-weight: bold}
.box .description {padding: 30px;}
.parallax {background-size: cover; background-repeat: no-repeat; background-position: center;}
.parallax .box {padding: 40px}
.parallax .box:hover {transform: none}

/* Elements
============================== */
.separator {display: block}
.text-center .separator {margin: 20px auto;}
.hero .separator, [class^="bg-"] .separator {background: #fff}
.hero {background-repeat: no-repeat; background-size: cover;}
.hero-light {background-color: #f1f1f1}
.hero .container > .row {min-height: 350px}
.figure {background-repeat: no-repeat; background-size: cover; width: 50%; height: 100%; top: 0; left: 0; right: auto; position: absolute;}
.hero-right .figure {right: 0; left: auto}
.hero h2 {color: inherit}
.stars {font-size: 17px;}
.stars i {background: #dd5f56; color: #fff; display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: .25rem;}
.stars span {display: block; font-size: 12px; margin-top: 5px}
.map-wrapper {border: 1px solid #eaeaea; padding: 3px;}
article:not(:last-of-type) {margin-bottom: 35px; padding-bottom: 30px; border-bottom: 1px solid #eaeaea}
.widget {border: 1px solid #f1f1f1; padding: 20px; background: #fafafa;}
.widget:not(:last-child) {margin-bottom: 30px}
.widget h2 {font-size: 24px; text-align: center;}
.widget .form .btn {display: block; width: 100%}
.online-hearing-test {margin-top: -117px; position: relative; z-index: 1;}
.section-title {font-family: 'Exo 2', sans-serif;}
.section-title span {text-transform: uppercase; border: 1px solid #333; border-width: 0 0 0 2px; padding: 0 10px; display: inline-block; margin-bottom: 10px; line-height: 1}
.text-center .section-title span {border-width: 0 2px}

/* Contact page
============================== */
.wrapper-contact {padding: 70px 0 150px}
.wrapper-contact:after {content:""; position: absolute; left: 0; bottom: -50%; width: 150%; height: 100%; transform: rotateZ(-5deg); background: #f3f3f3; z-index: -1}
.address-box {background: #dd5f56; color: #fff; padding: 40px 20px; border-radius: 8px; text-align: center}
.address-info h3 {text-transform: uppercase; font-size: 14px; margin-bottom: 0;}
.address-info p {margin-bottom: 30px;}
.contact-box {border: 1px solid #eaeaea; padding: 30px; border-radius: 8px; background: #fff}
form input[type="text"], form input[type="tel"], form input[type="email"], form textarea, form select {border:1px solid #eaeaea; font-family:inherit; font-size:15px; border-radius:6px; margin-bottom:15px; box-shadow:none; height: 45px; padding: 5px; width: 100%}
form textarea {min-height: 100px}
form label {display: block}
form .row {margin-bottom: 0 !important}
.result {margin-top: 15px}
.result h3 {font-size: 17px; margin-bottom: 5px}
.loader {background: url(/images/ajax-loader.gif)no-repeat 0px 2px; background-size: 20px 20px; height: 30px; padding: 0 0 0 20px !important; display: none; text-align: left; margin: 10px 0;}
.loader:after {content:"Sending..."; margin-left: 5px}
.outline {background: #fff; border: 1px solid #e6e6e6; padding: 30px; text-align: center; height: 100%; font-family: 'Exo 2', sans-serif}
.outline h3 {padding: 0; margin-bottom: 20px}
.outline i {display: block; font-size: 3em; line-height: 1; color: #e22454}
.outline p {margin-bottom: 0}

/* Blog page
============================== */
#blog article img {margin-bottom: 15px}
#blog article h2 {font-size: 18px; margin-bottom: 0}
#blog .blog-info {margin-bottom: 20px}
#blog .blog-info span:not(:last-child):after {content:"|"; margin: 0 10px}
.recent-posts {list-style: none; padding: 0; margin: 0}
.recent-posts li {padding: 10px 0}
.recent-posts li:not(:last-child) {border-bottom: 1px solid #eaeaea; padding-bottom: 20px; margin-bottom: 10px}
.recent-posts li span {display: block; opacity: 0.5; font-weight: bold}

/* Section separators
============================== */
.ss-doublediagonal {z-index: 1; padding-top: 6em; background: #def0ee; margin-top:80px; overflow: visible}
.ss-doublediagonal::before, .ss-doublediagonal::after {content: ""; position: absolute; pointer-events: none; top: 0; left: -25%; z-index: -1; width: 150%; height: 75%; background: inherit; -webkit-transform: rotate(-2deg); transform: rotate(-2deg); -webkit-transform-origin: 0 0; transform-origin: 0 0;}
.ss-doublediagonal::before {height: 50%; background: #edf6f6; -webkit-transform: rotate(-3deg); transform: rotate(-3deg); -webkit-transform-origin: 3% 0; transform-origin: 3% 0;}

/* Page 404
============================== */
.page-404 .page-wrapper .container {max-width: 900px}
.page-404 .page-wrapper i {font-size: 20em; line-height: 1; color: #e22454;}

/* Call to action
============================== */
.call-to-action {background: #dd5f56; color: #fff; text-align: center; padding: 70px 0}
.page-contact .call-to-action, .page-404 .call-to-action {display: none}
.call-to-action h2 {color: inherit; font-size: 28px; margin-bottom: 10px}

/* Footer
============================== */
#footer {background: #454545; color: #fff; padding: 70px 0}
#footer h3 {font-size: 18px; color: inherit}
#footer ul {list-style: none; margin: 0; padding: 0; line-height: 2}
#copyright {background: #3a3a3a; color: #a7a7a7; padding: 20px 0; font-size: 11px;}
#copyright a {color: #fff}
#scroll-to-top {position: fixed; right: 20px; bottom: 0; z-index: 1000; background: #336e6a; width: 50px; height: 35px; line-height: 35px; text-align: center; border-radius: 5px 5px 0 0; font-size: 30px; color: #fff;}

@media (min-width: 576px) {
	
}

@media (min-width: 768px) {
	
}

@media (min-width: 992px) {
	.home #header-wrapper {position: absolute; top: 0; left: 0; right: 0; background: none;}
	#header-wrapper .container {max-width: 90%;}
  #header-wrapper.fixed {position: fixed; top: 0; left: 0; right: 0; background: rgba(255,255,255,0.9); box-shadow: rgba(0,0,0,.117647) 0 1px 3px}
  #header-wrapper.fixed + #page-header {margin-top: 99px}
	.secondary-menu {display: block}
	.secondary-menu li {display: inline-block; border-bottom-width: 0; margin-bottom: 0; padding-bottom: 0}
	.secondary-menu li:not(:first-child) {margin-left: 5px}
	.secondary-menu li:not(:last-child) {border-right: 1px solid #b3352c}
	.secondary-menu li i {display: block}
	#menu {text-align: right;}
	#menu ul {display:inline-block}
	#menu ul li {display: inline-block}
	#menu ul li a {padding:24px 15px}
	#menu ul li ul {background: #fff; box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); position: absolute; z-index: 100; left: 0; top: 100%; width: 240px; text-align: center;}
	#menu ul li:hover ul {display: block}
	#nav-btn {display: none}
	#slide ul li {padding: 100px 0;}
	#slide ul li .row {min-height: calc(100vh - 240px)}
	#slide .nav-arrows {display: block}
	.online-hearing-test {margin-top: -236px}
  .parallax {padding: 200px 0}
}

@media (max-width: 991px) {
	#menu ul {border-top: 1px solid #dedede}
	#menu > ul {border: 1px solid #dedede; border-top-width: 0}
	#menu ul li {border-bottom: 1px solid #dedede}
	#menu ul li a {font-weight: normal}
	#menu ul li a i {position: absolute; top: 0; right: 0; width: 46px; height: 46px; line-height: 46px; text-align: center}
	#slide ul li {padding: 80px 0 !important}
	#page-header {padding: 40px 0 !important}
	#page-header h1 {margin: 0; font-size: 2.5em}
}