/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(dmsans/rP2Hp2ywxg089UriCZOIHQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(dmsans/rP2Cp2ywxg089UriAWCrCBimCw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(dmsans/rP2Cp2ywxg089UriASitCBimCw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--mainfont:'DM Sans', sans-serif;
	--white:#ffffff;
	--textblack:#1B1717;
	--textgray:#464646;
	/*left*/
	--graybg:#F1F1F1;
	--graybg-circle:#C4C4C4;
	/*main*/
	--graybg-darker:#F2F2F2;
	--gray-input:#EFEFEF;
	--gray-input-text:#BDBDBD;
	/*border*/
	--gray-border:#CBCBCB;
	
	--blue:#1457EA;
	--green:#2E8B57;
	--light-green:#3DB860;
	--ultra-light-green:rgba(61, 139, 85,0.1);
	--red:#F94122;
	--yellow:#E87C6D;
	--pending:#E87C6D;
	
	--light-brown:rgba(235, 211, 214,0.2);
	--medium-brown:#9f8f91;
	
	--border-radius-big:24pt;
	--border-radius-small:12pt;
	
	--transition-all:all 0.3s ease;
	--transition-bg:background-color 0.3s ease;
	
	/*shadow*/
	--shadow-gray: 0px 22px 45px 9px rgba(70,70,70,0.32);
	--shadow-red: 0px 22px 45px 9px rgba(249,65,34,0.32);
	--shadow-red-small:0px 5px 15px 9px rgba(249,65,34,0.22);
	--shadow-gray-small:0px 5px 15px 9px rgba(70,70,70,0.22);
	--shadow-light-gray-small:0px 5px 10px 0px rgba(70,70,70,0.18);
	--shadow-green-small:0px 5px 15px 9px rgba(61,184,96,0.22);
	--transition-shadow:box-shadow 0.3s ease;
}
body, html {
	 /*  height:100%;  */
	min-height:100%;
	padding:0;
	margin:0;
}
body {
	font-family:var(--mainfont);
	font-size:14pt;
	color:var(--textblack);
	display:flex;
	min-height:100vh;
	
}

a {
	color:var(--textgray);
	text-decoration:none;
	transition:var(--transition-all);
}
a:hover {
	color:var(--textgray);
}


input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid var(--blue);
  -webkit-text-fill-color: var(--blue);
  -webkit-box-shadow: 0 0 0px 1000px var(--gray-input) inset;
  transition: background-color 5000s ease-in-out 0s;
  padding-left:20px !important;
}
/*Login*/

main.login {
	flex-direction:column;
	max-width:1920px;
	min-height:100vh;
	box-sizing:border-box;
	padding-left:40px;
	padding-right:40px;
	align-items:center;
	/* justify-content:center;
	 */
	margin:0 auto;
}

main.login header {
	display:flex;
	height:75px;
	padding-left:40px;
	padding-right:40px;
	max-width:1140px;
	width:100%;
	
}
main.login header .logo {
	font-size:30px;
	font-weight:bold;
	display:flex;
	flex-direction:column;
	height:75px;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	color:#1b1717;
	width:72px;
}

main.login header .logo img {
	margin-left:0;
}
 
main.login header .logo span {
 
	font-size:18px;
	letter-spacing:-1.25px;
	padding:0;
	font-size:0px;
	opacity:0;
}
main.login header:hover .logo span {
	 font-size:18px;
	opacity:1;
}
 


main.login header ul {
	height:75px;
	margin:0;
	padding:0;
	display:flex;
	align-content:center;
	justify-content:flex-end;
	flex-grow:4;
	 
}
main.login header ul li {
	list-style:none;
	margin-right:28px;
	display:flex;
	align-content:center;
	justify-content:center;
	align-items:center;
}
main.login header ul li.login  {
	margin-right:0;
}
main.login header ul li.login a {
	border:2px solid var(--textblack);
	min-height:46px;
	border-radius:50px;
	padding-left:40px;
	padding-right:40px;
	line-height:46px;
	text-decoration:none;
} 
main.login header ul li.login a:hover {
	background:var(--textblack);
	color:var(--white);
}
 
main.login header ul li a {
	font-size:20px;
	color:var(--textblack);
	text-decoration:none;
	font-weight:700;
	letter-spacing:-1.25px;
	transition:var(--transition-all);
	 
}
main.login header ul li a:hover {
	color:var(--textblack);
	text-decoration:none;
	transition:var(--transition-all);
}


main.login section.inner {
	width:100%;
	min-height:calc(100vh - 75px);
	background:url(../images/bg-login.svg) 50% 50% no-repeat;
	background-size:100% auto;background-size: cover;
	border-radius:var(--border-radius-big) var(--border-radius-big) 0 0 ;
	display:flex;
	align-items:center;
	justify-content:center;
}
main.login .login-container {
	width:100%;
	max-width:500px;
	box-sizing:border-box;
	background:var(--white);
	border-radius:var(--border-radius-big);
	padding:50px 70px;
	display:flex;
	flex-direction:column;
	align-items:center;
	margin-top:40px;
	margin-bottom:40px;
	
	box-shadow: -1px 44px 67px 16px rgba(0,0,0,0.24);
	/* -webkit-box-shadow: -1px 44px 67px 16px rgba(0,0,0,0.24);
	-moz-box-shadow: -1px 44px 67px 16px rgba(0,0,0,0.24); */
}
main.login .login-container.register {
	max-width:550px;
}
main.login .login-container h1 {
	font-size:30px;
	color:var(--textgray);
	font-family:var(--mainfont);
	margin:0;
	padding:0;
	margin-bottom:30px;
	text-align:center;
}
main .login-container .subheader {
	width:100%;
	text-align:left;
	margin-top:20px; 
	margin-bottom:10px;
	padding-left:20px;
	font-weight: 700;
	box-sizing:border-box;
	color:var(--textgray);
}
main.login .login-container h3 {
	font-size:20px;
	color:var(--textgray);
	margin:0;
	padding:0;
	margin-top:50px;
	text-align:center;
	margin-bottom:15px;
}

main.login .login-container .forminput {
	border-radius:50px;
	width:100%;
	border:0;
	background-color:var(--gray-input);
	min-height:55px;
	outline:none;
	padding-left:60px;
	box-sizing:border-box;
	font-size:20px;
	margin-bottom:15px;
	border:1px solid var(--gray-input);
	transition:var(--transition-all);
	color:var(--textgray);
	font-family:var(--mainfont);
}
main.login .login-container .form-container .forminput {
	padding-left:20px;
}

main.login .login-container .forminput:focus {
	border:1px solid var(--blue);
	transition:var(--transition-all);
}

 
 
 

main.login .login-container .forminput.username, main.login .login-container .forminput.username:-webkit-autofill {
	background-image:url(../images/icon-username.svg);
	background-position:17px 50%;
	background-repeat:no-repeat;
	 
}
main.login .login-container .forminput.password {
	background-image:url(../images/icon-password.svg);
	background-position:17px 50%;
	background-repeat:no-repeat;
	margin-bottom:30px;
}

main.login .login-container .forminput::placeholder {
	color:var(--gray-input-text);
}


body .btn {
	font-family:var(--mainfont);
	min-height:55px;
	width:100%;
	border-width:2px;
	border-radius:50px;
	background:transparent;
	cursor:pointer;
	font-size:20px;
	font-weight:bold;
	letter-spacing:-0.25pt;
	transition:var(--transition-all);
	 
}
body .btn.gray {
	border:2px solid var(--textgray);
	color:var(--textgray);
}
body .btn.gray:hover {
	border:2px solid var(--textgray);
	color:var(--white);
	background:var(--textgray);
	transition:var(--transition-all);
}

body .btn.blue {
	color:var(--blue);
	border:2px solid var(--blue);
}
body .btn.blue:hover {
	color:var(--white);
	border:2px solid var(--blue);
	background:var(--blue);
	transition:var(--transition-all);
}
main.login .login-container .lostpass {
	text-align:right;
	align-content: right;
    justify-content: flex-end;
	display:flex;
	width:100%;
	margin-top:10px;
}
main.login .login-container .lostpass a {
	color:var(--textgray);
	transition:var(--transition-all);
}
main.login .login-container .lostpass a:hover {
	color:var(--textblack);
	text-decoration:none;
	transition:var(--transition-all);
}
/* end login*/

/*all pages*/

.mobilemenu {
	display:none;
	right:-200px;
}


main {
	width:100vw;
	display:flex;
	min-height:100%;
	
}
/*section left*/
section.left {
	width:360px;
	min-width:360px;
	display:flex;
	flex-direction:column;
	float:left;
	/* height:100%;
	min-height: 100%; */
	background:#ffffff;
	box-shadow: 0px 22px 75px rgba(0, 0, 0, 0.2);
	border-radius:0 var(--border-radius-big) 0 0;
	transition:margin 0.5s ease;
}
/*logo*/
.logo {
	font-size:30px;
	font-weight:bold;
	display:flex;
	flex-direction:row;
	height:114px;
	align-items:center;
	text-decoration:none;
	color:#1b1717;
}
.logo > img {
	margin-left:40px;
	width:60px;
}
 
	
.logo > span {
	padding-left:10pt;
	letter-spacing:-1px;
}
/*left nav*/
nav.left {
	background:var(--graybg) url(../images/bg-inner1.svg) 0% 100% no-repeat;
	background-size:100% auto;
	border-radius:var(--border-radius-big) var(--border-radius-big) 0 0;
	display:block;
	flex-direction:column;
	flex-grow:3;
	height:100%; 
	
}
nav.left h3 {
	font-size:20px;
	color:var(--blue);
	font-weight:normal;
	margin:40px;
	margin-bottom:30px;
	font-family:var(--mainfont);
	letter-spacing:-0.5pt;
}

nav.left ul, .mobilemenu ul {
	margin:0;
	margin-left:20px;
	margin-right:20px;
	padding:0;
}
nav.left ul li, .mobilemenu ul li {
	padding:0;
	margin:0;
	margin-bottom:10px;
	list-style:none;
	position:relative;
}
nav.left ul li a, .mobilemenu ul li a {
	display:flex;
	 
	min-height:55px;
	align-items:center;
	border-radius:var(--border-radius-big);
	font-size:22px;
	text-decoration:none;
	padding-left:70px;
	font-weight:bold;
	letter-spacing:-1.25px;
	color:var(--textgray);
	transition:var(--transition-all);
	
}
nav.left ul li a:hover, .mobilemenu ul li a:hover {
	background-color:var(--graybg-circle);
	color:var(--textblack);
	transition:var(--transition-all);
}
nav.left ul li a:hover span, .mobilemenu ul li a:hover span {
	background-color:var(--graybg-darker);
	transition:var(--transition-all);
}

nav.left ul li.benutzerseite a, .mobilemenu ul li.benutzerseite a {
	background-image:url(../images/icon-dashboard-black.svg);
	background-repeat:no-repeat;
	background-position:25px 50%;
}
nav.left ul li.profile a, .mobilemenu ul li.profile a {
	background-image:url(../images/icon-user-black.svg);
	background-repeat:no-repeat;
	background-position:25px calc(50% - 2px);
}
nav.left ul li.meineekg a, .mobilemenu ul li.meineekg a {
	background-image:url(../images/icon-ekg-gray.svg);
	background-repeat:no-repeat;
	background-position:22px 50%;
}
nav.left ul li.addnew a, .mobilemenu ul li.addnew a {
	background-image:url(../images/icon-add-gray.svg);
	background-repeat:no-repeat;
	background-position:22px 50%;
}
nav.left ul li.meinefalle a, .mobilemenu ul li.meinefalle a {
	background-image:url(../images/icon-mainfalle-gray.svg);
	background-repeat:no-repeat;
	background-position:23px calc(50% - 2px);
}
.mobilemenu ul li.user a {
	background-image:url(../images/icon-user.svg);
	background-repeat:no-repeat;
	background-position:23px calc(50% - 1px);
	background-size:30px auto;
}
.mobilemenu ul li.logout a {
	background-image:url(../images/icon-logout.svg);
	background-repeat:no-repeat;
	background-position:23px calc(50% - 1px);
	background-size:30px auto;
}


nav.left ul li.active a, .mobilemenu ul li.active a {
	background-color:var(--white);
	color:var(--textblack);
} 
nav.left ul li a span, .mobilemenu ul li a span {
	display:block;
	width:30px;
	height:30px;
	text-align:center;
	font-size:18px;
	color:var(--textgray);
	background:var(--graybg-circle);
	line-height:30px;
	border-radius:50%; 
	margin-left:10px;
	font-weight:normal;
	transition:var(--transition-all);
} 


/*mobile menu*/

/*mobile menu */
	.mobilemenu {
		width:100%;
	}
	.mobilemenu .mobiletop {
		width:100%;
		margin-top:40px;
		margin-right:40px;
		margin-bottom:40px;
	}
	.mobilemenu .btnhamburgerclose {
		background: url(../images/btn-hamburger-close.svg) 50% 50% no-repeat;
		margin-right:30px;
	}
	
	.mobilemenu ul {
		margin:0;
		padding:0;
		margin-left:30px;
		margin-bottom:30px;
		margin-right:30px;
		max-width:400px;
	}
	.mobilemenu ul li {
		list-style:none;
	}




/*main section*/
section.main {
	width:calc(100% - 360px);
	display:flex;
	flex-direction:column;
	float:left;
	height:100%;
	padding:40px;
	 
	box-sizing:border-box;
}
/*top menu*/
nav.top {
	display:flex;
	height:30px;
}
nav.top ul {
	margin:0;
	padding:0;
	/* margin-top:10px; */
	display:flex;
	align-content:center;
	justify-content:flex-end;
	flex-grow:4;
}
nav.top ul li {
	list-style:none;
	margin-right:28px;
	display:flex;
	
	align-items:center;
}
nav.top ul li a {
	font-size: 20px;
    color: var(--textblack);
    text-decoration: none;
    font-weight: 700;
    letter-spacing: -1.25px;
    transition: var(--transition-all);


 
}
nav.top ul li a:hover {
	color:var(--textblack);
	text-decoration:none;
	transition:var(--transition-all);
}
/*lang*/
nav.top div.lang, main.login header ul li.lang {
	align-items:center;
	display:flex;
	gap:10px;
	margin-right:25px;
}
nav.top div.lang.notpatient {
	margin-top:-27px;
}
nav.top div.lang a, main.login header ul li.lang a {
	text-decoration:none;
	font-size: 15px;
	letter-spacing:-0.5pt;
    color: var(--graybg-circle);
    transition: var(--transition-all);
	border:1px solid var(--graybg-circle);
	border-radius:6px;
	width:26px;
	height:26px;
	align-items:center;
	justify-content:center;
	display:flex;
	padding:0;
}
nav.top div.lang a:hover, main.login header ul li.lang a:hover {
	color:var(--textblack);
	border:1px solid var(--textblack);
	transition:var(--transition-all);
}

nav.top div.lang a.active, main.login header ul li.lang a.active {
	color:var(--textgray);
	background:var(--textblack);
	color:var(--white);
	border:1px solid var(--textblack);
}

nav.top .usermenu {
	display:flex;
	align-items:center;
	justify-content:center;
	
}
nav.top .usermenu a {
    font-size: 20px;
    color: var(--textblack);
    text-decoration: none;
    font-weight: 700;
    letter-spacing: -1.25px;
	 
	background:url(../images/icon-user.svg) 0% 50% no-repeat;
	padding-left:30px;
	min-height:25px;
	line-height:25px;
	transition:var(--transition-all);
}
nav.top .usermenu a:hover {
	color:var(--textblack);
	text-decoration:none;
	transition:var(--transition-all);
}
/* usermenucontainer*/
nav.top .usermenu .usermenucontainer {
	display:none;
}
nav.top .usermenu .usermenucontainer.visible {
	display:block;
}

nav.top .usermenu .usermenucontainer {
	position:absolute;
	
	background:var(--white);
	z-index:9;
	top:0;
	left:0;
	background:transparent;
	width:100%;
	height:100%;
}
 
nav.top .usermenu .usermenucontainer ul {
	position:absolute;
	z-index:10;
	right:0;
	top:0;
	background:var(--white);
	display:flex;
	flex-direction:column;
	
	margin-top:0;
	padding:40px;
	box-sizing:border-box;
	border-radius:var(--border-radius-big) 0 var(--border-radius-big) var(--border-radius-big);
	box-shadow:var(--shadow-gray);
	
}
nav.top .usermenu .usermenucontainer ul li.username {
	margin-bottom:20px;
	color:var(--graytext);
}

nav.top .usermenu .usermenucontainer ul li a {
	margin-bottom:10px;
	padding-left:35px;
	display:flex;
}

nav.top .usermenu .usermenucontainer ul li.logout a {
	background: url(../images/icon-logout.svg) 0% 50% no-repeat;
}
nav.top .usermenu .usermenucontainer ul li a {
	color:var(--textblack);
	font-weight:bold;
	text-decoration:none; 
	 
}
nav.top .usermenu .usermenucontainer ul li a:hover {
	text-decoration:underline;
}


/*content*/
section.content {
	
}

.flex-container {
	display:flex;
}

section.content h1.header {
	font-size:30px;
	letter-spacing:-0.5pt;
	color:var(--textgray);
	font-family:var(--mainfont);
	margin:0;
	padding:0;
	margin-bottom:35px;
	margin-top:20px;
	min-height:40px;
	line-height:40px;
}
section.content h1.header a {
	font-weight:normal;
	color:var(--textgray);
	transition:var(--transition-all);
	margin-right:10px;
	text-decoration:underline;
}
section.content h1.header a:hover {
	color:var(--textblack);
	text-decoration:none;
	transition:var(--transition-all);
}

section.content h1.hello {
	padding-left:50px;
	background:url(../images/hand-emoji.png) 0% 2px no-repeat;
}

section.content h1.falle {
	padding-left:50px;
	background:url(../images/icon-falle.svg) 0% 2px no-repeat;
}

section.content h1.ekg {
	padding-left:50px;
	background:url(../images/icon-ekg-color.svg) 0% 9px no-repeat;
}
section.content h1.addnew {
	padding-left:50px;
	background:url(../images/icon-add-color.svg) 0% 4px no-repeat;
}
section.content h1.profile {
	padding-left:50px;
	background:url(../images/icon-user-color.svg) 0% 5px no-repeat;
}
section.content h1.invoices {
	padding-left:50px;
	background:url(../images/icon-invoices-color.svg) 0% 5px no-repeat;
}

/*info blocks*/
div.info {
	width:100%;
	display:flex;
	flex-direction:column;
	align-items:left;
	justify-content:center;
	padding:30px;
	padding-left:200px;
	margin-bottom:40px;
	box-sizing:border-box;
	background-color:var(--graybg-darker);
	border-radius:var(--border-radius-big);
}
div.info.outlined {
	padding-left:150px;
	background-color:var(--white);
	border:2px solid var(--gray-border);
}

div.info h3 {
	font-size:20px;
	font-weight:bold;
	color:var(--textgray);
	letter-spacing:-0.5pt;
	margin:0;
	padding:0;
	margin-bottom:20px;
}
div.info p {
	font-size:20px;
	font-weight:normal;
	color:var(--textgray);
	letter-spacing:-0.5pt;
	line-height:138%;
	padding:0;
	margin:0;
}
div.info.bulb {
	background-image:url(../images/icon-bulb.svg);
	background-repeat:no-repeat;
	background-position:50px 35px;
	min-height:180px;
}
div.info.infosign {
	background-image:url(../images/icon-info-color.svg);
	background-repeat:no-repeat;
	background-position:70px 50%;
}
div.info.warning {
	background-image:url(../images/icon-warning-color.svg);
	background-repeat:no-repeat;
	background-position:60px 50%;
}
div.info.payment {
	background-image:url(../images/icon-credit-card-color.svg);
	background-repeat:no-repeat;
	background-position:50px 50%;
}
div.info.sucess {
	background-image:url(../images/icon-sucess-sent-color.svg);
	background-repeat:no-repeat;
	background-position:35px 50%;
}


/*warning*/
div.info.red-warning {
	border:2px solid var(--red);
	background:var(--white);
	padding:40px;
}
div.info.red-warning h3 {
	color:var(--red);
}

/*tabs*/
ul.casestab {
	margin:0;
	padding:0;
	display:flex;
	gap:10px;
	margin-bottom:20px;
}
ul.casestab li {
	list-style:none;
}
ul.casestab li a {
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	letter-spacing:-1px;
	color:var(--textblack);
	border:1px solid var(--textblack);
	border-radius:50px;
	height:46px;
	min-width:85px;
	display:flex;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;
	padding-left:20px;
	padding-right:20px;
	transition:var(--transition-all);
}
ul.casestab li a:hover {
	background:var(--textgray);
	color:var(--white);
	transition:var(--transition-all);
}
ul.casestab li a:hover span, ul.casestab li a span {
	transition:var(--transition-all);
}

ul.casestab li a.active {
	background:var(--textgray);
	color:var(--white);
}
ul.casestab li a span {
	font-size:10px;
	font-weight:600;
	color:var(--textgray);
	background:var(--graybg-circle);
	width:21px;
	height:21px;
	
	border-radius:50%;
	text-align:center;
	line-height:22px;
	padding-right:2px;
	margin-left:10px;
	margin-right:-10px;
}

ul.casestab li.pending a {
	color:var(--pending);
	border:1px solid var(--pending);
}
ul.casestab li.pending a:hover,
ul.casestab li.pending a.active {
	background:var(--pending);
	color:var(--white);
}
ul.casestab li.pending a:hover span,
ul.casestab li.pending a.active span{
	background:var(--white);
	color:var(--pending);
}
ul.casestab li.pending a span {
	background:var(--pending);
	color:var(--white);
}


ul.casestab li.done a {
	color:var(--green);
	border:1px solid var(--green);
}
ul.casestab li.done a:hover,
ul.casestab li.done a.active {
	background:var(--green);
	color:var(--white);
}
ul.casestab li.done a:hover span,
ul.casestab li.done a.active span  {
	background:var(--white);
	color:var(--green);
}
ul.casestab li.done a span {
	background:var(--green);
	color:var(--white);
}















/*content block*/
.contentlist {
	width:100%;
	display:flex;
	gap:30px;
}
.contentlist.col1 {
	display: grid;
	grid-template-columns: repeat(1, 100%);
	width:100%;
	gap: 0px;
	min-width:425px;
}

.contentlist.col1 div.contentblock {
	width:100%;
	max-width:500px;
}

.contentlist.col3 {
	display: grid;
	grid-template-columns: repeat(3, 33%);
	width:calc(100% - 40px);
	/* grid-auto-rows: 12.5rem; */
	gap: 30px;
}

@media screen and (max-width: 1792px) {
	.contentlist.col3 {
		grid-template-columns: repeat(2, 50%);
		min-width: calc(425px * 2 + 60px);
		width:calc(100% - 20px);
	}
	@media screen and (max-width: 1366px) {
		.contentlist.col3 {
		grid-template-columns: repeat(1, 100%);
		min-width: 425px;
		width:100%;
	}
	}
}


.contentlist.col3 div.contentblock {
	width:auto !important; 
	min-width:425px;
}
.contentlist.col3 div.contentblock:nth-child(2n+1) {
		margin-right:0;
}
.contentlist.col3 div.contentblock.button {
	/* border:0;
	padding:0; */
}
.contentlist.col3 div.contentblock.button {
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	border:2px solid var(--red);
	border-radius:var(--border-radius-big);
	
	cursor:pointer;
	font-size:24px;
	font-weight:bold;
	color:var(--red);
	text-decoration:none;
	transition:var(--transition-all);
	background-image:url(../images/icon-add-red.svg);
	background-repeat:no-repeat;
	background-position:50% calc(50% - 50px);
	padding-top:50px;
	min-height:400px;
}
.contentlist.col3 div.contentblock.button:hover {
	background-color:var(--red);
	color:var(--white);
	background-image:url(../images/icon-add-white.svg);
	
	/* -webkit-box-shadow: var(--shadow-red);  */
	box-shadow: var(--shadow-red);
	
}

div.contentblock {
	border:2px solid var(--gray-border);
	border-radius:var(--border-radius-big);
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	width:50%;
	transition:var(--transition-all);
}
div.contentblock:hover {
	border:2px solid var(--textblack);
	color:var(--textblack);
	background:var(--white);
	/* -webkit-box-shadow: var(--shadow-gray);  */
	box-shadow: var(--shadow-gray);
	transition:var(--transition-all);
	/*cursor:pointer;*/
}
div.contentblock.nohover:hover {
	box-shadow:none;
	cursor:default;
	border:2px solid var(--gray-border);
}

div.contentblock.big {
	padding:30px;
}

/*ekg full info */
.contentlist div.contentblock.wide {
	padding:30px;
	width:100%;
	max-width:1020px;
 
	display:block;
}

.contentlist div.contentblock.fullwidth {
	padding:30px;
	width:100%;
	max-width:100%;
 	display:block;
}
.contentlist div.contentblock.fullwidth .extendedcontent.left {
	max-width:450px;
	max-width:100%;
	gap:0;
}
.contentlist div.contentblock.fullwidth .extendedcontent.left .buttons {
	margin-bottom:40px;
}


.extendedcontent {
	width:calc(50% - 20px);
	float:left;
	margin-right:20px;
	margin-left:20px;
}
.extendedcontent h3 {
	color:var(--textgray);
}


.extendedcontent.left {
	display:flex;
	flex-direction:column;
	gap:10px;
	
	margin-left:0;
}
.extendedcontent.right {
	margin-right:0;
}



.extendedcontent.fullwidth {
	width:100%;
	display:block;
	text-align:center;
	padding:15px 10px;
	box-sizing:border-box;
	
	margin:0;
	margin-top:40px;
	min-height:50px;
	background:var(--graybg);
	border-radius: var(--border-radius-small);
	color:var(--textgray);
	
	font-size:18px;
	font-weight:bold;
	    border: 1px solid var(--gray-border);
}

section.content .extendedcontent h1.header {
	margin-top:0;
}

.extendedcontent .chatitem {
	width:100%;
	display:flex;
	flex-direction:column;
 
}

.extendedcontent .chatitem .message {
	
	min-height:48px;
	
	font-size:18px;
	display:flex;
	box-sizing:border-box;
	padding:12px 15px;
	position:relative;
	flex-direction:column;
}
.extendedcontent .chatitem.outgoing .message {
	background:var(--textgray);
	border-radius:0 var(--border-radius-small) var(--border-radius-small) var(--border-radius-small);
	color:var(--white);
}
.extendedcontent .chatitem.outgoing .message::before {
	width:0;
	height:0;
	border-top: 9px solid transparent;
	border-bottom: 9px solid transparent;
	border-left: 9px solid var(--textgray);
	position:absolute;
	content:" ";
	left:0;
	top:-7px;
}
.extendedcontent .chatitem.incoming .message {
	width:auto;
	float:right;
	display:block;
	background:var(--graybg);
	border-radius: var(--border-radius-small) var(--border-radius-small) 0 var(--border-radius-small) ;
	color:var(--textgray);
	align-content:flex-end;
	justify-content:flex-end;
	 
	

}
.extendedcontent .chatitem.incoming .message::before {
	width:0;
	height:0;
	border-top: 9px solid transparent;
	border-bottom: 9px solid transparent;
	border-right: 9px solid var(--graybg);
	position:absolute;
	content:" ";
	right:0;
	bottom:-7px;
}


.extendedcontent .chatitem.incoming .username {
	align-content:flex-end;
	justify-content:flex-end;
	display:flex;
	padding-right:5px;
}
.extendedcontent .chatitem.outgoing .username {
	padding-left:5px;
}

.extendedcontent .chatitem .username {
	font-size:14px;
	font-weight:bold;
	color:var(--textblack);
	padding-top:5px;
	padding-bottom:5px;
}
.extendedcontent .chatitem .username span.date {
	color:var(--textgray);
	font-weight:normal;
	margin-left:10px;
}

.extendedcontent .chatitem .btnPdf {
	display:block;
	min-height:46px;
	border-radius:26px;
	
	background:var(--textblack) url(../images/icon-pdf-white.svg) 15px 50% no-repeat;	
	float:left;
	padding:10px 15px;
	padding-left:45px;
	box-sizing:border-box;
	color:var(--white);
	text-decoration:none;
	padding-right:15px;
	margin-top:10px;
	transition:var(--transition-shadow);
}
.extendedcontent .chatitem .btnPdf:hover  {
	box-shadow:var(--shadow-gray-small);
	transition:var(--transition-shadow);
}


div.contentblock h2 {
	font-size:22px;
	color:var(--textgray);
	margin:0;
	margin-bottom:20px;
	padding:0;
}





/*status*/

div.innercontainer {
	width:100%;
	display:flex;
	flex-direction:row;
	gap:15px;
}
div.innercontainer div.status {
	flex-grow:2;
}
 

div.status {
	border-radius:50px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:30px;
}

div.status.ok {
	border:1px solid var(--green);
	color: var(--green);
	
}

div.status.ok div {
	background:url(../images/icon-checkmark-green.svg) 20px 50% no-repeat;
	padding:10px;
	padding-left:55px;
	min-height:45px;
	display:flex;
	align-items:center;
	width:auto;
	font-size:18px;
	font-weight:normal;
	box-sizing:border-box;
}

div.status.processing {
	border:1px solid var(--yellow);
	color: var(--yellow);
	
}

div.status.processing div {
	background:url(../images/icon-processing.svg) 20px 50% no-repeat;
	padding:10px;
	padding-left:55px;
	min-height:45px;
	display:flex;
	align-items:center;
	width:auto;
	font-size:18px;
	font-weight:normal;
	box-sizing:border-box;
}

div.status.gray {
	border:1px solid var(--gray-border);
	
	color: var(--textblack);
	
}

div.status.gray div {
	background:transparent;
	padding:10px;
	
	min-height:45px;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	font-size:18px;
	font-weight:normal;
	box-sizing:border-box;
}


ul.info {
	margin:0;
	padding:0;
	display:flex;
	gap:15px;
	margin-bottom:20px;
	width:100%;
}
ul.info li {
	list-style:none;
	padding-right:20px;
	box-sizing:border-box;
	flex-grow:2;
}
ul.info li.button {
	width:47px;
	flex-grow:0;
	padding:0;
	justify-content:flex-end;
	align-content:flex-end;
}
ul.info li span {
	font-size:18px;
	width:100%;
	display:flex;	
	color:var(--textgray);
}
ul.info li span.hd {
	font-weight:bold;	
}

.btnCircle {
	width:47px;
	min-width:47px;
	height:47px;
	border-radius:50%;
	background-color:var(--red);
	display:block;
	transition:var(--transition-shadow);
	border:0;
	cursor:pointer;
}
.btnCircle.small {
	width:28px;
	min-width:28px;
	height:28px;
	border-radius:50%;
	background-color:var(--red);
	display:block;
	transition:var(--transition-shadow);
	border:0;
	cursor:pointer;
	background-size:12px auto;
}


.btnCircle:hover {
	/* -webkit-box-shadow: var(--shadow-red-small);  */
	box-shadow: var(--shadow-red-small);
	transition:var(--transition-shadow);
}
.btnCircle.disabled {

	background-color:var(--gray-border);
	display:block;
	transition:var(--transition-shadow);
}
.btnCircle.disabled:hover {
	box-shadow: none;
	cursor:default;
}

.btnCircle.edit {
	background-image:url(../images/icon-edit.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.btnCircle.view {
	background-image:url(../images/icon-view-white.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	cursor:pointer;
}
.btnCircle.refresh {
	background-image:url(../images/icon-refresh.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}

.btnCircle.delete {
	background-image:url(../images/icon-delete.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.btnCircle.details {
	background-image:url(../images/icon-details-white.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.btnCircle.hidedetails {
	background-image:url(../images/icon-cross-white.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}

.btnRegular {
	min-height:46px;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	border-radius:50px;
	margin-top:20px;
	text-decoration:none;
	font-weight:bold;
	padding:0;
	box-sizing:border-box;
	padding:15px 25px;
	
}
.btnRegular span {
	margin:0;
	padding:0;
	background:url(../images/icon-arr-right-white.svg) 100% 50% no-repeat;
	padding-right:30px;
}
.btnRegular.btnPdf {
	background:var(--red);
	color:var(--white);
	transition:var(--transition-shadow);
	 
}
.btnRegular.btnPdf:hover {
	/* -webkit-box-shadow: var(--shadow-red-small);  */
	box-shadow: var(--shadow-red-small);
	transition:var(--transition-shadow);
}
.btnRegular.btnPdf span {
	margin:0;
	padding:0;
	margin-top:-2px;
	background:url(../images/icon-pdf-white.svg) 0% calc(50% + 1px) no-repeat;
	padding-left:25px;
}

.btnRegular.red {
	background:var(--red);
	color:var(--white);
	transition:var(--transition-shadow);
}
.btnRegular.red:hover {
/* 	-webkit-box-shadow: var(--shadow-red-small);  */
	box-shadow: var(--shadow-red-small);
	transition:var(--transition-shadow);
}

.btnRegular.back, 
.btnRegular.proceed,
.btnRegular.cancel,
.btnRegular.mycases {
	width:auto;
	min-width:335px;
	float:left;
	color:var(--textgray);
	border:1px solid var(--textgray);
	 
	padding-left:30px;
	padding-right:30px;
	margin-top:0;
	transition:var(--transition-all);
}

.btnRegular.back:hover,
.btnRegular.proceed:hover,
.btnRegular.cancel:hover,
.btnRegular.mycases:hover
 {
	background:var(--textgray);
	transition:var(--transition-all);
	color:var(--white);
}

.btnRegular.proceed:hover span {
	background:url(../images/icon-arr-right-white.svg) 100% 50% no-repeat;
	 transition:var(--transition-all)
}

.btnRegular.proceed span {
	margin:0;
	padding:0;
	 
	background:url(../images/icon-arr-right.svg) 100% 50% no-repeat;
	padding-right:30px;
	transition:var(--transition-all);
}


.btnRegular.cancel:hover span {
	/*background:url(../images/icon-arr-right-white.svg) 100% 50% no-repeat; 
	 transition:var(--transition-all) */
}

.btnRegular.cancel span {
	margin:0;
	padding:0;
	 
	/*background:url(../images/icon-arr-right.svg) 100% 50% no-repeat; */
	padding-right:30px;
	transition:var(--transition-all);
}

.btnRegular.back:hover span {
	/*background:url(../images/icon-arr-right-white.svg) 100% 50% no-repeat; 
	 transition:var(--transition-all) */
}

.btnRegular.back span {
	margin:0;
	padding:0;
	 
	/*background:url(../images/icon-arr-right.svg) 100% 50% no-repeat; */
	padding-right:30px;
	transition:var(--transition-all);
}




.btnRegular.support {
	width:auto;
	min-width:335px;
	float:left;
	color:var(--textgray);
	border:1px solid var(--textgray);
	 
	padding-left:30px;
	padding-right:30px;
	margin-top:0;
	transition:var(--transition-all);
}
.btnRegular.support:hover {
	background:var(--textgray);
	transition:var(--transition-all);
	color:var(--white);
}
.btnRegular.support:hover span {
	background:url(../images/icon-support-white.svg) 0% calc(50% + 2px) no-repeat;
	 transition:var(--transition-all)
}

.btnRegular.support span {
	margin:0;
	padding:0;
	margin-top:-4px;
	background:url(../images/icon-support.svg) 0% calc(50% + 2px) no-repeat;
	padding-left:30px;
	transition:var(--transition-all);
}










.btnRegular.btnCall {
	width:auto;
	float:left;
	color:var(--white);
	background:var(--green);
	padding-left:30px;
	padding-right:30px;
	max-width:200px;
	transition:var(--transition-shadow);
	
 
}
.btnRegular.btnCall:hover {
	transition:var(--transition-shadow);
	box-shadow:var(--shadow-green-small);
}
.btnRegular.btnCall span {
	margin:0;
	padding:0;
	margin-top:-4px;
	background:url(../images/icon-phone-white.svg) 0% calc(50% + 2px) no-repeat;
	padding-left:30px;
	transition:var(--transition-all);
}


ul.ekg-list {
	margin:0;
	padding:0;
	display:flex;
	gap:20px;
	margin-bottom:40px;
}
ul.ekg-list li {
	border:1px solid var(--gray-border);
	list-style:none;
	min-height:220px;
	width:50%;
	border-radius:var(--border-radius-big);
	display:flex;
	flex-direction:column;
	overflow:hidden;
	position:relative;
	transition:var(--transition-all);
}
ul.ekg-list.single li {
	width:100%;
}
ul.ekg-list.single.patientpreview {
	margin-bottom:0;
}
ul.ekg-list.single.patientpreview li {
	min-height:500px;
}

ul.ekg-list.single.patientpreview li .pdf-preview-patient {
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:500px;
	background:var(--white);
}
ul.ekg-list.single.patientpreview li .pdf-preview-patient img {
	height:100%;
}
 
ul.ekg-list li:hover {
	border:1px solid var(--textblack);
	cursor:pointer;
	transition:var(--transition-all);
}
ul.ekg-list li span {
	border-radius:var(--border-radius-big);
	width:100%;
	box-sizing:border-box;
	min-height:50px;
	display:flex;
	align-items:center;
	font-size:16px;
	padding-left:45px;
	padding-right:15px;
	padding-top:5px;
	padding-bottom:5px;
	position:absolute;
	background-image:url(../images/icon-pdf-gray.svg);
	background-position: 15px 50%;
	background-repeat:no-repeat;
}
ul.ekg-list li .pdf-preview {
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:220px;
	background:var(--white);
}
ul.ekg-list.single li .pdf-preview::before {
	width:33px;
	height:45px;
	position:absolute;
	background:url(../images/icon-pdf-gray.svg) 50% 50% no-repeat;
	background-size:33px auto;
	content:" ";
	display:block;
	left:16px;
	top:16px;
}



ul.ekg-list li .pdf-preview img {
	height:100%;
	min-height:220px;
}
ul.ekg-list li .pdf-preview.img2 img {
	height:auto;
}
ul.ekg-list li.request span {
	background-color:var(--gray-border);
}
ul.ekg-list li.response span {
	background-color:var(--graybg-darker);
}

ul.ekg-list li.response.pending span,
ul.ekg-list li.invoice.pending span {
	background-color:var(--graybg-darker);
	background-image:none;
	padding-left:20px;
	color:var(--gray-input-text);
}
ul.ekg-list li.response.pending a,
ul.ekg-list li.invoice.pending a {
	cursor:default;
}

ul.ekg-list li.response.pending:hover,
ul.ekg-list li.invoice.pending:hover {
	border:1px solid var(--gray-border);
	cursor:default;
}

ul.ekg-list li.response.pending .pdf-preview,
ul.ekg-list li.invoice.pending .pdf-preview {
	background:url(../images/icon-processing-gray.svg) 50% calc(50% + 20px) / 50px auto no-repeat;
}


ul.ekg-list li.response.done span,
ul.ekg-list li.invoice.done span {
	background-color:var(--gray-border);
}


/*upload zone*/
.uploadzone {
	display:flex;
	width:100%;
	min-height:350px;
	justify-content:center;
	align-items:center;
	border:1px dashed var(--gray-border);
	border-radius:var(--border-radius-big);
	z-index:2;
}
.uploadzone:hover {
	border:1px dashed var(--textblack);
	cursor:pointer;
}
.uploadzone:hover .uploadcontrols input[type='button'] {
	background:var(--textgray);
	color:var(--graybg-darker);
}
.uploadcontrols {
	z-index:-1;
	width:100%;
	max-width:300px;
	min-height:175px;
	padding-top:100px;
	display:flex;
	flex-direction:column;
	box-sizing:border-box;
	background:url(../images/icon-upload-gray.svg) 50% 0% no-repeat;
}
.uploadcontrols input[type='button'] {
	background:var(--graybg-darker);
	border:0;
	border-radius:50px;
	height:46px;
	font-size:18px;
	font-weight:bold;
	font-family:var(--mainfont);
	color:var(--textgray);
	cursor:pointer;
	transition:var(--transition-all);
	outline:none;
}
.uploadcontrols input[type='button']:hover {
	background:var(--textgray);
	color:var(--graybg-darker);
}
.uploadcontrols p {
	color:var(--textgray);
	text-align:center;
	margin:0;
	padding:0;
	margin-top:10px;
}

/*breadcrumb*/
ul.breadcrumb {
	display:flex;
	margin:0;
	padding:0;
	margin-bottom:30px;
	gap:10px;
}
ul.breadcrumb li {
	list-style:none;
}
ul.breadcrumb li a {
	min-height:46px;
	min-width:46px;
	display:block;
	border-radius:26px;
	font-size:20px;
	text-decoration:none;
	background:var(--graybg-darker);
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	box-sizing:border-box;
	color:var(--textgray);
	transition:var(--transition-all);
}
ul.breadcrumb li a:hover {
	background:var(--textblack);
	color:var(--white);
	transition:var(--transition-all);
}

ul.breadcrumb li.active a {
	padding-left:40px;
	padding-right:40px;
	background:var(--textblack);
	color:var(--white);
	font-weight:bold;
}


ul.stepbuttons {
	margin:0;
	padding:0;
	display:flex;
	gap:10px;
	padding-top:20px;
}
ul.stepbuttons li {
	list-style:none;
}
ul.stepbuttons li.cancel {
	flex-grow:5;
	display:flex;
	align-items:flex-end;
	justify-content:flex-end;
}	
ul.stepbuttons .btnRegular {
	min-width:0;
	letter-spacing:-1px;
	padding:10px 25px;
	font-size:18px;
}


ul.stepbuttons .btnRegular.mycases span {
	background: url(../images/icon-mainfalle-gray.svg) 0% 50% / 20px auto no-repeat;
    transition: var(--transition-all);
	padding-left:30px;
	padding-right:0;
}
ul.stepbuttons .btnRegular.mycases:hover span {
	background: url(../images/icon-mainfalle-white.svg) 0% 50% / 20px auto no-repeat;
    transition: var(--transition-all);
}

ul.stepbuttons .btnRegular.back span {
	background: url(../images/icon-arr-s-left.svg) 0% 50% no-repeat;
    transition: var(--transition-all);
	padding-left:30px;
	padding-right:0;
}
ul.stepbuttons .btnRegular.back:hover span {
	background: url(../images/icon-arr-s-left-white.svg) 0% 50% no-repeat;
	transition: var(--transition-all);
}

ul.stepbuttons .btnRegular.proceed span {
	background: url(../images/icon-arr-s-right.svg) 100% 50% no-repeat;
    transition: var(--transition-all);
}
ul.stepbuttons .btnRegular.proceed:hover span {
	background: url(../images/icon-arr-s-right-white.svg) 100% 50% no-repeat;
    transition: var(--transition-all);
}

ul.stepbuttons .btnRegular.cancel {
	border:1px solid var(--pending);
	color:var(--pending);
	transition: var(--transition-all);
}
ul.stepbuttons .btnRegular.cancel:hover {
	background:var(--pending);
	color:var(--white);
	transition: var(--transition-all);
}
ul.stepbuttons .btnRegular.cancel span {
	background-image:none;
    transition: var(--transition-all);
	padding-left:0px;
	padding-right:0;
	

}


/*EKG info container*/
.ekginfocontainer {
	display:flex;
	gap:30px;
	margin-bottom:40px
}
.ekginfocontainer .infooutlined {
	width:100%;
	border:2px solid var(--gray-border);
	border-radius:var(--border-radius-big);
	padding:30px;
	box-sizing:border-box;
	display:flex;
	align-items:center;
	
}
.ekginfocontainer .infooutlined p {
	margin:0;
	padding:0;
	font-size:20px;
	color:var(--graytext);
	line-height:138%;
}


.ekginfocontainer .pdf-preview {
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:120px;
	background:var(--white);
	border:2px solid var(--gray-border);
	border-radius:var(--border-radius-big);
	overflow:hidden;
	min-width:300px;
	position:relative;
}
.ekginfocontainer .pdf-preview img {
	/*width:100%;*/
	/*max-height:120px;*/
}
.ekginfocontainer .pdf-preview::before {
	width:33px;
	height:45px;
	position:absolute;
	background:url(../images/icon-pdf-gray.svg) 50% 50% no-repeat;
	background-size:33px auto;
	content:" ";
	display:block;
	left:16px;
	top:16px;
}



/*form*/
div.questions {
	width:100%;
}
div.questions.withborder {
	width:100%;
	padding:0 30px;
	box-sizing:border-box;
	border:2px solid var(--gray-border);
	border-radius:var(--border-radius-big);
}
 div.questions .question h3 {
	 margin-bottom:15px;
	 color:var(--textgray);
 }
/* Basic styles */
.form-input {
	margin-bottom:40px;
}
.form-input input[type="checkbox"],
.form-input input[type="radio"] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}


.form-input label {
  position: relative;
  display: inline-block;
  padding: 0 0 0 40px;
  height: 35px;
  line-height: 1.5;
  cursor: pointer;
  font-size:20px;
  margin-right:15px;
 
}
.form-input label::before,
.form-input label::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 35px;
  height: 35px;
}
.form-input label::before {
  content: " ";
  border: 2px solid var(--textgray);
  border-radius: 20%;
   box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}


/* Checkbox */
.form-input input[type="checkbox"] + label::before {
background: transparent url(../images/icon-checkmark-white.svg) 50% 50% / 1px auto no-repeat;	
}
.form-input input[type="checkbox"] + label::after {
 
  color: #FFFFFF;
  line-height: 22px;
  text-align: center;
  font-size:11px;
}
/* Radio */
.form-input input[type="radio"] + label::before {
  border-radius: 50%;
   box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.form-input input[type=radio] + label::after {
  content: " ";
  top: 6px;
  left: 6px;
  width: 23px;
  height: 23px;
  background: var(--textgray);
  border: 0;
  border-radius: 50%;
}
/* :checked */
.form-input input[type="checkbox"]:checked + label::before,
.form-input input[type="radio"]:checked + label::before {
  background: #464646;  
  border-color: var(--textgray);
}
.form-input input[type="checkbox"]:checked + label::before {
	background: #464646 url(../images/icon-checkmark-white.svg) 50% 50% / 20px auto no-repeat;
}
 

.form-input input[type="radio"]:checked + label::before {
	background:transparent;
}

.form-input input[type="checkbox"] + label::after,
.form-input input[type=radio] + label::after {
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
.form-input input[type="checkbox"]:checked + label::after,
.form-input input[type=radio]:checked + label::after {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
/* Transition */
.form-input label::before,
.form-input label::after {
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}


.form-input input[type="checkbox"]:checked + label,
.form-input input[type="radio"]:checked + label{
 font-weight:500;  
 
}
/*disabled*/
.form-input input:disabled + label::before {
	border-color:var(--gray-border) !important;
}
.form-input input:disabled + label::after {
	background-color:var(--gray-border) !important;
}
.form-input input[type="checkbox"][disabled]:checked + label::before {
 
	background:var(--gray-border) url(../images/icon-checkmark-white.svg) 50% 50% / 20px auto no-repeat;
}



.form-input.disabled input[type="checkbox"]:checked + label::before,
.form-input.disabled input[type="radio"]:checked + label::before {
  background: #f0f0f0;
  border-color: #f0f0f0;
}


/*experts list*/
.expertlist {
	display: grid;
	grid-template-columns: repeat(3, 33.33333%);
	width:calc(100% - 80px);
	
	gap: 40px;
	margin-bottom:40px;
}
div.expert {
	width:100%;
	border:2px solid var(--gray-border);
	border-radius:var(--border-radius-big);
	display:flex;
	box-sizing:border-box;
	align-items:center;
	justify-content:flex-start;
	transition:var(--transition-all);
}
div.expert.single {
	max-width:500px;
	margin-bottom:40px;
}
div.expert.nohover:hover {
	border:2px solid var(--gray-border);
	box-shadow:none;
}
div.expert:hover {
	border:2px solid var(--textblack);
	box-shadow:var(--shadow-gray);
	transition:var(--transition-all);
}
div.expert.selected {
	border:2px solid var(--textblack);
	box-shadow:var(--shadow-gray);
}

div.expert .photo img, div.expert .photo span.nophoto {
	border-radius:calc(var(--border-radius-big) - 4px);
	margin:8px;
	margin-bottom:8px;
	width:122px;
	height:121px;
	display:block;
}
div.expert .photo span.nophoto {
	
	background:var(--graybg) url(../images/icon-user-gray.svg) 50% 50% no-repeat;
	background-size:50px auto;
}

div.expert .expertdetails {
	display:flex;
	flex-direction:column;
	
	margin-left:17px;
	padding-right:20px;
}
div.expert .expertdetails h3 {
	margin:0;
	margin-bottom:5px;
	position:relative;
}
div.expert .expertdetails h3.verified::after {
	background:url(../images/icon-verified.svg) 50% 50% no-repeat;
	width:20px;
	height:20px;
	display:inline-block;
	content:" ";
	position:relative;
	right:-3px;
	top:3px;
}
div.expert .expertdetails span.location {
	width:100%;
	background:url(../images/icon-location.svg) 0% 50% no-repeat;
	padding-left:20px;
	margin-bottom:5px;
}

div.expert ul.rating {
	display:flex;
	margin:0;
	padding:0;
	gap:5px;
}
div.expert ul.rating li {
	list-style:none;
	width:20px;
	height:20px;
}
div.expert ul.rating li.star {
	background:url(../images/rating-star-solid.svg) 50% 50% no-repeat;
}
div.expert ul.rating li.nostar {
	background:url(../images/rating-star-outlined.svg) 50% 50% no-repeat;
}
div.expert ul.rating li.halfstar {
	background:url(../images/rating-star-half.svg) 50% 50% no-repeat;
}


/*payment*/
.paymentform {
	display:flex;
	flex-direction:column;
	gap:10px;
	margin-bottom:40px;
	max-width:397px;
}
.paymentform .additional {
	display:flex;	
	gap:10px;
}
.inputfield {
	position:relative;
	width:100%;
}
.inputfield input,.inputfield select  {
	width:100%;
	min-height:52px;
	border:1px solid var(--gray-border);
	outline:none;
	border-radius:30px;
	font-size:20px;
	font-family:var(--mainfont);
	padding-left:20px;
	box-sizing:border-box;
	font-variant-numeric: tabular-nums;
	
	
}

.inputfield select, main.login .login-container .form-container select.forminput {
	padding:0;
	display:inline-block;	
	box-sizing:border-box;
	padding-top:0;
	line-height:65px;
	max-height:55px;
	
	 padding-left:18px; 
	-moz-padding-start: 15px;
	 -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
	background-image:url(../images/icon-arr-down.svg);
	background-repeat:no-repeat;
	background-position:calc(100% - 15px) 50%;
	
}
.inputfield select option {
	/* padding:0;
	padding-top:20px; */
	font-family:Arial;
	font-variant-numeric: tabular-nums;
}


.inputfield.creditcard input {
	background:url(../images/icon-visa-logo.svg) calc(100% - 20px) 50% no-repeat;
}

.inputfield input:placeholder, .inputfield select:placeholder  {
	color:var(--gray-input-text);
 
}
.inputfield label {
	position:absolute;
	left:21px;
	top:5px;
	transition:var(--transition-all);
	font-size:14px;
} 

.inputfield input:not(:placeholder-shown) + label {
  
  opacity:1;
  transition:var(--transition-all);
}
.inputfield input:not(:placeholder-shown) {
	padding-top:10px;
	
}
.inputfield select[value=''] {
  border:1px solid red !important;
}
.inputfield select:not(:checked) {
   color: gray;
   
}
.inputfield select option:checked + label {
   color: red;
   border:1px solid green !important;
}


.inputfield input:placeholder-shown + label {
  
  opacity:0;
  margin-top:10px;
  transition:var(--transition-all);
}
.inputfield input.validated {	
	border:1px solid var(--green);
}

nav.mobiletop {
	display:none;
}

/*notifications*/
.responsestatus {
	display:flex;
	width:100%;
	min-height:46px;
	margin-bottom:20px;
	align-items:center;
	justify-content:center;
	
	border-radius:50px;
	font-size:18px;
}

.responsestatus.ok {
	border:1px solid var(--green);
	color:var(--green);
}
.responsestatus.ok span {
	display:flex;
	padding-left:25px;
	background:url(../images/icon-checkmark-green.svg) 0% 50% no-repeat;
}



/*popup default*/


.popup-default {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	background:rgba(0,0,0,0.3);
	z-index:999;
	backdrop-filter: blur(10px);
	display:flex;
	align-items:center;
	justify-content:center;
}
.popup-default .content-block {
	width:100%;
	max-width:1000px;
	min-width:400px;
	margin:40px;
	background:var(--white);
	border-radius:var(--border-radius-big);
	padding:40px;
	box-sizing:border-box;
	position:relative;
	box-shadow: 0px 4px 35px rgba(0, 0, 0, 0.18);
}
.popup-default .content-block h1 {
	margin:0;
	padding:0;
	font-size:30px;
	font-weight:700;
	color:var(--textgray);
	margin-bottom:30px;
	display:flex;
	padding-right:40px;
}
.popup-default .content-block.withicon h1:before {
	width:42px;
	min-width:42px;
	min-height:30px;
	display:block;
	content:" ";
	margin-right:18px;
	background:url(../images/logo-color.svg) 50% 50% no-repeat;
}
.popup-default .content-block .content {
	display:flex;
	flex-direction:column;
}
.popup-default .content-block.withicon  .content {
	margin-left:60px;
}

.popup-default .content-block .content p {
	font-size:20px;
	color:var(--textgray);
	margin-top:0;
	padding:0;
}
.popup-default .content-block .content span.red {
	color:var(--red);
}

.popup-default .content-block .footer {
	display:flex;
}
.popup-default .content-block.withicon  .footer {
	margin-left:60px;
}

.popup-default .content-block .btnRegular {
	width:auto;
	min-width:150px;
	border:1px solid var(--textgray);
	color:var(--textgray);
 
	padding-left:30px;
	padding-right:30px;
	 
	transition:var(--transition-all);
}
.popup-default .content-block .btnRegular:hover {
	background:var(--textgray);
	border:1px solid var(--textgray);
	color:var(--white);
}
.popup-default .btnClose {
	width:30px;
	height:30px;
	position:absolute;
	display:block;
	right:40px;
	top:40px;
	background:url(../images/icon-cross-gray.svg) 50% 50% no-repeat;
}


/*default containers*/


div.borderedcontent {
	display:flex;
	flex-direction:column;
	width: 100%;	 
    border: 2px solid var(--gray-border);
    padding: 30px;
    box-sizing: border-box;
    border-radius: var(--border-radius-big);
	margin-bottom:20px;
}


@media screen and (max-width: 1366px) and (min-width: 1024px) {
	
	section.left {
		width:320px;
		min-width:320px;
	}
	section.main {
		    width: calc(100% - 320px);
	}
}

@media screen and (max-width: 1366px) {
	
	 
	
	div.contentblock {
		width:100%;
	}
	.contentlist {
		flex-direction:column;
	}
	
	
	.contentlist div.contentblock.fullwidth .extendedcontent {
		width:100%;
		margin:0;
	}
	
	.contentlist div.contentblock.fullwidth .extendedcontent.left {
		margin-bottom:40px;
	}
	
	
	.contentlist div.contentblock.wide {
		display:flex;
		flex-direction:column;
	}
	
	.contentlist div.contentblock.wide .extendedcontent {
		width:100%;
		margin-left:0;
		margin-right:0;
	}
	.contentlist div.contentblock.wide .extendedcontent.right {
		order:1;
		margin-bottom:40px;
	}
	
	.contentlist div.contentblock.wide .extendedcontent.fullwidth {
		order:3;
	}
	
	.contentlist div.contentblock.wide .extendedcontent.left {
		order:2;
	}
	
	
	.expertlist {
		display: grid;
		grid-template-columns: repeat(2, 50%);
		width: calc(100% - 30px);
		gap: 30px;
		margin-bottom: 30px;
	}

}

/*mobile responsive*/
@media screen and (max-width: 1025px) {
		section.left {
			margin-left:-360px;
			transition:margin 0.5s ease;
		}
		
		section.main {
			width:100%;
			padding:30px;
		}
		nav.top {
			display:none;
		}
		
		nav.mobiletop {
			display:flex;
			margin-bottom:15px;
		}
		nav.mobiletop .logocontainer {
			flex-grow:4;
			display:flex;
			justify-content:center !Important;
		}
		nav.mobiletop .logo {
			height:47px;
			 
			
		}
		
		nav.mobiletop .logo > img {
			margin-left:0;
		}
		nav.mobiletop a {
			background:url(../images/btn-hamburger.svg) 50% 50% no-repeat;
			width:47px;
			height:47px;
		}


	/*menu*/
	
	body.showmobilemenu {
		background:var(--gray-input);
	}
	main {
		transition:var(--transition-all);
	}

	body.showmobilemenu main {
		transform: scaleY(.9);
		border-radius: 25px;
		margin-left: calc(-100vw + 40px);
		
		box-shadow:var(--shadow-gray);
		transition:var(--transition-all);
	}
	body.showmobilemenu main .btnhamburger {
		opacity:0;
		
	}
	body.showmobilemenu .mobilemenu {
		display:block;
		right:0;
	}
	
	@media screen and (max-width: 850px) {
	
		main.login header ul {
			display:none;
		}
		main.login header {
			align-items:center;
			justify-content:center;
		}
	}
	@media screen and (max-width: 750px) {
		.expertlist {
			display: grid;
			grid-template-columns: repeat(1, 100%);
			width: 100%;
			gap: 15px;
			margin-bottom: 30px;
		}
		
		.ekginfocontainer {
			flex-direction:column;
		}
		
		
	}
	
	@media screen and (max-width: 600px) {
	
	.contentlist.col1 {
		min-width:320px;
	}
	.btnRegular.support {
		min-width:100%;
	}
	
	ul.ekg-list {
		flex-direction:column;
		display:flex;
	}
	ul.ekg-list li {
		width:100%;
	}
	ul.info {
		flex-direction:column;
	}
	
	.contentlist.col3 div.contentblock {
		min-width:320px;
	}
	.contentlist.col3 {
		min-width:320px;
	}
	
	.contentlist div.contentblock.wide .extendedcontent.right {
		display:flex;
		flex-direction:column;
	}
	/*info*/
	
	div.info {
		padding-left:30px;
		padding-top:170px;
		
	}
	div.info.bulb {
		background-position:50% 35px;
	}
	
	div.info.infosign {
	 
	background-position:50% 50px;
	}
	div.info.warning {
		 
		background-position:50% 50px;
	}
	div.info.payment {
		 
		background-position:50% 45px;
	}
	div.info.sucess {
		 
		background-position:50% 50px;
	}
		
	div.info.outlined {
		padding-left:30px;
		padding-top:130px;
	}
	
	.btnRegular, .btnRegular.proceed {
		min-width:auto;
		width:100%;
	}
	
	section.main {
		padding:20px;
	}
	.contentlist {
		gap:20px;
	}
	.contentlist div.contentblock.fullwidth {
		padding:20px;
	}
	div.status {
		margin-bottom:20px;
	}
	.contentblock.fullwidth.nohover div.expert.single {
		margin-bottom:0px;
	}  
	
	/*info*/
	ul.info {
		width:auto;
		float:left;
		display:block;
		margin-bottom:0;
	}
	ul.info li {
		display:flex;
		flex-direction:row;
		flex-grow:0;
		width:100%;
		margin-right:0;
		margin-bottom:20px;
		padding-right:0;
	}
	ul.info li span {
		float:left;
		display:inline-block;
		width:auto;
		 
	}
	ul.info li span.hd {
		width:150px;
	}
	
	ul.info li.button {
		width:100%;
	}
	/* ul.info li.button:last-child {
		margin-bottom:0;
	} */
	ul.info li.button a {
		width:100%;
		border-radius:50px;
	}
	
	div.innercontainer {
		flex-direction:column;
		gap:0;
	}
	div.innercontainer div.status {
		margin-bottom:20px;
	}
	div.innercontainer .btnCircle {
		margin-bottom:20px;
		width:100%;
		border-radius:50px;
	}
	
	/*breadcrumb*/
	ul.breadcrumb {
		flex-wrap:wrap;
		align-items:center;
		justify-content:center;
	}
	ul.breadcrumb li.active {
		 
		align-items:center;
		justify-content:center;
		display:flex;
		 
	}
	ul.breadcrumb li.active a {
		width:auto;
		display:inline-block;
		padding-left:15px;
		padding-right:15px;
	}
	ul.breadcrumb li a {
		min-width:32px;
		min-height:32px;
		padding-top:5px;
		padding-bottom:5px;
		font-size:16px;
	}
	
	
	
	
	
	
	/*login*/
	main.login section.inner {
		
	}
	main.login {
		padding:0;
	}
		@media screen and (max-width: 500px) {
		main.login .login-container {
			padding:30px 30px;
			margin-top:0;
			margin-left:10px;
			margin-right:10px;
		}
		}
	}
	
	
	
	
	
	
	
	
	
	
}