﻿/* 
    INDEX:
	
    Styling of MijnOmgeving, Kim and Registers route. 

    - 1.  Buttons
	- 2.  Buttons (hover)
	- 3.  Buttons (focus)
	- 4.  Buttons (visited)
*/

/* ==================
   1. Buttons
   ================== */

input[type=submit], input[type=file] {
    height: 46px;
}

.previous-step-button, .next-step-button, .next-question-button {
    max-width: 155px;
}

input[value].next-step-button {
    float: right;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsSAAALEgHS3X78AAAAq0lEQVRIx82WwQ3DIAxFH1mgjMIIGSWjdZSO0BE6QjKBc+mhSk1iMJZiySeQHzZ8G0SEowMF+AACrEDR9llcC56/QeXHuyEaYDkEd0Em/m1FtwfwSikVWqxyB89KFs2Z1BcGQc4XB0CuT+CE2OrogNjfcyekTTTXkOwCGCCLRWhj7TYlCr3k0GcaKrTQVhHa7ELb9clE65pqmtByRTIbMIvI2yW08KE/+tuyA/GRb9sHGlL9AAAAAElFTkSuQmCC'); /*Chevron_rechts_blue.svg*/
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-size: 12px;
    text-align: left;
    padding-right: 1.5rem;
    margin-right: 0;
}

input[value].previous-step-button {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsSAAALEgHS3X78AAAAoUlEQVRIx72WwRGEIAxFH9uAlEIJW4qlWYolWIIlsBXEkxc1KiEbZnJh/rzPEJKAiGAJoAAVEGAFyqXOAb5HBXK3gQLfYzzqPzSslFIBZmBQJPW043RyASZzDqzwVwY98EeDXvitgQdcNfCCXxoA2QuuGYxe8OZCM63wK/p7kkOeaUihhbSKkGYX0q4bTPommogswBf4KZJsnmhhQ7/127IBgARv2whdTvQAAAAASUVORK5CYII='); /*Chevron_links_blue.svg*/
    background-repeat: no-repeat;
    background-position: 4% 50%;
    background-size: 12px;
    text-align: left;
    padding-left: 1.5rem;
    margin-left: 38px;
}

input[type=submit].previous-step-button, input[type=submit].next-step-button {
    margin-top: 2rem; /* Override the style of the R&D */
    margin-bottom: 1rem;
    width: auto;
    background-color: #fff; /* Override the style of the R&D */
    color: #154273; /* Override the style of the R&D */
    border: 2px solid #154273; /* Override the style of the R&D */
}

input[type=submit].next-question-button,
input[type=submit].previous-step-button,
input[type=submit].next-step-button,
input[type=submit].information,
input[type=submit].generic-button,
input[type=submit].change-button,
.bodySection input[value].add-button {
    font-size: 1.5rem !important;
}

.previous-step-button, .next-step-button,
.next-question-button, .generic-button,
.upload-button, .search-button,
.select-organization-button, .refresh-button, .read-more-button {
    display: inline-block;
    line-height: 1em;
    background-color: #01689b;
    margin-top: 30px;
    color: #ffffff;
    font-size: 1.125rem;
    text-align: left;
    cursor: pointer;
    height: 46px;
    padding: 0 1rem;
    vertical-align: middle;
    border: 0;
}

