@charset "UTF-8";
/* =CALL LIBRARY */
	@import url("reset-mini.css"); /* ------- Reset all CSS Styles */

/* =GENERAL - the general styles */
  * {font-family: verdana, arial, sans-serif}
	body{	font-size: 62.5% }
  html{ background-image: url(../i/bg-pattern4.gif); background-position: center 7px}
	body,html {font-size: 11px; line-height:1.1em; font-family: verdana,arial,sans-serif; color:#333; margin:0}

	a{ text-decoration: none; color: #48bdff}
	a:hover{text-decoration: none; color: #289ddf}
	a:active{text-decoration: none; color: #666}  

  pre {font-family: courier; text-align: left}  

	h1 {font-size: 2em; line-height: 1.9em; font-weight:bold; margin-top:5px; color: #005588}

	h2 {font-size: 2em; line-height: 1.9em; font-weight:bold; margin-top:10px; color: #4abdff}
  h2.linked a,
  h2.linked a{
    line-height: 1.8em;
    padding-left: 5px;
  }
  h1.linked a::after,
  h2.linked a::after{
    content: "»";
    font-size: 1.4em;
    line-height: 1em;
    font-weight: bold;
    color: #FFB704;
    position: relative;
    top: 2px;
  }
  h1.linked a:hover::after,
  h2.linked a:hover::after{
    color: #F39E4B;
  }
  
	h3 {font-size: 1.2em; line-height: 1.2em; font-weight:bold; padding: 2px 0}
  h3.linked a{
    line-height: 1.5em; 
    padding-left: 5px;    
  }
  h3.linked a::after{
    content: "»";
    font-size: 1.4em;
    line-height: 0.7em;
    font-weight: bold;
    color: #FFB704;
    position: relative;
    top: 1px;
  }
  h3.linked a:hover::after{
    color: #F39E4B;
  }

	h4 {font-size: 1.1em; line-height: 1.1em; font-weight:bold; padding: 2px 0}
  h4.linked a{
    line-height: 1.4em;
  }
  h4.linked a::after{
    content: "»";
    font-size: 1.4em;
    line-height: 0.7em;
    font-weight: bold;
    color: #FFB704;
    position: relative;
    top: 1px;
  }
  h4.linked a:hover::after{
    color: #F39E4B;
  }
  
  
  .contentBox .separatedHeader, 
  .details .separatedHeader{margin: 0 0 5px 0; padding:2px 0 3px 0; color: #4abdff; font-size: 17px; line-height: 1.2em; font-weight: bold; border-bottom: 2px solid #999}
  
	p {line-height:1.15em; text-align:justify}

	strong{font-weight: bold}

  mark {background-color: transparent; font-weight: bold}
  
  input{padding:0 3px}
  input.text, input[type="text"], input[type="password"] {width:10em; height: 1.4em}
  input.text, input[type="text"], input[type="password"], input.button, select, textarea, input.file{border: 1px solid #bcbcbc; text-align:left; font-size:1em}
  select option{text-align:left; padding:0 3px}
  input.button{background-color:#ddf3fe; position:relative; border: 0; color: #46bdff; padding: 0.1em 1em; font-weight:bold; border: 1px solid #bcbcbc}
  input.button:hover{ background-color:#bdf3fe}

  /* IE fix */
  input, select {font-size:1em}

  input.checkbox{padding:0}

  span.button a, a.button{background-color:#ddf3fe; position:relative; border: 0; color: #46bdff; padding: 0.1em 1em; font-weight:bold; border: 1px solid #bcbcbc}
  span.button a:hover, a.button:hover{ background-color:#bdf3fe}

  dl form, div.form form {text-align: center; margin: 10px}
  dl form dt, div.form form dt {float:left; width: 22%; text-align: right; margin: 2px 2% 2px 0; clear: left}
  dl form dd, div.form form dd {float:left; width: 75%; text-align: left; margin: 2px 0}

  ul {list-style-type:none}
  ul li{text-align:left; margin-left:0}

  fieldset {padding:10px; background-color:#dff7df}
  fieldset legend{font-weight:bold}

  label.large {
    font-family: arial, sans-serif;
    font-size: 1.4em;
    font-weight: bold;
    position: relative;
    top: 1px;
    letter-spacing: -1px;
  }

  ul.err, ul.ok {margin: 0 10px}
  ul.err li, ul.ok li{text-align: center; font-size:1.3em; line-height:1.3em; font-weight:bold; margin: 2px}
  ul.err {border: 2px solid red; color:red}
  ul.ok {border: 2px solid green; color:green}
  span.ok {font-weight:bold; color: green}
  .form_error {color:red}
  .errors{color: red}

  .clear{clear:both}

  .hide, .showJS{display:none}

  .clearfix:after {
       visibility: hidden;
       display: block;
       font-size: 0;
       content: " ";
       clear: both;
       height: 0;
       }
  .clearfix { display: inline-block; }
  /* start commented backslash hack \*/
  * html .clearfix { height: 1%; }
  .clearfix { display: block; }
  /* close commented backslash hack */

  /**
    Helper class for any text elements replaced by images
  */
  .imgReplacement { position:relative; display: block; overflow: hidden}
  .imgReplacement span{background-position: left top; background-repeat: no-repeat; display: block; position: absolute; top:0; left:0; width:100%; height: 100%}

  .link { 
    position:relative; 
    display: block; 
    font-weight: bold;
    font-size: 1.1em; 
   }
   
  .link::after{
    content: "»";
    font-weight: bold;
    color: #FFB704;
  }
  .link:hover::after{
    color: #F39E4B;
  }  
  
/**
  JS tooltip styles
*/
#tooltip {
	position: absolute;
	z-index: 3000;
	border: 1px solid #888;
	background-color: #eee;
	padding: 3px;
	/*opacity: 0.80;*/
}
#tooltip h3, #tooltip div { margin: 0; }


/*
  Layouty
*/

#layout {padding-bottom: 50px}

header.mainHeader { 
  width: 973px; 
  margin:0 auto; 
  padding: 5px 15px 27px 26px; 
  text-align:right;  
  min-height:15px;
} 

header.mainHeader #holder { 
  width:750px; 
  float:right; 
  max-height: 200px;
  overflow: hidden;
}

#main { 
  width:979px; 
  margin: 0 auto 0; 
  background-color: #EDEDED;
  box-shadow: 0 0 17px #aaa;
  border-radius: 10px; 
}

#col {
  width:198px; 
  padding: 80px 5px 5px 13px; 
  float:left; 
  position:relative; 
  top: -10px; 
}
#col .add{
  margin-top: 10px;
  margin-left: 0;
}


#logo {
  width: 200px; 
  position:absolute; 
  top:22px; 
  left: 8px
}
#logo #mainLink{
  display: block;
  position: absolute;
  width: 100%;
  height: 44px;
}
#logo object{
  width: 100%;
  height: 44px;
}
#logo img{
  position: relative;
  top: -5px;
  left: -7px;
}

#content {width:750px; float: left; display: inline; margin-bottom:10px}

/**
 * Phone select box
 */

#selectPhoneSimple {
  margin-left:0px; 
  position: relative; 
  height: 1%
} /* top - needed for IE7, margin-top does not work */
#selectPhoneSimple .inbox{ 
  padding:5px 5px 10px 8px
}

#selectPhoneSimple #phone{
  width: 165px;
  color: #bbb
}

#selectPhoneSimple .phoneName{
  margin-bottom: 8px;
  font-size: 1.1em;
  overflow: hidden;
}

