@charset "utf-8";

/* CSS Document */



.tab-row1 {

	text-align: center;

	padding: 0;

	float: none;

	display:inline-block;

	list-style: none;

	width: auto;

}



.tab-row1 li { float:left; color:#424242; background:rgba(0,0,0,0.0); border:none; margin:0 0 0 12px; padding:14px 22px 14px 22px; box-shadow: none; transition: all 0.25s ease-out 0s; position: relative;}



.tab-row1 li:after {

  content:"";

  border-radius: 50px; 

  padding: 2px 2px 2px 2px; 

  background:#ededed;

  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

  -webkit-mask-composite: destination-out; 

  mask-composite: exclude; 

  transition: all 0.25s ease-out 0s;

  margin: 0 0 0;

  position:absolute;

  top:0;

  left:0;

  right:0;

  bottom:0;

}

.tab-row1 li:hover {

  box-shadow: 2px 1000px 1px rgba(0,0,0,0.19) inset;

  color: #424242;

  cursor:pointer;

}

.tab-row1 li:hover:after {

  background: -webkit-linear-gradient(left, #7e287e, #3853a4), -webkit-linear-gradient(left, #7e287e, #3853a4);

  background: -moz-linear-gradient(left, #7e287e, #3853a4), -moz-linear-gradient(left, #7e287e, #3853a4);

  background: -ms-linear-gradient(left, #7e287e, #3853a4), -ms-linear-gradient(left, #7e287e, #3853a4);

  background: -o-linear-gradient(left, #7e287e, #3853a4), -o-linear-gradient(left, #7e287e, #3853a4);

}



.tab-row1 li.active:after{

  background: -webkit-linear-gradient(left, #7e287e, #3853a4), -webkit-linear-gradient(left, #7e287e, #3853a4);

  background: -moz-linear-gradient(left, #7e287e, #3853a4), -moz-linear-gradient(left, #7e287e, #3853a4);

  background: -ms-linear-gradient(left, #7e287e, #3853a4), -ms-linear-gradient(left, #7e287e, #3853a4);

  background: -o-linear-gradient(left, #7e287e, #3853a4), -o-linear-gradient(left, #7e287e, #3853a4);

}



.tab-row2 {

	width: 100%;

	float: left;

	text-align: center;

	margin: 0 auto 0;

}

.tab-bar2 {

	width: 100%;

	float: left;

	display: none;

	margin: 0 0 0;

}

.tab-icon1 {

	width: 55px;

	float: none;

	transform: translateY(-50%);

	margin: 0 auto 0;

	position: absolute;

	top: 50%;

	right: 0;

	left: 0;

}





/*Smartphone css*/

@media screen and (max-width: 480px) {

.tab-row1 { width:100%; padding: 0 0;}

.tab-row1 li { padding:10px 4% 11px; margin:0 0 8px 8px; font-size:12px; float:none; display:inline-block;}

.tab-row1 li:first-child { margin-left:0;}

.tab-row2 { text-align:center;}

}



@media screen and (min-width:481px) and (max-width:600px) {



}



@media screen and (min-width:601px) and (max-width:767px) {



}



@media screen and (min-width:768px) and (max-width:900px) {

}



@media screen and (min-width:901px) and (max-width:1024px) {

}



@media screen and (min-width:1025px) and (max-width:1240px) {

}



@media screen and (min-width:1241px) and (max-width:1350px) {

}