a.read-more-button::before {
    content: "";
    display: inline-flex;
    width: 20px;
    height: 20px;
    min-width: 24px;
    margin-right: 8px;
    padding-bottom: 8px;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIiB3aWR0aD0iNDQ4IiBoZWlnaHQ9IjUxMiIgZmlsbD0iI2ZmZmZmZiIgYXJpYS1oaWRkZW49InRydWUiPgogIDxwYXRoIGQ9Ik00MDMuNjQsNzcuMTRjLTUuOTItNy4xLTE1LjM5LTExLjg1LTI0Ljg2LTEwLjY2SDEwNy42MWMtOS41MiwwLTE5LDMuNTMtMjQuOTEsMTAuNjYtOC4yOSw1LjkzLTEzLDE1LjQtMTEuODYsMjQuODh2MzQuMzRjMCw5LjQ3LDQuNzUsMTcuNzgsMTEuODYsMjQuODdhNDEuMDUsNDEuMDUsMCwwLDAsMjQuODcsMTEuODVsMTI3LjktMS4xOEw0NiwzNjMuNzljLTcuMTEsNS45My0xMC42NywxNS40LTEwLjY3LDI0Ljg3UzM4Ljg4LDQwNy42MSw0Niw0MTMuNTRMNjcuMyw0MzMuNjdBMzMuNjEsMzMuNjEsMCwwLDAsOTMuMzYsNDQ1LjUyYzkuNDcsMS4xOCwxOC45NC0zLjU1LDI0Ljg2LTEwLjY2TDMxMC4xMiwyNDNsMS4xOCwxMjkuMDhjMCw5LjQ4LDMuNTUsMTksMTAuNjYsMjQuODhzMTUuNCwxMC42NCwyNC44NCwxMC42NGgyOS42NGM5LjQ3LDAsMTguOTUtMy41NSwyNC44Ny0xMC42NkM0MDguNDIsMzkxLDQxMiwzODEuNTIsNDEyLDM3MlYxMDJBMjQuNTIsMjQuNTIsMCwwLDAsNDAzLjY0LDc3LjE0WiIvPgo8L3N2Zz4=);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

a.switch-language-button {
    position: relative;
    top: -5px;
    left: -5px;
    display: inline-block;
    width: clamp(250px, 80vw, 350px);
}

a.switch-language-button::before {
    content: "";
    display: inline-flex;
    width: 18px;
    height: 18px;
    min-width: 24px;
    margin-right: 8px;
    padding-bottom: 2px;
    background-color: #007bc7;
    mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0NDgiIGhlaWdodD0iNTEyIiB2aWV3Qm94PSIwIDAgNDQ4IDUxMiIgcm9sZT0icHJlc2VudGF0aW9uIiBhcmlhLWhpZGRlbj0idHJ1ZSI+PHBhdGggZD0iTTQwMy42NCw3Ny4xNGMtNS45Mi03LjEtMTUuMzktMTEuODUtMjQuODYtMTAuNjZIMTA3LjYxYy05LjUyLDAtMTksMy41My0yNC45MSwxMC42Ni04LjI5LDUuOTMtMTMsMTUuNC0xMS44NiwyNC44OHYzNC4zNGMwLDkuNDcsNC43NSwxNy43OCwxMS44NiwyNC44N2E0MS4wNSw0MS4wNSwwLDAsMCwyNC44NywxMS44NWwxMjcuOS0xLjE4TDQ2LDM2My43OWMtNy4xMSw1LjkzLTEwLjY3LDE1LjQtMTAuNjcsMjQuODdTMzguODgsNDA3LjYxLDQ2LDQxMy41NEw2Ny4zLDQzMy42N2EzMy42MSwzMy42MSwwLDAsMCwyNi4wNiwxMS44NWM5LjQ3LDEuMTgsMTguOTQtMy41NSwyNC44Ni0xMC42NkwzMTAuMTIsMjQzbDEuMTgsMTI5LjA4YzAsOS40OCwzLjU1LDE5LDEwLjY2LDI0Ljg4czE1LjQsMTAuNjQsMjQuODQsMTAuNjRoMjkuNjRjOS40NywwLDE4Ljk1LTMuNTUsMjQuODctMTAuNjZDNDA4LjQyLDM5MSw0MTIsMzgxLjUyLDQxMiwzNzJWMTAyQTI0LjUyLDI0LjUyLDAsMCwwLDQwMy42NCw3Ny4xNFoiLz48L3N2Zz4=) no-repeat center / contain;
    -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0NDgiIGhlaWdodD0iNTEyIiB2aWV3Qm94PSIwIDAgNDQ4IDUxMiIgcm9sZT0icHJlc2VudGF0aW9uIiBhcmlhLWhpZGRlbj0idHJ1ZSI+PHBhdGggZD0iTTQwMy42NCw3Ny4xNGMtNS45Mi03LjEtMTUuMzktMTEuODUtMjQuODYtMTAuNjZIMTA3LjYxYy05LjUyLDAtMTksMy41My0yNC45MSwxMC42Ni04LjI5LDUuOTMtMTMsMTUuNC0xMS44NiwyNC44OHYzNC4zNGMwLDkuNDcsNC43NSwxNy43OCwxMS44NiwyNC44N2E0MS4wNSw0MS4wNSwwLDAsMCwyNC44NywxMS44NWwxMjcuOS0xLjE4TDQ2LDM2My43OWMtNy4xMSw1LjkzLTEwLjY3LDE1LjQtMTAuNjcsMjQuODdTMzguODgsNDA3LjYxLDQ2LDQxMy41NEw2Ny4zLDQzMy42N2EzMy42MSwzMy42MSwwLDAsMCwyNi4wNiwxMS44NWM5LjQ3LDEuMTgsMTguOTQtMy41NSwyNC44Ni0xMC42NkwzMTAuMTIsMjQzbDEuMTgsMTI5LjA4YzAsOS40OCwzLjU1LDE5LDEwLjY2LDI0Ljg4czE1LjQsMTAuNjQsMjQuODQsMTAuNjRoMjkuNjRjOS40NywwLDE4Ljk1LTMuNTUsMjQuODctMTAuNjZDNDA4LjQyLDM5MSw0MTIsMzgxLjUyLDQxMiwzNzJWMTAyQTI0LjUyLDI0LjUyLDAsMCwwLDQwMy42NCw3Ny4xNFoiLz48L3N2Zz4=) no-repeat center / contain;
}

