Krasnikov.pro
3 years ago
parent
3fcf7fd325
commit
53262b4af3
@ -0,0 +1,58 @@ |
||||
.block { |
||||
display: block ruby; |
||||
margin-bottom: 15px; |
||||
margin-left: 15px; |
||||
border-spacing: 0; |
||||
border-collapse: separate; |
||||
|
||||
&_selector { |
||||
-moz-transition: border 250ms, color 250ms; |
||||
-o-transition: border 250ms, color 250ms; |
||||
-webkit-transition: border 250ms, color 250ms; |
||||
transition: border 250ms, color 250ms; |
||||
cursor: pointer; |
||||
|
||||
ul { |
||||
margin-left: -25px; |
||||
|
||||
&:first-of-type { |
||||
margin-bottom: 6px; |
||||
} |
||||
li { |
||||
padding: 5px; |
||||
cursor: pointer; |
||||
font-size: 14px; |
||||
display: table-cell; |
||||
height: 24px; |
||||
vertical-align: middle; |
||||
text-align: center; |
||||
position: relative; |
||||
padding-left: 8px; |
||||
padding-right: 8px; |
||||
border-radius: 32px; |
||||
|
||||
&.active { |
||||
background: #FED11E; |
||||
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); |
||||
cursor: auto; |
||||
} |
||||
|
||||
&.size{ |
||||
width: 60px; |
||||
height: 32px; |
||||
border-radius: 8px; |
||||
} |
||||
|
||||
&.type{ |
||||
width: 178px; |
||||
height: 24px; |
||||
border-radius: 12px; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 12px; |
||||
-ms-border-radius: 12px; |
||||
-o-border-radius: 12px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,59 @@ |
||||
.block { |
||||
display: block ruby; |
||||
margin-bottom: 15px; |
||||
margin-left: 15px; |
||||
border-spacing: 0; |
||||
border-collapse: separate; |
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
||||
|
||||
&_selector { |
||||
-moz-transition: border 250ms, color 250ms; |
||||
-o-transition: border 250ms, color 250ms; |
||||
-webkit-transition: border 250ms, color 250ms; |
||||
transition: border 250ms, color 250ms; |
||||
cursor: pointer; |
||||
|
||||
ul { |
||||
margin-left: -25px; |
||||
|
||||
&:first-of-type { |
||||
margin-bottom: 6px; |
||||
} |
||||
li { |
||||
padding: 5px; |
||||
cursor: pointer; |
||||
font-size: 14px; |
||||
display: table-cell; |
||||
height: 24px; |
||||
vertical-align: middle; |
||||
text-align: center; |
||||
position: relative; |
||||
padding-left: 8px; |
||||
padding-right: 8px; |
||||
border-radius: 32px; |
||||
|
||||
&.active { |
||||
background: #FED11E; |
||||
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); |
||||
cursor: auto; |
||||
} |
||||
|
||||
&.size{ |
||||
width: 60px; |
||||
height: 32px; |
||||
border-radius: 8px; |
||||
} |
||||
|
||||
&.type{ |
||||
width: 178px; |
||||
height: 24px; |
||||
border-radius: 12px; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 12px; |
||||
-ms-border-radius: 12px; |
||||
-o-border-radius: 12px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,60 @@ |
||||
.block { |
||||
display: block ruby; |
||||
margin-bottom: 15px; |
||||
margin-left: 15px; |
||||
border-spacing: 0; |
||||
border-collapse: separate; |
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
||||
|
||||
&_selector { |
||||
-moz-transition: border 250ms, color 250ms; |
||||
-o-transition: border 250ms, color 250ms; |
||||
-webkit-transition: border 250ms, color 250ms; |
||||
transition: border 250ms, color 250ms; |
||||
cursor: pointer; |
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
||||
|
||||
ul { |
||||
margin-left: -25px; |
||||
|
||||
&:first-of-type { |
||||
margin-bottom: 6px; |
||||
} |
||||
li { |
||||
padding: 5px; |
||||
cursor: pointer; |
||||
font-size: 14px; |
||||
display: table-cell; |
||||
height: 24px; |
||||
vertical-align: middle; |
||||
text-align: center; |
||||
position: relative; |
||||
padding-left: 8px; |
||||
padding-right: 8px; |
||||
border-radius: 32px; |
||||
|
||||
&.active { |
||||
background: #FED11E; |
||||
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); |
||||
cursor: auto; |
||||
} |
||||
|
||||
&.size{ |
||||
width: 60px; |
||||
height: 32px; |
||||
border-radius: 8px; |
||||
} |
||||
|
||||
&.type{ |
||||
width: 178px; |
||||
height: 24px; |
||||
border-radius: 12px; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 12px; |
||||
-ms-border-radius: 12px; |
||||
-o-border-radius: 12px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,59 @@ |
||||
.block { |
||||
display: block ruby; |
||||
margin-bottom: 15px; |
||||
margin-left: 15px; |
||||
border-spacing: 0; |
||||
border-collapse: separate; |
||||
|
||||
&_selector { |
||||
-moz-transition: border 250ms, color 250ms; |
||||
-o-transition: border 250ms, color 250ms; |
||||
-webkit-transition: border 250ms, color 250ms; |
||||
transition: border 250ms, color 250ms; |
||||
cursor: pointer; |
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
||||
|
||||
ul { |
||||
margin-left: -25px; |
||||
|
||||
&:first-of-type { |
||||
margin-bottom: 6px; |
||||
} |
||||
li { |
||||
padding: 5px; |
||||
cursor: pointer; |
||||
font-size: 14px; |
||||
display: table-cell; |
||||
height: 24px; |
||||
vertical-align: middle; |
||||
text-align: center; |
||||
position: relative; |
||||
padding-left: 8px; |
||||
padding-right: 8px; |
||||
border-radius: 32px; |
||||
|
||||
&.active { |
||||
background: #FED11E; |
||||
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); |
||||
cursor: auto; |
||||
} |
||||
|
||||
&.size{ |
||||
width: 60px; |
||||
height: 32px; |
||||
border-radius: 8px; |
||||
} |
||||
|
||||
&.type{ |
||||
width: 178px; |
||||
height: 24px; |
||||
border-radius: 12px; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 12px; |
||||
-ms-border-radius: 12px; |
||||
-o-border-radius: 12px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,91 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
height: 250px; |
||||
overflow-y: scroll; |
||||
margin-left: 10px; |
||||
|
||||
@media (min-width: 640px) { |
||||
ul { |
||||
padding-top: 8px; |
||||
flex-wrap: wrap; |
||||
} |
||||
} |
||||
|
||||
.ul { |
||||
padding-top: 16px; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.li { |
||||
list-style-type: none; |
||||
margin: 5px; |
||||
width: 83px; |
||||
|
||||
.text_box { |
||||
border-radius: 30%; |
||||
height: 128px; |
||||
|
||||
&.none_ing { |
||||
background-color: $color_none; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
&.yellow_ing { |
||||
background-color: $color_yellow; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
.img_ing { |
||||
color: rgb(0, 0, 0); |
||||
height: 52px; |
||||
width: 52px; |
||||
margin: 0 auto; |
||||
border-radius: 50%; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.title_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.price_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.button_ing{ |
||||
display: inline-block; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 50%; |
||||
border-radius: 50%; |
||||
-khtml-border-radius: 50%;; |
||||
width: 28px; |
||||
height: 25px; |
||||
margin-top: 10px; |
||||
border: aliceblue; |
||||
} |
||||
|
||||
@import 'products'; |
||||
} |
||||
} |
||||
|
||||
.buttonCheck{ |
||||
font-size: 24px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.plus{ |
||||
background: url('/assets/img/plus.png') 100% 100% no-repeat; |
||||
} |
||||
|
||||
.minus{ |
||||
background: url('/assets/img/minus.png') 0% no-repeat; |
||||
margin-right: auto !important; |
||||
margin-left: auto !important; |
||||
} |
||||
@ -0,0 +1,91 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
height: 200px; |
||||
overflow-y: scroll; |
||||
margin-left: 10px; |
||||
|
||||
@media (min-width: 640px) { |
||||
ul { |
||||
padding-top: 8px; |
||||
flex-wrap: wrap; |
||||
} |
||||
} |
||||
|
||||
.ul { |
||||
padding-top: 16px; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.li { |
||||
list-style-type: none; |
||||
margin: 5px; |
||||
width: 83px; |
||||
|
||||
.text_box { |
||||
border-radius: 30%; |
||||
height: 128px; |
||||
|
||||
&.none_ing { |
||||
background-color: $color_none; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
&.yellow_ing { |
||||
background-color: $color_yellow; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
.img_ing { |
||||
color: rgb(0, 0, 0); |
||||
height: 52px; |
||||
width: 52px; |
||||
margin: 0 auto; |
||||
border-radius: 50%; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.title_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.price_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.button_ing{ |
||||
display: inline-block; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 50%; |
||||
border-radius: 50%; |
||||
-khtml-border-radius: 50%;; |
||||
width: 28px; |
||||
height: 25px; |
||||
margin-top: 10px; |
||||
border: aliceblue; |
||||
} |
||||
|
||||
@import 'products'; |
||||
} |
||||
} |
||||
|
||||
.buttonCheck{ |
||||
font-size: 24px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.plus{ |
||||
background: url('/assets/img/plus.png') 100% 100% no-repeat; |
||||
} |
||||
|
||||
.minus{ |
||||
background: url('/assets/img/minus.png') 0% no-repeat; |
||||
margin-right: auto !important; |
||||
margin-left: auto !important; |
||||
} |
||||
@ -0,0 +1,91 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
height: 100px; |
||||
overflow-y: scroll; |
||||
margin-left: 10px; |
||||
|
||||
@media (min-width: 640px) { |
||||
ul { |
||||
padding-top: 8px; |
||||
flex-wrap: wrap; |
||||
} |
||||
} |
||||
|
||||
.ul { |
||||
padding-top: 16px; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.li { |
||||
list-style-type: none; |
||||
margin: 5px; |
||||
width: 83px; |
||||
|
||||
.text_box { |
||||
border-radius: 30%; |
||||
height: 128px; |
||||
|
||||
&.none_ing { |
||||
background-color: $color_none; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
&.yellow_ing { |
||||
background-color: $color_yellow; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
.img_ing { |
||||
color: rgb(0, 0, 0); |
||||
height: 52px; |
||||
width: 52px; |
||||
margin: 0 auto; |
||||
border-radius: 50%; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.title_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.price_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.button_ing{ |
||||
display: inline-block; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 50%; |
||||
border-radius: 50%; |
||||
-khtml-border-radius: 50%;; |
||||
width: 28px; |
||||
height: 25px; |
||||
margin-top: 10px; |
||||
border: aliceblue; |
||||
} |
||||
|
||||
@import 'products'; |
||||
} |
||||
} |
||||
|
||||
.buttonCheck{ |
||||
font-size: 24px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.plus{ |
||||
background: url('/assets/img/plus.png') 100% 100% no-repeat; |
||||
} |
||||
|
||||
.minus{ |
||||
background: url('/assets/img/minus.png') 0% no-repeat; |
||||
margin-right: auto !important; |
||||
margin-left: auto !important; |
||||
} |
||||
@ -0,0 +1,91 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
height: 200px; |
||||
overflow-y: scroll; |
||||
margin-left: 10px; |
||||
|
||||
@media (min-width: 640px) { |
||||
ul { |
||||
padding-top: 8px; |
||||
flex-wrap: wrap; |
||||
} |
||||
} |
||||
|
||||
.ul { |
||||
padding-top: 16px; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.li { |
||||
list-style-type: none; |
||||
margin: 5px; |
||||
width: 83px; |
||||
|
||||
.text_box { |
||||
border-radius: 30%; |
||||
height: 128px; |
||||
|
||||
&.none_ing { |
||||
background-color: $color_none; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
&.yellow_ing { |
||||
background-color: $color_yellow; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
.img_ing { |
||||
color: rgb(0, 0, 0); |
||||
height: 52px; |
||||
width: 52px; |
||||
margin: 0 auto; |
||||
border-radius: 50%; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.title_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.price_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.button_ing{ |
||||
display: inline-block; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 50%; |
||||
border-radius: 50%; |
||||
-khtml-border-radius: 50%;; |
||||
width: 28px; |
||||
height: 25px; |
||||
margin-top: 10px; |
||||
border: aliceblue; |
||||
} |
||||
|
||||
@import 'products'; |
||||
} |
||||
} |
||||
|
||||
.buttonCheck{ |
||||
font-size: 24px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.plus{ |
||||
background: url('/assets/img/plus.png') 100% 100% no-repeat; |
||||
} |
||||
|
||||
.minus{ |
||||
background: url('/assets/img/minus.png') 0% no-repeat; |
||||
margin-right: auto !important; |
||||
margin-left: auto !important; |
||||
} |
||||
@ -0,0 +1,91 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
height: 180px; |
||||
overflow-y: scroll; |
||||
margin-left: 10px; |
||||
|
||||
@media (min-width: 640px) { |
||||
ul { |
||||
padding-top: 8px; |
||||
flex-wrap: wrap; |
||||
} |
||||
} |
||||
|
||||
.ul { |
||||
padding-top: 16px; |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.li { |
||||
list-style-type: none; |
||||
margin: 5px; |
||||
width: 83px; |
||||
|
||||
.text_box { |
||||
border-radius: 30%; |
||||
height: 128px; |
||||
|
||||
&.none_ing { |
||||
background-color: $color_none; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
&.yellow_ing { |
||||
background-color: $color_yellow; |
||||
padding: 5px 5px 5px 5px; |
||||
} |
||||
|
||||
.img_ing { |
||||
color: rgb(0, 0, 0); |
||||
height: 52px; |
||||
width: 52px; |
||||
margin: 0 auto; |
||||
border-radius: 50%; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.title_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.price_ing{ |
||||
color: rgb(0, 0, 0); |
||||
font-size: 12px; |
||||
} |
||||
|
||||
.button_ing{ |
||||
display: inline-block; |
||||
-webkit-border-radius: 12px; |
||||
-moz-border-radius: 50%; |
||||
border-radius: 50%; |
||||
-khtml-border-radius: 50%;; |
||||
width: 28px; |
||||
height: 25px; |
||||
margin-top: 10px; |
||||
border: aliceblue; |
||||
} |
||||
|
||||
@import 'products'; |
||||
} |
||||
} |
||||
|
||||
.buttonCheck{ |
||||
font-size: 24px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.plus{ |
||||
background: url('/assets/img/plus.png') 100% 100% no-repeat; |
||||
} |
||||
|
||||
.minus{ |
||||
background: url('/assets/img/minus.png') 0% no-repeat; |
||||
margin-right: auto !important; |
||||
margin-left: auto !important; |
||||
} |
||||
@ -0,0 +1,31 @@ |
||||
.onion{ |
||||
background: url('/assets/img/onion.png') 100% 100% white; |
||||
} |
||||
|
||||
.bacon{ |
||||
background: url('/assets/img/bacon.png') 100% 100% white; |
||||
} |
||||
|
||||
.cheese{ |
||||
background: url('/assets/img/cheese.png') 100% 100% white; |
||||
} |
||||
|
||||
.jalapeno{ |
||||
background: url('/assets/img/jalapeno.png') 100% 100% white; |
||||
} |
||||
|
||||
.mushroom{ |
||||
background: url('/assets/img/mushroom.png') 100% 100% white; |
||||
} |
||||
|
||||
.pickles{ |
||||
background: url('/assets/img/pickles.png') 100% 100% white; |
||||
} |
||||
|
||||
.pineapple{ |
||||
background: url('/assets/img/pineapple.png') 100% 100% white; |
||||
} |
||||
|
||||
.tomato{ |
||||
background: url('/assets/img/tomato.png') 100% 100% white; |
||||
} |
||||
@ -0,0 +1,47 @@ |
||||
.onion { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/onion.png'); |
||||
} |
||||
|
||||
.bacon { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/bacon.png') 100% 100% white; |
||||
} |
||||
|
||||
.cheese { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/cheese.png') 100% 100% white; |
||||
} |
||||
|
||||
.jalapeno { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/jalapeno.png') 100% 100% white; |
||||
} |
||||
|
||||
.mushroom { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/mushroom.png') 100% 100% white; |
||||
} |
||||
|
||||
.pickles { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pickles.png') 100% 100% white; |
||||
} |
||||
|
||||
.pineapple { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pineapple.png') 100% 100% white; |
||||
} |
||||
|
||||
.tomato { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/tomato.png') 100% 100% white; |
||||
} |
||||
@ -0,0 +1,47 @@ |
||||
.onion { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/onion.png'); |
||||
} |
||||
|
||||
.bacon { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/bacon.png'); |
||||
} |
||||
|
||||
.cheese { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/cheese.png'); |
||||
} |
||||
|
||||
.jalapeno { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/jalapeno.png'); |
||||
} |
||||
|
||||
.mushroom { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/mushroom.png'); |
||||
} |
||||
|
||||
.pickles { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pickles.png'); |
||||
} |
||||
|
||||
.pineapple { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pineapple.png'); |
||||
} |
||||
|
||||
.tomato { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/tomato.png'); |
||||
} |
||||
@ -0,0 +1,141 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
|
||||
|
||||
@ -0,0 +1,128 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,128 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,134 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
|
||||
|
||||
@media (max-width: 940px) { |
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
|
||||
@media (max-width: 940px) { |
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
|
||||
@media (max-width: 766px) { |
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,141 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
|
||||
@media (min-width:600px) { |
||||
.dialog { |
||||
|
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
@media (min-width:1281px) { |
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,140 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
|
||||
@media (max-width:760px) { |
||||
.dialog { |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
.dialog { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,140 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
|
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
max-width: 400px; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,138 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 900px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,138 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 1010px; |
||||
width: 100vw; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,139 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
.pizza_modal_card{ |
||||
padding-top: 5px; |
||||
} |
||||
} |
||||
@ -0,0 +1,136 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -0,0 +1,137 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
border-radius: 20px; |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
height: 500px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -0,0 +1,142 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
height: 500px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
border-radius: 20px; |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -0,0 +1,144 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
width: 100vw; |
||||
height: 500px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -0,0 +1,144 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
height: 500px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
width: 100vw; |
||||
} |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -0,0 +1,149 @@ |
||||
.pizza_modal_card { |
||||
display: block; /* Hidden by default */ |
||||
position: fixed; /* Stay in place */ |
||||
z-index: 100; /* Sit on top */ |
||||
left: 0; |
||||
top: 0; |
||||
width: 100%; /* Full width */ |
||||
height: 100%; /* Full height */ |
||||
overflow: auto; /* Enable scroll if needed */ |
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ |
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
position: fixed; |
||||
top: 50%; |
||||
left: 50%; |
||||
transform: translate(-50%, -50%); |
||||
height: 533px; |
||||
width: 900px; |
||||
-webkit-transform: translate(-50%, -50%); |
||||
-moz-transform: translate(-50%, -50%); |
||||
-ms-transform: translate(-50%, -50%); |
||||
-o-transform: translate(-50%, -50%); |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
.body{ |
||||
height: 100%; |
||||
flex-wrap: wrap; |
||||
display: flex; |
||||
|
||||
.left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
|
||||
.img{ |
||||
text-align: center; |
||||
height: 100%; |
||||
display: grid;; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
} |
||||
} |
||||
|
||||
.right{ |
||||
background: #F7F7F7; |
||||
height: 500px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
|
||||
@media (max-width:760px) { |
||||
width: 100vw; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
width: 400px; |
||||
} |
||||
|
||||
.header{ |
||||
height: 450px; |
||||
letter-spacing: 0.02em; |
||||
|
||||
.title{ |
||||
font-size: 20px; |
||||
line-height: 24px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
.feature{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
margin: 10px 10px 10px 15px; |
||||
color: #8E8E93; |
||||
} |
||||
|
||||
.description{ |
||||
font-size: 13px; |
||||
line-height: 15px; |
||||
color: #252A48; |
||||
margin: 10px 10px 10px 15px; |
||||
} |
||||
/* Блок переключения */ |
||||
@import 'block_selector'; |
||||
@import 'ingredients'; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.modal_footer{ |
||||
display: table; |
||||
margin: 0 auto; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
/* The Close Button */ |
||||
.close { |
||||
color: #aaaaaa; |
||||
float: right; |
||||
font-size: 28px; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.close:hover, |
||||
.close:focus { |
||||
color: #000; |
||||
text-decoration: none; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
.position_product{ |
||||
padding-top: 100px; |
||||
/* padding-top: 100px; |
||||
right: 0; |
||||
left: unset !important; |
||||
position: absolute;*/ |
||||
} |
||||
|
||||
@media (max-width: 940px) { |
||||
.pizza_modal_card { |
||||
height: 100vh; |
||||
width: 100vw; |
||||
} |
||||
} |
||||
@ -1,87 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Выставляем основные настройки по-умолчанию для body */ |
||||
body { |
||||
min-height: 100vh; |
||||
scroll-behavior: smooth; |
||||
text-rendering: optimizeSpeed; |
||||
line-height: 1.5; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
/margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
/*margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
/*margin: 0;*/ |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
|
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,79 +0,0 @@ |
||||
/* Указываем box sizing */ |
||||
*, |
||||
*::before, |
||||
*::after { |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
/* Убираем внутренние отступы */ |
||||
ul[class], |
||||
ol[class] { |
||||
padding: 0; |
||||
} |
||||
|
||||
/* Убираем внешние отступы */ |
||||
body, |
||||
h1, |
||||
h2, |
||||
h3, |
||||
h4, |
||||
p, |
||||
ul[class], |
||||
ol[class], |
||||
li, |
||||
figure, |
||||
figcaption, |
||||
blockquote, |
||||
dl, |
||||
dd { |
||||
margin: 0; |
||||
} |
||||
|
||||
/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ |
||||
ul[class], |
||||
ol[class] { |
||||
list-style: none; |
||||
} |
||||
|
||||
/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ |
||||
a:not([class]) { |
||||
text-decoration-skip-ink: auto; |
||||
} |
||||
a{ |
||||
text-decoration: none; /* Отменяем подчеркивание у ссылки */ |
||||
color: black; /* Цвет ссылок */ |
||||
margin: 0; |
||||
} |
||||
a:visited { |
||||
color: black; /* Цвет посещенных ссылок */ |
||||
} |
||||
a:active { |
||||
color: black; /* Цвет активных ссылок */ |
||||
} |
||||
/* Упрощаем работу с изображениями */ |
||||
img { |
||||
max-width: 100%; |
||||
display: block; |
||||
} |
||||
|
||||
/* Указываем понятную периодичность в потоке данных у article*/ |
||||
article > * + * { |
||||
margin-top: 1em; |
||||
} |
||||
|
||||
/* Наследуем шрифты для инпутов и кнопок */ |
||||
input, |
||||
textarea, |
||||
select { |
||||
font: inherit; |
||||
} |
||||
|
||||
/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ |
||||
@media (prefers-reduced-motion: reduce) { |
||||
* { |
||||
animation-duration: 0.01ms !important; |
||||
animation-iteration-count: 1 !important; |
||||
transition-duration: 0.01ms !important; |
||||
scroll-behavior: auto !important; |
||||
} |
||||
} |
||||
@ -1,31 +1,47 @@ |
||||
.onion{ |
||||
background: url('/assets/img/onion.png') 100% 100% no-repeat; |
||||
.onion { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/onion.png'); |
||||
} |
||||
|
||||
.bacon{ |
||||
background: url('/assets/img/bacon.png') 100% 100% no-repeat; |
||||
.bacon { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/bacon.png'); |
||||
} |
||||
|
||||
.cheese{ |
||||
background: url('/assets/img/cheese.png') 100% 100% no-repeat; |
||||
.cheese { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/cheese.png'); |
||||
} |
||||
|
||||
.jalapeno{ |
||||
background: url('/assets/img/jalapeno.png') 100% 100% no-repeat; |
||||
.jalapeno { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/jalapeno.png'); |
||||
} |
||||
|
||||
.mushroom{ |
||||
background: url('/assets/img/mushroom.png') 100% 100% no-repeat; |
||||
.mushroom { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/mushroom.png'); |
||||
} |
||||
|
||||
.pickles{ |
||||
background: url('/assets/img/pickles.png') 100% 100% no-repeat; |
||||
.pickles { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pickles.png'); |
||||
} |
||||
|
||||
.pineapple{ |
||||
background: url('/assets/img/pineapple.png') 100% 100% no-repeat; |
||||
.pineapple { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/pineapple.png'); |
||||
} |
||||
|
||||
.tomato{ |
||||
background: url('/assets/img/tomato.png') 100% 100% no-repeat; |
||||
.tomato { |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-image: url('/assets/img/tomato.png'); |
||||
} |
||||
Loading…
Reference in new issue