@import url("font/font.css");
@import url("reset.css");

/*
.tabset > input[type="radio"] { position: absolute; left: -200vw;}

.tabset .tab-panel { display: none;}

.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6),
.tabset > input:nth-child(13):checked ~ .tab-panels > .tab-panel:nth-child(7) {  display: block;}

Styling

body { font: 16px/1.5em "Overpass", "Open Sans", Helvetica, sans-serif;  color: #333;  font-weight: 300;}
.tabset > label {
  position: relative;
  display: inline-block;
  padding: 20px 15px 25px 19px;
  border: 1px solid transparent;

  cursor: pointer;
  font-weight: 600;
}*/
/*
.tabset > label::after {content: ""; position: absolute; left: 15px; bottom: 10px; width: 22px; height: 4px; background: #8d8d8d;}
.tabset > label:hover,.tabset > input:focus + label { color: #06c;}
.tabset > label:hover::after,
.tabset > input:focus + label::after,
.tabset > input:checked + label::after { background: #e5282e;}

.tabset > input:checked + label { border-color: #ccc; border-bottom: 1px solid #fff; border-top: 1px solid #fff; margin-bottom: -1px; margin-top: -1px; color:#e5282e !important;}
.tab-panel { padding: 10px 0 30px 0;  border-top: 1px solid #ccc;}


*,*:before,*:after {box-sizing: border-box;}
html, body {padding: 0px; margin:0px; background: url(images/bg02.png) repeat-x #FFF; border: none; font-family: 'Roboto', sans-serif;}
.tabset { max-width: 1100px; border-top: 1px solid #dfdfdf; }
Demo purposes only*/





p{ padding:0; margin:0;}





