p, li {
  font-size: 16px;
  font-weight: 300;
}

#page_windows p,
#page_windows li,
#page_win-beta p,
#page_win-beta li
{
  margin: 0;
}

#page_windows p.margin-spacer {
  margin-top: 20px;
}

p.mini-note {
  font-size: 15px;
}

.bottom-spacer {
  margin-bottom: 5%;
}

h3.windows-header {
  padding: 10px 0;
}

ul {
  padding: 0;
}

img.shadow {
  -webkit-box-shadow:0px 0px 10px 2px rgba(184, 184, 184, 0.75);
     -moz-box-shadow:0px 0px 10px 2px rgba(184, 184, 184, 0.75);
          box-shadow:0px 0px 10px 2px rgba(184, 184, 184, 0.75);
}

.beta-section {
  margin-top: 10px;
  padding-top: 10px;
}

.intro-section {
  padding: 15px;
}

.share {
  font-weight: 300;
  color: #007fbd;
}

.social {
  margin-top: -1%;
  margin-right: 0.5%;
}

.postscript p {
  font-size: small;
}

.main-features ul {
  text-align: left;
}

.main-wrap {
  text-align: center;
}

.responsive-logo {
  display: none;
}

hr {
  margin: 10px;
  border-color: #B0D6EF;
}

.windows-heading {
  margin-top: 20px;
}

.windows-heading h2 {
  color: #2395D4;
  margin: 15px 0;
  font-size: 28px;
}

.social-download {
  margin-top: 3%;
}

.download-button a {
  white-space: nowrap;
}

.second-download-button {
  margin-top: 60px;
}

.second-download-button a { white-space: nowrap; }

p.download {
  font-size: 20px;
  font-weight: 300;
  margin-bottom: 0;
  margin-top: 0;
  margin-left: -8%;
}

p.spacer {
  margin-bottom: 30px;
}

.animation img, .win15header img {
  margin-bottom: 20px;
  margin-top: 50px;
}

img.play-button {
  margin: 0;
}

.gallery {
  color: #2395D4;
  font-size: 20px;
  font-weight: 300;
}

h3.time {
  margin-top: 0;
  padding-top: 0;
}

h4 {
  font-size: 19px;
  font-weight: 300;
}

/* This fixes extra margin on the right that we can't explain ~_~ */
.row {
  margin-right: 0;
}

.row #footer {
  margin-right: -15px;
}

/*Animation*/
.animation {
  margin: 0;
  border-bottom: 2px solid #B0D6EF;
  padding-bottom: 2%;
}

.animation-box {
  border-bottom: 4px solid rgb(41, 123, 190);
  min-height: 290px;
  top: 0;
  z-index: 1;
}

.hide-ladder {
  position: absolute;
  background-color: white;
  min-height: 60%;
  right: -1%;
  top: 0;
  min-width: 11%;
  z-index: 1;
}

img.beta {
  position: absolute;
  right: 2%;
  top: 35%;
  z-index: 1;
} 

.ladder {
  position: absolute;
  right: 3%;
  top: 9%;
  margin-right: 10px;
  -webkit-animation: slide-ladder 1s ease-in 1s forwards;
  -moz-animation: slide-ladder 1s ease-in 1s forwards;
  -o-animation: slide-ladder 1s ease-in 1s forwards;
  -ms-animation: slide-ladder 1s ease-in 1s forwards;
  animation: slide-ladder 1s ease-in 1s forwards;
}

@-webkit-keyframes slide-ladder {
  100% { -webkit-transform: translateY(8em); }
}

@-moz-keyframes slide-ladder {
  100% { -moz-transform: translateY(8em); }
}

@-o-keyframes slide-ladder {
  100% { -o-transform: translateY(8em); }
}

@-ms-keyframes slide-ladder {
  100% { -ms-transform: translateY(8em); }
}

@keyframes slide-ladder {
  100% { transform: translateY(8em); }
}

.base {
  position: absolute;
  margin-left: 9%;
  bottom: 0;
  width: 280px;
  height: 12px;
  background: rgb(41, 123, 190);
}

