input {
    border-radius: 0;
	border: 1px solid #c5c5c5;
}.linksize{font-size:10px;}html, body {
    overflow-x: hidden;
}
@font-face {
	font-family: OpenSans;
	src: url(OpenSans-Regular.ttf) format("opentype");
}

@font-face {
  font-family: OpenSans;
  src: url(OpenSans-Bold.ttf) format("opentype");
  font-weight:bold;
}

p.team{
	text-align:left;/*right*/
	font-weight:bolder;

}@charset "utf-8";
/* CSS Document */

.modal-dialog {
    width: 80%;
	font-family: OpenSans;
}
.progress_div{
     position: absolute;
    /* background-color: #bde085; */
    height: 12px;
    top: -21px;
    right: 54px;/*left*/
    width: 400%; 
    /* direction: ltr; */
    /* box-shadow: 0px 5px 10px #888888; */
    /* opacity: 0.95; */
    /* z-index: 200; */
	font-family: OpenSans;
}

.outer_div .progressbar 
{
	float:right;/*left*/
	position:absolute;
	right:50px;/*left*/
	bottom:0px;
	top:40px;
	color:transparent;
	font-family: OpenSans;
}

.progressbarCard
{
	float:left;/*right*/
	/* top:40px; */
	width:35%;
	height:12px;
	font-family: OpenSans;
}


.progressValue
{
	font-size: 16px;
    color: white;
    position: relative;
    margin-right: 15px;/*left*/
    margin-bottom: -10px;
    bottom: 3px;
	font-family: OpenSans;
}



.progressbarCard .panel
{
	border:none;
	border-radius:0px;
	height:12px;
	margin-top:4px;
	font-family: OpenSans;
}

.per
{
	position:relative;
	float:right;/*left*/
	margin-right:236px;/*left*/
	font-size:16px;
	margin-top:12px;
	font-family: OpenSans;
	
}


progress[value] {
-webkit-appearance: none;
appearance: none;
width: 100%;
height: 100%;
font-family: OpenSans;
}

.progressbar-color {
/*background-color: #FF931E; */
transition: 2s ease;
font-family: OpenSans;
}



.progressbar-color::-webkit-progress-value {
background-color:#FF931E;
transition: 400ms ease;
font-family: OpenSans;
}

.progressbar-color::-moz-progress-bar {
background-color:#FF931E; 
transition: 400ms ease;
font-family: OpenSans;
}

/* All good till now. Now we'll style the background */
progress::-webkit-progress-bar {
background: #eee;
border-radius: 0px;
padding: 0px;
box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.2);font-family: OpenSans;
}



#section1 {
	 padding-top:220px;
	 background-color: #FFF;
	 left:0;/*right*/font-family: OpenSans;
}

.self-assessment-link
{
	font-size:16px;
	float:left;/*right*/
	position:relative;
	margin-top:-10px;
	font-weight:bold;
	top:-12px;font-family: OpenSans;
}

.self-assessment-link:hover
{
	color:#FF931E;font-family: OpenSans;
}

.self-assessment-link .glyphicon 
{
	font-size:25px;
	color:#9FD14F;
	position:relative;
	left:0px;/*right*/
	padding-right:10px;/*left*/
	top:8px;
}

.self-assessment-link .glyphicon:hover
{
	color:#FF931E;
}

.glyphicon-chevron-right
{
	top:0px;
	left:10px;/*right*/
}
.glyphicon-chevron-left
{
	top:0px;
	left:10px;
}

.glyphicon-text-background
{
	color:#9FD14F;
}



button span .glyphicon-circle-arrow-right/*left*/
{
	float:left;/*right*/
	padding:3px;
}

.main-header
{
	font-weight: bold;
	left:0;/*right*/
	color: black;

	position: relative;
	font-size:20px;
	padding-left:30px;/*right*/
	margin-left:-30px;/*right*/
	margin-top:30px;
	font-family: OpenSans;
}

.main-header:before {
	position: absolute;
	content: "";
	vertical-align:middle;
	width: 20px;
	height:30px;
	background: #FF931E;
	left:0;/*right*/
	top: 0;
	bottom: 5;font-family: OpenSans;
}



/*zoom configuration*/
.demo .zoomer_wrapper { height:400px; overflow: hidden; width:100%;font-family: OpenSans;}



