html {
	font-size: 18px
}
.linki {
	color: #F37E21;
}
.linki:hover {
	color: orange;
}
.bg-orange {
	background-color: darkorange; 
}
.container {
	max-width: 
}
.btn {
  white-space: normal;
	border-radius: 0
}
#cb-cookie-banner { 
	position: fixed; 
	bottom: 0; 
	left: 0; 
	width: 100%; 
	z-index: 999; 
	border-radius: 0; 
	display: none; 
}
/* --------------
navbar
-----------------*/
.navbar-brand h1 {
	font-family:'PlayfairDisplay', serif;
	font-size: 28px;
	font-weight: 700;
	text-transform: uppercase;
	color: #FF8C00; 
	line-height: 1 ;
	margin-bottom: 0;
}
.navbar-brand h2 {
	font-family: 'Raleway', sans-serif;
  font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
	color: #979aaa;
	margin-bottom: 0
}

/* ----------------------------
Hero
-------------------------------*/
.hero-out {
	background:
	linear-gradient(0deg, rgba(1, 1, 1, 0.1), rgba(1, 1, 1, 0.6)), 
	url(../img/naslovna8a.jpg) no-repeat left bottom;
	background-size: cover; 
	min-height: 400px;
}
@media (min-width: 992px) { 
.hero-out {
  min-height: 600px;
}
}
.hero-text {
	max-width: 600px
}
.hero-text h1 {
	font-family: 'Raleway', sans-serif;
	font-weight: 900;
	color: linen;
	text-transform: uppercase;
}
.hero-text h3 {
	font-family: 'Raleway', sans-serif;
	font-weight: 700;
	font-size: 1.4rem;
	color: darkorange;
}
.hero-text h2 span {
	color: linen
}
.hero-text .btn{
	background-color: darkorange;
}
.hero-text .btn:hover{
	background-color: #ff981a
}
/* ----------------------------
Heading
-------------------------------*/
.site-heading {
  position: relative;
}
.site-title-tagline {
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 400;
	color: #F37E21;
}
.site-title  {
	font-family: 'PlayfairDisplay', serif;
}
.site-title span {
   color: #F37E21;
}
.heading-divider {
	position: relative;
	height: 4px;
	background-color: #F37E21;
	width: 100px;
	margin: 16px 0
}
.heading-divider::after {
	content: '';
	position: absolute;
}
.header-bg {
	background-color: rgba(255, 255, 255, 0.75);
	padding: 32px;
}
.header-bg p {
	margin-bottom: 6px
}
/* ----------------------------
Section 1
-------------------------------*/
.sect1 .btn{
	background-color: darkorange ;
	color: white;
	font-family: 'Raleway', sans-serif;
  font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
	border: none;
	padding: 8px 36px;
}
.sect1 .btn:hover{
	background-color: #ff981a
}
/* ----------------------------
Section 2 Cards
-------------------------------*/
.sect2 {
	background-color: #f1eadd;
}
.cart-title {
	font-family:'PlayfairDisplay', serif;
}
.sect2 .readmore {
	color: darkorange;
	font-family: 'Raleway', sans-serif;
  font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
}
.sect2 .readmore:hover{
	color: orange
}
/* ----------------------------
Section 3 Dark
-------------------------------*/
.sect3 {
	background-color: #1F1D19;
	background:
	linear-gradient(0deg, rgba(1, 1, 1, 0.9), rgba(1, 1, 1, 0.5)), 
	url(../img/bgs/bg-store.jpg) no-repeat center center;
	background-size: cover; 
	color: whitesmoke;
	background-attachment: fixed
}
.quality {
	font-size: 16px;
	font-family:'Raleway', sans-serif;
	margin-bottom: 18px;
	color: darkorange;
	text-transform: uppercase;
}
@media (max-width: 1024px) { 
	.izdvojeno {
	text-align: center
}
}
/* ----------------------------
Section 4 ikonice
-------------------------------*/
.sect4 img {
	max-height: 120px;
}
/* ----------------------------
Section garden
-------------------------------*/
.garden {
	background-color:  whitesmoke;
}
.garden img{
	background-color:  whitesmoke;
	border: 10px solid white; 
	max-height: 500px; 
	margin-bottom: -150px;
	box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -webkit-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -moz-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
}
.garden1 {
	background: url(../img/oblak.jpg) no-repeat center bottom;
	background-size: cover; 
	min-height: 450px;
	background-color:  whitesmoke;
}
@media (max-width: 767.98px) { 
	.garden1 {
	min-height: 200px;
}
}
/* ----------------------------
Section kontakt
-------------------------------*/
.sectkontakt {
	min-height: 500px;
	background-image:
	url(../img/call-2.jpg);
	background-repeat:no-repeat;
	background-position: 90% 40%; 
	background-size: cover; 
}
@media (max-width: 767.98px) { 
.sectkontakt {
	background-position: 80% 40%; 
	min-height: 500px;
}
}
@media (min-width: 768px) and (max-width: 991.98px) { 
.sectkontakt {
	background-position: 75% 40%; 
}
}
.sect1 li a {
	color: #212529
}
.sect1 i {
	font-size: 24px;
	padding-right: 12px
}
.sect1 li a:hover .bi {
	color: darkorange
}
.location { 
	background-color: #f1eadd;
}
.location img {
  border: solid 14px white; 
	box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -webkit-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -moz-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
}
.podaci {
	background:
	url(../img/bgs/suma2.png) repeat-x center bottom;
	background-size: auto;
	background-color: #f1eadd;
}
.podaci h5{
	font-family:'PlayfairDisplay', serif;
}
.btn-podaci{
	background-color: rgb(241, 234, 221, 0.5);
	border:solid 1px grey;
	font-family: 'Raleway', sans-serif;
  font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
	padding: 8px 36px;
}
.btn-podaci:hover{
	background-color:rgb(241, 234, 221, 0.5);
	border:solid 1px #F37E21;
	color: #F37E21;
}
.modal-header h1 {
	font-family:'PlayfairDisplay', serif;
}
.modal-body h4 {
	font-family:'PlayfairDisplay', serif;
	padding-top: 1rem
}
.modal-body p {
	font-size: 16px
}
/* --------------
GALERIJA
-----------------*/
.galtop {
	min-height: 500px;
	background: url(../img/flooring-14b.jpg) no-repeat 93% center;
	background-size: cover; 
}
@media (min-width: 992px) {
.galtop {
	background-position: left 20%
}
}
.galerija-out {
	background: 
	url(../img/bgs/bg-6.png) repeat-y center center;
	background-size: cover; 
}
.galerija-in {
	max-width: 900px; 
	margin:0px auto;
}
.galerija-in h4 {
	font-family:'PlayfairDisplay', serif;
	color: ;
}
/* on hover effects GROW
.galerija-in div {
	overflow: hidden;
}
*/
.grow { 
	transition: all .2s ease-in-out; 
}
.grow:hover { 
	transform: scale(1.08); 
	-webkit-filter: brightness(115%);
}
.accordion-button:not(.collapsed){
  background-color: white;
	color: inherit
}
.accordion-body {
	background-color:white;
	padding: 36px
}
.accordion-button::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
	background-color: white;
}
.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8'/%3E%3C/svg%3E");
}
@media (max-width: 767.98px) { 
.accordion-body {
	padding: 24px
}
}
/* --------------
PODOVI
-----------------*/
.laminati1 {
	min-height: 500px;
	background-image:
	url(../img/podovi-top.jpg);
	background-repeat:no-repeat;
	background-position: center center; 
	background-size: cover; 
}
.laminati2  {
	background: linear-gradient(0deg, #f1eadd 12%, white 12%);
}
.laminati3, .vinili {
	background-color: #f1eadd 
}
.laminati-adaja {
	min-height: 500px;
	background-image:
	url(../img/laminat-hrast-adaja.jpg);
	background-repeat:no-repeat;
	background-position: center center; 
	background-size: cover; 
}
.vanjski {
	background:
	radial-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,1) 100%),
	url(../img/bgs/stone-2.jpg) repeat center center;
	background-size: auto; 
	color: whitesmoke;
	background-attachment: fixed
}
/* --------------
VRATA
-----------------*/
.vrata-top {
	min-height: 500px;
	background-image:
	url(../img/bgs/vrata-top.jpg);
	background-repeat:no-repeat;
	background-position: left top; 
	background-size: cover; 
}
.drvena {
	background-color: #f1eadd 
}
.ugr {
  background: rgba(254, 254, 253, 0.85);
  padding: 40px;
}
.ugradnja {
	background:
	linear-gradient(0deg, rgba(205, 187, 168, 0.9), rgba(205, 187, 168, 0.9)), 
	url(../img/vrata/doors-25bw.jpg) no-repeat center center;
	background-size: cover; 
	background-color: #c7baac
}
.ugrtext h3 {
	font-family: 'Raleway', sans-serif;
	font-weight: 900;
	color: #f1eadd ;
	padding-top: 16px;
}
.ugrtext {
	max-width: 500px;
	margin: 0 auto
}
.ugrtext p{
	color: #635240;
	font-family:'Raleway', sans-serif;
	font-size: 15px;
	text-transform: uppercase
}
.alu {
	background-color: whitesmoke
}
.alu img:first-child {
	box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -webkit-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
  -moz-box-shadow: 2px 10px 12px 0px rgba(0,0,0,0.29);
}
/* --------------
OSTALO
-----------------*/
.ostalo-top {
	min-height: 500px;
	background-image:
	url(../img/stub-3.jpg);
	background-repeat:no-repeat;
	background-position:right center; 
	background-size: cover; 
}
.garden2 {
	background:
	url(../img/patio-10.jpg) no-repeat 50% 30% ;
	background-size: cover;
	min-height: 500px
}
.garden2 h3{
	font-family:'Raleway', sans-serif;
	font-weight: 900;
	text-transform: uppercase;
	color: #333b2b
}
.garden2 p{
	color: #635240;
	font-family:'Raleway', sans-serif;
	font-size: 15px;
	text-transform: uppercase;
}
.garden2 .header-bg {
	max-width: 500px;
	margin: auto
}
/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
.garden2 {
	min-height: 600px
}
}
/* --------------
FOOOTER
-----------------*/
.footer {
	background-color: #1F1D19;
	font-family: 'Raleway', sans-serif;
	font-size: 16px;
	color: lightgray;
}
.footer-uls {
	max-width: 1000px; margin:0px auto;
}
a[href^=tel] {
	color: inherit;
	text-decoration: none;
}
.footer span {
	text-transform: uppercase;
	color: darkorange;
	font-weight: 700;
}
.footer-brand h1 {
	font-family:'PlayfairDisplay', serif;
	font-size: 28px;
	font-weight: 700;
	text-transform: uppercase;
	color: darkorange; 
	margin-bottom: 0;
}
.footer .footer-nav li a {
	color: lightgray;
	text-transform: uppercase; 
	letter-spacing: ;
}
.footer-nav li a:hover {
	color: darkorange;
}
.ccrta {
	border: solid 2px darkorange;
	opacity: 1;
	max-width: 100px;
	margin: 8px auto 16px
}
.footer a {
	color: lightgray;
}
.footer a:hover {
	color: darkorange;
}

