/**
* css_style_BrandHUE.css v0.0.4
* Copyright 2019 Signify
*/

body{
    
    font-size:17px;
    line-height: 25px;
    font-family: 'centrale_sans_book', Tahoma, Arial, Verdana;
    font-weight: normal;
    color: #ffffff;
    background-color:#000000;
    
}

::selection {
    background: #efeff4;
    text-shadow: none;
}

h1{
    
    font-size: 54px;
    line-height: 60px;
    font-family: 'centrale_sans_xbold', Tahoma, Arial, Verdana; 
    font-weight: normal;
    color:#ffffff;
    
}

h2{

    font-size: 44px;
    line-height: 48px;
    font-family: 'centrale_sans_xbold', Tahoma, Arial, Verdana;    
    font-weight: normal;
    color:#ffffff;
    letter-spacing: -0.5px;
    margin-bottom: 34px;
    text-align: center;
    
}

.pop-up h2{margin-bottom: 15px;}

h3{
    
    font-size: 21px;
    line-height: 26px;
    font-family: 'centrale_sans_xbold', Tahoma, Arial, Verdana;
    font-weight: normal;
    letter-spacing:-0.2px;
    color: #0f204b;
    
}

h4{
    
    font-size: 17px;
    line-height: 25px;
    font-family: 'centrale_sans_xbold', Tahoma, Arial, Verdana;
    font-weight: normal;
    letter-spacing:-0.1px;
    color: #0f204b;
    margin-bottom: 10px;
    
}

#thankYouTitle, p#thankYouTitleSub{

    text-align: center;

}

p#subTitle1, p#subTitle2{
    
    text-align: left;
    
}

label.error{
    
    color:#ff9514;
    font-size:12px;
    font-weight:normal;
    padding: 10px 1px 0px 1px !important;
    line-height: 12px;
    
}

#required{
    
    font-size:14px;
    
}

.preloader{
    background-color: #000000 !important;
}

.loader span{
  background-color: #ff9514 !important;
}

/*****************************************************
Default link styling
*****************************************************/

