@charset "utf-8";
/* CSS Document */


@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;700&display=swap');

body { font-family: 'Titillium Web', Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; font-size: 14px; color:#555555; }

section {  }
img { max-width: 100%; height:auto; }
a, a:hover, a:focus, button { color: inherit; text-decoration: none; outline: 0; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
a, button { color:#555;  }
a * {-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
a:hover { text-decoration: none; opacity:0.6;}
a.noShadow:hover { box-shadow:none;}
a.opacityHover:hover { opacity:0.5;}
.clr, .clear { clear:both;}
button { border:none; background: none; }
.mybtn { background: #ccc; color:#000; }

.container { max-width: 1190px;}
.mobileonly { display: none;}
.desktoponly { display: block;}
.homemobile { margin-bottom: 80px;}

#mainhead { padding-top: 20px; margin-bottom: 30px;}
#logodiv { width: 80px; text-align: left;}
#logodiv a:hover  {opacity:0.8;}
ul#mainmenu { text-align: right; list-style: none; padding-top: 53px;} 
ul#mainmenu li { display: inline; text-transform: uppercase; margin-left: 60px;}

.gridcontainer a { margin-bottom: 26px; display: block;}
.gridcontainer a img { width:100%; height: 385px; object-fit: cover;}

footer { text-align: center; margin-bottom: 60px; padding-top: 15px;}
footer .insta { margin-bottom: 10px;}
footer .insta img { width: 20px; height: auto;}

.lg-backdrop { background-color: #fff !important;}
.lg-next, .lg-prev { background: none  !important;}
.lg-next:hover:not(.disabled), .lg-prev:hover:not(.disabled) {  color: #000 !important; }
.lg-toolbar .lg-icon:hover { color: #000 !important; }


/* portfolio */
.newcontainer a { margin-bottom: 26px; display: block; position: relative;}
.newcontainer a:hover { opacity:1;}
.newcontainer a .overlay { opacity:0; position: absolute; top:0px; left:0px; width:100%; height: 100%; background: rgba(0,0,0,0.6); color: #fff; font-size:28px; display: flex;  align-items: center; justify-content: center; font-weight: 300;}
.newcontainer a:hover .overlay { opacity:1;}
.opis { font-size:24px;  padding: 20px 0px;}
.single { margin-bottom: 20px; text-align: center;}

.textsection { padding-top: 30px;}

.homemobile h1 { margin-bottom: 30px; }


.hamcontainer { padding-top: 20px; position: fixed; top:0px; right:0px; z-index: 900; background: #fff; padding: 20px;}
#mobileicon { background: none; border:none;}
#mobileicon div {  width: 35px; height: 3px; background-color: black; margin: 6px 0;}

#sidemenu { position: fixed; right:-300px; top:0px; height: 100vh; padding-top: 20px; background: rgba(255,255,255,1); width: 250px; box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.2); z-index: 999; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
#sidemenu #newmenu { list-style: none; padding-left: 0px; }
#sidemenu #newmenu li a { padding: 20px; border-bottom: 1px solid #ccc; display: block;  }
#sidemenu h2 {  padding: 20px; display: inline;}
#sidemenu #closemenu {  float:right; margin-right: 15px;}
#sidemenu #closemenu img { width: 30px !important; height: 30px !important;}

@media screen and (max-width: 992px) {
	.mobileonly { display: block;}
	.desktoponly { display: none;}
}


@media screen and (max-width: 880px) {
	.gridcontainer a img { height: 240px;}
	ul#mainmenu li { display: inline; text-transform: uppercase; margin-left: 30px;}	
	.newcontainer a .overlay { font-size:18px; }

}

@media screen and (max-width: 590px) {
	.gridcontainer a img { width: 100%; height: auto;}
	ul#mainmenu li { display: inline; text-transform: uppercase; margin-left: 20px;}	
	.newcontainer a .overlay { font-size:24px; }
}