.showmenu1:hover ul{
	display: block;
}

.showmenu1 ul{
	display: none;
}

.myblock1{
	width: 100%;
	position: relative;
}
.myblock5 {
    position: relative;
	margin: 10px auto;
	width: 100%;
	max-width: 2000px;
	min-width: 260px;
	height: 15vw;
    min-height: 70px;
	border: 5px solid #fff;
	border: 5px solid rgba(255,255,255,0.9);
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.myblock3 {
    background: #7d7f72;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.myblock2 {
    background: url(../CSS3images/map2.png) repeat-x scroll 0 0;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.myblock5 input {
    position: absolute;
	bottom: 15px;
	left: 50%;
	width: 15px;
	height: 15px;
	z-index: 1001;
	cursor: pointer;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
}

.myblock5 input + label {
    position: absolute;
    bottom: 10px;
	left: 50%;
    width: 12px;
	height: 12px;
	display: block;
	z-index: 1000;
	border: 2px solid #fff;
	border: 2px solid rgba(255,255,255,0.9);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: background-color linear 0.1s;
    -moz-transition: background-color linear 0.1s;
    -o-transition: background-color linear 0.1s;
    -ms-transition: background-color linear 0.1s;
    transition: background-color linear 0.1s;
}
.myblock5 input:checked + label {
	background-color: #0f0;
    background-color: rgba(6, 155, 7, 0.90);
}

.myblockA-1, .button-label-1 {
    margin-left: -36px;
}

.myblockA-2, .button-label-2 {
    margin-left: -18px;
}

.myblockA-3, .button-label-3 {
    margin-left: 0px;
}

.myblockA-4, .button-label-4 {
    margin-left: 18px;
}

.myblockA-5, .button-label-5 {
    margin-left: 36px;
}

.myblockB {
    position: absolute;
	top: 50%;
	width: 28px;
	height: 38px;
	margin-top: -19px;
	display: none;
	opacity: 0.8;
	cursor: pointer;
	z-index: 1000;
	background: transparent url(../CSS3images/arrows.png) no-repeat;
	-webkit-transition: opacity linear 0.3s;
    -moz-transition: opacity linear 0.3s;
    -o-transition: opacity linear 0.3s;
    -ms-transition: opacity linear 0.3s;
    transition: opacity linear 0.3s;
}
.myblockB:hover{
	opacity: 1;
}
.myblockB:active{
	margin-top: -18px;
}
.myblockA-1:checked ~ .myblockB.section2,
.myblockA-2:checked ~ .myblockB.section3,
.myblockA-3:checked ~ .myblockB.section4,
.myblockA-4:checked ~ .myblockB.section5 {
    right: 15px;
	display: block;
	background-position: top right;
}
.myblockA-2:checked ~ .myblockB.section1,
.myblockA-3:checked ~ .myblockB.section2,
.myblockA-4:checked ~ .myblockB.section3,
.myblockA-5:checked ~ .myblockB.section4 {
    left: 15px;
	display: block;
	background-position: top left;
}

.myblock5 input:checked ~ .myblock3 {
    -webkit-transition: background-position linear 0.6s, background-color linear 0.8s;
    -moz-transition: background-position linear 0.6s, background-color linear 0.8s;
    -o-transition: background-position linear 0.6s, background-color linear 0.8s;
    -ms-transition: background-position linear 0.6s, background-color linear 0.8s;
    transition: background-position linear 0.6s, background-color linear 0.8s;
}

.myblock5 input:checked ~ .myblock3 .myblock2 {
    -webkit-transition: background-position linear 0.7s;
    -moz-transition: background-position linear 0.7s;
    -o-transition: background-position linear 0.7s;
    -ms-transition: background-position linear 0.7s;
    transition: background-position linear 0.7s;
}

input.myblockA-1:checked ~ .myblock3 {
    background-position: 0 0;
	background-color: #c4c6a9;
}

input.myblockA-2:checked ~ .myblock3 {
    background-position: -100px 0;
	background-color: #b4d1b6;
}

input.myblockA-3:checked ~ .myblock3 {
    background-position: -200px 0;
	background-color: #d2b4b3;
}

input.myblockA-4:checked ~ .myblock3 {
    background-position: -300px 0;
	background-color: #abaccc;
}

input.myblockA-5:checked ~ .myblock3 {
    background-position: -400px 0;
	background-color: #adcacb;
}

input.myblockA-1:checked ~ .myblock3 .myblock2 {
    background-position: 0 0;
}

input.myblockA-2:checked ~ .myblock3 .myblock2 {
    background-position: -150px 0;
}

input.myblockA-3:checked ~ .myblock3 .myblock2 {
    background-position: -300px 0;
}

input.myblockA-4:checked ~ .myblock3 .myblock2 {
    background-position: -450px 0;
}

input.myblockA-5:checked ~ .myblock3 .myblock2 {
    background-position: -600px 0;
}

.myblockC {
    position: relative;
	left: 0;
    width: 500%;
	height: 100%;
	list-style: none;
    margin: 0;
	padding: 0;
    -webkit-transition: left ease-in 0.8s;
    -moz-transition: left ease-in 0.8s;
    -o-transition: left ease-in 0.8s;
    -ms-transition: left ease-in 0.8s;
    transition: left ease-in 0.8s; 
}

.myblockC > li {
	color: #fff;
	width: 20%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	height: 100%;
	padding: 0 60px;
    float: left;
	text-align: center;
	opacity: 0.4;
    -webkit-transition: opacity ease-in 0.4s 0.8s;
    -moz-transition: opacity ease-in 0.4s 0.8s;
    -o-transition: opacity ease-in 0.4s 0.8s;
    -ms-transition: opacity ease-in 0.4s 0.8s;
    transition: opacity ease-in 0.4s 0.8s; 
}
.myblockC > li img{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	margin: 0 auto;
	padding: 5px 0 5px 0;
	max-height: 100%;
	max-width: 100%;
}
input.myblockA-1:checked ~ .myblock3 .myblockC {
    left: 0;
}

input.myblockA-2:checked ~ .myblock3 .myblockC {
    left: -100%;
}

input.myblockA-3:checked ~ .myblock3 .myblockC {
    left: -200%;
}

input.myblockA-4:checked ~ .myblock3 .myblockC {
    left: -300%;
}

input.myblockA-5:checked ~ .myblock3 .myblockC {
    left: -400%;
}

input.myblockA-1:checked ~ .myblock3 .myblockC > li:first-child,
input.myblockA-2:checked ~ .myblock3 .myblockC > li:nth-child(2),
input.myblockA-3:checked ~ .myblock3 .myblockC > li:nth-child(3),
input.myblockA-4:checked ~ .myblock3 .myblockC > li:nth-child(4),
input.myblockA-5:checked ~ .myblock3 .myblockC > li:nth-child(5){
	opacity: 1;
}

ul#mymenucss,ul#mymenucss ul{ 
    margin:0;list-style:none;background-color:#FFFFFF;border-width:0;border-style:solid;border-color:black;
}
ul#mymenucss ul{
    display:none;position:absolute;left:0;top:14px;padding:0 3px 3px;background-color:#FFFFFF;border-width:0 1px 1px 1px;border-radius:0 4px 4px 4px;-moz-border-radius:0 4px 4px 4px;-webkit-border-radius:0;-webkit-border-top-right-radius:4px;-webkit-border-bottom-right-radius:4px;-webkit-border-bottom-left-radius:4px;border-style:solid;border-color:black;
}
ul#mymenucss li:hover>*{ display:block;}
ul#mymenucss li:hover{ position:relative;}
ul#mymenucss ul ul{ position:absolute;left:100%;top:0;border-width:1px;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;}
ul#mymenucss{ padding:10px 10px 10px 0;display:block;font-size:0;float:left;}
ul#mymenucss li{ display:block;white-space:nowrap;font-size:0;float:left;}
ul#mymenucss>li,ul#mymenucss li{ margin:0 0 0 10px;}
ul#mymenucss ul>li{ margin:10px 0 0;}
ul#mymenucss a:active, ul#mymenucss a:focus{ outline-style:none;}
ul#mymenucss a{ display:block;vertical-align:middle;text-align:left;text-decoration:none;font:12px Helvetica,Arial,sans-serif;color:black;cursor:pointer;padding:4px 10px 6px 10px;background-color:#FFFFFF;background-repeat:repeat;border-width:0px;border-style:solid;border-color:black;}
ul#mymenucss ul li{ float:none;margin:3px 0 0;}
ul#mymenucss ul a{ text-align:left;padding:4px 10px 0px 40px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:black;text-decoration:none;}
ul#mymenucss ul a.black{ text-align:left;padding:4px 10px 0px 25px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:black;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul a.blue{ text-align:left;padding:4px 10px 0px 25px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:blue;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul a.gray{ text-align:left;padding:4px 10px 0px 25px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:gray;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul a.gray:hover{ text-align:left;padding:4px 10px 0px 25px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:gray;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul a.maroon{ text-align:left;padding:4px 10px 0px 25px;background-color:#FFFFFF;border-width:1px 0 1px 0;border-style:solid;border-color:#FFFFFF;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:12px Helvetica,Arial,sans-serif;color:#D00000;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss li:hover>a{ background-color:#FFFFFF;border-style:none;font:12px Helvetica,Arial,sans-serif;color:black;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul li:hover>a{ padding-left:25px; background-color:#b9e4fd;border-style:solid;border-color:#b9e4fd;font:12px Helvetica,Arial,sans-serif;color:black;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss ul li:active>a{ transform:translateY(3px); padding-left:25px; background-color:#b9e4fd;border-style:solid;border-color:#b9e4fd;font:12px Helvetica,Arial,sans-serif;color:black;text-decoration:none;font-family:Tahoma, Helvetica, Arial, 'Microsoft Yahei','微软雅黑', STXihei, '华文细黑', sans-serif;}
ul#mymenucss.topmenu{ border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px; }
ul#mymenucss li.topmenu>a{ height:17px;line-height:17px; }
ul#mymenucss li.topmenu:hover>a{ line-height:17px; }
ul#mymenucss li.toproot>a{ height:30px; position: relative;bottom: 10px; height:24px;line-height:16px;background-color:#F0F0F0;border-width:1px 1px 0 1px;border-style:solid;border-color:transparent;border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;-webkit-border-radius:4px;-webkit-border-bottom-right-radius:0;-webkit-border-bottom-left-radius:0;}
ul#mymenucss li.toproot:hover>a{ line-height:16px;background-color:#FFFFFF;border-style:solid;border-color:black;}

