/* Dodaj swój kod CSS tutaj.
Na przykład:
.przyklad {
color: red;
}
Sprawdź poniższą stronę, jeśli chcesz poszerzyć swoją wiedzę nt. CSS:
http://www.w3schools.com/css/css_syntax.asp
Koniec komentarza */
.mobile-visible,
.primary-nav ul li.mobile-visible{
display:none;
}
@media screen and (max-width: 1260px){
.primary-nav ul li.mobile-visible{
display:inline-block;
}
}
@media screen and (max-width: 768px){
.mobile-visible{
display:inline-block;
color:white;
margin-bottom:25px!important;
}
.mobile-visible a{
color:white;
margin-bottom:25px;
}
#proassistHandle{
display:none;
}
#proassistHandle.visible{
display:block;
}
.proassist-content {
width:100%;
}
.registration-popup.open{
display: flex;
}
}
.registration-popup{
background-color: #d0524e;
border-radius: 7px;
max-height: 150px;
width: calc(100% – 30px);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
/* max-width:290px; */
color: white;
font-family: ‘Lato’, sans-serif;
position: fixed;
top: 35%;
left: 50%;
transform: translateX(-50%);
padding: 35px;
display: none;
z-index:999;
}
.registration-popup-close{
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
background-color:white;
color: #d0524e;
position: absolute;
top: 10px;
right: 10px;
}
.registration-popup h2{
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
color:white;
}
.registration-popup-button{
background-color: white;
border: none;
border-radius: 7px;
padding: 12px 28px;
color: #d0524e;
font-size: 18px;
font-weight: bold;
border:2px solid white
}
.registration-popup-button:hover{
background-color: #d0524e;
color:white;
}
#proassistWidget{
display:none!important;
}
.calendar-icon {
position: fixed;
bottom: 60px;
right: 60px;
width: 110px;
height: 110px;
border-radius: 50%;
padding: 20px;
animation: shake-periodic 5s ease-in-out infinite;
background-color: #DB504A; /* zamiast $blue */
z-index: 5;
border: 4px solid #DB504A; /* zamiast $alt */
display: grid;
place-items: center;
text-decoration: none;
}
.calendar-icon .svg {
height: auto;
}
.calendar-icon .svg path {
fill: #ffffff; /* zamiast $white */
}
.calendar-icon-text {
position: absolute;
top: 50%;
left: 50%;
width: 170px;
height: 170px;
transform: translate(-50%, -50%);
pointer-events: none;
overflow: visible;
}
.calendar-icon-text text {
fill: #DB504A; /* zamiast $blue */
font-family: inherit;
font-weight: 700;
font-size: 18px;
letter-spacing: .12em;
text-transform: uppercase;
}
/* =========================
RWD
========================= */
/* Duże laptopy / małe desktopy */
@media (max-width: 1199px) {
.calendar-icon {
bottom: 40px;
right: 40px;
width: 96px;
height: 96px;
padding: 18px;
}
.calendar-icon-text {
width: 140px;
height: 140px;
}
.calendar-icon-text text {
font-size: 16px;
}
}
/* Tablety / większe telefony w poziomie */
@media (max-width: 767px) {
.calendar-icon {
bottom: 24px;
right: 24px;
width: 82px;
height: 82px;
padding: 14px;
border-width: 3px;
}
.calendar-icon-text {
width: 120px;
height: 120px;
}
.calendar-icon-text text {
font-size: 14px;
letter-spacing: .10em;
}
}
/* Małe telefony */
@media (max-width: 480px) {
.calendar-icon {
bottom: 18px;
right: 18px;
width: 72px;
height: 72px;
padding: 12px;
}
.calendar-icon-text {
width: 100px;
height: 140px;
}
.calendar-icon-text text {
font-size: 13px;
letter-spacing: .08em;
}
}
