﻿    .single-page-nav {
        background: rgba(0, 0, 50 , 0.85);
        padding: 1.0em 0;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
    }
    .single-page-nav ul {
        list-style: none;
        padding: 0;
        margin: 0 auto;
        width: 50%;
        overflow: hidden;
    }
    .single-page-nav li {
        float: left;
        width: 33%;
        text-align: center;
    }
    .single-page-nav a {
        display: block;
        color: #fff;
        text-decoration: none;
        font-size: 0.9em;
        line-height:1.0em;
        font-weight: 600;
        border:0px
    }
    .single-page-nav a:hover, .single-page-nav .current {
        color: #fffdcc;
    }
    .section {
        width: 960px;
        padding: 0px 0px;
        margin: 0 auto;
        background: transparent;
        border-top: 0px solid #eee;
    }
    #section1 {
        padding-top: 5em;
    }


    .ErrSummaryCSS
    {
        color:#cc0000;
        padding:0px;
        margin:0px;
        min-height:80px;
    }
    .ErrClass
    {
        color:#cc0000;
        min-height:80px;
        padding:0px;
        margin:0px;
    }



 /*NEW*/

 
 div.sSubstrate
 {
    background: rgba(255, 255, 255, 0.85);  
    position:absolute;  
    right:20px;
    width:400px;
    height:70px;
    margin:0px;
    padding:0px;

    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
 }
 p.sSubstrate
 {
    color: rgba(0, 0, 50, 0.95);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 35px;
    font-weight:200;
    line-height: 70px;
    text-align:left;
    margin:0px;
    padding:0px;
    padding-left:25px;
    padding-top:-15px;
 }
 div.sSubstrateText
 {
    position:absolute;  
    top:0px;
    left:0px;   
    height:70px;
    margin:0px;
    padding:0px;
 }
 
 div.sSubstrate-Order
 {     
    top:50px;    
 }
 div.sSubstrate-Phone
 {     
    top:130px;    
 }
 
div.RoundButton-Phone
{
    background: rgba(100, 199, 87, 0.75);
    border:2px solid white;
}
div.RoundButton-Order
{
    background: rgba(48, 184, 242, 0.85);
    border:2px solid white;
}
div.RoundButton
{         
    position:absolute;  
    top:5px;
    right:5px;
    width:56px;
    height:56px;
    margin:0px;
    padding:0px;

    -webkit-border-radius: 29px;
    -moz-border-radius: 29px;
    border-radius: 29px;

    -moz-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.9);
    -webkit-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.9);
    box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.9);
        
    cursor: pointer;

    -webkit-transition: background 0.25s;
            transition: background 0.25s;
}
div.RoundButton:hover 
{
    background: rgba(205, 0, 0, 0.95);

}
div.BackImageButton
{
    background-size: cover;
    background-position:center center;
    background-repeat: no-repeat;
    background-attachment:scroll;
    position:absolute;  
    top:5%;
    left:5%;
    width:90%;
    height:90%;
    opacity:0.8;

    -webkit-transition: opacity 0.25s;
            transition: opacity 0.25s;
}
div.BackImageButton:hover 
{
    opacity:1.0;
}
div.BackImageButton-Order
{    
    background-image: url('../Images/SinglePage/OrderAdd.png');    
}
div.BackImageButton-Phone 
{
    background-image: url('../Images/SinglePage/Phone_white.png'); 
    top:10%;
    left:10%;
    width:80%;
    height:80%;   
}

div.sLeftSubstrate
 {
    background: rgba(255, 255, 255, 0.85);  
    position:absolute;  
    left:0px;
    bottom:40px;
    width:350px;
    height:425px;
    margin:0px;
    padding:0px;

    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
 }
p.sLeftSubstrate
 {
    color: rgba(0, 0, 30, 0.85);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 50px;
    font-weight:200;
    line-height: 50px;
    text-align:center;
    margin:0px;
    padding:20px 20px 0px 20px;    
 }
p.sLeftSubstrateSmall
 {
    color: rgba(204, 0, 0, 0.85);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 25px;
    font-weight:200;
    line-height: 25px;
    text-align:center;
    margin:0px;
    padding:20px 20px 0px 20px;    
 }