#mySaleItems {
    width: 1000px;
    overflow: hidden;
    margin: 50px auto;
    background: white;
}

/*photobanner*/
.salebanner11 {
    height: 240px;
    width: 5740px;
    margin-bottom: 20px;
}

.salebanner11 img {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.salebanner11 img:hover {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -o-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
        cursor: pointer;
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
        -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
        box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
}

/*keyframe animations*/
.sales11 {
    -webkit-animation: bannermove 30s linear infinite;
    -moz-animation: bannermove 30s linear infinite;
    -ms-animation: bannermove 30s linear infinite;
    -o-animation: bannermove 30s linear infinite;
    animation: bannermove 30s linear infinite;
}

/* "bannermove" ? - this -4290px more minus -> more delay */
@keyframes bannermove {
    0% {
    margin-left: 0px;
}

    100% {
        margin-left: -4293px;
    }

}

@-moz-keyframes bannermove {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -4293px;
    }
}

/* "bannermove" ? */
@-webkit-keyframes bannermove {
    0%
{
    margin-left: 0px;
}

    100% {
        margin-left: -4293px;
    }

}

/* "bannermove" ? */
@-ms-keyframes bannermove {
    0%
{
    margin-left: 0px;
}

    100% {
        margin-left: -4293px;
    }

}

