/*** 100px = 6.25rem
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400&subset=latin,latin-ext,cyrillic);
***/


:root {
  --transp1:0.3;
  --transp2:0.5;
}

.container{

}

#imgz{
  position: fixed;
  left: 0px;
  bottom: 0;
  z-index: -99;
  -webkit-filter: opacity(40%); /* Safari */
  filter: opacity(40%);
  width: 90%;
}

.bg0::after {
  content: "";
	background: url(../img/kids-4ww.png)  no-repeat right top ;
  opacity: 0.1;
  top: 5%;  right: 1%;
  left: 20%;
  bottom: -35%;
  position: absolute;
  z-index: -99;   
  background-size: cover; //110% ;
  height: 100%; 
   background-attachment: fixed;
  //background-position: center;
  //background-repeat: no-repeat;
  //background-size: cover;
  /*overflow: hidden;
  max-width: 90vw;
  max-height: 100vh;*/
}

.bg0{
background-image: linear-gradient(315deg, #09c6f9 0%, #045de9 74% );
/*--background-image: linear-gradient(315deg, #045de9 0%, #09c6f9 74%);*/
	color: white;
}

.parallax {
  /* The image used */
  background-image: url("img_parallax.jpg");

  /* Set a specific height */
  height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bgzz{

	background: url(../img/salta-pgf.png)  no-repeat bottom center;
  background-size: 100vw ;
  overflow: hidden;
  /*background-position: right bottom;	/*, left top;*/
  /*--filter: opacity(30%);*/
}
.bgzz > img {
  position: fixed;
  left: 0px;
  bottom: 0;
  z-index: -99;
  -webkit-filter: opacity(30%); /* Safari */
  filter: opacity(30%);
  width: 90%;
}
.bgzzz{
	  display: flex;

  align-items: flex-end;
}
div.bgz::after {
  content: "";
	background: url(../img/salta-pgf.png)  no-repeat bottom center;
  opacity: 0.5;
  top: 20%;  right: 0;
  left: 0;
  bottom: -20%;

  position: absolute;
  z-index: -99;   
  background-size: 80% ;
  overflow: hidden;
  max-width: 90vw;
  max-height: 100vh;
}

.bgfr{
	/*background: url(img/bg/topBg.gif) #63d2fd repeat-x top left;	*/
	/*background: url(img/piratas.png) no-repeat center center  ;*/
  background-size: 95% 95%;
  opacity: 0.9;
}
.bgrad{
background: repeating-radial-gradient( RGBa(240, 248, 255, var(--transp2)), RGBa(240, 248, 255, var(--transp2))  1rem, RGBa(255, 228, 225, var(--transp2)) 1rem, RGBa(255, 228, 225, var(--transp2)) 2rem);
}/*AliceBlue, MistyRose*/

.bgrad-x {  /*multi-repeating-linear rainbow  var(--transp1) 0.555*/
  background:
      repeating-linear-gradient(190deg, rgba(255, 0, 0, 0.555) 40px,
        rgba(255, 153, 0, 0.444) 80px, rgba(0, 217, 255, 0.444) 120px,
        rgba(0, 255, 0, 0.444) 160px, rgba(255, 255, 0, 0.444) 200px,
        rgba(75, 0, 130, 0.444) 240px, rgba(238, 130, 238, 0.444) 280px,
        rgba(255, 0, 0, 0.444) 300px),
      repeating-linear-gradient(-190deg, rgba(255, 0, 0, 0.444) 30px,
        rgba(255, 153, 0, 0.444) 60px, rgba(255, 255, 0, 0.444) 90px,
        rgba(0, 255, 0, 0.444) 120px, rgba(0, 0, 255, 0.444) 150px,
        rgba(75, 0, 130, 0.444) 180px, rgba(238, 130, 238, 0.444) 210px,
        rgba(255, 0, 0, 0.444) 230px),
      repeating-linear-gradient(23deg,  rgba(255,0,0,0.444) 50px, rgba(255, 165, 0, 0.444) 100px,
      RGBA(255, 255, 0,0.1) 150px, RGBa(0, 128, 0, 0.444) 200px, RGBa(0, 0, 255, 0.444) 250px,
      RGBA(75, 0, 130, 0.444) 300px, RGBa(238, 130, 238, 0.444) 350px, rgba(255,0,0, 0.444) 370px);
       /*red 50px  orange 100px,yellow 150px, green 200px, blue 250px,
        indigo 300px, violet 350px, red 370px) */
}




#divdyn p::first-letter {
   /*float: left;*/
   font-size: 2.2rem;
   /*font-weight: bold;*/
   font-family: cursive;
   padding-right: 0.2rem;
   color: red;
}


h3 {color: red; /*font-family: "Toledo Heavy",  "Arial Black";*/
	text-shadow: 2px 2px 2px navy;
  }


.cloud  {
	color: red;
	background-image: none;
  background-image: url(img/cloud02.png); /*no-repeat 0px 0px*/
  background-size: 6rem 3rem;
  width:6rem;
height:3rem;
}


.kmenuitem {
  font-size: 1.5rem; 
  min-width: 6rem;
  width: 6rem;
  /*negalima nes nusivaziuoja, kaip ir line h. --height: 2.7rem; */
  min-height: 2.7rem;
  color: maroon;
  text-shadow: 2px 1px 1px green;
  box-sizing: border-box;
overflow: hidden;
	/*  background-color: transparent;
  border: none;
  border-radius: 5px;
box-shadow: 3px 3px 3px LightBlue;
*/
}

#kmenu2 {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
  /*display:inline;
  	width: 90%;*/
	float: left;
	text-align: center;
	/*margin: auto; */
	padding-left: 2rem; 
  padding-right: 2rem;
  
  margin-top: .1rem;
  text-align: center;

}
#kmenu2 > div {
  padding-right: .1rem;
  padding-top: .2rem;
  margin-top: .1rem;
  margin-bottom: .1rem;
  margin-right: 0.1rem;
  margin-left: .1rem;

  --box-sizing: border-box;
  /*display:inline;*/
}


