@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700&subset=latin,latin-ext);

body  
	{background: #ffffff; 
	 text-align: center; 
	 font-size: 1em; 
	 font-family: 'Lato', sans-serif;
	 font-weight: 300;
	 margin: 0px; 
	 padding: 0px; 
	 font-size: 1em; 
	 text-align: left;
	 min-width:1024px;
	 background: url('images/bg-tresc.jpg');
background-position: left top 350px;
background-repeat: no-repeat;
      overflow-x: hidden;
	}

div.top {
width: 1024px;
margin: 0 auto;
position: relative;
  background-color: #484645;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

img {
max-width:100%;
}


#czyt {
font-size: 18px;
color:red;
float: right;
text-decoration: underline;
}

#poznaj {

color: #890000;
float: right;
text-decoration: underline;
}

a {
text-decoration: none;
}


/*------------NAG??WEK------------*/
	
#naglowek{
width:100%;
}

.stopka {
text-align: center;
}
	
#naglowek:after {
content: '';
display: block;
clear: both;
}

#div-logo {
position:fixed;
z-index:21;
}

#belka {
position:fixed;
width:100%;
background: url('images/bg-belka.jpg');
background-position: center;
z-index:11;
}

#belka span {
color:#9A0000;
}

#belka p {
margin-left: 220px;
color:white;
font-size: 24px;
font-weight: 700;
}

/*------------BANER------------*/

#baner {
width:100%;
}

#zdjecie img {
position: absolute;
top: 50px;
left: 250px;
width: 430px;
z-index: 2;
}

#haslo-glowne {
width: 700px;
position: relative;
z-index: 6;
  padding: 20px;
}

#baner h1 {
color: white;
font-size: 50px;
text-shadow: 0px 0px 9px rgba(0, 0, 0, 1);
}



/*------------DOKTOR------------*/

#doktor p {
  text-align: left;
  width: 620px;
  color: white;
  top: 255px;
  left: 5px;
  position: absolute;
  font-style: italic;
}

#doktor {
margin-top: -351px;
width: 100%;
height: 380px;
background: url('images/bg-baner-after.png');
background-position: center;
}

/*------------TRE??------------*/

#tresc {
width:100%;
float: left;

}

#lewo {
width:700px;
float:left;
margin-top:0px;
}

#prawo {
width:300px;
float:left;
margin-left:24px;
background: #1a1615;
border-radius: 10px;
}

#prawo2 {
width:300px;
float:left;
margin-top:15px;
margin-left:24px;
background: #1a1615;
border-radius: 10px;
}

h1 {
color: #890000;
margin: 0px;
}

h2 {
color: #890000;
}

/*------------OPINIE------------*/

.dane {
background: rgb(223, 223, 223);
}

.naglowek-opini {
  color: white;
  text-align: center;
  padding: 10px;
  font-size: 20px;
  font-weight: 600;
}

.opinia {
margin-bottom: 20px;
float: left;
}

.opinia p {
color: #3B0000;
float: left;
background: white;
padding: 5px;
margin-top: 0px;
margin-bottom:0px;
}

.kontener {
padding:10px;
float: left;
}

