﻿body {
	margin: 0px;
}
.text_box_1 {
	font-family: "Times New Roman", Times, serif;
	color: #4C4C4C;
	padding: 15px;
	text-align: center;
	background-color: #FFCC00;
	display: block;
	overflow: hidden;
}
.text_box_2 {
	font-family: "Times New Roman", Times, serif;
	color: #FFFFFF;
	padding: 15px;
	text-align: center;
	background-color: #66C06F;
	display: block;
	overflow: hidden;
}
.text_box_big {
	font-size: 74px;
}
.text_box_small {
	font-size: 30px;
}
.text_box_v_small {
	font-size: 20px;
}
.text_box_color_dark {
	color: #4C4C4C;
}
* {
	outline: 0px;
}








/*--Animation Start--*/
.bx-wrapper li, .bxslider_blk {
	height: 610px;
}
#bx-pager a:last-child {
	border-right: 0px;
}
img {
	max-width: 100%;
}
.active_slide {
				
}
.slide_1:before {
	background-image: url("../img/slide-1-bg-a.jpg");
}
.slide_2:before {
	background-image: url("../img/slide-2-bg-a.jpg");
}
.slide_3:before {
	background-image: url("../img/slide-3-bg-a.jpg");
}
.slide_4 {
    list-style: none;
    position: relative;
    width: 1903px;
    height: 590px;
    float: left;
}
.slide_4:before {
	background-image: url("../img/slide-4-bg-a.jpg");
}