#selectPhoneSimple .phoneName.unfiltered{
  color: #bbb;
}

#selectPhoneSimple .phoneName span {
  float:left;
  text-align: left;
}

#selectPhoneSimple .phoneName .vendor {
  font-weight: bold;
  margin-right: 5px;
}

#selectPhoneSimple .operations{
  display: block;
  clear: left;
}

#selectPhoneSimple #switchPhone,
#selectPhoneSimple .filter
{
  border-left: 1px solid #aaa;
  padding-left: 5px;
}

#selectPhoneSimple .filter.unfiltered{
  font-weight: bold;
}

/**
 * Main menu
 */
#mainMenu {
  width: 755px;
  height:33px; 
  margin:0 0 10px 5px;
}
#mainMenu li {
  float:left; 
  display:inline; 
  min-width:50px; 
  height:33px; 
  margin: 0 3px 0 0;
  background-image: url('../i/bt-menu-h.png'); 
  background-position: top left;
  background-size: 100% 66px;
  background-repeat: no-repeat;
  border-radius: 4px 4px 6px 6px;
  text-align: center;
}

#mainMenu li.disabled {
  background: url('../i/bt-menu-disabled-wide.png') top left no-repeat; 
}

#mainMenu li *{ text-align:center }
#mainMenu li a {
  color:#fff;
  padding: 7px 10px;
}

#mainMenu li.disabled span.disabled{
  padding: 0 10px;
}

#mainMenu li a span,
#mainMenu li span.disabled span{
  font-family: arial, sans-serif; 
  font-weight: bold; 
  font-size: 14px; 
  line-height: 32px;
  font-style:italic;
  text-shadow: 0px 0px 4px #555, 0px 0px 6px #555;
}

#mainMenu li:hover,
#mainMenu li.selected{
  background-position: left -33px;
  border-radius: 0 0 6px 6px;
}

#mainMenu li.disabled:hover{
  background-position: left top;
  border-radius: 4px 4px 6px 6px;
}

#mainMenu li a:hover span,
#mainMenu li.selected a span{
  text-shadow: 0px 0px 2px #555, 0px 0px 3px #555 
}

#mainMenu li span.disabled span{
  color: #eee; 
  text-shadow: 0px 0px 2px #ccc   
}


/**
 * Sub menu styles
 */
 #subMenu{
   padding-bottom: 6px;
 }
#subMenu h2 { position: relative; width:190px; height: 34px; overflow: hidden; margin:0; padding:0}

#subMenu h3 { padding:8px 0 0 10px; margin:0; font-size:1em;}

#subMenu ul{padding: 5px 10px 0}
#subMenu ul li{padding: 0 }

#subMenu ul li{width:90%; height: 100%; border-top: 1px solid #e7e7e7; padding-left:17px; background: url('../i/icon_list_dot.gif') 5px 7px  no-repeat}
#subMenu ul li:hover {background-color: #eeeeee}
#subMenu ul li.selected{background: url('../i/icon_list_arrow.gif') 2px 3px  no-repeat}
#subMenu ul li a{display:block; width:100%; height: 100%; color:#000; padding: 3px 0 4px; }
#subMenu ul li.selected a{color: #48bdff; font-weight:bold}

#subMenu ul li a.category-hit-konsol-i-pc {background: url('../i/icon_menu_pc.png') 95px 2px no-repeat}
#subMenu ul li a.category-polecamy {background: url('../i/icon-menu-suggested.png') 65px 2px no-repeat}
#subMenu ul li a.category-android {background: url('../i/icon-menu-android.png') 55px 2px no-repeat}

#subMenu ul li a.cheepest {background: url('../i/icon_menu_price.gif') 50px 3px no-repeat}
#subMenu ul li a.free     {background: url('../i/icon-gry-java-za-darmo.gif') 50px 3px no-repeat}

#subMenu .promo {color: red; font-weight: bold}


/**
 * Main box styles
 */

#content #majorContent {float:left; display:inline; width: 436px}
#content #minorContent {float:right; display:inline; width: 314px}