a.switch-language-button:visited::before {
    background-color: #884488;
}

.change-button, .change-button-alwaysActive {
    /* 101% because changebutton is standard TF 99% compared to other passive rows.
        30 px because passive mode first cell is always 30px.
    */
    width: calc(101% - 37px) !important;
    margin-left: 39px;
    margin-top: 0 !important;
    background-color: #d9ebf7;
    color: #01689b;
    border: 0;
    border-radius: 0 !important;
    text-decoration: none;
    text-align: right;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI0IDI0OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6IzAxNjg5Qjt9PC9zdHlsZT48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTUuNSwxMy42bDEuNi0xLjZ2Ny4yYzAsMC41LTAuNCwwLjgtMC44LDAuOEg1LjFjLTAuNCwwLTAuOC0wLjQtMC44LTAuOFY5LjFjMC0wLjIsMC4xLTAuNCwwLjItMC42bDQuMy00LjNDOSw0LjEsOS4yLDQsOS40LDRoNmwtMS42LDEuNmgtNHYzLjJjMCwwLjQtMC40LDAuOC0wLjgsMC44SDUuOXY4LjhoOS42VjEzLjZ6IE0xOS41LDYuNmwtMS44LTEuOGMtMC4zLTAuMy0wLjgtMC4zLTEuMSwwbC02LjgsNi44Yy0wLjEsMC4xLTAuMSwwLjItMC4yLDAuM2wtMC41LDNjMCwwLjIsMC4xLDAuMywwLjMsMC4zbDMtMC41YzAuMSwwLDAuMi0wLjEsMC4zLTAuMmw2LjgtNi44QzE5LjgsNy41LDE5LjgsNi45LDE5LjUsNi42Ii8+PC9zdmc+) !important;
    background-position: right 100px center !important;
    background-repeat: no-repeat !important;
    cursor: pointer;
    display: block; /*Standalone*/
    padding: 5px 32px 0 0 !important;
    font-weight: normal !important;
}

.read-more-button {
    margin-top: 0px !important;
    width: fit-content;
    display: flex;
    align-items: center;
    font-size: 1.5rem;
}

.search-button {
    margin-left: 92px !important;
    width: auto !important;
}

.selectbutton {
    color: #ffffff;
    background-color: #01689b;
    padding: 10px;
    cursor: pointer;
}

.select-organization-button {
    margin-top: 0px;
    margin-bottom: 30px;
    text-align: center;
    width: 100%;
    margin-right: 15px;
    float: right;
}

