img{max-width:100% }
/* ========================= */
.hero .text{height:70px}
/* ========================= */
svg.i_kohardsi{position:relative;z-index:1;width:30px;height:30px}
.hero svg.icon-kohar{animation-name:example;animation-duration:5s;animation-iteration-count:infinite;animation-direction:alternate}
@keyframes example{0%{color:#ee6055;scale:1.1}25%{color:#60d394}50%{color:#aaf683;scale:1.2}75%{color:#ffd97d}100%{color:#ff9b85;scale:1.3}}
/* ========================= */
.content{max-width:600px;margin:0 auto;padding:0 20px}
.hero h1{position:relative;z-index:1;color:rgba(255,255,255,0.9)}
.hero p{position:relative;z-index:1;font-size:1.1rem;color:rgba(255,255,255,0.5);line-height:1.4}
.hero .icon-kohar{width:100%;z-index:1}
/* ========================= */
.waves{position:absolute;bottom:0;left:0;right:0;height:200px;background-color:var(--bs-blue);box-shadow:inset 0 0 50px rgba(0,0,0,0.5);transition:500ms}
.waves::before,.waves::after{content:'';position:absolute;width:300vw;height:300vw;top:-65vw;left:50%;transform:translate(-50%,-75%)}
.waves::before{border-radius:44%;background:var(--bs-dark);animation:waves 8s linear infinite}
.waves::after{border-radius:44%;background:rgba(51,51,51,0.5);animation:waves 15s linear infinite}
@keyframes waves{0%{transform:translate(-50%,-75%) rotate(0deg)}100%{transform:translate(-50%,-75%) rotate(360deg)}}

/* ==PAGE== */
/*Zodiak*/
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* Firefox */
input[type=number]{-moz-appearance:textfield}
.teja-horoscope {max-width: 400px;margin: 0 auto;}.teja-horoscope:before{content: '\F128';position: absolute;font-family: bootstrap-icons !important;font-style: normal;font-weight: 400 !important;font-variant: normal;text-transform: none;line-height: 1;vertical-align: -0.125em;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;fill: currentcolor;width: 100%;z-index: 999;font-size: 45px;text-align: center;margin: 0 auto;left: 0;right: 0;top: -20px;}
img#zodiac {max-width:100px}
/*qr*/
.qr-code{animation-name: genere;animation-duration: 1s;}.qr-code.genere{animation-name: genere1}@keyframes genere {0%   {opacity:0}25%  {opacity:0.5}50%  {opacity:0.7}100% {opacity:1}}@keyframes genere1 {0%   {opacity:0}25%  {opacity:0.5}50%  {opacity:0.7}100% {opacity:1}}

#visitorCount{position: fixed;bottom:2%;right: 2%;}}