

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

.pre * {
  transition: none !important;
}
* {
  box-sizing: border-box;
}
html, form {
  font-size: 18px;
}
html {
  xwidth: 100%;
  xheight: 100%;
  
xbackground-color:yellow;
}
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  xmin-height:100%;

  position: relative;


  xfont-size: 1rem;
  -webkit-font-smoothing: antialiased;


  background-color:#111; xrgba(20, 20, 20, 1);


  -moz-transform: translateZ(0);
  transform: translate3d(0,0,0);
  perspective: 1000px;
  perspective-origin: 50% 50%;
  overflow:hidden;
xbackground-color:red;


}

h1, h2, h3, h4, h5, h6
, nav
, .hx {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 200;
}

a {
  text-decoration: none;
}


/* ///////////////////////////////////////////////////////////////////////////*\
/* ENT
/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/

#ent {
  z-index: 101;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: #111;
}
#enx {
  z-index: 102;
  width: 100vw;
  height: 1px;
  margin: 70vh auto;
  border: 1px #0089aa dotted;
  transition: width .7s;
}



/* ///////////////////////////////////////////////////////////////////////////*\
/* NAV
/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/

nav#bot ul {
    list-style: none;
}

nav#bot {
xborder: dotted 1px green;
  z-index: 99;
  position: fixed;
  bottom:64px;
  height:96px;
  left:5%;
  width:90%;
}
    @media (max-width: 600px) {
      nav#bot {
        left:0;
        width:100%;
      }
    }


nav#bot > ul{
xborder: dotted 1px blue;
  margin:14px auto;
  padding:0;

  display: flex;
  xjustify-content: space-between;
  justify-content: space-around;

}
nav#bot > ul > li{
xborder: dotted 1px gray;

  position: relative;

  xmax-width:96px;
  xflex:1 1 10%;
  flex:0 1 96px;

}
nav#bot li#nhom{
xborder: dotted 1px orange;

  xmax-width:100%;
  xflex:1 1 30%;
  flex:1 1 288px;
}


nav#bot svg{
xborder: dotted 1px yellow;
  xz-index:1;

  display: block;
  margin: auto;

  cursor: pointer;

  fill:#999;
}


nav#bot > ul > li > div {
xborder: dashed 1px violet;
  position: absolute;
  xz-index:0;

  display: block;
  margin: auto;

  border-radius: 30%;
  width:1280px;
  height:1280px;

  xcursor: pointer;

top:calc(-640px + 32px);
left:calc(-640px + 50%);
transform: scale(.05);

  xbackground-color:red;
  background: radial-gradient(ellipse at center, rgba(198,198,198,0) 0%,rgba(198,198,198,0) 3%,rgba(198,198,198,1) 4%,rgba(198,198,198,1) 100%);
  opacity: 0;

  transition: opacity .6s ease-out, transform .2s  ease-out; /* x--z-index 0.3s */
}

nav#bot > ul > li > div.nh:hover, .nhovered {
z-index:9;

  xcursor: default;

  transform: scale(1);
  opacity: .9;
}




/* //////////////////////////////////////*\
/* NAV CONTENT
/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
nav#bot div#ncntd > div {
xz-index:99;
xborder: dotted 1px gray;
xbackground-color:pink;
  height:50%;xcalc(50%);
  width:50%;xcalc(50%);
  margin: 2rem 0 0 2rem;

  xtop:0px;
  xleft:50%;

  xtext-align: right;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
}
nav#bot div#ncntd > div > div {
xborder: solid 1px yellow;
xposition: relative;
  flex: 0 0;
  xdisplay: inline-block;
  xwidth:auto;

  text-align: left;
  xline-height: .1em;
}

nav#bot div#ncntd > div > div + div {
  margin-top:2rem;
}

nav#bot div#ncntd > div > div em {
  xtext-align: left;
  xtext-transform: uppercase;
  xfont-variant: small-caps;
}
nav#bot div#ncntd > div > div > ul {
xborder: dotted 1px red;
  xmargin-top:-1.2em;
  padding: 0;
  xposition: relative;
  xdisplay: inline-block;

  text-align: right;
}
nav#bot div#ncntd > div > div > ul > li {
  font-size:2rem;
}





nav#bot footer {
  position:fixed;
  bottom:2px;
xleft:(50%+64px);
  right: 1rem;
  color:#fff;
  font-size:10px;
  letter-spacing: .2em;
}



/* ///////////////////////////////////////////////////////////////////////////*\
/* CAM
/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
#cam {
  xperspective: 4000px;
  xwidth:90%;
  xheight:90%;
  margin:0 auto;

  transform-style: preserve-3d;
  transform-origin: 50% 50% 25vw;
  xtransform: rotateX(0deg) rotateY(0deg);
}

#cam, #cam > section {
  transition: transform .6s .0s cubic-bezier(.67,.18,.66,1.12), opacity .6s .0s cubic-bezier(.67,.18,.66,1.12);
}

#cam > section {
  position:absolute;
}

/*
  #notused{
    display: flex;
    min-height: 100vh;
    flex-direction: column;
  }
*/

  #hom{
    display: flex;
    height: 100%;
    xflex-direction: row;
    position: relative;
