@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot?-nieqzk');
	src:url('fonts/icomoon.eot?#iefix-nieqzk') format('embedded-opentype'),
		url('fonts/icomoon.woff?-nieqzk') format('woff'),
		url('fonts/icomoon.ttf?-nieqzk') format('truetype'),
		url('fonts/icomoon.svg?-nieqzk#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transition: color 1s ease;
}



.icon-food:before {
  content: "\e91b";
}
.icon-heart:before {
  content: "\e91c";
}
.icon-more:before {
  content: "\e91d";
}
.icon-museum:before {
  content: "\e91e";
}
.icon-nature:before {
  content: "\e91f";
}
.icon-villa1:before {
  content: "\e90b";
}
.icon-google-maps:before {
  content: "\e933";
}
.icon-google-social-badge:before {
  content: "\e934";
}
.icon-kitchen:before {
  content: "\e903";
}
.icon-facebook2:before {
  content: "\e90a";
}
.icon-wash:before {
  content: "\e912";
}
.icon-tisina:before {
  content: "\e914";
}
.icon-yard:before {
  content: "\e919";
}
.icon-car:before {
  content: "\e91a";
}
.icon-people:before {
  content: "\e90c";
}
.icon-bathtube-with-shower:before {
  content: "\e90d";
}
.icon-bedroom:before {
  content: "\e90e";
}
.icon-family-group-of-a-couple-with-three-children:before {
  content: "\e90f";
}
.icon-fireplace:before {
  content: "\e910";
}
.icon-monitor:before {
  content: "\e911";
}
.icon-no-smoking-sign-svgrepo-com:before {
  content: "\e913";
}
.icon-pawprint:before {
  content: "\e915";
}
.icon-satellite-tv:before {
  content: "\e916";
}
.icon-villa:before {
  content: "\e917";
}
.icon-wifi-signal:before {
  content: "\e918";
}
.icon-swimming-pool:before {
  content: "\e908";
}
.icon-air-conditioner:before {
  content: "\e900";
}
.icon-balloon-playing:before {
  content: "\e901";
}
.icon-e-mail-envelope:before {
  content: "\e902";
}
.icon-instagram-logo:before {
  content: "\e904";
}
.icon-olive-branch:before {
  content: "\e905";
}
.icon-peace-dove:before {
  content: "\e906";
}
.icon-sunce:before {
  content: "\e907";
}
.icon-telephone:before {
  content: "\e909";
}
.icon-envelope-o:before {
  content: "\f003";
}
.icon-home:before {
  content: "\f015";
}
.icon-check-square-o:before {
  content: "\f046";
}
.icon-external-link:before {
  content: "\f08e";
}

.istra {background:#FA545E;
  background: no-repeat center/cover;
  background-image: url("../images/bg-istra.jpg");}
.sole {background:#F8D424;
background: no-repeat center/cover;
background-image: url("../images/bg-sole.jpg");}
.pool {background:#59A3F8;
background: no-repeat center/cover;
background-image: url("../images/bg-pool.jpg");}
.mirno {background:#C1D72D;
background: no-repeat center/cover;
background-image: url("../images/bg-mirno.jpg");}
.komfor {background:#EF4E91;
background: no-repeat center/cover;
background-image: url("../images/bg-komfor.jpg");}
.uzitak {background:#005294;
background: no-repeat center/cover;
background-image: url("../images/bg-uzitak.jpg");}


/* = opisne ikone --*/
.mreza {line-height: 22px;margin: 0}
.mreza li {position: relative; display: inline-block;width:100% }

