img,h1,h2,h3,h4,body,input,textarea, a{font-size:16px; color:#3e3e3e; border:0px; padding:0px; margin:0px; vertical-align:top;  text-decoration:none; font-style:normal;}

.w300 {font-weight:300;}
.w500 {font-weight:500;}
.w700 {font-weight:700;}

.left {float:left;}
.right {float:right;}

.white {color:#fff;}

p {line-height:25px; font-size:18px; font-weight:400;}

html,
body {margin:0; padding:0;}


.page {font-family: 'Ubuntu', sans-serif;}

.menu {padding:20px 2.5%; background-color:#fff; position:fixed; top:0; left:0; width:95%; z-index:10; font-weight:500; color:#272727; text-transform:uppercase;}
.logo {float:left; transition:all 0.3s; -webkit-transition:all 0.3s;}
.logo:hover {opacity:0.7;}
.menu ul {float:right; margin:12px 0 0 0; padding:0; list-style-type:none;}
.menu li {display:inline-block; position:relative; margin:0 15px;}
.menu li a:before {position:absolute; top:21px; left:-5px; width:5px; height:5px; border:1px solid #007ba7; content:""; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); transition:all 0.3s; -webkit-transition:all 0.3s; opacity:0;}
.menu li a:after {position:absolute; top:21px; right:-5px; width:5px; height:5px; border:1px solid #007ba7; content:""; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); transition:all 0.3s; -webkit-transition:all 0.3s; opacity:0;}
.menu li a {display:inline-block; padding:15px 15px; transition:all 0.3s; -webkit-transition:all 0.3s;}
.menu li a:hover {color:#007ba7;}
.menu li a:hover:before, .menu li a:hover:after {opacity:1; margin:0 5px;}

.contact-bar {height:50px; line-height:50px; position:fixed; top:110px; left:0; right:0; z-index:3; padding:0 50px; color:#fff; background-color:#005371;}
.contact-bar .phone {
	margin-right:50px;
	padding-left: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-image: url(../img/icon-tel.png);
	background-repeat: no-repeat;
	background-position: center left;}
.contact-bar .mail {
	background-image: url(../img/icon-mail.png);
	margin-bottom: 60px;
}
.contact-bar .mail a {color:#fff;}



.side-menu {position:fixed; top:110px; right:0; z-index:4; background-color:#262626; height:100%; width:94px; padding:0 8px; transition:all 0.3s; -webkit-transition:all 0.3s;}
.side-menu ul {margin:0; padding:0; list-style-type:none; text-align:center; height:100%;}
.side-menu ul li {height:9%;display:table;}
.side-menu ul li a {display:table-cell; vertical-align:middle; font-size:14px; color:#fff; text-transform:uppercase; position:relative; border-bottom:1px solid #515151; transition:all 0.3s; -webkit-transition:all 0.3s;}
.side-menu ul li a:hover {border-bottom:1px solid #fff;}
.side-menu ul li a:before {background-color:#262626; position:absolute; bottom:-4px; left:50%; margin-left:-2px; width:5px; height:5px; border:1px solid #515151; content:""; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); transition:all 0.3s; -webkit-transition:all 0.3s;}
.side-menu ul li a:hover:before {border:1px solid #fff;}
.trigger {position:fixed; width:79px; height:100px; background-image:url("../img/trigger.png"); top:110px; right:110px; font-size:14px; font-weight:700; text-transform:uppercase; color:#fff; padding:16px 0 0 37px; overflow:hidden; z-index:10; cursor:pointer; transition:all 0.3s; -webkit-transition:all 0.3s; }
.trigger .trigger-line {-ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); position:absolute; bottom:7px; right:-42px; border:5px solid #fff; width:60px; height:60px; transition:all 0.3s; -webkit-transition:all 0.3s; cursor:pointer;}
.trigger:hover .trigger-line {border:5px solid #007ba7; bottom:8px;}
.trigger .arrow {background-image:url("../img/arrow.png"); width:15px; height:12px; background-repeat:no-repeat; position:absolute; bottom:35px; right:7px;  transform: -ms-transform: rotate(0deg); /* IE 9 */ -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */ transform: rotate(0deg); transition:all 0.3s; -webkit-transition:all 0.3s; cursor:pointer;}
.trigger .flipped {-ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ transform: rotate(180deg);}

.menu-hidden {right:-110px;}
.trigger-hidden {right:0;}


.hero-container {width:680px; height:500px; margin-top:150px; text-align:center; margin-left:200px; position:relative;}
.hero {background-image:url("../img/image-hero.jpg"); background-size:cover; background-attachment:fixed; background-position:center center;}
.hero h1 {line-height:90px; position:relative; z-index:5; margin-left:auto; margin-right:auto;

}
.hero h2 {color:#fff; font-weight:200; font-size:60px; font-family: 'Source Sans Pro', sans-serif; text-transform:uppercase; width:670px; letter-spacing:73px; margin-bottom:50px; position:relative; z-index:5;margin-left:auto; margin-right:auto; -webkit-animation-delay: .6s;
  -moz-animation-delay: .6s;
  animation-delay: .6s;
  -ms-animation-delay:.6s;}
h1 {font-size:99px; text-transform:uppercase; color:#fff; font-weight:900; font-family: 'Source Sans Pro', sans-serif;}
h2 {font-size:60px; font-weight:700; text-transform:uppercase;}

.square-big {width:370px; height:370px; border:10px solid #007ba7; transform: -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); margin:0 auto; position:absolute; top:23px; left:50%; margin-left:-195px; transition:all 0.3s; -webkit-transition:all 0.3s;

-webkit-animation-delay: 1.4s;
  -moz-animation-delay: 1.4s;
  animation-delay: 1.4s;
  -ms-animation-delay:1.4s;}
.square-link {width:150px; height:150px; background-color:#007ba7; transform: -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); margin:0 auto; position:absolute; bottom:0; left:50%; margin-left:-75px; cursor:pointer; border:4px solid transparent; transition:all 0.3s; -webkit-transition:all 0.3s;

-webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  animation-delay: 2s;
  -ms-animation-delay:2s;}
.link-text {transform: -ms-transform: rotate(-45deg); /* IE 9 */ -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */ transform: rotate(-45deg); font-size:18px; color:#fff; font-weight:500; text-transform:uppercase; width:150px; text-align:center; position:absolute; bottom:-12px; left:50%; margin-left:-43px; background-image:url("../img/arrow-down.png"); background-repeat:no-repeat; background-position:bottom center; height:110px;}
.square-link:hover {border:4px solid #fff;}

.table-center {display:table-cell; vertical-align:middle;}

.introduction {background-color:#007ba7;}
.predstavitev { float:left; height:100%; width:37%; padding:0 4% 0 4%; color:#fff; background-image:url("../img/pattern-brick.png"); background-position:top right; display:table-cell; background-repeat:repeat-y; display:table; transition:all 0.3s; -webkit-transition:all 0.3s; position:relative;}
.predstavitev:after {content:""; position:absolute; top:0; right:-20px;  width:20px; height:100%; background-image:url("../img/pattern-brick.png"); background-position:top right; display:table-cell; background-repeat:repeat-y;}
.predstavitev-image {float:right; width:55%; height:100%; background-color:red; overflow:hidden;}
.predstavitev-image img {min-width:100%; min-height:100%; max-width:150%;}
.predstavitev h2 {color:#fff; opacity:0;}
.predstavitev p {opacity:0;}
.links {opacity:0;}

.links {margin-top:50px;}
.links a {display:block; background-image:url("../img/arrow-right.png"); background-repeat:no-repeat; background-position:0 7px; padding-left:20px; text-transform:uppercase; font-size:18px; font-weight:700; transition:all 0.3s; -webkit-transition:all 0.3s; margin:20px 0; color:#fff;}
.links a:hover {padding-left:30px;}

.razlika .hero-container {width:700px; margin-left:auto; margin-right:auto;}
.razlika h2 {padding-top:122px; width:auto; font-size:99px; text-transform:uppercase; color:#fff; font-weight:900; font-family: 'Source Sans Pro', sans-serif; line-height:90px; position:relative; z-index:5; margin-left:auto; margin-right:auto; letter-spacing:normal; opacity:0; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s;}

.razlika {background-image:url("../img/razlika.jpg"); background-attachment:scroll;}
.razlika .square-big {opacity:0; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s;}
.razlika .square-link {background-color:#fff; cursor:auto; opacity:0; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s;}
.razlika .link-text {color:#333333; margin-left:-47px; width:170px;}
.razlika .square-link:hover {border:4px solid #007ba7;}

.storitve h2 {margin-bottom:130px; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s; opacity:0;}

.storitve-container {text-align:center; margin:0 auto;}
.storitev {position:relative; float:left; display:block; width:287px; height:287px;}
.square {display:block; width:287px; height:287px; background-image:url("../img/storitve-galerija.png");}
.distance1 {margin:-150px 0 0 -135px}
.distance2 {margin:0 0 0 -135px}
.storitev-title { width:200px; text-align:center;position:absolute;top:39px; left:-42px; font-weight:500; font-size:16px; color:#252525;  -ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    transform: rotate(-45deg); height:38px;}
.pos2 {bottom: 39px;top: auto; left: auto; right: -44px;}

.storitve-squares{margin-left:-100px; width:1510px; display:inline-block; margin-bottom:15px; transform: scale(.8,.8); -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s; opacity:0;}
.storitev .square img {width:90%; height:90%; padding:5%; transition:all 0.3s; -webkit-transition:all 0.3s;}
.storitev .square:hover img {width:100%; height:100%; padding:0;}
.storitve .square-link {background-color:#1f1f1f; width:70px; height:70px; margin-left:-39px; bottom:auto; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s; opacity:0;}
.storitve .square-link:hover {border-color:#007ba7;}
.storitve .link-text {width:70px; margin-left:-23px; height:70px; bottom:-12px; font-size:14px;}

.kontakt {background-image:none; position:relative;}
.kontakt-left {width:45%; height:100%; float:left; background-image:url("../img/kontakt.jpg"); background-attachment:scroll; background-position:center center; height:100%; background-size:cover;}
.kontakt-right {width:50%; padding:0 2.5%; float:left; background-color:#282828; display:table; height:100%; color:#acacac;}
.kontakt-right .table-center {opacity:0;}
.kontakt .square-link {background-color:#fff; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s; opacity:0;}
.kontakt .square-link:hover {border-color:#007ba7;}
.kontakt .link-text {margin-left:-53px; bottom:-2px; color:#282828;}

.kontakt .square-big {border-color:#282828; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s; opacity:0;}
.kontakt h2 {padding-top:122px; width:auto; font-size:99px; text-transform:uppercase; color:#fff; font-weight:900; font-family: 'Source Sans Pro', sans-serif; line-height:90px; position:relative; z-index:5; margin-left:auto; margin-right:auto; letter-spacing:normal; opacity:0; -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
  -ms-animation-delay:0s;}
.kontakt .hero-container {margin:150px auto 0 auto;}
.kontakt h3 {color:#fff; font-size:24px; text-transform:uppercase; margin:0; padding:0; font-weight:500;}

.kontakt a {color:#acacac;}
.kontakt a:hover {text-decoration:underline;}
.ikon {padding-left:35px; padding-top:10px; padding-bottom:10px; background-image:url("../img/icon-tel.png"); background-repeat:no-repeat; background-position:center left;}
.mail{background-image:url("../img/icon-mail.png"); margin-bottom:60px;}

.kontakt ul {margin:20px 30px 0 0; padding:0; list-style-type:none;}
.kontakt li {padding:5px 0 5px 18px; color:#fff; text-transform:uppercase; background-image:url("../img/icon-bullet.png"); background-position:center left; background-repeat:no-repeat;}

.left {float:left;}
.right {float:right; margin-right:90px;}

.kontakt-right .right img {transition:all 0.3s; -webkit-transition:all 0.3s;}

.footer {background-color:#fff; position:absolute; padding:50px 2.5%; width:95%; bottom:0; left:0; font-size:16px; color:#2d2d2d;}
.footer a {text-decoration:underline; font-weight:500; color:#2d2d2d; font-size:16px;}
.footer a:hover {text-decoration:none;}

.kontakt-left a:hover {text-decoration:none;}

.clear-both {clear:both;}



.menu button{
  padding:5px 10px;
  background:none;
  border:none;
  position:relative;
  height:40px;
  width:60px;
  cursor:pointer;
  outline:none;
  float:right;
  margin-top:15px;
  transition:all 0.3s cubic-bezier(.56,.01,.13,1); -moz-transition:all 0.3s cubic-bezier(.56,.01,.13,1); -webkit-transition:all 0.3s cubic-bezier(.56,.01,.13,1);
}
 .menu button:hover {opacity:0.7;}
.line{
  position:absolute;
  height:2px;
  width:40px;
  background:#525252;
  left:10px;
  -webkit-transition: 0.2s all ease;
  -moz-transition: 0.2s all ease;
  -ms-transition: 0.2s all ease;
  -o-transition: 0.2s all ease;
  transition: 0.2s all ease;
}
.line-t{
  top:10px;
}
.line-m{
  top:20px;
}
.line-b{
  top:30px;
}
.menu button:hover .line{
  background:#525252;
}
.menu-on .line-m, .menu-on:hover .line-m{
  background:rgba(0,0,0,0);
  opacity:0;
}
.menu-on .line{
  top:20px;
}
.menu-on .line-t{
  -webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.menu-on .line-b{
  -webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);}

#trigger {float:right;}
#trigger {display:none;}

.w1200 {width:1200px; margin:0 auto;}

.w1200 h1 {color:#252525; font-size:55px;}
.w1200 h2 {color:#252525; font-size:45px; margin-top:15px;}

.w1200 form {display:block; width:auto; margin:0; padding:0;}
.w1200 form input {display:block; width:98%; margin:0; padding:12px 1%; background-color:#ccc; font-family: 'Ubuntu', sans-serif; transition:all 0.3s; -webkit-transition:all 0.3s; border:1px solid #fff; outline:none;}
.w1200 form input:focus{border:1px solid #007ba7;}
.w1200 form input[type="submit"] {display:block; width:100%; margin:0; padding:18px 1%; font-family: 'Ubuntu', sans-serif; text-transform:uppercase; font-size:18px; font-weight:700; color:#fff; background-color:#007ba7; transition:all 0.3s; -webkit-transition:all 0.3s;}
.w1200 form input[type="submit"]:hover {cursor:pointer; background-color:#262626; color:#fff;}
.w1200 form textarea{display:block; width:98%; margin:0; padding:12px 1%; background-color:#ccc; font-size:16px; min-width:98%; max-width:98%; min-height:150px; font-family: 'Ubuntu', sans-serif; transition:all 0.3s; -webkit-transition:all 0.3s; border:1px solid #fff; outline:none;}
.w1200 form textarea:focus{border:1px solid #007ba7;}
.w1200 form p {margin-bottom:0;}

#recaptcha_area input {display:inline;}

.galerija {float:left; width:45%; padding:150px 2.5%;}
.w1200 .text {float:left; width:45%; padding:200px 2.5% 50px 2.5%; }

.galerija a {display:block; float:left; height:162px; overflow:hidden; width:30%; margin:0 2% 13px 0; }

.blue-bg .p-storitve {color:#fff;}
.blue-bg .p-storitve a {color:#fff;}
.blue-bg .p-storitve p {color:#fff;}
.blue-bg .p-storitve h3 {color:#fff;}
.blue-bg .p-storitve h1 {color:#fff;}

.p-storitve h2 {color:#007ba7; font-size:20px;}
.p-storitve h1 {color:#007ba7; font-size:36px;}

.spacer {height:50px;}


.p-reference h1 {margin-bottom:40px;}
.p-reference h2{font-size:20px; font-weight:500; color:#007ba7;}
.p-reference ul {list-style-type:none;}
.p-reference ul li {padding:0 0 0 20px; margin:10px 0; background-image:url("../img/icon-bullet.png"); background-position:center left; background-repeat:no-repeat;}


.blue-bg {background-color:#007ba7;}
.white-bg {background-color:#fff; color:#252525;}
.white-bg h2 {color:#252525;}
.p-storitve .white-bg form p{color:#252525;}
.p-storitve .white-bg {padding:150px 2.5% 30px 2.5%;}

.s-reference .spacer {height:90px;}

.p-storitve .galerija a img {width:100%; height:auto; transition:all 0.3s; -webkit-transition:all 0.3s;}
.p-storitve .galerija a img:hover {opacity:0.7;}

.subpage .menu {border-bottom:1px solid #ccc;}

.bricks {background-image:url("../img/bg.jpg"); background-size:100% auto; background-position:center top; background-repeat:no-repeat;}

.subpage .footer {margin-top:20px; border-top:1px solid #ccc; position:static;}

.p-storitve .mail {margin-bottom:0;}


/* #middle fixes
================================================== */

    /* Note: Design for a width of 1000px */

	@media only screen and (min-width: 1200px) and (max-width: 1450px) {
	.hero-container {width:570px;}
	.hero h2 {width:515px; font-size:50px; letter-spacing:55px;}
	h1 {font-size:76px;}
	.square-big {width:270px; height:270px; top:60px; margin-left:-144px;}
	.square-link {width:70px; height:70px; margin-left:-39px; bottom:86px;}
	.link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	
	.predstavitev-image {width:50%;}
	.predstavitev-image img {margin-left:-20%;}
	
	p {font-size:16px; line-height:24px;}	
	h2 {font-size:40px;}
	
	.razlika h2 {font-size:50px; letter-spacing:normal; width:570px; line-height:50px; padding-top:152px;}
	.razlika .link-text {margin-left:-23px; width:70px;}
	.razlika .hero-container {width:570px;}
	
	.kontakt {font-size:14px;}
	.kontakt h2 {font-size:50px; letter-spacing:normal; width:570px; line-height:50px; padding-top:152px;}
	.kontakt .square-link {width: 120px;
    height: 120px;
    margin-left: -62px;
    bottom: 76px;}
	.kontakt .link-text {width:130px; margin-left: -57px; bottom: 22px;}
	.footer {padding-top:15px; padding-bottom:12px;}
	.kontakt .kontakt-right img {display:none;}
	.kontakt li {font-size:12px;}
	
	.storitve h2 {margin-bottom:80px;}
	.storitve-container {overflow:hidden;}
	.storitve-squares {
    transform: scale(0.65,0.65); margin-left:-200px;}
	.mail {margin-bottom:10px;}
	
	#trigger {display:none;}
	
	.w1200 {width:1000px;}
	.galerija a {margin:0 2% 9px 0; height:135px;}
	}



	/* #small monitor
================================================== */

    /* Note: Design for a width of 1000px */

	@media only screen and (min-width: 960px) and (max-width: 1199px) {
	h1 {font-size:25px; line-height:normal;}
	h2, .hero h2 {font-size:20px; letter-spacing:normal; width:auto;}
	h3 {font-size:18px;}
	
	p {font-size:16px; line-height:24px;}
	.kontakt {font-size:14px;}
	
	.hero h2 {font-size:50px; margin-bottom:0;}
	
	.hero h1 {line-height:normal; font-size:68px;}
	
	.hero-container {width:460px; height:auto; margin:0 auto;}
	.square-big {width:120px; height:120px; margin-left:-60px;}
	.square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	
	.hero {padding:150px 0;}
	.section, .fp-tableCell {height:auto !important;}
	.predstavitev {float:none; width:auto; padding:0 15%;}
	.predstavitev-image {display:none;}
	
	.introduction {padding:50px 0;}
	.introduction .fp-tableCell{padding-bottom:0;}
	
	
	.storitve-squares {width:870px; margin:0;}
	.storitev {width:150px; height:auto;}
	.square {width:auto; height:auto; background-size:100% 100%;}
	.distance1, .distance2 {margin:0;}
	
	.storitev-title {display:block; margin:5px 0 15px 0; width:150px; height:50px; position:static; -ms-transform: rotate(0deg) !important; -webkit-transform: rotate(0deg) !important;
    transform: rotate(-0deg) !important;}
	.storitev .square:hover img {padding:5%; width:90%; height:90%; opacity:0.8;}
	.storitve h2 {font-size:55px; margin:50px 0;}
	.storitve .square-link {display:none;}
    
	
	.razlika .hero-container {margin:0 auto !important;width:460px; height:auto; margin-left:0; margin-top:0;}
	.razlika .square-big {width:120px; height:120px; margin-left:-60px;}
	.razlika .square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.razlika .link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	.razlika h2 {line-height:normal; font-size:34px; padding-top:52px;}
	.razlika {padding:50px 0 170px 0;}
	
	.kontakt-left {width:auto; float:none; height:auto; padding:50px 0;}
	.kontakt-right {display:block; width:auto; float:none; height:auto; padding:70px 0;}
	.kontakt-right .table-center {width:760px; margin:0 auto;}
	.kontakt {padding-bottom:0;}
	.kontakt h2 {line-height:normal; font-size:34px; padding-top:0;}
	.kontakt .hero-container {margin:0 auto; padding:50px 0 100px 0;}
	.kontakt .square-link {width: 120px;
    height: 120px;
    margin-left: -51px;
    bottom: -62px;}
	.kontakt .link-text {width:130px; margin-left: -57px; bottom: 22px;}
	.kontakt .table-center {display:block;}
	.kontakt {padding-top:0;}
	.kontakt .fp-tableCell {padding-top:0;}
	
	.footer {padding:10px 2.5%; position:static;}
	.footer .left {display:block; float:none;}
	.footer .right {margin-top:15px; float:none; display:block}
	
	#trigger {display:none;}
	.animated {animation-duration:0s; opacity:1 !important; animation-fill-mode:none !important; -webkit-animation-fill-mode:none !important;}
	.predstavitev h2, .predstavitev p, .predstavitev .links, .square-big, .square-link, h1, h2 {opacity:1 !important;}
	
	.w1200 {width:800px;}
	.galerija a {width:48%; margin:0 2% 7px 0;}
	
	.p-kontakt h1 {font-size:40px;}
	.p-kontakt h2 {font-size:40px;}
	}
	
	
	/* #Tablet (Portrait)
================================================== */
    /* Note: Design for a width of 768px */

	@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	h1 {font-size:25px; line-height:normal;}
	h2, .hero h2 {font-size:20px; letter-spacing:normal; width:auto;}
	h3 {font-size:18px;}
	
	p {font-size:16px; line-height:24px;}
	.kontakt {font-size:14px;}
	
	.hero h2 {font-size:50px; margin-bottom:0;}
	
	.hero h1 {line-height:normal; font-size:77px;}
	.side-menu {display:none;}
	
	.hero-container {width:740px; height:auto; margin:0 auto;}
	.square-big {width:120px; height:120px; margin-left:-60px;}
	.square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	
	.hero {padding:150px 0;}
	.section, .fp-tableCell {height:auto !important;}
	.predstavitev {float:none; width:auto;}
	.predstavitev-image {display:none;}
	.predstavitev:after {display:none;}
	
	.introduction {padding:50px 0;}
	.introduction .fp-tableCell{padding-bottom:0;}
	

	.storitve-squares {width:750px; margin:0;}
	.storitev {width:150px; height:auto;}
	.square {width:auto; height:auto; background-size:100% 100%;}
	.distance1, .distance2 {margin:0;}
	
	.storitev-title {display:block; margin:5px 0 15px 0; width:150px; height:50px; position:static; -ms-transform: rotate(0deg) !important; -webkit-transform: rotate(0deg) !important;
    transform: rotate(-0deg) !important;}
	.storitev .square:hover img {padding:5%; width:90%; height:90%; opacity:0.8;}
	.storitve h2 {font-size:55px; margin:50px 0;}
	.storitve .square-link {display:none;}
	
	.razlika .hero-container {margin:0 auto !important;width:740px; height:auto; margin-left:0; margin-top:0;}
	.razlika .square-big {width:120px; height:120px; margin-left:-60px;}
	.razlika .square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.razlika .link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	.razlika h2 {line-height:normal; font-size:34px; padding-top:52px;}
	.razlika {padding:50px 0 170px 0;}
	
	.kontakt-left {width:auto; float:none; height:auto; padding:50px 0;}
	.kontakt-right {display:block; width:auto; float:none; height:auto; padding:70px 0;}
	.kontakt-right .table-center {width:740px; margin:0 auto;}
	.kontakt {padding-bottom:0;}
	.kontakt h2 {line-height:normal; font-size:34px; padding-top:0;}
	.kontakt .hero-container {margin:0 auto; padding:50px 0 100px 0;}
	.kontakt .square-link {width: 120px;
    height: 120px;
    margin-left: -51px;
    bottom: -62px;}
	.kontakt .link-text {width:130px; margin-left: -57px; bottom: 22px;}
	.kontakt .kontakt-right img {}
	.kontakt .table-center {display:block;}
	.kontakt {padding-top:0;}
	.kontakt .fp-tableCell {padding-top:0;}
	
	.footer {padding:10px 2.5%; position:static;}
	.footer .left {display:block; float:none;}
	.footer .right {margin-top:15px; float:none; display:block}
	
	
	.trigger {display:none;}
	#trigger {display:block;}
	.menu  ul{float:right; width:100%; margin:0; padding:0; padding-top:30px; display:block; display:none; }
	.menu ul li {display:block; border-top:1px solid #ccc;}
	.menu ul li:last-child {border-bottom:1px solid #ccc;}
	.menu ul li a{display:block; width:100%; text-align:center;}
	.menu .slideIn {display:block;}
	
	.animated {animation-duration:0s; opacity:1 !important; animation-fill-mode:none !important; -webkit-animation-fill-mode:none !important;}
	.predstavitev h2, .predstavitev p, .predstavitev .links, .square-big, .square-link, h1, h2 {opacity:1 !important;}
	
	.w1200 {width:740px;}
	.galerija a {width:48%; margin:0 2% 6px 0;}
	
	.p-kontakt h1 {font-size:30px;}
	.p-kontakt h2 {font-size:30px;}
	}
	
	
	/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

	@media only screen and (min-width: 480px) and (max-width: 767px) {
	h1 {font-size:25px; line-height:normal;}
	h2, .hero h2 {font-size:20px; letter-spacing:normal; width:auto;}
	h3 {font-size:18px;}
	
	p {font-size:16px; line-height:24px;}
	.kontakt {font-size:14px;}
	
	.hero h2 {font-size:50px; margin-bottom:0;}
	
	.hero h1 {line-height:normal; font-size:34px;}
	.side-menu {display:none;}
	
	.hero-container {width:460px; height:auto; margin:0 auto;}
	.square-big {width:120px; height:120px; margin-left:-60px;}
	.square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	
	.hero {padding:150px 0;}
	.section, .fp-tableCell {height:auto !important;}
	.predstavitev {float:none; width:auto;}
	.predstavitev-image {display:none;}
	.predstavitev:after {display:none;}
	
	.introduction {padding:50px 0;}
	.introduction .fp-tableCell{padding-bottom:0;}
	
	.storitve {display:none !important;}
	.storitve-squares {width:auto; margin:0;}
	.storitev {width:auto;}
	.square {width:auto; height:auto; background-size:100% 100%;}
	.distance1, .distance2 {margin:0;}
	
	.storitev-title {display:none;}
	
	.razlika .hero-container {margin:0 auto !important;width:460px; height:auto; margin-left:0; margin-top:0;}
	.razlika .square-big {width:120px; height:120px; margin-left:-60px;}
	.razlika .square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.razlika .link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	.razlika h2 {line-height:normal; font-size:34px; padding-top:52px;}
	.razlika {padding:50px 0 170px 0;}
	
	.kontakt-left {width:auto; float:none; height:auto; padding:50px 0;}
	.kontakt-right {display:block; width:auto; float:none; height:auto; padding:70px 0;}
	.kontakt-right .table-center {width:460px; margin:0 auto;}
	.kontakt {padding-bottom:0;}
	.kontakt h2 {line-height:normal; font-size:34px; padding-top:0;}
	.kontakt .hero-container {margin:0 auto; padding:50px 0 100px 0;}
	.kontakt .square-link {width: 120px;
    height: 120px;
    margin-left: -51px;
    bottom: -62px;}
	.kontakt .link-text {width:130px; margin-left: -57px; bottom: 22px;}
	.kontakt .kontakt-right img {display:none;}
	.kontakt .table-center {display:block;}
	.kontakt {padding-top:0;}
	.kontakt .fp-tableCell {padding-top:0;}
	
	.footer {padding:10px 2.5%; position:static;}
	.footer .right {margin-top:15px; float:left;}
	
	
	.trigger {display:none;}
	#trigger {display:block;}
	.menu  ul{float:right; width:100%; margin:0; padding:0; padding-top:30px; display:block; display:none; }
	.menu ul li {display:block; border-top:1px solid #ccc;}
	.menu ul li:last-child {border-bottom:1px solid #ccc;}
	.menu ul li a{display:block; width:100%; text-align:center;}
	.menu .slideIn {display:block;}
	
	.animated {animation-duration:0s; opacity:1 !important; animation-fill-mode:none !important; -webkit-animation-fill-mode:none !important;}
	.predstavitev h2, .predstavitev p, .predstavitev .links, .square-big, .square-link, h1, h2 {opacity:1 !important;}
	
	.w1200 {width:460px;}
	
	.w1200 .galerija {float:none; width:auto; margin:30px 0 30px 0; padding:0;}
	.w1200 .text {float:none; width:auto; margin:150px 0 30px 0; padding:0;}
	.galerija a {width:48%; margin:0 2% 9px 0;}
	
	.spacer {display:none;}
	.s-reference .text {padding:0;}
	
	.p-kontakt h1 {font-size:30px;}
	.p-kontakt h2 {font-size:30px;}
	.p-kontakt .white-bg {padding:20px; margin-top:20px;}


	.contact-bar {display:none;}
	}
	

	
	/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */
	@media only screen and (max-width: 479px) {	
	h1 {font-size:25px; line-height:normal;}
	h2, .hero h2 {font-size:20px; letter-spacing:normal; width:auto;}
	h3 {font-size:18px;}
	
	p {font-size:16px; line-height:24px;}
	.kontakt {font-size:14px;}
	
	.hero h2 {font-size:50px; margin-bottom:0;}
	
	.hero h1 {line-height:normal; font-size:34px;}
	.side-menu {display:none;}
	
	.hero-container {width:300px; height:auto; margin:0 auto !important;}
	.square-big {width:120px; height:120px; margin-left:-60px;}
	.square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	
	.hero {padding:150px 0;}
	.section, .fp-tableCell {height:auto !important;}
	.predstavitev {float:none; width:auto;}
	.predstavitev-image {display:none;}
	.predstavitev:after {display:none;}
	
	.introduction {padding:50px 0;}
	.introduction .fp-tableCell{padding-bottom:0;}
	
	.storitve {display:none !important;}
	.storitve-squares {width:auto; margin:0;}
	.storitev {width:auto;}
	.square {width:auto; height:auto; background-size:100% 100%;}
	.distance1, .distance2 {margin:0;}
	
	.storitev-title {display:none;}
	
	.razlika .hero-container {width:300px; height:auto; margin:0 auto !important;}
	.razlika .square-big {width:120px; height:120px; margin-left:-60px;}
	.razlika .square-link {width:70px; height:70px; margin-left:-27px; bottom:-112px;}
	.razlika .link-text {font-size:14px; height:60px; width:70px; bottom:-5px; margin-left:-23px;}
	.razlika h2 {line-height:normal; font-size:34px; padding-top:52px;}
	.razlika {padding:50px 0 170px 0;}
	
	.kontakt-left {width:auto; float:none; height:auto; padding:50px 0;}
	.kontakt-right {display:block; width:auto; float:none; height:auto; padding:70px 0;}
	.kontakt-right .table-center {width:300px; margin:0 auto;}
	.kontakt {padding-bottom:0;}
	.kontakt h2 {line-height:normal; font-size:34px; padding-top:0;}
	.kontakt .hero-container {margin:0 auto; padding:50px 0 100px 0;}
	.kontakt .square-link {width: 120px;
    height: 120px;
    margin-left: -51px;
    bottom: -62px;}
	.kontakt .link-text {width:130px; margin-left: -57px; bottom: 22px;}
	.kontakt .kontakt-right img {display:none;}
	.kontakt .table-center {display:block;}
	.kontakt {padding-top:0;}
	.kontakt .fp-tableCell {padding-top:0;}
	
	.footer {padding:10px 2.5%; position:static;}
	.footer .right {margin-top:15px; float:left;}
	
	
	.trigger {display:none;}
	#trigger {display:block;}
	.menu  ul{float:right; width:100%; margin:0; padding:0; padding-top:30px; display:block; display:none; }
	.menu ul li {display:block; border-top:1px solid #ccc;}
	.menu ul li:last-child {border-bottom:1px solid #ccc;}
	.menu ul li a{display:block; width:100%; text-align:center;}
	.menu .slideIn {display:block;}
	
	.animated {animation-duration:0s; opacity:1 !important; animation-fill-mode:none !important; -webkit-animation-fill-mode:none !important;}
	.predstavitev h2, .predstavitev p, .predstavitev .links, .square-big, .square-link, h1, h2 {opacity:1 !important;}
	
	.w1200 {width:300px;}
	
	.w1200 .galerija {float:none; width:auto; margin:30px 0 30px 0; padding:0;}
	.w1200 .text {float:none; width:auto; margin:150px 0 30px 0; padding:0;}
	.galerija a {width:48%; height:144px; margin:0 2% 9px 0;}
	
	.spacer {display:none;}
	
	.p-kontakt h1 {font-size:30px;}
	.p-kontakt h2 {font-size:30px;}
	.p-kontakt .white-bg {padding:20px; margin-top:20px;}
	
	.p-reference .text:nth-child(2) {margin-top:0; padding-top:0;}

		.contact-bar {display:none;}
	}