* { box-sizing: border-box; }
body
{ margin: 0; padding: 0; font-family: 'Nunito Sans', sans-serif; background-color: #f4f4f9; text-align: center; }
a, input[type="submit"]:hover
{ webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
fieldset
{ margin: 0; padding: 0; border: 0; }
input, textarea
{ font-family: 'Nunito Sans', Helvetica, Sans-serif; }
h1
{ display: block; }
div#header
{ width: 100%; height: 200px; background: #1E5D78 url(images/havas.svg) bottom left repeat-x; background-size: 400px 40px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
div#header h1
{ font-size: 60px; font-weight: 200; line-height: 70px; color: #FFFFFF; text-align: center; }
div#header h1 a
{ color: #FFFFFF; text-decoration: none; }
div#header img
{ width: 50%; max-width: 300px; height: auto; }
div#header-under
{ width: 100%; height: 30px; background: linear-gradient(to bottom, #FFFFFF, #f4f4f9); }
div#cont
{ margin: 20px auto 20px auto; width: 96%; max-width: 1350px; text-align: left; }
.calendar
{ padding: 20px; display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; }
.day
{ padding: 20px; flex: 1 1 calc(20% - 20px); min-width: 250px; font-size: 16px; font-weight: bold; color: #FFFFFF; background-color: #9FB8CF; background-position: 20px 30px; background-repeat: no-repeat; background-size: 20%; border-radius: 10px; text-align: center; aspect-ratio: 1 / 1;  /* fallback */ position: relative; width: 100%; }
.day::before /* fallback */
{ content: ""; display: block; padding-top: 100%; }
.day > * /* fallback */
{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; }
.day.open
{ color: #FFFFFF; background-color: #9FB8CF; webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
.day.closed
{ color: #FFFFFF; background-color: #1E5D78; }
.day a
{ color: #FFFFFF; text-decoration: none; }
.day.open:hover
{ background-color: #B1CCE6; }
.day span
{ display: inline; position: absolute; top: 20px; right: 20px; left: auto; font-size: 60px; font-weight: bold; }
.day.closed span, .day.closed a
{ color: #9FB8CF; }
.day h2, .day h3
{ margin: 120px 20px 0 20px; }
.day h2
{ font-size: 25px; line-height: 34px; color: #1E5D78; }
.day h3
{ font-size: 24px; line-height: 34px; color: #9FB8CF; }
div.gift
{ width: 100%; text-align: center; }
div.gift div
{ display: inline-block; font-size: 30px; font-weight: 500; line-height: 46px; background: #FFFFFF; border: 2px solid #9FB8CF; border-radius: 10px; }
div.gift img
{ display: inline; vertical-align: bottom; width: 60px; height: 60px; margin-right: 10px; }
div.gift a
{ padding: 10px; color: #1E5D78; text-decoration: none; display: block; border-radius: 7px; }
div.gift a:hover
{ color: #FFFFFF; background: #13BDF8; }
div.half
{ padding: 20px; flex: 1 1 calc(50% - 20px); min-width: 300px; font-size: 16px; font-weight: bold; color: #222222; background-color: #FFFFFF; border-radius: 10px; }
div.half img.large-pic
{ width: 100%; }
div.gift p, div.half p, div.half li
{ font-size: 20px; font-weight: 400; line-height: 30px; }
div.half a
{ color: #1E5D78; text-decoration: none; border-bottom: 1px solid #13BDF8; }
div.half a:hover
{ color: #13BDF8; border: none; }
/* kozossegi media ikonok */
.social-icons
{ margin-top: 40px; margin-bottom: 40px; display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; padding: 10px; }
div.half .social-icons a
{ border: none; }
.icon img
{ display: block; width: 50px; height: 50px; transition: transform 0.3s ease; }
.icon img:hover
{ transform: scale(1.1); }
div#button-back
{ margin-top: 30px; margin-bottom: 40px; display: inline-block; font-size: 20px; font-weight: 500; line-height: 26px; background: #FFFFFF; border: 1px solid #9FB8CF; border-radius: 10px; }
div#button-back a
{ padding: 10px; color: #1E5D78; text-decoration: none; display: block; border-radius: 7px; }
div#button-back a:hover
{ color: #FFFFFF; background: #13BDF8; }
/* form */
div.newsletter
{ margin: 0 auto 20px auto; width: 100%; max-width: 780px; font-size: 20px; line-height: 26px; }
div.newsletter h2
{ line-height: 40px; }
div.newsletter h3
{ padding-top: 10px; line-height: 30px; }
div.success-message, div.error-message
{ margin: 10px 0 30px 0; padding: 10px; font-weight: bold; border-radius: 7px; }
div.success-message
{ color: #3FB54E; border: 2px solid #3FB54E; }
div.success-message a
{ color: #3FB54E !important; }
div.error-message
{ color: #FFFFFF; background: #F22C25; }
form#lp-subscribe
{ padding-top: 20px; }
form#lp-subscribe fieldset
{ padding: 10px; }
form#lp-subscribe a
{ color: #0A1D1F; }
form#lp-subscribe label.input-label
{ display: block; font-weight: bold; text-align: left; }
form#lp-subscribe input
{ display: block; }
form#lp-subscribe input[type="text"]
{ width: 100%; margin: 5px 0 15px 0; padding: 10px; font-size: 16px; line-height: 20px; background: #FFFFFF; border: 0; border-radius: 5px; }
form#lp-subscribe input[type="checkbox"]
{ display: inline; background: #FFFFFF; border: 0; }
form#lp-subscribe input[type="submit"]
{ margin: 30px auto 50px auto; padding: 15px 30px 15px 30px; font-size: 19px; font-weight: bold; line-height: 27px; color: #FFFFFF; background: #2B84AA; text-transform: none; border: 0; border-radius: 5px; cursor: pointer; }
form#lp-subscribe input[type="submit"]:hover
{ background: #10BEFA; }
form#lp-subscribe p,
form#lp-subscribe div.label label
{ margin-top: 30px; font-size: 17px; line-height: 25px; color: #0A1D1F; text-align: left; }
form#lp-subscribe div.label
{ text-align: left; }
section.lp-subscribe-cont div.third
{ height: 480px; text-align: center; }
section.lp-subscribe-cont div.third img
{ margin-top: 50px; width: 80%; }
section.lp-subscribe-cont div.third h3
{ font-size: 30px; color: #0A1D1F; }
section.lp-subscribe-cont div.third h3:before
{ content: ""; }
section.lp-subscribe-cont div.third h4
{ margin-right: 10px; margin-left: 10px; font-weight: bold; }
section.lp-subscribe-cont div.third h4:nth-of-type(2)
{ color: #DC1A35; }
section.lp-subscribe-cont div.third p
{ margin-right: 10px; margin-left: 10px; font-size: 16px; line-height: 22px; }
section.lp-subscribe-cont div.dmy-button
{ margin: 30px auto 50px auto; padding: 15px 30px 15px 30px; width: 160px; font-size: 15px; font-weight: bold; color: #FFFFFF; background: #DC1A35; text-align: center; border-radius: 5px; }
section.lp-subscribe-cont div.dmy-button:hover
{ background: #F51D3B; border-radius: 5px; }