.headBottom {
	width: 100%;
	background: url(img/bg/-shipTopBg.gif)  repeat-x bottom left;
	margin: auto;
}
.headLogo {
	background: url(img/logoz.png) no-repeat  10px  10px, 
		url(img/zuv1.png) no-repeat top right 10px; 
	background-size: 12rem 4rem, 2rem 2rem; 
	margin: auto;
	height: 5rem;
}
.shiftTop{
	min-width: 6rem;
	min-height: 25rem;
	/*margin-top: 2rem;*/
	background: url(img/zuv4.png) no-repeat bottom right ; /*, url(img/cloud02.png) no-repeat center right, url(img/cloud02.png) no-repeat top right;*/
	/*background: url(img/clouds0.png) no-repeat bottom left; */
	background-size: 16rem 9rem, 9rem 6rem, 6rem 3rem;
}


.bottom {
	min-width: 16rem;
	min-height: 12.5rem;
	background: url(img/ship22.png) no-repeat right 10% top, 
	 url(img/piratas.png) no-repeat 5% 0px,  url(img/wave02.png) repeat-x bottom right; /*url(img/funnyD.png) no-repeat 50% center,  url(img/balls.png) no-repeat bottom left ,*/
	background-size:16rem 12.5rem, 9.4rem 12.5rem,6rem 3rem;/* 4.8rem 4.8rem,   12.5rem 6rem,  */
/*b*/
}

/*Menu*/
.menuicon{
  color:red; 
  font-size:2rem;
  padding-bottom: 2px;
   margin-bottom: 2px;
}
.headerMenu, .menu {

	padding-bottom: 2px;
	  text-align: center;
  background-color: transparent;
margin-top: 0.1rem;
     margin-bottom: 0.1rem;
}

	#navbar-toggle-cbox:checked ~ .collapse {    display:block;}
	#navbar-toggle-cbox {   display: none;
	width:1; height:1; opacity: .8; }

div.solution {
    position:fixed;
    bottom:7px;
    right: 7px;
		color: rgba(128, 128, 128, 0.603); /*#e4f5fb;*/
}

.clearboth
 {
 clear:both;
 }
 

/*an*/

/*---------*/
#kmdiv2 {
    /*position: fixed;
	background:red;*/
    /*top: 20px;
    left: 220px;
    bottom: 25px;
    */
	min-width: 56rem;
    width: 80%;
	height:auto;
	display:block;
}
#kmdiv3 {
    /*position: fixed;
    top: 80px;
    left: 40px;
    bottom: 25px;
    */
    width: 20%;
}