xborder: dotted 1px orange;

  }
  #hom .bcg{
    position: absolute;
    z-index: -1;
    height: 100%;
    width: 100%;
/* Multiply Background images
    background: 
      url(number.png) 600px 10px no-repeat,  x--On top
      url(thingy.png) 10px 10px no-repeat, x--behind
   */
    background: no-repeat center center;
    background-size: cover; x:cover; x:100% 100%; x:contain;

    filter: blur(100px);
    transition: .4s ease-out filter;

    -webkit-filter: blur(100px);
    -webkit-transition: .4s ease-out -webkit-filter;
  }
  #hom .bcg img{
    width:100%;
    height:100%;
/* x--FUN Doodle
background: linear-gradient(rgba(255,255,255,.2), rgba(100,235,235,.2)) no-repeat border-box, linear-gradient(rgba(255,155,255,.2), #777) no-repeat border-box; */
    xobject-fit: fill;
  }
    @media (max-width: 600px) {
      #hom .bcg img{
        x--dont-Resize;
        x--object-fit: ???fill;
      }
    }

  #wel, #szkolenia-otwarte, #firma-szkoleniowa{
x    flex: 0 1 3%;
    color: #fff;

  }

  #wel {
x    flex: 0 1 94%;
x    order: 1;
  min-height:540px;
  width:350px;
  height:540px;
    margin: 0 auto;
    text-align: center;
xoverflow:hidden;
xborder: dotted 1px gray;

    color:#999;

  }
  #szkolenia-otwarte {
x    order: 0;
x    align-self: flex-start;
  }
  #firma-szkoleniowa{
x    order: 2;
x    align-self: flex-start;
  }


  #wel h1 {
    font-size: calc(5.6rem * .64); /*5.97vw;*/
    letter-spacing: .08em;
    margin-right:  -.08em;
    xmargin-left:    .08em;
    margin-bottom:    0em;
    margin-top:      .5em;
  }
  #wel h1 div {
    font-size: calc(5.6rem * .58);
    letter-spacing: .19em;
    margin-right:  -.19em;
    margin-left:    -.1em;
  }
  #wel h1 div+div {
    font-size: calc(5.6rem * .36); /*3vh;*/
    line-height:      2em;
    letter-spacing: .26em;
    margin-right:  -.26em;
    xmargin-left:    .26em;
    margin-bottom:    1em;
  }
  #wel h2 {
/*  NOT USED */
xborder: solid 1px red;
    font-size: px;
    letter-spacing: .25em;
    margin-right:  -.25em;
    margin-left:    .55em;
    margin-bottom:    2em;
  }
  #wel #mot {
    color:#bbb;
    text-shadow: 0px 4px 3px #000;
    font-size: calc(5.6rem * .28);
    letter-spacing: .04em;
    margin-right:  -.04em;
    margin-top:       1em;
    margin-bottom:    1em;
  }





  #log{
    x WHEN BIG