#searchFormSimple {margin: 0 0 10px 5px; width: 500px}
#searchFormSimple .image{margin:0; padding:0; position:relative; top:5px; left:10px}
#searchFormSimple label,
#searchFormSimple .submit,
#searchFormBox #searchForm .submit{
  font-family: arial, sans-serif;
  font-size: 1.4em;
  font-weight: bold;
  position: relative;
  top: 1px;
  letter-spacing: -1px;
}

#searchFormBox #searchForm .submit,
#searchFormSimple .submit{
  cursor: pointer;
  color: #555;
  border: none;
  padding: 1px 5px;
  border-radius: 8px;
  background: #fdfdfd; /* Old browsers */
  background: -moz-linear-gradient(top,  #fdfdfd 0%, #d8d8d8 100%); /* FF3.6+ */
  background: -webkit-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fdfdfd 0%,#d8d8d8 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
}

#searchFormBox #searchForm .submit:hover,
#searchFormSimple .submit:hover{
  color: #000;
  text-shadow: 0 0 1px #000;
}

footer.mainFooter {
  clear:both; 
  background-color: #fff; 
  padding:20px;
  border-radius: 0 0 10px 10px;
}
footer.mainFooter ul {padding-bottom:25px}
footer.mainFooter ul li{border-left: 1px solid #999; float:left; display:inline; padding: 0 5px}
footer.mainFooter ul li.first{border-left: none; padding-left: 0 }

footer.mainFooter ul#otherServices {float: right}
footer.mainFooter ul#otherServices li {padding: 0 8px 2px 8px; color: #999}
footer.mainFooter ul#otherServices li img{position: relative; top: 1px}
footer.mainFooter ul#otherServices li:first-of-type {border: none}

footer.mainFooter p {clear:both}
footer.mainFooter p#copy {float:right; display:inline}
footer.mainFooter #zaiks {position: relative; top: 3px}

footer.mainFooter ul#otherServices .gryNaFony {
  position: relative
}
footer.mainFooter ul#otherServices .gryNaFony img{
  position: absolute; 
  top: -2px; 
  left: -11px
}

.paginationControl {margin: 0 0 5px; text-align:center; clear:both; padding-top: 5px;}

/*
  Boxes
*/

.plainBox{
  background-color:#fafafa;  
  width:190px; 
  margin:10px 0 0; 
  padding: 0;
  border-radius: 10px;
}
.plainBox h2{ 
  height: 29px; 
  width:100%; 
  margin:0; 
  padding-top:5px; 
  
  background: url(../i/bg_small_box_head.gif) left top no-repeat #fafafa; 
  color:#fff; 
  text-align:center; 
  line-height: 18px;
  
  border-radius: 5px;
}
.plainBox h2 span{
  font-size: 14px;
  font-style:italic; 
  font-family: arial, sans-serif; 
  text-shadow: 0px 0px 5px #555, 0px 0px 5px #555
}
.plainBox h2 a{
  background: none; 
  color: #fff; 
  font-family: arial, sans-serif; 
}
.plainBox h2 a:hover{color: #cff}
.plainBox .inbox{padding:5px 5px 10px}

.polecamyPlainBox{
  padding-bottom: 10px;
  background: #fff;
}

.facebookPlainBox{
  padding-bottom: 10px;
  background: #fff;
}

.facebookPlainBox h2 a,
#subMenu h2 a{
  position: relative;
  top: 4px;  
}

.largeBox {
  width:735px;
  margin: 15px 0;
  padding: 5px 8px 10px;
  clear: both;
  box-shadow: 0 0 7px #aaa;
  border-radius: 10px;
  background-color: #fff;
  overflow: hiden;
}
.largeBox.contentBox{
  width:751px;
  padding: 5px 0;
  overflow: hidden;
}

.halfBox {
  width:368px;
  float: left; 
  margin: 0 0 15px 0;
  padding: 5px 0;
  box-shadow: 0 0 7px #aaa;
  border-radius: 10px;
  background-color: #fff;
}

.secondHalfBox{
  margin-left: 14px;
}
.halfBox {
  overflow:hidden
}

#majorContent .smallMediumBox, 
.mediumBox {
  width:412px; 
  float: left; 
  margin: 10px 10px 0 0;
  padding: 5px 8px 10px;
  box-shadow: 0 0 7px #aaa;
  border-radius: 10px;
  background-color: #fff;
}

#majorContent .smallMediumBox.contentBox, 
.mediumBox.contentBox{
  width:428px; 
  padding: 5px 0;
}

#minorContent .smallMediumBox, 
.smallBox {
  width:304px; 
  float: right;
  margin: 10px 0 0 0;
  padding: 5px 0;
  box-shadow: 0 0 7px #aaa;
  border-radius: 10px;
  background-color: #fff;
}

/*
  Hit list
*/
#topListContainer{position:relative}
#topListContainer #minorContent{
  position: absolute; 
  top:0; 
  right:0
}

#topListBox #lists {float:right; display:inline; margin-top: 12px}
#topListBox h2 {
  float:left; 
  padding:0 20px 0 5px; 
  margin-top: -5px;
}


#topListBox h3 {float:left; padding:8px 0 5px 0}
#topListBox h3 *{line-height:1em}


.archiveListBox{
  overflow: hidden;
}
.archiveListBox h2 {padding:0 20px 4px 0; line-height: 1em}
.archiveListBox .year{float:left; display:inline; margin: 5px 12px}
.archiveListBox .year h3{font-size: 2.0em; line-height: 1em; font-weight:bold}
.archiveListBox .year li{text-align:right}

/*
  Content list
*/