#section2 {
	background-color: #FFF;
	direction:ltr;font-family: OpenSans;
}
	
#maincontent
	{
		pointer-events:auto;
		left:0;/*right*/font-family: OpenSans;
	}
	
	
mark {
  background: #ff0;
  color: #000;font-family: OpenSans;
  
}


#section3 {
	background-color: #FFF;
	direction:ltr;font-family: OpenSans;
}

#section4 {
	background-color: #FFF;
	direction:ltr;font-family: OpenSans;
}

html
{
font-family: OpenSans;
		
}
	
	
body
{
	/*padding: 15px;*/
	background: #fff;
	font-family: OpenSans;
}
	
p
{
	font-size:14px;
	color:black;
	font-family: OpenSans;
	line-height:27px;
	/*text-align:left;/*justify*/
	text-justify: inter-word;
}

.limit {  
	text-overflow: ellipsis;
	text-align:left;/*justify*/
	text-justify: inter-word;
    line-height: 25px;
    height: 170px;
    overflow: hidden;

  }


.menu-button
{
	float:left;/*right*/
	height:50px;
	font-size:large;
	font-size:large;
	align:middle;
	padding:15px;
	color:white;	
	
}

.menu-button:hover
{
	color:#FF931E;
}

.menu-button:visited
{
	color:white;
}

div 
{
	text-align:left;/*justify*/
	text-justify: inter-word;
	
}


div p:last-chiled
{
	padding-bottom:0px;
}


.image-content img
{
	margin-top:7px;
	padding-bottom:15px;
}

	
.outer_div{
	position:fixed;
	background-color:#bde085;
	height:50px;
	top:0;
	left: 0;/*right*/
	width: 100%;
	direction : ltr;
	box-shadow: 0px 5px 10px #888888;
	opacity: 0.95;
	z-index:200;
}


.outer_div{
	position:fixed;
	background-color:#bde085;
	height:50px;
	top:0;
	left: 0;/*right*/
	width: 100%;
	direction : ltr;
	box-shadow: 0px 5px 10px #888888;
	opacity: 0.95;
	z-index:200;
}



.outer_div .title-section div{
	float:left;/*right*/
}

.outer_div .title-section .popover
{
	width:270px;
	height:200px;
}
.outer_div .title-section .popover-title{
	width:266px;
}

.outer_div  .title-section  .title
{
	position:relative;
	font-size:21px;
	font-weight:bold;
	font-family: OpenSans;
	padding-top:9px;
}

.outer_div  .title-section  .title a
{
	color:black;
	text-decoration:none;
}

.outer_div  .title-section  .title a:hover
{
	text-decoration:none;
	/*color:#FF931E;*/
}


.outer_div .title-section .section-header
{
	position:relative;
	font-size:14px;
	font-weight:bold;
	font-family: OpenSans;
	padding-top:15px;
	margin-left:5px;/*right*/
}

.glyphicon-menu-right/*left*/
{
	font-size:14px;
	margin-left:5px;/*right*/
	top:18px;
	color:#FF931E;
	position:relative;
}
@media only screen and (max-width: 850px) {
	.modal-dialog{
	width:auto;
}}
@media only screen and (max-width: 570px) {
	
	#title-id
	{
		color:white;
	}
	
	#title-id:hover
	{
		color:#FF931E;
	}
}



