@media only screen and (min-width: 768px) {
	.login-logo {
		max-width: 560px;
	}

    .user-img {
        border-radius: 50%;
        border: 1px solid #dbdcde;
    }

	.edit-icon {
		position: absolute;
		right: 10px;
		bottom: -5px;
		cursor: pointer;
	}

	.right-arrow img {
		width: 60%;
	}

	.right-arrow:before {
		position: absolute;
		top: 0px;
		right: 42px;
		content: '';
		display: inline-block;
		height: 43px;
		width: 1px;
		background-color: #d5d5d5;
	}

	.headTitle {
		font-size: 20px;
		font-weight: 700;
		color: var(--lochmara);
		font-family: 'ARIALBD';
	}

	.headSubTitle {
		font-family: 'ARIAL';
		font-size: 14px;
		font-weight: 400;
		color: var(--cello);
	}

	.setting-section {
		column-count: 2;
		display: block;
		column-gap: 50px;
	}

	.profile-item .setting-list {
		align-items: center;
		display: flex;
		padding: 25px 20px;
		cursor: default;
	}

	.setting-item .setting-list,
	.menu-list .setting-list {
		justify-content: space-between;
        align-items: center;
        display: inline-flex;
        width: 100%;
	}

	.setting-item .setting-list-center {
		justify-content: center;
	}


    .switch {
        position: relative;
        min-width: 70px;
        height: 38px;
        margin-left: 40px;
        margin-bottom: 25px;
    }
    
    .switch input {
        position: absolute;
        opacity: 0;
        width: 70px;
        height: 38px;
    }
    
    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgb(227 225 225);
        border-radius: 35px;
        box-shadow: inset rgb(255 255 255 / 70%) 0px 0px 1px 5px;
        -webkit-box-shadow: inset rgb(255 255 255 / 70%) 0px 0px 1px 5px;
        -moz-box-shadow: inset rgb(255 255 255 / 70%) 0px 0px 1px 5px;
        -ms-box-shadow:  inset rgb(255 255 255 / 70%) 0px 0px 1px 5px;
    }
    
    .slider:before {
        position: absolute;
        content: "";
        height: 32px;
        width: 32px;
        bottom: 0px;
        left: 0px;
        transform: translateX(3px);
        background: url('../images/switch.png') no-repeat;
        background-size: cover;
        transition: transform 0.4s, background 0.4s;
    }
    
    input:checked + .slider:before {
        transform: translateX(35px); /* Adjust based on your slider width */
        background: url('../images/active-switch.png') no-repeat;
        background-size: cover;
    }

	.common-list {
		position: relative;
		width: 100%;
		display: inline-flex;
		font-family: 'Helveticaneue';
		font-size: 14px;
		padding: 10px 10px 10px 35px;
		margin-bottom: 25px;
	}

	.input-common-radius-box {
		box-shadow: inset var(--grey) 0px 2px 3px -1px;
		-webkit-box-shadow: inset var(--grey) 0px 2px 3px -1px;
		filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.20));
		border-radius: 20px;
	}

	.input-icon {
		position: relative;
		width: 100%;
	}

	.form-group {
		margin-bottom: 15px;
		display: flex;
	}

	.form-group input[type="text"],
	.form-group input[type="email"],
	.form-group input[type="password"],
	.form-group input[type="number"] {
		border: 0px solid transparent;
		text-align: left;
		padding: 10px 45px 10px 15px;
		margin: 0 auto;
	}

	/* For Chrome, Safari, Edge, Opera */
	input[type="number"]::-webkit-outer-spin-button,
	input[type="number"]::-webkit-inner-spin-button {
		-webkit-appearance: none;
		margin: 0;
	}

	/* For Firefox */
	input[type="number"] {
		-moz-appearance: textfield;
	}

	.form-group input[type="text"]:focus,
	.form-group input[type="email"]:focus,
	.form-group input[type="password"]:focus,
	.form-group input[type="number"]:focus,
	.form-group input[type="text"]:focus-visible,
	.form-group input[type="email"]:focus-visible,
	.form-group input[type="password"]:focus-visible,
	.form-group input[type="number"]:focus-visible {
		outline: none;
	}

	.form-group input[type="checkbox"] {
		display: none;
	}

	.form-group .checkbox-label {
		font-size: 14px;
		line-height: 1.2;
		font-family: 'Helveticaneue';
		color: var(--lochmara);
		padding-left: 45px;
		position: relative;
		margin: 20px 0 30px;
		cursor:pointer;
	}

	.form-group .checkbox-label a {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.form-group .checkbox-label a {
		color: var(--lochmara);
	}

	.form-group input::placeholder {
		color: var(--grey);
	}

	.form-group input[type="checkbox"]+label::before {
		content: '';
		width: 35px;
		height: 35px;
		background: url(../images/switch1.png) no-repeat;
		background-size: cover;
		position: absolute;
		left: 0;
		top: -5px;
	}

	.form-group input[type="checkbox"]:checked+label::before {
		background: url('../images/active-switch.png') no-repeat;
		background-size: cover;
	}

	.common-radius-box {
		box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
		background: linear-gradient(79deg, #FFF 0%, #EFEFEF 100%);
		border-radius: 30px;
		cursor: pointer;
	}

	.common-radius-box p {
		font-size: 14px;
		color: var(--white);
		margin-bottom: 0;
	}

	.common-radius-box.mp-pen {
		background: linear-gradient(265deg, #0088CE 4.35%, #2EB8FF 95.68%);
		display: flex;
		align-items: center;
		padding: 15px 30px;
	}

	.common-radius-box.grey-radius {
		background: linear-gradient(0deg, rgba(0, 59, 90, 0.60) 0%, rgba(0, 59, 90, 0.60) 100%), linear-gradient(79deg, #FFF 0%, #EFEFEF 100%);
	}

	.common-radius-box.white-radius {
		background: linear-gradient(79deg, #FFF 0%, #EFEFEF 100%);
	}

	.common-radius-box.small-radius-box {
		text-align: center;
		padding: 15px 5px;
		position: relative;
		height: 100%;
	}

	.desktop-layout h4.commonH4 {
		border-bottom: 1px solid #cdcdcd;
		padding: 28px 0;
		text-transform: uppercase;
	}

	/*login page*/
	.login-common-box {
		background: linear-gradient(139deg, #fff, #EFEFEF);
		margin: 25px 96px 50px;
		padding-bottom: 50px;
	}

	.login-common-box form {
		width: 450px;
		margin: 32px auto 0;
	}

	.login-rightText {
		font-family: 'Helveticaneue';
		font-size: 14px;
		display: flex;
		justify-content: end;
	}

	.login-common-box .login-subText {
		font-family: 'Helveticaneue';
		font-size: 14px;
		text-align: center;
		color: var(--lochmara);
	}

	.mail-icon {
		content: "";
		width: 22px;
		height: 15px;
		display: inline-block;
		background: url('../images/mail-icon.png') no-repeat;
		background-size: contain;
	}

	.back {
		display: inline-block;
		font-size: 14px;
		font-family: 'Helveticaneue';
		padding-left: 10px;
	}

	.MFA-box {
		margin: 80px auto 20px;
	}

	.toggle-icon {
		position: absolute;
		top: 50%;
		right: 15px;
		height: 20px;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		cursor: pointer;
	}
	
	.toggle-icon.email {
		cursor: default;
	}

	.eye-icon.open::before {
		content: "";
		width: 22px;
		height: 15px;
		display: inline-block;
		background: url('../images/open-eye.png') no-repeat;
		background-size: cover;
	}

	.eye-icon.closed::before {
		content: "";
		width: 22px;
		height: 12px;
		display: inline-block;
		background: url('../images/close-eye.png') no-repeat;
		background-size: contain;
	}

	.submit-btn {
		width: 100%;
		color: var(--white);
		padding: 10px 20px;
		font-family: "HelveticaNeue";
		font-size: 14px;
		border-radius: 25px;
		background: linear-gradient(259deg, #0088CE, #2EB8FF);
		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		border: transparent;
	}

	.back-btn {
		width: auto;
		color: var(--white);
		padding: 10px 25px;
		font-family: "HelveticaNeue";
		font-size: 14px;
		border-radius: 25px;
		background: var(--fresheggplant);
		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		-webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
		border: transparent;
			margin-left: 96px;
	}

	 a.back-btn:hover {
		color: var(--white) !important;
	}

	/*Footer css*/
	.footer-menu-container {
		text-align: center;
		position: absolute;
		bottom: 0;
		width: 100%;
		padding: 10px 0px;
		z-index: 1;
	}


	ul.footer-menu li:first-child a::after, ul.footer-menu li:nth-child(2) a::after, ul.footer-menu li:nth-child(3) a::after {
		content: '';
		position: absolute;
		background-color: var(--grey);
		height: 100%;
		width: 1px;
		bottom: 0;
		right: -10px;
		margin: auto;
	}

	ul.footer-menu li:first-child, ul.footer-menu li:nth-child(2), ul.footer-menu li:nth-child(3) {
		padding-right: 15px;
	}

	ul.footer-menu li {
		display: inline;
	}

	.disabled-component {
		pointer-events: none;
		opacity: 0.3;
		user-select: none;
	}
    /*mit-bild-page css*/

	.mit-build-top-img img {
		width: 100%;
		height: auto;
		margin: auto;
		 mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 30%); 
         -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 30%); 
	}

    /*animation css*/
    .animation-container {
        position: relative;
        padding-top: 100px;
        width: 100%;
        height: auto;
    }

    .animation-container .wave-text {
        color: var(--lochmara);
        font-weight: bold;
        position: absolute;
        left: 0;
        right: 0;
        width: 250px;
        margin: 0 auto;
        text-align: center;
        font-size: 26px;
        line-height: 1.2;
        font-style: italic;
        white-space: pre-line;
    }

    .animation-container svg {
        position: relative;
        top: 5px;
        width: 100%;
        height: 721px;
        margin-bottom: 25px;
    }

    .animation-container #movingPoint {
        opacity: 0.85;
        filter: blur(0.55px) drop-shadow(-1px 1px 250px #FFF);
    }
	
	
	/*coursecategory css*/
    .content-box {
        background: linear-gradient(139deg, #FFF 24.02%, #EFEFEF 70.22%);
        -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
        /* box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15); */
        will-change: box-shadow, filter;
        border-radius: 20px;
        margin-top: 50px;
        margin-bottom: 40px;
        overflow: hidden;
    }

    .Takeaway-box-head {
        padding: 25px;
        position: relative;
    }

    .Takeaway-box-head h5.commonH5 {
        color: var(--lochmara);
    }
    .content-box.Takeaway-box {
        overflow: unset;
    }
   .Takeaway-box-head .course-bookmark-btn img {
        height: 38px;
        width: 26px;
        -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.15));
        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.15));
    }

    .Takeaway-box-head .course-bookmark-btn {
        position: absolute;
        right: 25px;
        top: -2px;
    }

    .Takeaway-summery {
        padding: 25px;
        background: var(--Blue-Gradient, linear-gradient(259deg, #0088CE 0%, #2EB8FF 100%));
    }

    .Takeaway-summery h6,
    .Takeaway-summery li {
        color: var(--white);
    }

    .Takeaway-summery .common-listStyle li::before,
    .Takeaway-description .common-listStyle li::before {
        bottom: unset;
        top: 8px;
    }

    .Takeaway-summery .common-listStyle li::before {
        background: var(--white);
    }

    .Takeaway-description .common-listStyle li::before {
        background: var(--cello);
    }

    .Takeaway-summery h6 {
        font-family: 'HelveticaNeueMedium';
        font-size: 16px;
    }

/*    .Takeaway-summery li {
        margin-bottom: 15px;
        font-size: 16px;
    }*/
    
/*    .Takeaway-description li {
        margin-bottom: 15px;
        color: var(--cello);
        font-size: 16px;
    }*/
    
    .Takeaway-description {
        padding: 25px;
    }

    .coursecategory-box {
        text-align: center;
    }

}