test/public/themes/simple/css/less/base.less

html {
	-webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
body, h1, h2, h3, h4, h5, h6, dl, dd, p, hr {
	margin: 0;
}
button, option, textarea, td {
	padding: 0;
}
ul, ol, input {
	margin: 0;
	padding: 0;
}
ul, ol {
	list-style-type: none;
}
table {
	border-spacing: 0;
	border-collapse: collapse;
}
strong, b {
	font-weight: normal;
}
em, i {
	font-style: normal;
}
/* */
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
body, button, input, select, textarea {
	
}
button {
	border: none;
}
/*
*/
img {
	border: 0;
	vertical-align: middle;
}
input, textarea, select {
	outline: none;
}
:focus{
	outline:0;
}
a {
	color: #000;
	text-decoration: none;
}
textarea {
	resize: none;
}
/* 
::-ms-clear ï
::-ms-revealï
*/
::-ms-clear, ::-ms-reveal {
	display: none;
}
::-webkit-input-placeholder { /* WebKit browsers */ 
	color: #999 !important; 
} 
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
	color: #999 !important; 
} 
::-moz-placeholder { /* Mozilla Firefox 19+ */ 
	color: #999 !important; 
} 
:-ms-input-placeholder { /* Internet Explorer 10+ */ 
	color: #999 !important; 
} 
/**/
a ,button, input, textarea {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.l {
	float: left;
}
.r {
	float: right;
}
.clearfix {
	zoom: 1;
}
.clearfix:after,
.container:after,
.container01:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	overflow: hidden;
	visibility: hidden;
}
		html, body {
		    position: relative;
		    height: 100%;

		}
.container,
.container01 {
  /*padding-right: 15px;
  padding-left: 15px;*/
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container,
  .container01 {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container,
  .container01 {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
  .container01 {
  	width: 1053px;
  }
}
.container-fluid {
  /*padding-right: 15px;
  padding-left: 15px;*/
  margin-right: auto;
  margin-left: auto;
}



/*swiper*/
.swiper-hd .swiper-slide img {
	width: 100%;
}
.swiper-hd {
	/*padding-top: 50px;*/
	box-sizing: border-box;
}
.swiper-hd .swiper-pagination-bullet {
border: 1px solid #fff;border-radius: 50%;box-sizing: border-box;cursor: pointer;display: inline-block;height: 10px;width: 10px;
}
.swiper-hd .swiper-pagination-white .swiper-pagination-bullet-active {
	background:#fff;
}
.swiper-hd.swiper-container-horizontal .swiper-pagination {
	text-align: center;
	bottom: 30px;
	right: 0;
	left: 0;
}
.swiper-hd.swiper-container {
    width: 100%;
    height: 100%;
}
@media (max-width: 768px) {
.swiper-hd.swiper-container {
	height: 90%;
}
}
.swiper-hd .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #000;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    /*transition-duration: 500ms!important;*/
}
.swiper-hd .swiper-slide A.swiperA{
  display:block;  width:100%; height:100%; position: absolute; top:0; left:0;right:0;
}
.swiper-hd .swiper-button-next, 
.swiper-hd .swiper-button-prev {
	/*margin-top: 3px;*/
	display: none;
}
.swiper-hd .swiper-button-prev {
	/*left: 5%;*/
}
.swiper-hd .swiper-button-next {
	/*right: 5%;*/
}
.swiper-hd .swiper-slide .inSw-inner {
	margin: 0 auto;
}
.swiper-hd .swiper-slide p {
	color: #fff;
	/*font-size: 22px;*/
	font-size: 30px;
	line-height: normal;
	font-weight:bold;
	text-transform:uppercase;
	font-family: 'Ubuntu',"微软雅黑", Arial;
}
@media (min-width: 768px) {
	.swiper-hd {
		/*padding-top: 86px;*/
		/*padding-top: 66px;*/
	}
	.swiper-hd .swiper-slide p {
		font-size: 40px;
	}
	.swiper-hd .swiper-button-next, 
	.swiper-hd .swiper-button-prev {
		display: block;
	}
	.swiper-hd .swiper-slide p {
		font-size: 45px;
	}
}
@media (min-width: 992px) {
	.swiper-hd {
		/*padding-top: 86px;*/
		/*padding-top: 66px;*/
	}
	.swiper-hd .swiper-slide p {
		font-size: 56px;
	}
}
/*  */
.swiper-b2 {
	padding: 0 15px;
}
@media (min-width: 768px) {
	.swiper-b2 {
		padding: 0;
	}
}
.swiper-b2 .swiper-slide {
	position: relative;
}
.swiper-b2 .swiper-slide .swiper-vertical-div {
	position: absolute;
	/*padding: 40px 70px;*/
	background: rgba(255, 255, 255, 0.5);
	width: auto;
	/*height: 350px;*/
	left: 50%;
	top: 50%;
	/*margin-top: 20px;*/
	transform: translate(-50%, -50%);
	text-align: center;
	padding: 20px 15px 20px;
	box-sizing: border-box;
	/*display: none;*/
	opacity: 0;
	transition: all .6s ease-in;
}
.swiper-b2 .swiper-slide .swiper-vertical-div.h347 {
	height: auto;
}
.swiper-b2 .swiper-slide.swiper-slide-active .swiper-vertical-div {
	/*margin-top: 0;*/
	opacity: 1;
}
.swiper-b2 .swiper-vertical-div p {
	/*max-height: 84px;*/
	overflow: hidden;
}
@media (min-width: 768px) {
	.swiper-b2 .swiper-slide .swiper-vertical-div {
		width: 760px;
		padding: 40px 70px 40px;
	}
	.swiper-b2 .swiper-slide .swiper-vertical-div.h347 {
		height: 367px;
	}
	.swiper-b2 .swiper-vertical-div p {
		max-height: auto;
		
	}
}
.swiper-b2 .swiper-vertical-div img {
	width: 38px;
	height: 38px;
}
.swiper-b2 .swiper-vertical-div h5 {
	font-size: 28px;
	margin-top: 20px;
	font-family: 'granby_ef_lightregular';
}
@media (min-width: 768px) {
	.swiper-b2 .swiper-vertical-div h5 {
		margin-top: 32px;
	}
}
.swiper-b2 .swiper-vertical-div p {
	font-size: 19px;
    line-height: 1.4;
    font-weight: 400;
    margin-top: 14px;
	font-family: 'granby_ef_lightregular';
}
.swiper-b2 .swiper-vertical-div a {
	    font-size: 15px;
	    font-weight: 500;
	    text-transform: uppercase;
	    line-height: 1.6;
	    display: block;
	    width: 260px;
	    height: 34px;
	    line-height: 34px;
	    background: #fff;
	    text-align: center;
	    margin: 30px auto 0;
		font-family: 'granby_ef_lightregular';
		letter-spacing: 2px;
}
.swiper-b2 .swiper-container {
	height: 100%;
}
.swiper-b2 .swiper-vertical {
	margin-top: 30px;
	/*height: 300px;*/
	/*height: 348px;*/
}
@media (min-width: 768px) {
	.swiper-b2 .swiper-vertical {
		margin-top: 200px;
		/*height: 732px;*/
	}
}
.swiper-b2 .swiper-container-vertical .swiper-pagination-bullet {
	width: 3px;
	height: 28px;
	background-color: rgba(255, 255, 255, .6);
	border-radius: 0;
}
.swiper-b2 .swiper-container-vertical .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #fff;
}
.swiper-b2 .swiper-container-vertical>.swiper-pagination {
	right: 20px;
	display: none;
}
@media (min-width: 768px) {
	.swiper-b2 .swiper-container-vertical>.swiper-pagination {
		right: 50px;
		display: block;
	}
}











