body {

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	font-weight: 300;

	color: #888;

	line-height: 30px;

	text-align: center;

}

strong {

	font-weight: 500;

}

a, a:hover, a:focus {

	color: #bc6fad !important;

	text-decoration: none;

	-o-transition: all .3s;

	-moz-transition: all .3s;

	-webkit-transition: all .3s;

	-ms-transition: all .3s;

	transition: all .3s;

}

h1, h2 {

	margin-top: 10px;

	font-size: 38px;

	font-weight: 100;

	color: #555;

	line-height: 50px;

}

h3 {

	font-size: 22px;

	font-weight: 300;

	color: #555;

	line-height: 30px;

}

h4 {

	font-size: 18px;

	font-weight: 300;

	color: #555;

	line-height: 26px;

}

img {

	max-width: 100%;

}







::-moz-selection {

background: #f35b3f;

color: #fff;

text-shadow: none;

}

::selection {

	background: #f35b3f;

	color: #fff;

	text-shadow: none;

}

/***** Top menu *****/







.navbar {

	padding-top: 10px;

	background: #333;

	background: rgba(51, 51, 51, 0.3);

	border: 0;

	-o-transition: all .3s;

	-moz-transition: all .3s;

	-webkit-transition: all .3s;

	-ms-transition: all .3s;

	transition: all .3s;

}

.navbar.navbar-no-bg {

	background: none;

}

ul.navbar-nav {

	font-size: 16px;

	color: #fff;

}

.navbar-inverse ul.navbar-nav li {

	padding-top: 8px;

	padding-bottom: 8px;

}

.navbar-inverse ul.navbar-nav li .li-text {

	opacity: 0.8;

}

.navbar-inverse ul.navbar-nav li a {

	display: inline;

	padding: 0;

	color: #fff;

}

.navbar-inverse ul.navbar-nav li a:hover {

	color: #fff;

	opacity: 1;

	border-bottom: 1px dotted #fff;

}

.navbar-inverse ul.navbar-nav li a:focus {

	color: #fff;

	outline: 0;

	opacity: 1;

	border-bottom: 1px dotted #fff;

}

.navbar-inverse ul.navbar-nav li .li-social a {

	margin: 0 5px;

	font-size: 28px;

	vertical-align: middle;

}

.navbar-inverse ul.navbar-nav li .li-social a:hover,  .navbar-inverse ul.navbar-nav li .li-social a:focus {

	border: 0;

	color: #f35b3f;

}

.navbar-brand {

	width: 162px;

	background: url(../img/logo.png) left center no-repeat;

	text-indent: -99999px;

}

/***** Top content *****/







.top-content {

    padding: 8px 0 170px 0;

}

.top-content .text {

	color: #fff;

}

.top-content .text h1 {

	color: #fff;

	    margin-top: -15px;

}

.top-content .description {

	    margin: 0px 0 0px 0;

}

.top-content .description p {

	opacity: 0.8;

}

.top-content .description a {

	color: #fff;

}

.top-content .description a:hover,  .top-content .description a:focus {

	border-bottom: 1px dotted #fff;

}

.form-box {

    padding-top: 24px;

}



.f1 {

	padding: 25px;

	background: #fff;

	-moz-border-radius: 4px;

	-webkit-border-radius: 4px;

	border-radius: 4px;

}

.f1 h3 {

	margin-top: 0;

	margin-bottom: 5px;

	text-transform: uppercase;

	    font-weight: 500;

		    font-size: 16px;

			color: #bc6fad;

	

}

.f1-steps {

	overflow: hidden;

	position: relative;

	margin-top: 20px;

}

.f1-progress {

	position: absolute;

	top: 24px;

	left: 0;

	width: 100%;

	height: 1px;

	background: #ddd;

}

.f1-progress-line {

	position: absolute;

	top: 0;

	left: 0;

	height: 1px;

	background: #bc6fad;

}

.f1-step {

	position: relative;

	float: left;

	    width: 33%;

	padding: 0 5px;

}

.f1-step-icon {

	display: inline-block;

	width: 40px;

	height: 40px;

	margin-top: 4px;

	background: #ddd;

	font-size: 16px;

	color: #fff;

	line-height: 40px;

	-moz-border-radius: 50%;

	-webkit-border-radius: 50%;

	border-radius: 50%;

}

.f1-step.activated .f1-step-icon {

	background: #fff;

	border: 1px solid #bc6fad;

	color: #bc6fad;

	line-height: 38px;

}

.f1-step.active .f1-step-icon {

	width: 48px;

	height: 48px;

	margin-top: 0;

	background: #bc6fad;

	font-size: 22px;

	line-height: 48px;

}

.f1-step p {

	color: #ccc;

}

.f1-step.activated p {

	color: #bc6fad;

}

.f1-step.active p {

	color: #bc6fad;

}

.f1 fieldset {

	display: none;

	text-align: left;

}

