.banner{
    position:relative;
}
.effect{
	position: absolute;
	top: 28px;
	width: 100%;
	text-align:center;
	padding-right: 30%;
}
.effect_name{
	font-family: tahoma;
    font-weight: bold;
    text-shadow: -2px 0 white, 0 2px white, 0px 0 white, 0 -2px white;
    color: #2377c3;
    font-size: 24px;
    padding-bottom: 0px;
    letter-spacing: 1px;
}
.effect_name_en{
	font-family: tahoma;
    font-weight: bold;
    padding-bottom: 2px;
    letter-spacing: 1px;
    font-size: 19px;
    color: #e1060a;
    text-shadow: -1px 0 #ffffff, 0 1px white, 0px 0 white, 0 -1px white;
}
.effect_logan{
	font-family: tahoma;
    font-weight: bold;
    text-shadow: -1px 0 #fff, 0 1px #fff, 0px 0 #fff, 0 -1px #fff;
    color: #3c4a8a;
    font-size: 20px;
    padding-top: 10px;
    letter-spacing: 1px;
}
@media only screen and (max-width: 1150px)
{
    .effect {
        top: 30px;
        padding-right: 27%;
    }
    .effect_name {
        font-size: 23px;
        padding-bottom: 0px;
    }
    .effect_name_en {
       font-size: 21px; 
    }
    .effect_logan {
        display:none;
        font-size: 19px;
    }
}
@media only screen and (max-width: 1050px)
{
    .effect {
        top: 35px;
        padding-right: 27%;
    }
    .effect_name {
        font-size: 21px;
    }
    .effect_name_en {
       font-size: 19px; 
    }
    .effect_logan {
        font-size: 19px;
    }
}
@media only screen and (max-width: 991px)
{
    .effect {
        top: 50px;
        padding-right: 5%;
    }
    .effect_name {
        font-size: 23px;
    }
    .effect_logan {
        font-size: 19px;
    }
}
@media only screen and (max-width: 850px)
{
    .effect {
        top: 45px;
        padding-right: 3%;
    }
    .effect_name {
        font-size: 21px;
    }
    .effect_name_en {
        font-size: 19px;
    }
    .effect_logan {
        font-size: 18px;
    }
}
@media only screen and (max-width: 768px)
{
    .effect {
        top: 70px;
        padding-right: 5%;
    }
    .effect_name {
        font-size: 20px;
    }
    .effect_name_en {
        font-size: 17px;
    }
    .effect_logan {
        font-size: 16px;
    }
}
@media only screen and (max-width: 700px)
{
    .effect {
        top: 62px;
        padding-right: 3%;
    }
    .effect_name {
        font-size: 18px;
    }
    .effect_name_en {
        font-size: 16px;
    }
    .effect_logan {
        font-size: 15px;
    }
}
@media only screen and (max-width: 650px)
{
    .effect {
        top: 54px;
        padding-right: 1%;
        padding-left: 1%;
    }
    .effect_name {
        font-size: 17px;
    }
    .effect_name_en {
        font-size: 14px;
    }
    .effect_logan {
        font-size: 14px;
    }
}
@media only screen and (max-width: 550px)
{
    .effect {
        top: 55px;
        padding-right: 1%;
        padding-left: 20%;
    }
    .effect_name {
        font-size: 17px;
    }
    .effect_name_en {
        font-size: 15px;
    }
    .effect_logan {
        font-size: 12px;
    }
}
@media only screen and (max-width: 500px)
{
    .effect {
        top: 50px;
        padding-left: 20%;
        padding-right: 0%;
    }
    .effect_name {
        font-size: 15px;
    }
    .effect_name_en {
        font-size: 14px;
    }
    .effect_logan {
        font-size: 12px;
    }
}
@media only screen and (max-width: 450px)
{
    .effect {
        top: 47px;
        padding-right: 0%;
        padding-left:18%;
    }
    .effect_name {
        font-size: 14px;
    }
    .effect_name_en {
        font-size: 13px;
    }
    .effect_logan {
        font-size: 12px;
    }
}
@media only screen and (max-width: 400px)
{
    .effect {
        top: 44px;
        padding-right: 0%;
        padding-left:20%;
    }
    .effect_name {
        font-size: 13px;
    }
    .effect_name_en {
        font-size: 12px;
    }
    .effect_logan {
        font-size: 11px;
    }
}
@media only screen and (max-width: 350px)
{
    .effect {
        top: 38px;
        padding-right: 0%;
        padding-left:16%;
    }
    .effect_name {
        font-size: 12px;
    }
    .effect_logan {
        font-size: 11px;
    }
}
.star {
    position: absolute;
    background: url(js/animation/julie-logo-sparkle.png) no-repeat;
    background-size: contain;
    overflow: hidden;
}
.star.star-1 {
    width: 50px;
    height: 44px;
        top: 70px;
left: 9%;
}
.star.star-2 {
    width: 83px;
    height: 77px;
    top: 18px;
    left: 5%;

}
.star.star-3 {
    width: 74px;
    height: 70px;
        top: 15px;
left: 11%;
}
.star.star-4 {
    width: 68px;
    height: 70px;
        top: 75px;
left: 4%;
}
/*.star.star-5 {
    width: 68px;
    height: 70px;
    top: 7px;
        left: 138px;
} */
.star.star-11 {
    width: 68px;
    height: 70px;
        top: 68px;
left: 14%;
}

.star.star-6 {
    width: 85px;
    height: 90px;
        top: 16px;
left: 52%;

}
.star.star-7 {
    width: 74px;
    height: 70px;
        top: 70px;
right: 36%;
}
.star.star-8 {
    width: 74px;
    height: 70px;
        top: 86px;
left: 44%;
}
.star.star-12 {
    width: 74px;
    height: 70px;
        top: 53px;
left: 30%;
}
    	
/*.star.star-9 {
    width: 74px;
    height: 70px;
        top: 57px;
right: 286px;

}
.star.star-10 {
    width: 74px;
    height: 70px;
        top: 33px;
right: 23px;
}
.star.star-13 {
    width: 74px;
    height: 70px;
        top: 73px;
right: 209px;
} */