
.avatar-area{
    background-image: url(../img/bg.png); 
    width: 780px;
    height: 615px;
}

.avatar-tile img{
	float:left;
}

.avatar-tile h1{
    font-size: 32px;
    color: #e48b15;
    width: 315px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-image: url(../img/titulo.png); 
    background-repeat: no-repeat;
    padding-bottom: 7px;
    padding-top: 2px;
    font-family: "gooddog","MS Trebuchet","Lucinda Sans",Helvetica,Arial;
}

.avatar-preview{
	float: left;
	width: 281px;
	height: 525px;
	margin: 5px 10px; 
	margin-left: 27px;
}

.avatar-preview-header h2{
    font-size: 24px;
    color: #e48b15;
    margin: 0 auto;
    text-align: center;
    background-color: #ffd940;
    height: 26px;
    padding-top: 20px;
    font-family: "gooddog","MS Trebuchet","Lucinda Sans",Helvetica,Arial;
}

.avatar-preview-header {
	background-color: #ffd940;
}

.avatar-preview-body{
	padding: 20px;
	background-color: #ffd940;
        height: 357px;
}

.avatar-preview-body img {
    background-repeat: no-repeat;
    position: absolute;
}

.avatar-preview-itens img.not-bg{
	/*margin-top: 55px;*/
}

.avatar-preview-footer{
	padding-left: 20px;
	padding-right: 20px;
	background-color: #ffd940;
        padding-bottom: 4px;
}

.avatar-preview-subfooter{
	background-color: #ffd940;
	height: 10px;
	border-radius: 0 0 10px 10px;
}

.avatar-itens{
	float: left;
	width: 417px;
	height: 525px;
	margin: 5px 10px;
	border-radius: 0 0 10px 10px;
}

.avatar-itens-body{
	height: 100px;
	width: 100%;
}

.avatar-itens-color{
	height: 48px;
	width: 100%;
	padding-left: 115px;

}

.avatar-itens-select{
	height: 280px;
	width: 375px;
	background-image: url(../img/bg-2.png); 
	overflow:auto;
	background-repeat: no-repeat;
        padding-top:12px;
}

.avatar-itens-select .item{
	background-color: white;
	height: 62px;
	float: left;
	margin: 0px 4px 8px 4px;
	white-space: nowrap;
	text-align: center;
        width: 17.5%;
}

.avatar-itens-select a.item-box .price, .avatar-itens-color a.color-box .price, .avatar-itens-body a.item-body .price{
    display: none;
}

.avatar-itens-select a.item-box:hover .price, .avatar-itens-color a.color-box:hover .price, .avatar-itens-body a.item-body:hover .price{
    display: block;
    font-weight: bold;
    position: absolute;
    text-align:center;
}

.avatar-itens-body a.item-body:hover .price{
    font-size: 28px;
    margin-top: 32px;
    width: 70px;
}

.avatar-itens-body a.item-body:hover .price img{
    margin-top: -32px;
}

.avatar-itens-color a.color-box:hover .price{
    color: #ffffff;
    font-size: 14px;
    margin-top: 4px;
    width: 25px;
}

.avatar-itens-color a.color-box:hover .price img{
    margin-top: -4px;
}

.avatar-itens-select a.item-box:hover .price, .avatar-items a.item-body:hover span, .avatar-items a.turb-color-box:hover span {
    font-size: 28px;
    margin-top: 21px;
    width: 57px;
}

.avatar-itens-select a.item-box:hover .price img{
    margin-top: -21px;
}

.helper, .avatar-itens-select .item a {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    text-decoration: none;
}

.avatar-itens-select .item img{
	vertical-align: middle;
	max-height: 62px;
    max-width: 57px;
}

.avatar-itens-select .item a {
	padding: 0 3px;
    width:100%;
}

  .avatar-itens-body , .avatar-itens-color, .avatar-itens-select{
	float: left;
  }
  
  .avatar-itens-body .item, .avatar-itens-body .item a{
	width: 70px;
	height: 88px;
	float: left;
	margin: 10px;
	display: block;
  }
  
  .avatar-itens-color .color, .avatar-itens-color .color a{
	width: 25px;
	height: 25px;
	float: left;
	margin: 10px 5px;
  }
  
.color-turquesa {
    background-color: #5ac5c1;
}

.color-roxo {
    background-color: #b6508e;
}

.color-verde {
    background-color: #79c549;
}


.color-abobora {
    background-color: #e48b15;
}

