/* Reset */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p { margin: 0; padding: 0; }
fieldset,img { border: 0; }
ol,ul { list-style: none;}
h1 { font-size: 100%; font-weight: normal; }
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section { display: block; }

/*  */

html, body
{
  margin: 0;
  height: 100%;
  -webkit-font-smoothing: antialiased;
}

html
{
  font-size: 62.5%;
}

body
{
  display: -webkit-flex;
  display: flex;
  margin: 0 auto;
  padding: 0;
  min-width: 88rem;
  min-height: 45rem;
  background-color: #fff;
  background-image: radial-gradient(circle at 50% 50%, #fff 60%, #ddd);
  -webkit-justify-content: center;
  -webkit-align-items: center;
  justify-content: center;
  align-items: center;
  text-align: center;
}

main
{
  position: relative;
  z-index: 1;
  width: 88rem;
}

main:after
{
  content: '';
  display: table;
  clear: both;
}

#col1
{
  position: relative;
  z-index: 2;
  float: left;
  margin-right: -32rem;
  width: 32rem;
}

h1
{
  text-align: left;
}

#logo
{
  margin: 0 0 3.6rem;
  width: 32rem;
  height: 5.9rem;
}

p
{
  position: relative;
  min-height: 14rem;
  font-family: 'Roboto Slab', serif;
  font-size: 1.5em;
  line-height: 1.667em;
  color: #34495e;
}

p:after
{
  content: '';
  position: absolute;
  bottom: 1rem;
  right: 35%;
  left: 35%;
  border-bottom: .1rem solid #eee;
}

#primaryInstallOptionLink
{
  display: block;
  margin: 2.5rem 0 0;
  text-decoration: none;
}

#primaryInstallOptionImg
{
  width: 20.6rem;
  height: 5.8rem;
  border-radius: .2rem;
}

.chrome#primaryInstallOptionImg
{
  border: .1rem solid #c8c7c7;
}

#primaryInstallOptionImg:hover
{
  background-color: #f9f9f9;
}

#secondaryInstallOption
{
  font-family: 'Roboto Slab', serif;
  font-size: 1.1em;
  margin: .5rem 0 1rem;
  color: #34495e;
}

#secondaryInstallOptionLink
{
  color: #34495e;
  text-decoration: none;
}

#secondaryInstallOptionLink:hover
{
  text-decoration: underline;
}

#moreInfo
{
  font-family: 'Roboto Slab', serif;
  font-size: 1.3em;
  color: #34495e;
  text-decoration: none;
}

#moreInfo:hover
{
  text-decoration: underline;
}

#col2
{
  float: left;
  width: 100%;
  height: 100%;
}

#videoWrapper
{
  position: relative;
  margin: 9.9rem 0 0 36rem;
}

iframe
{
  width: 51.5rem;
  height: 33rem;
}

#social
{
  padding: 2.7rem 0 0;
}

.socialItem
{
  display: inline-block;
}

.socialItemLink
{
  display: block;
  margin: 0 .35rem;
  width: 2.5rem;
  height: 2.5rem;
  background: url(//cdn.pozitone.com/img/social.svg) 0 0 / cover no-repeat;
  text-indent: -9999rem;
}

#socialItemLink-facebook
{
  background-position: -5rem 0;
}

#socialItemLink-twitter
{
  background-position: -2.5rem 0;
}

#socialItemLink-instagram
{
  background-position: -10rem 0;
}

#socialItemLink-google_plus
{
  background-position: -7.5rem 0;
}

#socialItemLink-ok
{
  background-position: -15rem 0;
}

#socialItemLink-101
{
  background-position: -17.5rem 0;
}

#socialItemLink-github
{
  background-position: -12.5rem 0;
}

#nav
{
  position: fixed;
  z-index: 3;
  top: 0;
  right: 0;
  left: 0;
  padding-right: 1rem;
  background-color: #fff;
  border-bottom: .1rem solid #cfcfcf;
  text-align: right;
}

.langItem
{
  display: inline-block;
}

.langItemLink
{
  display: block;
  box-sizing: border-box;
  font-size: 1.2em;
  line-height: 4.4rem;
  width: 3rem;
  font-family: 'Roboto Slab', serif;
  color: #34495e;
  text-align: center;
  text-decoration: none;
}

.langItemLink:hover
{
  text-decoration: underline;
}

#sky
{
  position: absolute;
  left: -9999rem;
}

#poziworldList
{
  position: absolute;
  top: 0;
  left: 1rem;
  bottom: 0;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.poziworldItem
{
  padding: 0 1rem;
}

.poziworldItemLink
{
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  border-radius: 100%;
  border: .1rem solid #f1f0f0;
  opacity: .5;
  transition: opacity .2s;
}

.poziworldItemLink:hover
{
  border-color: #cfcfcf;
  opacity: 1;
}

.poziworldItemImage
{
  width: 3.2rem;
  height: 3.2rem;
}

@media all and (max-width: 57.75em) {

  body
  {
    min-width: 40rem;
    min-height: 0;
  }

  #container
  {
    width: 100%;
  }

  main
  {
    margin: 0 auto;
    width: 95%;
  }

  iframe
  {
    width: 100%;
  }
}

@media all and (max-width: 42.125em), (max-height: 33.625em), (orientation: portrait) and not (min-height: 33.625em) {

  body
  {
    min-width: 32rem;
    background-image: none;
    -webkit-justify-content: initial;
    -webkit-align-items: initial;
    justify-content: initial;
    align-items: initial;
  }

  #col1
  {
    padding-top: 5.5rem;
  }

  #col1
  {
    float: none;
    margin: 3.5rem auto 3rem;
    width: 28rem;
  }

  #logo
  {
    width: 27.8rem;
    height: 5.1rem;
  }

  p
  {
    min-height: initial;
    font-size: 1.3em;
    padding-bottom: 3.5rem;
  }

  #moreInfo
  {
    font-size: 1.2em;
  }

  #col2
  {
    float: none;
    margin: 0 auto;
    width: 80%;
    height: auto;
  }

  #videoWrapper
  {
    position: relative;
    margin: 0 0 3.5rem;
    padding-top: 3.7rem;
    padding-bottom: 56.25%;
    height: 0;
  }

  iframe
  {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .langItemLink
  {
    margin: 0 .1rem;
    padding: .5rem;
  }
}