/* Container Rondom inputfields en resultfields*/
.dc-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    box-shadow: 0px 12px 18px -6px rgba(0,0,0,0.3);
    border-radius: 6px;
}
/* Google Results */
.search-result{
    padding: 25px;
}

.search-result .bedrijfsnaam {
    color: #202124;
    font: 14px arial, sans-serif;
    max-width: 600px;
    overflow-x: hidden;
}
.search-result #googletitle {
    color: #1A0DAB;
    font: 20px arial, sans-serif;
    margin: 10px 0px 3px;
    padding: 5px 0px 0px;
    max-width: 600px;
    overflow-x: hidden;
}
.search-result #googleurl {
    color: #4D5156;
    font: 12px arial, sans-serif;
    max-width: 600px;
    overflow-x: hidden;
}
.search-result #googledescription
 {
    color: #4D5156;
    font: 14px arial, sans-serif;
    max-width: 600px;
    overflow-x: hidden;
}
.titlecontainer {
    display: flex;
    align-items: center; 
    gap: 10px; 
}
.googleafbeelding {
    width: 28px;
    height: 28px;
    
    display: flex;
    justify-content: center;
    align-items: center;
}
#googleafbeelding {
    width: 28px;
    height: 28px;
    border-radius: 50%;
}
.input-fields, 
.search-result {
    width: 100%;
    border-radius: 10px;             
}

@media screen and (min-width: 900px) {
    .dc-container {
        flex-direction: row;
    }
    .input-fields, 
    .search-result {
        flex: 1; 
    }
}

.input-fields {
    font-size: 16px; 
    box-sizing: border-box; 
    padding: 25px;
    border-radius: 6px;
    background-color: #F7FCFF;
}

.input-fields input,
.input-fields textarea {           
    background-color: #ffffff; 
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 15px;
    box-sizing: border-box;
    width: 100%;
}

.input-fields #geavanceerdCheckbox{
    width: unset !important;   
}

.field-label{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.field-label .label{
    background-color: #0072ff;
    color: #ffffff;
    padding: 0px 15px;
    border-radius: 15px;
    font-size: 14px;
    margin-bottom: 5px;
}

.field-label .orange{
    background-color: orange !important;
}

.field-label .red{
    background-color: red !important;
}

#geavanceerdeInputs {
    position: relative;
    display: none;
}

/* ----- Google Header */
#googleheader{
    display: flex;
    flex-direction: row;
    gap: 3%;
    margin-bottom: 50px;
}

#googleheader img{
    width: 25%;
    height: auto;
}

#googleheader .zoekbalk{
    width: 72%;
    padding: 5px 15px;
    border: solid 1px #dfe1e5;
    color: #dfe1e5;
    border-radius: 25px;
}