.f1-buttons {

	text-align: right;

}

.f1 .input-error {

	border-color: #bc6fad;

}

/***** Munibah *****/

.margin-left label {

    display: inline-block;

    max-width: 100%;

    margin-bottom: 5px;

    font-weight: normal !important;

    margin-top: 5px !important;

    margin-left: -12px !important;

}

button.btn.btn-next, button.btn.btn-next:focus, button.btn.btn-next:active:focus, button.btn.btn-next.active:focus {

    background: #bc6fad !important;

}



form h4 {

    font-size: 18px;

    font-weight: 500;

    color: #555;

    line-height: 26px;

	color:##bc6fad;

}

input[type="text"], input[type="password"], textarea, textarea.form-control {

    height: 40px !important;

    margin: 0;

        padding: 0 9px !important;

    vertical-align: middle;

    background: #fff;

    border: 1px solid #ddd;

    font-family: 'Roboto', sans-serif;

        font-size: 12px !important;

    font-weight: 300;

    line-height: 44px;

    color: #888;

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

    border-radius: 4px;

    -moz-box-shadow: none;

    -webkit-box-shadow: none;

    box-shadow: none;

    -o-transition: all .3s;

    -moz-transition: all .3s;

    -webkit-transition: all .3s;

    -ms-transition: all .3s;

    transition: all .3s;

}

.form-control {

    display: block;

    width: 100%;

    height: 34px;

    padding: 6px 12px;

    font-size: 12px !important;

    line-height: 1.42857143;

    color: #888;

    background-color: #fff;

    background-image: none;

    border: 1px solid #ccc;

    border-radius: 4px;

    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);

    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);

    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;

    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;

    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;

}

button.btn.btn-submit, button.btn.btn-submit:focus, button.btn.btn-submit:active:focus, button.btn.btn-submit.active:focus {

    background: #bc6fad !important;

}

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {

    position: absolute;

    margin-top: 4px\9;

    margin-left: -20px;

    margin-top: 10px !important;

}

.help-tip {

    position: absolute;

    top: 8px;

    right: -2px;

    text-align: center;

    background-color: #BCDBEA;

    border-radius: 50%;

    width: 24px;

    height: 24px;

    font-size: 14px;

    line-height: 26px;

    cursor: default;

}

.help-tip:before {

	content: '?';

	font-weight: bold;

	color: #fff;

}

.help-tip:hover p {

	display: block;

	transform-origin: 100% 0%;

	-webkit-animation: fadeIn 0.3s ease-in-out;

	animation: fadeIn 0.3s ease-in-out;

}

.help-tip p {

	display: none;

	text-align: left;

	background-color: #1E2021;

	padding: 20px;

	width: 300px;

	position: absolute;

	border-radius: 3px;

	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);

	right: -4px;

	color: #FFF;

	z-index: 1;

	font-size: 13px;

	line-height: 1.4;

}

.help-tip p:before {

	position: absolute;

	content: '';

	width: 0;

	height: 0;

	border: 6px solid transparent;

	border-bottom-color: #1E2021;

	right: 10px;

	top: -12px;

}

.help-tip p:after {

	width: 100%;

	height: 40px;

	content: '';

	position: absolute;

	top: -40px;

	left: 0;

}

 @-webkit-keyframes fadeIn {

 0% {

 opacity:0;

 transform: scale(0.6);

}

 100% {

 opacity:100%;

 transform: scale(1);

}

}

 @keyframes fadeIn {

 0% {

opacity:0;

}

 100% {

opacity:100%;

}

}

/***** Media queries *****/

@media (min-width: 992px) and (max-width: 1199px) {

}



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

}



@media (max-width: 767px) {

.navbar {

	padding-top: 0;

}

.navbar.navbar-no-bg {

	background: #333;

	background: rgba(51, 51, 51, 0.9);

}

.navbar-brand {

	height: 60px;

	margin-left: 15px;

}

.navbar-collapse {

	border: 0;

}

.navbar-toggle {

	margin-top: 12px;

}

.top-content {

	padding: 40px 0 110px 0;

}

}



@media (max-width: 415px) {

h1, h2 {

	font-size: 32px;

}

.f1 {

	padding-bottom: 20px;

}

.f1-buttons button {

	margin-bottom: 5px;

}

}



/* Retina-ize images/icons */







@media  only screen and (-webkit-min-device-pixel-ratio: 2),  only screen and ( min--moz-device-pixel-ratio: 2),  only screen and ( -o-min-device-pixel-ratio: 2/1),  only screen and ( min-device-pixel-ratio: 2),  only screen and ( min-resolution: 192dpi),  only screen and ( min-resolution: 2dppx) {

/* logo */



.navbar-brand {

	background-image: url(../img/logo@2x.png) !important;

	background-repeat: no-repeat !important;

	background-size: 162px 36px !important;

}

}