﻿.box
{
  border:1px solid black;
  width:99%;
  height:100%;
  float:left;
  background-color:#fff; /*#f2f2f2;*/
  font-family:'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  margin-top:4%;
}

.header_box
{
  border:0px solid #1FA7C0;
  width:99%;
  height:20%;
  background-color:#f2f2f2;
  margin-bottom:2px;
  float:left;
}

.header_box p
{
    border:1px solid #CCCCCC;
    font-size:34px;
    color:black;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    float:left;
}

.box_footer
{
  margin-top:80px;
  border:0px solid #CCCCCC;
  width:99%;
  height:100%;
  background-color:#f2f2f2;
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
}

/*Index*/
.span_block
{
  border:0px solid black;
  font-size:18px;
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  width:99%; 
  margin-left:2px;
  text-align:center;
}

.p_line
{
    width:500px; 
    border:0px solid #fff;
    font-size:14px;   
    color:red;
    float:left;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
}

.div_Lang
{
  border:0px solid black;
  width:100%;
  height:200px;
  
  margin-left:2px;
  margin-top:30px;
  
  font-size:16px;   
  float:left;
}

.div_button
{
  border:0px solid black;
  width:100%;
  height:150px;
  margin-left:2px; 
  margin-top:100px;
  color:white;
}

.div_button input
{
   width:450px;
   height:80px;
   margin-top:40px;
   font-size:18px; 
   border:0px;
   background-color:#29A1C0;
   cursor:pointer;
   color:white;
}

/* Blank */

.div_header_title
{
    border:0px solid #000;
    margin-left:10px;
    height:40%;
    float:left;
    position:absolute;
    bottom:40%;
}

.div_header_title span
{
    border:0px solid #CCCCCC;
    font-size:30px;
    color:#888888;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    float:left;
    margin-top:2%;
}

.div_line
{
    border-top:2px solid #1FA7C0;
    width:300px;
    height:1px;
    margin-left:10px;
    margin-bottom:2%;
}

.reg_number
{
   border:0px solid black;
   width:500px;
   height:70px;
   margin-left:10px;
}

.reg_number input
{
   width:30px;
   height:50px;
   float:left;
   margin-left:4px;
   margin-top:6px;
   font-size:36px;
   background-color:#CCC;
   border:0px;
   text-align:center;
}

.title
{
    color:Black;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    font-size:16px;
    font-weight:600;
}

.footer_button
{
  border:0px solid black;
  width:99%;
  height:7%;
  margin-left:0px; 
  float:right;
  position: absolute; bottom: 0;
}

    .footer_button input
    {
        font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
        float: right;
        margin-right: 4px;
        width: 300px;
        height: 74%;
        margin-top: 0.2%;
        font-size: 20px;
        cursor: pointer;
        font-weight: 600;
        color: #fff;
        -ms-border-radius: 5px;
        border-radius: 3px;
        border: 1px solid #269ab8;
    }