.slide_5:before {
	background-image: url("../img/slide-5-bg-a.jpg");
}
.slide_6:before {
	background-image: url("../img/slide-6-bg.jpg");
}
.slide_7:before {
	background-image: url("../img/slide-7-bg.jpg");
}
.slide_8:before {
	background-image: url("../img/slide-8-bg.jpg");
}
.slide_9:before {
	background-image: url("../img/slide-9-bg.jpg");
	opacity: 1 !important;
}
.slide_10:before {
	background-image: url("../img/slide-5-bg-a.jpg");
}
.slide_11:before {
	background-image: url("../img/slide-11-bg.jpg");
	background-size: auto 100% !important;
	opacity: 0.2 !important;
}
.slide_12:before {
	background-image: url("../img/slide-12-bg.jpg");
}
.slide_13:before {
	background-image: url("../img/slide-13-bg.jpg");
	opacity: 1 !important;
}
.bxslider {
	background-image: url("../img/slide-all-bg.jpg");
	background-position: center center;
	background-repeat: repeat-x;
}
.slide_1:before, .slide_2:before, .slide_3:before, .slide_4:before, .slide_5:before, .slide_6:before, .slide_7:before, .slide_8:before, .slide_9:before, .slide_10:before, .slide_11:before, .slide_12:before, .slide_13:before {
	background-position: center center;
	background-repeat: repeat-x;
	background-size: auto 100%;
	content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.6;
}
.slide_13 #slide_13_text_blk .text_box_1, .slide_13 #slide_13_text_blk .text_box_2 {
	background-color: transparent !important;
	margin: 0px 60px;
}
.slide_13 #slide_13_text_blk .text_box_1 .text_box_big {
	font-size: 60px;
}
.slide_2_bg_b {
	background-image: url("../img/slide-2-bg-b.png");
	background-position: center 0px;
	background-repeat: repeat-x;
	animation: animateBg 6s linear infinite;
}
.active_slide .slide_2_bg_c {
	background-image: url("../img/slide-2-bg-c.png");
	background-position: center 30px;
	background-repeat: no-repeat;
	animation: animateBgFadeUp 2s linear;
}
.slide_4_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_5_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_6_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_7_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_8_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_9_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_10_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_11_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_12_bg_b {
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
.slide_13_bg_b {
	height: 600px;
	background-image: url("../img/slide-4-bg-b.png");
	background-position: center center;
	background-repeat: no-repeat;
	animation: animateBg4 60s linear infinite;
}
@keyframes animateBg {
	from { background-position: 0px center; }
	to { background-position: 100% center; }
}
@keyframes animateBg4 {
	0% { background-position: 0px center; }
	50% { background-position: 10% center; }
	100% { background-position: 0px center; }
}
@keyframes animateBgFadeUp {
	0% { background-position: center 660px; }
	60% { background-position: center 660px; }
	100% { background-position: center bottom; }
}
.plant_1 {
	opacity: 0;
	right: -60px;
	bottom: -10px;
	position: absolute;
	z-index: 6;
	-webkit-filter: drop-shadow(5px 5px 10px #4C4C4C); 
}
.active_slide .plant_1, .active_slide .plant_2 {
	opacity: 1;
}
.plant_2 {
	opacity: 0;
	right: 260px;
	bottom: -10px;
	position: absolute;
	z-index: 6;
	-webkit-filter: blur(5px);
}
.plant_2 img {
	opacity: .6;
}
.active_slide .faidIn {
	animation: faidIn 2s linear;
}
.active_slide .faidIn2 {
	animation: faidIn2 4s linear;
}
@keyframes faidIn {
	from { opacity: 0; bottom: -100%; }
	to { opacity: 1; bottom: -10px; }
}
@keyframes faidIn2 {
	0% { opacity: 0; bottom: -100% }
	60% { opacity: 0; bottom: -100% }
	100% { opacity: 1; bottom: -10px; }
}
.animate_1, .animate_2 {
	display: none;
}
.active_slide .animate_1 {
	display: block;
	position: absolute;
	animation-delay: 2s;
	animation: animateMove 10s linear infinite;
	z-index: 2;
}
@keyframes animateMove {
	0% { top: 260px; right: -60px; transform: rotate(0deg); }
	45% { top: 90px; right: 50%; transform: rotate(-25deg); }
	65% { top: 120px; right: 75%; transform: rotate(-45deg); }
	100% { top: 20px; right: 130%; transform: rotate(0deg); }
}
.active_slide .animate_2 {
	display: block;
	opacity: 0.8;
	position: absolute;
	z-index: 10;
	animation-delay: 2s;
	animation: animateMove2 15s linear infinite;
}
@keyframes animateMove2 {
	0% { top: 380px; right: -60px; transform: rotate(0deg); }
	20% { top: 380px; right: -60px; transform: rotate(0deg); }
	40% { top: 300px; right: 25%; transform: rotate(-25deg); }
	60% { top: 360px; right: 50%; transform: rotate(-45deg); }
	80% { top: 100px; right: 75%; transform: rotate(-25deg); }
	100% { top: 10px; right: 110%; transform: rotate(0deg); }
}
.flower {
	width: 100px;
	bottom: -30px;
	left: 200px;
	opacity: 0.8;
	transform: rotate(-20deg);
	position: absolute;
}




#slide_1_born_img {
	width: auto;
	margin: 120px 0px 180px;
	display: inline-block;
	float: left;
}
#slide_2_born_img {
	width: auto;
	margin: 20px 20px 20px 0px;
	display: inline-block;
	float: right;
}
#slide_3_born_img {
	width: auto;
	margin: 60px 20px 200px 200px;
	display: inline-block;
	float: left;
}
#slide_4_born_img {
	width: auto;
	margin: 20px 20px 20px 100px;
	display: inline-block;
	float: left;
	
	position: absolute;
    z-index: 1;
    left: 0px;
}
#slide_5_born_img {
	width: auto;
	margin: 36px 20px 290px 460px;
	display: inline-block;
	float: left;
}
#slide_6_born_img {
	width: auto;
	margin: 83px 20px 250px 280px;
	display: inline-block;
	float: left;
}
#slide_7_born_img {
	width: auto;
	margin: 293px 20px 40px 130px;
	display: inline-block;
	float: left;
}
#slide_8_born_img {
	width: auto;
	left: 0px;
	margin: 153px 20px 190px 330px;
	display: inline-block;
	position: absolute;
	z-index: 1;
	float: left;
}
#slide_9_born_img {
	width: auto;
	margin: 130px 20px 60px 530px;
	display: inline-block;
	float: left;
}
#slide_10_born_img {
	width: auto;
	margin: 63px 20px 60px 460px;
	display: inline-block;
	float: left;
}
#slide_11_born_img {
	width: auto;
	margin: 273px 20px 60px 460px;
	display: inline-block;
	float: left;
}
#slide_12_born_img {
	width: auto;
	top: 176px;
	right: 361px;
	display: inline-block;
	position: absolute;
	z-index: 1;
	float: left;
}
#slide_13_born_img {
	width: auto;
	margin: 273px 20px 60px 460px;
	display: inline-block;
	float: left;
}
#slide_1_born_img img, #slide_2_born_img img, #slide_3_born_img img {
    animation: imageeffects 6s 1 linear;
}
@keyframes imageeffects {
  0% {
    -webkit-filter: sepia(.7);
  	filter: sepia(.7);
  }
   50% {
    -webkit-filter: sepia(.7);
  	filter: sepia(.7);
  }
  100% {
    -webkit-filter: sepia(0);
  	filter: sepia(0);
  }
}