p.sLeftBigSubstrate
 {
    color: rgba(48, 184, 242, 0.85);;
    font-family: Tahoma, Geneva, Verdana, sans-serif;
    font-size: 250px;
    font-weight:400;
    line-height: 250px;
    text-align:center;
    margin:0px;
    padding:0px;
    
    text-shadow: 
		-0 -3px 2px #FFFFFF,
		 0 -3px 2px #FFFFFF,
		-0 3px 2px #FFFFFF,
		 0 3px 2px #FFFFFF,
		-3px -0   2px #FFFFFF,
		 3px -0   2px #FFFFFF,
		-3px  0   2px #FFFFFF,
		 3px  0   2px #FFFFFF,
		-1px -3px 2px #FFFFFF,
		 1px -3px 2px #FFFFFF,
		-1px  3px 2px #FFFFFF,
		 1px  3px 2px #FFFFFF,
		-3px -1px 2px #FFFFFF,
		 3px -1px 2px #FFFFFF,
		-3px  1px 2px #FFFFFF,
		 3px  1px 2px #FFFFFF,
		-2px -3px 2px #FFFFFF,
		 2px -3px 2px #FFFFFF,
		-2px  3px 2px #FFFFFF,
		 2px  3px 2px #FFFFFF,
		-3px -2px 2px #FFFFFF,
		 3px -2px 2px #FFFFFF,
		-3px  2px 2px #FFFFFF,
		 3px  2px 2px #FFFFFF,
		-3px -3px 2px #FFFFFF,
		 3px -3px 2px #FFFFFF,
		-3px  3px 2px #FFFFFF,
		 3px  3px 2px #FFFFFF,
		-3px -3px 2px #FFFFFF,
		 3px -3px 2px #FFFFFF,
		-3px  3px 2px #FFFFFF,
		 3px  3px 2px #FFFFFF;    
 }

div.sLogoSubstrate
 {
    background: rgba(255, 255, 255, 0.85);  
    position:absolute;  
    right:20px;
    bottom:20px;
    width:250px;
    height:250px;
    margin:0px;
    padding:0px;

    -webkit-border-radius: 125px;
    -moz-border-radius: 125px;
    border-radius: 125px;

    border:4px solid white;

    cursor: pointer;

    -webkit-transition: background 0.25s;
    transition: background 0.25s;
 }
div.BackImageLogo
{
    background-image: url('../Images/SinglePage/Logo.png');
    background-size: cover;
    background-position:center center;
    background-repeat: no-repeat;
    background-attachment:scroll;
    position:absolute;  
    top:25px;
    left:82px;
    width:86px;
    height:89px;
    opacity:0.8;    
}
div.sLogoSubstrate:hover 
{
    background: rgba(48, 184, 242, 0.95);

}
p.sLogoSubstrate
 {
    color: rgba(0, 0, 0, 0.95);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 23px;
    font-weight:400;
    line-height: 25px;
    text-align:center;
    margin:0px;
    padding:120px 20px 0px 20px;   
    
    text-shadow: 
		-0   -1px 1px #FFFFFF,
		 0   -1px 1px #FFFFFF,
		-0    1px 1px #FFFFFF,
		 0    1px 1px #FFFFFF,
		-1px -0   1px #FFFFFF,
		 1px -0   1px #FFFFFF,
		-1px  0   1px #FFFFFF,
		 1px  0   1px #FFFFFF,
		-1px -1px 1px #FFFFFF,
		 1px -1px 1px #FFFFFF,
		-1px  1px 1px #FFFFFF,
		 1px  1px 1px #FFFFFF,
		-1px -1px 1px #FFFFFF,
		 1px -1px 1px #FFFFFF,
		-1px  1px 1px #FFFFFF,
		 1px  1px 1px #FFFFFF;
 }
