Skip to content

L
landing_pages
Commit ecb74cc5 by Iren
Options

add style for firefox

parent 98127a69
Showing with 148 additions and 57 deletions
css/styles.css
......@@ -160,8 +160,6 @@ header {
@media (min-width: 319px) {
#header-img-navicon {
position: relative;
/* margin-left: 103px;
margin-top: -3px;*/
display: inline-block;
font-size: 36px;
color: white;
......@@ -180,9 +178,6 @@ header {
height: 80px;
left: 1px;
top: 40px;
/*@media (min-width: 320px){
display: none;
}*/
}
@media (min-width: 577px) {
#cat {
......@@ -365,6 +360,32 @@ h1 {
line-height: 36px;
}
}
@-moz-document url-prefix() {
h1 {
font-size: 60px;
}
@media (max-width: 1250px) {
h1 {
font-size: 50px;
}
}
@media (max-width: 992px) {
h1 {
font-size: 36px;
color: white;
}
}
@media (max-width: 768px) {
h1 {
font-size: 36px;
}
}
@media (max-width: 576px) {
h1 {
font-size: 36px;
}
}
}
.header-h1-line {
position: relative;
z-index: 3;
......@@ -907,9 +928,17 @@ video {
}
@media (max-width: 1250px) {
.advertising-img-position {
width: 524px;
height: 342px;
right: 500px;
width: 50%;
height: 130%;
left: 0;
top: 0;
}
}
@media (max-width: 1120px) {
.advertising-img-position {
width: 50%;
height: 120%;
/*right: 53%;*/
top: 0;
}
}
......@@ -917,7 +946,8 @@ video {
.advertising-img-position {
width: 50%;
height: 90%;
right: 53%;
left: 0;
/*right: 53%;*/
top: 0;
}
}
......@@ -931,10 +961,18 @@ video {
}
@media (max-width: 576px) {
.advertising-img-position {
width: 290px;
height: 162px;
right: 55px;
top: 340px;
width: 97%;
height: 45%;
right: 0;
top: 35%;
}
}
@media (max-width: 480px) {
.advertising-img-position {
width: 100%;
height: 45%;
right: 0;
top: 40%;
}
}
@media (max-width: 576px) {
......@@ -983,6 +1021,12 @@ video {
.advertising-text {
width: 110%;
}
@media (max-width: 576px) {
.advertising-text {
width: 300px;
order: 0;
}
}
.advertising-text h2 {
/*.h2-desktop;*/
font-family: SF-UI-Display-Black;
......@@ -1035,27 +1079,29 @@ video {
.advertising-img-order {
width: 120%;
padding-top: 0;
margin-top: 0;
margin-top: -65px;
}
.advertising-img-order img {
width: 100%;
margin-bottom: 70px;
}
}
@media (max-width: 1250px) {
.advertising-img-order {
padding-top: 25px;
}
}
@media (max-width: 576px) {
.advertising-img-order {
margin-top: 0;
min-width: 300px;
order: 5;
}
.advertising-img-order img {
min-width: 300px;
/*width: 320px;*/
min-width: 320px;
min-height: 183px;
margin-left: -25px;
height: 183px;
}
}
@media (max-width: 1250px) {
.advertising-img-order {
padding-top: 25px;
}
}
@media (max-width: 1250px) {
......@@ -1080,8 +1126,9 @@ video {
margin-top: 0;
}
.advertising-img img {
/*width: 320px;*/
min-width: 320px;
height: 183px;
min-height: 183px;
margin-left: -25px;
}
}
......@@ -1412,6 +1459,7 @@ video {
}
@media (max-width: 576px) {
.protection-img {
width: 100px;
height: 90px;
margin-left: -10px;
}
......@@ -1730,7 +1778,7 @@ video {
}
@media (max-width: 576px) {
.technology-containe {
justify-content: center;
justify-content: flex-start;
/*height: 150px;*/
height: auto;
width: 100%;
......
css/styles.less
......@@ -63,7 +63,7 @@ header {
margin-bottom: 57px;
}
@media (max-width: 576px) {
/* width: 320px;*/
/* width: 320px;*/
height: 560px;
margin-bottom: 58px;
}
......@@ -136,11 +136,9 @@ header {
}
}
#header-img-navicon {
@media (min-width: 319px){
@media (min-width: 319px){
position: relative;
/* margin-left: 103px;
margin-top: -3px;*/
display: inline-block;
display: inline-block;
font-size: 36px;
color: white;
}
......@@ -157,26 +155,23 @@ header {
left: 1px;
top: 40px;
@media (min-width: 577px){
display: none;
display: none;
}
/*@media (min-width: 320px){
display: none;
}*/
}
.header-link-mobile-container {
display: flex;
}
.header-link-mobile {
@media (max-width: 576px){
font-size: 14px;
margin-right: 20px;
font-size: 14px;
margin-right: 20px;
}
@media (max-width: 480px) {
font-size: 10px;
margin-right: 8px;
}
a {
font-family: SF-UI-Display-Black;
font-family: SF-UI-Display-Black;
color: white;
}
}
......@@ -279,6 +274,7 @@ header {
margin-left: 0!important;
}
}
h1 {
position: relative;
z-index: 3;
......@@ -305,6 +301,30 @@ h1 {
line-height: 36px;
}
}
@-moz-document url-prefix()
{h1
{
font-size: 60px;
@media (max-width: 1250px) {
font-size: 50px;
}
@media (max-width: 992px) {
font-size: 36px;
color: white;
}
@media (max-width: 768px) {
font-size: 36px;
}
@media (max-width: 576px) {
font-size: 36px;
}
}
}
.header-h1-line{
position: relative;
z-index: 3;
......@@ -484,6 +504,7 @@ video {
@media (max-width: 576px) {
padding-left: 10px;
padding-right: 10px;
}
}
.h2-desktop {
......@@ -755,15 +776,23 @@ video {
right: 640px;
top: 30px;
@media (max-width: 1250px) {
width: 524px;
height: 342px;
right: 500px;
width: 50%;
height: 130%;
left: 0;
top: 0;
}
@media (max-width: 1120px) {
width: 50%;
height: 120%;
/*right: 53%;*/
top: 0;
}
@media (max-width: 992px) {
width: 50%;
height: 90%;
right: 53%;
left: 0;
/*right: 53%;*/
top: 0;
}
@media (max-width: 768px) {
......@@ -773,10 +802,16 @@ video {
top: 0;
}
@media (max-width: 576px) {
width: 290px;
height: 162px;
right: 55px;
top: 340px;
width: 97%;
height: 45%;
right: 0;
top: 35%;
}
@media (max-width: 480px) {
width: 100%;
height: 45%;
right: 0;
top: 40%;
}
}
.advertising-text-p {
......@@ -817,6 +852,10 @@ video {
}
}
.advertising-text {
@media (max-width: 576px) {
width: 300px;
order: 0;
}
width: 110%;
h2 {
/*.h2-desktop;*/
......@@ -863,24 +902,26 @@ video {
@media (min-height: 577px) {
width: 120%;
padding-top: 0;
margin-top: 0;
margin-top: -65px;
img {
width: 100%;
margin-bottom: 70px;
}
}
@media (max-width: 1250px) {
padding-top: 25px;
}
@media (max-width: 576px) {
margin-top: 0;
min-width: 300px;
order: 5;
img {
min-width: 300px;
/*width: 320px;*/
min-width: 320px;
min-height: 183px;
margin-left: -25px;
height: 183px;
}
}
@media (max-width: 1250px) {
padding-top: 25px;
}
}
.advertising-img {
@media (max-width: 1250px) {
......@@ -899,8 +940,9 @@ video {
min-width: 300px;
margin-top: 0;
img {
/*width: 320px;*/
min-width: 320px;
height: 183px;
min-height: 183px;
margin-left: -25px;
}
}
......@@ -1165,6 +1207,7 @@ video {
margin-left: -10px;
}
@media (max-width: 576px) {
width: 100px;
height: 90px;
margin-left: -10px;
}
......@@ -1416,7 +1459,7 @@ video {
margin-top: 0!important;
}
@media (max-width: 576px) {
justify-content: center;
justify-content: flex-start;
/*height: 150px;*/
height: auto;
width: 100%;
......
index.html
......@@ -19,12 +19,12 @@
<div class="header-wrapp">
<div class="header-img">
<div>
<img src="img/header-logo.png">
<img src="img/header-logo.png">
</div>
<div id="header-img-navicon">
&#9776;
</div>
<div id="cat" class="page-header__burger--active">
<div id="cat" class="page-header__burger--active">
<ul class="header-link-mobile-container">
<li class="header-link-mobile">
<a href="#">Продукт</a>
......@@ -1230,8 +1230,8 @@
$('#header-img-navicon').click(function(event) {
$('#cat').removeClass('page-header__burger--active');
<!--$('#header-img-navicon').click(function(event) {
$('#cat').removeClass('page-header__burger--active');
});
\ No newline at end of file
});-->
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment