0.0.182 media 360px v.3
This commit is contained in:
155
static/css/mobile_styles.css
Normal file
155
static/css/mobile_styles.css
Normal file
@@ -0,0 +1,155 @@
|
|||||||
|
/*media breakpoints*/
|
||||||
|
@media (max-width: 360px) {
|
||||||
|
|
||||||
|
header{
|
||||||
|
padding: 5px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header .header-second {
|
||||||
|
margin-left: unset;
|
||||||
|
}
|
||||||
|
.header_big_background{
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header_logo_mobile{
|
||||||
|
display: inline-block ;
|
||||||
|
|
||||||
|
}
|
||||||
|
.header_logo{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container_form_search_carrier{
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.button_profile_header{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.button_profile_header_mobile{
|
||||||
|
display: inline-block ;
|
||||||
|
}
|
||||||
|
.header-first>div {
|
||||||
|
margin-right: 37px;
|
||||||
|
}
|
||||||
|
.line_f_header{
|
||||||
|
top: 44px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top_block_static_wrapper_main{
|
||||||
|
background: unset;
|
||||||
|
}
|
||||||
|
.header_big_background {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
#sub_title_static>p{
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
|
.top_block_static{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.mid_block_static{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.wrapper_tab_button{
|
||||||
|
width: 55%;
|
||||||
|
}
|
||||||
|
.benefit_img{
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.tab-btn-2{
|
||||||
|
margin: 0 0 5px 0;
|
||||||
|
}
|
||||||
|
button#more_button{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#title_static{
|
||||||
|
font-size: 34px;
|
||||||
|
line-height: 42px;
|
||||||
|
}
|
||||||
|
.cards_wrapper{
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cards_item_1,
|
||||||
|
.cards_item_2,
|
||||||
|
.cards_item_3,
|
||||||
|
.cards_item_4
|
||||||
|
{
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
background-size:60%;
|
||||||
|
}
|
||||||
|
.card_title_1{
|
||||||
|
font-size: 34px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 42px;
|
||||||
|
margin: 22px 0 0 10px;
|
||||||
|
text-shadow: 1px 1px 0px #272424;
|
||||||
|
}
|
||||||
|
.card_title_2{
|
||||||
|
font-size: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 26px;
|
||||||
|
margin: 10px 0 0 10px;
|
||||||
|
text-shadow: 1px 1px 0px #272424;
|
||||||
|
}
|
||||||
|
.card_title_3{
|
||||||
|
margin: 10px 0 0 10px;
|
||||||
|
width: 95%;
|
||||||
|
font-size: 12px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 20px;
|
||||||
|
text-shadow: 1px 1px 0px #272424;
|
||||||
|
}
|
||||||
|
|
||||||
|
summary{
|
||||||
|
font-size: 18px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 26px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
summary ~ * {
|
||||||
|
padding: 0 1em 10px 1.4em;
|
||||||
|
font-size: 14px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 20px;
|
||||||
|
}
|
||||||
|
.news_block_main {
|
||||||
|
margin: 0 16px 120px 16px;
|
||||||
|
}
|
||||||
|
.news_item {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.container_form_search_carrier{
|
||||||
|
flex-direction: column;
|
||||||
|
margin-top: 170px;
|
||||||
|
width: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-second-item,
|
||||||
|
.header_btn_sender,
|
||||||
|
.header_btn_mover{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
.benefit_img>img{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*END media breakpoints*/
|
||||||
@@ -1953,7 +1953,7 @@
|
|||||||
.header_big_background{
|
.header_big_background{
|
||||||
height: 90px;
|
height: 90px;
|
||||||
background: #F8F8F8;
|
background: #F8F8F8;
|
||||||
width: 1440px;
|
width: 1280px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -139,10 +139,15 @@ html, body{
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper_content {
|
||||||
max-width: 1440px;
|
margin: 55px auto;;
|
||||||
|
/*padding: 40px 5px;*/
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper_main{
|
||||||
|
max-width: 1280px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 40px 5px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@@ -214,8 +219,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
/*width: 1280px;*/
|
margin-top: 20px;
|
||||||
/*margin: 0 50px;*/
|
|
||||||
padding: 5px 40px;
|
padding: 5px 40px;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
z-index: 4;
|
z-index: 4;
|
||||||
@@ -480,14 +484,18 @@ footer>div {
|
|||||||
}
|
}
|
||||||
|
|
||||||
header .header-first {
|
header .header-first {
|
||||||
display: inline-block;
|
float: left;
|
||||||
|
margin-top: 12px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_logo_mobile{
|
.header_logo_mobile{
|
||||||
display: none !important;
|
display: none;
|
||||||
}
|
}
|
||||||
.header-first>div{
|
|
||||||
|
.header_logo,
|
||||||
|
.header_btn_mover,
|
||||||
|
.header_btn_sender{
|
||||||
margin-right: 40px;
|
margin-right: 40px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
@@ -508,7 +516,7 @@ header .header-first {
|
|||||||
.dropbtn {
|
.dropbtn {
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
|
margin-right: 40px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
@@ -586,18 +594,19 @@ header>div>div>a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
header .header-second {
|
header .header-second {
|
||||||
display: inline-block;
|
float: right;
|
||||||
margin-left: 20%;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button_profile_header_mobile{
|
.button_profile_header_mobile{
|
||||||
display: none !important;
|
display: none;
|
||||||
}
|
}
|
||||||
.header-second>div {
|
|
||||||
|
|
||||||
|
.header-second-item,
|
||||||
|
.cont_header_btn_profile{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
span.btn_profile_name {
|
span.btn_profile_name {
|
||||||
@@ -1060,9 +1069,7 @@ section.login>form>div>div:nth-child(5)>a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
section.profile {
|
section.profile {
|
||||||
max-width: 1280px;
|
padding: 60px 40px 0;
|
||||||
margin: auto;
|
|
||||||
padding: 120px 40px 0;
|
|
||||||
margin-bottom: 120px;
|
margin-bottom: 120px;
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -2694,160 +2701,6 @@ details[open] summary ~ *{
|
|||||||
/*END news articles all*/
|
/*END news articles all*/
|
||||||
|
|
||||||
|
|
||||||
/*media breakpoints*/
|
|
||||||
@media (max-width: 360px) {
|
|
||||||
|
|
||||||
header{
|
|
||||||
padding: 5px 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header .header-second {
|
|
||||||
margin-left: unset;
|
|
||||||
}
|
|
||||||
.header_big_background{
|
|
||||||
height: 45px!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header_logo_mobile{
|
|
||||||
display: inline-block !important;
|
|
||||||
|
|
||||||
}
|
|
||||||
.header_logo{
|
|
||||||
display: none!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container_form_search_carrier{
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.button_profile_header{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.button_profile_header_mobile{
|
|
||||||
display: inline-block !important;
|
|
||||||
}
|
|
||||||
.header-first>div {
|
|
||||||
margin-right: 37px;
|
|
||||||
}
|
|
||||||
.line_f_header{
|
|
||||||
top: 44px!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.top_block_static_wrapper_main{
|
|
||||||
background: unset;
|
|
||||||
}
|
|
||||||
.header_big_background {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
#sub_title_static>p{
|
|
||||||
white-space: normal;
|
|
||||||
}
|
|
||||||
.top_block_static{
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
.mid_block_static{
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
.wrapper_tab_button{
|
|
||||||
width: 55%;
|
|
||||||
}
|
|
||||||
.benefit_img{
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
.tab-btn-2{
|
|
||||||
margin: 0 0 5px 0;
|
|
||||||
}
|
|
||||||
button#more_button{
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
#title_static{
|
|
||||||
font-size: 34px;
|
|
||||||
line-height: 42px;
|
|
||||||
}
|
|
||||||
.cards_wrapper{
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cards_item_1,
|
|
||||||
.cards_item_2,
|
|
||||||
.cards_item_3,
|
|
||||||
.cards_item_4
|
|
||||||
{
|
|
||||||
width: 100%;
|
|
||||||
height: 180px;
|
|
||||||
background-size:60%;
|
|
||||||
}
|
|
||||||
.card_title_1{
|
|
||||||
font-size: 34px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: 42px;
|
|
||||||
margin: 22px 0 0 10px;
|
|
||||||
text-shadow: 1px 1px 0px #272424;
|
|
||||||
}
|
|
||||||
.card_title_2{
|
|
||||||
font-size: 17px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
margin: 10px 0 0 10px;
|
|
||||||
text-shadow: 1px 1px 0px #272424;
|
|
||||||
}
|
|
||||||
.card_title_3{
|
|
||||||
margin: 10px 0 0 10px;
|
|
||||||
width: 95%;
|
|
||||||
font-size: 12px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 20px;
|
|
||||||
text-shadow: 1px 1px 0px #272424;
|
|
||||||
}
|
|
||||||
|
|
||||||
summary{
|
|
||||||
font-size: 18px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
summary ~ * {
|
|
||||||
padding: 0 1em 10px 1.4em;
|
|
||||||
font-size: 14px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 20px;
|
|
||||||
}
|
|
||||||
.news_block_main {
|
|
||||||
margin: 0 16px 120px 16px;
|
|
||||||
}
|
|
||||||
.news_item {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.container_form_search_carrier{
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 170px !important;
|
|
||||||
width: unset !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-second-item,
|
|
||||||
.header_btn_sender,
|
|
||||||
.header_btn_mover{
|
|
||||||
display: none!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 992px) {
|
|
||||||
.benefit_img>img{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*END media breakpoints*/
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,7 @@
|
|||||||
{% load i18n %}
|
{% load i18n %}
|
||||||
{% load base_tags_extra %}
|
{% load base_tags_extra %}
|
||||||
|
<div class="header_big_background">
|
||||||
|
</div>
|
||||||
<header id="header_bg">
|
<header id="header_bg">
|
||||||
<div class="header-first">
|
<div class="header-first">
|
||||||
<div class="header_logo">
|
<div class="header_logo">
|
||||||
@@ -37,7 +39,7 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="header-second">
|
<div class="header-second">
|
||||||
<div>
|
<div class="header-second-item">
|
||||||
<div class="dropdown_lang">
|
<div class="dropdown_lang">
|
||||||
<div id="dropbtn_lang" class="dropbtn_lang">RU</div>
|
<div id="dropbtn_lang" class="dropbtn_lang">RU</div>
|
||||||
<div class="dropdown-content-lang">
|
<div class="dropdown-content-lang">
|
||||||
@@ -103,4 +105,5 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="clear_both"></div>
|
<div class="clear_both"></div>
|
||||||
</header>
|
</header>
|
||||||
|
<div class="line_f_header"></div>
|
||||||
@@ -34,8 +34,8 @@
|
|||||||
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="{% static 'css/styles.css' %}">
|
<link rel="stylesheet" href="{% static 'css/styles.css' %}">
|
||||||
|
|
||||||
<link rel="stylesheet" href="{% static 'css/styles(boris).css' %}" >
|
<link rel="stylesheet" href="{% static 'css/styles(boris).css' %}" >
|
||||||
|
<link rel="stylesheet" href="{% static 'css/mobile_styles.css' %}">
|
||||||
|
|
||||||
<script src='{% static "js/find_route.js" %}'></script>
|
<script src='{% static "js/find_route.js" %}'></script>
|
||||||
<script src="{% static "js/filters_functions_find_route.js" %}"></script>
|
<script src="{% static "js/filters_functions_find_route.js" %}"></script>
|
||||||
@@ -52,17 +52,17 @@
|
|||||||
{% endblock %}
|
{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="wrapper">
|
<div class="wrapper_main">
|
||||||
{# modifided by boris#}
|
|
||||||
<div class="header_big_background">
|
|
||||||
</div>
|
|
||||||
{% include 'blocks/b_header.html' %}
|
{% include 'blocks/b_header.html' %}
|
||||||
<div class="line_f_header"></div>
|
<div class="wrapper_content">
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% include 'blocks/b_footer.html' %}
|
{% include 'blocks/b_footer.html' %}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user