#price_info.price_layer {
z-index: 99;
position: fixed;
top: 100px;
left: 20px;
width: calc(100% - 40px);
}
#price_info .box {
padding-top: 20px;
}
#price_info.price_layer .box {
border: 1px solid rgba(0, 0, 0, 0.1);
background-color: #fff;
color: #000;
padding: 20px 0;
}
#price_info.price_section .box {
display: flex;
flex-wrap: wrap;
justify-content: start;
align-items: start;
}
#price_info.price_section .col {
padding: 20px;
}
#price_info h2,
#price_info table {
width: calc(100% - 20px);
margin: 0 auto 20px auto;
}
#price_info h2 {
color: #f4cc01;
text-transform: uppercase;
font-weight: bold;
}
#price_info h2 .close_price_info {
float: right;
}
#price_info th,
#price_info td {
text-align: right;
border: 1px solid rgba(0, 0, 0, 0.1);
padding: 3px 3px 3px 0;
vertical-align: middle;
}
#price_info th {
font-weight: bold;
}
#price_info .nav {
text-align: center;
}
#price_info .nav a:hover {
color: #f4cc01;
}
#price_info .big {
display: none;
}
body.no_price_info #price_info.price_layer {
display: none;
}
#price_info caption.gray,
#price_info caption a.gray,
#price_info .gray th,
#price_info .gray td {
font-style: italic;
color: #777;
}
#price_info caption.gray {
caption-side: bottom;
text-align: left;
padding-top: 10px;
}
@media screen and (min-width: 380px) {
#price_info.price_layer {
left: calc((100% - 340px) / 2);
width: 340px;
}
#price_info h2,
#price_info table {
width: 300px;
}
#price_info th,
#price_info td {
padding-right: 8px;
}
#price_info .big.inline {
display: inline;
}
#price_info .small {
display: none;
}
}