.buckets {
  position: absolute;
  right: 0;
  bottom: 0;
  margin-right: 8%;
  width: 21px;
  border-width: 13px 5px 0;
  border-style: solid;
  border-color: rgb(41, 123, 190) transparent;
}

.bucket-two {
 margin-right: 12%;
}

.logo-3 {
  position: absolute;
  right: 15%;
  top: 30%;
}

.cloud-big {
  float: left;
  position: absolute;
  left: -75px;
  top: 15%;
  opacity: 0;
  -webkit-animation: clouds-left 6s ease-out 1.5s forwards;
  -moz-animation: clouds-left 3s ease-out 1.5s forwards;
  -o-animation: clouds-left 3s ease-out 1.5s forwards;
  -ms-animation: clouds-left 3s ease-out 1.5s forwards;
  animation: clouds-left 3s ease-out 1.5s forwards;
}

@-webkit-keyframes clouds-left {
  20% { opacity: 1; }
  100%  { opacity: 1;
          -webkit-transform: translateX(8em); }
}

@-moz-keyframes clouds-left {
  20% { opacity: 1; }
  100%  { opacity: 1;
          -moz-transform: translateX(8em); }
}

@-o-keyframes clouds-left {
  20% { opacity: 1; }
  100%  { opacity: 1;
          -o-transform: translateX(8em); }
}

@-ms-keyframes clouds-left {
  20% { opacity: 1; }
  100%  { opacity: 1;
          -ms-transform: translateX(8em); }
}

@keyframes clouds-left {
  20% { opacity: 1; }
  100% { opacity: 1;
          transform: translateX(8em); }
}

.cloud-big img {
  -webkit-animation: rock-bigcloud 6s ease-in-out infinite;
  -moz-animation: rock-bigcloud 6s ease-in-out infinite;
  -o-animation: rock-bigcloud 6s ease-in-out infinite;
  -ms-animation: rock-bigcloud 6s ease-in-out infinite;
  animation: rock-bigcloud 6s ease-in-out infinite;
}

@-webkit-keyframes rock-bigcloud {
  50% { -webkit-transform: translateX(10px); }
}

@-moz-keyframes rock-bigcloud {
  50% { -moz-transform: translateX(10px); }
}

@-o-keyframes rock-bigcloud {
  50% { -o-transform: translateX(10px); }
}

@-ms-keyframes rock-bigcloud {
  50% { -ms-transform: translateX(10px); }
}

@keyframes rock-bigcloud {
  50% { transform: translateX(10px); }
}

.cloud-medium {
  margin-right: 15px;
  float: right;
  position: absolute;
  z-index: 1;
  right: -90px;
  opacity: 0;
  -webkit-animation: clouds-right 6s ease-out 1.9s forwards;
  -moz-animation: clouds-right 3s ease-out 1.9s forwards;
  -o-animation: clouds-right 3s ease-out 1.9s forwards;
  -ms-animation: clouds-right 3s ease-out 1.9s forwards;
  animation: clouds-right 3s ease-out 1.9s forwards;
}

.cloud-small {
  float: right;
  position: absolute;
  z-index: 1;
  right: 3%;
  opacity: 0;
  -webkit-animation: clouds-right 7s ease-out 2s forwards;
  -moz-animation: clouds-right 3s ease-out 2s forwards;
  -o-animation: clouds-right 3s ease-out 2s forwards;
  -ms-animation: clouds-right 3s ease-out 2s forwards;
  animation: clouds-right 3s ease-out 2s forwards;
}

@-webkit-keyframes clouds-right {
  40%,
  100%  { opacity: 1;
          -webkit-transform: translateX(-8em); }
}

@-moz-keyframes clouds-right {
  40%,
  100%  { opacity: 1;
          -moz-transform: translateX(-8em); }
}

@-o-keyframes clouds-right {
  40%,
  100%  { opacity: 1;
          -o-transform: translateX(-8em); }
}