.pages-box{ width:1100px; margin:0px auto;}
.ta-t{ font-size:14px; line-height:20px;}
.taw{ color:#FFFFFF;}


.wrapperin {margin-top: 0px;}

.flexslider {
  width: 100%; 
  max-width: 1100px;
  /*min-width: 580px;*/
  margin: 0px auto;
  position: relative;
}
.flexslider .slides {
  list-style: none;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.flexslider .slides > li {
  float: left;
  margin-right: -100%;
  width: 100%;
  overflow: hidden;
  height: 609px;
  position: relative;
}
.flexslider .flex-direction-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* .flexslider .flex-direction-nav .flex-prev, .flexslider .flex-direction-nav .flex-next {
  background-color: rgba(255, 255, 255, 0.7);
  color: #333;
  padding: 10px 20px;
  text-decoration: none;
  position: absolute;
  height: 1em;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index: 8;
  text-align: center;
} */
.flexslider .flex-direction-nav .flex-prev {
  left: 0;
}
.flexslider .flex-direction-nav .flex-next {
  right: 0;
}

.slide-image {
  background-size: cover;
  background-position: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.flex-active-slide .slide-image {
  -webkit-animation: zoomout 5s;
          animation: zoomout 5s;
}

@-webkit-keyframes zoomout {
  0% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes zoomout {
  0% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}







































/* 
.flexslider {
  width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.flexslider li {
  height: 300px;
} 



.flex-nav-prev{ top:200px;}*/


/* slider
------------------------------------------------------- */
.flexslider {
  min-height: 609px;
  margin-bottom: 80px;

/*   -webkit-box-shadow: 0px 5px 6px -1px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 5px 6px -1px rgba(0, 0, 0, 0.2); */
}
.flexslider:after {
  content: '';
  display: block;
  width: 80%;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  z-index: -1;
  bottom: -5px;
  left: 10%;
  -webkit-box-shadow: 0 2px 10px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 10px 10px rgba(0, 0, 0, 0.2);
}

.flexslider:before {
/*  content: '';
  display: block;
  width: 80%;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  z-index: -1;
  top: -5px;
  left: 10%;
  -webkit-box-shadow: 0 2px 10px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 10px 10px rgba(0, 0, 0, 0.2);*/
}

.slides li {
  display: block;
/*   width: 800px;
  height: 368px; */
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
}
/*.slide-text { position: relative; background: #fff; background: rgba(255, 255, 255, 0.9);
  top: 0px; left: -30px; width: 455px; height: 580px; overflow: hidden; float: right;}*/
  
.slide-text{position: relative; font-family: 'DINPro-Regular'; }
.slide-textin{position: absolute; width: 455px; height: 580px; right:30px; top:0px; z-index:555; background: #fff; background: rgba(255, 255, 255, 0.9); border-bottom:6px solid #e5282e;}    
.topslide{width:455px; height:45px;  background:#e5282e; } 
.topslide span{float:left; padding:11px 0px 0px 30px; text-align:left; color:#FFFFFF; font-family: 'DINPro-Medium'; font-size:15px; text-transform: uppercase;} 
.topslide-b {width:170px; height:45px; background:#676767; float:right; }
.topslide-b p{float:left; padding:11px 0px 0px 30px; text-align:left; color:#FFFFFF; font-family: 'DINPro-Medium'; font-size:15px; text-transform: uppercase;} 


 a.btnbn{position:absolute; bottom:0; left:50%; padding:14px 30px 16px 30px; text-align: center; color:#FFFFFF; background:#e5282e; font-family: 'DINPro-Medium'; font-size:15px;
  font-weight:600; letter-spacing:7px; margin-left:-95px;} 
 a.btnbn:hover{ background:#000000; } 

.packtext{ max-width:400px;  margin:40px auto 40px auto; } 
.hpaxk{font-size:28px; color:#e5282e; font-weight:600; font-family: 'DINPro-Medium';text-transform:uppercase; } 
.hpaxk p{font-size:17px; color:#000000; /*line-height:28px;*/ }

.bpice{ border:1px solid #000000; margin:30px auto 30px auto;} 
ul.hpice{ width:340px; margin:25px auto 25px auto; height: 40px;} ul.hpice li{ float:left; display: block; }
ul.hpice li.hp01{width:120px; padding-top:0px; text-transform:uppercase; line-height:16px;} 
ul.hpice li.hp01 p{/**/font-weight:600; padding-top:0px; font-size:14px;}
ul.hpice li.hp02{width:165px; font-size:35px;  font-family: "Helvetica", sans-serif; font-weight: bold; letter-spacing:-1px; text-align:right; padding-right:10px; }
ul.hpice li.hp02 span{ font-size:20px; color:#6d6464; font-weight: normai;}

.fbo{ font-weight:bold !important;}

ul.hpice li.hp03{width:45px; font-size:18px; padding-top:15px; }  
  
 .plin { width:390px; margin:0px auto; font-size:16px; font-family:"DINPro-Regular", sans-serif;;}  
 .plin p{ line-height:20px; padding-bottom:15px;} 
 
 ul.bhad{width:390px; margin-top:10px;}  
 ul.bhad li{width:175px; padding-left:20px; background: url(../images/pack/icnp01.png) no-repeat 0 4px; float: left; font-size:15px; margin-bottom:15px;
 color:#ac875a; font-weight:600; text-transform:uppercase;}
  
  
/*.slides li .slide-text h2 {
  font-size: 24px;
  margin-bottom: 15px;
  margin-top: 0px;
}*/

.flex-control-nav {
  bottom: 30px;
  z-index: 99;
}
.flex-control-nav li {
  margin: 0 2px; /*float: left;*/
}

.flex-control-paging li a {
  background-color: #e9e9e9;
  background-image: -moz-linear-gradient(top, whitesmoke, #d9d9d9);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(whitesmoke), to(#d9d9d9));
  background-image: -webkit-linear-gradient(top, whitesmoke, #d9d9d9);
  background-image: -o-linear-gradient(top, whitesmoke, #d9d9d9);
  background-image: linear-gradient(to bottom, #f5f5f5, #d9d9d9);
  background-repeat: repeat-x;
  -webkit-box-shadow: inset 0 -1px 0 0 white, 0 1px 0 0 rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 -1px 0 0 white, 0 1px 0 0 rgba(0, 0, 0, 0.1);
  border: 1px solid #ededed;
  height: 14px;
  width: 14px;
}
.flex-control-paging li a.flex-active {
  background: #ef3a34;
  border-color: #ef3a34;
  -webkit-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.5), 0 1px 0 0 rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.5), 0 1px 0 0 rgba(0, 0, 0, 0.25);
}
.flex-control-paging li a:hover {
  background: #015697;
  border-color: #015697;
  -webkit-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.5), 0 1px 0 0 rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.5), 0 1px 0 0 rgba(0, 0, 0, 0.25);
}

.flex-active-slide .slide-image {
  -webkit-animation: zoomout 5s;
          animation: zoomout 5s;
}

@-webkit-keyframes zoomout {
  0% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}



.slide-image {
  background-size: cover;
  background-position: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.flex-active-slide .slide-image {
  -webkit-animation: zoomout 5s;
          animation: zoomout 5s;
}

@-webkit-keyframes zoomout {
  0% {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}