.kmleft {
    position: fixed;
    top:3rem;
    left: 0.3rem;
}
.ghostcolor{
color: #F0F0FF;
font-size: 1px;
}

.grad-rx {
	padding:30px;
    color: white; 
    font-weight: normal; line-height: 100%; font-size: 16pt;
	margin-left: 5%; text-indent: 10%; margin-bottom: 0cm; 
	/*font-family: "Toledo Heavy",  "Arial Black";*/
	/*border: 10px dotted gold;*/
	/*background-clip: padding-box;*/
  text-shadow: 2px 2px 2px navy;

  	/*margin: 2px;    padding: 5px;*/
    border: 2px solid blue;
    outline: 2px solid red;
	outline-offset: 2px; 
	background:radial-gradient(ellipse   farthest-corner at 90% 10% ,  purple ,indigo 10%,teal , lightblue, navy );
}
.grad-ry {
	padding:30px;
    color: white; 
    font-weight: normal; line-height: 100%; font-size: 16pt;
	margin-left: 5%; text-indent: 10%; margin-bottom: 0cm; 
	/*font-family: "Toledo Heavy",  "Arial Black";*/
	border: 10px dotted gold;
	/*background-clip: padding-box;*/
  text-shadow: 2px 2px 2px navy;
  background-color: rgba(30, 143, 255, 0.5);
}

.grad-about {
  background: #f3991a; /* For browsers that do not support gradients #DF0101*/
  background: -webkit-radial-gradient(circle, red, MistyRose, green); /* Safari */
  background: -o-radial-gradient(circle, red, MistyRose, green); /* Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(circle, red, MistyRose, green); /* Firefox 3.6 to 15 */
  background: radial-gradient(ellipse   farthest-corner at 90% 10% ,  white ,MistyRose 10%,LightSkyBlue , lightblue, white ); /* Standard syntax */
  /*  ellipse   farthest-corner at 90% 90%   circle closest-side at 90% 10% */
}
.box-about {
  color: mistyrose; 
  line-height: 100%; 
margin-left: 5%; text-indent: 10%; margin-bottom: 0cm; 
font-weight: normal; font-size: 1.5rem; 
--font-family: "Toledo Heavy",  "Arial Black";
border: 10px dotted gold;
/*background-clip: padding-box;*/
text-shadow: 2px 2px 4px navy;
}

.zsize{
  min-width: 22rem;
	min-height: 22rem;
	WIDTH: 22rem;
  height: 22rem;
  align-self: center;
  box-align: center;
z-index: -2;

}

.boxsize300{
  min-width: 15rem;
	min-height: 15rem;
	WIDTH: 15rem;
  height: 15rem;
  align-self: center;
  box-align: center;
  
  display: block;
  margin-left: auto;
  margin-right: auto;
  -width: 50%;
}

.boxsize500{
  min-width: 21rem;
	min-height: 21rem;
	WIDTH: 85%;
  height: auto;
  display: flex;
  flex-direction: column;
  
  /*flex-wrap: nowrap;*/
  box-align: center;
  align-content: center;
}
.grad-yr {
  background: #f3991a; /* For browsers that do not support gradients */
  background: -webkit-radial-gradient(circle, red, MistyRose, green); /* Safari */
  background: -o-radial-gradient(circle, red, MistyRose, green); /* Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(circle, red, MistyRose, green); /* Firefox 3.6 to 15 */
  background: radial-gradient(circle, rgba(255, 255, 0, 0.9), rgba(255, 255, 255, 0.9) 30%, rgba(0, 255, 0, 0.5)); /* Standard syntax  #DF0101,, MistyRose 30%, white*/
  
}


#grad {/* transparent */
  background: red; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,rgba(255,0,0,0),rgba(255,0,0,1)); /*Safari 5.1-6*/
  background: -o-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /*Fx 3.6-15*/
  background: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1)); /*Standard*/
}

.bg-img1 {
    background-image: url(../img/balls.png) no-repeat bottom left; /*, url(paper.gif);*/
    background-position: right bottom;	/*, left top;*/
    background-repeat: no-repeat;	/*, repeat;*/
	    background-size: 200px 200px;
}
		
