diff --git a/static/css/style.css b/static/css/style.css index bac7317..60857ad 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -204,7 +204,7 @@ input[type="radio"] { .btn{ padding: 0.8% 2%; - border-radius: 10px; + border-radius: 5px; border-color: var(--lightBlue); color: var(--white); margin: 4% 0 0 0; @@ -244,4 +244,216 @@ input[type="radio"] { /* .input1Width { width: 15vw; } */ -} \ No newline at end of file +} + +@media (max-width: 1199px) and (min-width: 992px) { + .container{ + padding: 0 7%; + } + +/* .input1Width { + width: 15vw; + } */ + + .f14{ + font-size: 12px; + } +} + +@media (max-width: 991px) and (min-width: 768px) { + .container{ + padding: 0 7%; + } + + .input1Width, #inputLink { + min-height: 20px; + } + + .zayavkaH1{ + font-size: 20px; + } + + .inputZ, .f14 { + font-size: 10px; + } + +} + +@media (max-width: 767px) and (min-width: 576px) { + .container{ + padding: 0 7%; + } + + .input1Width, #inputLink { + min-height: 20px; + } + + .zayavkaH1{ + font-size: 18px; + } + + .inputZ, .f14 { + font-size: 9px; + } + + .logoIMG{ + max-width: 15%; + height: auto; + } + + #linkItem{ + min-height: 200px; + } +} + +@media (max-width: 575px) and (min-width: 375px) { + .container{ + padding: 0 5%; + } + + .e1 { + flex-direction: column; + width: 70%; + text-align: start; + margin: 0 !important; + padding: 0 0 4%; + align-items: center; + } + + .input1Width, #inputLink { + min-height: 20px; + } + + .input1Width { + box-sizing: border-box; + padding-left: 3%; + color: var(--white); + } + + .colms, .input1Width{ + width: 100%; + } + + .zayavkaH1{ + font-size: 17px; + padding: 4% 0; + } + + .inputZ, .f14 { + font-size: 10px; + } + + .inputZ{ + margin: 0 0 5%; + } + + .logoIMG{ + max-width: 22%; + height: auto; + margin-top: 6%; + } + + #linkItem{ + min-height: 200px; + } + + #linkTao{ + min-height: 20px; + } + + .e3 { + flex-direction: column; + justify-content: space-between; + margin: 0 !important; + padding: 0 0 3%; + width: 100%; + } + + .v{ + margin-bottom: 2% !important; + } + + input[type="radio"] { + margin: 0 2% 2% 0; + } + + .btn{ + padding: 2%; + } +} + +@media (max-width: 425px) and (min-width: 350px) { + .container{ + padding: 0 2%; + } + + .e1 { + flex-direction: column; + width: 70%; + text-align: start; + margin: 0 !important; + padding: 0 0 4%; + align-items: center; + } + + .input1Width, #inputLink { + min-height: 20px; + } + + .input1Width { + box-sizing: border-box; + padding-left: 3%; + color: var(--white); + } + + .colms, .input1Width{ + width: 100%; + } + + .zayavkaH1{ + font-size: 17px; + padding: 4% 0; + } + + .inputZ, .f14 { + font-size: 10px; + } + + .inputZ{ + margin: 0 0 5%; + } + + .logoIMG{ + max-width: 22%; + height: auto; + margin: 6% 0 0 6%; + } + + #linkItem{ + min-height: 200px; + } + + #linkTao{ + min-height: 20px; + } + + .e3 { + flex-direction: column; + justify-content: space-between; + margin: 0 !important; + padding: 0 0 3%; + width: 100%; + } + + .v{ + margin-bottom: 2% !important; + } + + input[type="radio"] { + margin: 0 2% 2% 0; + } + + .btn{ + padding: 2%; + } +}