.header_image_background 
{
	position: fixed;
	z-index:199;
	top: 0px;
	left:0;/*right*/
	width:100%;
	height: 200px;
	opacity:1;
	overflow:hidden;
	
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	-o-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	
	-webkit-transition-property: -webkit-transform ease-out;
	-moz-transition-property: -moz-transform ease-out;
	transition-property: transform ease-out;
	-o-transition-property: -o-transition ease-out;

	
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	transition-duration: 1s;
	-o-transition-duration:1s;
}


		.thecard 
		{
            box-shadow: 0 1px 30px rgba(0,0,0,.2);
            background-color: #fff;
            transition: 400ms ease;
            text-align: right;/*left*/
			max-height:430px;
		}
        .thecard:hover{
            box-shadow: 0 10px 50px rgba(0,0,0,.7);
        }
        .thecard:hover .card-outmore {
            background: #FF931E;
            color: #fff;
        }
		
		.thecard:hover .card-outmore .progress-color{
				background-color:#9FD14F;
        }
		
		.thecard:hover .card-outmore .progressbar-color::-webkit-progress-value {
			background-color:#9FD14F;
			}

		.thecard:hover .card-outmore .progressbar-color::-moz-progress-bar {
		background-color:#9FD14F; 

		}
		
		
		
        .thecard a{
            color: currentColor;
            text-decoration: none;
        }
        .card-img {
            display: block;
            max-height: 180px;
            overflow: hidden;
        }
        .card-img img {
            display: block;
            width:100%;
        }
		.card-caption 
		{
		max-height:190px;
		}

        .card-caption p{
            position: relative;
            padding-top:10px;
			padding-bottom:0px;
			padding-right:10px;/*left*/
			padding-left:10px;/*right*/
		}
		
		  .card-caption h3 {
            line-height: 1;
			font-size:16px;
			font-weight:bold;
			text-align:center;
			margin-top:10px;
			margin-bottom:0px;
			

        }
		
        .card-caption h1 {
            line-height: 1;
			font-size:15px;
			font-weight:bold;
			text-align:center;
			padding-right:10px;/*left*/
			padding-left:10px;/*right*/
			margin-top:5px;
			margin-bottom:0px;
			/* height: 50px; */

        }

        .card-outmore {
            padding: 10px 10px;
            border-top: 1px solid #e0e0e0;
            background: #9FD14F;
            color: #222;
            display: flex;
            transition: 400ms ease;
			
        }
        .card-outmore h5 {
            flex: 1;
			font-size:14px;
			text-align:left;/*right*/
			font-weight:bold;
			color:white;
        }
        .card-outmore i {
            padding: 1px 6px;
			color:white;
			font-size:18px;
        }


        span.date { font-size: 14px; }

        h5 { margin:0; }

        .thecard .like-btn {
            font-size: 18px;
            background: #9FD14F;
            color: #fff;
            padding: 15px 15px;
            border-radius: 50em;
            position: absolute;
            right: 20px;/*left*/
            top: 10px;
            box-shadow: 0 2px 1px rgba(0,0,0,.2);
            transition: 400ms ease;
        }
        .card-img + .card-caption > .like-btn{
            top: -15px;

        }

        .thecard .like-btn:hover {
            background: #FF931E;
            box-shadow: 0 4px 5px rgba(0,0,0,.3);
        }



.header-visible 
{
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	
}

.header-not-visible
{
	-webkit-transform: translate3d(0, -100%, 0);
	-moz-transform: translate3d(0, -100%, 0);
	-ms-transform: translate3d(0, -100%, 0);
	-o-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
	
}


.header:before {
	position: absolute;
	content: "";
	vertical-align:middle;
	margin-top:-3px;
	width: 15px;
	height:30px;
	background: #FF931E;
	left:0;/*right*/
	top: 0;
	bottom: 0;
}


.header {
	font-weight: bold;
	left:0;/*right*/
	color: black;
font-family: OpenSans;
	position: relative;
	font-size:18px;
	padding-left:30px;/*right*/
	margin-left:-30px;/*right*/
	margin-top:20px;
}

#share-content span
{
	font-size:20px;
}


li
{
font-family: OpenSans;
	font-size:14px;
	direction:ltr;
	line-height:27px;
	
}

.bullets{
   
   list-style-image: url('style-r/bullet.png');
}

ol, ul {
    margin-top: 0;
    margin-bottom: 5px;
}


.component-row
{
margin-top:15px; 
}
.row-ltr .col-md-2 
{
	float:left;/*right*/
}

.row-ltr .col-md-3  
{
	float:left;/*right*/
	
}

.row-ltr .col-md-4 
{
	float:left;/*right*/
}
.row-ltr .col-md-5 
{
	float:left;/*right*/
}

.row-ltr .col-md-6 
{
	float:left;/*right*/
}

.row-ltr .col-md-7 
{
	float:left;/*right*/
}

.row-ltr .col-md-8 
{
	float:left;/*right*/
}

.row-ltr .col-md-9 
{
	float:left;/*right*/
}

.row-ltr .col-md-10 
{
	float:left;/*right*/
}


.panel-heading h4 a
{
	font-size:16px;
font-family: OpenSans;
	font-weight:bold;
	text-decoration:none;
	color:black;
	position:relative;
	bottom:10px;
	margin-left:-15px;/*right*/
}