.mreza li span.box-li{margin-bottom: 10px; position: relative; height:48px;width:48px; float:left; margin-right: 15px;background:#ffa400}
.mreza li em {position: relative;z-index:2;display: block; font-size:24px; line-height: 48px; text-align: center;width:24px;margin:0 auto;color:#fff}
.mreza li:hover em {color:#ffe400; }
.mreza li span.ico{border-radius:0;display:block;height:0;left:50%;margin:0;position:absolute;top:50%;z-index:1;background-color: #ff001b;-webkit-transition:all .3s;-moz-transition:all .3s;-o-transition:all .3s;transition:all .3s;width:0}
.mreza li span.box-li:hover span{width:100%;height:100%;margin:-50%}
.mreza li span.opis{float:left;padding-top: 16px;}


/*-------------- DRUŠTVENE MREŽE --------------------*/

.social-box{height:3em;margin:100px auto;width:12em}
.social{position:relative;height:3em;width:13.5em}
.social li{display:block;height:3.2em;line-height:3.2em;margin:-1.2em;position:absolute;-webkit-transition:-webkit-transform .7s;-moz-transition:-moz-transform .7s;-ms-transition:-ms-transform .7s;-o-transition:-o-transform .7s;transition:transform .7s;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);text-align:center;width:3.2em}
.social a{color:#fff!important;display:block;line-height:1.6em;font-size:24px;height:3.2em;text-align:center;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);width:3.2em}
.social li:hover{-webkit-transform:scale(1.2,1.2) rotate(45deg);-moz-transform:scale(1.2,1.2) rotate(45deg);-ms-transform:scale(1.2,1.2) rotate(45deg);-o-transform:scale(1.2,1.2) rotate(45deg);transform:scale(1.2,1.2) rotate(45deg)}

.facebook{background:#155b9d;left:0;top:0}
.instagram{background:#E56969;bottom:0;left:25%}
.villa-icon{background:#F3115B;left:50%;top:0}
.google-maps{background:#00acee;bottom:0;left:75%}
.my-business{background:#4885ed;left:100%;top:0}





.box_666{float:left;margin:0;width:16.66666666666667%;display: flex; flex-flow: row wrap;}
.icobox {width: 100%;display: block;padding:50px 15px 25px;text-align: center;}
.icobox:nth-child(1){display: flex; align-items: center;background: rgba(255,255,255,.7);height: 150px;padding: 0;cursor: pointer}
.icobox:nth-child(1):hover{background: #00B4FF}
.icobox:nth-child(2){background: rgba(255,255,255,.3);}
.icobox h4 {text-transform: uppercase;letter-spacing: 0.04em;font-weight: 700;font-size:16px;line-height:27px;padding:20px 0 0 0;margin: 0}
.icobox p {font-style: italic;line-height: 2.7rem;margin: 0 0 25px;}
.speci2{display:block;font-family:"icomoon";font-size: 48px;line-height: 1;padding: 30px 0;width: 120px;margin: 0 auto;color: #006ade;border-radius: 50%;background: rgba(255,255,255,.3);}
.speci2:hover{background: rgba(255,255,255,1);}
.ikone,.ikone2,.ikone3{text-align:center;vertical-align:top;margin:0 auto}
.ikone i{display:inline-block;background:#fff;color:#1e1e1e;border:solid 1px #ccc;margin-bottom:4px}
.ikone2 i{display:inline-block;background:#fff;color:#2196f3;border:solid 1px #ffb536;margin-bottom:4px}
.ikone i:hover,.ikone2 i:hover{background:#D92227;border:solid 1px #D92227;-webkit-transition:all .5s linear;-ms-transition:all .5s linear;transition:all .5s linear}
.speci{display:block;font-family:"icomoon";font-size:48px;line-height:1;padding:30px}
.ikone i:hover,.ikone2 i:hover{color:#fff}
@media all and (min-width: 1024px) and (max-width: 1280px) {
.icobox {padding:25px 10px 15px;}	
.icobox h4 {letter-spacing: 0.02em;font-size:14px;line-height:25px;}
.icobox p {font-size:13px;line-height: 2.5rem;}	
}
@media only screen and (max-width:1023px) {
.speci{font-size:32px;padding:20px}
.box_666{width:33.33333333333333%;}	
.social a{font-size:20px;line-height: 1.8em;}	
}
@media only screen and (max-width:720px) {
	.colico-box{padding: 50px 0 30px}
.mreza li {float:none;display: flex; width:240px; margin: 0 auto}	
}
@media all and (max-width:600px) {
.box_666{width:50%}	
}
@media only screen and (max-width: 360px) {
.box_666{float:none;width:auto;clear:both;}		
}