.contentBox {position: relative}
.contentBox .listHead {
  float: left;
  margin-left: 10px;
}
.contentBox .listHead img{
  float: left; 
  margin: 5px 5px 0 0
}
.contentBox .listHead .switchOrder,
.contentBox .listHead .selectedOrder{
  float: left; 
  margin: 5px 5px 0 0; 
  width:80px; 
  height:37px;
  background-image: url('../i/bt-order.png');
  text-align: center;
}
.contentBox .listHead .selectedOrder{
  background-image: url('../i/bt-order-selected.png');
}
.contentBox .listHead a.selectedOrder:hover span{
  color: #cff;
}
.contentBox .listHead .selectedOrder.boxalphabetic{
  width:130px; 
  background-image: url('../i/bt-order-selected-wide.png');
}
.contentBox .listHead a.switchOrder:hover {
  background-position: -80px top;
}
.contentBox .listHead a.switchOrder:hover span{
  color: #cff;
}
.contentBox .listHead .switchOrder span,
.contentBox .listHead .selectedOrder span{
  font-family: arial, sans-serif; 
  font-weight: bold; 
  font-size: 14px; 
  line-height: 32px;
  font-style:italic;
  color: #fff;
  text-shadow: 0px 0px 4px #666, 0px 0px 6px #888;
}


.contentBox .moreList {
  float:right; 
  margin: 2px 10px 4px 0; 
  clear:both; 
  padding-left:2px
}
.contentBox .alphabetical {
  clear:both; 
  padding: 2px 0 0 10px
}
.contentBox .alphabetical li{
  float:left; 
  margin-right: 5px
}
.contentBox .alphabetical li strong,
.contentBox .alphabetical li a{
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.6em;
}

.contentBox a.moreHitList {
  float:right; 
  margin: 0 10px 4px 0; 
  padding-left: 10px
}
.contentBox a.moreArchive {
  float:right; 
  margin: 0 5px 4px 0; 
  padding-left: 2px
}