.swiper-slide,.swiper-wrapper {
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    width: 100%
}

.swiper-pagination,.swiper-wrapper {
    -webkit-transform: translate3d(0,0,0)
}

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
    -moz-transform: translate3d(0,0,0);
    -o-transform: translate(0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-slide,.swiper-wrapper {
    -ms-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-fles-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 27px 44px;
    -webkit-background-size: 27px 44px;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto
}

.swiper-button-prev,.swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto
}




.swiper-button-next,.swiper-container-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}


.swiper-pagination {
    position: absolute;
    text-align: center;
    -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-container-vertical>.swiper-pagination {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0,-50%,0);
    -moz-transform: translate3d(0,-50%,0);
    -o-transform: translate(0,-50%);
    -ms-transform: translate3d(0,-50%,0);
    transform: translate3d(0,-50%,0)
}

.swiper-container-vertical>.swiper-pagination .swiper-pagination-bullet {
    margin: 5px 0;
    display: block
}

.swiper-container-horizontal>.swiper-pagination {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet {
    margin: 0 5px
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    -o-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: -webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));
    background-image: -webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -moz-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));
    background-image: -webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -moz-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));
    background-image: -webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -moz-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));
    background-image: -webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -moz-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: -o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));
    background-image: linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))
}

.swiper-container-coverflow .swiper-wrapper {
    -ms-perspective: 1200px
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube {
    overflow: visible
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    visibility: hidden;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    width: 100%;
    height: 100%
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    -webkit-transform-origin: 100% 0;
    -moz-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    -webkit-filter: blur(50px);
    filter: blur(50px)
}

.swiper-container-cube.swiper-container-vertical .swiper-cube-shadow {
    z-index: 0
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0,0,0,.1)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0,0,0,.5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    -webkit-transform-origin: 50%;
    -moz-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: swiper-preloader-spin 1s step-end infinite;
    -moz-animation: swiper-preloader-spin 1s step-end infinite;
    animation: swiper-preloader-spin 1s step-end infinite
}

