:root{--main:#262A56;--text:#eee;--link:#1A913C;--text-dark:#181818}html{font-family:'Roboto', sans-serif}html a{color:var(--link);text-decoration:none}html body{color:var(--text-dark);font-weight:400}html body header{background-color:var(--main);width:100%;display:inline-flex;justify-content:center}html body header .headerWrapper{width:1400px}html body header .headerWrapper section{display:flex;gap:50px;height:80px;align-items:center}html body header .headerWrapper section .logo{margin-right:50px}html body header .headerWrapper section .logo h2{color:var(--text);font-weight:700}html body header .headerWrapper section nav{width:100%}html body header .headerWrapper section nav .navbar-toggler{background-color:var(--text);position:relative;z-index:11;border-radius:0 15px}@media (max-width: 1199px){html body header .headerWrapper section #navbar{z-index:10;position:absolute;top:70px;left:0px;width:100vw;background:var(--main)}}html body header .headerWrapper section #navbar ul.navbar-nav{align-items:center;gap:20px}@media (max-width: 1199px){html body header .headerWrapper section #navbar ul.navbar-nav{margin-top:30px;padding-bottom:30px}}@media (max-width: 1199px){html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item{width:130px}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-toggle{display:block;width:130px}}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-toggle,html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .nav-link{padding:10px 15px;background-color:var(--link);color:#fff;border-radius:0 15px;transition:color,background-color 0.1s ease-in}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-toggle:hover,html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .nav-link:hover{background-color:#fff;color:var(--link)}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-menu{padding:20px;background-color:var(--main);margin-top:10px;border:0}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-menu .dropdown-item{padding:10px 15px;background-color:var(--link);color:#fff;border-radius:0 15px;transition:color,background-color 0.1s ease-in;margin-top:10px}html body header .headerWrapper section #navbar ul.navbar-nav li.nav-item .dropdown-menu .dropdown-item:hover{background-color:#fff;color:var(--link)}html body main{display:flex;justify-content:center;width:100%;margin-top:50px}html body main>.mainWrapper{width:1400px}@media (max-width: 1410px){html body main>.mainWrapper{padding:0 15px}}html body main>.mainWrapper #animalInfo{display:flex;flex-direction:row;gap:30px}@media (max-width: 992px){html body main>.mainWrapper #animalInfo{flex-direction:column}}html body main>.mainWrapper #animalInfo .flags{position:relative;top:-380px;height:0px}@media (max-width: 992px){html body main>.mainWrapper #animalInfo .flags{width:320px}html body main>.mainWrapper #animalInfo .flags .flag.food{margin-top:0px}}html body main>.mainWrapper #animalInfo .flags .flag{margin-top:25px;padding:10px 15px;background-color:#262a56;color:#fff;border-radius:0 25px;transition:color,background-color 0.1s ease-in;width:min-content;white-space:nowrap}html body main>.mainWrapper #animalInfo .flags .flag p{margin-bottom:0}html body main>.mainWrapper #animalInfo .flags .flag span{opacity:1}html body main>.mainWrapper #animalInfo .flags .capture{float:right;margin-top:0}@media (max-width: 992px){html body main>.mainWrapper #animalInfo .left{display:flex;flex-direction:column;align-items:center}}html body main>.mainWrapper #animalInfo .left .imgWrapper{max-width:320px;max-height:280px;min-height:270px;overflow:hidden;display:flex;align-items:flex-end}html body main>.mainWrapper #animalInfo .left .imgWrapper img{width:100%}html body main>.mainWrapper #animalInfo .left .name h4{text-align:center;font-size:30px;font-weight:500}html body main>.mainWrapper #animalInfo .left .name{margin-top:25px;padding:10px 15px;background-color:var(--main);color:#fff;border-radius:0 40px;transition:color,background-color 0.1s ease-in}html body main>.mainWrapper #animalInfo .left .name h4{text-align:center;font-size:30px;font-weight:500}html body main>.mainWrapper #animalInfo .capture span.free{color:var(--link)}html body main>.mainWrapper #animalInfo .capture span.zoo{color:red}html body main>.mainWrapper #animalInfo .food span.meat{color:red}html body main>.mainWrapper #animalInfo .food span.vaggies{color:var(--link)}html body main>.mainWrapper #animalInfo .food span.all{background:red;background:-moz-linear-gradient(256deg, red 0%, #1a9136 89%);background:-webkit-linear-gradient(256deg, red 0%, #1a9136 89%);background:linear-gradient(256deg, red 0%, #1a9136 89%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff0000",endColorstr="#1a9136",GradientType=1);-webkit-background-clip:text;-webkit-text-fill-color:transparent}html body main>.mainWrapper #animalInfo>div{font-size:16px}html body main>.mainWrapper #animalInfo>div span{font-weight:600}html body main>.mainWrapper #animalInfo .actions button{padding:10px 15px;background-color:var(--link);color:#fff;border-radius:0 15px;transition:color,background-color 0.1s ease-in;font-size:27px;max-height:64px}html body main>.mainWrapper #animalInfo .actions button:hover{background-color:#fff;color:var(--link)}html body main>.mainWrapper #animalInfo .right{width:80%}@media (max-width: 992px){html body main>.mainWrapper #animalInfo .right{width:100%;margin-bottom:30px}}html body main>.mainWrapper #animalInfo .right .czat{width:100%;height:282px;padding:10px 40px;background-color:#262a56;color:#fff;border-radius:0 50px;transition:color,background-color 0.1s ease-in;display:flex;align-items:flex-end}html body main>.mainWrapper #animalInfo .right .czat .text{font-size:20px;max-height:255px;overflow-y:scroll;width:100%}html body main>.mainWrapper #animalInfo .right .czat .text::-webkit-scrollbar{width:3px}html body main>.mainWrapper #animalInfo .right .czat .text::-webkit-scrollbar-track{background:#f1f1f1}html body main>.mainWrapper #animalInfo .right .czat .text::-webkit-scrollbar-thumb{background:#888}html body main>.mainWrapper #animalInfo .right .czat .cursor{border-left:0.05em solid var(--text);animation:cursor 1s steps(1) infinite;color:var(--main);scroll-behavior:smooth}html body main>.mainWrapper #animalInfo .right .czat .text p{margin-bottom:5px}html body main>.mainWrapper #animalInfo .right .actions{display:flex;margin-top:23px;gap:20px}@media (max-width: 1250px){html body main>.mainWrapper #animalInfo .right .actions button{font-size:18px}}@media (max-width: 992px){html body main>.mainWrapper #animalInfo .right .actions{justify-content:center}}@media (max-width: 756px){html body main>.mainWrapper #animalInfo .right .actions{flex-wrap:wrap}html body main>.mainWrapper #animalInfo .right .actions button{font-size:14px;width:145px}html body main>.mainWrapper #animalInfo .right .actions>div{width:45%;text-align:center}}#index .mainWrapper #content{padding:40px;border-radius:0 50px;background-color:var(--main);color:var(--text);margin:30px 0}#index .mainWrapper .imgWrapper{margin:20px 0;overflow:hidden}#index .mainWrapper .imgWrapper img{width:100%}@keyframes cursor{50%{border-color:transparent}}