@-ms-keyframes clouds-right {
  40%,
  100%  { opacity: 1;
          -ms-transform: translateX(-8em); }
}

@keyframes clouds-right {
  40%,
  100%  { opacity: 1;
          transform: translateX(-8em); }
}

.cloud-small img {
  -webkit-animation: rock-cloud 6s ease-in-out infinite;
  -moz-animation: rock-cloud 6s ease-in-out infinite;
  -o-animation: rock-cloud 6s ease-in-out infinite;
  -ms-animation: rock-cloud 6s ease-in-out infinite;
  animation: rock-cloud 6s ease-in-out infinite;
}

@-webkit-keyframes rock-cloud {
  50%  { -webkit-transform: translateX(-10px); }
}

@-moz-keyframes rock-cloud {
  50%  { -moz-transform: translateX(-10px); }
}

@-o-keyframes rock-cloud {
  50%  { -o-transform: translateX(-10px); }
}

@-ms-keyframes rock-cloud {
  50%  { -ms-transform: translateX(-10px); }
}

@keyframes rock-cloud {
  50%  { transform: translateX(-10px); }
}

.cloud-medium img {
-webkit-animation: rock-mid-cloud 6s ease-in-out infinite;
   -moz-animation: rock-mid-cloud 6s ease-in-out infinite;
    -ms-animation: rock-mid-cloud 6s ease-in-out infinite;
     -o-animation: rock-mid-cloud 6s ease-in-out infinite;
        animation: rock-mid-cloud 6s ease-in-out infinite;
}


@-webkit-keyframes rock-mid-cloud {
  50% { -webkit-transform: translateX(-5px); }
}

@-moz-keyframes rock-mid-cloud {
  50% { -moz-transform: translateX(-5px); }
}

@-o-keyframes rock-mid-cloud {
  50% { -o-transform: translateX(-5px); }
}

@-ms-keyframes rock-mid-cloud {
  50% { -ms-transform: translateX(-5px); }
}

@keyframes rock-mid-cloud {
  50% { transform: translateX(-5px); }
}

.library {
  position: absolute;
  padding-left: 9%;
  margin-left: 55px;
  top: -377px;
  -webkit-animation: slide-library 4s ease-out .5s forwards;
  -moz-animation: slide-library 4s ease-out .5s forwards;
  -o-animation: slide-library 4s ease-out .5s forwards;
  -ms-animation: slide-library 4s ease-out .5s forwards;
  animation: slide-library 4s ease-out .5s forwards;
}

.library img {
  float: left;
}

@-webkit-keyframes slide-library {
  100% { -webkit-transform: translateY(23em); }
}

@-moz-keyframes slide-library {
  100% { -moz-transform: translateY(23em); }
}

@-o-keyframes slide-library {
  100% { -o-transform: translateY(23em); }
}

@-ms-keyframes slide-library {
  100% { -ms-transform: translateY(23em); }
}

@keyframes slide-library {
  100% { transform: translateY(23em); }
}

.crane-right {
  float: right;
  margin-right: 26%;
}

.crane-right img {
  margin-top: 0;
  margin-right: 26%;
  z-index: 1;
  -webkit-animation: rock-crane 3s ease-in-out 0s infinite;
  -moz-animation: rock-crane 3s ease-in-out 0s infinite;
  -ms-animation: rock-crane 3s ease-in-out 0s infinite;
  -o-animation: rock-crane 3s ease-in-out 0s infinite;
  animation: rock-crane 3s ease-in-out 0s infinite;
  -webkit-transform-origin: 50% 0;
     -moz-transform-origin: 50% 0;
      -ms-transform-origin: 50% 0;
       -o-transform-origin: 50% 0;
          transform-origin: 50% 0;
}

@-webkit-keyframes rock-crane {
  50% { -webkit-transform: rotate(-6deg) }
}

@-moz-keyframes rock-crane {
  50% { -moz-transform: rotate(-6deg) }
}

@-o-keyframes rock-crane {
  50% { -o-transform: rotate(-6deg) }
}

@-ms-keyframes rock-crane {
  50% { -ms-transform: rotate(-6deg) }
}