.panel-title
{
	margin-top:5px;
	
}

h3.popover-title
{
	text-align:left;/*right*/
}

.panel-heading h4 span
{
	font-size:25px;
	color:#9FD14F;
	position:relative;
	left:0px;/*right*/
}

span.glyphicon.resources
{
	color:rgba(77,77,77,0.6);
}


.glyphicon-minus-sign
{
	cursor: pointer;
}

.glyphicon-plus-sign
{
	cursor: pointer;
}


.panel-heading h4 span:hover
{
	color:#FF931E;
}

.panel-group .panel-default
{
	 border-color: none;
}

.panel-group .panel-default>.panel-heading {
	color:black;
    background-color:transparent;
    border-color: #FFF;
	padding-left: 0;/*right*/
}

.panel-group .panel-heading {
    padding-top:0px;
	padding-bottom:0px;
    border-radius:0px;
}
.panel-body{
	padding:0px;
}
.panel-group .panel {
    margin-bottom: 0px;
    background-color: transparent;
    border: none;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: 0 0px 0px rgba(0,0,0,0);
}



a {
  color: #FF931E;
  text-decoration: none;
}

.sp-panel a
{
	color: black;
    text-decoration: none;
}

.sp-panel a:hover
{
	color: #FF931E;
    text-decoration: none;
}

.modal-content {
   
   border-radius: 0px; 
}

h4.modal-title
{
	font-size:16px;
	font-weight:bold;
}

.close {
    float: right;/*left*/
    font-size: 100px;
    font-weight: 700;
    line-height: 1;
    opacity: 1;
	
}

.close:hover
{
	color:#FF931E;
	opacity:1;
}

button.close {
    -webkit-appearance: none;
    cursor: pointer;
    background: 0 0;
    border: 0;
    font-size: 30px;
	text-shadow:none; 
	font-family:serif;
	
}

.modal-header .close {
    margin-top: -5px;
}


.nav-a
{
	font-size:15px;
	font-weight:normal;
	
}


footer
{
	position:absolute;
	left:0px;/*right*/
	width:100%;
	height:80px;
	background:#7F7F7F;
	border-top:solid 10px;
	border-color: #9FD14F;
}


footer .qoulogo
{
	float:left;/*right*/
	left:15px;/*right*/
	position:absolute;
	bottom:15px;
	cursor: pointer;
	
}


footer .qoulogo img
{
	
		height:43px;
		width:43px;
}

footer .description
{
	color:white;
	float:left;/*right*/
	position:absolute;
	bottom:15px;
	left:65px;/*right*/
font-family: OpenSans;
	font-size:12px;
}

footer .qr-container span
{
	position:relative;
	font-size:22px;
	color:white;
	float:right;/*left*/
	right:7px;/*left*/
	top:-1px;
	
	
}

footer .qr-container 
{
	float:right;/*left*/
	position:absolute;
	bottom:26px;
	right:58px;/*left*/
	width:40px;
	border-right: 1px solid white;/*left*/
	border-left: 1px solid white;/*right*/
}

footer .qr img
{
	float:right;/*left*/
	position:absolute;
	bottom:15px;
	right:10px;/*left*/
	width:85px;
}

footer .version .popover
{
	width:160px;
	height:180px;
	left:-125px;/*right*/
	margin-top:-23px;
}

footer .qr-container .popover
{
	width:110px;
	height:160px;
	left:-45px;/*right*/
}


footer .version
{
	float:right;/*left*/
	position:absolute;
	right:20px;/*left*/
	bottom:20px;
	cursor: pointer;
}


footer .version span
{
	font-size:25px;
	color:white;
}


footer .version span:hover
{
	font-size:25px;
	color:white;
}



footer .followus
{
	float:right;/*left*/
	position:absolute;
	right:110px;/*left*/
	bottom:20px;
}

	
footer .followus span:hover
{
	color:#FF931E;
	text-bottom:none;
}	

footer .followus span
{
	    position: relative;
    font-size: 22px;
    top: -2px;
    color: white;
    left: -64px;
}

footer .followus-description 
{
    color: white;
    float: right;
    position: absolute;
    bottom: 5px;
    right: -16px;
    font-family: OpenSans;
    font-size: 14px;
    cursor: normal;
	width:74px;
}