/* Other buttons; for example for controlling group iteration  */
.generic-button {
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMC4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjQgMjQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxnPg0KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNSwxMmwtNSw1TDksMTYuMWw0LjEtNC4xTDksNy45TDEwLDdMMTUsMTJ6Ii8+DQo8L2c+DQo8L3N2Zz4NCg=='); /*Chevron_rechts_wit.svg*/ /*Standalone*/
    background-repeat: no-repeat; /*Standalone*/
    background-position: 130px 12px; /*Standalone*/
    text-align: left !important;
    margin-right: 0px;
    padding-left: 15px;
    float: right;
}

a.generic-button {
    float: none;
    margin-top: 0 !important;
    width: auto;
    padding: 5px 35px 5px 20px !important;
    line-height: 2.8rem;
    text-decoration: none;
    background-position-x: 95%;
    border: none !important;
    border-radius: 5px !important;
}

/* niet bekend wat deze feedbackbutton doet. */
.feedbackbutton {
    transform: rotate(90deg);
    transform-origin: left top 0;
    padding: 10px 10px 10px 10px;
    float: left;
    position: absolute;
    left: calc(100%);
    bottom: 50%;
    font-size: 1.25rem;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    background-color: #E31E27;
    z-index: 9999;
    -webkit-box-shadow: 0px 2px 4px 1px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 0px 2px 4px 1px rgba(50, 50, 50, 0.75);
    box-shadow: 0px 2px 4px 1px rgba(50, 50, 50, 0.75);
}

    .feedbackbutton > a {
        color: #fff;
        text-decoration: none;
    }

a.feedback-button {
    background: #d52b1e;
    padding: 8px 50px;
    color: #fff !important;
    text-decoration: none;
    z-index: 999999;
    font-weight: bold;
    font-size: 22px;
    margin: 15px 0 15px 0;
    display: inline-flex;
    border-radius: 5px !important;
}

/* Link button; for example "Search again" in CB_Zoeken_Organisatie */
input[type=submit].hyperlink {
    background: none;
    border: none;
    cursor: pointer;
    color: #01689b;
    width: auto;
    display: block;
    margin-left: -5px;
    text-decoration: underline;
}

.formsset-navigation-btn-previous,
.formsset-navigation-btn-next,
.formsset-navigation-btn-overview,
input[type=submit],
a.generic-button,
button.generic-button,
.tf-dialog-button-confirm,
.tf-dialog-button-cancel {
    font-weight: normal !important;
}

/* ==================
   add & remove iteration buttons
   ================== */
input[value].add-button {
    background-color: #016B9b;
    color: #FFFFFF;
    width: auto;
    padding: 0% 12.5% 0% 25%;
    font-weight: normal;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEQAACxEBf2RfkQAAAAd0SU1FB9gEDw0NMXPyb1AAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuNWWFMmUAAAI3SURBVDhPY8AGJHwKmaTCGll+/PrF9uPnLw7p0AY2Ce8CJqg0YSDhXcjoWbuE7e/fv2pALOBePptF3LuIGSpNGIh55jKZZ03m+P37z/8/f/78N03rZhH3ymeBShMGYm7ZbIpx3Wy/fv/+//PXr/8Kka1Mou45xHtB1CWdWTq2nxPkAmA4/JeM6mIScc3E7gIRlwwOYadUTmGHZHZBxyQ2QftEVmHXHEb5nKVMQP///w30glzWYkZB12wmPqtoRj6LKFZe80gmHosIRl7LKDYGMWDgWDRsYbSq38RsWbuJ2aJmI6tlw3Yu9ZwFvH/+/v3xC+gK5cx53FaN29isazew2datZ3Go38BlX7+Rhc8umYPh379/zEAsBsT/QTaCaSAG0bgw0GAQrQXETDADdEASf/8iDIFhkAt+/voDlkMWB2J5IGZjEHTJZDfvPMFh03OK16rrJKdV1wk2g86zLJr1Bzh///kLdo1m/X4WvY7TnJYdR1gt2o8wA2kW46aD7JwWkRwMAjZxLPxWUcDAiWDiNQ9j5jELY+KzS2LUbj3JBLIJbEDjEVYei2hGTsMAdk5Df1ZOAx92Tn0/dk6jAOyJi9MoiEm35Tg7zACt+gOs7HrejFBpwoBD35fJvPc8J9Sv/03aT3KxaXsQbwCrrieT+8wbQAP+Aw34/9950kV2Vk0X4lMiq7Y7k9PUq6DY4QZ6gc+m7ywrs5ozCS7Q9mRk0fVlAsY30+/fv5mZdXyYWLQ8sCRlBgYA9yQ/5o6BkFgAAAAASUVORK5CYII=');
    background-position: 6px 14px;
    background-size: 16px;
}