@keyframes crane {
  50% { transform: rotate(-6deg) }
}

/*Shared with Papers for Windows windows.ejs*/
.section-one {
  margin-top: 0;
}

.middle-section, .final-section {
  /*linear-gradient*/
  background:-webkit-gradient(linear,left bottom,left top,color-stop(rgba(234, 234, 234, 0.65),0.09),color-stop(rgba(234, 234, 234, 0.63),0.12),color-stop(rgba(234, 234, 234, 0.59),0.18),color-stop(rgba(234, 234, 234, 0),1));
  background:-webkit-linear-gradient(bottom,     rgba(234, 234, 234, 0.65) 9%,    rgba(234, 234, 234, 0.63) 12%,    rgba(234, 234, 234, 0.59) 18%,    rgba(234, 234, 234, 0) 100%);
  background:   -moz-linear-gradient(bottom,     rgba(234, 234, 234, 0.65) 9%,    rgba(234, 234, 234, 0.63) 12%,    rgba(234, 234, 234, 0.59) 18%,    rgba(234, 234, 234, 0) 100%);
  background:     -o-linear-gradient(bottom,     rgba(234, 234, 234, 0.65) 9%,    rgba(234, 234, 234, 0.63) 12%,    rgba(234, 234, 234, 0.59) 18%,    rgba(234, 234, 234, 0) 100%);
  background:        linear-gradient(bottom,     rgba(234, 234, 234, 0.65) 9%,    rgba(234, 234, 234, 0.63) 12%,    rgba(234, 234, 234, 0.59) 18%,    rgba(234, 234, 234, 0) 100%);
}

.final-section {
  margin-bottom: 0;
}

.next-to-last {
  /*linear-gradient*/
  background:-webkit-gradient(linear,left bottom,left top,color-stop(rgba(234, 234, 234, 0.65),0.09),color-stop(rgba(234, 234, 234, 0.63),0.12),color-stop(rgba(234, 234, 234, 0.59),0.18),color-stop(rgba(234, 234, 234, 0),1));
  background:-webkit-linear-gradient(bottom,   rgba(234, 234, 234, 0.65) 9%,  rgba(234, 234, 234, 0.63) 12%,  rgba(234, 234, 234, 0.59) 18%,  rgba(234, 234, 234, 0) 100%);
  background:   -moz-linear-gradient(bottom,   rgba(234, 234, 234, 0.65) 9%,  rgba(234, 234, 234, 0.63) 12%,  rgba(234, 234, 234, 0.59) 18%,  rgba(234, 234, 234, 0) 100%);
  background:     -o-linear-gradient(bottom,   rgba(234, 234, 234, 0.65) 9%,  rgba(234, 234, 234, 0.63) 12%,  rgba(234, 234, 234, 0.59) 18%,  rgba(234, 234, 234, 0) 100%);
  background:        linear-gradient(bottom,   rgba(234, 234, 234, 0.65) 9%,  rgba(234, 234, 234, 0.63) 12%,  rgba(234, 234, 234, 0.59) 18%,  rgba(234, 234, 234, 0) 100%);
}

img.mini-screenshot {
  margin: 30px 0 10px 0;
}

.papers3-license-info {
  padding: 18px;
  border-top: 1px solid #2395D4;
  border-bottom: 1px solid #2395D4;
}

p.beta-intro {
  font-size: 16px;
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 0;
  text-align: left;
  margin-left: -2%;
}

.beta-intro a {
  text-decoration: none;
}

p.windows-text {
  font-size: 16px;
  font-weight: 300;
  padding: 10px;
}

.play img {
  margin-top: 5px;
  margin-bottom: 5px;
}

.buttons {
  margin-top: 3%;
}

.buttons a {
  font-size: 18px;
  font-weight: 200;
}

.last {
  margin-bottom: 2%;
}

img.screenshot {
  margin-bottom: 4%;
  border: 1px solid #b4b3b5;
}

img.write-cite {
  height: 295px;
  width: 326px;
}

