*{-webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; }
html, body{margin:0; padding:0; width:100%; height: 100%;}
body{background: #052036; font:20px "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color: #333; line-height: 1.2;}
div.pwa_wrap, div.wrap{background:#FFF;}
/********************************************************************************************************************************************************************************************************************/

/*ΕRROR PAGES*/
html.error, body.error{background: linear-gradient(148deg, #8d9b7a2e 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 80%, #8d9b7a2e 100%);}
body.error div.wrap {background: #8d9b7a21; display: flex; flex-direction: column; align-items: center; border: solid #485e2947 1px; padding: 50px; border-radius: 10px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
body.error div.wrap div.cy_logo{background-image: url(../common_resources/images/logos/cy_republic_gr.svg?version=231116); background-repeat: no-repeat; width: 200px; height: 162px; padding-right: 30px; margin-right:22px; border-right:solid 1px #485e2947; cursor: auto;}
body.error div.wrap div.cy_logo_gb{background-image: url(../common_resources/images/logos/cy_republic_gb.svg?version=231116); background-repeat: no-repeat; width: 200px; height: 162px; cursor: auto;}
body.error div.wrap h2 {font-size: 30px; color: #485E29; text-align: center; margin: 0; margin-top: 50px; font-family: 'Montserrat', sans-serif; font-weight: bold; text-transform: uppercase;}
body.error div.wrap a {display: table; margin: auto; background: #e48d1a; border-radius: 3px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 20px; text-decoration: none; color: #fff; text-transform: uppercase; padding: 10px 20px; margin-top: 30px;}

@media only screen and (max-width: 767px) {
body.error div.wrap h2{font-size: 20px;}
}

/********************************************************************************************************************************************************************************************************************/

/*WAITSCREEN*/
html.waitscreen, body.waitscreen{background: #FFF;}
body.waitscreen div.wrap{position: absolute; top:0; bottom:0; left:0; right:0; margin: auto; display:flex; flex-direction: column; align-items: center; justify-content: center;}

body.waitscreen div.wrap img.spinner{width:60px; margin-top: 30px; margin-bottom: 10px;}
body.waitscreen div.wrap div.cy_logo{background-image: url(../common_resources/images/logos/cy_republic_gr.svg?version=231116); background-repeat: no-repeat; width: 200px; height: 162px; padding-right: 30px; margin-right:22px; border-right:solid 1px #485e2947; cursor: auto;}
body.waitscreen div.wrap div.cy_logo_gb{background-image: url(../common_resources/images/logos/cy_republic_gb.svg?version=231116); background-repeat: no-repeat; width: 200px; height: 162px; cursor: auto;}

body.waitscreen div.waitscreen_txt{background: #FFF; border: solid 1px #485e2947; border-radius: 10px; padding: 40px;}
body.waitscreen div.wrap h1{text-align: center; margin-top: 0; margin-bottom: 10px; font-size: 30px; line-height: 1.2; color:#485E29;}
body.waitscreen div.wrap h2{text-align: center; margin-top: 20px; margin-bottom: 0; font-size: 17px; line-height: 1.2; color:#333;}
body.waitscreen div.wrap h3{text-align: center; margin-top: 20px; padding-top: 20px; margin-bottom: 0; border-top: solid 1px #485e2947; font-size:17px; line-height: 1.2; color:#e48d1a;}

/********************************************************************************************************************************************************************************************************************/

/*HEADINGS*/
h1{font:40px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#e48d1a; margin: 0; margin-bottom: 20px;}
h2{font:30px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #1376c7; margin: 0; margin-bottom:15px;}
h3{font:23px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #333; margin: 0; margin-bottom:15px;} 
h4{font:20px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#000; margin: 0; margin-bottom:10px;}
h4.kiosk_name{text-align:center;}
/********************************************************************************************************************************************************************************************************************/

p{margin-top:0;}
a{color: #000;}
a:hover{text-decoration: none;}
strong{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-weight: normal;}
ol, ul{margin: 0; padding: 0; padding-left: 20px;}
ol li, ul li{margin-bottom:10px;}
ol li ul{margin-top:15px; margin-bottom:20px;}
ol li ul li{list-style: square;}
ol li ul li input{margin:0;}
hr{border: 0; height: 3px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)); margin: 20px 0;}
div.clear{clear: both;}
span.footer_txt_terms{text-decoration: underline; cursor: pointer;}
span.footer_txt_terms:hover{text-decoration: none;}


/********************************************************************************************************************************************************************************************************************/

div.content{width:1600px; padding:20px; margin: auto;}
body.issued_ticket div.content, body.booked_appointment div.content{overflow: hidden;}
div.column{display:flex; align-items: baseline;}

/********************************************************************************************************************************************************************************************************************/

/*HEADER*/
div.header div.column{align-items: center;}
div.logos{display:inline-flex; align-items: center;}

div.cy_logo{background-image: url("../common_resources/images/logos/cy_republic_gr.svg?version=231116"); background-repeat: no-repeat; width:115px; height: 93px; cursor: pointer;}
body.selected_language_gb div.cy_logo{background-image: url("../common_resources/images/logos/cy_republic_gb.svg?version=231116"); background-repeat: no-repeat;}


div.pard_logo{background-image: url("../common_resources/images/logos/pard_logo.png?version=231116"); background-repeat: no-repeat; width:161px; height: 70px; cursor: pointer; margin-left: 20px;}

div.kep_logo{background-image: url("../common_resources/images/logos/kep_logo_gr.svg?version=231116"); background-repeat: no-repeat; width:121px; height: 93px; margin-left:25px; cursor: pointer;}
body.selected_language_gb div.kep_logo{background-image: url("../common_resources/images/logos/kep_logo_gb.svg?version=231116"); background-repeat: no-repeat; width: 121px; height: 93px; background-position: center;}

div.kepo_logo{background-image: url("../common_resources/images/logos/kepo_logo_gr.svg?version=231116");background-repeat: no-repeat; width:200px; height: 78px; margin-left:20px; cursor: pointer;}
body.selected_language_gb div.kepo_logo{background-image: url("../common_resources/images/logos/kepo_logo_gb.svg?version=231116"); background-repeat: no-repeat;}

div.languages{width: 100%; display: flex; align-items: center; justify-content: end; font-family:"PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#000;}
span.arrow_down{border: solid #494949; border-width: 0 3px 3px 0; display: inline-block; padding: 3px; transform: rotate(45deg); -webkit-transform: rotate(45deg); margin-left: 10px; top: -5px; position: relative;}

div.lang_container{display:flex; align-items: center; cursor: pointer;}
div.lang_container div.lang_icon{margin-right:10px;}
div.lang_icon img{width: 30px; border-radius: 3px; top:2px; position: relative;}

div.lang_popup{background:#FFF; border:solid #d7dee7 1px; min-width:200px; height: max-content; padding: 10px; top: 90px; box-shadow: 0px 0px 10px rgb(0 0 0 / 20%); border-radius: 3px; position: absolute; z-index: 2; visibility:hidden;}
div.lang_popup div.row{width: auto; display: flex; align-items: center; padding: 10px; margin: 0; margin-bottom:5px; cursor: pointer; border-radius: 3px;}
div.lang_popup div.lang_desc{margin-left:10px; font-family:"PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #000;}
div.lang_popup div.row div.lang_icon{height: 30px;}
div.lang_popup div.row:hover, div.lang_popup div.row.selected{background:#eef2f7;}

/*HEADER IMAGE*/
div.welcome_msg{width:100%;}
div.image_txt h1{font-size: 90px; color:#FFF; line-height: 1.1; margin-top:0; margin-bottom:20px; text-align: left;}
div.image_txt h2{font-size: 35px; color:#FFF;}
div.image_txt p{text-align: left; font-family:"PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; font-size: 22px; line-height: 1; margin-top: 10px;}


div.header_image{width: 100%; max-width: 100%; height: 25vw; background-image: url("../common_resources/images/header_image.jpg?version=231116"); background-position: top; background-size: cover; background-repeat: no-repeat; position: relative; z-index: 0;}
div.image_txt{height: 25vw; width:1600px; margin: auto; display:flex; align-items:baseline; flex-direction: column; justify-content: center; font:22px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#FFF;}

body.service_types div.header_image{background-image: url("../common_resources/images/service_types_header.jpg?version=231116"); background-size: cover; background-position: 70%; background-repeat: no-repeat;}
body.service_types div.header_image, body.service_types div.image_txt{height: 37vw;}

div.image_txt div.service_type_buttons{width:100%; display: flex; margin: auto; margin-bottom: 5px; margin-top: 10px;}
div.image_txt div.service_type_buttons div{background: #1376c7; border-radius: 50px; height: 60px; margin-left: 10px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 30px; cursor: pointer; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 20px; color: #FFF; /*width: 280px;*/}

div.header_image button{display:none;}

/*BREADCRUMBS*/
div.breadcrumbs{background:#eef2f7; border-top:solid 1px #d7dee7; border-bottom:solid 1px #d7dee7; z-index: 0; position: relative;}
div.breadcrumbs ul{width: 100%; height: 60px; padding: 0; display: table; table-layout: fixed; overflow: hidden;}
div.breadcrumbs ul li{width: 100%; height: 60px; display: table-cell; vertical-align: middle; position: relative; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; text-align: center; margin: 0; padding: 0 15px;}


div.breadcrumbs ul li:after{content: ""; display: block; background: url("../common_resources/images/menu-triangle.png?version=231116") no-repeat scroll; width: 10px; height: 60px; top: 50%; right: 0; position: absolute; margin-top: -21px; left: 95%; z-index: 1; box-sizing: border-box;}
div.breadcrumbs ul li.current:after{content: ""; position: absolute; right: 0; width: 0; height: 100%; border-top: 30px solid; border-left: 10px solid; border-bottom: 30px solid; left: 100%; margin-top: inherit; transform: translateY(-50%);
background: #1376c7; border-top-color:#1376c7; border-left-color: #1376c7; border-bottom-color: #1376c7; box-sizing: border-box;}
div.breadcrumbs ul li.current, div.breadcrumbs ul li.passed{background:#1376c7; color:#FFF;}
div.breadcrumbs ul li.passed:after{background: url("../common_resources/images/menu-triangle_passed.png?version=231116") no-repeat scroll;}
div.breadcrumbs ul li.passed a{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color:#FFF; text-decoration: none;}
div.breadcrumbs ul li.current:after{background:#1376c7; border-top-color:#eef2f7; border-bottom-color:#eef2f7;}
div.breadcrumbs ul li:last-child:after{background:none; border-width: 0;}

body.booked_appointment div.breadcrumbs a, body.issued_ticket div.breadcrumbs a{cursor: auto;}
/********************************************************************************************************************************************************************************************************************/

/*MAP*/
div#map{height: 550px; margin:auto; margin-bottom:10px;}
.gm-style .gm-style-iw-c{width: 450px; max-width:450px !important; height: 450px !important; max-height: 450px !important; font:18px "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color:#333;}
.gm-style .gm-style-iw-d{max-height: 100% !important;}
div.info_header div.store_info{min-height: auto;}
div.info_header div.distance{margin-bottom:20px; font:18px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif";}
button.gm-ui-hover-effect{width:50px !important; height: 50px !important; top:5px! important; right: 30px !important;}
button.gm-ui-hover-effect span{width:40px !important; height:40px !important; background-repeat:no-repeat !important;}
/********************************************************************************************************************************************************************************************************************/

/*SEARCH CRITERIA*/
div.criteria{display: flex; width: 50%;}
body.service_points div.criteria{width:100%;}
body.service_points_video_conference div.criteria{justify-content: start;}
div.criteria label{margin-left:5px;}
input.radio{cursor: pointer;}
span.label_txt{cursor: pointer; font-family: "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif";}
div.search_results{margin-top:10px;}
div.search_results p{margin: 0;}

/********************************************************************************************************************************************************************************************************************/

/*STORE LIST*/
div.store_list{width:100%; display: grid; grid-template-columns:20% 20% 20% 20% 20%;}
div.store_box{background:#FFF; border:solid 1px #ccd2db; padding:30px; margin:10px 5px; margin-top: 0; border-radius: 3px; will-change:box-shadow; transition:box-shadow 150ms ease-in-out;}
div.store_box:hover{box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);}

div.kiosk_type_kepo div.logo,
body.kiosk_type_kepo div.calendar_details div.logo,
body.kiosk_type_kepo div.selected_store div.logo,
body.video_conference.kiosk_type_kepo div.logo{background-image: url("../common_resources/images/logos/kepo_logo_gr.svg?version=231116"); background-size: contain; width:200px; height: 78px; margin:auto; margin-bottom:15px; background-repeat: no-repeat; background-position: center;}

body.selected_language_gb div.kiosk_type_kepo div.logo,
body.kiosk_type_kepo.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kepo.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kepo.selected_language_gb div.logo{background-image: url("../common_resources/images/logos/kepo_logo_gb.svg?version=231116"); background-size: contain; width: 200px; height: 78px; background-repeat: no-repeat; background-position: center;}

div.kiosk_type_kep div.logo,
body.kiosk_type_kep div.calendar_details div.logo,
body.kiosk_type_kep div.selected_store div.logo,
body.video_conference.kiosk_type_kep div.logo{background-image: url("../common_resources/images/logos/kep_logo_gr.svg?version=231116"); background-size: contain; width: 121px; height: 93px; margin:auto; margin-bottom:9px; background-repeat: no-repeat; background-position: center;}

body.selected_language_gb div.kiosk_type_kep div.logo,
body.kiosk_type_kep.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kep.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kep.selected_language_gb div.logo{background-image: url("../common_resources/images/logos/kep_logo_gb.svg?version=231116"); background-size: contain; width: 121px; height: 93px; margin-bottom:14px; background-repeat: no-repeat; background-position: center;}

div.store_info{min-height: 190px; margin-top: 30px;}
div.services_buttons_container{margin-bottom:10px;}

div.details{display:none;}

div.store_address, div.store_hours, div.store_email, div.store_telephone{padding-left: 30px; margin-bottom: 20px;}
div.store_address{background:url("../common_resources/images/pin.svg?version=231116") no-repeat; background-size: 20px; background-position-y: 0;}
div.store_email{background:url("../common_resources/images/email.svg?version=231116") no-repeat; background-size: 20px; background-position-y: 0;}
div.store_hours{background:url("../common_resources/images/clock.svg?version=231116") no-repeat; background-size: 20px; background-position-y: 0;}
div.store_telephone{background:url("../common_resources/images/phone.svg?version=231116") no-repeat; background-size: 20px; background-position-y: 0;}

div.details div{font-size: 17px; color: #444; margin-bottom: 0;}
/********************************************************************************************************************************************************************************************************************/

/*SELECTED SERVICES CONTAINER*/
div.block{background:#FFF; border: solid #ccd2db 1px; border-radius: 5px; padding: 20px; margin:auto;}
div.selected_services h2{margin-top:0;}
ol#selected_services ul{padding: 0; padding-left:10px;}
ol#selected_services ul li{list-style: none;}
ol#selected_services li.error, ol#selected_services li.error a{color:red;}
ol#selected_services li input{margin-right:10px;}

/********************************************************************************************************************************************************************************************************************/

/*TOP CONTAINER*/
div.top_container{background: #f6faff; border-bottom:solid 1px #d7dee7; margin-bottom:30px;}
div.top_container.sticky{position: sticky; top:0; z-index: 1;}
body.service_points div.top_container{margin-bottom:0; border-bottom:none;}

div.max_ticket_instances{width: 100%; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #1376c7; display: flex; justify-content: end;}
div.max_ticket_instances.blink{animation: blink_animation 1s infinite;}
@keyframes blink_animation{0%, 100%{color:#494949} 50%{color: red;}}

/*SEARCH*/
div.search_column{width:100%; height: 47px; display:flex; align-items: center;}
body.service_points div.search_column{width:800px; margin: 0;}

input.search{height: 100%; font: 20px "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color: #494949; width: 100%; border: solid 1px #d7dee7 !important; border-radius: 3px; border-top-right-radius:0; border-bottom-right-radius:0; padding: 0 5px; -webkit-appearance: none; background: #FFF;}
input.search:focus{outline:none;}

div.clear_btn{width:50px; height: 100%; background: url("../common_resources/images/clear.svg?version=231116") center no-repeat; border: solid 1px #d7dee7; border-left: none; background-size: 15px; padding: 0 5px; border-top-right-radius:2px; border-bottom-right-radius:2px; cursor: pointer; background-color: #FFF;}

.pac-item,.pac-item-query{font: 20px "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color:#000;}
.pac-item{padding:10px; cursor: pointer;}
.pac-matched{font-weight: normal;}
.pac-item-query{color:#000;}
.pac-logo:after{display:none;}

/*MENU*/
div.main_menu{display:flex; margin-left: 5px;}

/********************************************************************************************************************************************************************************************************************/

/*BOTTOM CONTAINER*/
div.bottom_container{position: relative; z-index: 0; overflow: hidden; margin: auto;}

div.main_category{width:24vw; margin:0 10px;}
div.category, div.service{width: 99%; /*height: 180px;*/ height:160px; display:flex; align-items: center; border-radius: 3px; cursor: pointer; position: relative; margin-bottom:10px; will-change:box-shadow; transition:box-shadow 150ms ease-in-out; background:#eef2f7; border: 1px solid #d7dee7;}
div.main_category.opened.parentIsRoot div.service, div.main_category.parentIsRoot div.service{background:#FFF;}
div.services{width:100%; display:none;}

/*CATEGORY*/
div.category div.title{width: 88%; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#000; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin-left:10px; text-shadow: 0.05vw 0.05vw 0.05vw #FFFFFF;}
div.category div.arrow_down{right:15px; position: absolute; display: inline-block; padding: 5px; transform: rotate(45deg); -webkit-transform: rotate(45deg); border: solid #1376c7; border-width: 0 5px 5px 0;}
body.appointment div.category div.title{-webkit-line-clamp: 4;}

/*SERVICE*/
div.main_category div.service div.title{width: 89%; margin:0 10px; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-family:"PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color:#000;}

/*COUNTER*/
div.counter{width: 40px; height: 100%; position: absolute; top:0; right:0; border-left: solid 1px #d7dee7;}
div.counter div.minus, div.counter div.plus{width: 100%; height: 29.4%; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size:27px; display: flex; align-items: center; justify-content: center;}
div.counter div.numb{width: 100%; height: 40%; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; display: flex; justify-content: center; align-items: center; border-top: solid 1px #d7dee7; border-bottom: solid 1px #d7dee7;}
div.counter div.plus{border-top-right-radius: 2px; border-top:none;}
div.counter div.minus{border-bottom-right-radius: 2px;}

div.selected div.counter div.minus, div.selected div.counter div.plus{background: #1376c7; color: #FFF;}
div.service.selected{border: solid 1px #1376c7;}
div.selected div.counter, div.selected div.counter div.numb{border-color:#1376c7 !important;}
div.main_category.opened div.service{background:#f8f9fb;}
div.main_category.opened div.service div.counter div.numb{border-color:#ccc;}
div.main_category div.service div.details{width: 90%; margin:0 10px; position: absolute; bottom:0; display: flex; visibility: hidden;}

/*ICONS DOCUMENTS AND VIDEO CONFERENCE*/
div.icons{position: absolute; left: 2px; top:2px; display:flex;}
div.documents{background-color:#1376c7; border-radius: 3px; width:40px; height:32px; background-image:url("../common_resources/images/info.svg?version=231116"); background-repeat: no-repeat; background-size: 24px; background-position: center; display: none; z-index: 1; margin-right:5px;}
div.video_conference{background-color:#1376c7; background-image: url(../common_resources/images/video_conference.png?version=231116); border-radius: 3px; width:40px; height:32px; background-repeat: no-repeat; background-size: 24px; background-position: center; visibility: hidden; z-index: 1; cursor: auto;}

/*OPEN CATEGORY AND SELECTED*/
div.main_category.opened div.category div.arrow_down{transform: rotate(-135deg); -webkit-transform: rotate(-135deg);}
div.main_category div.service.selected div.title{position: absolute; z-index: 1; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif";}
body.appointment div.main_category div.service.selected div.title{top:auto;}
div.main_category div.service.selected div.details_row{visibility: visible;}
div.main_category div.service.selected div.details_row:nth-of-type(1){margin-right:20px;}

body.appointment div.estimated_wait_time, body.appointment div.customers_waiting, body.appointment div.next_ticket{display:none;}

/*SERVICE DOCUMENTS*/
div.service_documents div.selected_service{background: #dedede; border-radius: 3px; padding: 10px 20px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #494949;}

/*MARK*/
mark{background:#e48d1a; color:#FFF; text-shadow: none;}
/********************************************************************************************************************************************************************************************************************/

/*BUTTONS*/
div.bookAppointment,
div.cancelAppointment,
div.printAppointment,
div.printTicket,
div.cancelTicket,
div.sendCode,
div.issueTicket,
div.accept_cookies,
div.reject_cookies,
div.home-btn{background:#1376c7; border: solid 1px #1376c7; width: 130px; height: 47px; border-radius: 50px; padding:0 20px; display:flex; justify-content: center; align-items: center; font-family:"PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; text-align: center; color:#FFF; text-align: center; margin-right: 5px; cursor: pointer;}

div.bookAppointment{background:#5ab65f; border:solid 1px #5ab65f;}

div.accept_cookies,
div.reject_cookies{display: inline-flex; width: 140px;     height: auto;
    padding: 10px;     font-size: 18px;}

div.services_button,
div.display_services,
div.categories_btn,
div.clear_selected_btn,
div.printTicket,
div.cancelTicket,
div.cancelAppointment,
div.printAppointment{background:#1376c7; border: 1px solid #1376c7; width: 190px; height: 47px; border-radius: 50px; padding:0 30px; display:flex; justify-content: center; align-items: center; font-family:"PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; line-height: 1; color: #FFF; text-align: center; margin-right: 5px; cursor: pointer;}


div.services_button{width:auto; margin-right: 0; margin-bottom: 10px; background:#1376c7; border:solid 1px #1376c7; color:#FFF;}
div.services_button.disabled{border-color:red; color:red; cursor: auto;}
div.services_button.disabled span{color:red;}


div.printTicket,
div.printAppointment,
div.cancelTicket,
div.cancelAppointment,
div.home-btn{width:110px; margin-right: 10px;}


/*DISABLED BUTTONS*/
div.bookAppointment.disabled,
div.printAppointment.disabled,
div.printTicket.disabled,
div.sendCode.disabled,
div.issueTicket.disabled,
div#issue_ticket_button.disabled,
div#cancel_ticket_button.disabled,
div#cancel_appointment_button.disabled,
div#book_appointment_button.disabled,
div.sendCode_wrapper.disabled{background:#BE0000; border-color:#BE0000; color:#FFF; cursor: auto;}

/********************************************************************************************************************************************************************************************************************/

/*CALENDAR LIST*/
div.calendar_list{width: 100%; display:inherit !important;}
div.box{background:#f8f9f9; padding:20px; border-radius:3px; border:dotted #485e2947 1px; display: grid; grid-template-columns: 25% 33% 42%; align-items: start; padding:30px; margin:20px 0;}
div.box.selected{border-width:2px; border-color:#1376c7;}

div.calendar_list div.box:nth-child(odd){background: #f8f9f9;}
div.calendar_list div.box:nth-child(even){background: #FFF;}
div.calendar_list div.box:first-child{margin-top:0;}

div.calendar_details div.store_info{min-height:auto;}
div.box div.timeview{min-height: 350px; padding-left: 25px;}
div.box div.calendar{margin-top:0; padding-left: 25px; padding-right: 25px; border-left:dotted 1px #d7dee7; border-right:dotted 1px #d7dee7;}

div.timeview_container div.services_button{float: right; width:auto; margin-top: 10px; margin-top: 20px;} 
/********************************************************************************************************************************************************************************************************************/

/*LEGEND, CALENDAR, TIMEVIEW*/

/*LEGEND*/
div.legend_container{width:50%; display:flex; justify-content: end;}
div.legend{display: flex; align-items: center; margin-right:20px; margin-top:10px; margin-bottom:10px; font-size: 18px;}
div.legend:last-child{margin-right:0;}
div.legend div.unavailable{background: #BE0000; width:15px; height: 15px; border-radius: 100%; float:left; margin-right: 10px;}
div.legend div.available{width:15px; height: 15px; border-radius: 100%; float:left; margin-right: 10px; background: #5ab65f;}
div.legend div.almost_available{background: #e4a50e; width:15px; height: 15px; border-radius: 100%; float:left; margin-right: 10px;}
div.legend div.selected{background: #1376c7; width:15px; height: 15px; border-radius: 100%; float:left; margin-right: 10px;}

div.calendar_details, div.selected_store, div.availability{padding-right: 25px;}
div.calendar{/*width: 436px;*/ margin-top:20px;}
div.header_month, div.header_days, div.days_row, div.time{display:flex;}
div.header_month{border-bottom:dotted 1px #d7dee7; margin-top: 20px;}
div.previous_month, div.next_month{cursor:pointer; font-size: 15px;}
div.next_month{float:right;}
div.current_month{margin:auto; text-align: center;}
div.previous_month, div.current_month, div.next_month{margin-bottom:7px;}
div.previous_month.disabled{opacity: 0.3; cursor: auto;}

div.current_month{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 17px;}
div.date, div.day{width:4vw; height: auto; padding:8px; margin-right: 7px; margin-bottom: 7px; font:18px "PFDinTextCondPro-Bold", Helvetica, Arial, "sans-serif"; line-height: 1; text-align: center;}
div.days_row div.day{border:solid 1px #d7dee7; border-radius: 3px;}
div.days_row div.day:last-child, div.header_days div.date:last-child{margin-right: 0;}
div.header_days div.date{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 15px; border:solid 1px #FFF; border-color: transparent; margin-bottom: 0;}
div.days_row div.day.available{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #fff; cursor: pointer; background: #5ab65f; border-color: #5ab65f !important;}
div.days_row div.day.almost_unavailable{background: #e4a50e; border-color:#e4a50e !important; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #1376c7; cursor: pointer;}
div.prev-or-next-month, div.days_row div.day.is-day-off,div.header_days div.date.is-day-off{color:#a3a3a3;}
div.calendar.error div.available, div.calendar.error div.almost_unavailable{outline:solid red 2px;}
div.calendar.error div.available.selected{outline:none;}

/*TIMEVIEW*/
div.time_container{display:flex; flex-wrap: wrap; margin-top:20px;}
div.time{width:34px; height: auto; padding:8px; border-radius: 3px; margin-right: 7px; margin-bottom:7px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; line-height: 1; font-size:18px; color:#fff; justify-content: center; align-items: center; cursor: pointer; background: #FFF;}
div.time_container.error div.time{outline:solid red 2px;}
div.time_container.error div.selected.time{outline:none;}
div#time_unavailable_container{display:none; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#be0000;}

/*SELECTED CALENDAR*/
div.available.time{background: #5ab65f;}
div.unavailable.time{background: #be0000; outline: none !important; cursor:auto;}
div.almost_unavailable.time{background: #e4a50e; color:#494949;}
div.selected.time, div.days_row div.selected.day{background:#1376c7 !important; border-color:#1376c7 !important; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#fff !important; cursor: auto;}
div.days_row div.day.unavailable, div.days_row div.day.unavailable.selected{background:#BE0000 !important; border-color:#BE0000 !important; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color:#FFF; cursor: pointer;}

/********************************************************************************************************************************************************************************************************************/

/*STEPPER*/
.stepper-wrapper{display: flex; justify-content: space-between; margin:60px 0; margin-top:0; z-index: 0; position: relative;}
.step-name{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 20px; text-align: center;}
.stepper-item{position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; flex: 1;}
.stepper-item::before{position: absolute; content: ""; border-bottom: 1px solid #d7dee7; width: 100%; top: 20px; z-index: 2;}
.stepper-item::after{position: absolute; content: ""; border-bottom: 1px solid #d7dee7; width: 100%; top: 20px; z-index: 2;}
.stepper-item .step-counter{background-color: #d7dee7; position: relative; z-index: 5; display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border-radius: 100%; background: #d7dee7; margin-bottom: 6px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 25px;}
.stepper-item.completed .step-counter{background-color:#5ab65f; color:#FFF;}
.stepper-item.completed::after{position: absolute; content: ""; border-bottom: 1px solid #d7dee7; top: 20px; z-index: 3;}
.stepper-item:first-child::before{content: none;}
.stepper-item:last-child::after{content: none;}

/********************************************************************************************************************************************************************************************************************/

/*FORM*/
div.block.form{background:#f8f9f9; margin-top:20px; margin-bottom:20px;}

form#form{display:grid; grid-template-columns: 25% 75%;}
body.book_appointment form#form{display: block;}

body.book_appointment form#form div#otp_form_step01, body.book_appointment form#form div#otp_form_step02, body.booked_appointment form#form div#otp_form_step01, body.booked_appointment form#form div#otp_form_step02{padding-left:0; border-left:none;}

div.required_info{width:50%;}

label{margin-bottom:5px;}
label, div.incoming_persons_row{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif";}
div.row_form{width:100%; display: flex; align-items: baseline;}
body.issue_ticket div.row_form{flex-wrap: wrap;}
div.column_form{width: 300px; margin-right: 20px;}

div.name,
div.lastname,
div.email,
div.phone,
div.identification_number,
div.terms,
div.incoming_persons{width:300px; display: inline-grid; margin-bottom: 10px;}
div.incoming_persons{width:auto; margin-right: 20px; display:none;}
div.comments{width:100%; display: inline-grid;}
div.incoming_persons input{width:50px; margin-top: 5px;}
div.terms{width: auto; display: flex; margin-top: 10px; margin-bottom: 20px;}
div.terms input{margin-left:10px;}
input, textarea#comments{padding: 11px 5px; border:solid 1px #d7dee7; border-radius: 3px; font: 20px "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color: #000; line-height: 1;}

input#phone{width: 100%;}
.iti--separate-dial-code .iti__selected-flag{border-right: 1px solid #d4dfea;}
.iti__country-list{width:400px; max-height: 280px; overflow-x:hidden;}
.iti__country{padding:10px;}

textarea#comments{height:285px; margin-bottom: 10px;}
input:focus, textarea:focus{outline: none;}
#firstname.error,
#lastname.error,
#email.error,
#phone.error,
#identification_number.error,
#incoming_persons.error{border-color:red;}
.error li a,
.error li input,
label.error,
div.incoming_persons_row.error,
div.terms.error a{color:red;}

/*ISSUE TICKET OTP FORM*/
div#otp_form_step02{display:none;}
div#otp_form_step02 div.row_form{display:flex; flex-direction: column;}

body.issue_ticket div.email_checkbox, body.issue_ticket div.phone_checkbox{margin-bottom:5px;}
body.issue_ticket div#issue_ticket_button,
body.book_appointment div#book_appointment_button,
body.issued_ticket div#cancel_ticket_button,
body.booked_appointment div#cancel_appointment_button{width:250px; height: 47px; padding: 0 10px; margin-top:5px; margin-bottom:5px; font-size: 18px;}


body.issue_ticket div#send_code_button, body.book_appointment div#send_code_button, body.issued_ticket div#send_code_button, body.booked_appointment div#send_code_button{width:200px; margin: 0; cursor: pointer;}

body.issue_ticket label#email_label, body.issue_ticket label#phone_label{cursor: pointer;}
body.issue_ticket label.otp_code, body.book_appointment label.otp_code, body.issued_ticket label.otp_code, body.booked_appointment label.otp_code{display: block;}
body.issue_ticket div.email{width:350px; margin-right: 10px;}
body.issue_ticket div.email input#email{width:339px;}
body.issue_ticket div.phone{width:230px; margin-right: 10px; margin-left: 0;}
body.issue_ticket div.phone input#phone{width:230px;}
body.issue_ticket div.code, body.issued_ticket div.code{width:auto;}
body.issue_ticket input#code, body.book_appointment input#code, body.issued_ticket input#code, body.booked_appointment input#code{width:70px;}
body.issue_ticket input#code, body.issued_ticket input#code{margin-right: 5px;}

body.issue_ticket input#code[type=number]::-webkit-inner-spin-button, body.book_appointment input#code[type=number]::-webkit-inner-spin-button,
body.issue_ticket input#code[type=number]::-webkit-outer-spin-button, body.book_appointment input#code[type=number]::-webkit-outer-spin-button,
body.issued_ticket input#code[type=number]::-webkit-inner-spin-button, body.booked_appointment input#code[type=number]::-webkit-inner-spin-button,
body.issued_ticket input#code[type=number]::-webkit-outer-spin-button, body.booked_appointment input#code[type=number]::-webkit-outer-spin-button{-webkit-appearance: none; -moz-appearance: none; appearance: none; -moz-appearance: textfield;}
body.issue_ticket input#code[type=number], body.book_appointment input#code[type=number],body.issued_ticket input#code[type=number], body.booked_appointment input#code[type=number]{-moz-appearance:textfield;}

/*DISABLED*/
div.email input#email:disabled,
div.phone input#phone:disabled,
input#code:disabled{background:#ebebeb; cursor: auto;}

/*PROGRESS BAR*/
div.sendCode_wrapper{background: #1376c7; border:solid 1px #1376c7; width:250px; height: 37px; padding:5px 10px; border-radius: 50px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 18px; color:#FFF; cursor: pointer;}
div.otp_timer_wrapper{display:flex; justify-content: center; align-items: center; margin-top:5px;}
div#otp_timer{border-right:solid 1px #FFF; padding-right:10px; align-items: center; justify-content: center; margin-right:10px; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-size: 16px; display: none;}

/********************************************************************************************************************************************************************************************************************/

/*ACCORDION*/
div.accordion_container{background:#f8f9f9; padding: 30px 0;}
button.accordion{width: 100%; background:none; border:none; outline: none; padding: 20px 0; font: 20px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #000; text-align: left; cursor: pointer; transition: background-color 0.2s linear;}
button.accordion:after{content: "+"; font: 25px "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; color: #000; float: right; line-height: 1; }
button.accordion.is-open:after{content: "-";}
button.accordion:hover, button.accordion.is-open{background: none; border-color: white;}
div.accordion-content{background: none; padding: 0 10px; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-in-out; border-bottom: solid 1px #ccc;}
div.accordion_container h3{margin-bottom:0; margin-top: 30px;}

/********************************************************************************************************************************************************************************************************************/

/*APPOINTMENT AND TICKET TEMPLATE */
div#appointment_buttons_wrapper{display: none;}
div.appointment_template, div.ticket_template{width:522px !important; background: #FFF; border:solid #d7dee7 1px; border-radius: 5px; padding: 20px;}
div.printer_ticket_template{width:650px !important;}
iframe#appointment_template, iframe#ticket_template{background: #FFF; width:100%; height:auto; border: none;}

/********************************************************************************************************************************************************************************************************************/
div.resign{background: #052036; font:11px Arial Black, Helvetica, sans-serif; color: #fff;}
div.pwa_install {display:none; align-items: center; margin-bottom:10px; cursor: pointer;}
div.pwa_install  img{margin-right:5px;}
/********************************************************************************************************************************************************************************************************************/

div.calendar_details.availability{display:none;}
body.video_conference div.calendar_details{display:none;}
body.video_conference div.availability{display: grid;}
body.video_conference div.calendar_details.availability h3,
body.video_conference div.availability h3{text-align: center;}


body.video_conference{counter-reset: my-sec-counter;}
/*body.video_conference div.availability h3{text-align: center;}*/
body.video_conference div.availability h3::after{counter-increment: my-sec-counter; content: counter(my-sec-counter) "";}
body.video_conference.book_appointment  div.availability h3::after{counter-increment: none; content: none;}

/********************************************************************************************************************************************************************************************************************/
/*COOKIES*/
div#cookies{cursor: pointer; text-decoration: underline;}
div#cookies:hover{text-decoration: none;}
#c-s-in{max-height: 16.5em;}
button#s-rall-bn, button#s-sv-bn{background:#1376c7 !important; color:#FFF !important; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-weight: normal; font-size: 17px !important; padding: 0.5em 1em !important;}
#s-bns button{font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-weight: normal; font-size: 17px !important; padding: 0.5em 1em !important;}
#s-bns button:first-child:hover{background:#1376c7 !important; color:#FFF !important; font-family: "PFDinTextCondPro-Medium", Helvetica, Arial, "sans-serif"; font-weight: normal;}
.cc_div .b-tg .c-tgl:checked ~ .c-tg{background:#222 !important;}
div.b-tl{color:#222 !important;}
#s-ttl{font-family: "PFDinTextCondPro-Regular", Helvetica, Arial, "sans-serif"; color:#e48d1a; font-size: 25px !important;}
#s-c-bn::before, #s-c-bn::after{background: #FFF !important;}
.cc_div .c-bn{background: #1376c7 !important;}

/********************************************************************************************************************************************************************************************************************/
/*SESSION WARNING*/
div#session_warning_container{position: fixed; bottom:0; left:0; width:100%; z-index: 2; background: #BE0000; padding:5px; font-size: 17px; line-height: 1; color:#FFF; text-align: center; display:none;}
span#session_warning_expiration_ttl{font-family: "PFDinTextCondPro-Bold", Helvetica, Arial, "sans-serif"; text-align: center; width:40px; display:inline-block;}
span.icon-attention{display:inline-block; font-size:28px; font-family: "PFDinTextCondPro-Bold", Helvetica, Arial, "sans-serif";}

.popup_body span.icon-attention{color:#e48d1a;}

span#session_retry_ttl{font-family: "PFDinTextCondPro-Bold", Helvetica, Arial, "sans-serif";}
span#security_retry_ttl{font-family: "PFDinTextCondPro-Bold", Helvetica, Arial, "sans-serif"; text-align: center; width:45px; display:inline-block;}

/********************************************************************************************************************************************************************************************************************/

/*RESPONSIVE*/

/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 2360px){
div.main_category{width:33vw;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 2340px){
div.main_category{width:32vw;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1920px){
body.service_types div.header_image, body.service_types div.image_txt{height:720px;}
div.image_txt h1{font-size: 70px;}   
div.image_txt h2{font-size: 28px;}
    
div.store_list{grid-template-columns:25% 25% 25% 25%;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1900px){
div.main_category{width:31.8vw;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1700px){
div.content, div.image_txt{width:90%;}

div.main_category div.service.selected div.title{width: 87%; /*top:40px;*/}
div.main_category div.service div.details{width: 87%; /*display:block;*/}
div.details div {font-size: 16px;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1650px){
div.main_category{width:31.5vw;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1600px){
/*SERVICES TOP CONTAINER*/
div.top_container{padding:10px 20px;}
div.top_container div.content{padding: 5px 20px;}
div.top_container div.column:nth-of-type(2){display:block;}
div.search_column{margin:15px 0;}
div.main_menu{margin-left:0;}
div.bookAppointment{width:190px;}
    
/*div.main_category div.service div.title {-webkit-line-clamp: 3; font-size: 18px; line-height: 1;}  */
div.details div {font-size: 15px;}      
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1500px){
div.store_list{grid-template-columns:33.3% 33.3% 33.3%;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1450px){
div.box {grid-template-columns: 27% 38% 35%;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1400px){
div.main_category{width:47.8vw;}
div.main_category div.service div.details{display:flex;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1360px){
/*HEADER*/
body.service_points div.header_image{height: 280px;}
body.service_points div.image_txt{height: 280px; font-size:35px;}

/*SERVICES*/
div.main_category{width:47.5vw;}
div.details div {font-size: 18px;}     

/*FORM*/
form#form{grid-template-columns: 30% 70%;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1280px){
body, input.search{font-size:18px;}
    
/*HEADER*/
div.image_txt h1{font-size: 60px;}
div.image_txt h2{font-size:25px;}

/*CALENDAR LIST*/
div.box{display:flex !important; flex-wrap: wrap;}
div.box div.calendar_details, div.availability{width:45%;}
div.box div.calendar{width:45%; border-right: none; padding-right: 0;}
div.timeview_container{width:100%; margin-top:20px;}
div.box div.timeview{min-height: auto; padding-left: 0; margin-bottom: 20px; margin-top: 20px;}
div.date, div.day{width:4vw;}
    
body.video_conference div.calendar_details.availability,
body.video_conference div.availability{height: 60%;}
    
textarea#comments{height: 278px;}    
    
    
div.main_category div.service div.title {-webkit-line-clamp: 3;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1200px){
/*FORM*/
div.form div.column{display:block;}
div.legend_container, div.required_info{justify-content: start; width:auto;}

div.block div.column:nth-of-type(1){display:block; margin-bottom: 20px; margin-top: 20px;}
div.block div.column:nth-of-type(1) div.criteria{width:100%;}
div.block div.column:nth-of-type(1) div.legend{margin-top:0;}
    
div.main_category div.service div.title {-webkit-line-clamp: 2;}
div.details div {font-size: 17px;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1160px){
div.main_category div.service div.details{display:block;}

/*FORM*/
body.issue_ticket div#issue_ticket_button, body.issued_ticket div#cancel_ticket_button{width:240px;}
body.issue_ticket div.sendCode_wrapper, body.issued_ticket div.sendCode_wrapper{margin-top:5px; width: 338px;}
    
div.main_category div.service.selected div.title{top:40px;}     
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1120px){
div.main_category{width:47vw;}

/*FORM*/
div#otp_form_step01 div.row_form{display:block;}
body.book_appointment div#otp_form_step01 div.row_form,
body.booked_appointment div#otp_form_step01 div.row_form{display:flex; align-items: baseline;}   
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1050px){
div.store_list{grid-template-columns:50% 50%;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 1000px){
/*HEADER*/
div.header div.column{display: block;}
div.languages{justify-content: start; margin-top: 30px;}
div.lang_popup{top: 190px;}    
    
    
/*CALENDAR LIST*/
div.block div.column:nth-of-type(1){display:block;}
div.block div.column:nth-of-type(1) div.criteria, div.block div.column:nth-of-type(1) div.legend_container{width:100%;}
    
div.box div.calendar_details, div.availability{width:100%;}
    
form#form{grid-template-columns: 100%;}

/*FORM*/
body.issue_ticket div.sendCode_wrapper{width:245px;}

/*STORE LIST*/
div.store_info{min-height: auto; height: auto; display: grid; grid-template-columns: 50% 50%;}
body.service_points div.store_info{display: block;}

body.video_conference div.calendar_details.availability,
body.video_conference div.availability{width:100%; display: block; height: auto; margin-top:20px; margin-bottom: 0;}

div.box div.calendar, div.box div.timeview{float:none; width:100%; padding:0; border:none;}
div.date, div.day {width: 9vw;}

}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 930px){
div.main_category{width:46vw;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 900px){
/*HEADER*/
body.service_types div.header_image, body.service_types div.image_txt{height: 900px;}

div.service_type_buttons div {font-size: 17px;}

body.service_points div.search_column{width:100%;}

div.breadcrumbs ul{height: auto; display:grid; grid-template-columns: 50% 50%;}
div.breadcrumbs ul li{height: 50px; padding: 0 5px; display: flex; justify-content: center; align-items: center; border-bottom: solid #fff 1px; font-size: 17px;}
div.breadcrumbs ul li:nth-of-type(2){width:auto;}
div.breadcrumbs ul li.current:after{border-top: 25px solid; border-bottom: 25px solid;}
div.breadcrumbs ul li:after, div.breadcrumbs ul li.current:after{left: 100%; right: 0px; color: #f3f3f3;}
div.breadcrumbs ul li:after{height: 50px;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 850px){
div.content{width: auto;}

/*SERVICES TOP CONTAINER*/
div.top_container{margin-bottom: 10px; padding:10px 0;}
div.main_menu{width:100%;}
div.main_menu div{width:initial; min-width:100px;}
div.main_menu div.display_services, div.main_menu div.print_button{margin-right:0;}

/*SERVICES*/
div.main_category{width:94vw; margin:0 20px;}
div.main_category div.service.selected div.title{width:90%; /*top:auto;*/}
div.main_category div.service div.details{width:90%; display:flex;}

/*CALENDAR LIST*/
div.box div.timeview{padding-left:0;}

/*FORM*/
body.book_appointment div#otp_form_step01 div.row_form, body.booked_appointment div#otp_form_step01 div.row_form{display:block;}
form#form{grid-template-columns:100%;}
div.name, div.lastname, div.email, div.phone, div.identification_number, div.terms, div.incoming_persons, div.column_form{width:100%; margin-right:0;}
textarea#comments{height: 100px;}   
    
div.main_category div.service div.title {-webkit-line-clamp: 3;}
div.main_category div.service.selected div.title {top: 50px;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 800px){
div.cy_logo,
div.pard_logo,
div.kep_logo,
body.selected_language_gb div.kep_logo,
div.kepo_logo{transform: scale(1); margin-bottom:10px;} 

div.pard_logo{margin-left: 5px;}
    
    
/*HEADER*/
body.service_points div.header_image{height:230px;}
body.service_points div.image_txt{height:230px; font-size:30px;}

/*SERVICES TOP CONTAINER*/
div.main_menu{display:grid; grid-template-columns: 50% 50%;}
div.main_menu div{margin-bottom:5px;}

/*SERVICES*/
div.main_category{width:93.5vw;}

/*STORE LIST*/
div.store_list{grid-template-columns:auto;}
div.store_box{width:80%; margin: auto; margin-bottom:10px;}
div.store_info{min-height: auto; display:grid; grid-template-columns: 50% 50%;}

body.book_appointment div.row_form, body.booked_appointment div.row_form{display: block;}
body.booked_appointment div#cancel_appointm_button{width:auto;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 708px){
div.image_txt div.service_type_buttons{display:block;}
div.image_txt div.service_type_buttons div{width:auto; margin:10px 0; margin-left: 0;}

body.issue_ticket div.sendCode_wrapper, body.issued_ticket div.sendCode_wrapper{width: 338px;}
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 700px){
/*HEADER*/   
div.image_txt{font-size:28px;}

/*SERVICES TOP CONTAINER*/
div.top_container div.column:nth-of-type(1){display: block;}
div.max_ticket_instances{display: block; margin-bottom:10px;}

/*SERVICES*/
div.main_category{width:92.5vw;}

/*ISSUED AND APPOINTMENT TICKET*/
body.issued_ticket div.top_container div.column:nth-of-type(1), body.booked_appointment div.top_container div.column:nth-of-type(1){display: flex; align-items: start;}
div.appointment_template, div.ticket_template{width:auto !important; padding: 0;}
div.issue_ticket_iframe, div.appointment_iframe{text-align: center;}

/*STORE INFO*/
body.book_appointment div.store_info, div.store_info{grid-template-columns: 100%;}

/*FORM*/
body.issue_ticket div.phone input#phone{width: 351px;}
body.service_points div.criteria{display:block;}

}
/********************************************************************************************************************************************************************************************************************/
@media screen and (max-width: 688px){
#c-s-in {max-height: 100%;}
    
div.main_category div.service div.title {-webkit-line-clamp: 2;}
div.main_category div.service.selected div.title {top: auto;}    
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 600px){
/*HEADER*/
div.header_image{height: 200px;}
div.image_txt{height: 200px; font-size:23px;}

/*SERVICES*/
div.main_category{width:91vw;}
div.main_category div.service.selected div.title{width:85%;}
div.main_category div.service div.details{width:85%; display:block;}

/*FORM*/
.step-name, button.accordion{font-size:18px;}
div.column_form:nth-of-type(1){display:block;}
div.name_lastname, div.email_phone{width:100%;}
div.name_lastname{margin-right:0;}
    
/*FORM*/
body.book_appointment div#otp_form_step01 div.row_form, body.booked_appointment div#otp_form_step01 div.row_form{display:block;}

/*CALENDAR*/
div.legend_container{display:grid; grid-template-columns: 50% 50%; margin-top: 20px; margin-bottom: 20px;}
div.criteria label{display:block;}
div.timeview_container div.services_button{float:none;}
    
div.main_category div.service.selected div.title {top: 38px;}     
}
/********************************************************************************************************************************************************************************************************************/

@media all and (max-width: 550px){
/*ISSUED AND APPOINTMENT TICKET*/
iframe#ticket_template, iframe#appointment_template{-ms-zoom: 0.91; -moz-transform: scale(0.91); -moz-transform-origin: 0 0; -o-transform: scale(0.91); -o-transform-origin: 0 0; -webkit-transform: scale(0.91); -webkit-transform-origin: 0 0;}    
}
/********************************************************************************************************************************************************************************************************************/
@media all and (max-width: 500px){
/*HEADER*/
body.service_types div.header_image, body.service_types div.image_txt{height: 1000px;}
   

div.main_category{width:89vw;}
    
div.breadcrumbs ul li span, div.breadcrumbs ul li.passed a {display: block;}    
div.breadcrumbs ul li {width: initial; height:60px;}    

/*ISSUED AND APPOINTMENT TICKET*/
iframe#ticket_template, iframe#appointment_template{-ms-zoom: 0.84; -moz-transform: scale(0.84); -moz-transform-origin: 0 0; -o-transform: scale(0.84); -o-transform-origin: 0 0; -webkit-transform: scale(0.84); -webkit-transform-origin: 0 0;}
}
/********************************************************************************************************************************************************************************************************************/
/********************************************************************************************************************************************************************************************************************/
@media only screen and (max-device-width:500px) and (orientation: portrait){
*{-webkit-text-size-adjust: 100%;}
        
/*WAITSCREEN*/
body.waitscreen div.wrap h1{font-size: 35px;}
body.waitscreen div.wrap h2{font-size: 30px;}
body.waitscreen div.wrap h3{font-size: 30px;}    

div.main_menu div{min-width:auto; line-height: 1;} 
div.block.form{margin-top:20px;} 
div.info_header div.store_info{min-height: 100px}          
    
div.breadcrumbs ul li span, div.breadcrumbs ul li.passed a {display: block;}    
div.breadcrumbs ul li {width: initial; }  
    
div.box{padding:10px; margin-bottom: 10px; margin-top: 0;}    
div.block{padding:10px;}    
    
div.content{padding:10px;}

body, input.search, .step-name, button.accordion, body.issue_ticket div.phone input#phone, body.issue_ticket div.email input#email, div.sendCode_wrapper, input, textarea#comments, div.accept_cookies, div.reject_cookies{font-size: 16px;}
div.breadcrumbs ul li, div.breadcrumbs ul li:nth-of-type(2){height:60px; font-size: 15px; width: auto; text-align: center;}
    
div.cy_logo{/*width: 70px; height: 57px;*/ width:60px; height:49px; transform: scale(1); margin-bottom:0;}
    
div.pard_logo{/*width: 110px; height: 48px;*/ width:90px; height:40px; transform: scale(1); background-size: contain; margin-left: 10px; margin-bottom:0;}    
    
div.kep_logo,
body.selected_language_gb div.kiosk_type_kep div.logo,
body.kiosk_type_kep.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kep.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kep.selected_language_gb div.logo{/*width:75px; height: 58px;*/ width:65px; height:50px;  transform: scale(1); margin-bottom:0;}
    
body.selected_language_gb div.kep_logo{/*width:75px; height: 58px;*/ width:65px; height:50px;  transform: scale(1);}
     
div.logos div.kepo_logo{margin-left:10px; margin-bottom:0;}
div.logos  div.kep_logo{margin-left:15px; margin-bottom:0;}
    
div.kepo_logo,
body.selected_language_gb div.kiosk_type_kepo div.logo,
body.kiosk_type_kepo.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kepo.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kepo.selected_language_gb div.logo{/*width: 131px; height: 51px;*/ width:111px; height:43px;  transform: scale(1); margin-bottom:0;}
    
div.languages{margin-top:10px;}
div.lang_popup{top: 105px; box-shadow:none;}

/*HEADER*/
body.service_types div.header_image, body.service_types div.image_txt{height: 400px;}

div.image_txt div.service_type_buttons div{height:50px; font-size:16px;}
div.image_txt h1{font-size: 30px; line-height: 1; margin-bottom: 0;}
div.image_txt h2 {font-size: 20px;}
div.image_txt p {font-size: 14px; line-height: 1;}

div.service_type_buttons{display:block; margin-top: 0;}
div.service_type_buttons div{font-size:16px; margin:10px 0; height: 55px;}

/*HEADINGS*/
h1{font-size: 23px; margin-top: 5px; margin-bottom: 5px;}
h2{font-size: 22px;}
h3{font-size: 15px;}
h4{font-size: 15px; margin-top:10px; margin-bottom:5px;}

/*MAP*/
div#map{height: 500px;}
.gm-style .gm-style-iw-c{width: 350px; max-width:350px !important; height: 250px !important; max-height: 250px !important;}

div.criteria p, div.criteria label{margin: 0;}
div.criteria label{display: flex; align-items: center;}
span.label_txt{margin-left:5px; top:2px; position: relative;}

.stepper-wrapper{margin: 30px 0;}
.stepper-item .step-counter{width:35px; height: 35px; font-size:18px;}

div.store_box:hover{box-shadow:none;}
div.store_info{margin-top:10px; margin-bottom:30px;}
div.calendar_details div.store_info{margin-bottom:0;}
body.book_appointment div.store_info, body.issue_ticket div.store_info{margin-bottom:0;}

div.kiosk_type_kepo div.logo, body.kiosk_type_kepo div.calendar_details div.logo, body.kiosk_type_kepo div.selected_store div.logo{width: 131px; height: 51px; margin-bottom: 10px;}
div.kiosk_type_kep div.logo, body.kiosk_type_kep div.calendar_details div.logo, body.kiosk_type_kep div.selected_store div.logo{width: 98px; height: 75px;}
h4.kiosk_name{margin-bottom:30px;}
div.store_address, div.store_hours, div.store_email, div.store_telephone{background-size:18px;}

div.category, div.service{height:130px; margin-bottom:5px; border-radius: 0;}
div.main_category div.service.selected div.title{top:40px;}
div.category div.title, div.main_category div.service div.title, div.main_category div.service div.details, div.main_category div.service.selected div.title{width: 80%;}
div.details div{margin-bottom:2px; font-size: 15px;}

div.calendar{width:auto;}
div.date, div.day{width: -webkit-fill-available; height: 10vw; padding: 0; display: flex; justify-content: center; align-items: center; margin-right: 3px; margin-bottom: 3px;}
div.current_month, div.previous_month, div.next_month{font-size:14px;}
div.time{width:9vw; margin-right: 3px; margin-bottom: 3px;}

div.block div.column:nth-of-type(1) div.legend_container{display:grid !important; grid-template-columns: auto auto; margin-top:20px; margin-bottom:20px;}
div.legend{font-size:16px;}

div.terms{align-items: center;}
body.issue_ticket div#issue_ticket_button, body.issued_ticket div#cancel_ticket_button, body.book_appointment div#book_appointment_button,
body.booked_appointment div#cancel_appointment_button{margin-left:0; margin-right: 0; font-size: 16px;}
body.issue_ticket div.email{width:300px; margin-right:0;}
body.issue_ticket div.email input#email{width:300px;}
body.issue_ticket div.phone{width:312px; margin-right:0;}
body.issue_ticket div.phone input#phone{width: 311px;}
body.issue_ticket div.email_checkbox label, body.issue_ticket div.phone_checkbox label{margin-bottom: 0;}

body.issue_ticket div#issue_ticket_button, body.issued_ticket div#cancel_ticket_button, body.book_appointment div#book_appointment_button, body.booked_appointment div#cancel_appointment_button{margin-top:5px;}

div.block div.column:nth-of-type(1) div.criteria, div.block div.column:nth-of-type(1) div.legend_container{display:block;}

ol#selected_services ul li{display:flex; align-items: center;}
    
body.video_conference div.calendar_details.availability, body.video_conference div.availability{margin-bottom:0; margin-top:0;}    

/*ISSUED AND APPOINTMENT TICKET*/
div.appointment_template, div.ticket_template{border:none; padding: 0;}    
div.issue_ticket_iframe, div.appointment_iframe{height:100%;}
iframe#ticket_template, iframe#appointment_template{-ms-zoom: 0.58; -moz-transform: scale(0.58); -moz-transform-origin: 0 0; -o-transform: scale(0.58); -o-transform-origin: 0 0; -webkit-transform: scale(0.58); -webkit-transform-origin: 0 0;}

/*ONLY IPHONE*/
@supports (-webkit-touch-callout: none){
body.issue_ticket div.email_checkbox, body.issue_ticket div.phone_checkbox{display:flex; align-items: baseline;}
body.issue_ticket div.email_checkbox label, body.issue_ticket div.phone_checkbox label{top:-7px; position: relative; margin-left:5px;}
}

}
/********************************************************************************************************************************************************************************************************************/
/********************************************************************************************************************************************************************************************************************/
@media only screen and (max-device-width:1000px) and (orientation: landscape){
*{-webkit-text-size-adjust: 100%;}
        
/*WAITSCREEN*/
body.waitscreen div.wrap img.spinner{width:30px; margin-top: 10px; margin-bottom: 10px;}
body.waitscreen div.wrap div.cy_logo{width: 100px; height: 81px;}
body.waitscreen div.wrap div.cy_logo_gb{width: 100px; height: 81px;}

body.waitscreen div.waitscreen_txt{padding: 10px;}
body.waitscreen div.wrap h1{font-size: 20px;}
body.waitscreen div.wrap h2{font-size: 17px; margin-top:5px;}
body.waitscreen div.wrap h3{font-size: 17px; padding-top: 10px;}    

div.block.form{margin-top:20px;}    
div.content{padding:10px;}
div.info_header div.store_info{min-height: 100px}      

body, input.search, .step-name, button.accordion, body.issue_ticket div.phone input#phone, body.issue_ticket div.email input#email, div.sendCode_wrapper, input, textarea#comments, div.accept_cookies, div.reject_cookies{font-size: 16px;}

div.header div.column{display:flex;}    

div.cy_logo{/*width: 70px; height: 57px;*/ width:60px; height:49px; transform: scale(1); margin-bottom:0;}
    
div.pard_logo{/*width: 110px; height: 48px;*/ width:90px; height:40px; transform: scale(1); background-size: contain; margin-left: 10px; margin-bottom:0;}    
    
div.kep_logo,
body.selected_language_gb div.kiosk_type_kep div.logo,
body.kiosk_type_kep.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kep.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kep.selected_language_gb div.logo{/*width:75px; height: 58px;*/ width:65px; height:50px;  transform: scale(1); margin-bottom:0;}
    
body.selected_language_gb div.kep_logo{/*width:75px; height: 58px;*/ width:65px; height:50px;  transform: scale(1);}
     
div.logos div.kepo_logo{margin-left:10px; margin-bottom:0;}
div.logos  div.kep_logo{margin-left:15px; margin-bottom:0;}
    
div.kepo_logo,
body.selected_language_gb div.kiosk_type_kepo div.logo,
body.kiosk_type_kepo.selected_language_gb div.calendar_details div.logo,
body.kiosk_type_kepo.selected_language_gb div.selected_store div.logo,
body.video_conference.kiosk_type_kepo.selected_language_gb div.logo{/*width: 131px; height: 51px;*/ width:111px; height:43px;  transform: scale(1); margin-bottom:0;}    
    
div.languages{margin-top:0; justify-content: end;}
div.lang_popup{top: 50px; box-shadow:none;}

/*HEADINGS*/
h1{font-size: 23px; margin-top: 5px; margin-bottom: 5px;}
h2{font-size: 22px;}
h3{font-size: 15px;}
h4{font-size: 15px; margin-top:10px; margin-bottom:5px;}

/*HEADER*/
body.service_points div.header_image, body.service_points div.image_txt{height: 150px;}

div.image_txt div.service_type_buttons div{height:50px; font-size:16px; width:-webkit-fill-available; margin-left:10px;}
div.image_txt h1{font-size: 30px; line-height: 1; margin-bottom: 0;}
div.image_txt h2 {font-size: 18px; margin-bottom: 0;}
div.image_txt p {font-size: 14px; line-height: 1;}  

div.image_txt div.service_type_buttons{display:flex;}
div.service_type_buttons div{width: 50vw; height: 55px; font-size:16px; }
body.service_types div.header_image, body.service_types div.image_txt{height: 220px;}

/*MAP*/
div#map{height: 400px;}
.gm-style .gm-style-iw-c{width: 300px; max-width:300px !important; height: 250px !important; max-height: 250px !important;}

.stepper-wrapper{margin: 30px 0;}
.stepper-item .step-counter{font-size:18px;}

div.store_list{grid-template-columns: 50% 50%; align-items: start;}
div.store_box{min-height: 350px;}
div.store_box:hover{box-shadow:none;}
div.store_info{margin-top:10px; margin-bottom:30px;}
div.calendar_details div.store_info{margin-bottom:0;}
body.book_appointment div.store_info, body.issue_ticket div.store_info{margin-bottom:0;}

div.kiosk_type_kepo div.logo, body.kiosk_type_kepo div.calendar_details div.logo, body.kiosk_type_kepo div.selected_store div.logo{width: 141px; height: 55px; margin-bottom: 10px;}
div.kiosk_type_kep div.logo, body.kiosk_type_kep div.calendar_details div.logo, body.kiosk_type_kep div.selected_store div.logo{width: 85px; height: 65px;}
h4.kiosk_name{margin-bottom:30px;}
div.store_address, div.store_hours, div.store_email, div.store_telephone{background-size:18px;}

div.main_category{width:48vw; margin: 0 5px;}
div.category, div.service{height: 130px; margin-bottom:5px; border-radius: 0;}
div.main_category div.service.selected div.title{top:40px;}
div.category div.title, div.main_category div.service div.title, div.main_category div.service div.details, div.main_category div.service.selected div.title{width: 80%;}
div.details div{margin-bottom:2px; font-size: 15px;}

.stepper-item .step-counter{width:35px; height: 35px;}
div.calendar{width:auto;}
div.date, div.day{width: 12vw; height: 4vw; padding: 0; display: flex; justify-content: center; align-items: center; font-size: 18px; margin-right: 3px; margin-bottom: 3px;}
div.current_month, div.previous_month, div.next_month{font-size:18px;}
div.time{width:9vw; margin-right: 3px; margin-bottom: 3px;}

div.block div.column:nth-of-type(1) div.legend_container{display:grid !important; grid-template-columns: auto auto auto auto; margin-top:0; margin-bottom:0;}
div.legend{font-size:16px;}

div.terms{align-items: center;}
body.issue_ticket div.email{width:auto;}
body.issue_ticket div.email input#email{width:300px;}
body.issue_ticket div.phone{width:auto; margin-right:0;}
body.issue_ticket div.phone input#phone{width: 311px;}
body.issue_ticket div.email_checkbox label, body.issue_ticket div.phone_checkbox label{margin-bottom: 0;}
textarea#comments{height:100px}    

body.issue_ticket div#issue_ticket_button,
body.issued_ticket div#cancel_ticket_button,
body.book_appointment div#book_appointment_button,
body.booked_appointment div#cancel_appointment_button{font-size:16px;}

div.block div.column:nth-of-type(1) div.criteria, div.block div.column:nth-of-type(1) div.legend_container{display:flex;}

ol#selected_services ul li{display:flex; align-items: center;}
    
body.video_conference div.calendar_details.availability, body.video_conference div.availability{margin-bottom:0; margin-top:0;}    

/*ISSUED AND APPOINTMENT TICKET*/
div.appointment_template, div.ticket_template{border:none; padding: 0;}    
div.issue_ticket_iframe, div.appointment_iframe{height:100%;}
iframe#ticket_template, iframe#appointment_template{-ms-zoom: 1; -moz-transform: scale(1); -moz-transform-origin: 0 0; -o-transform: scale(1); -o-transform-origin: 0 0; -webkit-transform: scale(1); -webkit-transform-origin: 0 0;}

/*ONLY IPHONE*/
@supports (-webkit-touch-callout: none){
div.criteria{display: inline-flex; align-items: center;}
div.criteria p{margin-top:10px;  margin-right:10px;}
div.criteria span{display: flex; align-items: baseline;}
div.criteria span label{display:flex;  align-items: center; margin-right:10px;}
div.criteria span label span{margin-left:5px;}
body.issue_ticket div.email_checkbox, body.issue_ticket div.phone_checkbox{display:flex; align-items: baseline;}
body.issue_ticket div.email_checkbox label, body.issue_ticket div.phone_checkbox label{top:-7px; position: relative; margin-left:5px;}
}
}
/********************************************************************************************************************************************************************************************************************/
/********************************************************************************************************************************************************************************************************************/
@media only screen and (max-device-width:800px) and (orientation: landscape){
div.image_txt div.service_type_buttons{display:flex;}
div.image_txt div.service_type_buttons div{margin-left: 0; margin-right: 5px;}
}

/********************************************************************************************************************************************************************************************************************/
/********************************************************************************************************************************************************************************************************************/
@media only screen and (max-height:380px) and (orientation: landscape){
body.service_types div.header_image, body.service_types div.image_txt {height:260px;}
div.image_txt div.service_type_buttons{margin-top:15px; margin-bottom:0;}
}

@media only screen and (max-height:292px) and (orientation: landscape){
body.service_types div.header_image, body.service_types div.image_txt {height:180px;} 
div.image_txt div.service_type_buttons{margin-top:15px; margin-bottom:0;}
}


@media only screen and (max-height:770px) and (orientation: portrait){
body.service_types div.header_image, body.service_types div.image_txt {height:550px;}
div.image_txt div.service_type_buttons{margin-top:0; margin-bottom:0;}
}


@media only screen and (max-height:630px) and (orientation: portrait){
body.service_types div.header_image, body.service_types div.image_txt {height:420px;}
div.image_txt div.service_type_buttons{margin-top:0; margin-bottom:0;}
}

a.here_txt{color: white}