/* "bannermove" ? */
@-o-keyframes bannermove {
    0%
{
    margin-left: 0px;
}

    100% {
        margin-left: -4293px;
    }
}

/*keyframe animations - ectdshow */
.ectdshow1 {
    -webkit-animation: ectdshowmove 60s linear infinite;
    -moz-animation: ectdshowmove 60s linear infinite;
    -ms-animation: ectdshowmove 60s linear infinite;
    -o-animation: ectdshowmove 60s linear infinite;
    animation: ectdshowmove 60s linear infinite;
}

/* "ectdshowmove"  */
@keyframes ectdshowmove {
    0% {
        margin-left: -300%;
    }
    10% {
        margin-left: -200%;
    }
    40% {
        margin-left: -200%;
    }
    60% {
        margin-left: 0%;
    }
    90% {
        margin-left: 0%;
    }
    100% {
        margin-left: 100%;
    }
}

@-moz-keyframes ectdshowmove {
    0% {
        margin-left: -300%;
    }
    10% {
        margin-left: -200%;
    }
    40% {
        margin-left: -200%;
    }
    60% {
        margin-left: 0%;
    }
    90% {
        margin-left: 0%;
    }
    100% {
        margin-left: 100%;
    }
}

@-webkit-keyframes ectdshowmove {
    0% {
        margin-left: -300%;
    }
    10% {
        margin-left: -200%;
    }
    40% {
        margin-left: -200%;
    }
    60% {
        margin-left: 0%;
    }
    90% {
        margin-left: 0%;
    }
    100% {
        margin-left: 100%;
    }
}

@-ms-keyframes ectdshowmove {
    0% {
        margin-left: -300%;
    }
    10% {
        margin-left: -200%;
    }
    40% {
        margin-left: -200%;
    }
    60% {
        margin-left: 0%;
    }
    90% {
        margin-left: 0%;
    }
    100% {
        margin-left: 100%;
    }
}