.add-button, .add-button-text, .remove-button, .remove-button-text {
    background-repeat: no-repeat;
    background-color: Transparent;
    overflow: hidden;
    border: none;
    cursor: pointer; /*Image size*/
}

.add-button-text, .remove-button-text {
    background-position: left center;
    height: 18px;
    padding-left: 18px;
    text-align: left;
}

.add-button-hide-passive {
    display: none;
}

.add-button-bottomfix {
    bottom: auto;
}

.remove-button,
.remove-button-text {
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjQgMjQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojMDE2ODlCO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTYuNCwxOS4yYzAsMC40LDAuNCwwLjgsMC44LDAuOGg5LjZjMC40LDAsMC44LTAuNCwwLjgtMC44VjguOEg2LjRWMTkuMnogTTE0LjQsMTAuNEgxNnY3LjJsLTEuNiwwLjhWMTAuNHoKCSBNMTEuMiwxMC40aDEuNnY3LjJsLTEuNiwwLjhWMTAuNHogTTgsMTAuNGgxLjZ2Ny4yTDgsMTguNFYxMC40eiBNMTcuNiw1LjZjMC40LDAsMC44LDAuNCwwLjgsMC44VjhoLTAuOEg2LjRINS42VjYuNAoJQzUuNiw2LDYsNS42LDYuNCw1LjZoMi40VjQuOEM4LjgsNC40LDkuMiw0LDkuNiw0aDQuOGMwLjQsMCwwLjgsMC40LDAuOCwwLjh2MC44SDE3LjYiLz4KPC9zdmc+Cg==') !important; /*Verwijderen.svg*/
    background-position: 6px 10px !important;
    margin-top: -5px !important;
}

.add-button-container,
.remove-button-container {
    width: 24px;
    height: 24px;
}

.tf-dialog-button-cancel {
    background: #ffffff;
    color: #154273;
    border: 2px solid #154273;
}

/* Dialog Buttons */
.tf-dialog-buttons > .tf-dialog-button-confirm {
    background: white;
    padding: 0 5px;
    font-size: 20PX;
    font-weight: normal;
    border-radius: 5px;
    border: 1px solid #154273;
}

/* ==================
   2. Buttons (hover)
   ================== */

.change-button-alwaysActive:hover,
.change-button:hover,
input[type=submit].hyperlink:hover {
    text-decoration: underline;
    color: #154273;
}

.next-step-button:hover,
.next-question-button:hover,
.previous-step-button:hover,
.generic-button:hover,
.upload-button:hover,
.refresh-button:hover,
a.generic-button:hover {
    text-decoration: underline;
}

.search-button:hover,
.select-organization-button:hover,
input[value].add-button:hover,
a.read-more-button:hover {
    color: #C9E1F3;
    text-decoration: underline;
}

a.generic-button:hover {
    color: #C9E1F3 !important;
    background-color: #01689b !important;
    border: none !important;
    text-decoration: underline;
}

a.feedback-button:hover {
    color: #fff;
    text-decoration: underline;
    background: #c51b0e;
}

.tf-dialog-button-cancel:hover {
    background: #ffffff;
    color: #154273;
    border: 2px solid #154273;
}

.toolbar-button:hover::after {
    opacity: 1;
    visibility: visible;
}

/* ==================
   3. Buttons (focus)
   ================== */

.main-container input[type=submit]:focus-visible,
.main-container input[type=button]:focus-visible {
    outline: 2px dashed #000; /* Override the style of the R&D */
    box-shadow: none; /* Override the style of the R&D */
}

