﻿@-webkit-keyframes beoordelingFadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}  
@keyframes beoordelingFadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}

#beoordelingv2_overzicht .ster,
#beoordelingv2_form .ster {
    background-repeat: no-repeat;
    display: inline-block;
    background-size: cover;
    width: 20px;
    height: 20px;
    pointer-events: none;
}
#beoordelingv2_overzicht .ster-heel,
#beoordelingv2_form .ster-heel {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARZJREFUeNpiYqADYCJVw/+7ogk0dRHQAgUg/g/EDrT0ST0aTRRgJMUXQOo+kpAjo/LrA9T2ST0BPmU+weILknzDRKYvSPINIx7XGwApkA8MCBg2AYgPAvEHXL5ihBrYAKT4oQYqQDG54AMQXwDiB0D8EGhxAwtUAiQwn0rZSQCIYfkoER4nQNsWwASoCBKh5iIinsoWwS3ASF1UsgjFAqxJGMmiD9SwAGc+gSosJNGCCdgsIJQZFchIVSTneH0SLVEgxxJSfeJAjiUGOMQvEChIibMER813AFrqGgJpRSDeQKzDmIgIKpjh8GIdSD8A4kCQOFSekO+x+qQBiO8T22gA+RyI9wPxelIsMSAnq+OKE7oAgAADAGp9Yw1XcM7tAAAAAElFTkSuQmCC);
}
#beoordelingv2_overzicht .ster-half,
#beoordelingv2_form .ster-half {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAATpJREFUeNpiYBiM4Oa5KQmk6mEiRfH/u6IK3CzP5x89dsyBZpYAQT0aTV1LQL4AUrCgciDFN0xk+IKBVN8wkeELBlJ9w0SmL0jyDQse1xsAKZAPDLD4Atk3/UD6IBB/sLayOoBNESPUwAYgxQ81UAGKsYKnX9MYHn7xxufwD0B8AYgfAPFDoMUNMJ+ABOZTKb8KgHwIZSfC44RR+fUCmAAVQSLQFwtQIp7KFsEtwEhdVLIIxQKsSRjJog/UsABnPoFaVEiiBROwWUAoMyqQkapIzvH6JFqiQI4lpPrEgRxLDLAXEb8u4NIALGIUiLYEWMxgcxWoXHKU1us2BNKKQLyBWIcxERFUYMOBKQ6EwQUgMBU9AOJAkDhUnmxLQOVZIrLh6ABU6gKxI5JlxCcWaDFPMsAVJ3QBAAEGAMgXYNIFwtB+AAAAAElFTkSuQmCC);
}
#beoordelingv2_overzicht .ster-leeg,
#beoordelingv2_form .ster-leeg {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARpJREFUeNrMVssRgjAQJRnuWkKsQLziBUuwAynBCsAO6ABLsAQ8yNkOxA4owZeZhQHlk42Z0Z15s0w++/KS3R087x/tVpYH7h7BJFBwD2C3DcPCdJ9kHip5826VdFQ0ZqxGWqjwuGqEpQqWGmmpgqVGTJw+gNMKgplgGXAF6jFVggKmcAsKqAi2VgN3oAKeIE59mtADuaN6XQIRfce966JKzh02hxgqzh9v4pCoJRh8eAdEPYLBFKYFMT3g1wRzKcxVlIHgyC1GZZFV7IpfM0mUDQlXSWRDEoyM32caqRkJFg+dqqCuu4FfARfTg0mDq2qCt20dvgL2epzmJ0n8CRLdz05Ded+pKU1QkPKElSzU5m3+ZJT3K3sJMACw6lyEuNThSgAAAABJRU5ErkJggg==);
}

#beoordelingv2_overzicht .btn.btn-primary,
#beoordelingv2_form .btn.btn-primary,
#beoordelingv2_form .btn.btn-success {
    background-color: #ff9800;
    color: #fff;
    border-radius: 0;
    text-align: center;
    border: 1px solid #ff9800;
	text-transform: uppercase;
    outline: none;
}