.avatar-itens-body .item  a.item-body.equiped, .avatar-itens-body .item a:hover{
	background: -webkit-linear-gradient(white, #ffd940); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(white, #ffd940); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(white, #ffd940); /* For Firefox 3.6 to 15 */
	background: linear-gradient(white, #ffd940); /* Standard syntax */
}
	  
.avatar-itens-color .color a.color-box.equiped , .avatar-itens-color .color a:hover{
	border: 2px solid #ffffff;
}

.avatar-itens-select .item a.item-box.equiped, .avatar-itens-select .item a:hover {
	background-color: #ecd599;
	border: 2px solid #79c549;
}

.avatar-itens-select .item a.item-box.owed{
	background-color: #fef7bb;
 }

/*Tabs Itens */
.tabs input[type=radio] {
          position: absolute;
          top: -9999px;
          left: -9999px;
      }
      .tabs {
        width: 100%;
        float: none;
        list-style: none;
        position: relative;
        padding: 0 0 10px;
		margin: 0;
      }
      .tabs li{
        float: left;
        width: 25%;
      }
      
      .tabs label {
          display: block;
	  height:60px;
          color: #ffffff;
          font-size: 11px;
          font-weight: normal;
          background: rgba(255,255,255,0.2);
          cursor: pointer;
          position: relative;
          top: 3px;
          -webkit-transition: all 0.2s ease-in-out;
          -moz-transition: all 0.2s ease-in-out;
          -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
          text-align: center;
          margin-left: 0;
      }
      .tabs label:hover {
        top: 0;
      }

	.tabs label[for=tab1]{
		background-image: url(../img/icone-livro-n1-alt.png);
		margin-right: 2px;
	}
	
	#tab1:checked  +label{
		background-image: url(../img/icone-livro-n1.png);
	}
	
	.tabs label[for=tab2]{
		background-image: url(../img/icone-livro-n2-alt.png);
		margin-right: 2px;
	}

	#tab2:checked  +label{
		background-image: url(../img/icone-livro-n2.png);
	}
	
	.tabs label[for=tab3]{
		background-image: url(../img/icone-livro-n3-alt.png);
		margin-right: 2px;
	}

	#tab3:checked  +label{
		background-image: url(../img/icone-livro-n3.png);
	}

	.tabs label[for=tab4]{
		background-image: url(../img/icone-livro-n4-alt.png);
                margin-right: 0;
	
	}

	#tab4:checked  +label{
		background-image: url(../img/icone-livro-n4.png);
	}

	
      [id^=tab]:checked + label {
        color: #000000;
        top: 0;
        border-bottom: none;
      }
      
	  
      [id^=tab]:checked ~ [id^=tab-content] {
          display: block;
      }
      .tab-content{
        z-index: 2;
        display: none;
        text-align: left;
        width: 100%;
        line-height: 140%;
        padding-top: 10px;
        background: white;
        padding: 15px;
        color: black;
        position: absolute;
        left: 0;
        box-sizing: border-box;
        -webkit-animation-duration: 0.5s;
        -o-animation-duration: 0.5s;
        -moz-animation-duration: 0.5s;
        animation-duration: 0.5s;
		background-color: #ffd940;
		border-radius: 0 0 10px 10px;
      }
      
      .tabs .tab-disable{
          color: #666666;
      }
 
	#avatar-itens-select::-webkit-scrollbar            { /* 1 */ 
		width: 12px;
	}
	#avatar-itens-select::-webkit-scrollbar-button:decrement:vertical      {
		background-image: url(../img/but-up-12.png);
		height:12px;
	/* 2 */ }
	#avatar-itens-select::-webkit-scrollbar-button:increment:vertical      {
		background-image: url(../img/but-down-12.png);
		height:12px;
	}
	
	#avatar-itens-select::-webkit-scrollbar-track:vertical        { /* 3 */ 
	    border-radius: 10px;
	}
	#avatar-itens-select::-webkit-scrollbar-track-piece  { 

	/* 4 */ }
	#avatar-itens-select::-webkit-scrollbar-thumb      { /* 5 */ 
		border-radius: 10px;
		background-color: #e48b15;
	}
	#avatar-itens-select::-webkit-scrollbar-corner       { /* 6 */ }
	#avatar-itens-select::-webkit-resizer {
	
	}
	
	.avatar-itens-select {
    //scrollbar-face-color: #000000;
    //scrollbar-shadow-color: #2D2C4D;
    //scrollbar-highlight-color:#7D7E94;
    //scrollbar-3dlight-color: #7D7E94;
    //scrollbar-darkshadow-color: #2D2C4D;
    scrollbar-track-color: #e48b15;
    scrollbar-arrow-color: #ffffff; 
	}

.btn{
	text-decoration: none;
}	
	