@import url(https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic);

body { font: 400 16px/1.4 RobotoDraft, Arial, sans-serif; color: #333; -webkit-font-smoothing: antialiased; overflow: hidden; }
h1 { font-size: 26px; color: #333333; margin: 1rem 0 0.25rem; font-weight: 400; }
h2 { font-size: 26px; color: #f68b1f; margin: 1rem 0 0.25rem; font-weight: 500; }
h3 { font-size: 20px; color: #333333; margin: 1rem 0 0.25rem; font-weight: 400; }
h4 { font-size: 18px; color: #333333; margin: 1rem 0 0.25rem; font-weight: 500; }

.background-grey { background-color: #EAE9E9; }
.background-dark-grey { background-color: #E0DFDF; }
.background-white { background-color: #FFF; }
.background-orenge { background-color: #f68b1f; }
.color-orenge { color: #f68b1f; }
.color-white { color: #FFF; }
.color-grey { color: #333; }
.background-image { background-repeat: no-repeat; background-size: cover; background-position: center; }


.button-orenge { background-color: #f68b1f; border-radius: 15px; display: inline-block; padding: 5px 30px; color: #FFF !important; text-decoration: none !important; }
.button-orenge:hover { background-color: #F7941D; }

#preloader { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; height: 100%; background-color: rgba(250, 250, 250, 0.95); }
#preloader div { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; height: 126px; }
#preloader img { display: block; margin: auto; }

[data-id] { cursor: pointer; }

#header,
#navigation-backdrop,
#header .nav-menu,
#header .nav-menu li a,
.blocks .block-data,
.footer .footer-heading,
.button-orenge,
[data-fancybox]:after,
[data-fancybox]:before,
.footer-nav a
{ -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }

#header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; border-top: 5px solid #f68b1f; padding: 10px 0; border-bottom: 1px solid #fff; background-color: #fff; }
#header .nav-menu { margin: 0; padding: 0; list-style: none; }
#header .nav-menu li a { color: #333; padding: 10px 20px; display: block; text-decoration: none; }
#header .nav-menu li a:hover { color: #f68b1f; }
#header .nav-open { padding: 0 10px; }
#header .nav-open span { width: 25px; height: 3px; display: block; background-color: #f68b1f; margin: 3px auto;  }
#header .contact-btn { margin: 5px 0; float: right; }


#header.fixed { background-color: #FFF; border-bottom: 1px solid #DDD; }
#header.fixed .nav-menu li a { color: #333; }
#header.fixed .nav-menu li a:hover { color: #f68b1f; }



#banner .slide-body { width: 100%; position: relative; vertical-align: top; }
#banner .slider-image { background-repeat: no-repeat; background-size: cover; background-position: center; padding: 25%; }
#banner .caption .background-color { padding: 15px; background-color: #f68b1f; color: #FFF; white-space: normal }
#banner .caption p { font-weight: 400; font-size: 20px; margin-bottom: 0; }
.responsive-slider .slides { background-color: #f68b1f; }

#banner .slider-control { background-color: rgba(0,0,0,0.5); padding: 5px; border-radius: 4px; }
#banner .slider-control img { width: 30px; height: 100%; }
#banner .slider-control.left { -webkit-transform: scaleX(-1); transform: scaleX(-1); left: 10px; }
#banner .slider-control.right { right: 10px; }


.blocks { overflow: hidden; }
.blocks .block-data { position: absolute; bottom: 0; left: 0; right: 0; height: 70px; padding: 0 20px; background-color: rgba(0, 0, 0, 0.5); }
.blocks:hover .block-data { height: 100%; overflow-y: scroll;}
.blocks .block-data h3 { font-size: 28px; }
.blocks .block-data h4 { font-size: 22px; }
.blocks .block-data ul { font-size: 18px; }


/*.packages.basic { background-color: #574f47; padding-bottom: 72px; }*/
/*.packages.advance { background-color: #433d37; padding-bottom: 72px; }*/
.packages { background-color: #fff; padding-bottom: 72px; }
.packages h4 { font-weight: 500; display: inline-block; margin: 20px 0; color: #2E3092; }
.packages .price { background-color: #f68b1f; margin: 0; padding: 20px 0; font-weight: 700; color: #FFF; }
.packages ul { text-align: left; padding-left: 30px; padding-right: 10px; margin: 20px 0 10px; display: inline-block; }
.packages ul li { margin-bottom: 10px; color: #2E3092; }
.packages .button { background-color: rgba(0,0,0,0.15); padding: 20px 0; position: absolute; left: 15px; right: 15px; bottom: 0; }


.news-articles { display: inline-block; width: 100%; height: 100%; background-color: rgba(255,255,255,0.4); padding: 0 20px }

.contact-section img { border-right: 2px solid #FFF; margin-right: 10px; float: left; padding: 10px 10px }
.contact-section p { float: left; margin-bottom: 0; width: 75%; }


.footer .footer-heading { opacity: 0.4; }
.footer .footer-heading:hover,
.footer .footer-heading.active { opacity: 1; }

.footer-nav a { color: #333; text-decoration: none; }
.footer-nav a:hover { color: #f68b1f; }
.footer-nav ul { margin: 0; padding: 0; list-style: none; }
.footer-nav ul li { display: inline-block; }
.footer-nav ul li a { display: inline-block; padding: 5px 10px; }

.social-nav { padding: 0; margin: 0; list-style: none; text-align: center }
.social-nav li { display: inline-block; }
.social-nav li a { display: block; padding: 10px; color: #555; text-decoration: none; }
.social-nav li a img { padding: 10px 10px; width: 36px; display: block; background-color: #777; border-radius: 4px; margin: 0 auto 10px; }
.social-nav li a:hover { color: #000; }

#news-articles { background-position: center 55%; background-size: 100%; background-color: #f2f2f2; position: relative; }

[data-fancybox] { overflow: hidden; }
[data-fancybox]:after { opacity: 0; content: ''; position: absolute; left: 0; right: 0; bottom: 0%; background-color: rgba(0,0,0,0.4); display: block; height: 100%; }
[data-fancybox]:before { opacity: 0; content: ''; position: absolute; left: 0; right: 0; top: 45%; width: 20px; height: 20px; background-size: cover; margin: auto; z-index: 10; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiA1MTIiIGhlaWdodD0iNTEycHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iNTEycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik00OTcuOTEzLDQ5Ny45MTNjLTE4Ljc4MiwxOC43ODItNDkuMjI1LDE4Ljc4Mi02OC4wMDgsMGwtODQuODYyLTg0Ljg2M2MtMzQuODg5LDIyLjM4Mi03Ni4xMywzNS43MTctMTIwLjY1OSwzNS43MTcgIEMxMDAuNDY5LDQ0OC43NjcsMCwzNDguMzEyLDAsMjI0LjM4M1MxMDAuNDY5LDAsMjI0LjM4NCwwYzEyMy45MzEsMCwyMjQuMzg0LDEwMC40NTIsMjI0LjM4NCwyMjQuMzgzICBjMCw0NC41MTQtMTMuMzUyLDg1Ljc3MS0zNS43MTgsMTIwLjY3Nmw4NC44NjMsODQuODYzQzUxNi42OTUsNDQ4LjcwNCw1MTYuNjk1LDQ3OS4xMzEsNDk3LjkxMyw0OTcuOTEzeiBNMjI0LjM4NCw2NC4xMDkgIGMtODguNTExLDAtMTYwLjI3NCw3MS43NDctMTYwLjI3NCwxNjAuMjczYzAsODguNTI2LDcxLjc2NCwxNjAuMjc0LDE2MC4yNzQsMTYwLjI3NGM4OC41MjUsMCwxNjAuMjczLTcxLjc0OCwxNjAuMjczLTE2MC4yNzQgIEMzODQuNjU3LDEzNS44NTYsMzEyLjkwOSw2NC4xMDksMjI0LjM4NCw2NC4xMDl6Ii8+PC9zdmc+); }
[data-fancybox]:hover:after { opacity: 1; }
[data-fancybox]:hover:before { opacity: 1; }

.fancybox-close-small { outline: 0 !important; }
.fancybox-close-small:after { outline: 0 !important; }
#main-content { z-index: 100; position: relative; background-color: #FFF; }


#why-sunfin .icons p { font-size: 24px; color: #FFF; line-height: 1.2; margin-bottom: 0; }
#why-sunfin .icons [class*="col"]:nth-of-type(1),
#why-sunfin .icons [class*="col"]:nth-of-type(3) { border-right: 2px solid #fff }





@media (max-width: 1199px) {
	#navigation-backdrop {  position: fixed; background-color: rgba(0,0,0,0.5); opacity: 0; }
	.nav-opened #navigation-backdrop { z-index: 998; opacity: 1; top: 0; left: 0; bottom: 0; right: 0; }
	.nav-opened { overflow: hidden; }
	#header { background-color: #FFF; }
	#header .nav-menu { position: fixed; right: -300px; width: 250px; top: 0; bottom: 0; background-color: #F9F9F9; z-index: 9999; overflow: auto; box-shadow: -1px 0px 3px 1px rgba(229, 29, 46, 0.5); }
	.nav-opened #header .nav-menu { right: 0px; }
}


@media (max-width: 767px) {
	#banner .caption { margin: 0 !important; opacity: 1 !important;  }
}


@media (min-width: 576px) {
	.contact-section p { width: auto; }
}

@media (min-width: 768px) {
	.blocks .block-data { height: 75px; }


	#news-articles { background-position: center 95%; background-size: 80%; }


	.footer-nav ul li a { padding: 5px 15px; }

	h1 { font-size: 36px; }
	h2 { font-size: 36px; }
	h3 { font-size: 24px; }
	h4 { font-size: 18px; }
}

@media (min-width: 992px) {
	#why-sunfin .icons img,
	#why-sunfin .icons p { display: inline-block; vertical-align: middle; font-size: 18px; }
	#why-sunfin .icons img { margin-right: 10px; }
	#why-sunfin .icons [class*="col"]:nth-of-type(2) { border-right: 2px solid #fff }
	.responsive-slider .slider-control { top: 45%; }
}

@media (min-width: 1200px) {
	#why-sunfin .icons p { font-size: 22px; }
	#header .nav-menu li a { padding: 15px 10px; color: #333; }
	#header .nav-menu li { display: inline-block; }
	#header .nav-menu { text-align: center; }
	#banner .caption { width: 85%; padding: 15px; }
	#banner .caption p { font-weight: 400; font-size: 28px; }
	#news-articles { background-size: 60%; }

	.responsive-slider .slider-control { top: 50%; }

	#banner .caption { text-align: center; white-space: normal;  color: #FFF; line-height: 1.4; position: absolute; bottom: 5%; right: 0; left: 0; margin: auto; }
	#banner .caption .background-color { padding: 15px; background-color: rgba(346, 139, 31, 0.8); border-radius: 15px; display: inline-block; }
	#banner .slider-image { padding: 25% 50%; background-attachment: fixed; }
}


@media (min-width: 1520px) {
	.about-col { max-width: 80%; }
}