@font-face {
    font-family: 'tcb';
    src: url('../fonts/tcb.eot');
    src: url('../fonts/tcb.eot') format('embedded-opentype'),
         url('../fonts/tcb.woff2') format('woff2'),
         url('../fonts/tcb.woff') format('woff'),
         url('../fonts/tcb.ttf') format('truetype'),
         url('../fonts/tcb.svg#tcb') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
a{text-decoration: none;}
.bachchapartyPage{
    font-family: 'tcb', san-serif;
    position: relative;
    background: #f4f1e5;
    width: 30%;
    margin: 0 auto;
}
.bachchapartyPageDiv{position: relative;background: #010306}
.bachchapartyPage .playArea{z-index: 999;background: #f4f1e5;}
.bachchapartyPage .dandiyaLoaderImage{width: 30%;}

.bachchapartyPage .userName{font-size: 25px;font-weight: 600;text-transform: uppercase;color: #fae3b5;line-height: 1.2;}
.bachchapartyPage .subtext{font-size: 16px;font-weight: 600;text-transform: uppercase;color: #fae3b5;line-height: 1.2;margin: 0;}
.bachchapartyPage .subtext span{color: #ffc038;}
.bachchapartyPage .fromUser{width: 18%;margin: 0 auto;display: block;}
.bachchapartyPage .fromUser img{max-width: 100%;display: block;}
.bachchapartyPage  .shrBoxList li a{color:#526876}

.userName{
  animation: bop 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards infinite alternate;
}
@keyframes bop {
  0% {
    transform: scale(0.4);
  }
  50%,
  100% {
    transform: scale(1);
  }
}
.bachchapartyPage .mainImage{z-index: 1;position: relative;}
.bachchapartyPage .header{position: absolute;top: 0;z-index: 99;width: 100%;}
.bachchapartyPage .header .saregamaLogo, .bachchapartyPage .header .rpsgLogo{padding: 10px;}
.bachchapartyPage .userNameArea{position: absolute;top: 7%;z-index: 99;width: 100%;margin: 0 auto;text-align: center;}
.bachchapartyPage .setName{position: absolute;bottom: 4%;z-index: 99;width: 100%;margin: 0 auto;text-align: center;padding: 0;}
.bachchapartyPage .textEntry{background: transparent;border-color: #526876;width: 76%;}
.bachchapartyPage .textInfo{width: 82%}
.bachchapartyPage .formSubArea{width: 76%;background: none;border: 1px solid #526876;color:#526876;}
.bachchapartyPage .inputField, .bachchapartyPage .textInfo{color: #526876;}
.bachchapartyPage .videoBlock{width: 80%;margin: 0 auto 15px;}
.bachchapartyPage .videoBlock iframe{margin-bottom: 10px;height: 170px;}
.bachchapartyPage .shareClose{color: #526876;left: 1%}

.bachchapartyPage ::-webkit-input-placeholder { /* Edge */
    color: #526876;
}
.bachchapartyPage :-ms-input-placeholder { /* Internet Explorer */
    color: #526876;
}
.bachchapartyPage ::placeholder {
    color: #526876;
}
.lineAnimation{overflow: hidden;}

.lineAnimation span{
    position: absolute;
    display: block;
}
.lineAnimation span:nth-child(1){
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #526876);
    animation: animate1 1s linear infinite;
}
@keyframes animate1{
    0%{
        left: -100%;
    }
    50%,100%{
        left: 100%;
    }
}
.lineAnimation span:nth-child(2){
    top: -100%;
    right: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, transparent, #526876);
    animation: animate2 1s linear infinite;
    animation-delay: 0.25s;
}
@keyframes animate2{
    0%{
        top: -100%;
    }
    50%,100%{
        top: 100%;
    }
}
.lineAnimation span:nth-child(3){
    bottom: 0;
    right: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(270deg, transparent, #526876);
    animation: animate3 1s linear infinite;
    animation-delay: 0.50s;
}
@keyframes animate3{
    0%{
        right: -100%;
    }
    50%,100%{
        right: 100%;
    }
}
.lineAnimation span:nth-child(4){
    bottom: -100%;
    left: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(360deg, transparent, #526876);
    animation: animate4 1s linear infinite;
    animation-delay: 0.75s;
}
@keyframes animate4{
    0%{
        bottom: -100%;
    }
    50%,100%{
        bottom: 100%;
    }
}
@keyframes spinning {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}
.spin {
    animation-name: spinning;
    animation-duration: 7s;
    animation-iteration-count: infinite;
    /* linear | ease | ease-in | ease-out | ease-in-out */
    animation-timing-function: linear;
}

@media screen and (min-width: 320px) and (max-width: 359px){
    .dandiyaLoader{padding: 15% 0 0;}
    .bachchapartyPage .dandiyaLoaderImage{width: 75%;}
    .playArea h4{line-height: 1.4;}
    .bachchapartyPage{width: 100%;background: #070b16;}
    .bachchapartyPage .header{padding: 0;}
    .bachchapartyPage .header .saregamaLogo, .bachchapartyPage .header .rpsgLogo{padding: 5px;}
    /* .bachchapartyPage .mainImage img{padding-top: 4%;} */
    .userNameArea{margin-top: 3%;}
    .bachchapartyPage  .userName{font-size: 170%;}
    .bachchapartyPage  .fromUser{width: 35%;}
    .buyNowArea{width: 30%;}
    .centerBlock, .textEntry, .formSubArea, .textInfo{width: 75%;height: 32px;}
    .bachchapartyPage .inputBtn{top: 0px;right: 0px;}
    .bachchapartyPage .setName{bottom: 3%;}
    .bgSectCont{padding-bottom: 10px;}
    .bachchapartyPage  .textInfo{width: 83%;height: 25px;}

    .formSubArea{float: right;margin-right: 10%;border-color: #feeacb;width: 70%;}
    .shrBoxList li a{font-size: 20px;top: 7px;}
    .shareClose{left: 2% ;top: 26%;color: #feeacb;}
    .inputField{width: 75%;height: 32px;line-height: 32px;font-size: 12px;}
    .bachchapartyPage .videoBlock{margin: 0 auto 15px; width: 85%}
    .bachchapartyPage .videoBlock iframe{margin-bottom: 10px;height: 140px;}
    .bachchapartyPage .formSubArea{width: 70%}
}

@media screen and (min-width: 360px) and (max-width: 767px){
    .dandiyaLoader{padding: 15% 0 0;}
    .playArea h4{line-height: 1.4;}
    .bachchapartyPage .dandiyaLoaderImage{width: 75%;}
    .bachchapartyPage{width: 100%;background: #070b16;}
    .bachchapartyPage .header{padding: 0;}
    .bachchapartyPage .header .saregamaLogo, .bachchapartyPage .header .rpsgLogo{padding: 5px;}
    /* .bachchapartyPage .mainImage img{padding-top: 4%;} */
    .bachchapartyPage .formSubArea{width: 70%}
    .userNameArea{margin-top: 3%;}
    .bachchapartyPage .userName{font-size: 200%;}
    .bachchapartyPage .subtext{font-size: 16px;}
    .bachchapartyPage .fromUser{width: 35%;}
    .bachchapartyPage .inputBtn{top: 0px;right: 0px;}
    .bachchapartyPage .setName{bottom: 5%;}
    .buyNowArea{width: 30%;}
    .textInfo{width: 80%;}
    .centerBlock, .textEntry, .formSubArea{width: 75%;height: 32px;}
    .bgSectCont{padding-bottom: 20px;}
    .formSubArea{float: right;margin-right: 12%;border-color: #feeacb;width: 65%;}
    .shrBoxList li a{font-size: 20px;top: 7px;}
    .shareClose{left: 3% ;top: 26%;color: #feeacb;}
    .refresh span{font-size: 34px;}
    .inputField{width: 75%;height: 32px;line-height: 32px;font-size: 12px;}
    .bachchapartyPage .videoBlock{margin: 0 auto 15px;}
    .bachchapartyPage .videoBlock iframe{margin-bottom: 10px;height: 190px;}
}