.contentBox h1, .contentBox h2{margin:0; padding:0; color: #4abdff}

/*
  Creation list
*/

.searchList h1.linked {padding-left:0}

h1.creationListDevice, h1.creationHeader {padding-left:10px}

.creationsList {padding: 5px 0; clear:both}
.creationsList p {text-align:left; padding-left:2px}
.creationsList a.more {float:right; margin: 8px 5px 5px 0; clear:both; padding-left:2px}
.creationsList .category{padding-bottom: 2px; display: block; padding-left:2px; font-size:0.8em}
.creationsList .category a{color: #000}
.creationsList .category a:hover{color: #555}

.listRealtone{
  display: table;
  width: 100%;
}

.listRealtone li{
  font-size:1em; 
  line-height: 1.5em; 
  clear:both;
  display: table-row;
  table-layout: fixed;
}
.listRealtone li:hover,
.listRealtone li.odd:hover{
  background: #9ed6f7; /* Old browsers */
  background: -moz-linear-gradient(left,  #9ed6f7 0%, #eeeeee 85%); /* FF3.6+ */
/*  background: -webkit-linear-gradient(left,  #9ed6f7 0%,#eeeeee 85%);  Chrome10+,Safari5.1+ nie działa za dobrze w chrome, poczekamy na natywną implementację*/
  background: -o-linear-gradient(left,  #9ed6f7 0%,#eeeeee 85%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  #9ed6f7 0%,#eeeeee 85%); /* IE10+ */
  background: linear-gradient(to right,  #9ed6f7 0%,#eeeeee 85%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ed6f7', endColorstr='#eeeeee',GradientType=1 ); /* IE6-9 */
}

.listRealtone li.odd{
  background-color: #eeeeee
}
.listRealtone li .no{
  display: table-cell;
  width:25px; 
  padding-left: 10px;

  vertical-align: middle;
  text-align:center;
  font-size:1.2em;
  font-weight:bold; 
  color: #4abdff; 
  text-align: right;

}

.topList.listRealtone li .no{
  width: 25px;
  padding-right: 5px;
  padding-left: 5px;
}
.listRealtone li:hover .no{
  color: #555
}
.listRealtone li .change{
  display: table-cell;
  width:25px;
  padding-top: 2px;
  
  vertical-align: middle;
  background-color: #fff; 
  text-align: center;
}
.listRealtone li .change img{
  position: relative;
  top: 1px;
}
.listRealtone li .name{
  display: table-cell;
  padding-left: 15px;
  line-height: 1.7em;
}

.listRealtone li a span.title,
.listRealtone li a span.author{
  color: #000
}
.listRealtone li a:hover .title, 
.listRealtone li a:hover .author{
  color: #555
}
.listRealtone li a .author{
  padding-right:10px; 
  font-weight:bold
}
.listRealtone li .preview{
  display: table-cell;
  vertical-align: middle;
  padding-right: 15px;
  padding-left: 10px;
  position: relative;
}
.listRealtone li .preview .jpreview{
  display: block;
  margin-left: auto;
  width: 14px;
  height: 13px;
  background-image: url("../i/icon_listen_small.png");
  background-position: 0 0;
}
.listRealtone li .preview .jpreview:hover{
  background-position: -14px 0;
}



.listJavagame li {
  width: 240px; 
  height: 359px;
  float: left; 
  margin: 5px 0 5px 6px; 
  overflow: hidden; 
  position: relative;
    
  border: 1px solid #cfcfcf; 
  background-color: #efefef;
}
.listJavagame li .imgContainer{
  display: block;
  overflow: hidden;
  width: 240px;
  height: 280px;
  background: url(../i/no-image-logo.png) center center no-repeat
}


.listJavagame li img.previewImage{
  width: 240px;
  min-height: 240px;
  height: auto;
}

.listJavagame li h3{
  padding: 4px 2px 2px;
}
.listJavagame li .icons {
  background-color: #e8e8e8; 
  position: absolute; 
  bottom: 0; 
  width: 235px;
  height: 41px;
  padding: 0 0 0 5px;
}
.listJavagame li .icons img {
  margin: 1px 0 2px;
}
.listJavagame li a.more {margin: 8px 2px 6px 0; float:right; display:inline; width:25px; height:27px;}
.listJavagame li a.more span{background-image: url('../i/icon_more.gif')}
.listJavagame li a.more:hover span{background-position: -27px top}
.listJavagame .newLine {width:100%; overflow:hidden; padding:0; margin:0; height:0px; border: none}

.smallBox .listJavagame{
  padding: 0;
}
.smallBox .listJavagame li{
  float: none;
  margin: 10px auto;
  width: 240px;
  height: auto;
  min-height: 322px;
  max-height: 402px;
}
.smallBox .listJavagame li .imgContainer{
  width: 253px;
  height: auto;
  min-height: 240px;
  max-height: 320px;
}
.smallBox .listJavagame li img.previewImage{
  width: 240px;
  max-height:320px;
}
.smallBox .listJavagame li .text{
  margin-bottom: 42px;
}

.smallBox .listJavagame li .text .category{
  margin-top: 3px;
}

.listWallpaper li {
  border: 1px solid #cfcfcf; 
  width: 240px; 
  height:322px;
  float:left; 
  margin: 0 0 5px 6px; 
}
.listWallpaper .category {
  padding: 2px 2px 1px; 
  display: block
}
.listWallpaper li img.previewImage {
  width: 240px;
  min-height:240px;
  max-height:302px;
  background: url(../i/no-image-logo.png) center center no-repeat;
  display: block;
}

.smallBox .listWallpaper li{
  margin: 10px auto 3px;
  float: none;
  width: 240px;
  height: auto;
  min-height: 240px;
  max-height: 340px;
}
.smallBox .listWallpaper li img.previewImage{
  width: 240px;
  max-height:320px;
}


.listRealTheme li,
.listRealFlash li,
.listRealStany-baterii li,
.listRealZegarki li{
  height: 240px;
  overflow: hidden;
}

.smallBox .listRealTheme li,
.smallBox .listRealFlash li,
.smallBox .listRealStany-baterii li,
.smallBox .listRealZegarki li{
  height: 240px;
}

.smallBox .listRealTheme li img.previewImage,
.smallBox .listRealFlash li img.previewImage,
.smallBox .listRealStany-baterii li img.previewImage,
.smallBox .listRealZegarki li img.previewImage{
  height: 240px;
}


.listRealStany-baterii li{
  overflow: hidden;
}

.moreBtn {float:right; display: inline}

/* Last seen box*/
.lastBox {
  width: 306px;
  position: relative; 
  padding: 10px 0 15px
}
.lastBox ul li{
  height: 54px; 
  float: left; 
  width: 139px; 
  padding: 1px 2px 2px;
  margin: 5px 0 5px 5px;
  overflow: hidden;
  box-shadow: 2px 2px 2px #ddd;
  border-radius: 0 0 6px 0;
}
.lastBox h2.separatedHeader {
  margin: 0 9px;
  padding:0 0 3px 0; 
  margin-bottom: 0; 
  position: relative; 
  top: -4px
}
.lastBox h3 {
  font-size: 1.0em; 
  height: 36px; 
  overflow: hidden;
  font-weight: normal;
}
.lastBox h3 *{
  color: #888;  
}
.lastBox .type {
  font-weight: bold; font-size: 0.9em
}
.lastBox .jpreview {
  float:left; 
  margin:7px 5px 3px 0;
  width: 27px;
  height: 27px;
  display: block;
  background-image: url("../i/icon_listen_large.png");
  background-position: 0 0;
}
.lastBox .jpreview:hover{
  background-position: -27px 0;
}
.lastBox .image{
  width:50px; 
  height: 50px; 
  float:left; 
  padding: 0 5px 0 0  
}
.lastBox .image .previewImage{
  width: 50px;
  height: 50px;
}
.lastBox .previewImage { 
  position: absolute;
  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
.lastBox .previewImage:hover{
  z-index: 2;
  border: 1px solid #ddd;
  
  -webkit-transform: scale(2.56);
  -moz-transform: scale(2.56);
  -o-transform: scale(2.56);
  -ms-transform: scale(2.56);
  transform: scale(2.56);
}

.lastBox a.clean{
  font-size:0.9em; 
  position: absolute; 
  bottom:0; 
  right:3px
}


/*
  Details pages
*/

.details hgroup{float:left; padding-top: 5px}
.details #info{clear:left;  padding-bottom: 5px; margin-bottom: 5px}

.details h1 {clear: left; padding: 6px 0 4px; margin-top: 0; line-height: 1.2em}

.details h2{
  margin: -7px 0 0;
  text-align: left;
  line-height: 0.5em;
}
.details h2 a{
  line-height: 1em;
  padding: 0;
}

.details h3{
  font-size: 1.3em; 
  line-height:1.1em; 
  margin:0; 
  padding: 6px 0 0; 
  overflow: hidden; 
  text-align: left
}
.details h3 a{
  padding-left: 0;
}
.details h3.category{font-size:1.3em; line-height:1.2em; padding: 0 0 5px; margin-top:0; color: #4abdff}

.details #wrongPhone{margin:0; padding: 3px 0 7px 0; text-align:center}

.details #znakItInfo{
  margin:0 10px 10px; 
  padding: 7px 0 ; 
  text-align: center;
  font-size: 1.2em;
  border-bottom: 1px solid #aaa;
}

.details #icons {
  float: right;
  margin: -5px -8px 0 0;
  max-width: 105px;
  overflow: hidden;
  
  box-shadow: 0 0 8px #ddd;
  border-radius: 0 10px 0 10px;
  background-color: transparent;
  text-align: center;
}
.details #icons a {
  display: block;
  margin: 5px 5px 10px;
}

.details p{margin: 4px 0; text-align:left}
.warning{
  text-align: center;
  color:#fe9423; 
  font-weight:bold; 
  margin: 10px 0;
}
.warning a{
  color:#fe9423
}

.detailsWallpaper h1 { float:left }

.downloadBox {
  width:auto; 
  text-align: center; 
  padding: 5px 0 10px;
  margin: 5px 0 8px;
  background-color: #f1f1f1;
  border-radius: 10px;
}


/*
  Boxes navigator
*/

#boxNavigator {height: 40px; clear: both; margin-left: 20px; position: relative; top: 8px; position: relative}
#boxNavigator ul li {position: absolute; z-index: 0; width: 205px; height:23px;  padding-top: 17px; background: url(../i/bg_tab_deselected.png) top left no-repeat; text-align: center; font-weight: bold; cursor: pointer}
#boxNavigator ul li.selected {background-image: url(/i/bg_tab_selected.png); color: #999; z-index: 1}
#boxDownloadDetailsEnable {left: 0}
#boxPhonesEnable {left: 187px}
#boxCommentsEnable {left: 244px}
#majorContent .navigableBox{
  margin-top: 8px;
}


/* Facebook */
.details #facebookGlobal {padding: 0 2px 0 10px; border-bottom: 1px solid #ccc}
.details #facebookLocal {float: left; padding: 4px 0 2px 8px; width: 102% } /*116%*/
.details #facebookLocal .text {padding-right: 10px; color: #48bdff; font-family: "lucida grande", "tahoma", "verdana", "arial", sans-serif; float: left}
.details #facebookLocal .text .highlight {font-size: 13px; font-weight: 700; line-height: 1.3em}


/* send card styles */
.details #cardForm {margin-top:10px}
.details #cardForm dt{margin: 6px 0 5px}
.details #cardForm input, .details #cardForm textarea, .details #cardForm select {border: 1px solid #6acddf; background-color:#f3fdff}
.details #cardForm #cardNumber{width:85px}
.details #cardForm #cardSender{width:130px}
.details #cardForm .warning{padding: 0 0 4px; margin: 0}
.details #cardForm #cardText{width:90%; height: 60px; overflow: auto}
.details #cardForm input[type=submit]{margin-top: 8px;  padding: 2px 9px; background-color: #FFF1A3; border: 2px solid #FFBA00; color: #4abdff; font-weight: bold; font-size: 1.1em}
.details #cardForm input[type=submit]:hover{background-color: #FFE183; color: #2a9def}

.details #cardForm #flirtekText {margin-top: 10px}
/* END send card styles */

.detailsWallpaper #preview img, 
.detailsAnimation #preview img, 
.detailsTheme #preview img, 
.detailsVideo #preview img, 
.detailsFlash #preview img{
  margin: 5px 2px 5px 10px; 
  float:right; 
  clear:right; 
  max-width: 395px
}
.detailsWallpaper #preview img{
  margin: 5px 2px 5px 5px
}
.detailsWallpaper .warning, .detailsAnimation .warning, .detailsTheme .warning, .detailsVideo .warning, .detailsFlash .warning{clear:right}


.details .titleBar {
  width: auto;
  margin:5px 0 5px; 
  padding: 5px;
  clear: right;
  background-color: #d0eeff; 
  border-radius: 10px;
}
  .details .titleBar h1{
    padding:0 0 3px 8px;
    font-size:1.5em;
  }
  .detailsTruetone .titleBar h1{
    padding-top: 3px;
  }
  
  .details .titleBar h1 span{
    display: block
  }
  
  .details .titleBar h1 .author{
    font-size:0.9em; 
    padding-bottom: 4px;
    width: 90%;
    border-bottom: 1px solid white; 
  }
  .details .titleBar #preview{
    float:right; 
    margin: 20px 15px 5px;
  }
  .details .titleBar .imgPreview{
    background-color: #d0eeff;
    float:right; 
    padding: 5px 10px 5px;
    margin: 0;
  }
  .details .titleBar .imgPreview img{
    max-width: 170px;
  }
  .details .titleBar .soundPreview{
    margin: 10px 0 0 10px;
  }
  



.detailsTruetone .titleBar h1{padding: 15px 5px 10px}

.detailsTruetone .titleBar #preview,
.detailsRealtone .titleBar #preview,
.detailsPolyphony .titleBar #preview{
  display:table-cell;
  margin: 0;
  padding: 12px 10px 12px;
  background-color: #d0eeff;
}
.detailsTruetone .titleBar #preview{
  padding: 12px 10px;
}