@-o-keyframes ectdshowmove {
    0% {
        margin-left: -300%;
    }
    10% {
        margin-left: -200%;
    }
    40% {
        margin-left: -200%;
    }
    60% {
        margin-left: 0%;
    }
    90% {
        margin-left: 0%;
    }
    100% {
        margin-left: 100%;
    }
}

/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 280px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}

/*keyframe animations*/
.progress1 {
    -webkit-animation-name: dot1;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: dot1;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-name: dot1;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    animation-name: dot1;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.progress2 {
    -webkit-animation-name: dot2;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: dot2;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-name: dot2;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    animation-name: dot2;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.progress3 {
    -webkit-animation-name: dot3;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: dot3;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-name: dot3;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    animation-name: dot3;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.progress4 {
    -webkit-animation-name: dot4;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: dot4;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-name: dot4;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    animation-name: dot4;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.progress5 {
    -webkit-animation-name: dot5;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: dot5;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-name: dot5;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    animation-name: dot5;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

/*need to include the browser-specific keyframe animations ?? */
@-webkit-keyframes dot1 {
    0% { opacity: 0; }
    15% { opacity: 0; }
    17% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-webkit-keyframes dot2 {
    0% { opacity: 0; }
    31% { opacity: 0; }
    33% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-webkit-keyframes dot3 {
    0% { opacity: 0; }
    48% { opacity: 0; }
    50% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-webkit-keyframes dot4 {
    0% { opacity: 0; }
    65% { opacity: 0; }
    67% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-webkit-keyframes dot5 {
    0% { opacity: 0; }
    82% { opacity: 0; }
    84% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes dot1 {
    0% { opacity: 0; }
    15% { opacity: 0; }
    17% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes dot2 {
    0% { opacity: 0; }
    31% { opacity: 0; }
    33% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes dot3 {
    0% { opacity: 0; }
    48% { opacity: 0; }
    50% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes dot4 {
    0% { opacity: 0; }
    65% { opacity: 0; }
    67% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes dot5 {
    0% { opacity: 0; }
    82% { opacity: 0; }
    84% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-o-keyframes dot1 {
    0% { opacity: 0; }
    15% { opacity: 0; }
    17% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-o-keyframes dot2 {
    0% { opacity: 0; }
    31% { opacity: 0; }
    33% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-o-keyframes dot3 {
    0% { opacity: 0; }
    48% { opacity: 0; }
    50% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-o-keyframes dot4 {
    0% { opacity: 0; }
    65% { opacity: 0; }
    67% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@-o-keyframes dot5 {
    0% { opacity: 0; }
    82% { opacity: 0; }
    84% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes dot1 {
    0% { opacity: 0; }
    15% { opacity: 0; }
    17% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes dot2 {
    0% { opacity: 0; }
    31% { opacity: 0; }
    33% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes dot3 {
    0% { opacity: 0; }
    48% { opacity: 0; }
    50% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes dot4 {
    0% { opacity: 0; }
    65% { opacity: 0; }
    67% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes dot5 {
    0% { opacity: 0; }
    82% { opacity: 0; }
    84% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}

.wrapper5{
    width: 100%;
    height: 100%;
}
.wrapper5 video{    
    width: 20%;
    height: auto;
    margin-top:10%;
    animation-name: Mshow3, Mshow4, noshow1;
    animation-duration: 37s, 6s, 40000s;
    animation-timing-function: linear, linear, linear;
    animation-delay: 0s, 31s, 37s;
    animation-iteration-count: 1, 1, 1;
    animation-direction: normal, normal, normal;
    animation-fill-mode: none, none, none;
    animation-play-state: running, running, running;
}
@keyframes Mshow3 {
  0%   {margin-left: 0%;}
  100% {margin-left: 89%;}
}
@keyframes Mshow4 {
  0% {width: 20%; margin-top: 10;}
  100% {width: 0%; margin-top: 14%;}
}
@keyframes noshow1 {
  0% {visibility: hidden;}
  100% {visibility: hidden;}
}

.wrapper6 {
    position: relative;
    animation-name: move-css, noshow2;
    animation-duration: 35s, 40000s;
    animation-timing-function: linear, linear;
    animation-delay: 3s, 38s;
    animation-iteration-count: 1, 1;
    animation-direction: normal, normal;
    animation-fill-mode: none, none;
    animation-play-state: running, running;
  margin: 0;
}
@keyframes move-css {
  0% { left: 0%; }
  100% { left: -190%; }
}
@keyframes noshow2 {
  0% {visibility: hidden;}
  100% {visibility: hidden;}
}