#beoordelingv2_overzicht .btn.btn-primary:hover,
#beoordelingv2_overzicht .btn.btn-primary:active,
#beoordelingv2_overzicht .btn.btn-primary:focus,
#beoordelingv2_form .btn.btn-primary:hover,
#beoordelingv2_form .btn.btn-primary:active,
#beoordelingv2_form .btn.btn-primary:focus,
#beoordelingv2_form .btn.btn-success:hover,
#beoordelingv2_form .btn.btn-success:active,
#beoordelingv2_form .btn.btn-success:focus {
    background-color: #ff9800;
    border: 1px solid #ff9800;
    color: #e7e7e7;
}

#beoordelingv2_form #gegevens h3 {
    color: #000;
    font-size: 24px;
    margin: 0;
    line-height: 22px;
}

h3.beoordeling-actief {
    margin: 0 0 20px 0;
    text-align: center;
    background: #008000;
    color: #fff;
    padding: 15px;
}

/*BEOORDELINGSLIJST*/

#beoordelingv2_overzicht h2.beoordeling-title {
	margin: 10px 0 0 0;
}

#beoordelingv2_overzicht .beoordelingen-top {
	margin-bottom: 40px;
}

#beoordelingv2_overzicht .beoordeling {
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
    border: none;
    margin: 0 0 20px 0;
	border-radius: 0;
	padding: 30px;
    color: #000;
}

#beoordelingv2_overzicht .stars .glyphicon-star {
	margin-right: 5px;
	font-size: 20px;
}

#beoordelingv2_overzicht .beoordeling-details h4 {
	margin: 16px 0 0 0;
	font-size: 16px;
    color: #000;
}

#beoordelingv2_overzicht .reactie {
    border: 1px solid #F5A623;
    background: #F5A623;
    border-radius: 10px;
	color: #fff;
	padding: 25px;
	margin-bottom: 40px;
}

#beoordelingv2_overzicht h3 {
	font-size: 18px;
	margin: 0 0 20px 0;
	padding: 0;
    color: #000;
}
#beoordelingv2_overzicht .reactie h3 {
    color: #fff;
}

#beoordelingv2_overzicht p {
	margin: 0;
}

@media(max-width: 767px) {
	#beoordelingv2_overzicht .stars {
		margin-bottom: 16px;
	}
	#beoordelingv2_overzicht .btn.btn-beoordelen {
		width: 100%;
		margin-top: 0px;
		font-size: 14px;
		padding-left: 0;
		padding-right: 0;
		text-align: center;
	}
}

@media(min-width: 768px) {
    #beoordelingv2_form {
        padding: 0 15px;
    }
    #beoordelingv2_form .modal-dialog.modal-lg {
        width: 100%;
        max-width: 1100px;
    }
    #beoordelingv2_form .form-flex {
        height: 600px;
        display: flex;
        justify-content: center;
        width: 100%;
        align-items: center;
    }
    #beoordelingv2_form .modal-body {
        padding: 0;
    }
}

#beoordelingv2_form .modal-content {
    border: none;
    border-radius: 0;
}

#beoordelingv2_form textarea,
#beoordelingv2_form textarea:active,
#beoordelingv2_form textarea:focus {
    border-radius: 0;
    resize: none;
    box-shadow: none;
    outline: none;
    border: 1px solid #ececec;
    font-size: 18px;
}

#beoordelingv2_form #opmerking i.glyphicon-remove,
#beoordelingv2_form #reden i.glyphicon-remove {
    color: #a94442;
}
#beoordelingv2_form #reden i.glyphicon-ok {
    color: #3c763d;
}
#beoordelingv2_form #reden i.form-control-feedback {
    top: 6px;
    right: 15px;
    pointer-events: none;
}
#beoordelingv2_form #gegevens i.form-control-feedback {
    top: 16px !important;
    right: 5px;
    pointer-events: none;
}

#beoordelingv2_form #opmerking textarea {
    margin: 40px 0 15px 0;
}

#beoordelingv2_form .glyphicon-arrow-left:before {
    content: "\e091";
    color: #ffffff;
}

#beoordelingv2_form label {
    font-size: 25px;
}

