﻿

/*#mett_banner {*/
   /*left: 0px;*/
   /*top:66px;*/
   /*position:absolute;*/
    /*width:100%;*/
    /*height: 242px;*/
    /*#background:rgba(127,127,127,1);*/
    /*background:rgba(255,255,255,1)  url(../../img/calculator/banner.jpg) no-repeat;*/
/*}*/


.p1editor input[type="text"]
{
	color:#FFF !important;
}
.centerbox {
    color: white;

}

#titleslogan {
    left: 36px;
    top: 35px;
    position:absolute;
}

#textUncover {
    left: 36px;
    top: 0px;
    width: 280px;
    height: 150px;
    position: absolute;
    color: #666;
    font-size: 25px;
    letter-spacing: 1px;
    line-height: 27px;
    word-wrap: break-word;
}

.textline1 {
left: 0px;
top: 160px;
position: absolute;
    width: 60px;
    height:2px;
    background: rgba(17,70,148,1);
    #margin-top:20px;
}

.textline2 {
left: 0px;
top: 162px;
position: absolute;
    width: 60px;
    height:2px;
    background: rgba(37,95,166,1);
    #margin-top:0px;
}

#textfindout{
    left: 36px;
    top: 173px;
  /*  width: 172px;*/
    width: 200px;
    height: 150px;
    position: absolute;
    font-size: 14px;
    letter-spacing: 0px;
    line-height: 20px;
    #color: rgba(63,115,181,1);
}

.bgtext {
    #background: url(../../img/calculator/Mettler/box1.png);

}

.lbwarning,.lbw {
    color:rgba(166,223,43,1);
    display:none;
    font-size:12px;
}

/* ----------------------- PAGE 2 -------------------------*/

.page2labelheader {
    width: 270px;
    position:absolute;
}


.page2label {
    width: 170px;
    position:absolute;
    text-align: center;
}



/* TABLE PAGE 2*/


.tbl1 td {
    border:1px solid rgba(200,200,200,1);
}





#chartleft {
    left: 0px;
    bottom: 0px;
    width: 143px;
    height: 200px;
    position: absolute;
    #background: rgba(255,0,0,0.1);
    background:url(../../img/calculator/page2/bar2.png) ;
    border:1px solid #6666\9; 
}

#chartright {
    right: 0px;
    bottom: 0px;
    width: 143px;
    height: 200px;
    position: absolute;
    background: rgba(213,220,212,1);
    border:1px solid #6666\9;
}

#chartright_top {
    position:absolute;
    /*background:url(../../img/calculator/page2/bar1.png);*/
}


#chartright_bottom {
    bottom:0px;
    right:0px;
    width:100%;
    height:100px;
    position:absolute;	
	background:url(../../img/calculator/page2/bar1.png) ;
	background-position:center bottom;
	background-size:144px 225px;
}

#chartright_top {
    background:url(../../img/calculator/page2/arrow.png) no-repeat;
    background-position:center bottom;
    top:0px;
    right:0px;
    width:100%;
    height:100px;
    position:absolute;
}

#infoLeft {
    text-align:center;
    width:100%;
    height:100%;
	padding-top:90px\9;
    margin:0 auto;
}
#infoRight {
    text-align:center;
    width:100%;
    height:100%;
	width:auto\9;
	height:auto\9;
    margin:0 auto;
	padding-top:32%\9;
	opacity:0.4;
	filter: alpha(opacity=40)\9;	
	
}


 
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max--moz-device-pixel-ratio: 2) {

    .p1editor input[type="text"] {
        border: rgba(255,255,255,1) 2px solid;
        background-color: transparent;
        /* Other stuff: font-weight, font-size */
        width: 348px;
        height: 44px;
        position: absolute;
        font-size: 14px;
        letter-spacing: 0px;
        line-height: 17px;
        #color: rgba(0,0,0,1);
        color: #666;
        /*background: url(../../img/calculator/page1/box1@2x.png) no-repeat;*/
        background-size:346px 43px;
        text-align: right;
        padding-right:8px;
    }
    
    #p1_text3 {
	   left: 0px;
	   top: 218px;
	   width: 222px;
	   width: 155px\9;
	   position: absolute;
	   /*background: url(../../img/calculator/page1/box3.png) no-repeat;*/
	   
    }
    
    #chartright_top {
        background:url(../../img/calculator/page2/arrow@2x.png) no-repeat;
        background-position:center bottom;
        background-size:41px 49px;
        top:0px;
        right:0px;
        width:100%;
        height:100px;
        position:absolute;
    }
    
    #selectCustom {
		left: 415px;
		top: 218px;
		width: 110px;
		height: 43px;
		position: absolute;
		background:  url(../../img/calculator/page1/green-arrow1.png) no-repeat;
        /*url(../../img/calculator/page1/box4@2x.png) no-repeat*/
		background-position: 88px center  ,center center;
		background-position: 88px center  ,center center;
		background-size:15px 10px, 110px 43px;
		overflow:hidden;
	}

    


/* Page 2 */

   
    #btnPlay{
        left: 444px;
        top: 175px;
        width: 66px;
        height: 66px;
        position: absolute;
        background: url(../../img/calculator/page2/button1@2x.png) no-repeat;
        background-size:66px 66px;
        opacity:0;
        transition: 400ms;
    }

    #chartleft {	
        left: 0px;
        bottom: 0px;
        width: 143px;
        height: 200px;
        position: absolute;
        #background: rgba(255,0,0,0.1);
        background:url(../../img/calculator/page2/bar2@2x.png) ;
        background-size:144px 225px;
    }

    #chartright_bottom {        
        bottom:0px;
        right:0px;
        width:100%;
        height:100px;
        position:absolute;
		background:url(../../img/calculator/page2/bar1@2x.png) no-repeat;
		background-position:center bottom;
		background-size:144px 225px;
    }

    #chartright_top {
        background:url(../../img/calculator/page2/arrow@2x.png) no-repeat;
        background-position:center bottom;
        background-size:41px 49px;
        top:0px;
        right:0px;
        width:100%;
        height:100px;
        position:absolute;
    }
}


/* CENTER BOX */
#mett_banner,#chartleft,#chartright_bottom,#td1,#td2,#infoLeft, #infoRight
{
     /* Internet Explorer 10 */
    display:-ms-flexbox;
    -ms-flex-pack:center;
    -ms-flex-align:center;

    /* Firefox */
    display:-moz-box;
    -moz-box-pack:center;
    -moz-box-align:center;

    /* Safari, Opera, and Chrome */
    display:-webkit-box;
    -webkit-box-pack:center;
    -webkit-box-align:center;

    /* W3C */
    display:box;
    box-pack:center;
    box-align:center;
    #opacity:0.5;
    
    box-align: center;              /* As specified */
    -moz-box-align: center;         /* Mozilla */

}



.opt1 {
    color: red;
}


