@charset 'utf-8';

* {
margin: 0px; padding: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
border-style: none;
border-width: 1px;
border-color: #000000;
border-radius: 0px;
color: #000000;
text-decoration: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
outline: none;
cursor: default;
background: none;
background-repeat: no-repeat;
background-position: center center;
}

.noselect {
-webkit-user-select: none;/* Safari, Chrome */
-moz-user-select: none;/* Firefox */
-ms-user-select: none;/* Internet Explorer, Edge */
user-select: none;/* Modern böngészők */
}

input, textarea, select, button {
-webkit-appearance: none;/* Safari és iOS egyedi stílusok kikapcsolása */
-moz-appearance: none;/* Firefox */
appearance: none;
}

.hq_image { /* image-rendering: auto; */ }


.links {
text-decoration: none;
color: #0093ff;
cursor: pointer;
}.links:hover { text-decoration: underline; }
.links:visited { color: #0093ff; }
.list { margin-left: 20px; }


html, body {
margin: 0px; padding: 0px;
width: 100%; height: 100%;
overflow: auto;
background-color: #ffffff;
}

#master_box {
margin: 0px auto; padding: 0px;
width: 100%; height: 100%;
display: flex;
overflow: auto;
flex-direction: column;
}
#header_box {
position: sticky; top: 0px;
margin: 0px; padding: 0px;
width: 100%; min-height: 65px; height: 65px;
background-color: #00cfff;
background-image: linear-gradient(to right, #ffff00, #00cfff);
z-index: 5;
}
#logo_box {
margin: 0px 0px 0px 20px; padding: 0px 10px;
height: 100%;
float: left;
display: flex;
align-items: center;
cursor: pointer;
background-image: url('../images/logo.png');
background-position: left 10px center;
}#logo_box:hover { background-color: rgb(255, 255, 255, 0.3); }
#logo_box span {
margin: 0px 0px 0px 61px; padding: 0px;
font-family: Arial;
font-size: 34px;
letter-spacing: 2px;
font-weight: 700;
color: #80e7ff;
text-shadow: 0px 0.5px 1px #94b1bd, 1.5px 0px 1px #657b84, 0px -0.5px 1px #94b1bd, -0.5px 0px 1px #94b1bd;/* Finomabb árnyék 4 irányba */
cursor: pointer;
-webkit-text-stroke: 0;
}
#cart_box {
position: relative;
margin: 0px 100px 0px 0px; padding: 0px 10px;
width: 35px; height: 100%;
float: right;
cursor: pointer;
background-image: url('../images/cart.png');
}#cart_box:hover {  background-color: rgb(255, 255, 255, 0.3); }
#cart_p {
position: absolute; left: 35px; top: 8px;
margin: 0px; padding: 3px 5px;
border-radius: 7px;
box-sizing: border-box;
font-size: 12px;
color: #ffffff;
font-weight: 700;
line-height: 1;
white-space: nowrap;
display: inline-block;
cursor: pointer;
background-color: #ff0000;
}
#welcome_span {
margin: 0px; padding: 0px 10px;
height: 100%;
line-height: 65px;/* Ha a szülő div 65px magas */
float: right;
font-size: 16px;
letter-spacing: 1px;
color: #fdfdfd;
}
#profile_box {
margin: 0px 50px 0px 0px; padding: 0px 10px;
width: 35px; height: 100%;
float: right;
cursor: pointer;
}#profile_box:hover { background-color: rgb(255, 255, 255, 0.3); }

#content_box {
position: relative;
min-width: fit-content; min-height: fit-content; width: 100%;
display: flex;
flex: 1 1 auto;/* Kitölti a rendelkezésre álló helyet, de nem zsugorodik össze a minimális méret alá */
background-color: #fafafa;
}
#profile_login_box {
position: fixed; top: 65px; right: 30px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
width: 342px;
display: none;
}
.form_h1 {
margin: 10px 10px 30px 10px; padding: 0px;
font-size: 30px;
}
.form_p {
margin: 10px; padding: 0px;
font-size: 16px;
text-align: center;
line-height: 1.5;
}
.email_p {
margin: 20px 10px; padding: 0px;
font-size: 16px;
color: #858585; 
text-align: center;
}
.form_input {
margin: 10px; padding: 10px;
width: 300px;
border-radius: 8px;
border-style: solid;
border-color: #009bff;
cursor: text;
background-color: #ffffff;
}
.grey_form_input {
border-color: #bababa;
color: #aaaaaa;
cursor: default;
background-color: #dddddd;
}
#profile_pass_reminder_a {
margin: 0px 10px; padding: 0px;
float: right;
font-size: 14px;
}
.form_green_button {
margin: 20px 10px; padding: 0px;
width: 322px; height: 2em;
border-radius: 10px;
border-style: outset;
border-color: #17b451;
font-size: 20px;
color: #ffffff;
cursor: pointer;
background-color: #00b300;
}.form_green_button:hover {
background-color: #19b051;
}.form_green_button:active {
border-style: inset;
background-color: #1bbf58;
}
.form_blue_button {
margin: 20px 10px; padding: 0px;
width: 322px; height: 2em;
border-radius: 10px;
border-style: outset;
border-color: #1765b4;
font-size: 20px;
color: #ffffff;
cursor: pointer;
background-color: #0073e6;
}.form_blue_button:hover {
background-color: #1982d4;
}.form_blue_button:active {
border-style: inset;
background-color: #1b91e0;
}
.form_lime_button {
margin: 20px 10px; padding: 0px;
width: 322px; height: 2em;
border-radius: 10px;
border-style: outset;
border-color: #bdef00;
font-size: 20px;
color: #000000;
cursor: pointer;
background-color: #c7ff00;
}.form_lime_button:hover {
background-color: #cfff22;
}.form_lime_button:active {
border-style: inset;
background-color: #d7ff45;
}