.detailsTruetone .titleBar #preview a,
.detailsRealtone .titleBar #preview a,
.detailsPolyphony .titleBar #preview a{
  width: 27px;
  height: 27px;
  display: block;
  position: relative;
  background-image: url("../i/icon_listen_large.png");
  background-position: 0 0;
}

.detailsTruetone .titleBar #preview a:hover,
.detailsRealtone .titleBar #preview a:hover,
.detailsPolyphony .titleBar #preview a:hover{
  background-position: -27px 0;
}

.detailsTruetone .titleBar #preview *,
.detailsRealtone .titleBar #preview *,
.detailsPolyphony .titleBar #preview *{
  vertical-align: top;
  max-width: 180px;
}

.detailsTruetone .titleBar, .detailsRealtone .titleBar, .detailsPolyphony .titleBar, .detailsMonophony .titleBar {clear:both}

.detailsJavagame #preview {text-align: center}
.detailsJavagame #preview img {margin: 3px 0; max-width: 395px }
.detailsJavagame #previewRest {margin: 10px 0; clear:right; text-align: center}
.detailsJavagame #previewRest img{margin: 0 0 3px 3px; padding:0}

.promoBoxImg {
    width: 190px;
}

#parseData {display: none}


/* download details box */
#majorContent #boxDownloadDetails {
  padding-bottom: 0;
}
#boxDownloadDetails .hideJS {display: none}
#boxDownloadDetails h2 {
  font-size: 1.6em;
  line-height: 1.6em;
  margin-top: 0;
  text-align: center;
}
#boxDownloadDetails h2:hover {color: #289ddf}
#boxDownloadDetails h2 .rollDown{
  position: relative;
  top: 2px;
}
#boxDownloadDetails h3.buy {font-size:1.5em; font-weight: bold; width: 97%; margin: 0 auto 5px; padding-bottom: 5px}
#boxDownloadDetails h3.buySms .rollDown {position: relative; top: 2px; padding: 0 15px}
#boxDownloadDetails h3#smsDetails {color: red}
#boxDownloadDetails .smsBox {
  width:auto; 
  text-align: center; 
  padding: 5px 0 10px;
  margin: 5px 0 8px;
  background-color: #f1f1f1;
  border-radius: 10px;
}