.change-button-alwaysActive:focus, .change-button:focus, .previous-step-button:focus, .next-step-button:focus,
.next-question-button:focus, .generic-button:focus, .upload-button:focus,
.search-button:focus, .select-organization-button:focus, .refresh-button:focus, a.read-more-button:focus {
    background-color: #01689b;
    color: #FFFFFF;
    outline-offset: 1px;
    padding: 10px 15px;
}

a.read-more-button:focus {
    padding: 13px 16px;
    text-decoration: none;
}

.change-button-alwaysActive, .change-button, .change-button-alwaysActive:focus, .change-button:focus {
    background-color: #d9ebf7 !important;
    color: #01689b !important;
    border: 0 !important;
}

a.generic-button:focus, a.feedback-button:focus,
a.help:focus, input[type=submit]:focus,
.tf-control-wrapper input[type=radio]:focus,
.tf-control-wrapper input[type=checkbox]:focus {
    outline: 2px dashed #000;
    outline-offset: 2px;
    box-shadow: none;
    border: none;
}

/*a.generic-button:focus {
    background-image: none !important;
    padding: 0 20px !important;
}*/

a:focus, button:focus, input:focus,
textarea:focus, #loginForms input:focus,
.form-group input:focus,
.main-navigation > .mainMenuItem a:focus,
.main-navigation > .mainMenuItem button:focus,
.account-container li > a:focus,
.account-container li a.login-button:focus,
.login-button-container > a:focus, select:focus,
.chosen-container-active ul.chosen-choices,
.chosen-container-active a.chosen-single,
.toolbar a:focus,
ul.main-navigation .mainMenuItem.dropdown .main-menu-expand-button:focus + a,
.logo-container a:focus, .btn:focus {
    outline: 2px dashed #000;
    outline-offset: -2px;
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff;
}

.helpTekstLang:focus {
    outline: 2px dashed #000;
    outline-offset: 0;
    -webkit-box-shadow: 0 0 0 2px #fff;
    box-shadow: 0 0 0 2px #fff;
}

.next-question-button:focus,
.next-step-button:focus,
.generic-button:focus,
.tf-dialog-content #openTFABox input[type="submit"]:focus {
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMC4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjQgMjQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxnPg0KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNSwxMmwtNSw1TDksMTYuMWw0LjEtNC4xTDksNy45TDEwLDdMMTUsMTJ6Ii8+DQo8L2c+DQo8L3N2Zz4NCg=='); /*Chevron_rechts_wit.svg*/
    background-repeat: no-repeat;
    background-position: right 11px;
}

input[value].remove-button:focus,
input[value].remove-button-text:focus {
    border: none !important;
}

input[type=file]:focus,
.tf-dialog-button-confirm:focus,
.tf-dialog-button-cancel:focus,
dialog .dialog-close-link:focus,
button:focus-visible {
    outline: 2px dashed #000;
    outline-offset: 2px;
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff;
}

.tf-dialog-buttons > .tf-dialog-button-confirm:focus,
.tf-dialog-buttons > .tf-dialog-button-cancel:focus,
.tf-dialog-buttons > .dialog-close-link:focus {
    outline: 2px dashed #000;
    outline-offset: 3px;
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff;
    border: 1px solid;
}

button:focus:not(:focus-visible) {
    outline: 2px dashed #000 !important;
    -webkit-box-shadow: inset 0 0 0 2px #fff;
    box-shadow: inset 0 0 0 2px #fff;
}

/* ==================
   4. Buttons (visited)
   ================== */

a.generic-button:visited {
    color: white; /* generic button itself is blue, so no other color on visited */
}

a.read-more-button:visited {
    color: white !important;
}

@media (max-width: 576px) {
    .tf-dialog-button-confirm {
        font-size: 0.9em;
    }

    .tf-dialog-button-cancel {
        font-size: 0.9em;
    }
}

@media screen and (max-width: 768px) {
    .tf-dialog-button-confirm {
        font-size: 1.1em;
        padding: 10px 0.25em;
    }

    .tf-dialog-button-cancel {
        font-size: 1.1em;
        padding: 10px 0.25em;
    }
}