.footer_button_blu input
{
    background: #28b6db;
    background: -moz-linear-gradient(top, #28b6db, #29a2c1);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #28b6db), color-stop(100%, #29a2c1));
    background: -webkit-linear-gradient(top, #28b6db, #29a2c1);
    background: -o-linear-gradient(top, #28b6db, #29a2c1);
    background: -ms-linear-gradient(top, #28b6db, #29a2c1);
    background: linear-gradient(#28b6db, #29a2c1);

    -webkit-box-shadow: inset 0 2px 1px -1px rgba(255, 255, 255, .7), 0 2px 3px rgba(0, 0, 0, .25);
    -ms-box-shadow: inset 0 2px 1px -1px rgba(255, 255, 255, .7), 0 2px 3px rgba(0, 0, 0, .25);
    box-shadow: inset 0 2px 1px -1px rgba(255, 255, 255, .7), 0 2px 3px rgba(0, 0, 0, .25);
}

.message_for_Step
{
  border:0px solid black;
  width:100%;
  height:150px;
  margin-top:20px;
}

/*Register*/

/*Record KIM*/

.divImage
{
  border:0px solid black;
  width:80px;
  height:125px;
  margin-top:4%;
  margin-left:140px;
  background-image:url(/Images/mic-fon.png);
  float:left;
}


/*Player */

.divPayer
{
  border:0px solid black;
  width:850px;
  height:60px;
  margin-top:100px;
}

.music
{
   float:left;    
   font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
   font-size:16px;
   margin-top:20px;
   margin-left:32px;
   font-weight:600;
   color:#666;
}

.divClock
{
  border:0px solid black;
  width:120px;
  height:40px;
  margin-left:1px;
  float:left;
}
.divClock span
{
    color:#666;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    font-size:36px;   
    margin-top:0%;
    float:left;
}

.divPlay
{
  border:0px solid black;
  width:100px;
  height:50px;
  margin-left:4px;
  float:left;
}
.divPlay img
{
    margin-left:15px;
    margin-top:5px;
    float:left;
}

.divPlay img:hover
{
    cursor:pointer;
}

.divProgressBar
{
  border:0px solid #000;
  width:55%;
  height:50px;
  margin-left:1%;
  float:left;
}

.divProgressBar p
{
    border:4px solid #CCC;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    font-size:56px;   
    margin-top:30px;
    width:600px;
    float:left;
}

/*Exam */


.startExam
{
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    border:1px solid black;
    width:100%;
    height:8%;
    top:10%;
    font-weight:400;
    font-size:44px;
    text-align:center;
}


.labelExam
{
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    border:0px solid black;
    width:99%;
    height:50px;
    margin-left:0px;
    font-size:44px;
    text-align:center;
}

.secondTime
{
     border:0px solid black;
     width:80%;
     height:50%;
     float:left;
     margin-left:10%;
     margin-top:10%;
     font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
}

.secondTime div
{
    color:#29A1C0;
    border:0px solid black;
    margin-left:5%;
    font-size:134px;
    width:90%;
    text-align:center;
}

.image
{
    border: 1px solid #000;
    width: 98%;
    height: 84%;
    float: left;
    margin-top: 1%;
    margin-left: 0.5%;
}

.preparation
{
      width:98%;
      border:0px solid #ccc;
      height:40px;
      float:left;
      font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
     
}

.preparation span
{
    font-size:28px;
    float:left;
    margin-left:1px;
    margin-top:0px;
    border:0px solid #000; 
    color:#666; 
    
}

    .preparation p
    {
        border: 2px solid #CCC;
        width: 78%;
        float: left;
    }

    .preparation div
    {
        border: 1px solid #ccc;
        width: 78%;
        height: 3px;
        float: left;
        margin-left: 2%;
        margin-top: 20px;
        background-color: #666;
    }
        .preparation div > div
        {
            border: 0px solid #CCC;
            width:1px;
            float: left;
            margin-top: 0;
            margin-left: 0;
            height: 3px;
            background-color: #ff0000;
        }


.preparation input
{  
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  float:right;
  margin-right:10px;
  width:120px;
  height:35px;
  margin-top:2px;
  font-size:20px; 
  border:0px solid blue;     
  background-color:#29A1C0;
  cursor:pointer;
  font-weight:600;
  color:#fff;   
}

/*    */

.listen
{
    border: 0 solid #000;
    width: 99%;
    height: 32px;
    font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
    text-align: center;
    font-size: 26px;
    float: left;
    margin-top: 0%;
}


/* Main */
.table_form
{
  border:0px solid #000;
  width:50%;
  height:32px;
  font-family: 'Segoe UI Light Light','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  text-align:center;
  float:left;
  margin-top:2%;
  margin-left:25%;
}

.table_form td
{
    border:0px solid #ccc;
    height:50px;
}

.table_form td span
{
     font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
     font-size:24px;
     font-weight:600;
     margin-top:20px;
     float:left;
     margin-left:4px;
}

.table_form td div
{
      border:0px solid #ccc;
      float:left;
      height:150px;
      width:100%;
      margin-top:3px;
      box-shadow:1px 1px 1px 1px #ccc;
}

.table_form td input
{
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  float:right;
  margin-left:50px;
  width:100%;
  height:50px;
  margin-top:4px;
  font-size:20px; 
  border:0px solid blue;     
  background-color:#24B45E;
  cursor:pointer;
  font-weight:600;
  color:#fff;
}

.table_footer
{
    border:0px solid #000;
    float:left;
    width:98%;
    margin-top:2px;
}
.table_footer img
{
    margin-left:26%;
}

/* Список шагов  */

.traning_table
{
  border:0px solid #000;
  width:98%;
  height:32px;
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  text-align:center;
  float:left;
  margin-top:100px;
  margin-left:20px;
}

.traning_table td
{
     border:1px solid #ccc;
     box-shadow:2px 2px 1px 1px #CCC;
}


/*Tile*/

.tile_box
{
  border:0px solid #000;
  width:40%;
  height:30%;
  font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
  text-align:center;
  float:left;
  margin-top:6%;
  margin-left:25%;
  position:relative;
}

.tile_box table
{
   border:0px solid #000;
   width:100%;
   height:30%;
}
.tile_box table td
{
   border:0px solid #000;
   width:50%;
}

.tile_box table td div
{
   border:0px solid #FFF;
   width:100%;
   height:80px;
   
   box-shadow:1px 2px 0px 0px #CCC;
   
   background-color:#24B45E;
   color:#fff;
   text-align:center;
   font-family: 'Segoe UI','Lucida Grande',Verdana, Arial, Helvetica, sans-serif;
   font-size:24px;
}

.tile_box table td div:hover
{
    cursor:pointer;
    box-shadow:2px 2px 0px 0px #CCC;
}

.tile_box table td div span
{
    width:100%;
    margin-top:15px;
    margin-left:4px;
    float:left;
}

.table_Row
{
    box-shadow:0px 0px 0px 0px #CCC;
}