.swiper-lazy-preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-position: 50%;
    -webkit-background-size: 100%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}

@-webkit-keyframes swiper-preloader-spin {
    0% {
        -webkit-transform: rotate(0)
    }

    8.33333333% {
        -webkit-transform: rotate(30deg)
    }

    16.66666667% {
        -webkit-transform: rotate(60deg)
    }

    25% {
        -webkit-transform: rotate(90deg)
    }

    33.33333333% {
        -webkit-transform: rotate(120deg)
    }

    41.66666667% {
        -webkit-transform: rotate(150deg)
    }

    50% {
        -webkit-transform: rotate(180deg)
    }

    58.33333333% {
        -webkit-transform: rotate(210deg)
    }

    66.66666667% {
        -webkit-transform: rotate(240deg)
    }

    75% {
        -webkit-transform: rotate(270deg)
    }

    83.33333333% {
        -webkit-transform: rotate(300deg)
    }

    91.66666667% {
        -webkit-transform: rotate(330deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }

    8.33333333% {
        transform: rotate(30deg)
    }

    16.66666667% {
        transform: rotate(60deg)
    }

    25% {
        transform: rotate(90deg)
    }

    33.33333333% {
        transform: rotate(120deg)
    }

    41.66666667% {
        transform: rotate(150deg)
    }

    50% {
        transform: rotate(180deg)
    }

    58.33333333% {
        transform: rotate(210deg)
    }

    66.66666667% {
        transform: rotate(240deg)
    }

    75% {
        transform: rotate(270deg)
    }

    83.33333333% {
        transform: rotate(300deg)
    }

    91.66666667% {
        transform: rotate(330deg)
    }

    100% {
        transform: rotate(360deg)
    }
}






/*mousebtn*/

.swiper-container .mousebtn { position:absolute; bottom:20%;right:0 ;left:0; display:inline-block;  width: 32px;height:62px;margin:0 auto; text-align:center;}

.swiper-container .mouse {
  position: relative;
  width: 32px;
  height: 62px;
  margin: 0 auto 20px;
  background: none;
  /*border: 2px solid white;*/background:url(../images/dropdown.png) no-repeat 50% 50% ;
  border-radius:32px;
  z-index: 1;
}
.swiper-container .mouse:after {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 50%;
/*  width: calc(1px * 2); 
  height: calc(4px * 2);*/width:6px;height:18px;
  background: none;
 /* border: 2px solid white;*/background:url(../images/dropdown2.png) no-repeat 50% 50% ;
  border-radius: 100%;
  -webkit-animation-name: scrollWheel;
          animation-name: scrollWheel;
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  will-change: transform;
}

@-webkit-keyframes scrollWheel {
  from {
    -webkit-transform: translate(-50%, 0);
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate(-50%, 0);
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
  to {
    -webkit-transform: translate(-50%, 20px);
    -webkit-transform: translate3d(-50%, 20px, 0);
    transform: translate(-50%, 20px);
    transform: translate3d(-50%, 20px, 0);
    opacity: 0;
  }
  @media (min-width: 768px) {
    from {
      -webkit-transform: translate(-50%, 0);
      -webkit-transform: translate3d(-50%, 0, 0);
      transform: translate(-50%, 0);
      transform: translate3d(-50%, 0, 0);
      opacity: 1;
    }
    to {
      -webkit-transform: translate(-50%, 40px);
      -webkit-transform: translate3d(-50%, 40px, 0);
      transform: translate(-50%, 40px);
      transform: translate3d(-50%, 40px, 0);
      opacity: 0;
    }
  }
}

@keyframes scrollWheel {
  from {
    -webkit-transform: translate(-50%, 0);
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate(-50%, 0);
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
  to {
    -webkit-transform: translate(-50%, 20px);
    -webkit-transform: translate3d(-50%, 20px, 0);
    transform: translate(-50%, 20px);
    transform: translate3d(-50%, 20px, 0);
    opacity: 0;
  }
/*  @media (min-width: 768px) {
    from {
      -webkit-transform: translate(-50%, 0);
      -webkit-transform: translate3d(-50%, 0, 0);
      transform: translate(-50%, 0);
      transform: translate3d(-50%, 0, 0);
      opacity: 1;
    }
    to {
      -webkit-transform: translate(-50%, 40px);
      -webkit-transform: translate3d(-50%, 40px, 0);
      transform: translate(-50%, 40px);
      transform: translate3d(-50%, 40px, 0);
      opacity: 0;
    }
  }*/
}
	
@media (min-width: 768px){
/*.swiper-container .mouse {
    width: 32px;
    height: 62px;
    margin: 0 auto 0px;
    background: none;
    border: 2px solid white;
    border-radius: 32px;
}*/
}