/* Your custom css code goes here */

body{color:#5d77a2;}

.error{color:red;}
.hidden{display:none !important;}

a.probootstrap-logo {
    background: url('/img/sbd_fullcol-no-padding.svg') no-repeat center !important;
    background-size: cover;
    height: 200px;
    width: 200px;
    font-size: 0;
    color: rgba(0,0,0,0);
}

a.footer-logo {
    background: url('/img/sbd_fullblue.svg') no-repeat center !important;
    background-size: contain;
    height: 150px;
    width: 100%;
    display:block;
    font-size: 0;
    color: rgba(0,0,0,0);
}

header.probootstrap-header {
    padding-top: 30px;
    background: rgb(242,242,242);
    background: linear-gradient(180deg, rgba(242,242,242,1) 0%, rgb(213 225 239) 100%);
}

input.btn.btn-primary {
    background: #4982C3;
    border-color: #98bde6;
}

input.btn.btn-primary:hover {
    background: #98bde6;
    border-color: #4982C3;
    color:#4982C3;
}

form .col-md-6:nth-child(1) {padding-left:0 !important;}
form .col-md-6:nth-child(2) {padding-right:0 !important;}

input.btn.btn-primary {
    position: absolute;
    right: 14px;
    font-size: 20px;
    padding:20px 40px;
}

label {
    color: #4a82c3;
}

.probootstrap-form .form-control {
    border-color: #4a82c399;
    border-width: 1px;
    color:#4a82c3;
}

.probootstrap-form .form-control:hover,
.probootstrap-form .form-control:focus {
    box-shadow: inset #4182c3 0px 0px 10px -3px;
}

a.image-popup{
	max-height:400px;
	overflow-y:hidden;
}

img.img-responsive {
    margin: 0 auto;
}

img.mfp-img {
    background-color: white;
}


.mfp-title,
.mfp-counter {
    color: black;
    position: relative;
    top: -20px;
}

.mfp-counter{
    position:absolute;
    right:10px;
    top:-10px;
}

.menu-panel{
	list-style:none;
}

.menu-panel li{
		display:inline-block;
		padding:10px 20px;
}

.menu-panel li.select{
	box-shadow: inset #4182c3 0px 0px 10px -3px;
}

@media screen and (max-width: 768px) {

    .menu-panel{padding:40px;}
    
	.menu-panel li,
	.menu-panel li a{
		display:block;
		text-align:center;
		}

}