/*
 1.) Media Query for Desktop
 ===============================*/
@media screen and (min-width: 768px) {
}
/*
 2.) Media Query for Tablet
 ===============================*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.element-field .btn-block-wrap {
		padding-left: 50px;
	}
	.three-block-content.top-height-block {
		min-height: 602px;
	}
	.medium-height-block {
		min-height: 335px;
	}
	.top-height-block {
		min-height: 655px;
	}
	.result-section .btn-box, .btn-block-space .btn-box {
		margin: 0 19px;
	}
	.process-step ul li:first-child .tooltip_popup{
		left:-33px;
		right: auto;
	}
	
.process-step ul li:first-child .tooltip_popup:before {
    left: 10%;
    right: auto;
}
	.process-step ul li:last-child .tooltip_popup{
		left:auto;
		right: -33px;
	}
	.process-step ul li:last-child .tooltip_popup:before {
    right: 10%;
    left: auto;
}
}
/*
 3.) Media Query for mobile
 ===============================*/
@media only screen and (max-width: 767px) {
	h1 {
		font-size: 3.4em;
	}
	h2 {
		font-size: 2.8em;
	}
	.header {
		padding-bottom: 7px;
	}
	.logo {
		padding-top: 10px;
	}
	.profile-setting {
		padding-top: 12px;
	}
	.profile-login .member-name {
		font-size: 1.2em;
	}
	.profile-login span {
		font-size: 0.9em;
	}
	.messanger-list .profile-login .member-name {
		font-size: 1.4em;
	}
	.messanger-list .profile-login span {
		font-size: 1.1em;
	}
	.inner-banner, .banner-height {
		padding-top: 0;
	}
	.inner-banner .container {
		height: 100vh;
		height: calc(100vh - 63px);
		height: -webkit-calc(100vh - 63px);
		display: table;
		width: 100%;
		min-height: 320px;
	}
	.inner-banner .row {
		display: table-cell;
		vertical-align: middle;
		width: 100%;
	}
	.tutor-banner, .banner-height {
		min-height: 0;
	}
	.container {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
	.header .avatar-pic {
		float: right;
	}
	.header .profile-login {
		padding-left: 0;
		padding-right: 14px;
	}
	.profile-pic .full-name {
		font-size: 1.4em;
	}
	.profile-pic .designation-name {
		font-size: 1.1em;
	}
	.group-pic {
		width: auto;
	}
	.process-step {
		padding-left: 0;
	}
	.messanger-list .check-box {
		display: none;
	}
	.message-group {
		padding-left: 0;
	}
	.media-block {
		float: none;
		width: auto;
	}
	.btn {
		font-size: 1.51em;
	}
	.media {
		padding-bottom: 26px;
	}
	.message-time {
		float: none;
		width: 100%;
		text-align: right;
	}
	.remove-message {
		display: none;
	}
	.form-box .md-btn {
		width: 57px;
		height: 33px;
		line-height: 20px;
		font-size: 0.9em;
	}
	.text-field {
		height: 33px;
		padding-left: 10px;
		padding-top: 5px;
	}
	.text-box {
		margin-right: 7px;
		width: calc(100% - 65px);
		width: -webkit-calc(100% - 65px);
	}
	.banner-btn-wrap {
		margin-bottom: 70px;
	}
	.form-box i {
		display: none;
	}
	.value-graph {
		padding-left: 0;
	}
	.line-group {
		padding-right: 0;
	}
	.certificate-block {
		width: 80%;
	}
	.modal-box {
		width: 92%;
	}
	.process-heading {
		padding-left: 0;
		text-align: center;
	}
	.process-step li {
		width: 12.2%;
	}
	.process-step li {
		float: none;
		display: inline-block;
	}
	.process-step li:after {
		width: calc(100% - 31px);
		width: -webkit-calc(100% - 31px);
	}
	.tutor-pic {
		width: 100px;
		height: 100px;
	}
	.tutor-pic:after, .tutor-pic:before {
		width: 65px;
		height: 65px;
		top: 18px;
	}
	.tutor-pic:before {
		right: 65px;
	}
	.tutor-pic:after {
		left: 65px;
	}
	.tutor-section .profile-pic {
		margin: 15px auto 54px;
		float: none;
	}
	.tutor-section {
		padding: 47px 0 73px;
	}
	.message-section {
		padding-top: 47px;
	}
	.heading {
		text-align: center;
	}
	.messanger-list .avatar-pic {
		margin-left: 22px;
	}
	.comment-box .media img {
		width: 41px;
	}
	.messanger-list {
		margin-bottom: 30px;
	}
	.footer {
		margin-top: 43px;
		padding: 44px 10px;
	}
	.notice-text {
		padding-left: 12px;
	}
	.text-wrap .rank_position {
		margin-right: 0;
	}
	.tooltip_popup {
		width: 270px;
		left: -33px;
	}
	.tooltip_popup:before {
		left: 14%;
		right: auto;
	}
	.input-block .md-width {
		width: 100%;
		padding-right: 0;
	}
	.input-block .input-wrap .input-field {
		width: 100%;
		float: none;
	}
	.input-block .pr {
		padding-right: 0;
	}
	.input-block .pl {
		padding-left: 0;
	}
	.btn-block-wrap .btn-box:last-child {
		margin-left: 0;
		margin-top: 12px;
	}
	.prework-block {
		padding: 50px 0 60px;
	}
	.form-field {
		padding-top: 50px;
	}
	.form-field .input-block {
		margin-bottom: 17px;
	}
	.photo-wrap {
		float: none;
		margin: 0 auto;
		padding-right: 0;
		text-align: center;
	}
	.photo-wrap h2 {
		padding-left: 0;
	}
	.form-input {
		margin-top: 30px;
	}
	.header-danger {
		padding: 54px 0 40px;
	}
	.btn-block-wrap .btn-box, .btn-block-wrap .btn-box:last-child {
		display: block;
		margin: 0 auto 15px;
	}
	.section-field .input-field label {
		display: table-cell;
		vertical-align: middle;
		line-height: 1.5;
	}
	.section-field .input-field label {
		font-size: 1.5em;
		padding-left: 100px;
	}
	.section-field .input-field:after {
		left: 80px;
	}
	.element-field .btn-block-wrap {
		padding-left: 0;
	}
	.btn-box {
		width: 280px;
	}
	.action-plan-block, .action-plan-block-right {
		margin-left: 0;
		margin-right: 0;
	}
	.sprite-arrow {
		position: static;
		transform: translate(0,0);
		-webkit-transform: translate(0 ,0);
		background-position: 0 -276px;
		margin: 0 auto 15px;
	}
	.header-default h3, .action-plan-content h3 {
		font-size: 1.8em;
		text-align: center;
	}
	.action-plan-block h4 {
		font-size: 1.4em;
	}
	.action-plan-block p {
		font-size: 1.2em;
	}
	.action-plan-block {
		margin-bottom: 15px;
	}
	.action-plan-content {
		padding-top: 21px;
	}
	.action-plan-block, .three-block-content.top-height-block {
		min-height: 0;
		padding: 6px 39px 2px;
	}
	.action-plan-content .plan-row, .action-plan-content .top-plan-row {
		margin-bottom: 10px;
		border-bottom: 1px solid #798c93;
		padding-bottom: 20px;
	}
	.action-plan-block h4 {
		margin-bottom: 10px;
	}
	.action-plan-content {
		padding-bottom: 20px;
	}
	.bottom-space {
		padding-top: 43px;
	}
	.chart-wrap, .result_face-block {
		margin-bottom: 10px;
	}
	.btn-block-wrap .btn-box, .btn-block-wrap .btn-box:last-child, .result-section .btn-block-wrap .btn-box:last-child, .btn-block-space .btn-box:last-child {
		display: block;
		margin: 0 auto 10px;
	}
	.login-block {
		width: 100%;
		max-width: 400px;
	}
	.tooltip_popup {
		width: 286px;
		left:0;
		right: 0;
	}
	.tooltip_popup:before {
		left: 14%;
		right: auto;
	}
	

	.process-step ul li .tooltip_popup,
	.process-step ul li .tooltip_popup{
		left:auto;
		right: -33px;
	}
	
	.process-step ul li:nth-child(1) .tooltip_popup:before {
    right: auto;
    left: 13%;
}
.process-step ul li:nth-child(4) .tooltip_popup:before{
	  right: auto;
    left: 61%;
}
.process-step ul li:nth-child(5) .tooltip_popup:before{
	  right: auto;
    left: 64%;
}
.process-step ul li:nth-child(6) .tooltip_popup:before{
	  right: auto;
    left: 64%;
}
.process-step ul li:nth-child(7) .tooltip_popup:before{
	  right: auto;
    left: 65%;
}
.process-step ul li:last-child .tooltip_popup:before{
	  right: auto;
    left: 83%;
}
	.process-step ul li:first-child .tooltip_popup,
	.process-step ul li:nth-child(2) .tooltip_popup,
	.process-step ul li:nth-child(3) .tooltip_popup{
		left:-33px;
		right: auto;
	}
	
/*.process-step ul li:first-child .tooltip_popup:before,
.process-step ul li:nth-child(2) .tooltip_popup:before,
.process-step ul li:nth-child(3) .tooltip_popup:before {
    left: 10%;
    right: auto;
}*/
}
/*------------------Mobile  css -----------*/
@media only screen and (max-width: 480px) {
	.certificate-block {
		margin-top: 43px;
	}
	.process-step li{
		position: static;
	}
	
	.process-step ul li .tooltip_popup
	{
		left:0 !important;
		right: 0 !important;
	}
		.tooltip_popup{
			top: 80px;
			width: 100%;
		}
	.tooltip_popup.open_tooltip{
		top: 60px;
	}
	.process-step ul li .tooltip_popup:before
	 {
  display: none;
}
.top-arrow{
	right: auto !important;
	display: block;
}
}