p.sLogoSubstrateSmall
 {
    color: rgba(0, 0, 0, 0.95);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
    font-weight:400;
    line-height: 18px;
    text-align:center;
    margin:0px;
    padding:10px 30px 0px 30px;
    
    text-shadow: 
		-0   -1px 1px #FFFFFF,
		 0   -1px 1px #FFFFFF,
		-0    1px 1px #FFFFFF,
		 0    1px 1px #FFFFFF,
		-1px -0   1px #FFFFFF,
		 1px -0   1px #FFFFFF,
		-1px  0   1px #FFFFFF,
		 1px  0   1px #FFFFFF,
		-1px -1px 1px #FFFFFF,
		 1px -1px 1px #FFFFFF,
		-1px  1px 1px #FFFFFF,
		 1px  1px 1px #FFFFFF,
		-1px -1px 1px #FFFFFF,
		 1px -1px 1px #FFFFFF,
		-1px  1px 1px #FFFFFF,
		 1px  1px 1px #FFFFFF;  
 }

    div.HeadBlock
    {
        width: 920px;
        min-height: 50px;
        margin:0px;
        padding:20px;
        background-color:rgba(255, 255, 255, 0.80);
    }
    h1.HeadBlock
    {
        color:rgba(0, 0, 50, 0.95);
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 40px;
        font-weight:400;
        line-height: 45px;
        text-align:center;
        margin:0px;
        padding:0px;
    }

    div.BodyBlock
    {
        width: 960px;
        min-height: 50px;
        margin:0px;
        padding:0px;
        background-color:rgba(0, 0, 50, 0.3);
    }
    div.BodyBlockText
    {
        width: 320px;
        height: 90px;
        margin:0px;
        padding:0px;
        background-color:rgba(255, 255, 255, 0.8);
    }
    p.BodyBlockText
 {
    color: rgba(0, 0, 0, 0.95);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 24px;
    font-weight:600;
    line-height: 26px;
    text-align:center;
    margin:0px;
    padding:0px 20px 0px 20px; 
 }

    div.RingFrame
    {
        background-image: url('../Images/SinglePage/RingFrame.png');
        background-size: cover;
        background-position:center center;
        background-repeat: no-repeat;
        background-attachment:scroll;
        position:relative;       
        width:320px;
        height:320px;
        opacity:0.8;    
    }

    div.RingFrameImage
    {
        background-size: cover;
        background-position:center center;
        background-repeat: no-repeat;
        background-attachment:scroll;
        position:relative;       
        width:240px;
        height:240px;
        opacity:0.9;
        margin: 38px;
        border:2px solid white;

        background-size: 200px 200px;
        
        -webkit-border-radius: 120px;
        -moz-border-radius: 120px;
        border-radius: 120px;   
    }
    div.RingFrame-Accredit
    {
        background-image: url('../Images/SinglePage/Screen.png');            
    }
    div.RingFrame-Samself
    {
        background-image: url('../Images/SinglePage/Barometr.png');            
    }
    div.RingFrame-Time
    {
        background-image: url('../Images/SinglePage/Hourglass.png');            
    }
    div.RingFrame-Diagnostic
    {
        background-image: url('../Images/SinglePage/Prof.png');            
    }
    div.RingFrame-Montage
    {
        background-image: url('../Images/SinglePage/Montage.png'); 
        background-size: 190px 190px;           
    }
    div.RingFrame-Tools
    {
        background-image: url('../Images/SinglePage/Tools.png');
        background-size: 190px 190px;             
    }
    div.RingFrame-Simulate
    {
        background-image: url('../Images/SinglePage/Simulate.png'); 
        background-size: 240px 240px;           
    }
    div.RingFrame-Contract
    {
        background-image: url('../Images/SinglePage/Contract.png');
    }
    div.RingFrame-Quality
    {
        background-image: url('../Images/SinglePage/Quality.png');
    }
    div.RingFrame-Battary
    {
        background-image: url('../Images/SinglePage/Battary.png');
    }
    div.RingFrame-Units
    {
        background-image: url('../Images/SinglePage/Units.png');
    }
    div.RingFrame-Options
    {
        background-image: url('../Images/SinglePage/Options.png');
    }

    div.SpolerFrame
    {
        background-color:rgba(0, 0, 50, 0.75);
        background-image: url('../Images/SinglePage/Plus.png');
        background-size: cover;
        background-size: 50px 50px;
        background-position:15px 15px;
        background-repeat: no-repeat;
        background-attachment:scroll;        
        position:relative;       
        width:860px;
        height:80px;
          
        color: rgba(220, 220, 255, 0.95);
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 35px;
        font-weight:600;
        line-height: 80px;
        text-align:left;
        margin:0px;
        padding:0px 20px 0px 80px;
        
        cursor:pointer; 
        
        -webkit-transition: background-color ease-in-out 0.2s, color ease-in-out 0.2s;
        transition: background-color ease-in-out 0.2s, color ease-in-out 0.2s; 
    }
    div.SpolerFrameOpen
    {
        background-color:rgba(200, 0, 50, 0.75);        
        background-image: url('../Images/SinglePage/Cross.png');
        color: rgba(255, 220, 255, 0.95);
    }

    div.SpolerFrame:hover, div.SpolerFrameOpen:hover
    {
        background-color:rgba(00, 0, 0, 1.0);
        color: rgba(255, 255, 255, 0.85);
    }
      
    
    div.SpolerBody
    {
        background-color:rgba(0, 0, 50, 0.3);        
        position:relative;       
        width:960px;
        display:none;  
    }
    div.Footer
    {
        background-color:rgba(255, 255, 255, 0.8);        
        width:960px;
        height:35px;
        display:block;  
    }

    div.MarkFrame
    {
        background-color:rgba(255, 255, 255, 0.8);
        background-image: url('../Images/SinglePage/MarkerBlue.png');
        background-size: cover;
        background-size: 60px 60px;
        background-position:45px 15px;
        background-repeat: no-repeat;
        background-attachment:scroll;
        position:relative;       
        width:960px;
        min-height:80px;
            
    }
    p.MarkFrame
    {
        color: rgba(0, 0, 50, 0.95);
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 24px;
        font-weight:600;
        line-height: 26px;
        text-align:left;
        margin:0px;
        padding:30px 20px 0px 130px;
            
    }

    div.FrameStepByWork
    {        
        position:relative;       
        width:460px;
        height:180px;
        margin:10px;
        opacity:0.8; 
    }
    div.FrameStepByWork-Rect
    {
        background-color:rgba(255, 255, 255, 1.0);
           
        position:absolute;       
        width:400px;
        height:130px;
        left:50px;
        top:50px;

        -webkit-border-top-left-radius: 5px;
        -webkit-border-bottom-right-radius: 10px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-bottomright: 10px;
        border-top-left-radius: 5px;
        border-bottom-right-radius: 10px;
    }
    p.FrameStepByWork-Rect
    {
        color: rgba(0, 0, 50, 1.0);
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 25px;
        font-weight:400;
        line-height: 33px;
        text-align:justify;
        
        padding:0px;
        margin:0px;

        margin-right:30px;
        margin-bottom:30px;
    }
    div.FrameStepByWork-RectLeft
    {
        background-color:rgba(255, 255, 255, 1.0);
        
        position:absolute;       
        width:30px;
        height:125px;
        left:20px;
        top:55px;
        
        -webkit-border-bottom-left-radius: 10px; 
        -moz-border-radius-bottomleft: 10px; 
        border-bottom-left-radius: 10px;     
    }
    div.FrameStepByWork-RectTop
    {
        background-color:rgba(255, 255, 255, 1.0);
        
        position:absolute;       
        width:395px;
        height:30px;
        left:55px;
        top:20px;
        
        -webkit-border-top-right-radius: 10px;
        -moz-border-radius-topright: 10px;
        border-top-right-radius: 10px;
    }
    div.FrameStepByWork-Ring
    {
        background-color:rgba(255, 255, 255, 0.0);
        
        position:absolute;       
        width:45px;
        height:45px;
        left:0px;
        top:0px;

        border:10px solid white;

        -webkit-border-radius: 35px;
        -moz-border-radius: 35px;
        border-radius: 35px;

        color: rgba(255, 255, 255, 1.0);
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 35px;
        font-weight:600;
        line-height: 42px;
        text-align:center;
    }

    div.FooterButtons
    {
        background-color:rgba(0, 0, 50, 0.0);        
        position:relative;       
        width:960px;
        height:130px;
        display:block;
        margin-top:20px; 
        
        border-top:3px solid white; 
    }

    div.FooterButtonsLeft
    {
        left:30px; 
        top:30px; 
    }

    div.FooterButtonsRight
    {
        right:30px; 
        top:30px; 
    }