#grad3 {
    height: 200px;
    background: -webkit-repeating-linear-gradient(190deg,red,yellow 7%,green 10%); /* For Safari 5.1 to 6.0 */
    background: -o-repeating-linear-gradient(190deg,red,yellow 7%,green 10%); /* For Opera 11.1 to 12.0 */
    background: -moz-repeating-linear-gradient(190deg,red,yellow 7%,green 10%); /* For Firefox 3.6 to 15 */
    background: repeating-linear-gradient(190deg,red,yellow 7%,green 10%); /* Standard syntax (must be last) */
}

#x1 {
  color: #ce181e; font-weight: normal; line-height: 14px; font-size: 16pt;
margin-left: 1cm; text-indent: 2cm; margin-bottom: 0cm; 
font-family: script;
}


.share-btn {
    display: inline-block;
    color: #ffffff;
    border: none;
    padding: 0.5rem;
    width: 4rem;
    box-shadow: 0 2px 0 0 rgba(0,0,0, 0.2);
    outline: none;
    text-align: center;
}

.share-btn:hover {
  color: #eeeeee;
}

.share-btn:active {
  position: relative;
  top: 2px;
  box-shadow: none;
  color: #e2e2e2;
  outline: none;
}

.share-btn.twitter     { background: #55acee; }
.share-btn.google-plus { background: #dd4b39; }
.share-btn.facebook    { background: #3B5998; }
.share-btn.pinterest { background: #EB4823; }
.share-btn.reddit      { background: #ff5700; }
.share-btn.linkedin    { background: #4875B4; }
.share-btn.email       { background: #05790f; }

.borders2 {
	margin: 5px;    padding: 5px;
    border: 2px solid gold;
    outline: 2px solid red;
	outline-offset: 5px;
	
	width: 28rem; height: 38rem;
}
.borders2g {
width: 28rem; height: 19rem;
	margin: 2px;    padding: 5px;
    border: 2px solid blue;
    outline: 2px solid red;
	outline-offset: 2px; 
	background:radial-gradient(ellipse   farthest-corner at 90% 10% ,  purple ,indigo 10%,teal , lightblue, navy );
}

/****************/
.svg1 {
  height: 10rem;
  width: 10rem;
  display: flex;
  flex-direction: row;
  flex-flow: row wrap;
  /*flex:1;*/
  opacity: 0.5;
}
g.kmsvg path {
  fill: white;
  stroke: gold;
  stroke-width: 1;

}
g.kmsvg path:hover {
  fill: lime;
  stroke: red;
}

g.kmsvg1 > path {
  fill: white;
  stroke: lightblue;
  stroke-width: 2;
  stroke-linejoin: round;
}
g.kmsvg1 >path:hover {
  fill: aliceblue;
  stroke: lightskyblue;
}
.inli {
  display: inline;
}


li.kmli {
  display: inline;
}


.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}


.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}

#ktogg a:hover {
  text-shadow: 1px 1px white;
}
ul.mkm {
  list-style-type: none;  margin: 0;  padding: 0;  overflow: hidden;  background-color: #333333;}

li.mkm {  float: left;}

li.mkm a {
  display: block;  color: white;  text-align: center;  padding: 16px;  text-decoration: none;}

li.mkm a:hover {  background-color: #111111;color: white;}
.myshadow {
  box-shadow: 10px 10px grey;
}
img.ikm {
	width: 100%;  height: auto; max-width: 100% overflow:scroll; 
	box-shadow: 0.5rem 0.5rem 0.6rem lime;
	border: 0.12rem solid lime;
}
.boxkm {
	width: 100%;  height: auto; max-width: 100% overflow:scroll; 
	box-shadow: 0.33rem 0.33rem 0.33rem khaki;
	border: 1px solid khaki;
	padding:2px;
}
.kmnavaa > a{
attr(button) ;
}
[class*="test"] {
  background: #ffff00;
}
[data-tooltip]::before {
  content: attr(data-tooltip);
  visibility:hidden;
}

[data-tooltip]:hover::before {
  visibility: visible;
  opacity: 1;
}

itrans: {
  transition: width 1s  ease-out; /*height 1s opacity 1.5s*/
  transform: translateY(130%);
}


.visible {
  visibility: visible;
  opacity: 1;
  transition: opacity 2s linear;
}

.hidden {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;
}

.ripple {
  position: relative;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
}
.ripple:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #000 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform .5s, opacity 1s;
}
.ripple:active:after {
  transform: scale(0, 0);
  opacity: .2;
  transition: 0s;
}