@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {width:95%;}
body{background-image:url("../images/bg-screen.jpg"); background-size:cover; font-family: "Roboto", serif; font-style: normal; color:var(--colour-white);}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {    margin-bottom: 0px;}

 p {margin-bottom:0px; color:var(--colour-white);}

:root{
	--colour-white:#fff;
	--org-colour:#FEB71C;
	--purple-colour:#591562;
	--light-purple-colour:#9C09AF;
	--light-red-colour:#d70c0f;
	--drak-purple-colour:#28022E;
}



.mauka-heding-logo{display:flex; align-items: center;}
.mauka-heding-logo a{width:13%;}
.mauka-heding-logo img{width:100%;}
.mauka-heding-logo h1{font-size:35px; line-height: 35px; font-weight:bold; text-transform:uppercase;}
.mauka-heding-logo h1 span{font-size:22px; font-weight: normal; color: var(--colour-white); text-transform:capitalize; line-height:0px;}

.player-box{display:flex; align-items: center;}
.player-photo{ height:auto; border-radius:100%; width:45%; box-shadow: -7px -5px 0px var(--org-colour);}
.player-photo img{border-radius:100%;}


.icon-bat img{position:absolute; width: 80px; margin-left:25px; margin-top: -180px;}

.player-info{}
.player-info h2{font-size:32px; font-weight:bold; color:var(--org-colour); text-transform:uppercase;}
.player-info ul{color:var(--colour-white); font-size: 23px; margin-left: 10px; padding-top: 10px;}
.player-info ul li{ padding:5px 0px; }

.brober-all{border:solid 1px var(--org-colour); border-radius:15px;}


.point-bid-box{
	width:80%; border-radius:15px; border:solid 1px var(--org-colour);
display: flex;
	position: relative;
		justify-content: space-around;
	align-items: center;
/*	text-align: center;*/
	text-transform: uppercase;
	padding:20px;
	margin-top: 50px;

}



.vertical-line{
	height:65%;
	position: absolute;
	border-left:1px solid var(--org-colour);}




.point-box{
	width: 47%;
	padding-left: 50px;
}

.point-box h3{font-size:33px; color:var(--org-colour);}
.point-box p{font-size:22px; text-transform:capitalize;}




.player-information-box{padding:0px 3px;}
.main-bid-amount{display:flex;position: relative; align-items: center; background-color:var(--purple-colour); margin:15px 0px;}
.main-bid-amount h2{font-size:45px; color:var(--org-colour); font-weight:700;}
.rsimg{border-right: solid 1px var(--org-colour); text-align: center; padding: 10px; margin-right:20px; width: 100px;}
.rsimg img{width:55px;}
.team-logo{width: 100px; text-align: center;}
.team-logo img{width:70px;}

.bat-bow-list{border:none; display:flex; justify-content: space-between; align-items: center; background-color:var(--drak-purple-colour); border-radius:10px!important;}
.bat-bow-list .active{background-color: var(--light-purple-colour) !important; border:none; color:var(--colour-white);}
.ball-img.active{background-color: var(--light-red-colour) !important; border:none; color:var(--colour-white);}
 .bat-bow-list p:nth-child(2) {color:var(--org-colour); font-size:20px; font-weight:500;}

.bat-img{background-color: var(--light-purple-colour); border-radius:10px 0px 0px 10px !important; color:var(--colour-white) !important;}
.ball-img {background-color:var(--light-red-colour); border-radius:0px 10px 10px 0px !important; color:var(--colour-white) !important;}

.ball-img img{width:50px;}
.bat-img img{width:50px;}

.bat-box{}
.bat-box ul{ margin:0px; padding:0px; }
.bat-box li{display: flex; justify-content: space-between; align-items: center; /*background-color:var(--light-purple-colour);  */ background-color: rgba(156, 9, 175, .7);     padding:8px 20px;
    margin-bottom: 5px; font-size: 18px;}
.bat-box li span{ font-size:20px; font-weight:500;}
.bat-box li:last-child {background-color:var(--drak-purple-colour);}
.bat-box li:last-child span{color:var(--org-colour);}

.ball-box li{background-color: rgba(250, 30, 33, .7); }


.footer-player-pofile-box{background-color:var(--drak-purple-colour); padding:15px 0px}

.footer-player-inside{display:flex; align-items: center; }

.footer-player-inside > .player-number{width:6%; font-size:30px;  font-weight:600;}
.footer-player-inside > .button-box{text-align:right;    width: 50%;  }

