


body
{
	background-image:url(../gfx/darkwater.jpg);
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	background-repeat:repeat-y;
	background-position:center;
	background-size:cover;
	ondragstart: return false; ondrag:return false;
	onselectstart:return false;
	onselect:return false;
	oncopy:return false;
	ondragstart:return false;
	ondrag:return false;
	height:100vh;
}
@media screen and (min-width: 1025px) /* ---------------------mediascreen--------------------max----------- */
{
#TOP
{
	background-image: url(../gfx/lato.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 100vw;
	min-height: 45vh;
	margin: 0 auto;
	margin-bottom: 4vh;
}
h1
{
	color:#fff;
	text-align:center;
}
.center
{
	text-align:center;
}
#MOVIE
{
	margin: 0 auto;
	display:block;
	width:900px;
}

#LOGO
{
	position:absolute;
	width:275px;
	height:207px;
	margin-top:30vh;
	margin-left:5vw;
	background-image:url(../gfx/logo2.png);
	background-size: contain;
	background-repeat:no-repeat;
}
.yt
{
	width:900px;
	height:450px;
}
#TXT_CONTAINER
{
	width:60vw;
	color:#66a53e;
	
	font-size:16px;
	margin:5vh 20vw 5vh 20vw;
	
}
#BUTONNS
{
	
	margin:0 auto;
	width:60vw;
	text-align:center;
	margin-bottom:4vh;
}
#SPACE
{
	width:2vw;
	height:13vh;
	float:left;
}
.box1
{
	background-image:url(../gfx/cennik.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box1:hover
{
	background-image:url(../gfx/cennik.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
.box2
{
	background-image:url(../gfx/regulamin.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box2:hover
{
	background-image:url(../gfx/regulamin.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box3
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box3:hover
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box4
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box4:hover
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
@keyframes colorchanges {
   	
	
	0%   {background-color:#66a53e;}
    
    100% {background-color:#000;}
	
	
}
.cennik
{
	width:20vw;
	height:3vh;
	
}
a.cennik
{
	color:#fff;
	text-decoration:none;
	
}
a.regulamin
{
	color:#fff;
	text-decoration:none;
	
}
.regulamin
{
	width:20vw;
	height:3vh;
	background-color:
}

#BANER
{
	background-image:url(../gfx/carpoldschool.png);
	background-position:center;
	background-size: contain;
	background-repeat:no-repeat;
	width: 80vw;
	min-height:35vh;
	margin: 5vh 10vw 5vh 10vw;
	float:left;
}

.hvr-grow {
  
 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
/* Pulse Grow */
@-webkit-keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
}
@keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
	
  }
}







.mapa1
{
	width: 30vw;
	height:auto;
	margin:5vh 0vw 5vh 20vw;
	float:left;
	
	
}
.mapa2
{
	width: 30vw;
	height: auto;
	margin: 5vh 0vw 5vh 0vw;
	float: left;
	
	
}
.mapka
{
	width:auto;
	height:450px;
	
}
.googlemap
{
	width:30vw;
	height:450px;
}

.musli-facebook
{
    border: solid #0170cf 3px;
}

#BOTTOMFOTO
{
	background-image: url(../gfx/fotoBottom.jpg);
	width: 60vw;
	min-height: 60vh;
	background-size: cover;
	float: left;
	background-repeat: no-repeat;
	margin: 4vh 20vw 4vh 20vw;
}
#FOOTER
{
	width: 100vw;
	height: 20vh;
	margin-top: 15px;
	margin: 0 auto;
	font-family: 'italiannoregular';
	background-color:#113911;
	float: left;
}
.footerlink
{
	text-decoration: none;
	color: #999999;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.footerlink:hover
{
	text-decoration: none;
	color: #fff;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.kontakt
{
	text-decoration: none;
	color: #999999;
	float: right;
	margin-right: 20vw;
	margin-top: 1vh;
}
.whitelight
{
	text-decoration: none;
	color: #999999;
	float: right;
	
}
.whitelight:hover
{
	text-decoration: none;
	color: #fff;
	float: right;
	
}
/* reset */
.musli, .musli *{
    padding:0;
    margin:0;
    list-style:none;
}
.musli{
    position:fixed;
    right:0px;
    top:150px;
    z-index:100;
    list-style:none;
}
.musli-bottom{
    left:300px;
    bottom:0px;
    right:auto;
    top:auto;
}
.musli-top{
    left:300px;
    top:0px;
    right:auto;
    bottom:auto;
}
.musli-left{
    left:0px;
    top:200px;
    right:auto;
    bottom:auto;
}
.musli > li{
    cursor:pointer;
    width:35px;
    height:35px;
    margin-bottom:1px;
    position:relative;
}
.musli-bottom > li, .musli-top > li{
    margin-right: 1px;
    margin-bottom: 0;
    float:left;
}
.musli > li > img{
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
.musli-bottom > li > img{
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}
.musli-top > li > img{
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}
.musli-left > li > img{
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
.musli > li > div{
    padding:5px;
    background: #fff;
    float:left;
    width:286px; /* szerokosc zakladek */
    height:296px; /* wysokosc zakladek */
    -moz-border-radius: 0 0 0 8px;
    -webkit-border-radius: 0 0 0 8px;
    border-radius: 0 0 0 8px;
    position:absolute;
    top:0;
    left:35px;
    z-index:100;
}
.musli-bottom > li > div{
    top:35px;
    left:auto;
    -moz-border-radius: 0 8px 0 0;
    -webkit-border-radius: 0 8px 0 0;
    border-radius: 0 8px 0 0;
}
.musli-top > li > div{
    bottom:35px;
    left:auto;
    top:auto;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-left > li > div{
    top:0px;
    left:auto;
    right:35px;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-facebook{
    border: solid #0170cf 3px;
}
}
@media screen and (max-width: 1024px) and (min-width: 801px)  /* ---------------------mediascreen--------------------medium----------- */
{
	#TOP
{
	background-image: url(../gfx/lato.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 100vw;
	min-height: 45vh;
	margin: 0 auto;
	margin-bottom: 4vh;
}
h1
{
	color:#fff;
	text-align:center;
}
.center
{
	text-align:center;
}
#MOVIE
{
	margin: 0 auto;
	display:block;
	width:900px;
}

#LOGO
{
	position:absolute;
	width:275px;
	height:207px;
	margin-top:30vh;
	margin-left:5vw;
	background-image:url(../gfx/logo2.png);
	background-size: contain;
	background-repeat:no-repeat;
}
.yt
{
	width:900px;
	height:450px;
}
#TXT_CONTAINER
{
	width:60vw;
	color:#66a53e;
	
	font-size:16px;
	margin:5vh 20vw 5vh 20vw;
	
}
#BUTONNS
{
	
	margin:0 auto;
	width:60vw;
	text-align:center;
	margin-bottom:4vh;
}
#SPACE
{
	width:2vw;
	height:13vh;
	float:left;
}
.box1
{
	background-image:url(../gfx/cennik.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box1:hover
{
	background-image:url(../gfx/cennik.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
.box2
{
	background-image:url(../gfx/regulamin.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box2:hover
{
	background-image:url(../gfx/regulamin.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box3
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box3:hover
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box4
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box4:hover
{
	background-image:url(../gfx/home.png);
	width:13vw;
	height:13vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:16vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
@keyframes colorchanges {
   	
	
	0%   {background-color:#66a53e;}
    
    100% {background-color:#000;}
	
	
}
.cennik
{
	width:20vw;
	height:3vh;
	
}
a.cennik
{
	color:#fff;
	text-decoration:none;
	
}
a.regulamin
{
	color:#fff;
	text-decoration:none;
	
}
.regulamin
{
	width:20vw;
	height:3vh;
	background-color:
}

#BANER
{
	background-image:url(../gfx/carpoldschool.png);
	background-position:center;
	background-size: contain;
	background-repeat:no-repeat;
	width: 80vw;
	min-height:35vh;
	margin: 5vh 10vw 5vh 10vw;
	float:left;
}

.hvr-grow {
  
 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
/* Pulse Grow */
@-webkit-keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
}
@keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
	
  }
}







.mapa1
{
	width: 30vw;
	height:auto;
	margin:5vh 0vw 5vh 20vw;
	float:left;
	
	
}
.mapa2
{
	width: 30vw;
	height: auto;
	margin: 5vh 0vw 5vh 0vw;
	float: left;
	
	
}
.mapka
{
	width:auto;
	height:450px;
	
}
.googlemap
{
	width:30vw;
	height:450px;
}

.musli-facebook
{
    border: solid #0170cf 3px;
}

#BOTTOMFOTO
{
	background-image: url(../gfx/fotoBottom.jpg);
	width: 60vw;
	min-height: 60vh;
	background-size: cover;
	float: left;
	background-repeat: no-repeat;
	margin: 4vh 20vw 4vh 20vw;
}
#FOOTER
{
	width: 100vw;
	height: 20vh;
	margin-top: 15px;
	margin: 0 auto;
	font-family: 'italiannoregular';
	background-color:#113911;
	float: left;
}
.footerlink
{
	text-decoration: none;
	color: #999999;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.footerlink:hover
{
	text-decoration: none;
	color: #fff;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.kontakt
{
	text-decoration: none;
	color: #999999;
	float: right;
	margin-right: 20vw;
	margin-top: 1vh;
}
.whitelight
{
	text-decoration: none;
	color: #999999;
	float: right;
	
}
.whitelight:hover
{
	text-decoration: none;
	color: #fff;
	float: right;
	
}
/* reset */
.musli, .musli *{
    padding:0;
    margin:0;
    list-style:none;
}
.musli{
    position:fixed;
    right:0px;
    top:150px;
    z-index:100;
    list-style:none;
}
.musli-bottom{
    left:300px;
    bottom:0px;
    right:auto;
    top:auto;
}
.musli-top{
    left:300px;
    top:0px;
    right:auto;
    bottom:auto;
}
.musli-left{
    left:0px;
    top:200px;
    right:auto;
    bottom:auto;
}
.musli > li{
    cursor:pointer;
    width:35px;
    height:35px;
    margin-bottom:1px;
    position:relative;
}
.musli-bottom > li, .musli-top > li{
    margin-right: 1px;
    margin-bottom: 0;
    float:left;
}
.musli > li > img{
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
.musli-bottom > li > img{
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}
.musli-top > li > img{
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}
.musli-left > li > img{
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
.musli > li > div{
    padding:5px;
    background: #fff;
    float:left;
    width:286px; /* szerokosc zakladek */
    height:296px; /* wysokosc zakladek */
    -moz-border-radius: 0 0 0 8px;
    -webkit-border-radius: 0 0 0 8px;
    border-radius: 0 0 0 8px;
    position:absolute;
    top:0;
    left:35px;
    z-index:100;
}
.musli-bottom > li > div{
    top:35px;
    left:auto;
    -moz-border-radius: 0 8px 0 0;
    -webkit-border-radius: 0 8px 0 0;
    border-radius: 0 8px 0 0;
}
.musli-top > li > div{
    bottom:35px;
    left:auto;
    top:auto;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-left > li > div{
    top:0px;
    left:auto;
    right:35px;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-facebook{
    border: solid #0170cf 3px;
}

}

@media screen and (max-width: 800px) and (min-width: 321px)  /* ---------------------------------------------------mediascreen--------------------medium----------- */
{
#TOP
{
	background-image: url(../gfx/lato.jpg);
	background-repeat: no-repeat;
	background-size: contain;
	width: 100vw;
	min-height: 20vh;
	margin: 0 auto;
	margin-bottom: 1vh;
}
h1
{
	color:#fff;
	text-align:center;
}
.center
{
	text-align:center;
}
#MOVIE
{
	margin: 0 auto;
	display:block;
	width:90vw;
}

#LOGO
{
	position:absolute;
	width:100px;
	height:75px;
	margin-top:4vh;
	margin-left:1vw;
	background-image:url(../gfx/logo2.png);
	background-size: contain;
	background-repeat:no-repeat;
}
.yt
{
	width:320px;
	height:200px;
	margin: 0 auto;
}
#TXT_CONTAINER
{
	width:90vw;
	color:#66a53e;
	text-align:justify;
	font-size:14px;
	margin:2vh 5vw 2vh 5vw;
	
}
#BUTONNS
{
	
	margin:0 auto;
	width:90vw;
	text-align:center;
	margin-bottom:2vh;
}
#SPACE
{
	width:2vw;
	height:13vh;
	float:left;
}
.box1
{
	background-image:url(../gfx/cennik.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:10vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box1:hover
{
	background-image:url(../gfx/cennik.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:10vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
.box2
{
	background-image:url(../gfx/regulamin.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box2:hover
{
	background-image:url(../gfx/regulamin.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box3
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box3:hover
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box4
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box4:hover
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
@keyframes colorchanges {
   	
	
	0%   {background-color:#66a53e;}
    
    100% {background-color:#000;}
	
	
}
.cennik
{
	width:20vw;
	height:3vh;
	
}
a.cennik
{
	color:#fff;
	text-decoration:none;
	
}
a.regulamin
{
	color:#fff;
	text-decoration:none;
	
}
.regulamin
{
	width:20vw;
	height:3vh;
	background-color:
}

#BANER
{
	background-image:url(../gfx/carpoldschool.png);
	background-position:center;
	background-size: contain;
	background-repeat:no-repeat;
	width: 100vw;
	min-height:20vh;
	margin: 2vh 0vw 2vh 0vw;
	float:left;
}

.hvr-grow {
  
 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
/* Pulse Grow */
@-webkit-keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
}
@keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
	
  }
}







.mapa1
{
	width: 90vw;
	height:auto;
	margin:0 auto;
	/**float:left;**/
	
	
}
.mapa2
{
	width: 90vw;
	height: auto;
	margin: 0 auto;
	/**float:left;**/
	
	
}
.mapka
{
	width:auto;
	height:450px;
	
}
.googlemap
{
	width:320;
	height:200px;
}

.musli-facebook
{
    border: solid #0170cf 3px;
}

#BOTTOMFOTO
{
	background-image: url(../gfx/fotoBottom.jpg);
	width: 0vw;
	min-height: 0vh;
	background-size: cover;
	float: left;
	background-repeat: no-repeat;
	visibility:hidden;
	margin: 4vh 20vw 4vh 20vw;
}
#FOOTER
{
	width: 100vw;
	height: 25vh;
	margin-top: 15px;
	margin: 0 auto;
	font-family: 'italiannoregular';
	background-color:#113911;
	float: left;
}
.footerlink
{
	text-decoration: none;
	color: #999999;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.footerlink:hover
{
	text-decoration: none;
	color: #fff;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.kontakt
{
	text-decoration: none;
	color: #999999;
	float: right;
	margin-right: 20vw;
	margin-top: 1vh;
}
.whitelight
{
	text-decoration: none;
	color: #999999;
	float: right;
	
}
.whitelight:hover
{
	text-decoration: none;
	color: #fff;
	float: right;
	
}
/* reset */
.musli, .musli *{
    padding:0;
    margin:0;
    list-style:none;
}
.musli{
    position:fixed;
    right:0px;
    top:150px;
    z-index:100;
    list-style:none;
}
.musli-bottom{
    left:300px;
    bottom:0px;
    right:auto;
    top:auto;
}
.musli-top{
    left:300px;
    top:0px;
    right:auto;
    bottom:auto;
}
.musli-left{
    left:0px;
    top:200px;
    right:auto;
    bottom:auto;
}
.musli > li{
    cursor:pointer;
    width:35px;
    height:35px;
    margin-bottom:1px;
    position:relative;
}
.musli-bottom > li, .musli-top > li{
    margin-right: 1px;
    margin-bottom: 0;
    float:left;
}
.musli > li > img{
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
.musli-bottom > li > img{
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}
.musli-top > li > img{
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}
.musli-left > li > img{
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
.musli > li > div{
    padding:5px;
    background: #fff;
    float:left;
    width:286px; /* szerokosc zakladek */
    height:296px; /* wysokosc zakladek */
    -moz-border-radius: 0 0 0 8px;
    -webkit-border-radius: 0 0 0 8px;
    border-radius: 0 0 0 8px;
    position:absolute;
    top:0;
    left:35px;
    z-index:100;
}
.musli-bottom > li > div{
    top:35px;
    left:auto;
    -moz-border-radius: 0 8px 0 0;
    -webkit-border-radius: 0 8px 0 0;
    border-radius: 0 8px 0 0;
}
.musli-top > li > div{
    bottom:35px;
    left:auto;
    top:auto;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-left > li > div{
    top:0px;
    left:auto;
    right:35px;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-facebook{
    border: solid #0170cf 3px;
}

}
@media screen and (max-width: 320px)   /* ---------------------mediascreen--------------------medium----------- */
{
	
	#TOP
{
	background-image: url(../gfx/lato.jpg);
	background-repeat: no-repeat;
	background-size: contain;
	width: 100vw;
	min-height: 20vh;
	margin: 0 auto;
	margin-bottom: 1vh;
}
h1
{
	color:#fff;
	text-align:center;
}
.center
{
	text-align:center;
}
#MOVIE
{
	margin: 0 auto;
	display:block;
	width:900px;
}

#LOGO
{
	position:absolute;
	width:100px;
	height:75px;
	margin-top:4vh;
	margin-left:1vw;
	background-image:url(../gfx/logo2.png);
	background-size: contain;
	background-repeat:no-repeat;
}
.yt
{
	width:320px;
	height:200px;
}
#TXT_CONTAINER
{
	width:90vw;
	color:#66a53e;
	text-align:justify;
	font-size:14px;
	margin:2vh 5vw 2vh 5vw;
	
}
#BUTONNS
{
	
	margin:0 auto;
	width:90vw;
	text-align:center;
	margin-bottom:2vh;
}
#SPACE
{
	width:2vw;
	height:13vh;
	float:left;
}
.box1
{
	background-image:url(../gfx/cennik.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:10vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box1:hover
{
	background-image:url(../gfx/cennik.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	margin-left:10vw;
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
.box2
{
	background-image:url(../gfx/regulamin.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box2:hover
{
	background-image:url(../gfx/regulamin.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box3
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
}
.box3:hover
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
}
.box4
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	
}
.box4:hover
{
	background-image:url(../gfx/home.png);
	width:35vw;
	height:20vh;
	background-size:contain;
	background-repeat:no-repeat;
	/**margin-right:16vw;**/
	float:left;
	background-position: center;
	background-color:#66a53e;
	animation-name: colorchanges;
	animation-duration: 1s;
	animation-iteration-count: 2;
    animation-direction: alternate;
	
}
@keyframes colorchanges {
   	
	
	0%   {background-color:#66a53e;}
    
    100% {background-color:#000;}
	
	
}
.cennik
{
	width:20vw;
	height:3vh;
	
}
a.cennik
{
	color:#fff;
	text-decoration:none;
	
}
a.regulamin
{
	color:#fff;
	text-decoration:none;
	
}
.regulamin
{
	width:20vw;
	height:3vh;
	background-color:
}

#BANER
{
	background-image:url(../gfx/carpoldschool.png);
	background-position:center;
	background-size: contain;
	background-repeat:no-repeat;
	width: 100vw;
	min-height:20vh;
	margin: 2vh 0vw 2vh 0vw;
	float:left;
}

.hvr-grow {
  
 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
/* Pulse Grow */
@-webkit-keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
}
@keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
	
  }
}







.mapa1
{
	width: 100vw;
	height:auto;
	margin:0 auto;
	float:left;
	
	
}
.mapa2
{
	width: 100vw;
	height: auto;
	margin: 0 auto;
	float: left;
	
	
}
.mapka
{
	width:auto;
	height:450px;
	
}
.googlemap
{
	width:320;
	height:200px;
}

.musli-facebook
{
    border: solid #0170cf 3px;
}

#BOTTOMFOTO
{
	background-image: url(../gfx/fotoBottom.jpg);
	width: 0vw;
	min-height: 0vh;
	background-size: cover;
	float: left;
	background-repeat: no-repeat;
	visibility:hidden;
	margin: 4vh 20vw 4vh 20vw;
}
#FOOTER
{
	width: 100vw;
	height: 25vh;
	margin-top: 15px;
	margin: 0 auto;
	font-family: 'italiannoregular';
	background-color:#113911;
	float: left;
}
.footerlink
{
	text-decoration: none;
	color: #999999;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.footerlink:hover
{
	text-decoration: none;
	color: #fff;
	float: left;
	margin-left: 20vw;
	margin-top: 5vh;
}
.kontakt
{
	text-decoration: none;
	color: #999999;
	float: right;
	margin-right: 20vw;
	margin-top: 1vh;
}
.whitelight
{
	text-decoration: none;
	color: #999999;
	float: right;
	
}
.whitelight:hover
{
	text-decoration: none;
	color: #fff;
	float: right;
	
}
/* reset */
.musli, .musli *{
    padding:0;
    margin:0;
    list-style:none;
}
.musli{
    position:fixed;
    right:0px;
    top:150px;
    z-index:100;
    list-style:none;
}
.musli-bottom{
    left:300px;
    bottom:0px;
    right:auto;
    top:auto;
}
.musli-top{
    left:300px;
    top:0px;
    right:auto;
    bottom:auto;
}
.musli-left{
    left:0px;
    top:200px;
    right:auto;
    bottom:auto;
}
.musli > li{
    cursor:pointer;
    width:35px;
    height:35px;
    margin-bottom:1px;
    position:relative;
}
.musli-bottom > li, .musli-top > li{
    margin-right: 1px;
    margin-bottom: 0;
    float:left;
}
.musli > li > img{
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
.musli-bottom > li > img{
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}
.musli-top > li > img{
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}
.musli-left > li > img{
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
.musli > li > div{
    padding:5px;
    background: #fff;
    float:left;
    width:286px; /* szerokosc zakladek */
    height:296px; /* wysokosc zakladek */
    -moz-border-radius: 0 0 0 8px;
    -webkit-border-radius: 0 0 0 8px;
    border-radius: 0 0 0 8px;
    position:absolute;
    top:0;
    left:35px;
    z-index:100;
}
.musli-bottom > li > div{
    top:35px;
    left:auto;
    -moz-border-radius: 0 8px 0 0;
    -webkit-border-radius: 0 8px 0 0;
    border-radius: 0 8px 0 0;
}
.musli-top > li > div{
    bottom:35px;
    left:auto;
    top:auto;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-left > li > div{
    top:0px;
    left:auto;
    right:35px;
    -moz-border-radius: 0 0 8px 0;
    -webkit-border-radius: 0 0 8px 0;
    border-radius: 0 0 8px 0;
}
.musli-facebook{
    border: solid #0170cf 3px;
}

}
 