﻿@media screen and (max-width: 776px) {
	.mobile-width-responsive {
		width: 100%;
	}

}
@media screen and (max-width: 350px) {
	.padding-removed {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}
	.responsive-text {
		font-size: calc(0.5rem + 0.2vw);
		white-space: break-spaces !important;
	}
}

@media screen and (min-width: 300px) {
	.responsive-text {
		font-size: calc(0.5rem + 0.5vw) !important;
		white-space: break-spaces !important;
	}
	.responsive-padding{
		padding-left:10px;
		padding-right:10px;
	}
}
@media screen and (min-width: 400px) {
	.responsive-text {
		font-size: calc(0.6rem + 0.5vw) !important;
		white-space: break-spaces !important;
	}
	.responsive-padding {
		padding-right: 15px;
		padding-left: 15px;
	}
}
#rc-anchor-container .rc-anchor-normal {
	width: 100% !important;
}
#divMainContent{
	padding-bottom:1% !important;
}
#ReferralForm {
	position: relative;
	z-index: 0 !important;
	overflow-x: hidden !important;
	margin: auto !important;
	height: 100vh;
}

.btn-cons{
	min-width:fit-content !important;
}
.responsive-text {
	white-space: break-spaces !important;
}

.items-center-custom {
	align-items: center;
	display: flex;
}
.justify-center-custom {
	justify-content: space-between;
}
.justify-center-around {
	justify-content: space-around;
}
.d-flex-center {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.selectize-control .selectize-input .item {
	max-width: 85% !important;
	width: fit-content !important;
}
#lblNotEligible {
	word-break: break-word;
}
.rc-anchor-normal .rc-anchor-pt {
	right: 33px !important;
}
#rc-anchor-container {
	width: 100% !important;
}

.greengrey-toggle-new .btn-primary
{
	background: #454545 !important;
	border-right: 1px solid #6a6a6a !important;
}
.greengrey-toggle-new .btn-primary:last-child
{
	border-right: 0px solid #6a6a6a !important;
}

.greengrey-toggle-new .btn-primary:nth-child(1).active
{
	background: rgba(255,0,0,1) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(2).active
{
	background: rgba(255,0,0,.70) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(3).active
{
	background: rgba(255,0,0,.55) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(4).active
{
	background: rgba(255,0,0,.35) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(5).active
{
	background: rgba(255,255,0,.30) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(6).active
{
	background: rgba(255,255,0,.50) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(7).active
{
	background: rgba(255,255,0,1) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(8).active
{
	background: rgba(0,255,0,.30) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(9).active
{
	background: rgba(0,255,0,.50) !important;
	color: #000 !important;
	font-weight: bold !important;
}

.greengrey-toggle-new .btn-primary:nth-child(10).active
{
	background: rgba(0,255,0,1) !important;
	color: #000 !important;
	font-weight: bold !important;
}
.greengrey-toggle-new .btn-primary:nth-child(11).active
{
	background: rgba(0,255,240,1) !important;
	color: #000 !important;
	font-weight: bold !important;
}
@media screen and (max-width: 768px)
{
    .QuestionareAnswerLenthOnMobileview
    {
        width: 100% !important;
        float: left !important;
        margin-top: 1% !important;
    }
}

/* Radio Button*/
.switch_RadioBtn {
	position: relative;
	display: block;
	vertical-align: top;
	width: 85px;
	height: 30px;
	padding: 3px;
	margin: 0 10px 10px 0;
	background: linear-gradient(to bottom, #eeeeee, #FFFFFF 25px);
	background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF 25px);
	border-radius: 18px;
	box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
	cursor: pointer;
}

.switch_RadioBtn-input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}

.switch_RadioBtn-label {
	position: relative;
	display: block;
	height: inherit;
	font-size: 10px;
	text-transform: uppercase;
	background: #eceeef;
	border-radius: inherit;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
}

	.switch_RadioBtn-label:before, .switch_RadioBtn-label:after {
		position: absolute;
		top: 50%;
		margin-top: -.5em;
		line-height: 1;
		-webkit-transition: inherit;
		-moz-transition: inherit;
		-o-transition: inherit;
		transition: inherit;
	}

	.switch_RadioBtn-label:before {
		content: attr(data-off);
		right: 11px;
		color: #aaaaaa;
		text-shadow: 0 1px rgba(255, 255, 255, 0.5);
	}

	.switch_RadioBtn-label:after {
		content: attr(data-on);
		left: 11px;
		color: #FFFFFF;
		text-shadow: 0 1px rgba(0, 0, 0, 0.2);
		opacity: 0;
	}

.switch_RadioBtn-input:checked ~ .switch_RadioBtn-label {
	background: #0090d9;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}

	.switch_RadioBtn-input:checked ~ .switch_RadioBtn-label:before {
		opacity: 0;
	}

	.switch_RadioBtn-input:checked ~ .switch_RadioBtn-label:after {
		opacity: 1;
	}

.switch_RadioBtn-handle {
	position: absolute;
	top: 4px;
	left: 4px;
	width: 28px;
	height: 28px;
	background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
	background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);
	border-radius: 100%;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

	.switch_RadioBtn-handle:before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -6px 0 0 -6px;
		width: 12px;
		height: 12px;
		background: linear-gradient(to bottom, #eeeeee, #FFFFFF);
		background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);
		border-radius: 6px;
		box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
	}

.switch_RadioBtn-input:checked ~ .switch_RadioBtn-handle {
	left: 53px;
	box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}
/*END*/

.canvasdraw {
	border: 2px solid #000;
	border-radius: 4px;
	background-color: #fff;
	width: 100%;
	max-width: 300px; 
	height: auto; 
}

.alert-box {
	display: none;
	padding: 10px 15px;
	margin-top: 10px;
	border-radius: 4px;
	font-size: 14px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.alert-success {
	background-color: #dff0d8;
	color: #3c763d;
	border: 1px solid #d6e9c6;
}

.alert-error {
	background-color: #f2dede;
	color: #a94442;
	border: 1px solid #ebccd1;
}

.checkboxInLargeSize label:before {
	width: 25px !important;
	height: 25px !important;
}