a:link { color: #ff9514; text-decoration: none; }
a:visited { color: #ff9514; text-decoration: none; }
a:hover { color: #ffaa43; text-decoration: none; }
a:active {  color: #ffaa43; text-decoration: none; }

/*****************************************************
Field styling general
*****************************************************/
.form-field{

    font-size: 17px;
    line-height: 17px;
    color: #3c3c3c;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 3px 3px 3px 3px;
    padding: 9px 12px 9px 12px;
    
}

.form-field:focus{
    color:#3c3c3c;
    background-color:#fff;
    border-color:#0066a1;
    outline:0;
    box-shadow:0 0 0 2px rgba(0,102,161,.25);
}

.form-field::-webkit-input-placeholder{
    
    color:#757575;opacity:1

}

.form-field::-moz-placeholder{
    
    color:#757575;opacity:1
        
}

.form-field:-ms-input-placeholder{
    
    color:#757575;opacity:1
        
}

.form-field::-ms-input-placeholder{
    
    color:#757575;opacity:1

}

.form-field::placeholder{
    
    color:#757575;opacity:1

}

.form-field:disabled,.form-control[readonly]{
    
    background-color:#e9ecef;opacity:1

}

/*****************************************************
Field styling Select field
*****************************************************/

select.form-field:focus::-ms-value{
    
    color:#495057;
    background-color:#fff;

}

select.form-field{
    
    background-image:
    linear-gradient(45deg, transparent 50%, gray 50%),
    linear-gradient(135deg, gray 50%, transparent 50%),
    linear-gradient(to right, #ccc, #ccc);
    background-size: 5px 5px, 5px 5px, 1px 1.2em;
    
}

select.form-field:focus {
  background-image:
    linear-gradient(45deg, #6c757d 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, #6c757d 50%),
    linear-gradient(to right, #ccc, #ccc);
    
}

/*****************************************************
Field styling Checkbox field
*****************************************************/

.checkboxfield .option .checkmark {

    background-color: #fff;
    border: 1px solid #cccedb;
    
}

.checkboxfield .option .checkmark:after {

    left: 8px;
    top: 5px;
    border: solid #ff9514;
    border-width: 0 3px 3px 0;

}

/*****************************************************
Field styling Radio field
*****************************************************/

.radiofield .option .checkmark {

    background-color: #fff;
    border: 1px solid #cccedb;
    
}

.radiofield .option .checkmark:after {

	background: #ff9514;
    
}

.radiofield .option .checkmark:after {
    
    top: 6px;
	left: 6px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
    
}

.radiofirstincol{
    
    margin-top:28px;
    
}

/*****************************************************
Field styling Checkbox & Radio field
*****************************************************/

input[type="radio"]:checked ~ .checkmark,input[type="checkbox"]:checked ~ .checkmark{
    background-color: #fff;
}

.checkboxfield .option .checkmark:hover,.checkboxfield .option .checkmark.hover,.radiofield .option .checkmark:hover,.radiofield .option .checkmark.hover{
    
    background-color: #ccc;
    
}

input[type="radio"]:checked ~ .checkmark:hover,input[type="checkbox"]:checked ~ .checkmark:hover,.activehover{
    
    background-color: #fff !important;
}

/*****************************************************
Field styling Button
*****************************************************/

input[type="submit"]{

	color:#fff;
    border-radius: 2em;
    background:#ff9514;
    font-family: 'centrale_sans_bold', Tahoma, Arial, Verdana;
    border: none;
    
}

input[type="submit"]:hover{

    background:#ffaa43;
    
}

/*****************************************************
Image styles
*****************************************************/

.col-md-6 img{display: block;}

/*****************************************************
Custom styles
*****************************************************/

/* Image left, Black background, Fields right */
.style-A {background-color: #000000;}
.style-A .container {position: relative; max-width: 1280px; margin: 0px auto 0px auto !important;}
.pop-up.style-A .container {position: relative; max-width: 100%; margin: 0px auto 0px auto !important;}
.style-A label.error{color:#ff9514;}
.style-A h2 {color: #ffffff; text-align: left; margin-bottom: 20px;}
.style-A input[type="submit"]{color:#ffffff; background: #ff9514; float:right;}
.style-A input[type="submit"]:hover{color:#ffffff; background: #ffaa43;}
.style-A input[type="submit"]:active{color:#ffffff; background: #cd7811;}
.style-A .form-field {color: #000000; border-color:#000000; background-color: #ffffff;}
.style-A .form-field:focus{color:#000000; border-color:#000000; background-color: #ffffff; box-shadow:0 0 0 2px rgba(0,0,0,.25);}
.style-A a:link { color: #ff9514; text-decoration: none; }
.style-A a:visited { color: #ff9514; text-decoration: none; }
.style-A a:hover { color: #ffaa43; text-decoration: none; }
.style-A a:active {  color: #ffaa43; text-decoration: none; }
.style-A .checkboxfield .option .checkmark:hover,.checkboxfield .option .checkmark.hover,.radiofield .option .checkmark:hover,.radiofield .option .checkmark.hover{ 
    background-color: #ccc;
}
.style-A .radiofield .option .checkmark:after {background: #ff9514;}
.style-A .checkboxfield .option .checkmark:after {left: 8px; top: 5px; border: solid #ff9514; border-width: 0 3px 3px 0;}
.style-A .submitbutton{display:inline-block;}
.style-A #column1{overflow-x: hidden; padding-left: 0px;}
.style-A #column2{padding-top:20px;}
.style-A #required{text-align: right;}
.style-A .col-md-6 img{height:100%;}


@media screen and (max-width: 767px) {

.style-A #column1{overflow-x: visible; padding-left:0px; padding-right: 0px;}
.style-A .col-md-6 img{height:auto; width:100%;}
.style-A .myTitle{
    font-size: 36px;
    line-height: 44px;
    letter-spacing: normal;
}


}