.menu-team-box{display:flex; flex-wrap: wrap; gap:3px; text-align: center; width: 66%; }
.menu-team-box > a {
  flex-grow:0;
  width:50px;
  height:25px;
  color:var(--colour-white);
 background-color: rgba(119, 89, 119, .3);
 text-decoration: none;
 border-radius:5px;
}

.menu-team-box > a:hover{ background-color: rgba(119, 89, 119, .6);}


.button-box a{ padding:8px 15px; font-weight:500; margin-left:10px; border-radius:10px; background-color:#CF03CF; text-transform:uppercase; text-decoration:none; color:var(--colour-white); }
.button-box a:nth-child(2){ background-color:#ff0003; }
.button-box a:nth-child(3){ background-color: rgba(119, 89, 119, .3); }
.button-box a:hover{background-color:var(--org-colour); color:var(--drak-purple-colour);}







/*team css*/

.main-all-team-box {display:flex;  gap:20px 10px; flex-wrap: wrap; justify-content: space-evenly;  }
.main-all-team-box a{color:var(--colour-white); text-decoration:none;  /*display:flex;  gap:20px 50px; flex-wrap: wrap;*/  }

.team-box{transition: 0.3s; display:flex;  justify-content: space-around; /*width:47%;*/ width: 620px; border:solid 1px var(--org-colour); border-radius:100px; background-color: var(--purple-colour);  padding:10px;   align-items: center;}
.team-box:hover{border:solid 1px var(--drak-purple-colour); background-color: var(--drak-purple-colour);}

.team-box >.logo-team{background-color:var(--org-colour); border-radius:100%; margin-right:10px;}
.team-box >.logo-team img{ width:125px;}
.team-box >.team-pricing{}

.team-box >.team-pricing img{width:40px}
.team-box >.team-pricing h2{font-size:45px; color: var(--org-colour); font-weight: 700;}
.team-box >.team-pricing h2 span{font-weight:400; margin-right: 5px;}
.team-box >.line-box{margin:0px 20px;}
.team-box >.line-box img{height: 90px;}
.team-box >.number-of-player{display:flex; justify-content: flex-end;     align-items: center;}
.team-box >.number-of-player h3{font-size:45px; }
.team-box >.number-of-player img{width:52px}


.main-team-player-box {display:flex;  gap:20px 20px; flex-wrap: wrap;  flex-flow: row wrap;
  position: relative; }


.player-box-2{display:flex; text-align: left;  align-items: center; justify-content: left;}


.player-box {transition: 0.3s; display:flex; gap:0px 0px; padding:10px; flex-basis:18.5%;  flex-direction: column; background-color:var(--purple-colour); border-radius:20px; border: solid 1px var(--org-colour);}

.player-cost {display:flex; text-align: center;  align-items: center; justify-content: center;}
.player-box a{ display: contents; color: #fff;}
.player-cost h2{color:var(--org-colour); font-size: 25px; color:var(--org-colour); font-weight: 600;}
.player-cost span{ font-size: 28px; font-weight: 400;   color:var(--org-colour);  margin-right: 5px;}
.player-cost img{width:20px;}
.player-name {text-align: center;  padding-top:10px; font-size: 18px;}
.player-box a .player-number{width:30px; height:30px; border-radius:50%; color:var(--colour-white); background-color: rgba(254, 183, 28, 0.7); position:absolute;
	display:flex; align-items: center;
    justify-content: center;     margin-top: 10px;  margin-left: 170px;
}


.player-photo-box {background-color: #665a5a; border-radius:20px;}
.player-photo-box  img{border-radius:20px;}


.player-box:hover{background-color:var(--org-colour); }
.player-box:hover h2{color:var(--drak-purple-colour);}
.player-box:hover span{color:var(--drak-purple-colour);}
.player-box:hover .player-name{color:var(--drak-purple-colour);}





.popup-bg{
    background-image: url(../images/bg-screen.jpg);
    background-size: cover;
    font-family: "Roboto", serif;
    font-style: normal;
    color: var(--colour-white);
    background-position-y:-50px;
}



.popup-bg:after {
  content: "";
  position: absolute;
  top:0;
  left:0;
  opacity: .3;
  z-index:1;
  width: 100%;
  height:100vh;
  background: url("../images/cere2.webp");
  background-size: cover;
 }







/*.popup-bg button{     right: 25px !important;
    position: absolute;
    background-color: #fff;
    padding: 20px;
    top: 20px;
    background-size: 17px;
    border-radius: 50px; opacity:0.9; }*/


    .popup-bg button{     right: 25px !important;
    position: absolute;
    background-color:transparent;
    padding:0px;
    top: 20px;
    opacity:0.9; border:none; }
     .popup-bg button img{width:60px;}
      .popup-bg button img:hover{opacity:0.8}


.player-box-popup{display:flex; flex-direction: column; text-align: center;  align-items: center; justify-content: center;}
.icon-bat-popup img {
    position: absolute;
    width: 80px;
    margin-left:-165px;
    margin-top:0px;
}

.player-number-pop{
    width: 50px;
    height:50px;
        font-size: 25px;
    border-radius: 50%;
    color: var(--drak-purple-colour);
    background-color:var(--org-colour);
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
      margin-top: -310px;
    margin-left: -320px;
    font-weight:bold;
}






.sizepop-ply { width:25%;}


.team-logo-name{display:flex; text-align: center;  align-items: center; justify-content: center; background-color:#CF03CF; width: auto;}
.team-logo-name h3{    padding: 10px 100px; text-transform: uppercase;  font-weight: 400;}
.team-logo-name h3 span{ font-weight:600;}
.team-logo1 img{
	position:absolute;
width: 100px;
    background-color:var(--drak-purple-colour);
    border-radius: 50px;
    margin-top: -50px;
    margin-left: -40px;
}

.cost-pop h2{font-size: 55px;
 text-transform: capitalize;
    margin-bottom: 10px;}
.cost-pop h2 span{ font-weight:400; margin-right:5px; }


.team-sold-name{margin-top: 20px; background: linear-gradient(90deg, rgba(52, 6, 44, 0.5) 0%, #591562 48.5%, rgba(63, 9, 54, 0.5) 100%);}
.team-sold-name h3{ padding: 10px 0px; text-transform: uppercase; font-weight: 400;}


.screen-tv-bg{background-image:url("../images/auction-rcb.webp"); background-size:cover; background-position-y:-80px; }

.bk-box {
  background-color:#000;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
background: rgb(0,0,0);
background: linear-gradient(360deg, rgba(0,0,0,0.8660714285714286) 32%, rgba(255,255,255,0) 100%);


}


.screen-box {
    background-color: var(--light-purple-colour);
    display: flex;
    bottom: 0;
    align-items: center;
    justify-content: space-around;
    border-radius:100px;
    justify-content: space-evenly;
}

.screen-box h5{text-transform:uppercase; color:var(--org-colour); padding:5px 0px;}
.screen-box h2{text-transform:capitalize; font-weight: 500;}
.player-photo-screen img{border-radius:100px; width:110px; height:110px; border: solid 10px #000; transform: scale(1.2);}


.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
    --bs-offcanvas-width: 330px;}

.offcanvas-title img{width:50px;}
 .menu-right{padding:0px;}
 .menu-right li {list-style: none;}
 .menu-right li a{ color:var(--colour-white); text-decoration:none !important; padding:10px 15px; display:block; border-top:dashed 1px #64676b; }
.menu-right li a:hover{color:var(--org-colour);}
.menu-right li img{width:30px; margin-right: 10px;}


.intro-bg{background-image:url("../images/intro-bg.jpg"); background-size:cover; height:100vh;}
.mauka-intro{    right: 0 !important; position: fixed; width:600px; text-transform:uppercase; top:50px;}
.mauka-intro img{margin-bottom:15px;}
.mauka-intro h1{font-weight:300; font-size:50px; margin-bottom: 21px;}
.mauka-intro h1 span{font-weight:800;}
.startnow-btn{background-color:var(--org-colour);
    padding: 10px 20px;
    border-radius: 50px;
    font-size: 25px;
    color: #000;
    text-decoration: none;
    font-weight: 600;
}


.startnow-btn:hover{background-color:var(--light-red-colour);  color: #fff;}


.sold-text {
    background-color: #5bc601;
    width: 70%;
    text-align: center;
    margin-top: -11px;
    padding: 3px;
    border-radius: 20px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700;
}

.unsold-text{
   background-color: #dc3545;
    width: 70%;
    text-align: center;
    margin-top: -11px;
    padding: 3px;
    border-radius: 20px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700;
}




@media screen and (max-width:1200px){
.player-info h2{font-size:30px;}

.icon-bat img{position:absolute; width:70px; margin-left: 20px; margin-top: -150px;}

.point-bid-box { width: 90%;}


.main-all-team-box {gap: 20px 0px;}
.team-box{width: auto;}

.player-box a .player-number { margin-left: 135px;}

.player-number-pop{
     margin-top: -210px;
    margin-left: -250px;
}


}