#demowrap {
	position:relative;
	width: 480px;
	margin: 40px 0 40px 100px;
	padding:10px;
	}	


#mywrapper { /* Main container with gray border */
	position:relative;
	width:454px;
	height:254px;
	border:5px solid #eee;
	}
#flag, [dummy] { /* Flag container inside #mywrapper with white border/*
				/* [dummy] at grouped selectors make CSS-declarations invisible for IE up to and including 				6 on Windows, thanks Sascha Claus at http://w3development.de/css/hide_css_from_browsers/more/  */
	position:absolute;
	width:450px;
	height:250px; 
	top:0;
	left:0;
	background:#be0027; 
	border:2px solid #fff;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#nw, #ne, #se, #sw, [dummy] { /* Four boxes inside #flag at northwest, northeast, southeast, southwest */
	width:200px;
	height:100px; 
	background:#be0027; 
	position:absolute; 
	border-style:solid; 
	border-color:#fff;
	}
#nw { 
	left:0; 
	top:0;
	border-width: 0 10px 10px 0;
	}
#ne { 
	right:0; 
	top:0;
	border-width: 0 0 10px 10px;
	}
#se { 
	right:0; 
	bottom:0;
	border-width: 10px 0 0 10px;
	}
#sw { 
	left:0; 
	bottom:0;
	border-width: 10px 10px 0 0;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* Each box above is container for 04 boxes at left-bottom, right-top, right-bottom, left-top */
/* So #nw-lb2 = second (the upper most) box at left-bottom of northwest container */ 

#nw-lb1, #nw-lb2, #nw-rt1, #nw-rt2, 
#ne-rb1, #ne-rb2, #ne-lt1, #ne-lt2,
#se-lb1, #se-lb2, #se-rt1, #se-rt2,   
#sw-rb1, #sw-rb2, #sw-lt1, #sw-lt2, [dummy]  {
	position:absolute;
	width:0;
	height:0;	
	border-color:transparent; 
	border-style:solid;	
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#nw-lb1, #nw-lb2, #se-lb1, #se-lb2 {
	left:0;
	bottom:0;
	}
#nw-rt1, #nw-rt2, #se-rt1, #se-rt2 {
	right:0;
	top:0;
	}
#ne-lt1, #ne-lt2, #sw-lt1, #sw-lt2  {
	left:0;
	top:0;
	}
#ne-rb1, #ne-rb2, #sw-rb1, #sw-rb2  {
	right:0;
	bottom:0;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#nw-lb1 { 
	border-width:0 170px 85px 0;
	border-bottom-color:#fff;
	}
#nw-lb2 {
	border-width:0 140px 70px 0;
	border-bottom-color:#3b5aa3;
	}
#nw-rt1 {
	border-width:0 180px 90px 0;
	border-right-color:#fff;
	}
#nw-rt2 {
	border-width:0 160px 80px 0;
	border-right-color:#3b5aa3;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#ne-rb1 { 
	border-width:85px 170px 0 0;
	border-right-color:#fff;
	}
#ne-rb2 {
	border-width:70px 140px 0 0;
	border-right-color:#3b5aa3;
	}
#ne-lt1 {
	border-width:90px 180px 0 0;
	border-top-color:#fff;
	}
#ne-lt2 {
	border-width:80px 160px 0 0;
	border-top-color:#3b5aa3;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#se-lb1 { 
	border-width:0 180px 90px 0;
	border-bottom-color:#fff;
	}
#se-lb2 { 
	border-width:0 160px 80px 0;
	border-bottom-color:#3b5aa3;
	}
#se-rt1 { 
	border-width:0 170px 85px 0;
	border-right-color:#fff;
	}
#se-rt2 {  
	border-width:0 140px 70px 0;
	border-right-color:#3b5aa3;
	}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#sw-rb1 {
	border-width:90px 180px 0 0;
	border-right-color:#fff;
	}
#sw-rb2 { 
	border-width:80px 160px 0 0;
	border-right-color:#3b5aa3;
	}
#sw-lt1 { 
	border-width:85px 170px 0 0;
	border-top-color:#fff;
	}
#sw-lt2 { 
	border-width:70px 140px 0 0;
	border-top-color:#3b5aa3;
	}