xdisplay: block;
    xtext-align: center;
    xposition: absolute;
    xtop: 50%;
    xleft: 50%;
    xheight: 384px;
    xwidth: 384px;
    xmargin-top: -192px;
    xmargin-left: -192px;
    xtransform:translate(-50%,-50%);
  }
  #logS{
    x WHEN SMALL
    x transform:scale(-1,1);
    xposition: absolute;
    xtop:10px;
    xleft:50%;
    xmargin-top: half size;
    xmargin-left: half size;
  }
  #log{
    z-index: 98;
    margin: auto;
    height: 321px;
    width: 321px;
    xmax-width: 100%;
    perspective: 500px;
    perspective-origin: 50% 100%;
  }
  #log img{
    backface-visibility: hidden;
    transform: rotateX(-92deg);
    transform-style: preserve-3d;
    transform-origin: 50% 100%;
    transition: transform 1.6s .1s cubic-bezier(.67,.18,.66,1.12);

  }
  #log img:hover{
xborder: 1px orange solid;
xtransform: rotateX(-90deg);
  }

.ico {
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: currentColor;
}

/* HIDE SECTIONS on INIT
****************************************************************************** */
section {
  opacity:0;
}

/* HOM PAGE -- 01 (show only this)
****************************************************************************** */
section#hom {
  opacity:1;
}

/* SEA PAGE -- 01
****************************************************************************** */
section#sea {
  background-color:#ffc640;
}


/* OPN PAGE -- 07
****************************************************************************** */
section#opn {
  background-color:#03546f !important;
}








.ico_css_load-share { 
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10'>
          <path
          d='M 12.03125 -218.64062 A 57.604626 57.604626 0 0 0 -45.574219 -161.03516 A 57.604626 57.604626 0 0 0 -44.203125 -148.86719 L -121.99219 -100.66992 A 70.710678 70.710678 0 0 0 -168.69531 -118.4043 A 70.710678 70.710678 0 0 0 -239.40625 -47.693359 A 70.710678 70.710678 0 0 0 -168.69531 23.017578 A 70.710678 70.710678 0 0 0 -118.5957 2.1347656 L -42.599609 44.064453 A 70.710678 70.710678 0 0 0 -43.4375 54.332031 A 70.710678 70.710678 0 0 0 27.273438 125.04297 A 70.710678 70.710678 0 0 0 97.984375 54.332031 A 70.710678 70.710678 0 0 0 27.273438 -16.378906 A 70.710678 70.710678 0 0 0 -27.404297 9.5625 L -100.00586 -31.251953 A 70.710678 70.710678 0 0 0 -97.984375 -47.693359 A 70.710678 70.710678 0 0 0 -100.64844 -66.654297 L -22.9375 -115.34766 A 57.604626 57.604626 0 0 0 12.03125 -103.43164 A 57.604626 57.604626 0 0 0 69.634766 -161.03516 A 57.604626 57.604626 0 0 0 12.03125 -218.64062 z'>
          </path>
          </svg>");
      }


/*
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="imgView" x="0px" y="0px" viewBox="0 0 88.1 88.1"
style="enable-background:new 0 0 88.1 88.1;"
xml:space="preserve" class="detail convertSvgInline replaced-svg" width="256px" height="256px" data-id="77985" data-kw="share11">
<g id="_x37_7_Essential_Icons_58_">
  <path id="Share" d="M69.05,58.1c-4.8,0-9.1,2.3-11.8,5.8l-24.3-14.1c1.5-3.7,1.5-7.8,0-11.5l24.3-14.1c2.7,3.5,7,5.8,11.8,5.8   c8.3,0,15-6.7,15-15s-6.7-15-15-15s-15,6.7-15,15c0,2,0.4,4,1.1,5.7l-24.3,14.2c-2.8-3.5-7-5.8-11.8-5.8c-8.3,0-15,6.7-15,15   s6.7,15,15,15c4.8,0,9.1-2.3,11.8-5.8l24.3,14.1c-0.7,1.7-1.1,3.7-1.1,5.7c0,8.3,6.7,15,15,15s15-6.7,15-15S77.35,58.1,69.05,58.1z    M69.05,4.1c6.1,0,11,4.9,11,11s-4.9,11-11,11c-6.1,0-11-4.9-11-11S62.95,4.1,69.05,4.1z M19.05,55.1c-6.1,0-11-4.9-11-11   s4.9-11,11-11s11,4.9,11,11S25.15,55.1,19.05,55.1z M69.05,84.1c-6.1,0-11-4.9-11-11s4.9-11,11-11c6.1,0,11,4.9,11,11   S75.15,84.1,69.05,84.1z"></path>
*/

