html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
html {
  background: #fff;
  color: #333;
  font: 12px/1.5em arial, helvetica, sans-serif;
}
body {
  font-size: 100%;
  text-align: center;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  position: relative;
  display: block;
  z-index: 1;
  margin: 0;
  padding: 0;
  zoom: 1;
}
@font-face {
  font-family: 'WebSymbolsRegular';
  src: url('/html5/fonts/websymbols-regular-webfont.eot');
  src: url('/html5/fonts/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/html5/fonts/websymbols-regular-webfont.woff') format('woff'), url('/html5/fonts/websymbols-regular-webfont.ttf') format('truetype'), url('/html5/fonts/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
}
a,
form,
img {
  border: 0;
}
form,
img {
  outline: none;
}
#main {
  position: relative;
  margin: 0 auto;
  width: 960px;
  text-align: left;
}
.rotate-me {
  position: relative;
  width: 200px;
  height: 200px;
  background: #fdc;
}
.rotate-me h1 {
  line-height: 1.3em;
  font-family: WebSymbolsRegular;
}
.tab-navigation {
  position: relative;
  margin: 0;
  padding: 16px 0;
  overflow: hidden;
  width: 920px;
  /* specific background */

  /*
	.content {
		background-image: url(dummy/s1.jpg);
		
		& ~ .content {
			background-image: url(dummy/s2.jpg);
			
			& ~ .content {
				background-image: url(dummy/s3.jpg);
				
				& ~ .content {
					background-image: url(dummy/s4.jpg);
					
					& ~ .content {
						background-image: url(dummy/s5.jpg);
						
						& ~ .content {
							background-image: url(dummy/s6.jpg);
						}
					}
				}
			}
		}
	}
	*/

}
.tab-navigation > input[type=radio] {
  position: absolute;
  left: -2000px;
  display: block;
  clear: none;
}
.tab-navigation ul.control {
  position: relative;
  overflow: hidden;
  list-style: none;
  margin: 0 0 -12px;
  padding: 0;
  z-index: 3;
}
.tab-navigation ul.control li {
  position: relative;
  display: block;
  margin: 0;
  padding: 0 0 28px 30px;
  float: left;
  min-width: 60px;
  clear: none;
}
.tab-navigation ul.control li:before {
  position: absolute;
  display: block;
  margin: 0;
  padding: 0;
  top: 15px;
  left: 0;
  color: #d3d3d3;
  content: "\003E";
  width: 30px;
  font-family: WebSymbolsRegular;
  font-size: 21px;
  line-height: 22px;
  overflow: visible;
  text-align: center;
}
.tab-navigation ul.control li:first-child:before {
  display: none;
}
.tab-navigation ul.control li label {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  color: #005c9e;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.tab-navigation ul.control li label:active,
.tab-navigation ul.control li label:hover {
  color: #69bd28;
}
.tab-navigation ul.control li label:before,
.tab-navigation ul.control li label:after {
  position: absolute;
  content: " ";
  display: none;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  z-index: 3;
  bottom: -26px;
  clear: none;
}
.tab-navigation ul.control li label:before {
  border-style: solid;
  border-width: 6px;
  border-color: #ffffff transparent transparent #ffffff;
  left: 50%;
  margin-left: -12px;
}
.tab-navigation ul.control li label:after {
  border-style: solid;
  border-width: 6px;
  border-color: #ffffff #ffffff transparent transparent;
  right: 50%;
  margin-right: -12px;
}
.tab-navigation ul.control li label i {
  display: block;
  line-height: 1.3em;
  font-size: 2em;
  font-family: WebSymbolsRegular;
  font-style: normal;
}
.tab-navigation ul.control li label i:before,
.tab-navigation ul.control li label i:after {
  position: absolute;
  content: " ";
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 12px;
  background: #ffffff;
  bottom: -28px;
  border-bottom: 2px solid #69bd28;
}
.tab-navigation ul.control li label i:before {
  margin-left: -30px;
  padding-left: 30px;
}
.tab-navigation ul.control li label i:after {
  margin-right: -30px;
  padding-right: 30px;
}
.tab-navigation ul.control li label b {
  font-weight: 400;
  display: block;
  z-index: 1;
}
.tab-navigation ul.control li label b:before,
.tab-navigation ul.control li label b:after {
  position: absolute;
  content: " ";
  display: none;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  z-index: 1;
  bottom: -28px;
  clear: none;
}
.tab-navigation ul.control li label b:before {
  border-style: solid;
  border-width: 7px;
  border-color: #69bd28 transparent transparent #69bd28;
  left: 50%;
  margin-left: -12px;
}
.tab-navigation ul.control li label b:after {
  border-style: solid;
  border-width: 7px;
  border-color: #69bd28 #69bd28 transparent transparent;
  right: 50%;
  margin-right: -12px;
}
.tab-navigation ul.control li.last:after {
  position: absolute;
  content: " ";
  display: block;
  margin: 0;
  padding: 0;
  bottom: 0;
  height: 12px;
  background: #ffffff;
  width: 1000%;
  right: -1000%;
  border-bottom: 2px solid #69bd28;
}
.tab-navigation ul.control li:last-child:after {
  position: absolute;
  content: " ";
  display: block;
  margin: 0;
  padding: 0;
  bottom: 0;
  height: 12px;
  background: #ffffff;
  width: 1000%;
  right: -1000%;
  border-bottom: 2px solid #69bd28;
}
.tab-navigation .views {
  position: relative;
}
.tab-navigation .content {
  position: relative;
  width: 888px;
  min-height: 324px;
  margin: 0;
  padding: 32px 16px 16px;
  background-color: #efefef;
  /*
		background-repeat: no-repeat;
		background-position: 0 0;
		*/

  overflow: hidden;
}
.tab-navigation .content .wrapper {
  position: relative;
  z-index: 2;
}
.tab-navigation .content h2,
.tab-navigation .content p {
  margin: 0 55% 1.25em 0;
}
.tab-navigation .content img.backdrop {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  overflow: hidden;
  z-index: 1;
}
.tab-navigation #view1:focus ~ .control li:nth-child(1) label b,
.tab-navigation #view2:focus ~ .control li:nth-child(2) label b,
.tab-navigation #view3:focus ~ .control li:nth-child(3) label b,
.tab-navigation #view4:focus ~ .control li:nth-child(4) label b,
.tab-navigation #view5:focus ~ .control li:nth-child(5) label b,
.tab-navigation #view6:focus ~ .control li:nth-child(6) label b {
  outline: 1px dotted #69bd28;
}
.tab-navigation #view1:checked ~ .views .content:nth-child(1),
.tab-navigation #view2:checked ~ .views .content:nth-child(2),
.tab-navigation #view3:checked ~ .views .content:nth-child(3),
.tab-navigation #view4:checked ~ .views .content:nth-child(4),
.tab-navigation #view5:checked ~ .views .content:nth-child(5),
.tab-navigation #view6:checked ~ .views .content:nth-child(6) {
  display: block;
}
.tab-navigation #view1:checked ~ .control li:nth-child(1) label,
.tab-navigation #view2:checked ~ .control li:nth-child(2) label,
.tab-navigation #view3:checked ~ .control li:nth-child(3) label,
.tab-navigation #view4:checked ~ .control li:nth-child(4) label,
.tab-navigation #view5:checked ~ .control li:nth-child(5) label,
.tab-navigation #view6:checked ~ .control li:nth-child(6) label {
  color: #69bd28;
}
.tab-navigation #view1:checked ~ .control li:nth-child(1) label:before,
.tab-navigation #view2:checked ~ .control li:nth-child(2) label:before,
.tab-navigation #view3:checked ~ .control li:nth-child(3) label:before,
.tab-navigation #view4:checked ~ .control li:nth-child(4) label:before,
.tab-navigation #view5:checked ~ .control li:nth-child(5) label:before,
.tab-navigation #view6:checked ~ .control li:nth-child(6) label:before,
.tab-navigation #view1:checked ~ .control li:nth-child(1) label:after,
.tab-navigation #view2:checked ~ .control li:nth-child(2) label:after,
.tab-navigation #view3:checked ~ .control li:nth-child(3) label:after,
.tab-navigation #view4:checked ~ .control li:nth-child(4) label:after,
.tab-navigation #view5:checked ~ .control li:nth-child(5) label:after,
.tab-navigation #view6:checked ~ .control li:nth-child(6) label:after,
.tab-navigation #view1:checked ~ .control li:nth-child(1) b:before,
.tab-navigation #view2:checked ~ .control li:nth-child(2) b:before,
.tab-navigation #view3:checked ~ .control li:nth-child(3) b:before,
.tab-navigation #view4:checked ~ .control li:nth-child(4) b:before,
.tab-navigation #view5:checked ~ .control li:nth-child(5) b:before,
.tab-navigation #view6:checked ~ .control li:nth-child(6) b:before,
.tab-navigation #view1:checked ~ .control li:nth-child(1) b:after,
.tab-navigation #view2:checked ~ .control li:nth-child(2) b:after,
.tab-navigation #view3:checked ~ .control li:nth-child(3) b:after,
.tab-navigation #view4:checked ~ .control li:nth-child(4) b:after,
.tab-navigation #view5:checked ~ .control li:nth-child(5) b:after,
.tab-navigation #view6:checked ~ .control li:nth-child(6) b:after {
  display: block;
}
.tab-navigation #view1:checked ~ .control li:nth-child(1) i:before,
.tab-navigation #view2:checked ~ .control li:nth-child(2) i:before,
.tab-navigation #view3:checked ~ .control li:nth-child(3) i:before,
.tab-navigation #view4:checked ~ .control li:nth-child(4) i:before,
.tab-navigation #view5:checked ~ .control li:nth-child(5) i:before,
.tab-navigation #view6:checked ~ .control li:nth-child(6) i:before {
  left: -12px;
  width: 50%;
}
.tab-navigation #view1:checked ~ .control li:nth-child(1) i:after,
.tab-navigation #view2:checked ~ .control li:nth-child(2) i:after,
.tab-navigation #view3:checked ~ .control li:nth-child(3) i:after,
.tab-navigation #view4:checked ~ .control li:nth-child(4) i:after,
.tab-navigation #view5:checked ~ .control li:nth-child(5) i:after,
.tab-navigation #view6:checked ~ .control li:nth-child(6) i:after {
  right: -12px;
  width: 50%;
}
.js .tab-navigation .content {
  display: none;
}
.ie .tab-navigation ul.control li label :before,
.ie .tab-navigation ul.control li label :after {
  display: none;
}
.ie .tab-navigation ul.control li label .be,
.ie .tab-navigation ul.control li label .af {
  position: absolute;
  content: " ";
  display: none;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: none;
  z-index: 3;
  bottom: -26px;
}
.ie .tab-navigation ul.control li label .be {
  border-style: solid;
  border-width: 6px;
  border-color: #ffffff transparent transparent #ffffff;
  left: 50%;
  margin-left: -12px;
}
.ie .tab-navigation ul.control li label .af {
  border-style: solid;
  border-width: 6px;
  border-color: #ffffff #ffffff transparent transparent;
  right: 50%;
  margin-right: -12px;
}
.ie .tab-navigation ul.control li label i :before,
.ie .tab-navigation ul.control li label i :after {
  display: none;
}
.ie .tab-navigation ul.control li label i .b,
.ie .tab-navigation ul.control li label i .a {
  position: absolute;
  content: " ";
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 12px;
  background: #ffffff;
  bottom: -28px;
  border-bottom: 2px solid #69bd28;
}
.ie .tab-navigation ul.control li label i .b {
  margin-left: -30px;
  padding-left: 30px;
}
.ie .tab-navigation ul.control li label i .a {
  margin-right: -30px;
  padding-right: 30px;
}
.ie .tab-navigation ul.control li label b .b,
.ie .tab-navigation ul.control li label b .a {
  position: absolute;
  content: " ";
  display: none;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  z-index: 1;
  bottom: -28px;
  clear: none;
}
.ie .tab-navigation ul.control li label b .b {
  border-style: solid;
  border-width: 7px;
  border-color: #69bd28 transparent transparent #69bd28;
  left: 50%;
  margin-left: -12px;
}
.ie .tab-navigation ul.control li label b .a {
  border-style: solid;
  border-width: 7px;
  border-color: #69bd28 #69bd28 transparent transparent;
  right: 50%;
  margin-right: -12px;
}
.ie .tab-navigation ul.control li.current label {
  color: #69bd28;
}
.ie .tab-navigation ul.control li.current label .be,
.ie .tab-navigation ul.control li.current label .af {
  display: block;
}
.ie .tab-navigation ul.control li.current label b .b,
.ie .tab-navigation ul.control li.current label b .a {
  display: block;
}
.ie .tab-navigation ul.control li.current label i .b {
  left: -12px;
  width: 50%;
}
.ie .tab-navigation ul.control li.current label i .a {
  right: -12px;
  width: 50%;
}
.ie .tab-navigation ul.control li.focus label b {
  outline: 1px dotted #69bd28;
}
@media screen {
  
}
@media print {
  
}