#boxDownloadDetails .smsBox p{text-align: center}
#boxDownloadDetails .smsBox h3{text-align: center}
#boxDownloadDetails .smsBox h3.buyFotokod:hover {color: #999}

#boxDownloadDetails .smsBox.znakIt{
  padding-top: 10px;
}
#boxDownloadDetails .smsBox h3.smsBoxHeader {
  border-bottom: 1px solid #aaa; 
  margin: 0 10px 5px;
  padding-bottom: 5px;
  font-size: 1.5em;
  font-weight: bold;
  color: #4abdff
}

#boxDownloadDetails .smsBox p mark.number{color: red}
#majorContent #boxDownloadDetails .smsBox .boxBottom {width:100%; height: 10px; background: url(../i/bg_sms_box_bottom.gif)}
#minorContent #boxDownloadDetails .smsBox .boxBottom {width:100%; height: 10px; background: url(../i/bg_sms_box_bottom_minor.gif)}
#boxDownloadDetails .smsBox #fotokod {margin-top:5px}

#boxDownloadDetails #smsAdditionalDetails {padding-top: 5px}

#boxDownloadDetails .price {padding: 7px 0 0}
#boxDownloadDetails .price strong.promo{color: red}
#boxDownloadDetails .price span.oldPrice{text-decoration: line-through}

#boxDownloadDetails .cardTease {text-align: center; font-weight:bold; font-size: 1em; padding-top: 10px; margin-top: 15px; border-top: 2px solid #aaa}

#boxDownloadDetails .smsBox .rollDown {padding: 0 30px}

/* Phones list layout */
.details h3#showPhonesList {margin: 0 10px 10px}
.details #vendorsList {float:left; display: inline; font-size: 1.1em; margin-left: 20px}
.details #vendorsList ul li{padding:2px 20px 4px 0}
.details #vendorsList ul li.selected{border-bottom: 2px solid #999; padding-bottom:2px; font-weight: bold}
.details #devicesList {float:left; display: inline}
.details #devicesList ul {border-left: 2px solid #999; padding-left: 5px}
.details #devicesList ul li {border: none}
.details #devicesList ul li a {color: #046daf}


/*Similar box */
#similarBox {
  width: 412px;
  padding: 5px 8px;
  margin-top: 20px;
}
#similarBox h3 {margin: 0 0 3px 0 }
#similarBox h4 a img{position:relative; top:1px}
#similarBox .jpreview {
  float:left; 
  margin:3px 8px 3px 0;
  width: 27px;
  height: 27px;
  display: block;
  background-image: url("../i/icon_listen_large.png");
  background-position: 0 0;
}
#similarBox .jpreview:hover{
  background-position: -27px 0;
}
#similarBox .preview .previewImage {
  width: 96px; 
  height: 96px;
  float: left;
  margin:2px 7px 2px 0;
  border: 1px solid #fff;
}

#similarBox .preview .previewImage { 
  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
#similarBox .preview .previewImage:hover{
  border: 1px solid #ddd;
  -webkit-transform: scale(1.42);
  -moz-transform: scale(1.42);
  -o-transform: scale(1.42);
  -ms-transform: scale(1.42);
  transform: scale(1.42);
}

#similarBox ul li{clear:both; padding: 5px 0}
#similarBox ul li a.more {float:right; margin: 5px 5px 5px 0; padding-left:2px}
#similarBox .similarListSimple li {
  float:left; 
  clear:none; 
  padding-left:27px
}
#similarBox .similarVideo .preview .previewImage {width: 55px; height: 55px}

/* Comment form */
#boxComments h3 {margin: 0 10px 10px}
#boxComments div.err, #boxComments div.ok {margin: 5px 0; text-align: center; line-height:1.3em; font-weight:bold}
#boxComments div.err {border: 2px solid red; color:red}
#boxComments div.ok {border: 2px solid green; color:green}
#boxComments #no_csrf_foo-label, #boxComments #no_csrf_foo-element {display: none}
#boxComments dt {width: 100%; text-align: left}
#boxComments dd {width: 100%}
#boxComments dd textarea {width: 100%; height: 80px}
#boxComments #commentsList {margin: 0 10px}
#boxComments #commentsList li{margin: 7px 0}
#boxComments #commentsList .comment {float: left; word-wrap: break-word}
#boxComments #commentsList .added {clear: left; float: left}
#boxComments #commentsList .login {float: right}
#boxComments #commentsList .login, #boxComments #commentsList .added {font-size: 0.9em; display: inline; margin-right: 10px; color: #999}

#boxComments form {margin: 10px; border-top: 2px solid #999; padding-top: 3px}
#boxComments form textarea{padding: 3px; margin-top: 2px}

#boxComments #loginLink {margin: 10px 10px 0; padding-top: 5px; border-top: 2px solid #999}
#boxComments #loginLink a {font-weight: bold}

/*
  Search form
*/

#searchFormBox{
  padding-top: 12px;
}
#searchFormBox h1 {
  line-height: 0.9em; 
  float: left; 
  padding: 0 15px
}
#searchFormBox h3 {
  margin-top: 15px; 
  padding-top: 10px; 
  border-top: 1px solid #aaa
}
#searchFormBox #searchForm {
  margin: 0 0 8px 5px
}
#searchFormBox #searchForm #search_text {
  width: 210px
}
#searchFormBox #searchForm input[type="submit"]{
  margin-left: 10px;
}
#searchFormBox .large{
  padding: 0 2px 0 5px;
}


