@charset "utf-8";

/* JNANA 2021 VIDEO.CSS */
/* letzte Aenderung am 24.6.2021 um 9:00 Uhr CC*/

/* ~ iPhone8 plus: 414 x 736 ---------------- 1 -- */
@media only screen and (min-width: 380px) and (max-width: 991px) {
.vbox {
	width: 100%;
	margin-top: 40px;
	font-size: 25px;
	padding: 16px 0px 30px;
	position: relative;
	left: 0px;
	color: white;
	}
.pv-screenshot {
	margin-top: 10px;
	margin-bottom: 10px;
	}
.pv-boxtitel-1 {
	font-size: 30px;
	line-height: 103%;
	}
.pv-boxtitel-2 {
	font-size: 33px;
	margin-top: 4px;
	line-height: 103%;
	margin-bottom: 12px;
	}
.pv-txt-1 {
	font-size: 25px;
	line-height: 112%;
	margin-bottom: 5px;
	padding: 0px 6px;
	}
.iv-screenshot {
	width: 100%;
	height: auto;
	border-radius: 0px;
	}
.iv-pen {
	display: inline-block;
	height: 45px;
	}
}

/* ~ iPhone SE und 5s: 320 x 568 ------------ 2 -- */
/* Huawei P20: 360 x 760px */
@media only screen and (max-width : 379px) {
.vbox {
	width: 100%;
	margin-top: 25px;
	font-size: 25px;
	padding: 12px 0px 20px;
	position: relative;
	left: 0px;
	color: white;
	}
.pv-screenshot {
	margin-top: 10px;
	margin-bottom: 10px;
	}
.pv-boxtitel-1 {
	font-size: 27px;
	line-height: 103%;
	}
.pv-boxtitel-2 {
	font-size: 31px;
	margin-top: 4px;
	line-height: 103%;
	margin-bottom: 9px;
	}
.pv-txt-1 {
	font-size: 22px;
	line-height: 112%;
	padding: 0px 6px;
	margin-bottom: 7px;
	}
.iv-screenshot {
	width: 100%;
	height: auto;
	border-radius: 0px;
	}
.iv-pen {
	display: inline-block;
	height: 45px;
	}
}

/* ~ Tablet --------------------------------- 3 -- */
/* Pre-Design: 1112px, (iPad Pro) */
@media only screen and (min-width: 992px) and (max-width: 1499px) {
.vbox {
	position: relative;
	width: 80%;
	left: 10%;
	border-radius: 20px;
	border-width: 0px;
	font-size: 25px;
	padding: 20px 25px 35px;
	margin-bottom: 50px;
	color: white;
	}

.pv-screenshot {
	margin-top: 10px;
	}
.pv-boxtitel-1 {
	font-size: 30px;
	margin-top: 8px;
	}
.pv-boxtitel-2 {
	font-size: 33px;
	margin-top: -2px;
	line-height: 103%;
	margin-bottom: 8px;
	}
.pv-txt-1 {
	font-size: 27px;
	line-height: 112%;
	margin-bottom: 5px;
	padding: 0px 6px;
	}
.iv-screenshot {
	width: 60%;
	height: auto;
	border-radius: 15px;
	}
.iv-pen {
	display: inline-block;
	position: relative;
	height: 65px;
	width: auto;
	}
}

/* ~ Desktop -------------------------------- 4 -- */
/* Pre-Design: 1680px (mein Bildschirm) */
@media only screen and (min-width: 1500px) and (max-width: 1919px) {
.vbox {
	position: relative;
	left: -9px;
	width: 90%;
	border-radius: 20px;
	border-width: 0px;
	font-size: 25px;
	padding: 25px 25px;
	margin-bottom: 50px;
	color: white;
	}

.pv-screenshot {
	margin-top: 0px;
	}
.pv-boxtitel-1 {
	font-size: 28px;
	margin-top: 8px;
	}
.pv-boxtitel-2 {
	font-size: 33px;
	margin-top: -2px;
	line-height: 103%;
	margin-bottom: 5px;
	}
.pv-txt-1 {
	font-size: 27px;
	line-height: 108%;
	margin-bottom: 5px;
	}
.iv-screenshot {
	width: 70%;
	height: auto;
	border-radius: 15px;
	}
.iv-pen {
	position: absolute;
	top: 15px;
	right: 25px;
	height: 65px;
	width: auto;
	}
}

/* ~ Large Screen --------------------------- 5 -- */
/* fixes Layout */
/* Heike: HD = 1920 * 1080px */
@media only screen and (min-width: 1920px) {
.vbox {
	position: relative;
	left: -15px;
	width: 90%;
	border-radius: 20px;
	border-width: 0px;
	font-size: 25px;
	padding: 25px 30px;
	margin-bottom: 50px;
	color: white;
	}

.pv-screenshot {
	margin-top: 0px;
	}
.pv-boxtitel-1 {
	font-size: 31px;
	margin-top: 8px;
	}
.pv-boxtitel-2 {
	font-size: 35px;
	margin-top: -2px;
	line-height: 103%;
	margin-bottom: 5px;
	}
.pv-txt-1 {
	font-size: 27px;
	line-height: 108%;
	margin-bottom: 5px;
	}
.iv-screenshot {
	width: 70%;
	height: auto;
	border-radius: 15px;
	}
.iv-pen {
	position: absolute;
	top: 15px;
	right: 25px;
	height: 65px;
	width: auto;
	}
}