#beoordelingv2_form .star-rate {
    margin: 250px 0px;
}

#beoordelingv2_form .image1 {
    background-image: url(//svl.autodealers.nl/images/beoordelingen/rate.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 600px;
    margin-right: -15px;
}


#beoordelingv2_form #opmerking,
#beoordelingv2_form #reden,
#beoordelingv2_form #gegevens,
#beoordelingv2_form #bedanken,
#beoordelingv2_form #rateUs {
    margin-left: -15px;
    display: none;
    -webkit-animation: beoordelingFadeIn 1.5s;
    animation: beoordelingFadeIn 1.5s;
}

@media(max-width: 767px) {
    #beoordelingv2_form #opmerking,
    #beoordelingv2_form #reden,
    #beoordelingv2_form #gegevens,
    #beoordelingv2_form #bedanken,
    #beoordelingv2_form #rateUs {
        margin-left: 0;
    }
    #beoordelingv2_form .modal-body {
        padding: 30px 15px;
    }
}

#beoordelingv2_form #rateUs {
    display: block;
    text-align: center;
    -webkit-animation: none;
    animation: none;
}

#beoordelingv2_form .form-content {
    width: 100%;
}

#beoordelingv2_form h3 {
    color: #000;
    font-size: 24px;
}

#beoordelingv2_form .form-group {
    margin: 0;
}

#beoordelingv2_form #beoordeling_sterren,
#beoordelingv2_form #beoordeling_sterren2 {
    margin-bottom: 40px;
    cursor: pointer;
}

#beoordelingv2_form #opmerking .btn.btn-primary,
#beoordelingv2_form #reden .btn.btn-primary,
#beoordelingv2_form #gegevens .btn.btn-primary,
#beoordelingv2_form #gegevens .btn.btn-success {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 10px 0 40px 0;
}

#beoordelingv2_form select {
    border-radius: 0px;
    width: 100%;
    padding: 10px;
    margin: 10px 0 20px;
    border-color: #ececec;
    outline: none;
    color: #555;
    font-size: 18px;
}

#beoordelingv2_form input,
#beoordelingv2_form input:active,
#beoordelingv2_form input:focus {
    border-radius: 0px;
    box-shadow: none;
    border: 2px solid #ececec;
    outline: none;
    width: 100%;
    color: #555;
    padding: 9px;
    font-size: 18px;
    margin: 10px 0 20px 0;
}


#beoordelingv2_form .number-button {
    display: inline-block;
}

#beoordelingv2_form .circle {
    display: inline-block;
    height: 35px;
    width: 35px;
    line-height: 35px;
    border-radius: 50%;
    background-color: #e7e7e7;
    color: #ffffff;
    text-align: center;
    font-size: 20px;
    float: left;
    cursor: default;
}
#beoordelingv2_form .circle.active {
    background-color: #f5a623;
    cursor: pointer;
}

#beoordelingv2_form .circle-3 {
    height: 42px;
    width: 70px;
}

#beoordelingv2_form .line {
    width: 50px;
    height: 18px;
    border-bottom: 2px solid #e7e7e7;
    display: inline-block;
    line-height: 33px;
    text-align: center;
    font-size: 20px;
    color: transparent;
    float: left;
    cursor: default;
}
#beoordelingv2_form .line.active {
    border-color: #f5a623;
}

#beoordelingv2_form .circle-3:hover {
    background-color: #e7e7e7;
}

#beoordelingv2_form #reden h3,
#beoordelingv2_form #reden select {
    margin: 0 0 25px 0;
}

#beoordelingv2_form #bedanken h3 {
    line-height: 30px;
}

/* Beoordeling sterren invoer */
#beoordeling_sterren,
#beoordeling_sterren2 {
    display: inline-block;
}
#beoordelingv2_form .ster {
    width: 35px;
    height: 35px;
}

@media(max-width: 767px) {
    #beoordelingv2_form h3 {
        color: #000;
        font-size: 20px;
    }
}
@media(max-width: 991px) {
    #beoordelingv2_form select {
        font-size: 14px;
    }
}