/* 
    
The purpose of this stylesheet is to add custom styling to the SSRPM wizard. If you want to activate an selector you have te end the comment above by typing */ 

/* 
    
    /* Sections:
    1. Typography
    2. Logo
    3. Color
    4. Background

*/


/* 1. Typography
---------------------------------------
*/

html {
	/*font-variant: small-caps;*/
}

.form-control-bold{
    font-weight:bold;
}

/* 2. Logo
---------------------------------------
*/

/* Add your logo. Make sure the height of the logo you load is 35px */

.logo-body {
    margin-top: 3%;
    min-height:67px;
}

.logo-container {
    padding-left: 0px;
	/*background-color:#016450;*/
}

/*  if uploading a custom logo make sure height is 35px */
.logo {
    background-image:url(images/logo_custom.png);
	background-repeat: no-repeat;
	height:55px;
	margin-top: -5px;
    margin-left: 5px;
	background-position:left;
}


/* Change the thumbnail logo in the wizard title bar. Make sure the image width and height are 100px */

.wizard-style {
    z-index: 1500;
    background: #ffffff none repeat;
    width: 120%;
    height: 680px;
    position: absolute;
    margin-left: -10%;
    margin-top: -48%;
    box-shadow: -5px 21px 60px 10px #c0c0c0;
    -webkit-box-shadow: -5px 21px 60px 10px #c0c0c0;
}


.wizard-title {
	background-image: url(images/t4e-logo-green.png);
	background-color: transparent;
	color:#1d1d1b;
}

/* change the background color of the pop out wizard */

.body-wizard {
    /*#69a05d;*/
	 background-color: #92B053;
	/*background: transparent url(images/body-wizard.jpg)repeat left fixed;*/
	/* background: linear-gradient(to bottom,#dafdd3 0,#42623d 100%); */d
}

/* change style for ssrpm body */
.ssrpmbody {
   /* background:url(images/fons_punts.gif) ;*/
	background-color: #ffffff;
    border-color: transparent;
    position: relative;
    height: 550px;
    width: 450px;
    box-shadow: #909090 2px 2px 10px 1px;
    border-radius: 3px;
    margin: 0 auto;
}

/*
    3. Color
---------------------------------------
*/

/* This wil change the text color in the formheader */
.formheader {
    color: ;
}

/* Change the color of the progress bar */
.progress-bar {
    background-color: #00843e;
}

/* change the border color of the progressbar steps */
.progressbar-step {
    border: 3px solid #00843e;
}

/* change the filling color of the progressbar steps */
.progressbar-step-filled {
    background-color: #00843e;
    color: #ffffff;
}

/* change the filling color of the curent progressbar steps */
.progressbar-step-current{
    background-color: #00843e;
    color: #ffffff;
}
.progressbar-step-empty {
    background-color: #fff;
    color: #c0c0c0;
	border: 3px solid #c0c0c0;
}


/* change the text color of the icon text on the start page */
.icon {
    color:;
}

.icon:hover {
    color:;
}

/* change the text color of the icon ssrpm */
.SSRPM-icon:before,
.enroll-icon:before,
.reset-icon:before,
.change-icon:before,
.unlock-icon:before,
.onboarding-icon:before,
.forgotusername-icon:before,
.user-icon:before
{
    color: #00843e;
}

/* change the hover color of the icon ssrpm */
i.enroll-icon:hover:before,
i.reset-icon:hover:before,
i.change-icon:hover:before,
i.unlock-icon:hover:before,
i.onboarding-icon:hover:before,
i.forgotusername-icon:hover:before,
i.user-icon:hover:before
{
    color: #00843e;
}


/* change the border color and text color of the back and forward buttons submit*/
.btn-submit {
	color:#00843e;
    border-color:#00843e;
	background-color:#ffffff;
	font-weight:normal;  
	text-transform: capitalize;	
	font-size: 16px;
	height:40px;
    width: 140px;
	border: 2px solid #00843e;
	-webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* change the hover color of the back and forward buttons */
.btn-submit:hover {
	color:#ffffff;
    border-color:#00843e;
	background-color:#00843e;
	text-transform: capitalize;	
}

.btn-submit:active {
	color:#ffffff;
    border-color: #00843e;
	background-color:#00843e;
}
    
.btn-submit-disabled {
	text-transform: capitalize;
    background-color: #c0c0c0;
    color: #f4f4f4;
   font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    letter-spacing: 0.3px;
	font-size: 16px;
    height: 40px;
	width: 140px;
    bottom: 0px;
    right: 130px;
    border: 0px #c0c0c0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    cursor: not-allowed !important;
}

input[type=submit]:focus {
    color: #ffffff;
    border-color: #00843e;
	background: #00843e;

}

/* change the icon color/hover color of the faq icon and forward buttons style */
.btn-glyph-faq {
    color: #1d1d1b;
}

.btn-glyph-faq:hover {
    color: #1d1d1b;
}

.btn-faq {
    height:40px;
    width: 140px;
    float: none;
    border: 2px solid #00843e;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #ffffff;
	color: #00843e;
	text-transform: capitalize;
}

.btn-faq:hover {
	color:#ffffff;
    border-color:#00843e;
	background-color:#00843e;
}

.mailto-icon {
    margin: 0px 10px 0px 9999px;
	color:#00843e;
}

.mailto-icon:hover {
	color:#FFD179;
}

/* change the color of the tooltip/popover */

.tooltip-inner {
    background-color: #1d1d1b;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #1d1d1b;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #1d1d1b;
}

.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #1d1d1b;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #1d1d1b;
}


/* change the color of the label text */
label {
    color:#595959;
	font-weight: normal;
}

/* change the color of the links on the home page when not using the wizard overlay*/
.ssrpm-label {
    color:#1d1d1b;
}
.ssrpm-label:hover{
color:#1d1d1b;
}

.formheader-text {
	color:#1d1d1b;
}

/* 4. Background
---------------------------------------
*/

/* This is the default background image. If you want to show custom images then override the default background images within the Images folder with an high-res image of your choosing */
.body-image {
	background: transparent url(images/background_custom.jpg) no-repeat center fixed;
    background-size: cover;
}