/* Just some base styles not needed for example to function */
*, html { font-family: Verdana, Arial, Helvetica, sans-serif; -moz-box-sizing: border-box; }
body, form, ul, li, p, h1, h2, h3, h4, h5
{
  margin: 0;
  padding: 0;
}
body { color: #000; }
img { border: none; }


/* Branding */
#csslogo {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 2;
}

.logo_desktop {
  top: 3%;
}

.logo_mobile {
  bottom: 35%;
}

img.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.curtain_length_desktop {
  padding-bottom: 1000px;
}

.curtain_length_mobile {
  padding-bottom: 300px;
}

/* Max res (typical) = 1920 x 1200 (widescreen 16:1 - 1024H */
.curtain_height_desktop {
  height: 1200px;
}

/* Normal res = 640 x 960 */
.curtain_height_mobile {
  height: 640px;
}

body:after {
  content: "";
  height: 100%;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../png/Splash2.png);
  background-color: #000;
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 99.9%;
  z-index: 1;
}

/* Max resolution height on most monitors 1920x1200 */
.curtain {
	position: relative;
        background-position: 0% 100%;
        background-repeat: no-repeat;
        background-size: 99.9%;
	z-index: 3;
}

/* 
	Curtain effect using CSS gradients 
	http://meyerweb.com/eric/thoughts/2012/06/22/cicadients/
*/
.curtain {
	background-image:
		-webkit-linear-gradient(
			90deg,
			rgba(255,128,128,0.25),
			rgba(255,128,128,0) 75%
		),
		-webkit-linear-gradient(
			-1deg,
			transparent,
			transparent 30%,
			#510A0E 35%,
			#510A0E 40%,
			#61100F 43%,
			#B93F3A 50%,
			#4B0408 55%,
			#6A0F18 60%,
			#651015 65%,
			#510A0E 70%,
			#510A0E 75%,
			rgba(255,128,128,0) 80%,
			transparent
		),
		-webkit-linear-gradient(
			2deg,
			#510A0E,
			#510A0E 20%,
			#61100F 25%,
			#B93F3A 40%,
			#4B0408 50%,
			#6A0F18 70%,
			#651015 80%,
			#510A0E 90%,
			#510A0E
		);
	background-image:
		-moz-linear-gradient(
			90deg,
			rgba(255,128,128,0.25),
			rgba(255,128,128,0) 75%
		),
		-moz-linear-gradient(
			-1deg,
			transparent,
			transparent 30%,
			#510A0E 35%,
			#510A0E 40%,
			#61100F 43%,
			#B93F3A 50%,
			#4B0408 55%,
			#6A0F18 60%,
			#651015 65%,
			#510A0E 70%,
			#510A0E 75%,
			rgba(255,128,128,0) 80%,
			transparent
		),
		-moz-linear-gradient(
			2deg,
			#510A0E,
			#510A0E 20%,
			#61100F 25%,
			#B93F3A 40%,
			#4B0408 50%,
			#6A0F18 70%,
			#651015 80%,
			#510A0E 90%,
			#510A0E
		)		
		;
	background-image:
		-ms-linear-gradient(
			90deg,
			rgba(255,128,128,0.25),
			rgba(255,128,128,0) 75%
		),
		-ms-linear-gradient(
			-1deg,
			transparent,
			transparent 30%,
			#510A0E 35%,
			#510A0E 40%,
			#61100F 43%,
			#B93F3A 50%,
			#4B0408 55%,
			#6A0F18 60%,
			#651015 65%,
			#510A0E 70%,
			#510A0E 75%,
			rgba(255,128,128,0) 80%,
			transparent
		),
		-ms-linear-gradient(
			2deg,
			#510A0E,
			#510A0E 20%,
			#61100F 25%,
			#B93F3A 40%,
			#4B0408 50%,
			#6A0F18 70%,
			#651015 80%,
			#510A0E 90%,
			#510A0E
		);
	background-image:
		-o-linear-gradient(
			90deg,
			rgba(255,128,128,0.25),
			rgba(255,128,128,0) 75%
		),
		-o-linear-gradient(
			-1deg,
			transparent,
			transparent 30%,
			#510A0E 35%,
			#510A0E 40%,
			#61100F 43%,
			#B93F3A 50%,
			#4B0408 55%,
			#6A0F18 60%,
			#651015 65%,
			#510A0E 70%,
			#510A0E 75%,
			rgba(255,128,128,0) 80%,
			transparent
		),
		-o-linear-gradient(
			2deg,
			#510A0E,
			#510A0E 20%,
			#61100F 25%,
			#B93F3A 40%,
			#4B0408 50%,
			#6A0F18 70%,
			#651015 80%,
			#510A0E 90%,
			#510A0E
		);
	background-image:
		linear-gradient(
			90deg,
			rgba(255,128,128,0.25),
			rgba(255,128,128,0) 75%
		),
		linear-gradient(
			-1deg,
			transparent,
			transparent 30%,
			#510A0E 35%,
			#510A0E 40%,
			#61100F 43%,
			#B93F3A 50%,
			#4B0408 55%,
			#6A0F18 60%,
			#651015 65%,
			#510A0E 70%,
			#510A0E 75%,
			rgba(255,128,128,0) 80%,
			transparent
		),
		linear-gradient(
			2deg,
			#510A0E,
			#510A0E 20%,
			#61100F 25%,
			#B93F3A 40%,
			#4B0408 50%,
			#6A0F18 70%,
			#651015 80%,
			#510A0E 90%,
			#510A0E
		);
	background-size:
		auto,
		300px 100%,
		109px 100%;
	background-repeat: repeat-x;
}