/*phone container*/

footer .support-container span
{
position:relative;
	font-size:22px;
	color:white;
	float:right;
	right:80px;
	top:-1px;
	
}

footer .support-container
{
	float:right;
	position:absolute;
	bottom:26px;
	right:204px;
	width:40px;
	border-right: 1px solid white;
}


footer .support-container .popover
{
	width:200px;
	height:150px;
	right:-90px;
}

footer .support-description
{
	color:white;
	float:right;
	position:absolute;
	left:-35px;
	font-family:OpenSans;
	font-size:14px;
	cursor: normal;
	width:50px;
	top:3px;
}

/*end of phone container*/




@media only screen and (max-width: 430px) {
footer
{
	height:160px;
}	
	
footer .qoulogo
{
	bottom:80px;
}

footer .description
{
	bottom:80px;
}

.progress_div {
    position: fixed;
    /* background-color: #bde085; */
    height: 10px;
    top: 48px;
    left: 0;/*right*/
    right: 0px;/*left*/
    width: 100%;
    direction: ltr;
    box-shadow: 0px 5px 10px #888888;
    opacity: 0.95;
    z-index: 150;
}

.per {
    position: relative;
    float:right;/*left*/
    margin-right: 100px;/*left*/
    font-size: 16px;
    margin-top: 12px;
	
	

    /*
	over progress
    margin-left: 1px;
    font-size: 16pt;
    margin-top: 41px;
    z-index: 205;	
	*/
}
}



.popover 
{
	border-radius: 0px; 
}



.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    background-color: #7F7F7F;
	color:white;
    border-top: 5px solid #9FD14F;
    border-radius: 0px 0px 0 0;
font-family: OpenSans;
	font-size:15px;
	font-weight:bold;
}

.popover-header button.close{
	-webkit-appearance: none;
    cursor: pointer;
    background: 0 0;
    border: 0;
    font-size: 25px;
    font-weight: normal;
    margin-top: 5px;
    margin-right: 5px;/*left*/
    color: white;
}


.popover-header button.close:hover{
	color:#FF931E;
}

.popover-content
{
	padding-left:25px;
font-family: OpenSans;
	font-size:14px;
}



.outer_div .share .icon-share2
{
	float:right;/*left*/
	position:absolute;
	right:20px;/*left*/
	bottom:15px;
	color: #FFF;
	font-size: 20px;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	cursor: pointer;
}


.outer_div .share .icon-share2:hover
{
	color:#FF931E;
}

.outer_div .share 
{
	float:right;/*left*/
	position:absolute;
	right:50px;/*left*/
	bottom:0px;
	top:40px;
	color:transparent;
}

.outer_div .panel {
	margin-bottom:40px;
	margin-right:30px;/*left*/
    background-color: transparent;
    border: 0px solid transparent;
    border-radius: 0px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.outer_div .panel-heading {
	 padding: 0px 0px; 
     border-bottom: 1px solid transparent; 
     border-top-right-radius: 3px; /*left*/
     border-top-left-radius: 3px; /*right*/
     background-color: transparent; 
}



.popover-content .icon-google-plus
{
	cursor:pointer;
}

.popover-content .icon-google-plus:hover
{
	color:#FF931E;
}

.popover-content .icon-facebook
{
	cursor:pointer;
}

.popover-content .icon-facebook:hover
{
	color:#FF931E;
}

.popover-content .icon-twitter
{
	cursor:pointer;
}

.popover-content .icon-twitter:hover
{
	color:#FF931E;
}

.container-arrow-search
{
	position: fixed;
    z-index: 9999;
    top: 17px;
    right: 25px;/*left*/
    display:none;
}
.sb-icon-search-close {
    z-index: 999;
    width: 55px;
    height: 50px;
    display: block;
    position: absolute;
    left: 0px;
    top: 0;
    padding: 0;
    margin: 0;
    line-height: 52px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    background: #da6d0d;
    color: #fff;
}
  
  
.container-arrow-search .glyphicon-chevron-right:hover {/*left*/
    color: #FF931E;
    cursor: pointer;
}
  
.container-arrow-search .glyphicon-chevron-left:hover {/*right*/
    color: #FF931E;
    cursor: pointer;
}
.container-arrow-search a:hover {

        text-decoration: none;
}