﻿/* Make HTML 5 elements display block-level for consistent styling */ 
header, nav, article, footer, address, section { 
display: block; 
} 

/***** BEGIN RESET *****/

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, font, 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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

/***** END RESET *****/

body {
	margin: 0 auto;
	background:url(../siteart/background.jpg);
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#000;
}

h1 {font-size: 20px; color:#000; font-weight:bold; margin:0 0 20px 0;}

a img {border:0;}
a {color: #000; text-decoration:none; outline:none;}
a:hover {color: #000;}

#clear {clear:both;	}

#wrapper {
	width: 1024px;
	margin: 0 auto;
	position:relative;
	display:block;
}

.shadow {
	-webkit-box-shadow:  0px 0px 7px 4px rgba(0, 0, 0, .8);
    box-shadow:  0px 0px 7px 4px rgba(0, 0, 0, .8);
}

.top{
	padding-top:15px;
	padding-bottom:15px;
}

.top p{color:#fff; float:right; font-size:14px; line-height:30px;}

header {
	padding:0;
	height: 315px;/*For IE7*/ 
	background:url(../siteart/header-bg.jpg);
	position:relative;
	display: flex;
    align-items: center;
	flex-wrap: wrap;
}

.logo{
	position:absolute;
	top:100px;
	left:30px;
	z-index:100;
}

.slide-cover{
	top:0px;
	left:510px;
	z-index:50;
	position:absolute;
}

nav {height: 30px; float:left;}

nav ul {list-style: none;}

nav ul li {
    display: block;
    position: relative;
    float: left;
	text-align:left;
	margin-right:5px;
}

nav li ul {display: none;}

nav ul li a {
	font-family: 'Noto Sans', sans-serif;
    display: block;
    text-decoration: none;
    color: #fff;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	line-height:30px;
	background:#000;
	width:230px;
	padding-left:10px;
}

nav ul li a:hover {
/*
	color:#000;
	background:#fcaf26;
*/
}

/*#slideshow {*/
height: 293px; /* height of container is slide height plus applied border width  */
width: 570px;  /* width of container is slide width plus applied border width */
overflow:hidden;  /* Hides all other images within slideshow container while loading */
float:right;
/*}*/

/*
#slideshow img{ 
padding:0; 
border:0; 
top: 0;
left: 0;
}
*/

footer{padding:40px 0px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{text-decoration:underline; font-family:Arial, Helvetica, sans-serif;font-size:13px; color:#828383;}
a.footerlink:hover {text-decoration:none; font-family:Arial, Helvetica, sans-serif;font-size:13px; color:#828383;}
.footertext{font-family:Arial, Helvetica, sans-serif;font-size:13px; color:#828383;}
.smallfootertext{font-family:Arial, Helvetica, sans-serif;font-size:10px; color:#828383;}
.divfooter {width:450px; text-align:center; margin:20px auto; line-height:13px; display:block;}




/* NOUI SLIDER */
.noUi-target{position: relative; direction: ltr}
.noUi-origin{position: absolute; right: 0; top: 0; left: 0; bottom: 0; border-radius: 2px}
.noUi-marker, .noUi-pips, .noUi-tooltip, .noUi-value{position: absolute}
.noUi-horizontal{height: 12px; z-index: 0}
.noUi-horizontal .noUi-handle{width: 25px; height: 21px; left: -13px; top: -6px}
.noUi-horizontal .noUi-handle-upper{top: -5px}
.noUi-background{background: #ccc;}
.noUi-connect{background: #fff!important; border: 1px #999999 solid;}
.noUi-target{width: calc(100% - 15px); margin: 15px auto;}
.noUi-handle{position: relative;background: #fff !important;border: 1px solid #c8c8c8;border-radius: 3px;z-index: 1;}
.noUi-handle:after, .noUi-handle:before{content: ""; display: block; position: absolute; height: 12px; width: 1px; background: #999999; left: 10px; top: 3px}
.noUi-handle:after{left: 12px}
.noUi-pips-horizontal{padding: 5px 0; height: 10px; top: 100%; left: 0; width: 100%}
.noUi-marker-horizontal.noUi-marker{margin-left: -1px; width: 1px; height: 5px; background: #555;}
.example-val{font-weight: 700; font-size: 18px;}
.example-val span{font-weight: 500;}
#slider-price-value-lower:before, #slider-price-value-upper:before{content: '$'; padding-right: 2px}

.cycle-slideshow {
	height: 293px; /* height of container is slide height plus applied border width  */
	width: 570px; /*  width of container is slide width plus applied border width */
	overflow:hidden;  /* Hides all other images within slideshow container while loading */
	float:right;
	flex: 1;
}
.cycle-slideshow img {
	padding:0; 
	border:0; 
	top: 0;
	left: 0;
	width: 100%;
	object-fit: cover;
}


.slick-track {
    padding: 0!important;
    margin: 0!important;
}
.slick-slider {
	padding: 0!important;
}
.lf {
    flex: 1;
}



@media only screen and (max-width: 1100px) {
	div#wrapper.top {
		display: flex;
		flex-direction: column;
	}
	#wrapper.shadow {width: 100%;}
	img.logo {
		max-width: 300px;
	}
	.cycle-slideshow {
		width: 100%;
	}
	.lf {
		flex: none;
	}
	.slide-cover {
		display: none;
	}
	div#wrapper.top {
		align-content: flex-start;
        flex-wrap: wrap;
		gap: 40px;
		padding: 5px;
	}
}
@media only screen and (max-width: 500px) {
	img.logo {
        max-width: 200px;
    }
	nav ul {
		display: flex;
		flex-direction: column;
		gap: 5px;
	}
	.head-contact span {
		display: none;
	}
	.head-contact {
		display: flex;
		flex-direction: column-reverse;
	}
}
