@import url(http://weloveiconfonts.com/api/?family=fontawesome);
*{
  margin:0;
  padding:0;
}
body{
  height:100%;
  width:100%;
}
header .text{
  position: absolute;
  top: 40px;
  padding:0 45px;
}
header .text p{
/*  font-family: "Theano Didot";
*/  font-weight: normal;
  font-style: normal;
  font-size: 50px;
/*  color: #453434;
*/}
header .bottom{
  background-size: cover;
  text-align: center;
  height: 55px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
header .bottom span{
  cursor: pointer;
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
  font-size:17px;
  line-height: 3.5;
  color: #f7f7f7;
}

.fa {
  display: block;
  text-align: left;
  color: white;
  font: 100 18px 'FontAwesome';
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}
.fa-angle-double-down:before {content: "\f103";}

.bounce {
  vertical-align: middle;
  display: inline-block;
  width: 13px;
  height: 20px;
  margin-left: 0;
  animation: bounce 2s infinite;
  -webkit-animation: bounce 3s infinite;
  -moz-animation: bounce 2s infinite;
  -o-animation: bounce 2s infinite;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}
  40% {-webkit-transform: translateY(-20px);}
  60% {-webkit-transform: translateY(-5px);}
}

@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
  40% {-moz-transform: translateY(-20px);}
  60% {-moz-transform: translateY(-5px);}
}

@-o-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
  40% {-o-transform: translateY(-20px);}
  60% {-o-transform: translateY(-5px);}
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
  40% {transform: translateY(-20px);}
  60% {transform: translateY(-5px);}
}

.container{
  margin: 0 auto;
  margin-top: 10px;
  max-width: 980px;
}
.container .block{
  height:600px;
  background-color: #a0a0a0;
}
.container .nav{
  position: relative;
  height: 57px;
/*  border-bottom: 1px solid #d2cfcf;*/
}
.container .nav ul {
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
  font-size:13px;
/*  line-height: 4.5;
*/  list-style: none;
    padding-top: 7px;
/*  color: #453434;
*/}
/*.container .nav a { color: #453434; }
*/.container .nav ul li{
  display: inline-block;
}
/*.container .nav ul li:nth-child(1){
  margin-right: 70px;
}
.container .nav ul li:nth-child(2){
  margin-right: 90px;
}
.container .nav ul li p{
  cursor: pointer;
}
*/
.container .content .header{
  padding: 30px 0 0;
  min-height: 115px;
  text-align: center;
}
.container .content .header p.datum {
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
/*  font-size:12px;
*//*  color: #ababab;
*/}
.container .content .header p.heading {
/*  font-family: "Theano Didot";
*/  font-weight: normal;
  /*font-size: 40px;*/
/*  color: #453434;
*/  margin: 15px 0;
}
.container .content .header p.category {
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
/*  font-size:12px;
*/  /*color: #ababab;*/
}
.container .content .header p.category a {   /*color: #ababab;*/ text-transform: uppercase; }
/*.container .content .body img{
  height: 1300px;
  width: 100%;
}

*/
.container .content .body {
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
/*  font-size:16px;
*//*  color: #453434;
*/  text-align: center;
}

/*.container .content .body .social{
  border-bottom: 1px solid #d2cfcf;
}*/
.container .content .body .social .content{
  position: relative;
  width: 835px;
  margin:0 auto;
  height: 110px;
}
.container .content .body .social .left{
  position: absolute;
  left:0;
  bottom:20px;
}
.container .content .body .social .left span, .container .content .body .social .left p{
  cursor: pointer;
}

.container .content .body .social .left p{
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
  font-size:10px;
/*  color: #453434;
*/}
.container .content .body .social .right{
  position: absolute;
  right:0;
  bottom:20px;
  height: 60px;
}
.container .content .body .social .right span, .container .content .body .social .right p{
  cursor: pointer;
}

.container .content .body .social .right p{
/*  font-family: "Lato";
  font-weight: 300;*/
  font-style: normal;
  font-size:10px;
/*  color: #453434;
*/}
.container .content .body .social .right p:nth-child(3){
  position: absolute;
  left: 3px;
}
.container .content .body .social .right p:nth-child(4){
  position: absolute;
  right:5px;
}
.container .content .ad{
  padding: 20px 145px 0 105px;
}
.container .content .ad .content{
  height:100%;
  width:100%;
  background-color: #453434;
}



@media screen and (max-width: 768px) {
  header .text{
    top: 20px;
    padding:0 12px;
  }
  header .text p{
    font-size: 25px;
  }
  header .bottom{
    background: url("../img/Rektangel_1.png") no-repeat center;
  }
  .container{
    margin: 0 auto;
    max-width: 335px;
  }
/*  .container .nav{
    text-align: center;
  }
  .container .nav ul li:nth-child(1){
    margin:0;
    position: absolute;
    left:0;
  }
  .container .nav ul li:nth-child(2){
    margin:0;
  }
  .container .nav ul li:nth-child(3){
    margin:0;
    position: absolute;
    right:0;
  }*/
  .container .block{
    display: none;
  }
  /*.container .content .item:nth-child(2){
    display: none;
  }*/
  .container .content .header {
    padding: 22px 0 0;
    min-height: 70px;
  }
  .container .content .header p.datum{
    font-size:11px;
  }
  .container .content .header p.heading {
    font-size:25px;
    margin:5px 0;
  }
/*  .container .content .body img{
    height: 445px;
    width: 100%;
  }*/
  .container .content .body .desc {
    line-height: 22px;
    height: 200px;
    padding: 20px 0 20px 0;
  }
  .container .content .body .social{
    max-width: 335px;
  }
  .container .content .ad{
    display: none;
  }
}
@media screen and (max-width: 768px) and (orientation: portrait){
  .container .content .body .social{
    max-width:100%
  }
  .container .content .body .social .content{
    max-width:95%
  }
}