html { overflow-y: scroll; }
body { position: absolute; }
.main-unregistered {
flex-direction: column;
background-color: #fffdf9;
color: #3f3f3f;
width: 100%;
}
.main-unregistered .intro {
display: flex;
flex-direction: row;
justify-content: center;
width: 100%;
}
.main-unregistered .menu {
position: fixed;
justify-content: center;
top: 0;
width: 39.313vw;
height: 3.544vw;
background-color: #deeaec;
border-radius: 1.636vw;
border: 0.109vw solid;
border-color: #97b8a5;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 1000;
}
.main-unregistered .text-menu {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 600;
font-size: 1.091vw;
background-color: #deeaec;
border: none;
transition: border 0.1s ease-in;
}
.main-unregistered .text-menu:hover{
border: 0.2vw solid #97b8a5;
border-radius: 1.636vw;
}
.main-unregistered .heads-intro {
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
text-align: center;
top: 5.453vw;
align-items: center;
}
.main-unregistered .text-head {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 5.016vw;
}
.main-unregistered .text-subhead {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.017vw;
}
.main-unregistered .image-intro-pets {
display: block;
margin-top: 3.272vw;
width: 23.501vw;
height: 18.92vw;
}
.main-unregistered .miniinfo {
margin-top: 19.502vw;
width: 100%;
display: flex;
justify-content: center;
}
.main-unregistered .subminiinfo {
display: flex;
justify-content: center;
align-items: center;
width: 68.43vw;
}
.main-unregistered .text-miniinfo-head {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.617vw;
margin-left: 4.089vw;
}
.main-unregistered .text-miniinfo-subhead {
font-family: "Abhaya Libre Medium-Regular", Helvetica;
font-weight: 500;
font-size: 1.745vw;
width: 41.712vw;
margin-left: 4.089vw;
}
.main-unregistered .miniinfo-img {
width: 22.465vw;
height: 33.751vw;
}
.main-unregistered .services {
width: 100%;
height: 50.436vw;
margin-top: 9.051vw;
background-color: #97b8a5;
flex-direction: column;
margin-left: -0.5vw;
}
.main-unregistered .subservices {
display: flex;
justify-content: space-around;
margin-top: 3.162vw;
}
.main-unregistered .services-part {
align-items: end;
display: grid;
justify-content: center;
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
}
.main-unregistered .services-part:hover{
color: #fffdf9;
background-color: #FFD87E;
}
.main-unregistered .text-services-head {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.617vw;
padding-top: 4.798vw;
text-align: center;
color: #fffdf9;
margin-bottom: 0.763vw;
}
.main-unregistered .for-services-img {
justify-content: center;
width: 100%;
display: grid;
align-items: center;
margin-top: 1.927vw;
}
.main-unregistered .services-img {
width: 4.471vw;
height: 4.471vh;
justify-content: center;
align-items: center;
display: flex;
}
.main-unregistered .text-services {
text-align: center;
font-family: "Abhaya Libre Medium-Regular", Helvetica;
font-weight: 500;
font-size: 1.527vw;
margin-top: 4.635vw;
margin-bottom: 1.254vw;
width: 12.865vw;
height: 3.125vw;
text-align: center;
}
.main-unregistered .services-part {
background-color: #fffdf9;
width: 14.395vw;
height: 15.812vw;
}
.main-unregistered .doctors {
width: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
display: flex;
padding-top: 3.907vw;
}
.main-unregistered .doctors-head {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.617vw;
text-align: center;
color: #3f3f3f;
margin-bottom: 2.453vw;
}
.main-unregistered .pets {
width: 100%;
height: 50.436vw;
background-color: #FFE4DD;
margin-top: 4.744vw;
margin-left: -0.5vw;
}
.main-unregistered .pets-head {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.617vw;
padding-top: 3.599vw;
text-align: center;
color: #fffdf9;
margin-bottom: 5.889vw;
text-shadow: 0 0 1px #3f3f3f, 0 0 1px #3f3f3f, 0 0 1px #3f3f3f;
}
.main-unregistered .subpets {
display: flex;
justify-content: space-between;
}
.main-unregistered .pets-part-background {
width: 33.697vw;
height: 28.353vw;
background-color: #FFFDF9;
margin-right: 1.472vw;
align-items: center;
justify-content: center;
display: flex;
position: relative;
}
.main-unregistered .pets-parts-text {
width: 29.171vw;
height: 16.303vw;
font-size: 1.745vw;
text-align: center;
font-family: "Abhaya Libre Medium-Regular", Helvetica;
position: absolute;
top: 50%;
transform: translate(0, -50%);
}
.main-unregistered .podval {
width: 100%;
height: 22.028vw;
margin-top: 2.963vw;
}
.main-unregistered .podval-str1, .podval-str2 {
justify-content: space-between;
display: flex;
}
.main-unregistered .podval-str2 {
margin-top: 3.708vw;
}
.main-unregistered .podval-text-col2 {
text-align: right;
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-size: 2.617vw;
margin-right: 2.181vw;
}
.main-unregistered .podval-text-col1 {
text-align: right;
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 500;
font-size: 2.617vw;
margin-left: 2.181vw;
}
.link {
text-decoration: none;
color: #3f3f3f;
}
.registration_form .button-back {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 1.5vw;
background-color: #DEEAEC;
color: #3f3f3f;
height: 4vw;
width: 9vw;
border: 2px solid #97B8A5;
border-radius: 30px;
text-align: center;
margin-top: 1vw;
margin-left: 2vw;
vertical-align: middle;
}
.registration_form .button-back-p {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 1.5vw;
background-color: #DEEAEC;
color: #3f3f3f;
height: 4vw;
width: 9vw;
border: 2px solid #97B8A5;
border-radius: 30px;
text-align: center;
margin-top: 1vw;
margin-left: 1vw;
vertical-align: middle;
}
.registration_form .button-edit {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 1.5vw;
background-color: #DEEAEC;
color: #3f3f3f;
height: 4vw;
width: 18vw;
padding-left: 3vw;
border: 2px solid #97B8A5;
border-radius: 30px;
text-align: center;
margin-top: 1vw;
margin-left: 68vw;
vertical-align: middle;
background-image: url(img/edit.png);
background-size: 2vw;
background-repeat: no-repeat;
background-position: left 1.5vw center;
}
.line1 {
margin-top: 3.217vw;
border: 0.055vw solid #97B8A5;
width: 80.261vw;
position: absolute;
top: 500%;
left: 50%;
transform: translate(-50%, -50%);
}
.icon-user{
background-color: #97B8A5;
border-radius: 8vw;
width: 13vw;
height: 13vw;
transform: translate(-50%, -50%);
position: absolute;
top: 10vw;
left: 50%;
}
.info-user{
width: auto;
height: auto;
transform: translate(-50%, -50%);
position: absolute;
top: 22vw;
left: 50%;
display:grid;
text-align: center;
justify-content: center;
align-items: center;
}
.pets-user{
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-style: normal;
font-size: 2vw;
transform: translate(-50%, -50%);
position: absolute;
top: 30vw;
left: 50%;
width: 23vw;
height: 5vw;
text-align: center;
}
.pets-add{
margin-top: 24vw;
margin-left: 58vw;
}
.name-user{
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-style: normal;
font-size: 2vw;
}
.email-user{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 2vw;
margin-top: 0.1vw;
}
.registration_form {
flex-direction: column;
background-color: #fffdf9;
color: #3f3f3f;
width: 100%;
}
.registration_form .heads-form {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 2.617vw;
text-align: center;
color: #3f3f3f;
margin-bottom: 0.273vw;
}
.registration_form .form-position {
display:grid;
text-align: center;
justify-content: center;
align-items: center;
}
.registration_form .element{
display: block;
text-align: justify;
margin-top: 1.091vw;
}
.registration_form .lable{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 1.617vw;
color: #3f3f3f;
}
.registration_form .input{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
width: 57.088vw;
height: 3.871vw;
border-radius: 0.818vw;
background-color: #97B8A5;
border: none;
padding-left: 1.091vw;
font-size: 1.617vw;
color: #FFFDF9;
margin-top: 1.091vw;
}
.textarea{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
width: 57.088vw;
height: 3.871vw;
border-radius: 0.818vw;
background-color: #97B8A5;
border: none;
padding-left: 1.091vw;
font-size: 1.617vw;
color: #FFFDF9;
margin-top: 1.091vw;
resize: vertical;
max-height: 8.088vw;
min-height:3.871vw;
padding-top: 0.5vw;
}
.textarea::-webkit-resizer{
background: linear-gradient(315deg,
#0000 16% 26%,
#FFFDF9 26% 33%,
#0000 33% 43%,
#FFFDF9 43% 50%,
#0000 50% 100%) no-repeat;
background-size: 80% 80%;
}
.registration_form .input:focus{
outline: none;
}
.registration_form .input::placeholder{
color: #3F3F3F;
}
.textarea:focus{
outline: none;
}
.textarea::placeholder{
color: #3F3F3F;
}
.registration_form .container {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
display: block;
position: relative;
text-align: left;
padding-left: 3.272vw;
margin-top: 1.091vw;
cursor: pointer;
font-size: 1.363vw;
padding-top: 0.436vw;
}
.registration_form .checkmark {
width: 2.072vw;
height: 2.072vw;
border: 0.164vw solid #97B8A5;
border-radius: 0.818vw;
cursor: pointer;
display: inline-block;
text-align: left;
position: absolute;
top: 0;
left: 0;
}
.registration_form .checkmark:after {
content: "";
position: absolute;
display: none;
}
.container input:checked ~ .checkmark:after {
display: block;
}
.container .checkmark:after {
left: 0.709vw;
top: 0.382vw;
width: 0.545vw;
height: 0.818vw;
border:solid #3F3F3F;
border-radius: 0.109vw;
border-width: 0 0.191vw 0.191vw 0;
transform: rotate(45deg);
}
.registration_form .button{
text-align: center;
display: block;
margin-top: 2.181vw;
align-items: center;
justify-content: center;
}
.registration_form .button-text{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 3.272vw;
width: 50.6vw;
height: 5.18vw;
border-radius: 0.818vw;
background-color: #97B8A5;
border: none;
padding-left: 1.091vw;
color: #FFFDF9;
margin-top: 1.091vw;
}
.registration_form .footer-form {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 1.500vw;
text-align: center;
color: #3f3f3f;
margin-top: 0.545vw;
}
.registration_form .appointment-position {
display:grid;
text-align: center;
justify-content: center;
align-items: center;
}
.registration_form .head-appointment {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 800;
font-style: normal;
font-size: 2.617vw;
text-align: center;
color: #3f3f3f;
margin-bottom: 0.273vw;
}
.registration_form .input-appointment{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
width: 47.088vw;
height: 3.871vw;
border-radius: 0.818vw;
background-color: #FFD87E;
border: none;
padding-left: 1.091vw;
font-size: 1.617vw;
color: #FFFDF9;
margin-top: 1.091vw;
margin-left: 2vw;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background-image: url(img/strelka.png);
background-size: 2vw;
background-repeat: no-repeat;
background-position: right 1vw center;
}
.registration_form .datetime-appointment{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
width: 46.088vw;
height: 3.871vw;
border-radius: 0.818vw;
background-color: #FFD87E;
border: none;
padding-left: 1.091vw;
font-size: 1.617vw;
color: #FFFDF9;
margin-top: 1.091vw;
margin-left: 2vw;
}
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
opacity: 1;
display: block;
background: url(img/datetime.png) no-repeat;
width: 3vw;
height: 2vw;
border-width: thin;
background-size: 2vw;
}
*:focus {
outline: none;
}
.datetime-appointment:focus{
outline: none;
}
.input-appointment:focus{
outline: none;
}
.registration_form .button-appointment{
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 3.272vw;
width: 50.6vw;
height: 5.18vw;
border-radius: 0.818vw;
background-color: #FFD87E;
border: none;
padding-left: 1.091vw;
color: #FFFDF9;
margin-top: 1.091vw;
}
.registration_form .container-appointment {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
display: block;
position: relative;
text-align: left;
padding-left: 3.272vw;
margin-top: 1.091vw;
cursor: pointer;
font-size: 1.363vw;
padding-top: 0.436vw;
margin-left: 2vw;
}
.registration_form .checkmark-appointment {
width: 2.072vw;
height: 2.072vw;
border: 0.164vw solid #FFD87E;
border-radius: 0.818vw;
cursor: pointer;
display: inline-block;
text-align: left;
position: absolute;
top: 0;
left: 0;
}
.registration_form .checkmark-appointment:after {
content: "";
position: absolute;
display: none;
}
.container-appointment input:checked ~ .checkmark-appointment:after {
display: block;
}
.container-appointment .checkmark-appointment:after {
left: 0.709vw;
top: 0.382vw;
width: 0.545vw;
height: 0.818vw;
border:solid #3F3F3F;
border-radius: 0.109vw;
border-width: 0 0.191vw 0.191vw 0;
transform: rotate(45deg);
}
.services {
justify-content: center;
display: flex;
width: 100%;
background-color: #fffdf9;
}
.services .services-page {
flex-direction: column;
width: 100%;
margin-top: 9.017vw;
justify-content: center;
align-items: center;
display: flex;
}
.services .services-head {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 3.272vw;
text-align: center;
color: #3f3f3f;
margin-top: 0.8.179vw;
}
.services .menu {
position: fixed;
justify-content: center;
top: 0;
width: 39.313vw;
height: 3.544vw;
background-color: #deeaec;
border-radius: 1.636vw;
border: 0.109vw solid;
border-color: #97b8a5;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 1000;
}
.services .text-menu {
font-family: "Commissioner", Helvetica;
font-weight: 600;
font-size: 1.091vw;
background-color: #deeaec;
border: none;
transition: border 0.1s ease-in;
}
.services .text-menu:hover{
border: 0.2vw solid #97b8a5;
border-radius: 1.636vw;
}
.services .make-app {
position: fixed;
top: 0;
width: 39.313vw;
height: 5.344vw;
background-color: #FFE4DD;
border-radius: 1.636vw;
border: 0.050vw solid;
border-color: #97b8a5;
display: flex;
justify-content: center;
align-items: end;
z-index: 1000;
margin-top: 1.091vw;
}
.services .make-app-text {
font-family: "Commissioner", Helvetica;
font-weight: 700;
font-size: 1.527vw;
margin-bottom: 0.354vw;
color: #3F3F3F;
}
.services .line1 {
margin-top: 3.217vw;
border: 0.055vw solid #97B8A5;
width: 63.261vw;
}
.services .services-section {
margin-top: 3.762vw;
margin-bottom: 3.326vw;
width: 83.937vw;
height: 22.465vw;
display: flex;
justify-content: space-between;
}
.services .service {
background-image: url("img/service2.png");
background-size: cover;
border: 0.164vw solid #97b8a5;
width: 22.901vw;
height: 100%;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
text-align: center;
}
.services .line2 {
border: 0.056vw solid #97B8A5;
width: 14.286vw;
margin-top: 1.418vw;
}
.services .service-head {
margin-top: 2.236vw;
margin-bottom: auto;
position: static;
font-family: "Commissioner", Helvetica;
font-weight: 400;
font-size: 1.854vw;
width: 20.011vw;
}
.services .service-desc {
margin-top: 1.527vw;
margin-bottom: 1.472vw - 1.418vw;
font-family: "Commissioner", Helvetica;
font-weight: 400;
font-size: 1.527vw;
width: 20.011vw;
}
.services .service-price {
margin-top: 1.963vw;
margin-bottom: 2.672vw;
font-family: "Commissioner", Helvetica;
font-weight: 600;
font-size: 1.527vw;
}
.doctors {
justify-content: center;
display: flex;
width: 100%;
height: auto;
background-color: #fffdf9;
}
.doctors .docs {
width: 68.542vw;
height: auto;
display: flex;
justify-content: center;
flex-direction: column;
}
.doctors .subdocs {
display: flex;
width: 68.542vw;
margin-bottom: 5.453vw;
justify-content: space-between;
align-items: center;
}
.doctors .text-docs-head-left {
font-family: "Commissioner", Helvetica;
font-weight: 800;
font-size: 1.363vw;
width: 47.708vw;
margin-left: 2.181vw;
}
.doctors .text-docs-head-right {
font-family: "Commissioner", Helvetica;
font-weight: 800;
font-size: 1.363vw;
width: 47.708vw;
}
.doctors .text-docs-subhead-left {
font-family: "Commissioner", Helvetica;
font-weight: 500;
font-size: 1.363vw;
width: 47.708vw;
margin-left: 2.181vw;
}
.doctors .text-docs-subhead-right {
font-family: "Commissioner", Helvetica;
font-weight: 500;
font-size: 1.363vw;
width: 47.708vw;
}
.doctors .doc-img {
width: 17.986vw;
height: 17.986vw;
}
.doctors .menu {
position: fixed;
justify-content: center;
top: 0;
width: 39.313vw;
height: 3.544vw;
background-color: #deeaec;
border-radius: 1.636vw;
border: 0.109vw solid;
border-color: #97b8a5;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 1000;
}
.doctors .text-menu {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 600;
font-size: 1.091vw;
background-color: #deeaec;
border: none;
transition: border 0.1s ease-in;
}
.doctors .text-menu:hover{
border: 0.2vw solid #97b8a5;
border-radius: 1.636vw;
}
.docs .doctors-head {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 3.272vw;
text-align: center;
color: #3f3f3f;
margin-top: 6.107vw;
margin-bottom: 5.507vw;
width: 100%;
text-align: center;
}
.shelter {
justify-content: center;
display: flex;
width: 100%;
background-color: #fffdf9;
}
.shelter .pets {
width: 100%;
height: 183.403vw;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}
.shelter .subdocs {
width: 85.347vw;
display: flex;
margin-bottom: 5.453vw;
}
.shelter .text-docs-head-left {
font-family: "Commissioner", Helvetica;
font-weight: 800;
font-size: 1.363vw;
width: 62.569vw;
margin-left: 2.181vw;
}
.shelter .text-docs-head-right {
font-family: "Commissioner", Helvetica;
font-weight: 800;
font-size: 1.363vw;
width: 62.569vw;
}
.shelter .text-docs-subhead-left {
font-family: "Commissioner", Helvetica;
font-weight: 500;
font-size: 1.363vw;
width: 62.569vw;
margin-left: 2.181vw;
}
.shelter .text-docs-subhead-right {
font-family: "Commissioner", Helvetica;
font-weight: 500;
font-size: 1.363vw;
width: 62.569vw;
}
.shelter .doc-img {
width: auto;
height: 21.528vw;
}
.shelter .menu {
position: fixed;
justify-content: center;
top: 0;
width: 39.313vw;
height: 3.544vw;
background-color: #deeaec;
border-radius: 1.636vw;
border: 0.109vw solid;
border-color: #97b8a5;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 1000;
}
.shelter .text-menu {
font-family: "Commissioner-SemiBold", Helvetica;
font-weight: 600;
font-size: 1.091vw;
background-color: #deeaec;
border: none;
transition: border 0.1s ease-in;
}
.shelter .text-menu:hover{
border: 0.2vw solid #97b8a5;
border-radius: 1.636vw;
}
.pets .doctors-head {
font-family: "Abhaya Libre", Helvetica;
font-weight: 600;
font-style: normal;
font-size: 3.272vw;
text-align: center;
color: #3f3f3f;
margin-top: 0.107vw;
margin-bottom: 5.507vw;
width: 100%;
text-align: center;
}