/*青*/

/* Calc function add and sub
------------------------------------------------- */

#addition300px{
	position:relative;
	background:#ccc url(../img/bg_trans.gif) repeat;
	width:300px;
	border:2px solid #333;
}
#addition300px:after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:70%;
	height:100%;
	background:#cff;
	z-index:0;
}
#addition300px div{
	position:relative;
	z-index:1;
}
.add0px{
	background:#cff;
	width:70%;
}
.add5px{
	background:#fcc;
	width:-webkit-calc(70% + 5px);
	width:-moz-calc(70% + 5px);
	width:calc(70% + 5px);
}
.add23px{
	background:#fcc;
	width:-webkit-calc(70% + 23px);
	width:-moz-calc(70% + 23px);
	width:calc(70% + 23px);
}
.sub5px{
	background:#ccf;
	width:-webkit-calc(70% - 5px);
	width:-moz-calc(70% - 5px);
	width:calc(70% - 5px);
}
.sub23px{
	background:#ccf;
	width:-webkit-calc(70% - 23px);
	width:-moz-calc(70% - 23px);
	width:calc(70% - 23px);
}


/* Calc function multiplication
------------------------------------------------- */

#multiplication{
	font-size:10px;
}
#multiplication .nonmulti{
	font-size:20px;
}
#multiplication .multi2x{
	font-size:-webkit-calc(1em * 2);
	font-size:-moz-calc(1em * 2);
	font-size:calc(1em * 2);
}


/* Calc function division
------------------------------------------------- */
#division div{
	width: -webkit-calc(100% / 3);
	width: -moz-calc(100% / 3);
	width: calc(100% / 3);

	float: left;
	height: 100px;
	color: #fff;
}
#division .one {background: #333;}
#division .two {background: #666;}
#division .three {background: #999;}


/* Calc function mix1
------------------------------------------------- */

#mix1{
	border:1px solid #000;
	width : 500px ;
	float:left;
}
#mix1 .left {
	float:left;
	background:#666;
	width : -webkit-calc(100% * 1/5) ;
	width : -moz-calc(100% * 1/5) ;
	width : calc(100% * 1/5) ;
}
#mix1 .right {
	float:left;
	background:#999;
	width : -webkit-calc(100% * 4/5) ;
	width : -moz-calc(100% * 4/5) ;
	width : calc(100% * 4/5) ;
}

/* Calc function mix2
------------------------------------------------- */
#mix2 div{
	margin: 1em;
	border: solid 1px;
	float:left;
	width: -webkit-calc(100%/3 - 2*1em - 2*1px);
	width: -moz-calc(100%/3 - 2*1em - 2*1px);
	width: calc(100%/3 - 2*1em - 2*1px);
}