img.read {
  height: 170px;
  width: 326px;
}

img.import {
  height: 237px;
}

/*Media queries*/
@media (max-width: 991px) {
  .social {
    display: none;
  }

  .beta-section {
    text-align: center;
  }

  .second-download-button {
    margin-top: 50px;
  }

  .play img {
    display: none;
  }

  .beta-link {
    margin-left: 0;
  }

  img.screenshot {
    margin-bottom: 0;
  }

  a.win-button {
    display: none;
  }

  a.win-download {
    float: none !important;
    border-radius: 5px !important;
  }

  p.margin-spacer, .all-new p, .license-note p {
    padding: 0;
  }
}


@media (min-width: 745px) {
  ul.xs-list-group {
    border: none;
    padding: 10px 0 0 0;
  }

  ul.xs-list-group li {
    display: list-item;
    border: none;
    margin: 0;
    padding: 0;
  }
}

@media (min-width: 991px) and (max-width: 1056px) {
  .library {
    margin-left: 3%;
  }

  .base {
    margin-left: 6%;
  }
}

@media (max-width: 745px) and (min-width: 711px) {
  .library {
    margin-left: 1%;
  }

  .base {
    margin-left: 5%;
  }
}

@media (max-width: 733px) {
  img.medium-screenshot {
    width: 100%;
  }
}

@media (max-width: 711px) {
  .row {
    padding-left: 15px;
  }

  .row #footer {
    margin-right: -15px;
    margin-left: -15px;
  }

  .library, .hide-ladder, .crane-right, .cloud-big, .cloud-small, .cloud-medium, img.beta, .ladder, .buckets, .base, .logo-3 {
    display: none;
  }

  .animation-box {
    border-bottom: 0;
  }

  img.responsive-logo {
    display: inline;
    margin-top: 18%;
  }

  .animation-box {
    min-height: 0;
  }
}

@media (max-width: 567px) {
  /* Reset the margin and padding */
  h2, p, .windows-heading h2, .windows-heading, .middle-section,
  .bottom-spacer, .next-to-last, p.spacer, p.download,
  p.mini-note, .middle-section h3, .middle-section h4, .bottom-spacer h3, .bottom-spacer h4,
  h3.time, .mini-screenshot, .intro-section, .intro, .row #footer {
    margin: 0;
    padding: 0;
  }

  /* Reapply broad, consistent styling */
  p {
    margin: 10px 0 !important;
  }

  .mini-screenshot {
    margin: 30px auto 40px auto !important;
  }

  .medium-screenshot {
    margin: 20px auto 10px auto !important;
  }

  h2 {
    text-align: center;
  }

  h2, h3, h4 {
    margin-top: 10px;
  }

  .row #footer {
    margin-bottom: 20px;
  }

  .windows-heading h2 {
    font-size: 100%;
    color: rgb(41, 123, 190);
    font-weight: 400;
  }

  .second-download-button {
    margin: 10px 0 30px 0;
    padding: 0;
    text-align: center;
  }

  .main-features ul {
    padding: 0;
  }

  .responsive-logo {
    width: 100%;
  }

  img.mini-screenshot {
    margin: 10px auto;
    display: block;
  }

  .main-wrap {
    text-align: left;
  }

  .mini-screenshot {
    margin: 20px 0;
  }

  ul li {
    text-align: left;
  }

  ul.list-group {
    margin-bottom: 0;
  }

  p, li, .main-features, .main-features li {
    font-size: 100%;
    line-height: 22px;
  }

  .download-button {
    text-align: center;
    margin-bottom: 10px;
  }
}

/* Older IE support */
.no-cssanimations .library {
  margin-left: 12%;
  top: -55px;
}

.no-cssanimations .ladder {
  margin-right: 2%;
  top: 49%;
}

.no-cssanimations .crane-right {
  display: none;
}

/*New Windows 3 page*/
#header-box {
  min-height: 300px;
}

.new-ways {
  width: 100%;
  text-align: center;
}

.all-new-section h1 {
  text-align: center;
  color: #00B7FF;
}

