
@charset "UTF-8";
/* CSS Document */

.tabs{
    
	border: 0px;
  width: 380px;
  /*z-index: 0;*/
}
.tabrow{
  list-style:none;
  padding: 0;
  margin: 0;
  margin-left: 10px;
  }
  
.tabrow li{
	display: inline-block;
	position: relative;
}
.tabrow a{
  display:block;
	position: relative;
	margin: 0 -5px;
	width: 95px;
	padding:5px 15px;
	border: 1px solid #AAA;
  text-decoration: none;
  color: black;
	font: 600 12px 'Open Sans', sans-serif;
  text-align: center;
	text-shadow: 1px 1px #fff, -1px -1px #000;
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-topright: 15px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	-webkit-box-shadow: -5px 0 5px 0 rgba(0,0,0,0.25), 5px 0 5px 0 rgba(0,0,0,0.25), 0 -5px 5px 0 rgba(0,0,0,0.25), inset 0 1px 0 #FFF;
	-moz-box-shadow: -5px 0 5px rgba(0,0,0,0.25), 5px 0 5px rgba(0,0,0,0.25), 0 -5px 5px rgba(0,0,0,0.25), inset 0 1px 0 #FFF;
	box-shadow: -5px 0 5px 0 rgba(0,0,0,0.25), 5px 0 5px 0 rgba(0,0,0,0.25), 0 -5px 5px 0 rgba(0,0,0,0.25), inset 0 1px 0 #FFF;
}
.tabs div
{
	clear: both;
	padding: 5px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	display: none;
}

.numero {
color: #000;
font-size: 16px;
border: thin black solid;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
margin: auto;
margin-top: 5px;
margin-bottom: 5px;
width: 30px;

}

.tab1.active .numero {
    color: #ff6a46;
background-color: rgba(0,0,0,0.5);
}

.tab2.active .numero {
    color: #ff9f48;
background-color: rgba(0,0,0,0.5);

}

.tab3.active .numero {
    color: #ffdc48;
background-color: rgba(0,0,0,0.5);
}

.tabrow:before
{
	position: absolute;
	content: "";
	width: 380px;
	top: 100px;
	left: 20px;
	border-bottom: 1px solid #AAA;
	z-index: 3;
}
.tabrow a:before,
.tabrow a:after
{
	border: 1px solid #AAA;
	position: absolute;
	bottom: 0;
	width: 6px;
	height: 6px;
	content: " ";
}
.tabrow a:before
{
	left: -6px;
	-webkit-border-bottom-right-radius: 6px;
	-moz-border-radius-bottomright: 6px;
	border-bottom-right-radius: 6px;
	border-width: 0 1px 1px 0;
}
.tabrow a:after
{
	right: -6px;
	-webkit-border-bottom-left-radius: 6px;
	-moz-border-radius-bottomleft: 6px;
	border-bottom-left-radius: 6px;
	border-width: 0 0 1px 1px;
}
.tabrow a.active
{
	z-index: 4;
}
.tab1
{
	z-index: 0;
	background: #ff6a46;
	background: -o-linear-gradient(top, #ffb4a2 0%, #ff6a46 100%);
	background: -ms-linear-gradient(top, #ffb4a2 0%, #ff6a46 100%);
	background: -moz-linear-gradient(top, #ffb4a2 0%, #ff6a46 100%);
	background: -webkit-linear-gradient(top, #ffb4a2 50%, #ff6a46 100%);
	background: linear-gradient(top, #ffb4a2 0%, #ff6a46 100%);
}
.tab2
{
	z-index: 1;
	background: #ff9f48;
	background: -o-linear-gradient(top, #ffcfa3 0%, #ff9f48 100%);
	background: -ms-linear-gradient(top, #ffcfa3 0%, #ff9f48 100%);
	background: -moz-linear-gradient(top, #ffcfa3 0%, #ff9f48 100%);
	background: -webkit-linear-gradient(top, #ffcfa3 50%, #ff9f48 100%);
	background: linear-gradient(top, #ffcfa3 0%, #ff9f48 100%);
}
.tab3
{
	z-index: 0;
	background: #ffdc48;
	background: -o-linear-gradient(top, #ffeda3 0%, #ffdc48 100%);
	background: -ms-linear-gradient(top, #ffeda3 0%, #ffdc48 100%);
	background: -moz-linear-gradient(top, #ffeda3 0%, #ffdc48 100%);
	background: -webkit-linear-gradient(top, #ffeda3 50%, #ffdc48 100%);
	background: linear-gradient(top, #ffeda3 0%, #ffdc48 100%);
}
.tab1:before 
{
	-webkit-box-shadow: 2px 2px 0 #ff6a46;
	-moz-box-shadow: 2px 2px 0 #ff6a46;
	box-shadow: 2px 2px 0 #ff6a46;
}
.tab1:after
{
	-webkit-box-shadow: -2px 2px 0 #ff6a46;
	-moz-box-shadow: -2px 2px 0 #ff6a46;
	box-shadow: -2px 2px 0 #ff6a46;
}
.tab2:before
{
	-webkit-box-shadow: 2px 2px 0 #ff9f48;
	-moz-box-shadow: 2px 2px 0 #ff9f48;
	box-shadow: 2px 2px 0 #ff9f48;
}
.tab2:after
{
	-webkit-box-shadow: -2px 2px 0 #ff9f48;
	-moz-box-shadow: -2px 2px 0 #ff9f48;
	box-shadow: -2px 2px 0 #ff9f48;
}
.tab3:before
{
	-webkit-box-shadow: 2px 2px 0 #ffdc48;
	-moz-box-shadow: 2px 2px 0 #ffdc48;
	box-shadow: 2px 2px 0 #ffdc48;
}
.tab3:after
{
	-webkit-box-shadow: -2px 2px 0 #ffdc48;
	-moz-box-shadow: -2px 2px 0 #ffdc48;
	box-shadow: -2px 2px 0 #ffdc48;
}
.tab1.active
{
	border-bottom-color: #ff6a46;
}
.tab2.active
{
	border-bottom-color: #ff9f48;
}
.tab3.active
{
	border-bottom-color: #ffdc48;
}
.tabContent
{
	box-shadow: -5px 0 5px 0 rgba(0,0,0,0.25), 5px 5px 5px 0 rgba(0,0,0,0.25), 0 5px 5px 0 rgba(0,0,0,0.25);
}