#searchCount {
  font-size:1.2em; 
  line-height:normal;
  padding-bottom: 10px;
}
#searchCount h2{
  margin: 0 10px 5px;
}
#searchCount ul{
  padding: 0 20px
}

/*
  Terms page
*/

ol#terms li{list-style-type: upper-roman; font-weight:bold; padding: 10px 10px 10px 0; margin-left:25px}
ol#terms ol li{list-style-type: decimal; font-weight:normal; padding: 2px 10px 2px 0; margin-left:40px}
ol#terms ol ol li{list-style-type: upper-alpha; margin-left:60px}
ol#terms ol ol ol li{list-style-type: lower-alpha; margin-left:80px}

.mtTerms li{
  font-size: 1.1em;
  padding: 5px 2px;
}

/*
  Help page
*/

ol#help {}
ol#help li{list-style-type: decimal; padding: 7px 10px 3px 0; margin-left:25px; font-weight:bold}
ol#help li p {padding: 7px 0; font-weight:normal}

/*
  Fotokody Page
*/
dl#fotokody {}
dl#fotokody dt {font-weight: bold; padding-top: 20px}
dl#fotokody dd {padding-top: 10px}
dl#fotokody ul {padding-left: 15px}
dl#fotokody ul li {padding: 6px}
dl#fotokody ul li h2{font-size: 1.3em; padding: 0; margin: 0}
dl#fotokody ul li p{margin: 5px 0; text-align:left}

dl#fotokody ol {list-style-type:decimal; margin-left: 5px}
dl#fotokody ol li {list-style-type:decimal; padding: 3px 0; margin-left:20px}


/*
 Complaint page
*/
#complaintForm{margin: 5px 0 10px}
#complaintForm form{margin: 5px 0}
#complaintForm form dt{width: 230px}
#complaintForm form dd{width: 450px}
#complaintForm form input[type="text"]{width:200px; margin-top:5px}
#complaintForm form input#email{margin:0 0 5px}
#complaintForm form textarea{width:440px; height: 60px; margin-bottom: 5px}

/*
 Contact page
*/
.contactWarning{color:#fe9423; font-weight:bold; font-size: 1.1em; margin: 10px 0 5px}

#contactForm{margin: 20px 0 20px}
#contactForm form{margin: 5px 0}
#contactForm form dt{width: 200px}
#contactForm form dd{width: 480px}
#contactForm form input#email{margin:0 0 5px}
#contactForm form textarea{width:440px; height: 120px; margin-bottom: 5px}

/*
 5lat quiz page
*/
#lat .boxCenter{padding:0 9px}
#lat .boxCenter .play{position:relative}
#lat .boxCenter .play .preview{position:absolute; top:40%; right:20px}

/*
  Select Phone
*/

#selectPhone h2{color: #058}
#selectPhone .phonesList{float:left; width:45%}
#selectPhone .modelsList{float:left; width:27%; padding-left:4%; padding-top: 10px}
#selectPhone .phoneContentList{font-size:1.2em; line-height:normal}

/*
  Flirtek
*/
#flirtek h1 {text-align:center; line-height: 1em; padding-bottom: 10px}
#flirtek #flirtekLogo { padding: 0 5px 10px 0; display:block; margin:auto}
#flirtek .categories {margin:0 20px}
#flirtek .categories *{line-height:1.5em; text-align:center}
#flirtek .texts li{padding:8px 0}
#flirtek #chooseCategory {text-align:right}


/*
  Player
*/

#jqueryplayer {height:0; width: 0}

/*
  Tags cloud
*/
#tagsCloud p span {line-height:100%}

/**
* Newsletter
**/
#newsletter a {display:block; margin: 8px auto 0; text-align: center}

/*
  Type info
*/

.typeInfo p {font-size: 1.1em; padding: 4px 0}

/**
 * Login and user related styles
 **/

#loginBoxSimple {
  float: right; 
  margin: 0 10px 6px 0;
}
#loginBoxSimple a{
  letter-spacing: -1px;
  display: inline-block;
  color: #555;
  font-family: arial, sans-serif;
  font-size: 1.2em;
  font-weight: bold;
  padding: 4px 4px;
  border-radius: 8px;
  background: #fdfdfd; /* Old browsers */
  background: -moz-linear-gradient(top,  #fdfdfd 0%, #d8d8d8 100%); /* FF3.6+ */
  background: -webkit-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fdfdfd 0%,#d8d8d8 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fdfdfd 0%,#d8d8d8 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
}
#loginBoxSimple a:hover{
  color: #000;
  text-shadow: 0 0 1px #000;
}

#loginForm {margin: 20px 20px 40px 100px}
#loginForm input.text{width:200px}
#registerLink {text-align: center; margin-bottom: 10px}


#registerForm #email{width: 200px}
#registerForm #send_newsletter-label, #dataForm #send_newsletter-label {width: 5%}
#registerForm #send_newsletter-element, #dataForm #send_newsletter-element {width: 90%}
#registerForm #send_newsletter-element input, #dataForm #send_newsletter-element input {float: left; margin: 1px 20px 1px 85px}
#registerForm #comments-label, #dataForm #comments-label {width: 5%}
#registerForm #comments-element, #dataForm #comments-element {width: 90%}
#registerForm #comments-element input, #dataForm #comments-element input {float: left; margin: 1px 20px 1px 85px}


#userData dt {font-weight: bold; clear:left; width: 150px; text-align: right}
#userData dd {min-width: 300px}
#userData dt, #userData dd {float: left; padding: 2px 5px 4px; margin-bottom: 5px; border-bottom: 1px solid #999; height: 15px}

#userOperations {margin-top: 30px; padding: 10px; text-align: center; border-top: 2px solid #999}


#cookielogo {
  width: 200px;   
  top:22px; 
  left: 8px
}