#slide_1_born_img2 {
	top: 60px;
	right: 270px;
	position: absolute;
	z-index: 2;
}
#slide_1_born_img3 {
	top: 30px;
	right: 151px;
	position: absolute;
	z-index: 1;
}
#slide_1_born_img4 {
	top: 214px;
	right: 20px;
	position: absolute;
	z-index: 2;
}

#slide_2_born_img2 {
	top: 20px;
	right: 470px;
	position: absolute;
	z-index: 1;
}
#slide_2_born_img3 {
	top: 352px;
	left: 131px;
	position: absolute;
	z-index: 1;
}

#slide_1_text_blk {
	top: 227px;
	right: 0%;
	margin-right: 480px;
	position: absolute;
	z-index: 1;	
}
#slide_2_text_blk {
	width: 530px;
	top: 227px;
	right: 460px;
	position: absolute;
	z-index: 1;	
}
#slide_3_text_blk {
	width: 470px;
	top: 288px;
	left: 443px;
	position: absolute;
	z-index: 1;	
}
#slide_4_text_blk {
	width: 500px;
    top: 284px;
    left: 260px;
    position: absolute;
    z-index: 0;	
}
#slide_4_text_blk .text_box_1 {
	margin-right: 60px;
}
#slide_5_text_blk {
	width: 633px;
	top: 314px;
	left: 297px;
	position: absolute;
	z-index: 0;	
}
#slide_5_born_img2, #slide_10_born_img2 {
	top: 83px;
	left: 180px;
	position: absolute;
	z-index: 1;
}
#slide_6_born_img2, #slide_11_born_img2 {
	top: 136px;
	left: 180px;
	position: absolute;
	z-index: 1;
}
#slide_6_born_img3 {
	top: 176px;
	left: 800px;
	position: absolute;
	z-index: 1;
}
#slide_6_text_blk {
	width: 890px;
    top: 360px;
    left: 143px;
    position: absolute;
    z-index: 0;	
}
#slide_7_text_blk {
	width: 470px;
	top: 358px;
    left: 600px;
	position: absolute;
	z-index: 0;	
}
#slide_7_text_blk .text_box_1 {
	margin-right: 220px;
}
#slide_8_text_blk {
	width: 1000px;
    top: 153px;
    left: 120px;
	position: absolute;
	z-index: 0;	
}
#slide_8_text_blk .text_box_1 {
	width: 180px;
    float: left;
}
#slide_8_text_blk .text_box_2 {
	width: 290px;
    margin-top: 146px;
    float: right;
}
#slide_9_text_blk {
	width: 820px;
    top: 293px;
    left: 180px;
	position: absolute;
	z-index: 0;	
}
#slide_9_text_blk .text_box_1 {
	margin: 0px 470px 0px 120px;
}
#slide_10_text_blk {
	width: 630px;
    top: 315px;
    right: 270px;
	position: absolute;
	z-index: 0;	
}
#slide_11_text_blk {
	width: 630px;
    top: 180px;
    right: 360px;
	position: absolute;
	z-index: 0;	
}
#slide_12_text_blk {
	width: 470px;
    top: 60px;
    left: 369px;
	position: absolute;
	z-index: 0;	
}
#slide_12_text_blk .text_box_2 {
	margin-top: 279px;
}
.slide_13_text_top_bg {
	width: 100%;
	height: 66px;
	background-image: url("../img/slide-13-text-bg.png");
	background-position: center top;
	background-repeat: no-repeat;
	margin-top: -30px;
}
#slide_13_text_blk {
	width: 472px;
	background-image: url("../img/slide-13-text-bg.png");
	background-position: center bottom;
	background-repeat: no-repeat;
	top: 100px;
	right: 130px;
	padding-bottom: 66px;
	position: absolute;
	z-index: 0;	
}
#slide_2_text_blk .text_box_2 {
	margin-left: 60px;
}
#slide_13_text_blk .text_box_2 .text_box_small {
	color: #895612;
}
#slide_3_text_blk .text_box_1 {
	width: auto;
	margin-left: 248px;
}
.film_role_side_left, .film_role_side_right {
	width: 48px;
	height: 515px;
	background-image: none;
	top: 46px;
	position: absolute;
	z-index: 0;
}
.active_slide .film_role_side_left, .active_slide .film_role_side_right {
	background-image: url("../img/film-role-side.png");
	background-position: center bottom;
	background-repeat: no-repeat;
}
.film_role_side_left {
	right: 822px;
}
.film_role_side_right {
	right: 322px;
}














