body { margin: 0; } .page_title { margin: 35px 0 30px 0; } @media screen and (max-width: 435px) { .page_title { margin: 4vw 0 3vw 0; } } /* -- Tiles */ .tiles_container { display: flex; flex-wrap: wrap; } @media screen and (max-width: 992px) { .tiles_container { flex-direction: column; } } .tile { flex: 1 0 45%; display: flex; flex-direction: column; align-items: center; border-radius: 30px; margin: 1rem 1rem; box-shadow: 2px 2px 3px rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.1); } .high_tile { min-height: 350px; } .small_tile { min-height: 250px; } .full_width_tile { flex: 1 0 90%; min-height: 100px; } .tile_title { display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #e7e9ed; font-size: 2.4rem; padding: 2rem 0; width: 80%; } .tile_content { position: relative; margin: 3rem 0; width: 80%; display: flex; height: 100%; } #home_tile_services_exchange .tile_content { height: 100%; flex-direction: column; align-items: center; text-align: center; } /* -- My Shifts tile */ #home_tile_my_services .tile_content { height: 100%; flex-direction: column; margin: auto; padding: 2rem 0; } @media screen and (min-width: 769px) { #home_tile_my_services .tile_content { width: 50%; } } #home_incoming_services { min-height: 80px; display: flex; flex-direction: column; } .shift_line { margin-left: 15px; line-height: 2; } .shift_line_chevron { color: #D9534F; margin-right: 5px; } #go_to_shift_history_area { width: 100%; display: flex; justify-content: center; } #home_go_to_shift_history { width: 100%; margin-top: 30px; } /* -- My Info tile */ #home_tile_my_info { position: relative; } #home_tile_my_info .tile_content { margin: 2rem 0; } .tile_icon { margin-right: 15px; color: #00a573; } #home_tile_my_info .tile_content { height: 100%; flex-direction: column; align-items: center; font-size: 1.6rem; } @media screen and (max-width: 576px) { #home_tile_my_info .tile_content { font-size: 1.4rem !important; } } #home .member_info { font-weight: bold; } .member_status_text_container { margin-bottom: 5px; } #member_status_action { display: flex; margin-bottom: 20px; } @media screen and (max-width: 992px) { #member_status_action { margin-top: 5px; margin-bottom: 10px; } } .choose_makeups { display: none; font-size: 1.5rem; } .unsuscribed_form_link { display: none; text-decoration: none; font-size: 1.7rem; word-break: normal; } .unsuscribed_form_link:hover { text-decoration: none; } @media (max-width: 435px) { .unsuscribed_form_link { font-size: 90%; line-height: 7vw; } } .member_status_up_to_date, .member_status_exempted { color: #5cb85c; } .member_status_alert, .member_status_delay { color: #f0ad4e; } .member_status_suspended, .member_status_unsubscribed { color: #d9534f; } .member_shift_name_area, .member_coop_number_area { margin-bottom: 10px; } .member_associated_partner_area { line-height: 1.3; } @media screen and (max-width: 992px) { .member_associated_partner_area { display: flex; flex-direction: column; align-items: center; } } .delay_date_stop_container { color: #f0ad4e; margin-top: -1rem; margin-bottom: 1rem; display: none; } #see_more_info { white-space: normal; } #see_more_info_link { width: 100%; } /* --Shifts exchange tile tile */ .home_link_button_area { width: 100%; display: flex; justify-content: center; height: 100%; } .home_link_button { width: 80%; margin: 30px auto auto auto; white-space: normal; } /* -- I have a question tile */ #go_to_forms { text-decoration: none; } #go_to_forms:hover { color: white; } #go_to_forms.active { color: white !important; } /* -- Shop info tile */ #shop_info_content { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 80%; margin: auto; } .shop_info_item { width: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 2rem; flex: 1 0 50%; } .shop_info_item h1,h2,h3,h4,h5,h6 { font-size: 2rem; } .opening_hours_title { margin-bottom: 10px; font-size: 2.3rem; font-weight: bold; } .shop_message_content { text-align: center; } @media screen and (min-width: 769px) { .shop_info_item { padding: 0 4rem; } .shop_message { border-left: 1px solid #e7e9ed; margin: 3rem 0; } } @media screen and (max-width: 992px) { #shop_info_content { flex-direction: column; } .shop_info_item { flex: 1 0 50%; width: 100%; font-size: 1.6rem; padding: 1.5rem 0; } .shop_info_item h1,h2,h3,h4,h5,h6 { font-size: 1.6rem; } .opening_hours_title { font-size: 1.9rem; } .shop_message { border-top: 1px solid #e7e9ed; } .shop_message_content { width: 90%; } } /* - No content page */ .message_error { padding: 7vw; font-size: 1.8rem; } .no_content_title { margin-bottom: 1.5rem; }