.kolor {
background: #890000;
width: 100%;
float: left;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

.imie, .avatar {
float:left;
}

.avatar img {
border-radius: 100%;
}

.imie {
width: 170px;
}

.avatar {
width: 100px;
padding-top: 10px;
padding-right: 10px;
}

h3 {
color: #890000;
font-size: 28px;
text-align: center;
padding-top: 13px;
}

h4 {
font-size: 20px;
color: #890000;
text-align: center;
padding-top: 13px;

}

.dane {
float: left;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background: #e2e2e2; /* Old browsers */
background: -moz-linear-gradient(top,  #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */

}

.dane:after {
content: '';
display: block;
clear: both;
width:100%;
height:20px;
background: url('images/bg-opinia-arrow.png');
}

.myButton {
	-moz-box-shadow: 0px 1px 0px 0px #f0c9c9;
	-webkit-box-shadow: 0px 1px 0px 0px #f0c9c9;
	box-shadow: 0px 1px 0px 0px #f0c9c9;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #980000), color-stop(1, #610909));
	background:-moz-linear-gradient(top, #980000 5%, #610909 100%);
	background:-webkit-linear-gradient(top, #980000 5%, #610909 100%);
	background:-o-linear-gradient(top, #980000 5%, #610909 100%);
	background:-ms-linear-gradient(top, #980000 5%, #610909 100%);
	background:linear-gradient(to bottom, #980000 5%, #610909 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#980000', endColorstr='#610909',GradientType=0);
	background-color:#980000;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #2e0707;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:9px 10px;
	text-decoration:none;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #610909), color-stop(1, #980000));
	background:-moz-linear-gradient(top, #610909 5%, #980000 100%);
	background:-webkit-linear-gradient(top, #610909 5%, #980000 100%);
	background:-o-linear-gradient(top, #610909 5%, #980000 100%);
	background:-ms-linear-gradient(top, #610909 5%, #980000 100%);
	background:linear-gradient(to bottom, #610909 5%, #980000 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#610909', endColorstr='#980000',GradientType=0);
	background-color:#610909;
}
.myButton:active {
	position:relative;
	top:1px;
}


.center {
text-align: center;
padding-top: 15px;
padding-bottom:20px;
}

/*------------RANKING------------*/

#ranking {
padding-top: 20px;
}

.pozycja {
float: left;
margin-bottom:30px;
}

.top-pozycja {
background: #e2e2e2; /* Old browsers */
background: -moz-linear-gradient(top,  #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */

border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

.numer {
width: 139px;
height: 85px;
float: left;
background: #e0e0e0; /* Old browsers */
background: -moz-linear-gradient(top,  #e0e0e0 0%, #8c8c8c 50%, #686261 51%, #1e1205 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0e0e0), color-stop(50%,#8c8c8c), color-stop(51%,#686261), color-stop(100%,#1e1205)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e0e0e0 0%,#8c8c8c 50%,#686261 51%,#1e1205 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e0e0e0 0%,#8c8c8c 50%,#686261 51%,#1e1205 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e0e0e0 0%,#8c8c8c 50%,#686261 51%,#1e1205 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e0e0e0 0%,#8c8c8c 50%,#686261 51%,#1e1205 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#1e1205',GradientType=0 ); /* IE6-9 */

border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

.numer p {
color: white;
font-weight: 700;
font-size: 56px;
margin-top: 6px;
text-align: center;
}

.nazwa-produktu {
float:left;
}

.nazwa-produktu p {
font-weight: 700;
font-size: 32px;
margin-bottom: 0px;
margin-top: 20px;
margin-left: 15px;
color: #890000;
}

.top-pozycja, .tresc-pozycja {
position: relative;
float: left;
width: 100%;
}

.tresc-pozycja {
background: #494847; /* Old browsers */
background: -moz-linear-gradient(top,  #494847 0%, #1e1205 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#494847), color-stop(100%,#1e1205)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #494847 0%,#1e1205 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #494847 0%,#1e1205 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #494847 0%,#1e1205 100%); /* IE10+ */
background: linear-gradient(to bottom,  #494847 0%,#1e1205 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#494847', endColorstr='#1e1205',GradientType=0 ); /* IE6-9 */


border: 4px solid #494847;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
width: 692px;
}

.lewo-kontener {
width:232px;
float:left;
}

.prawo-kontener {
width:430px;
margin-left:10px;
float:left;
}

.zdjecie-produkt {
padding: 15px;
background: rgb(255, 255, 255);
border: 4px solid #890000;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

.prawo-kontener h3 {
margin-top: 5px;
margin-bottom: 0px;
}

.prawo-kontener h3:after {
content: '';
display: block;
clear: both;
width:100%;
height:20px;
background: url('images/bg-nazwa-after.png');
margin-top: 10px;
margin-bottom: -1px;
}

.prawo-main {
float:left;
}

.prawo-kontener p {
color: #3B0000;
background: white;
padding: 5px;
margin-top: 0px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

.kontener p {
color: #3B0000;
background: white;
padding: 5px;
margin-top: 0px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
float: left;
}

.nazwa-produktu img {
position: absolute;
z-index: 1;
top: -10px;
right: -10px;
}

.center h1 {
font-size: 48px;
margin-top:-15px;
margin-bottom:5px;
}

.center h4 {
margin-top: 5px;
font-size: 24px;
color: rgb(26, 97, 123);
}

.werdykt {
float: left;
  margin-bottom: 15px;
  width: 430px;
  background: white;
  /* padding: 5px; */
  margin-top: 0px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
	padding-left: 5px;
}

.werdykt .gwiazdki {
text-align: right;
width: 4205: white;
border-radius: 10px;
padding-bottom: 10px;
color: #3B0000;
}

.werdykt .gwiazdki span {
padding: 10px 10px 0 0;
display: block;
font-weight: 700;
}

.gwiazdka_noactiv {
background: url(images/gwiazdki.png) no-repeat 0px 0px;
width: 17px;
height: 15px;
margin: 2px 0px 0 5px;
}

.gwiazdka_activ {
background: url(images/gwiazdki.png) no-repeat 0px -15px;
width: 17px;
height: 15px;
margin: 2px 0px 0 5px;
}

.prawy {
float: right;
}

.lewy {
float: left;
}

.prawo-kontener h3 {
color:white;
}

footer {
width:100%;
background:#e5e5e5;
margin-top: 30px;
float:left;
color: #2d2d2d;
padding: 20px;
}
footer .top {
	background-color: transparent;
}


.page-404 #naglowek {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-beetwen;
}
.page-404 .page-404__text {
    margin: 20px 0;
    padding: 0 15px;
    font-size: 40px;
    text-align: center;
}
.page-404 .page-404__text p {
    text-align: center;
}
.page-404 .page-404__text a {
    margin-top: 40px;
    font-size: 20px;
    text-decoration: underline;
}