.bxslider_blk {
	width: 1200px;
	max-width: 100%;
	position: relative;
	display: inline-block;
}
.bxslider_img img, .text_box_1, .text_box_2, #slide_13_text_blk, .bxslider_img {
	visibility: hidden;
}
#slide_3_text_blk .text_box_2 {
	text-align: left;
}

.active_slide .bxslider_img img, .active_slide .text_box_1, .active_slide .text_box_2, .active_slide #slide_13_text_blk, .active_slide .bxslider_img {
	visibility: visible;
}

.active_slide .animateleft {
	animation: animateleft ease 1s;
	animation-iteration-count: 1;
	transform-origin: 50% 50%;
}

@keyframes animateleft {
  0% {
    transform:  translate(-200%,0px)  ;
  }
  100% {
    transform:  translate(3px,0px)  ;
  }
}

.active_slide .animateright {
	animation: animateright ease 1s;
	animation-iteration-count: 1;
	transform-origin: 50% 50%;
}

@keyframes animateright {
  0% {
    transform:  translate(200%,0px)  ;
  }
  100% {
    transform:  translate(3px,0px)  ;
  }
}



.active_slide .animatepaper {
	height: 360px;
	animation: animatepaper ease 2s;
	animation-iteration-count: 1;
	transform-origin: 50% 50%;
}

@keyframes animatepaper {
  0% {
    height: 0px;
    transform:  translate(200%,0px)
  }
  50% {
    height: 0px;
    transform:  translate(3px,0px)
  }
  100% {
    height: 360px;
    transform:  translate(3px,0px)
  }
}





.active_slide #slide_1_born_img, .active_slide #slide_2_born_img, .active_slide #slide_3_born_img, .active_slide #slide_5_born_img, .active_slide #slide_6_born_img, .active_slide #slide_7_born_img, .active_slide #slide_8_born_img, .active_slide #slide_9_born_img {
	animation: bornimg 2s 1 linear;
	opacity: 1;
}
@keyframes bornimg {
	0% {padding: 100px 0px 0px 200px; opacity: 0; transform: scale(0) translateX(200%); }
	50% {padding: 100px 0px 0px 200px; opacity: 0; transform: scale(0) translateX(200%); }
	100% {padding: 0px 0px 0px 0px; opacity: 1; transform: scale(1) translateX(0); }
}

.active_slide #slide_4_born_img, .active_slide #slide_5_born_img2, .active_slide #slide_6_born_img2, .active_slide #slide_6_born_img3, .active_slide #slide_10_born_img2, .active_slide #slide_11_born_img2, .active_slide #slide_12_born_img, .active_slide .film_role_side_left, .active_slide .film_role_side_right {
	animation: faidIn 2s 1 linear;
	opacity: 1;
}
@keyframes faidIn {
	0% {opacity: 0; }
	50% {opacity: 0; }
	100% {opacity: 1; }
}

@keyframes movelefttoright {
	0% {padding: 100px 0px 0px 200px; opacity: 0; transform: scale(0) translateX(200%); }
	50% {padding: 100px 0px 0px 200px; opacity: 0; transform: scale(0) translateX(200%); }
	100% {padding: 0px 0px 0px 0px; opacity: 1; transform: scale(1) translateX(0); }
}




.active_slide #slide_1_born_img2 {
	animation: bornimg2 4s 1 linear;
	opacity: 1;
}
@keyframes bornimg2 {
	0% {opacity: 0; transform: scale(0) translate(0%,0px); }
	50% {opacity: 0; transform: scale(0) translate(0%,0px); }
  	60% {opacity: 1; transform: scale(1) translate(0px,0px); }
  	100% {opacity: 1; transform: scale(1) translate(0px,0px); }
}