/* --------------
FONTS
-----------------*/
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/raleway-regular.woff2') format('woff2'),
	     url('../fonts/raleway-regular.ttf') format('truetype');
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/raleway-500.woff2') format('woff2'),
	     url('../fonts/raleway-500.ttf') format('truetype');
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/raleway-700.woff2') format('woff2'),
	     url('../fonts/raleway-700.ttf') format('truetype');
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/raleway-900.woff2') format('woff2'),
	     url('../fonts/raleway-900.ttf') format('truetype');
}
@font-face {
  font-family: 'PlayfairDisplay';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/playfair-display-regular.woff2') format('woff2'), 
       url('../fonts/PlayfairDisplay-Medium.ttf') format('truetype'); 
}
@font-face {
  font-family: 'PlayfairDisplay';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/playfair-display-bold.woff2') format('woff2'),
}
/* --------------
TOGGLER
-----------------*/
.navbar-toggler {
  border: none; 
  border-radius: 0;
  padding:8px 3px 11px;
}
.animated-icon1{
	width: 30px;
	height: 20px;
	position: relative;
	margin: 0px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
cursor: pointer;
}
.animated-icon1 span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}
.animated-icon1 span {
	background: #FF8C00;
}
.animated-icon1 span:nth-child(1) {
	top: 0px;
}
.animated-icon1 span:nth-child(2) {
	top: 10px;
}
.animated-icon1 span:nth-child(3) {
	top: 20px;
}
.animated-icon1.open span:nth-child(1) {
	top: 11px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
}
.animated-icon1.open span:nth-child(2) {
	opacity: 0;
	left: 60px;
}
.animated-icon1.open span:nth-child(3) {
	top: 11px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

/* ----------------------------
Small devices (less than 768px)
-------------------------------*/
@media (max-width: 767.98px) { 

}
/* ----------------------------
Medium devices (tablets)
-------------------------------*/
@media (min-width: 768px) and (max-width: 991.98px) { 

}
/* ------------------------------------------
Large devices (desktops, 992px and up)
---------------------------------------------*/
@media (min-width: 992px) { 

}