a.win-button {
  background-color: #004485;
  border-radius: 0 5px 5px 0;
  color: white;
}

a.win-button:hover {
  color: white;
  background-color: #323F57;
}

.all-new h3 {
  margin-top: 0;
}

.all-new {
  border: 0;
}

.all-new p {
  padding: 10px 0;
}

.first-download-text {
  float: left;
}

.first-download {
  float: right;
  margin-right: 50px;
  margin-top: 10px;
}

.license-note {
  margin: 20px 0 20px 0;
  color: black;
}

.license-note p {
  font-size: 14px;
}

.button-row {
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 0;
  text-align: center;
}

.button-row .margin-spacer {
  text-align: justify;
}

.license-note-padding {
  padding-left: 0;
}

.button-row a {
  font-weight: 300;
}

.margin-spacer {
  margin-top: 20px;
}

.bigcloud-opaque {
  position: absolute;
  right: 250px;
  top: 50px;
  -webkit-animation: rock-cloud 6s ease-in-out infinite;
  -moz-animation: rock-cloud 6s ease-in-out infinite;
  -o-animation: rock-cloud 6s ease-in-out infinite;
  -ms-animation: rock-cloud 6s ease-in-out infinite;
  animation: rock-cloud 6s ease-in-out infinite;
}

.win-library {
  position: absolute;
  right: 200px;
  top: 100px;
  -webkit-animation: rock-library 6s ease-in-out infinite;
  -moz-animation: rock-library 6s ease-in-out infinite;
  -o-animation: rock-library 6s ease-in-out infinite;
  -ms-animation: rock-library 6s ease-in-out infinite;
  animation: rock-library 6s ease-in-out infinite;
}


@-webkit-keyframes rock-library {
  50%  { -webkit-transform: translateY(-3px); }
}

@-moz-keyframes rock-library {
  50%  { -moz-transform: translateY(-3px); }
}

@-o-keyframes rock-library {
  50%  { -o-transform: translateY(-3px); }
}

@-ms-keyframes rock-library {
  50%  { -ms-transform: translateY(-3px); }
}

@keyframes rock-library {
  50%  { transform: translateY(-3px); }
}

.midcloud-opaque {
  position: absolute;
  right: 50px;
  top: 180px;
  -webkit-animation: rock-cloud 4s ease-in-out infinite;
  -moz-animation: rock-cloud 4s ease-in-out infinite;
  -o-animation: rock-cloud 4s ease-in-out infinite;
  -ms-animation: rock-cloud 4s ease-in-out infinite;
  animation: rock-cloud 4s ease-in-out infinite;
}

.smallcloud-opaque {
  position: absolute;
  right: 400px;
  top: 250px;
  -webkit-animation: rock-bigcloud 6s ease-in-out infinite;
  -moz-animation: rock-bigcloud 6s ease-in-out infinite;
  -o-animation: rock-bigcloud 6s ease-in-out infinite;
  -ms-animation: rock-bigcloud 6s ease-in-out infinite;
  animation: rock-bigcloud 6s ease-in-out infinite;
}

.three-badge img {
  position: absolute;
  right: 10px;
  top: 10px;
}

.new-badge {
  position: absolute;
  right: 150px;
  top: 50px;
}

.three-logo {
  position: absolute;
  top: 90px;
  left: 20px;
}

a.win-download {
  margin-right: -4px;
  border-radius: 5px 0 0 5px;
}

@media (max-width: 691px) {
  .first-download a {
    margin-left: 10px;
  }
  .first-download {
    margin-right: 0;
    float: none;
    margin-top: 0;
  }
}

@media (max-width: 733px) {
  .win-library {
    display: none;
  }
  .smallcloud-opaque, .midcloud-opaque, .bigcloud-opaque {
    display: none;
  }

  .new-badge {
    display: none;
  }

  .three-badge {
    display: none;
  }

  #header-box {
    min-height: 265px;
  }

}

@media (max-width: 991px) and (min-width: 568px) {
  .button-spacer {
    margin-top: 10px;
  }
}