.active_slide #slide_1_born_img3, .active_slide #slide_2_born_img2 {
	animation: bornimg3 4s 1 linear;
	opacity: 1;
}
@keyframes bornimg3 {
	0% {opacity: 0; transform: scale(0) translate(0%,0px); }
	50% {opacity: 0; transform: scale(0) translate(0%,0px); }
  	60% {opacity: 1; transform: scale(1) translate(0px,0px); }
  	100% {opacity: 1; transform: scale(1) translate(0px,0px); }
}



.active_slide #slide_1_born_img4, .active_slide #slide_2_born_img3 {
	animation: bornimg4 4s 1 linear;
	opacity: 1;
}
@keyframes bornimg4 {
	0% {opacity: 0; transform: scale(0) translate(0%,0px); }
	50% {opacity: 0; transform: scale(0) translate(0%,0px); }
  	60% {opacity: 1; transform: scale(1) translate(0px,0px); }
  	100% {opacity: 1; transform: scale(1) translate(0px,0px); }
}





@keyframes fadeInRight { 
    0% { 
        opacity: 0; 
        transform: translateX(100%); 
    } 
    100% { 
        opacity: 1; 
        transform: translateX(0); 
    } 
} 
/*--Animation End--*/

































.effect1 img, .effect2 img, .effect3 img, .effect4 img, .effect5 img, .effect6 img, .effect7 img, .effect8 img {
	border: 6px #FFFFFF solid;
	border-image: url(../img/border.png) 10 round;
}
/*-- Effect 1 --*/
.effect1
{
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}

/*-- Effect 2 --*/
.effect2
{
    position: relative;
}
.effect2:before, .effect2:after
{
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width:300px;
    background: #777;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
    transform: rotate(-3deg);
}
.effect2:after
{
    transform: rotate(3deg);
    right: 10px;
    left: auto;
}

/*-- Effect 3 --*/
.effect3
{
    position: relative;
}
.effect3:before
{
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width:300px;
    background: #777;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
    transform: rotate(-3deg);
}

/*-- Effect 4 --*/
.effect4
{
    position: relative;
}
.effect4:after
{
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    right: 10px;
    left: auto;
    width: 50%;
    top: 80%;
    max-width:300px;
    background: #777;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
    transform: rotate(3deg);
}

/*-- Effect 5 --*/
.effect5
{
    position: relative;
}
.effect5:before, .effect5:after
{
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 25px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width:300px;
    background: #777;
    -webkit-box-shadow: 0 35px 20px #777;
    -moz-box-shadow: 0 35px 20px #777;
    box-shadow: 0 35px 20px #777;
    -webkit-transform: rotate(-8deg);
    -moz-transform: rotate(-8deg);
    -o-transform: rotate(-8deg);
    -ms-transform: rotate(-8deg);
    transform: rotate(-8deg);
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect5:after
{
    -webkit-transform: rotate(8deg);
    -moz-transform: rotate(8deg);
    -o-transform: rotate(8deg);
    -ms-transform: rotate(8deg);
    transform: rotate(8deg);
    right: 10px;
    left: auto;
}

/*-- Effect 6 --*/
.effect6
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect6:before, .effect6:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect6:after
{
    right:10px;
    left:auto;
    transform:skew(8deg) rotate(3deg);
}

/*-- Effect 7 --*/
.effect7
{
    position:relative;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect7:before, .effect7:after
{
    content:"";
    position:absolute;
    z-index:-1;
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    border-radius:100px / 10px;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect7:after
{
    right:10px;
    left:auto;
    transform:skew(8deg) rotate(3deg);
}

/*-- Effect 8 --*/
.effect8 {
    position:relative;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect8:before, .effect8:after {
    content:"";
    position:absolute;
    z-index:-1;
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    border-radius:100px / 10px;
    -webkit-filter: drop-shadow(5px 5px 10px #4C4C4C);
}
.effect8:after {
    right:10px;
    left:auto;
    transform:skew(8deg) rotate(3deg);
}

.rain {
    width: auto;
    position: relative;
    overflow: hidden;
}
.rain:before {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    background: transparent repeat;
    -webkit-animation-name: weather;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-name: rain;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.rain:before {
    width: 100%;
    height: 100%;
    background-image: url(../img/rain.png);
    left: 0px;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
}
.rain:after {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
}
/* animation keyframes */
@-webkit-keyframes rain {
    from { background-position: 0 0px; }
    to { background-position: 0 1024px; }
}
@keyframes rain {
    from { background-position: 0 0px; }
    to { background-position: 0 1024px; }
}