.error_p {
margin: 10px; padding: 0px;
text-align: center;
color: #ff0000;
}
#login_error_p {
margin-top: 0px;
margin-bottom: 20px;
}
#reg_message {
margin-top: 0px;
margin-bottom: 20px;
}
#forgotten_password_change_error_p { margin-top: 0px; }
#profile_separator_box {
margin: 10px; padding: 0px;
border-bottom: 1px solid #dadde1;
}

#side_menu_wrapper_box {
margin: 0px; padding: 0px;
flex: 0 0 auto;/* Ne változzon a mérete */
background-color: #4bb9ff;
}
#side_menu_box {
position: sticky; top: 65px;
margin: 0px; padding: 0px;
min-width: 100px; max-width: 300px;
overflow-x: hidden;
}
#side_menu_box a {
margin: 0px; padding: 20px 15px;
font-size: 18px;
color: #ffffff;
display: block;
cursor: pointer;
white-space: normal;/* Engedi a sortörést */
word-break: break-word;/* Ha nincs szóköz, akkor is törje a szót */
overflow-wrap: anywhere;/* Modern böngészőkben még megbízhatóbb, fallback-ként is működik */
letter-spacing: 2px;
text-shadow: -1px 0 #2cadff, 0 1px #2cadff, 1px 0 #2cadff, 0 -1px #2cadff;
}#side_menu_box a:hover {
padding: 20px 5px 20px 25px;
background-color: #65c3ff;
}
.tipusok_match { background-color: #009bff; }

#no_prod {
margin: 0px; padding: 0px;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}

#footer_box {
margin: 0px; padding: 0px;
width: 100%; min-height: 50px;
background-color: #38dad3;
}

.product_kosar_span {
margin: 0px; padding: 0px;
width: 2.5em;/* Általánosan jó érték három számjegyre */
display: inline-block;
font-size: 20px;
text-align: center;
}
.product_kosar_button {
margin: 0px; padding: 0px;
width: 35px; height: 35px;
border-radius: 6px;
}
.product_kosar_button_inactive {
border-style: inset;
border-color: #ffffff;
color: #e3e3e3;
background-color: #8ad0a4;
}
.product_kosar_button_active {
border-style: outset;
border-color: #17b451;
color: #ffffff;
cursor: pointer;
background-color: #16a34a;
}.product_kosar_button_active:hover { background-color: #19b051; }
.product_kosar_button_active:active {
border-style: inset;
background-color: #1bbf58;
}

.cover_box {
position: fixed; top: 0px; left: 0px;
margin: 0px; padding: 10px;
width: calc(100vw - 20px); height: calc(100vh - 20px);
display: none;
justify-content: center;/* Vízszintesen középre */
align-items: center;/* Függőlegesen középre */
background-color: rgb(250, 250, 250, 0.95);
z-index: 7;
}

.form_box_wrapper {
margin: 0px; padding: 0px;
position: relative;
width: fit-content; max-height: calc(100vh - 40px);
display: flex;
flex-direction: column;
}
.form_box {
margin: 0px; padding: 0px;
width: 700px; height: calc(100% - 4px);
flex: 1 1 auto;/* töltse ki a rendelkezésre álló helyet */
border-radius: 10px;
border-style: outset;
border-width: 2px;
border-color: #009bff;
text-align: center;
overflow-y: auto;
overflow-x: hidden;
background-color: #ffffff;
}
.form_static_box {
margin: 10px; padding: 10px;
width: 600px;
border-radius: 10px;
border-style: outset;
border-width: 2px;
border-color: #009bff;
text-align: center;
background-color: #ffffff;
}
#reg_accept_p {
margin: 0px 5px 20px 5px; padding: 0px;
font-size: 13px;
text-align: center;
}
.reg_accept_a { font-size: 13px; }
.x_box {
position: absolute; right: -13px; top: -13px;
margin: 0px; padding: 0px;
width: 25px; height: 25px;
border-radius: 15px;
border-style: solid;
cursor: pointer;
background-image: url('../images/x.png');
background-color: #0073e6;
z-index: 8;
}.x_box:hover {
background-color: #1982d4;
}.x_box:active {
background-color: #1b91e0;
}