add sitemap and template

common/modules/faq/models/Faq.php

@@ -4,8 +4,13 @@ namespace common\modules\faq\models;
 
 use Yii;
 use \common\components\validators\TransliterateValidator;
+use yii\behaviors\TimestampBehavior;
 use \yii\helpers\StringHelper;
 use \common\models\MetaTags;
+use yii\helpers\Url;
+use yii\db\Expression;
+
+use himiklab\sitemap\behaviors\SitemapBehavior;
 /**
  * This is the model class for table "faq".
  *
@@ -38,7 +43,30 @@ class Faq extends \common\components\ActiveRecordModel
         return [
             'meta' => [
                 'class' => 'common\components\activeRecordBehaviors\MetaTagBehavior',
-            ]
+            ],
+            'sitemap' => [
+                'class' => SitemapBehavior::className(),
+                'scope' => function ($model) {
+                    /** @var \yii\db\ActiveQuery $model */
+                    $model->select(['url', 'updated_at']);
+                    // $model->andWhere(['is_deleted' => 0]);
+                },
+                'dataClosure' => function ($model) {
+                    /** @var self $model */
+                    return [
+                        'loc' => Url::to($model->url, true),
+                        'lastmod' => date('c', $model->updated_at),
+                        'changefreq' => SitemapBehavior::CHANGEFREQ_DAILY,
+                        'priority' => 0.8
+                    ];
+                }
+            ],
+            'timestamp' => [
+                'class' => TimestampBehavior::className(),
+                'createdAtAttribute' => 'created_at',
+                'updatedAtAttribute' => 'updated_at',
+                'value' => time(),
+            ],
         ];
     }
 

composer.json

@@ -30,7 +30,8 @@
         "mpdf/mpdf": "dev-master",
         "dompdf/dompdf": "dev-master",
         "tecnick.com/tcpdf": "dev-master",
-        "mikehaertl/phpwkhtmltopdf": "^2.0@dev"
+        "mikehaertl/phpwkhtmltopdf": "^2.0@dev",
+        "himiklab/yii2-sitemap-module" : "*"
     },
     "require-dev": {
         "yiisoft/yii2-codeception": "*",

frontend/config/main.php

@@ -19,8 +19,49 @@ return [
         'request' => ['class' => 'common\modules\request\Module',],
 	    'faq' => ['class' => 'common\modules\faq\Module'],
         'main' => ['class' => 'common\modules\main\main'],
+        'sitemap' => [
+            'class' => 'himiklab\sitemap\Sitemap',
+            'models' => [
+                // your models
+                'common\modules\faq\models\Faq',
+            ],
+            'urls'=> [
+                // your additional urls
+                [
+                    'loc' => '/faq',
+                    'changefreq' => \himiklab\sitemap\behaviors\SitemapBehavior::CHANGEFREQ_DAILY,
+                    'priority' => 0.8,
+                    'faq' => [
+                        'publication'   => [
+                            'name'          => 'Вопрос-Ответ',
+                            'language'      => 'ru',
+                        ],
+                        // 'access'            => 'Subscription',
+                        // 'genres'            => 'Blog, UserGenerated',
+                        // 'publication_date'  => 'YYYY-MM-DDThh:mm:ssTZD',
+                        // 'title'             => 'Example Title',
+                        // 'keywords'          => 'example, keywords, comma-separated',
+                        // 'stock_tickers'     => 'NASDAQ:A, NASDAQ:B',
+                    ],
+                    // 'images' => [
+                    //     [
+                    //         'loc'           => 'http://example.com/image.jpg',
+                    //         'caption'       => 'This is an example of a caption of an image',
+                    //         'geo_location'  => 'City, State',
+                    //         'title'         => 'Example image',
+                    //         'license'       => 'http://example.com/license',
+                    //     ],
+                    // ],
+                ],
+            ],
+            'enableGzip' => true, // default is false
+            'cacheExpire' => 1, // 1 second. Default is 24 hours
+        ],
     ],
     'components' => [
+        'cache' => [
+            'class' => 'yii\caching\FileCache',
+        ],
         'user' => [
             'identityClass' => 'common\modules\scoring\models\ScClient',
             'loginUrl' => ['/site/login'],
@@ -91,6 +132,8 @@ return [
             'showScriptName' => false,
             'enableStrictParsing' => true,
             'rules' => [
+                ['pattern' => 'sitemap', 'route' => 'sitemap/default/index', 'suffix' => '.xml'],
+
                 '' => 'content/page/view',
 
                 '<page:(/)>' => 'content/page/view',

frontend/web/css/screen.css

@@ -100,6 +100,10 @@ html.js .loader .loader_inner {
   clear: both;
 }
 
+ol {
+  counter-reset: myCounter;
+}
+
 body {
   background: #344555;
   font-size: 17px;
@@ -191,7 +195,7 @@ a.logo {
   font-size: 15px;
   display: block;
   float: left;
-  padding: 0px 12px;
+  padding: 0px 8px;
   height: 38px;
   line-height: 34px;
   border: 2px solid transparent;
@@ -294,7 +298,7 @@ a.logo {
   color: #fff;
   font-size: 15px;
   display: block;
-  padding: 0px 12px;
+  padding: 0px 8px;
   height: 38px;
   line-height: 34px;
   border: 2px solid transparent;
@@ -849,6 +853,11 @@ a.toggle_bottom:hover .icon-arrowDown2:after {
   width: 101px;
   height: 92px;
   z-index: 99;
+  -moz-transition: all 2s linear;
+  -o-transition: all 2s linear;
+  -webkit-transition: all 2s linear;
+  -ms-transition: all 2s linear;
+  transition: all 2s linear;
 }
 @media only screen and (min-width: 768px) and (max-width: 970px) {
   .section3 .container .p5 {
@@ -873,6 +882,11 @@ a.toggle_bottom:hover .icon-arrowDown2:after {
   width: 337px;
   height: 279px;
   z-index: 99;
+  -moz-transition: all 2s linear;
+  -o-transition: all 2s linear;
+  -webkit-transition: all 2s linear;
+  -ms-transition: all 2s linear;
+  transition: all 2s linear;
 }
 @media only screen and (min-width: 768px) and (max-width: 970px) {
   .section3 .p6 {
@@ -897,6 +911,11 @@ a.toggle_bottom:hover .icon-arrowDown2:after {
   width: 279px;
   height: 421px;
   z-index: 99;
+  -moz-transition: all 2s linear;
+  -o-transition: all 2s linear;
+  -webkit-transition: all 2s linear;
+  -ms-transition: all 2s linear;
+  transition: all 2s linear;
 }
 @media only screen and (min-width: 768px) and (max-width: 970px) {
   .section3 .p7 {
@@ -1361,7 +1380,8 @@ a.toggle_bottom:hover .icon-arrowDown2:after {
 }
 @media only screen and (min-width: 320px) and (max-width: 479px) {
   .section4 {
-    min-height: 610px;
+    margin-top: 40px;
+    min-height: 640px;
   }
 }
 
@@ -3129,7 +3149,7 @@ ul.ul_check li {
   -webkit-border-radius: 8px;
   -o-border-radius: 8px;
   -ms-border-radius: 8px;
-  padding: 37px 68px;
+  padding: 32px 68px 37px;
   margin-top: 119px;
   box-shadow: 0 0 46px rgba(0, 0, 2, 0.14);
   margin-bottom: 80px;
@@ -3256,7 +3276,6 @@ ul.ul_check li {
   display: block;
   margin-top: 16px;
   color: #fff;
-  text-decoration: underline;
 }
 .foot_mail:hover, .foot_mail:active, .foot_mail:focus {
   color: #fff;
@@ -3521,7 +3540,7 @@ footer {
 @media only screen and (min-width: 320px) and (max-width: 479px) {
   .set {
     margin-top: 148px;
-    margin-left: -20px;
+    margin-left: -50px;
   }
   .set img {
     width: 100%;
@@ -3765,6 +3784,11 @@ footer {
   opacity: 1;
   top: 255px;
 }
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .puls_point {
+    right: 233px;
+  }
+}
 @media only screen and (min-width: 480px) and (max-width: 767px) {
   .puls_point {
     display: none;
@@ -5025,7 +5049,7 @@ footer {
 }
 
 .line_hide {
-  background-image: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.4) 100%);
+  background-image: linear-gradient(to top, #ffffff 0%, rgba(255, 255, 255, 0.4) 100%);
   height: 92px;
   width: 940px;
   position: absolute;
@@ -5058,7 +5082,7 @@ footer {
 }
 
 .rev_sec {
-  padding-top: 46px;
+  padding-top: 0px;
   background: #fff url(../images/rev_bg.png) no-repeat bottom center;
   padding-bottom: 40px;
 }
@@ -5109,7 +5133,7 @@ footer {
 }
 
 .line_hide_rev {
-  background-image: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.4) 100%);
+  background-image: linear-gradient(to top, #ffffff 0%, rgba(255, 255, 255, 0.4) 100%);
   height: 45px;
   width: 100%;
   position: absolute;
@@ -5660,7 +5684,7 @@ footer {
 }
 
 .list_hide_rev, .list_hide2_rev, .list_hide3_rev, .list_hide4_rev, .list_hide5_rev {
-  background-image: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.4) 100%);
+  background-image: linear-gradient(to top, #ffffff 0%, rgba(255, 255, 255, 0.4) 100%);
   height: 45px;
   width: 100%;
   position: absolute;
@@ -7419,7 +7443,7 @@ footer {
 .cont_block {
   border-left: 1px solid #fff;
   padding-left: 32px;
-  margin-top: 76px;
+  margin-top: 50px;
 }
 .cont_block__city {
   color: #2d3642;
@@ -7960,3 +7984,2655 @@ footer {
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 10;
 }
+
+.sh_kurs {
+  background: #fff;
+}
+.sh_kurs h1 {
+  color: #2d3642;
+  font-family: "RobotoBold";
+  font-size: 35px;
+  line-height: 41px;
+  margin-top: 40px;
+  font-weight: normal;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .sh_kurs h1 {
+    font-size: 30px;
+  }
+}
+.sh_kurs p {
+  color: #2d3642;
+  font-size: 16px;
+  line-height: 26px;
+  margin-top: 26px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .sh_kurs p {
+    font-size: 14px;
+    line-height: 23px;
+  }
+}
+
+.sh_social {
+  margin-top: 50px;
+  margin-left: 18px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .sh_social {
+    margin-left: 0;
+    margin-top: 30px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .sh_social {
+    margin-left: 0;
+    margin-top: 30px;
+  }
+}
+
+.kurs_item {
+  width: 907px;
+  height: 262px;
+  margin: 50px auto 64px;
+  position: relative;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .kurs_item {
+    width: 750px;
+    height: auto;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .kurs_item {
+    width: 450px;
+    height: auto;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_item {
+    width: 270px;
+    height: auto;
+    margin: 50px auto 100px;
+  }
+}
+.kurs_img {
+  width: 907px;
+  height: 262px;
+  -moz-box-shadow: 6.7px 7.4px 16px rgba(0, 0, 2, 0.24);
+  -webkit-box-shadow: 6.7px 7.4px 16px rgba(0, 0, 2, 0.24);
+  box-shadow: 6.7px 7.4px 16px rgba(0, 0, 2, 0.24);
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .kurs_img {
+    width: 750px;
+    height: auto;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .kurs_img {
+    width: 450px;
+    height: auto;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_img {
+    width: 270px;
+    height: auto;
+  }
+}
+.kurs_img img {
+  width: 100%;
+  height: auto;
+}
+.kurs_over {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background-color: rgba(45, 54, 66, 0.49);
+  padding: 15px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_over {
+    padding: 5px;
+  }
+}
+.kurs_sub-title {
+  font-size: 16px;
+  line-height: 35px;
+  color: #2d3642;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .kurs_sub-title {
+    font-size: 13px;
+    line-height: 30px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .kurs_sub-title {
+    display: none;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_sub-title {
+    display: none;
+  }
+}
+.kurs_sub-title span {
+  background: #fff;
+  padding: 5px 10px;
+}
+.kurs_foot {
+  position: absolute;
+  bottom: 30px;
+  left: 30px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .kurs_foot {
+    bottom: 15px;
+    left: 15px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_foot {
+    left: 0px;
+    bottom: -40px;
+  }
+}
+
+h1.kurs_title {
+  font-size: 25px;
+  color: #31373f;
+  font-family: "RobotoBold";
+  display: inline;
+  margin-bottom: 2px;
+  font-weight: normal;
+  margin: 0;
+  line-height: 48px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  h1.kurs_title {
+    font-size: 20px;
+    line-height: 32px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  h1.kurs_title {
+    font-size: 13px;
+    line-height: 24px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  h1.kurs_title {
+    font-size: 13px;
+    line-height: 22px;
+  }
+}
+h1.kurs_title span {
+  padding: 6px 10px;
+  background: #fff;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  h1.kurs_title span {
+    padding: 2px 6px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  h1.kurs_title span {
+    padding: 2px 6px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  h1.kurs_title span {
+    padding: 1px 6px;
+  }
+}
+
+.lock {
+  background-color: rgba(45, 54, 66, 0.89);
+}
+
+.kurs_lock {
+  background: url(../images/kurs_lock.png) no-repeat center center;
+  width: 907px;
+  height: 25px;
+  position: absolute;
+  bottom: 93px;
+  left: 0;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .kurs_lock {
+    width: 750px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .kurs_lock {
+    bottom: 60px;
+    width: 450px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .kurs_lock {
+    display: none;
+  }
+}
+
+a.kurs_bt {
+  display: block;
+  height: 36px;
+  padding: 0px 15px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-size: 16px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  line-height: 29px;
+  text-decoration: none;
+}
+a.kurs_bt:hover, a.kurs_bt:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+}
+a.kurs_bt:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+}
+
+.blip_kurs {
+  position: absolute;
+  top: 55px;
+  right: 0;
+  width: 279px;
+  height: 75px;
+  background: url(../images/blip_kurs.png) no-repeat center center;
+  font-size: 17px;
+  text-align: center;
+  color: #fff;
+  line-height: 20px;
+  padding-top: 10px;
+  font-family: "RobotoBold";
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .blip_kurs {
+    display: none;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .blip_kurs {
+    display: none;
+  }
+}
+
+.for_it {
+  background-color: #65b6d4;
+  height: 28px;
+  min-width: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 30px;
+  font-size: 13px;
+  color: #fff;
+  line-height: 27px;
+  padding: 0px 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .for_it {
+    bottom: 15px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .for_it {
+    bottom: 0;
+  }
+}
+
+.r_it {
+  width: 45px;
+  height: 45px;
+  background: #65b6d4;
+  position: absolute;
+  top: -9px;
+  left: -39px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .r_it {
+    display: none;
+  }
+}
+.r_it:before {
+  content: "";
+  background: url(../images/icon/it_icon.png) no-repeat center center;
+  width: 20px;
+  height: 27px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 5px;
+  left: 12px;
+}
+
+.for_im {
+  background-color: #d200ff;
+  height: 28px;
+  min-width: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 30px;
+  font-size: 13px;
+  color: #fff;
+  line-height: 27px;
+  padding: 0px 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .for_im {
+    bottom: 15px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .for_im {
+    bottom: 0;
+  }
+}
+
+.r_im {
+  width: 45px;
+  height: 45px;
+  background-color: #d200ff;
+  position: absolute;
+  top: -9px;
+  left: -39px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .r_im {
+    display: none;
+  }
+}
+.r_im:before {
+  content: "";
+  background: url(../images/icon/im_icon.png) no-repeat center center;
+  width: 23px;
+  height: 24px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 6px;
+  left: 11px;
+}
+
+.for_sb {
+  background-color: #A900FF;
+  height: 28px;
+  min-width: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 30px;
+  font-size: 13px;
+  color: #fff;
+  line-height: 27px;
+  padding: 0px 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .for_sb {
+    bottom: 15px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .for_sb {
+    bottom: 0;
+  }
+}
+
+.r_sb {
+  width: 45px;
+  height: 45px;
+  background-color: #A900FF;
+  position: absolute;
+  top: -9px;
+  left: -39px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .r_sb {
+    display: none;
+  }
+}
+.r_sb:before {
+  content: "";
+  background: url(../images/icon/sb_icon.png) no-repeat center center;
+  width: 21px;
+  height: 25px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 6px;
+  left: 11px;
+}
+
+.for_dv {
+  background-color: #A900FF;
+  height: 28px;
+  min-width: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 30px;
+  font-size: 13px;
+  color: #fff;
+  line-height: 27px;
+  padding: 0px 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .for_dv {
+    bottom: 15px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .for_dv {
+    bottom: 0px;
+  }
+}
+
+.r_dv {
+  width: 45px;
+  height: 45px;
+  background-color: #A900FF;
+  position: absolute;
+  top: -9px;
+  left: -39px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .r_dv {
+    display: none;
+  }
+}
+.r_dv:before {
+  content: "";
+  background: url(../images/icon/dv_icon.png) no-repeat center center;
+  width: 22px;
+  height: 19px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 6px;
+  left: 11px;
+}
+
+.sh_ft {
+  background: #fff;
+  color: #31373f;
+  padding-top: 6px;
+}
+.sh_ft p {
+  font-size: 18px;
+  line-height: 25px;
+  margin-top: 28px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .sh_ft p {
+    font-size: 14px;
+  }
+}
+
+.reg_title {
+  font-size: 25px;
+  font-family: "RobotoBold";
+  line-height: 35px;
+  color: #484b53;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .reg_title {
+    font-size: 22px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .reg_title {
+    font-size: 21px;
+    text-align: center;
+    line-height: 30px;
+  }
+}
+
+.sh_reg_form .input_st {
+  width: 264px;
+  height: 50px;
+  background: #F5F5F5;
+  border: none;
+  border-radius: 10px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  -o-border-radius: 10px;
+  -ms-border-radius: 10px;
+  margin-bottom: 34px;
+  color: #698387;
+  font-size: 16px;
+  padding: 0px 18px;
+}
+.sh_reg_form .input_st::-webkit-input-placeholder {
+  color: #698387;
+  font-size: 16px;
+  opacity: 1;
+}
+.sh_reg_form .input_st:-moz-placeholder {
+  color: #698387;
+  font-size: 16px;
+  opacity: 1;
+}
+.sh_reg_form .input_st::-moz-placeholder {
+  color: #698387;
+  font-size: 16px;
+  opacity: 1;
+}
+.sh_reg_form .input_st:-ms-input-placeholder {
+  color: #698387;
+  font-size: 16px;
+  opacity: 1;
+}
+.sh_reg_form .field-input.input-error {
+  background: #fff url(../images/icon-fail.png) no-repeat 96% center;
+  border: 1px solid #E9A2A2;
+}
+
+.sh_bt_send {
+  width: 256px;
+  height: 74px;
+  border-radius: 10px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  -o-border-radius: 10px;
+  -ms-border-radius: 10px;
+  text-align: center;
+  color: #b39b02;
+  font-size: 26px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  margin: 0 auto;
+}
+.sh_bt_send:hover, .sh_bt_send:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+}
+.sh_bt_send:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+}
+
+.usl {
+  font-size: 14px;
+  line-height: 25px;
+  margin-top: 30px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .usl {
+    text-align: center;
+    margin-bottom: 30px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .usl {
+    text-align: center;
+    font-size: 12px;
+    margin-bottom: 30px;
+  }
+}
+.usl a {
+  color: #1d93bf;
+  text-decoration: underline;
+  font-size: 13px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .usl a {
+    font-size: 12px;
+  }
+}
+.usl a:hover {
+  text-decoration: none;
+}
+
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .sh_reg_form {
+    width: 264px;
+    margin: 0 auto;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .sh_reg_form {
+    width: 264px;
+    margin: 0 auto;
+  }
+}
+
+.ks_header {
+  background: url(../images/ks_header_bg.jpg) no-repeat center center;
+  background-size: cover;
+  -moz-background-size: cover;
+  -webkit-background-size: cover;
+  -o-background-size: cover;
+  width: 100%;
+  min-height: 75px;
+  color: #2d323a;
+}
+
+.ball-block {
+  height: 37px;
+  font-size: 12px;
+  margin-top: 20px;
+  line-height: 33px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ball-block {
+    height: auto;
+  }
+}
+
+.col-ball {
+  font-size: 24px;
+  color: #fff;
+  font-family: "RobotoBold";
+  background: #0A79A4;
+  text-align: center;
+  width: 103px;
+  height: 37px;
+  display: inline-block;
+  margin-left: 18px;
+  margin-right: 15px;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  -o-border-radius: 5px;
+  -ms-border-radius: 5px;
+}
+
+.ball-link {
+  color: #1f6295;
+  font-size: 13px;
+  border-bottom: 1px dotted #1f6295;
+}
+.ball-link:hover {
+  border-bottom: none;
+  text-decoration: none;
+}
+
+.prof_block {
+  float: right;
+  height: 22px;
+  line-height: 22px;
+  margin-right: 45px;
+  margin-top: 24px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .prof_block {
+    float: none;
+    margin: 5px 0px 20px 12px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .prof_block {
+    float: none;
+    margin: 5px 0px 20px 12px;
+  }
+}
+.prof_block a {
+  font-size: 13px;
+  color: #00aee0;
+  font-family: "RobotoBold";
+  text-decoration: underline;
+}
+.prof_block a:before {
+  content: "";
+  background: url(../images/icon/exit_link_icon.png) no-repeat center center;
+  width: 2px;
+  height: 22px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -16px;
+}
+.prof_block a:hover {
+  text-decoration: none;
+}
+
+.prof_name {
+  font-size: 13px;
+  color: #2d323a;
+  font-family: "RobotoBold";
+  margin-right: 36px;
+}
+.prof_name:before {
+  content: "";
+  background: url(../images/icon/prof_block_icon.png) no-repeat center center;
+  width: 12px;
+  height: 15px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -12px;
+}
+
+.video-container {
+  background: #262E38;
+  width: 100%;
+  min-height: 500px;
+  padding: 15px 0px 20px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .video-container {
+    min-height: 440px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .video-container .sh_social {
+    margin-top: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .video-container .sh_social {
+    margin-top: 20px;
+  }
+}
+
+.vc-title {
+  color: #fff;
+  font-size: 30px;
+  font-family: "RobotoBold";
+  font-weight: normal;
+  line-height: 40px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc-title {
+    font-size: 25px;
+    line-height: 35px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-title {
+    font-size: 17px;
+    line-height: 27px;
+  }
+}
+
+.ytb_video {
+  width: 100%;
+  margin-top: 16px;
+  margin-bottom: 26px;
+}
+.ytb_video img {
+  width: 100%;
+  height: auto;
+}
+
+.vc-subtitle {
+  font-size: 21px;
+  font-family: "RobotoBold";
+  color: #fff;
+  margin-bottom: 8px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc-subtitle {
+    font-size: 18px;
+    margin-bottom: 10px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-subtitle {
+    font-size: 17px;
+    line-height: 26px;
+    text-align: center;
+  }
+}
+.vc-subtitle span {
+  color: #fee32c;
+}
+
+.vc-uslovia {
+  font-size: 15px;
+  color: #23f2ff;
+  text-decoration: underline;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-uslovia {
+    display: block;
+    margin: 0 auto;
+    width: 228px;
+  }
+}
+.vc-uslovia:hover {
+  color: #23f2ff;
+  text-decoration: none;
+}
+
+.vc-cont {
+  background: #fff;
+  font-size: 16px;
+  color: #000;
+  padding-top: 35px;
+  padding-bottom: 50px;
+}
+.vc-cont h2 {
+  font-size: 27px;
+  color: #2d323a;
+  font-weight: normal;
+  font-family: "RobotoBold";
+  margin-top: 45px;
+  margin-bottom: 40px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-cont h2 {
+    font-size: 23px;
+  }
+}
+.vc-cont strong {
+  color: #000;
+  font-size: 17px;
+  font-family: "RobotoBold";
+  font-weight: normal;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-cont strong {
+    font-size: 14px;
+    line-height: 23px;
+  }
+}
+.vc-cont p {
+  font-size: 16px;
+  line-height: 25px;
+  margin-top: 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc-cont p {
+    font-size: 14px;
+    line-height: 23px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-cont p {
+    font-size: 14px;
+    line-height: 23px;
+  }
+}
+.vc-cont p img {
+  float: left;
+  margin-right: 30px;
+}
+.vc-cont p a {
+  color: #119ee7;
+  text-decoration: underline;
+}
+.vc-cont p a:hover {
+  text-decoration: none;
+}
+
+.vc_bt_quit_less {
+  width: 284px;
+  height: 74px;
+  border-radius: 10px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  -o-border-radius: 10px;
+  -ms-border-radius: 10px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 27px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  margin: 0 auto;
+  display: block;
+  line-height: 66px;
+}
+.vc_bt_quit_less:hover, .vc_bt_quit_less:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.vc_bt_quit_less:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.vc_quit_txt {
+  color: #2d323a;
+  font-size: 27px;
+  font-family: "RobotoBold";
+  line-height: 66px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .vc_quit_txt {
+    font-size: 17px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc_quit_txt {
+    font-size: 17px;
+    line-height: 60px;
+    text-align: center;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc_quit_txt {
+    font-size: 18px;
+    line-height: 24px;
+    margin-top: 25px;
+    text-align: center;
+  }
+}
+
+.vc_green_inf {
+  background: #C3EBB9;
+  width: 100%;
+  height: 119px;
+  border-radius: 10px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  -o-border-radius: 10px;
+  -ms-border-radius: 10px;
+  margin-top: 36px;
+}
+.vc_green_inf span {
+  color: #2d323a;
+  font-size: 20px;
+  text-align: center;
+  display: block;
+  line-height: 31px;
+  padding-top: 27px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc_green_inf span {
+    font-size: 13px;
+    line-height: 29px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc_green_inf span {
+    font-size: 13px;
+    line-height: 24px;
+    padding-top: 13px;
+  }
+}
+
+.ol_list {
+  margin-top: 41px;
+}
+
+ol.ol_list li {
+  color: #3c4755;
+  font-size: 16px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  ol.ol_list li {
+    font-size: 13px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  ol.ol_list li {
+    font-size: 13px;
+  }
+}
+ol.ol_list li:before {
+  counter-increment: myCounter;
+  content: counter(myCounter);
+  color: #3c4755;
+  font-size: 15px;
+  font-family: "RobotoBold";
+  background: #FFD600;
+  display: inline-block;
+  text-align: center;
+  margin: 4px 12px 4px 4px;
+  line-height: 23px;
+  width: 23px;
+  height: 23px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+
+.ul_list {
+  margin-top: 41px;
+}
+
+ul.ul_list li {
+  background: url(../images/icon/ul_list.png) no-repeat left center;
+  height: 30px;
+  line-height: 30px;
+  padding-left: 30px;
+  font-size: 16px;
+  color: #3c4755;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  ul.ul_list li {
+    font-size: 13px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  ul.ul_list li {
+    font-size: 13px;
+    height: auto;
+    line-height: 17px;
+    margin-bottom: 10px;
+  }
+}
+
+.tb_vp {
+  margin-top: 49px;
+  margin-bottom: 50px;
+  overflow-x: auto;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .tb_vp {
+    margin-top: 20px;
+  }
+}
+
+tr th {
+  padding: 15px 20px;
+  border: 1px solid #C7C7C7;
+  vertical-align: top;
+  color: #2d323a;
+  font-size: 16px;
+  line-height: 20px;
+}
+
+thead tr th {
+  background: #FFDF00;
+  font-family: "RobotoBold";
+  color: #2d323a;
+  font-size: 16px;
+  line-height: 21px;
+  padding: 0px 0px 0px 20px;
+  border: 1px solid #FFEF81;
+  vertical-align: middle;
+}
+
+.ai_link {
+  font-size: 16px;
+  color: #6ebaee;
+  text-decoration: underline;
+  margin-left: 20px;
+  display: inline-block;
+  margin-bottom: 60px;
+  margin-top: 18px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .ai_link {
+    width: 250px;
+    margin-top: 10px;
+    line-height: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ai_link {
+    width: 200px;
+    margin-top: 10px;
+    line-height: 20px;
+    font-size: 14px;
+  }
+}
+.ai_link:hover {
+  color: #6ebaee;
+  text-decoration: none;
+}
+
+.ai_format {
+  background: url(../images/icon/ai_format.png) no-repeat center center;
+  width: 43px;
+  height: 58px;
+  display: block;
+  float: left;
+}
+
+.rar_link {
+  font-size: 16px;
+  color: #6ebaee;
+  text-decoration: underline;
+  margin-left: 20px;
+  display: inline-block;
+  margin-bottom: 60px;
+  margin-top: 18px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .rar_link {
+    width: 250px;
+    margin-top: 10px;
+    line-height: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .rar_link {
+    width: 200px;
+    margin-top: 10px;
+    line-height: 20px;
+    font-size: 14px;
+  }
+}
+.rar_link:hover {
+  color: #6ebaee;
+  text-decoration: none;
+}
+
+.rar_format {
+  background: url(../images/icon/rar_format.png) no-repeat center center;
+  width: 43px;
+  height: 58px;
+  display: block;
+  float: left;
+}
+
+.ppt_link {
+  font-size: 16px;
+  color: #6ebaee;
+  text-decoration: underline;
+  margin-left: 20px;
+  display: inline-block;
+  margin-bottom: 38px;
+  margin-top: 18px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .ppt_link {
+    width: 250px;
+    margin-top: 10px;
+    line-height: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ppt_link {
+    width: 200px;
+    margin-top: 10px;
+    line-height: 20px;
+    font-size: 14px;
+  }
+}
+.ppt_link:hover {
+  color: #6ebaee;
+  text-decoration: none;
+}
+
+.ppt_format {
+  background: url(../images/icon/ppt_format.png) no-repeat center center;
+  width: 43px;
+  height: 58px;
+  display: block;
+  float: left;
+}
+
+.vc-com_tit {
+  font-size: 35px;
+  color: #2d323a;
+  line-height: 50px;
+  font-family: "RobotoBold";
+  margin-top: 49px;
+  margin-bottom: 35px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .vc-com_tit {
+    font-size: 28px;
+    line-height: 40px;
+  }
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .vc-com_tit {
+    font-size: 28px;
+    line-height: 40px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-com_tit {
+    font-size: 20px;
+    line-height: 30px;
+  }
+}
+
+.vc-y_link {
+  display: block;
+  border-radius: 7px;
+  -moz-border-radius: 7px;
+  -webkit-border-radius: 7px;
+  -o-border-radius: 7px;
+  -ms-border-radius: 7px;
+  width: 107px;
+  height: 52px;
+  -webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  -moz-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  font-size: 18px;
+  color: #7d7d7d;
+  font-family: "RobotoBold";
+  text-align: center;
+  line-height: 50px;
+  display: inline-block;
+  margin-right: 30px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .vc-y_link {
+    margin-right: 15px;
+  }
+}
+.vc-y_link:hover, .vc-y_link:focus {
+  text-decoration: none;
+  background: #00CF56;
+  color: #fff;
+}
+.vc-y_link:active {
+  -webkit-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  -moz-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+}
+.vc-y_link:before {
+  content: "";
+  background: url(../images/icon/y_like.png) no-repeat center center;
+  width: 19px;
+  height: 18px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -12px;
+}
+
+.vc-y_link:hover:before, .vc-y_link:focus:before, .vc-y_link:active:before {
+  background: url(../images/icon/y_like_hover.png) no-repeat center center;
+}
+
+.vc-n_link {
+  display: block;
+  border-radius: 7px;
+  -moz-border-radius: 7px;
+  -webkit-border-radius: 7px;
+  -o-border-radius: 7px;
+  -ms-border-radius: 7px;
+  width: 107px;
+  height: 52px;
+  -webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  -moz-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  font-size: 18px;
+  color: #7d7d7d;
+  font-family: "RobotoBold";
+  text-align: center;
+  line-height: 50px;
+  display: inline-block;
+  margin-right: 30px;
+}
+.vc-n_link:hover, .vc-n_link:focus {
+  text-decoration: none;
+  background: #F26363;
+  color: #fff;
+}
+.vc-n_link:active {
+  -webkit-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  -moz-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+}
+.vc-n_link:before {
+  content: "";
+  background: url(../images/icon/n_like.png) no-repeat center center;
+  width: 19px;
+  height: 18px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -12px;
+}
+
+.vc-n_link:hover:before, .vc-n_link:focus:before, .vc-n_link:active:before {
+  background: url(../images/icon/n_like_hover.png) no-repeat center center;
+}
+
+.les_list_top {
+  background: url(../images/les_top_bg.jpg) no-repeat center center;
+  width: 100%;
+  height: 377px;
+  background-size: cover;
+  -moz-background-size: cover;
+  -webkit-background-size: cover;
+  -o-background-size: cover;
+  position: relative;
+  -webkit-box-shadow: 0px 16px 24px 0px rgba(0, 0, 2, 0.4);
+  -moz-box-shadow: 0px 16px 24px 0px rgba(0, 0, 2, 0.4);
+  box-shadow: 0px 16px 24px 0px rgba(0, 0, 2, 0.4);
+}
+
+.ls_top_over {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: rgba(84, 101, 118, 0.5);
+}
+
+.ls_title {
+  font-size: 29px;
+  color: #fff;
+  font-weight: normal;
+  line-height: 54px;
+  font-family: "RobotoBold";
+  display: inline-block;
+  margin-top: 66px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .ls_title {
+    font-size: 22px;
+    margin-top: 26px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ls_title {
+    font-size: 14px;
+    margin-top: 0;
+  }
+}
+.ls_title span {
+  position: relative;
+  background: #262E38;
+  padding: 5px 22px;
+}
+
+.ls_subtitle {
+  font-size: 17px;
+  line-height: 34px;
+  display: inline-block;
+  margin-top: 16px;
+}
+@media only screen and (min-width: 320px) and (max-width: 767px) {
+  .ls_subtitle {
+    line-height: 25px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ls_subtitle {
+    font-size: 14px;
+    margin-top: 0;
+  }
+}
+.ls_subtitle span {
+  position: relative;
+  background: #262E38;
+  padding: 6px 20px;
+}
+@media only screen and (min-width: 320px) and (max-width: 767px) {
+  .ls_subtitle span {
+    display: inline-block;
+  }
+}
+
+.ls_txt {
+  font-size: 17px;
+  line-height: 34px;
+  display: inline-block;
+  margin-top: 7px;
+}
+@media only screen and (min-width: 320px) and (max-width: 767px) {
+  .ls_txt {
+    line-height: 25px;
+  }
+}
+.ls_txt span {
+  position: relative;
+  background: #262E38;
+  padding: 6px 20px;
+}
+@media only screen and (min-width: 320px) and (max-width: 767px) {
+  .ls_txt span {
+    display: inline-block;
+  }
+}
+
+.ls_now_btn {
+  width: 172px;
+  height: 55px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 20px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  display: block;
+  line-height: 50px;
+  margin-top: 31px;
+}
+.ls_now_btn:hover, .ls_now_btn:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.ls_now_btn:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.ls_list_block {
+  background: url(../images/ls_list_bg.jpg) repeat-y top center;
+  width: 100%;
+  min-height: 638px;
+  padding-top: 82px;
+}
+@media only screen and (min-width: 320px) and (max-width: 767px) {
+  .ls_list_block {
+    padding-bottom: 80px;
+  }
+}
+
+.ls_block_item {
+  width: 210px;
+  height: 236px;
+  background: #fff;
+  margin: 0 auto;
+  display: block;
+  padding-top: 27px;
+  margin-bottom: 34px;
+}
+.ls_block_item:hover, .ls_block_item:focus, .ls_block_item:active {
+  text-decoration: none;
+}
+
+.line_ls {
+  background: url(../images/icon/line_ls.png) no-repeat center center;
+  width: 84px;
+  height: 21px;
+  font-size: 14px;
+  color: #fff;
+  text-align: center;
+  line-height: 19px;
+}
+
+a.ls_block_title {
+  font-size: 17px;
+  color: #939393;
+  line-height: 27px;
+  margin: 17px 25px 0px 16px;
+  display: block;
+}
+a.ls_block_title:hover {
+  text-decoration: none;
+}
+
+.ls_block_btn {
+  width: 92px;
+  height: 30px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 12px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  line-height: 25px;
+  margin-top: 36px;
+  margin-left: 15px;
+  display: none;
+}
+.ls_block_btn:hover, .ls_block_btn:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.ls_block_btn:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.ls_fine_txt {
+  color: #fff;
+  font-size: 13px;
+  margin-left: 15px;
+  margin-top: 20px;
+}
+
+.ls_fine {
+  background: #80A2BC;
+}
+.ls_fine .ls_block_title {
+  color: #fff;
+}
+
+.ls_block_item-hover {
+  background: #EDEDED;
+}
+.ls_block_item-hover .ls_block_title {
+  color: #2d323a;
+}
+.ls_block_item-hover .ls_block_btn {
+  display: block;
+}
+.ls_block_item-hover .ls_fine_txt {
+  display: none;
+}
+
+.ls_fine.ls_block_item-hover .ls_block_btn {
+  margin-top: 12px;
+  width: 107px;
+}
+
+.ls_likes {
+  background: #F6F6F6;
+  width: 210px;
+  height: 123px;
+  margin: 0 auto;
+  padding-top: 20px;
+  padding-left: 14px;
+}
+.ls_likes_title {
+  font-size: 17px;
+  color: #2d323a;
+  font-family: "RobotoBold";
+  margin-bottom: 17px;
+}
+.ls_likes_y {
+  -webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  -moz-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  width: 68px;
+  height: 42px;
+  background: #fff;
+  font-size: 15px;
+  color: #7d7d7d;
+  text-align: center;
+  line-height: 38px;
+  font-family: "RobotoBold";
+  border-radius: 7px;
+  -moz-border-radius: 7px;
+  -webkit-border-radius: 7px;
+  -o-border-radius: 7px;
+  -ms-border-radius: 7px;
+  display: inline-block;
+  margin-right: 10px;
+}
+.ls_likes_y:hover, .ls_likes_y:focus {
+  background: #00CF56;
+  color: #fff;
+  text-decoration: none;
+}
+.ls_likes_y:active {
+  -webkit-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  -moz-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+}
+.ls_likes_n {
+  -webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  -moz-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35);
+  width: 68px;
+  height: 42px;
+  background: #fff;
+  font-size: 15px;
+  color: #7d7d7d;
+  text-align: center;
+  line-height: 38px;
+  font-family: "RobotoBold";
+  border-radius: 7px;
+  -moz-border-radius: 7px;
+  -webkit-border-radius: 7px;
+  -o-border-radius: 7px;
+  -ms-border-radius: 7px;
+  display: inline-block;
+}
+.ls_likes_n:hover, .ls_likes_n:focus {
+  background: #F26363;
+  color: #fff;
+  text-decoration: none;
+}
+.ls_likes_n:active {
+  -webkit-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  -moz-box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+  box-shadow: inset 4px 4px 0px 0px rgba(0, 0, 0, 0.21);
+}
+
+.prof_block_testing {
+  float: right;
+  height: 22px;
+  line-height: 22px;
+  margin-right: 45px;
+  margin-top: 24px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .prof_block_testing {
+    float: none;
+    margin: 5px 0px 20px 12px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .prof_block_testing {
+    float: none;
+    margin: 5px 0px 20px 12px;
+  }
+}
+.prof_block_testing a {
+  font-size: 13px;
+  color: #00aee0;
+  font-family: "RobotoBold";
+  text-decoration: underline;
+}
+.prof_block_testing a:before {
+  content: "";
+  background: url(../images/icon/exit_link_icon.png) no-repeat center center;
+  width: 2px;
+  height: 22px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -16px;
+}
+.prof_block_testing a:hover {
+  text-decoration: none;
+}
+
+.prof_name_testing {
+  font-size: 13px;
+  color: #fff;
+  font-family: "RobotoBold";
+  margin-right: 36px;
+}
+.prof_name_testing:before {
+  content: "";
+  background: url(../images/icon/prof_block_icon_w.png) no-repeat center center;
+  width: 12px;
+  height: 15px;
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+  top: 0px;
+  left: -12px;
+}
+
+.ball-block_testing {
+  height: 37px;
+  font-size: 12px;
+  margin-top: 20px;
+  line-height: 33px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  .ball-block_testing {
+    margin-bottom: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .ball-block_testing {
+    height: auto;
+  }
+}
+
+.col-ball_testing {
+  font-size: 24px;
+  color: #fff;
+  font-family: "RobotoBold";
+  background: #0A79A4;
+  text-align: center;
+  width: 103px;
+  height: 37px;
+  display: inline-block;
+  margin-left: 18px;
+  margin-right: 15px;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  -o-border-radius: 5px;
+  -ms-border-radius: 5px;
+}
+
+.ball-link_testing {
+  color: #00baff;
+  font-size: 13px;
+  border-bottom: 1px dotted #00baff;
+}
+.ball-link_testing:hover, .ball-link_testing:focus, .ball-link_testing:active {
+  color: #00baff;
+  border-bottom: none;
+  text-decoration: none;
+}
+
+.top_line_testing {
+  width: 100%;
+  min-height: 38px;
+  background: #F1F1F1;
+  font-size: 15px;
+  color: #969696;
+  line-height: 34px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .top_line_testing {
+    line-height: 24px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .top_line_testing {
+    line-height: 24px;
+  }
+}
+.top_line_testing strong {
+  font-weight: normal;
+  font-family: "RobotoBold";
+  display: inline-block;
+}
+.top_line_testing p {
+  display: inline-block;
+}
+
+.testing_block {
+  background: #FFF;
+  color: #404146;
+  padding-top: 17px;
+}
+.testing_block_title {
+  font-size: 26px;
+  font-weight: normal;
+  line-height: 30px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .testing_block_title {
+    font-size: 21px;
+    line-height: 20px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .testing_block_title {
+    font-size: 21px;
+    line-height: 20px;
+  }
+}
+
+.testing_num {
+  display: inline-block;
+  width: 50px;
+  height: 50px;
+  background: #4B6579;
+  font-size: 18px;
+  color: #fff;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  line-height: 45px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .testing_num {
+    width: 45px;
+    height: 45px;
+    line-height: 44px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .testing_num {
+    width: 45px;
+    height: 45px;
+    line-height: 44px;
+    margin: 0 auto 10px;
+    display: block;
+  }
+}
+
+.testing_img_block {
+  border: 1px solid #ccc;
+  width: 254px;
+  height: 144px;
+  margin: 41px auto 0px;
+  padding: 8px 24px;
+}
+
+.testing_form {
+  margin-top: 27px;
+}
+
+.input_bg {
+  min-height: 45px;
+  background: #EBEBEB;
+  margin-bottom: 11px;
+  padding: 6px 10px 0px;
+  font-size: 14px;
+  color: #546577;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .input_bg {
+    line-height: 20px;
+    padding: 0px 10px 10px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .input_bg {
+    line-height: 20px;
+    padding: 0px 10px 10px;
+  }
+}
+.input_bg input[type="text"] {
+  height: 34px;
+  border: 1px solid #ccc;
+  width: 100%;
+  font-size: 12px;
+  padding: 0px 15px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .input_bg input[type="text"] {
+    margin-top: 10px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .input_bg input[type="text"] {
+    margin-top: 10px;
+  }
+}
+
+.radio {
+  vertical-align: top;
+  margin: 0 3px 0 0;
+  width: 18px;
+  height: 18px;
+}
+
+.radio + label {
+  cursor: pointer;
+}
+
+.radio:not(checked) {
+  position: absolute;
+  opacity: 0;
+}
+
+.radio:not(checked) + label {
+  position: relative;
+  padding: 9px 0px 0px 35px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .radio:not(checked) + label {
+    padding: 11px 0px 0px 35px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .radio:not(checked) + label {
+    padding: 11px 0px 0px 35px;
+  }
+}
+
+.radio:not(checked) + label:before {
+  content: "";
+  position: absolute;
+  top: 7px;
+  left: 1px;
+  width: 18px;
+  height: 18px;
+  background: url(../images/icon/radio_normal.png) no-repeat center center;
+}
+
+.radio:checked + label:before {
+  background: url(../images/icon/radio_check.png) no-repeat center center;
+}
+
+.checkbox {
+  vertical-align: top;
+  margin: 0 3px 0 0;
+  width: 16px;
+  height: 16px;
+}
+
+.checkbox + label {
+  cursor: pointer;
+}
+
+.checkbox:not(checked) {
+  position: absolute;
+  opacity: 0;
+}
+
+.checkbox:not(checked) + label {
+  position: relative;
+  padding: 9px 0px 0px 35px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .checkbox:not(checked) + label {
+    padding: 11px 0px 0px 35px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .checkbox:not(checked) + label {
+    padding: 11px 0px 0px 35px;
+  }
+}
+
+.checkbox:not(checked) + label:before {
+  content: "";
+  position: absolute;
+  top: 7px;
+  left: 3px;
+  width: 16px;
+  height: 16px;
+  background: url(../images/icon/checkbox_normal.png) no-repeat center center;
+}
+
+.checkbox:checked + label:before {
+  background: url(../images/icon/checkbox_check.png) no-repeat center center;
+}
+
+.testing_form_btn {
+  width: 189px;
+  height: 47px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 16px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  line-height: 25px;
+  margin-top: 43px;
+  display: block;
+}
+.testing_form_btn:hover, .testing_form_btn:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.testing_form_btn:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.testing_foot {
+  background: #fff;
+  padding-top: 86px;
+}
+.testing_foot .test_ft {
+  background: #F3F4F5;
+  min-height: 56px;
+  margin: 0px 15px 13px;
+}
+
+.testing_votes {
+  font-size: 16px;
+  color: #404146;
+  display: inline-block;
+  margin-top: 19px;
+  margin-left: 6px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .testing_votes {
+    display: block;
+    margin: 10px 0px 0px 0px;
+    text-align: center;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .testing_votes {
+    display: block;
+    margin: 10px 0px 0px 0px;
+    text-align: center;
+  }
+}
+.testing_votes strong {
+  font-weight: normal;
+  font-family: "RobotoBold";
+  color: #546577;
+}
+
+.testing_progress {
+  width: 262px;
+  height: 13px;
+  background: #fdd60f;
+  -webkit-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.21);
+  -moz-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.21);
+  box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.21);
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  position: relative;
+  display: inline-block;
+  margin-left: 30px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .testing_progress {
+    margin: 10px auto 0px;
+    display: block;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .testing_progress {
+    margin: 10px auto 0px;
+    display: block;
+    width: 240px;
+  }
+}
+.testing_progress_proc {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 92px;
+  height: 13px;
+  background: #536e91;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+}
+
+.testing_time {
+  font-size: 12px;
+  color: #404146;
+  float: right;
+  margin-top: 16px;
+  margin-right: 10px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .testing_time {
+    float: none;
+    margin: 10px 0px;
+    text-align: center;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .testing_time {
+    float: none;
+    margin: 10px 0px;
+    text-align: center;
+  }
+}
+.testing_time span {
+  font-size: 18px;
+  color: #00baff;
+}
+
+footer.testing_footer {
+  min-height: 60px;
+  background: #2d323a;
+}
+
+.taskon_testing {
+  display: block;
+  width: 100px;
+  margin: 12px 0px 5px 5px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .taskon_testing {
+    margin: 20px auto 0px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .taskon_testing {
+    margin: 20px auto 0px;
+  }
+}
+
+.inf_foot_testing {
+  font-size: 11px;
+  color: #fff;
+  margin-top: 25px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .inf_foot_testing {
+    text-align: center;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .inf_foot_testing {
+    text-align: center;
+  }
+}
+
+.help_btn {
+  display: block;
+  font-size: 11px;
+  color: #fff;
+  text-align: center;
+  width: 72px;
+  height: 26px;
+  background: #0BF;
+  line-height: 22px;
+  float: right;
+  margin-top: 18px;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .help_btn {
+    float: none;
+    margin: 20px auto;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .help_btn {
+    float: none;
+    margin: 20px auto;
+  }
+}
+.help_btn:hover, .help_btn:focus {
+  background: #00C6C0;
+  text-decoration: none;
+  color: #fff;
+}
+.help_btn:active {
+  background: #436E94;
+  text-decoration: none;
+  color: #fff;
+}
+
+a.logo_testing {
+  height: 34px;
+  display: block;
+  margin-top: 24px;
+  width: 125px;
+}
+@media only screen and (min-width: 768px) and (max-width: 970px) {
+  a.logo_testing {
+    margin: 20px auto 0px;
+  }
+}
+
+.successfully_title {
+  font-size: 48px;
+  line-height: 50px;
+  font-family: "RobotoBold";
+  text-align: center;
+  font-weight: normal;
+  color: #4A6377;
+  padding: 0px;
+  margin-top: 50px;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .successfully_title {
+    font-size: 35px;
+  }
+}
+
+.successfully_subtitle {
+  font-size: 26px;
+  line-height: 50px;
+  color: #404146;
+  padding-bottom: 5px;
+  text-align: center;
+}
+
+.succes_title_block {
+  font-size: 20px;
+  text-align: center;
+  color: #404146;
+  line-height: 22px;
+  padding-bottom: 5px;
+  margin-top: 80px;
+}
+
+.succes_block_cont {
+  color: #4A6377;
+  font-size: 36px;
+  text-align: center;
+  line-height: 50px;
+}
+
+.stat_testing {
+  margin-top: 80px;
+}
+.stat_testing li {
+  padding-bottom: 20px;
+  font-size: 16px;
+  line-height: 27px;
+  color: #404146;
+}
+.stat_testing span {
+  background-color: #F7F7F7;
+  border: 1px solid #EFEFEF;
+  font-size: 18px;
+  line-height: 38px;
+  color: #404146;
+  margin-right: 20px;
+  width: 50px;
+  height: 38px;
+  display: inline-block;
+  text-align: center;
+}
+
+.read_box_wr {
+  border: 3px solid #ffdbdb;
+  margin-bottom: 10px;
+}
+.read_box_wr .read_box {
+  margin-bottom: 0;
+}
+
+.read_box {
+  background-color: #fcf0f0;
+  border: 1px solid #f6cbcb;
+  color: #ff0000;
+  font-size: 14px;
+  line-height: 20px;
+  text-align: center;
+  padding: 15px;
+  margin-bottom: 10px;
+  position: relative;
+}
+.read_box p {
+  color: #ff0000;
+  font-size: 14px;
+  line-height: 20px;
+  padding: 0;
+  margin: 0;
+}
+
+.read_box_off {
+  position: absolute;
+  right: 8px;
+  top: 8px;
+  color: #855c5c;
+  font-size: 14px;
+  line-height: 20px;
+  cursor: pointer;
+  opacity: 0.7;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .read_box_off {
+    top: -1px;
+  }
+}
+.read_box_off strong {
+  font-size: 18px;
+}
+.read_box_off:hover {
+  opacity: 1;
+}
+
+.box_off_hide {
+  display: none;
+}
+
+.gray_box {
+  background-color: #f7f7f7;
+  border: 1px solid #e9e9e9;
+  color: #404146;
+  font-size: 14px;
+  line-height: 20px;
+  text-align: center;
+  padding: 15px;
+  margin-bottom: 10px;
+}
+.gray_box p {
+  color: #404146;
+  font-size: 14px;
+  line-height: 20px;
+  padding: 0;
+  margin: 0;
+}
+
+.pages {
+  text-align: center;
+  margin-bottom: 40px;
+  margin-top: 25px;
+}
+.pages ul {
+  overflow: hidden;
+  padding: 12px 40px;
+  padding-bottom: 10px;
+  list-style: none;
+  background-color: #f2f2f2;
+  display: inline-block;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .pages ul {
+    padding: 12px 10px 10px;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .pages ul {
+    padding: 12px 10px 10px;
+  }
+}
+.pages ul li {
+  display: inline-block;
+  padding-left: 0px;
+  margin-right: 7px;
+  margin-bottom: 0;
+  margin-left: 7px;
+  font-size: 12px;
+  line-height: 18px;
+  color: #404146;
+  text-align: center;
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .pages ul li {
+    margin-right: 0;
+    margin-left: 0;
+  }
+}
+.pages a {
+  height: 19px;
+  width: 19px;
+  display: inline-block;
+  border-radius: 100%;
+  -moz-border-radius: 100%;
+  -webkit-border-radius: 100%;
+  -o-border-radius: 100%;
+  -ms-border-radius: 100%;
+  font-size: 12px;
+  line-height: 18px;
+  color: #404146;
+  text-decoration: none;
+  text-align: center;
+}
+.pages a:hover {
+  background-color: #4A6377;
+  color: #fff;
+}
+.pages .selected {
+  color: #fff;
+  background-color: #4A6377;
+}
+.pages .pages_prev {
+  margin-right: 30px;
+  text-decoration: underline;
+  width: auto;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .pages .pages_prev {
+    margin-right: 0;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .pages .pages_prev {
+    margin-right: 0;
+  }
+}
+.pages .pages_prev:hover {
+  text-decoration: none;
+  background-color: transparent;
+  color: #404040;
+}
+.pages .pages_next {
+  margin-left: 30px;
+  text-decoration: underline;
+  width: auto;
+}
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .pages .pages_next {
+    margin-left: 0;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .pages .pages_next {
+    margin-left: 0;
+  }
+}
+.pages .pages_next:hover {
+  text-decoration: none;
+  background-color: transparent;
+  color: #404040;
+}
+
+h6 {
+  font-size: 18px;
+  line-height: 22px;
+  color: #404146;
+  padding-bottom: 10px;
+  text-align: center;
+}
+
+.error_fedback {
+  padding: 80px 100px 0px;
+}
+@media only screen and (min-width: 320px) and (max-width: 969px) {
+  .error_fedback {
+    padding: 80px 0px 0px;
+  }
+}
+.error_fedback h6 {
+  text-align: left;
+}
+.error_fedback textarea {
+  border: 1px solid #cbcbcb;
+  width: 100%;
+  max-width: 100%;
+  padding: 10px;
+  height: 100px;
+  color: #404146;
+  font-size: 14px;
+  line-height: 18px;
+  margin-bottom: 12px;
+}
+
+.error_fedback_btn {
+  width: 189px;
+  height: 47px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 16px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  line-height: 25px;
+  margin-top: 10px;
+  display: block;
+  float: right;
+}
+.error_fedback_btn:hover, .error_fedback_btn:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.error_fedback_btn:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.list_back {
+  text-align: center;
+  padding-top: 55px;
+  padding-bottom: 45px;
+  color: #4A6377;
+  font-size: 14px;
+}
+.list_back a {
+  color: #4A6377;
+  text-decoration: none !important;
+  border-bottom: 1px dashed #4A6377;
+  font-size: 14px;
+  display: inline-block;
+  padding-bottom: 3px;
+}
+.list_back a:hover {
+  color: #4A6377;
+  border-bottom-color: transparent;
+}
+
+.test_parameters {
+  padding: 70px 100px 40px;
+  text-align: center;
+}
+.test_parameters h4 {
+  font-size: 30px;
+  line-height: 36px;
+  color: #404146;
+  padding-bottom: 10px;
+}
+
+.ul_box {
+  list-style: none;
+}
+.ul_box li {
+  text-align: left;
+  background: url(../images/icon/ul_list.png) 0 5px no-repeat;
+  padding-left: 24px;
+  font-size: 16px;
+  line-height: 20px;
+  padding-bottom: 20px;
+}
+
+.start_test_btn {
+  width: 230px;
+  height: 50px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -o-border-radius: 50px;
+  -ms-border-radius: 50px;
+  text-align: center;
+  color: #b39b02;
+  font-family: "RobotoBold";
+  font-size: 26px;
+  background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-bottom: 4px solid #D2BF00;
+  line-height: 43px;
+  display: block;
+  margin: 20px auto 50px;
+}
+.start_test_btn:hover, .start_test_btn:focus {
+  background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border-bottom: 4px solid #D2BF00;
+  text-decoration: none;
+}
+.start_test_btn:active {
+  background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%);
+  box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12);
+  color: #908505;
+  border: none;
+  border-top: 4px solid #D2BF00;
+  text-decoration: none;
+}
+
+.testing_info_foot {
+  text-align: center;
+  font-size: 20px;
+  line-height: 20px;
+  margin-top: 40px;
+  margin-bottom: -60px;
+}
+
+.ball_hover {
+  background: url(../images/phone_hover2.png) no-repeat center center;
+  width: 222px;
+  height: 88px;
+  display: none;
+  position: absolute;
+  top: 58px;
+  right: -14px;
+  color: #3c4755;
+  font-family: "RobotoLight";
+  font-size: 14px;
+  line-height: 21px;
+  text-align: center;
+  padding-top: 25px;
+  z-index: 4;
+}
+
+.show_ball_hover {
+  display: block;
+}
+
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .show_ball_hover {
+    display: none;
+  }
+}
+@media only screen and (min-width: 320px) and (max-width: 479px) {
+  .show_ball_hover {
+    display: none;
+  }
+}

frontend/web/js/common.js

- $(document).ready(function() {
+$(document).ready(function() {
 	$.parallaxify();
 
 	$(".player").mb_YTPlayer();
@@ -258,6 +258,7 @@
 		offset : "20%"
 	});
 
+
 	$(".section4 .ul_check").waypoint(function() {
 
 		$(".section4 .puls").each(function(index) {
@@ -352,6 +353,11 @@
 			container: '.validreg_form',
 		});
 	});
+	$(function () {
+		window.validation.init({
+			container: '.sh_reg_form',
+		});
+	});
 	$(".toggle-mnu").click(function () {
     	$(".menu").toggleClass("menu_active");
     });
@@ -368,7 +374,6 @@ $(window).load(function() {
 	$(".loader").delay(400).fadeOut("slow");
 
 });
- 
 $(window).scroll(function() {
 	var st = $(this).scrollTop();
 
@@ -493,3 +498,51 @@ $('.txt_server').hover(
 		$('.set7').removeClass('set7_hover');
 	}
 );
+$('.ls_block_item').hover(
+	function()
+	{
+		$(this).addClass('ls_block_item-hover');
+	},
+	function()
+	{
+		$(this).removeClass('ls_block_item-hover');
+	}
+);
+$('.ls_block_btn').hover(
+	function()
+	{
+		$(this).addClass('ls_block_item-hover');
+	},
+	function()
+	{
+		$(this).removeClass('ls_block_item-hover');
+	}
+);
+$(function() {
+	$('.ball-link').hover(function() {
+		if($('.ball_hover').is(':visible')) {
+			$('.ball_hover').removeClass('show_ball_hover'); 
+		}
+		else {
+			$('.ball_hover').addClass('show_ball_hover'); 
+		}   
+	}); 
+});
+$(function() {
+	$('.ball-link_testing').hover(function() {
+		if($('.ball_hover').is(':visible')) {
+			$('.ball_hover').removeClass('show_ball_hover'); 
+		}
+		else {
+			$('.ball_hover').addClass('show_ball_hover'); 
+		}   
+	}); 
+});
+
+jQuery(document).ready(function(){ 
+    
+    $(".box_off").on('click', function () {
+   		$(this).parent().toggleClass("box_off_hide");
+	});
+	
+});
\ No newline at end of file

frontend/web/sass/screen.sass

@@ -4,6 +4,7 @@
  * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
 
 @import "compass/reset"
+@import "compass/css3"
 
 @import "mixin"
 
@@ -41,6 +42,8 @@ html.js .loader
 		display: table
 	&:after
 		clear: both
+ol
+	counter-reset: myCounter
 body
 	background: #344555
 	font-size: 17px
@@ -102,7 +105,7 @@ a.logo
 				font-size: 15px
 				display: block
 				float: left
-				padding: 0px 12px
+				padding: 0px 8px
 				height: 38px
 				line-height: 34px
 				border: 2px solid transparent
@@ -166,7 +169,7 @@ a.logo
 		color: #fff
 		font-size: 15px
 		display: block
-		padding: 0px 12px
+		padding: 0px 8px
 		height: 38px
 		line-height: 34px
 		border: 2px solid transparent
@@ -520,6 +523,7 @@ a.toggle_bottom
 			width: 101px
 			height: 92px
 			z-index: 99
+			+transition(all 2s linear)
 			+r(768,970)
 				display: none
 			+r(480,767)
@@ -534,6 +538,7 @@ a.toggle_bottom
 		width: 337px
 		height: 279px
 		z-index: 99
+		+transition(all 2s linear)
 		+r(768,970)
 			display: none
 		+r(480,767)
@@ -548,6 +553,7 @@ a.toggle_bottom
 		width: 279px
 		height: 421px
 		z-index: 99
+		+transition(all 2s linear)
 		+r(768,970)
 			display: none
 		+r(480,767)
@@ -789,7 +795,8 @@ a.toggle_bottom
 	position: relative
 	z-index: 2
 	+r(320,479)
-		min-height: 610px
+		margin-top: 40px
+		min-height: 640px
 .section5
 	width: 100%
 	min-height: 804px
@@ -2056,7 +2063,7 @@ ul.ul_check
 	width: 100%
 	background: #fff
 	+br(8px)
-	padding: 37px 68px
+	padding: 32px 68px 37px
 	margin-top: 119px
 	box-shadow: 0 0 46px rgba(0, 0, 2, 0.14)
 	margin-bottom: 80px
@@ -2144,7 +2151,6 @@ ul.ul_check
 	display: block
 	margin-top: 16px
 	color: #fff
-	text-decoration: underline
 	&:hover, &:active, &:focus
 		color: #fff
 		text-decoration: none
@@ -2305,7 +2311,7 @@ footer
 		margin-top: -60px
 	+r(320,479)
 		margin-top: 148px
-		margin-left: -20px
+		margin-left: -50px
 		img
 			width: 100%
 			height: auto
@@ -2441,6 +2447,8 @@ footer
 	&_on
 		opacity: 1
 		top: 255px
+	+r(768,970)
+		right: 233px
 	+r(480,767)
 		display: none
 	+r(320,479)
@@ -3307,7 +3315,7 @@ footer
 	margin-bottom: 38px
 	display: block
 .rev_sec
-	padding-top: 46px
+	padding-top: 0px
 	background: #fff url(../images/rev_bg.png) no-repeat bottom center
 	padding-bottom: 40px
 .rev_img
@@ -4874,7 +4882,7 @@ footer
 .cont_block
 	border-left: 1px solid #fff
 	padding-left: 32px
-	margin-top: 76px
+	margin-top: 50px
 	&__city
 		color: #2d3642
 		font-size: 29px
@@ -5255,3 +5263,1805 @@ footer
 		position: absolute
 		background-color: rgba(0,0,0,.6)
 		z-index: 10
+.sh_kurs
+	background: #fff
+	h1
+		color: #2d3642
+		font-family: "RobotoBold"
+		font-size: 35px 
+		line-height: 41px
+		margin-top: 40px
+		font-weight: normal
+		+r(320,479)
+			font-size: 30px
+	p
+		color: #2d3642
+		font-size: 16px
+		line-height: 26px
+		margin-top: 26px
+		+r(320,479)
+			font-size: 14px
+			line-height: 23px
+.sh_social
+	margin-top: 50px
+	margin-left: 18px
+	+r(480,767)
+		margin-left: 0
+		margin-top: 30px
+	+r(320,479)
+		margin-left: 0
+		margin-top: 30px
+.kurs
+	&_item
+		width: 907px
+		height: 262px
+		margin: 50px auto 64px
+		position: relative
+		+r(768,970)
+			width: 750px
+			height: auto
+		+r(480,767)
+			width: 450px
+			height: auto
+		+r(320,479)
+			width: 270px
+			height: auto
+			margin: 50px auto 100px
+	&_img
+		width: 907px
+		height: 262px
+		+box-shadow(6.7px 7.4px 16px rgba(0, 0, 2, 0.24))
+		+r(768,970)
+			width: 750px
+			height: auto
+		+r(480,767)
+			width: 450px
+			height: auto
+		+r(320,479)
+			width: 270px
+			height: auto
+		img
+			width: 100%
+			height: auto
+	&_over
+		position: absolute
+		width: 100%
+		height: 100%
+		top: 0
+		left: 0
+		background-color: rgba(45, 54, 66, 0.49)
+		padding: 15px
+		+r(320,479)
+			padding: 5px
+	&_sub-title
+		font-size: 16px
+		line-height: 35px
+		color: #2d3642
+		+r(768,970)
+			font-size: 13px
+			line-height: 30px
+		+r(480,767)
+			display: none
+		+r(320,479)
+			display: none
+		span
+			background: #fff
+			padding: 5px 10px
+	&_foot
+		position: absolute
+		bottom: 30px
+		left: 30px
+		+r(480,767)
+			bottom: 15px
+			left: 15px
+		+r(320,479)
+			left: 0px
+			bottom: -40px
+h1.kurs_title
+	font-size: 25px
+	color: #31373f
+	font-family: "RobotoBold"
+	display: inline
+	margin-bottom: 2px
+	font-weight: normal
+	margin: 0
+	line-height: 48px
+	+r(768,970)
+		font-size: 20px
+		line-height: 32px
+	+r(480,767)
+		font-size: 13px
+		line-height: 24px
+	+r(320,479)
+		font-size: 13px
+		line-height: 22px
+	span
+		padding: 6px 10px
+		background: #fff
+		+r(768,970)
+			padding: 2px 6px
+		+r(480,767)
+			padding: 2px 6px
+		+r(320,479)
+			padding: 1px 6px
+.lock
+	background-color: rgba(45, 54, 66, 0.89)
+.kurs_lock
+	background: url(../images/kurs_lock.png) no-repeat center center
+	width: 907px
+	height: 25px
+	position: absolute
+	bottom: 93px
+	left: 0
+	+r(768,970)
+		width: 750px
+	+r(480,767)
+		bottom: 60px
+		width: 450px
+	+r(320,479)
+		display: none
+a.kurs_bt
+	display: block
+	height: 36px
+	padding: 0px 15px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-size: 16px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	line-height: 29px
+	text-decoration: none
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+.blip_kurs
+	position: absolute
+	top: 55px
+	right: 0
+	width: 279px
+	height: 75px
+	background: url(../images/blip_kurs.png) no-repeat center center
+	font-size: 17px
+	text-align: center
+	color: #fff
+	line-height: 20px
+	padding-top: 10px
+	font-family: "RobotoBold"
+	+r(480,767)
+		display: none
+	+r(320,479)
+		display: none
+.for_it
+	background-color: #65b6d4
+	height: 28px
+	min-width: 20px
+	position: absolute
+	right: 0
+	bottom: 30px
+	font-size: 13px
+	color: #fff
+	line-height: 27px
+	padding: 0px 10px
+	+r(480,767)
+		bottom: 15px
+	+r(320,479)
+		bottom: 0
+.r_it
+	width: 45px
+	height: 45px
+	background: #65b6d4
+	position: absolute
+	top: -9px
+	left: -39px
+	+br(50px)
+	+r(320,479)
+		display: none
+	&:before
+		content: ''
+		background: url(../images/icon/it_icon.png) no-repeat center center
+		width: 20px
+		height: 27px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 5px
+		left: 12px
+.for_im
+	background-color: #d200ff
+	height: 28px
+	min-width: 20px
+	position: absolute
+	right: 0
+	bottom: 30px
+	font-size: 13px
+	color: #fff
+	line-height: 27px
+	padding: 0px 10px
+	+r(480,767)
+		bottom: 15px
+	+r(320,479)
+		bottom: 0
+.r_im
+	width: 45px
+	height: 45px
+	background-color: #d200ff
+	position: absolute
+	top: -9px
+	left: -39px
+	+br(50px)
+	+r(320,479)
+		display: none
+	&:before
+		content: ''
+		background: url(../images/icon/im_icon.png) no-repeat center center
+		width: 23px
+		height: 24px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 6px
+		left: 11px
+.for_sb
+	background-color: #A900FF
+	height: 28px
+	min-width: 20px
+	position: absolute
+	right: 0
+	bottom: 30px
+	font-size: 13px
+	color: #fff
+	line-height: 27px
+	padding: 0px 10px
+	+r(480,767)
+		bottom: 15px
+	+r(320,479)
+		bottom: 0
+.r_sb
+	width: 45px
+	height: 45px
+	background-color: #A900FF
+	position: absolute
+	top: -9px
+	left: -39px
+	+br(50px)
+	+r(320,479)
+		display: none
+	&:before
+		content: ''
+		background: url(../images/icon/sb_icon.png) no-repeat center center
+		width: 21px
+		height: 25px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 6px
+		left: 11px
+.for_dv
+	background-color: #A900FF
+	height: 28px
+	min-width: 20px
+	position: absolute
+	right: 0
+	bottom: 30px
+	font-size: 13px
+	color: #fff
+	line-height: 27px
+	padding: 0px 10px
+	+r(480,767)
+		bottom: 15px
+	+r(320,479)
+		bottom: 0px
+.r_dv
+	width: 45px
+	height: 45px
+	background-color: #A900FF
+	position: absolute
+	top: -9px
+	left: -39px
+	+br(50px)
+	+r(320,479)
+		display: none
+	&:before
+		content: ''
+		background: url(../images/icon/dv_icon.png) no-repeat center center
+		width: 22px
+		height: 19px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 6px
+		left: 11px
+.sh_ft
+	background: #fff
+	color: #31373f
+	padding-top: 6px
+	p
+		font-size: 18px
+		line-height: 25px
+		margin-top: 28px
+		+r(320,479)
+			font-size: 14px
+.reg_title
+	font-size: 25px
+	font-family: "RobotoBold"
+	line-height: 35px
+	color: #484b53
+	+r(480,767)
+		font-size: 22px
+	+r(320,479)
+		font-size: 21px
+		text-align: center
+		line-height: 30px
+.sh_reg_form
+	.input_st
+		width: 264px 
+		height: 50px
+		background: #F5F5F5
+		border: none
+		+br(10px)
+		margin-bottom: 34px
+		color: #698387
+		font-size: 16px
+		padding: 0px 18px
+		&::-webkit-input-placeholder
+			color: #698387
+			font-size: 16px
+			opacity: 1
+		&:-moz-placeholder
+			color: #698387
+			font-size: 16px
+			opacity: 1
+		&::-moz-placeholder
+			color: #698387
+			font-size: 16px
+			opacity: 1
+		&:-ms-input-placeholder
+			color: #698387
+			font-size: 16px
+			opacity: 1
+	.field-input.input-error
+		background: #fff url(../images/icon-fail.png) no-repeat 96% center
+		border: 1px solid #E9A2A2
+.sh_bt_send
+	width: 256px
+	height: 74px
+	+br(10px)
+	text-align: center
+	color: #b39b02
+	font-size: 26px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	margin: 0 auto
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+.usl
+	font-size: 14px
+	line-height: 25px
+	margin-top: 30px
+	+r(480,767)
+		text-align: center
+		margin-bottom: 30px
+	+r(320,479)
+		text-align: center
+		font-size: 12px
+		margin-bottom: 30px
+	a
+		color: #1d93bf
+		text-decoration: underline
+		font-size: 13px
+		+r(320,479)
+			font-size: 12px
+		&:hover
+			text-decoration: none
+.sh_reg_form
+	+r(480,767)
+		width: 264px
+		margin: 0 auto
+	+r(320,479)
+		width: 264px
+		margin: 0 auto
+.ks_header
+	background: url(../images/ks_header_bg.jpg) no-repeat center center
+	+cover
+	width: 100%
+	min-height: 75px
+	color: #2d323a
+.ball-block
+	height: 37px
+	font-size: 12px
+	margin-top: 20px
+	line-height: 33px
+	+r(320,479)
+		height: auto
+.col-ball
+	font-size: 24px
+	color: #fff
+	font-family: "RobotoBold"
+	background: #0A79A4
+	text-align: center
+	width: 103px
+	height: 37px
+	display: inline-block
+	margin-left: 18px
+	margin-right: 15px
+	+br(5px)
+.ball-link
+	color: #1f6295
+	font-size: 13px
+	border-bottom: 1px dotted #1f6295
+	&:hover
+		border-bottom: none
+		text-decoration: none
+.prof_block
+	float: right
+	height: 22px
+	line-height: 22px
+	margin-right: 45px
+	margin-top: 24px
+	+r(480,767)
+		float: none
+		margin: 5px 0px 20px 12px
+	+r(320,479)
+		float: none
+		margin: 5px 0px 20px 12px
+	a
+		font-size: 13px
+		color: #00aee0
+		font-family: "RobotoBold"
+		text-decoration: underline
+		&:before
+			content: ''
+			background: url(../images/icon/exit_link_icon.png) no-repeat center center
+			width: 2px
+			height: 22px
+			display: inline-block
+			vertical-align: middle
+			position: relative
+			top: 0px
+			left: -16px
+		&:hover
+			text-decoration: none
+.prof_name
+	font-size: 13px
+	color: #2d323a
+	font-family: "RobotoBold"
+	margin-right: 36px
+	&:before
+		content: ''
+		background: url(../images/icon/prof_block_icon.png) no-repeat center center
+		width: 12px
+		height: 15px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 0px
+		left: -12px
+.video-container
+	background: #262E38
+	width: 100%
+	min-height: 500px
+	padding: 15px 0px 20px
+	+r(320,479)
+		min-height: 440px
+	.sh_social
+		+r(480,767)
+			margin-top: 20px
+		+r(320,479)
+			margin-top: 20px
+.vc-title
+	color: #fff
+	font-size: 30px
+	font-family: "RobotoBold"
+	font-weight: normal
+	line-height: 40px
+	+r(480,767)
+		font-size: 25px
+		line-height: 35px
+	+r(320,479)
+		font-size: 17px
+		line-height: 27px
+.ytb_video
+	width: 100%
+	margin-top: 16px
+	margin-bottom: 26px
+	img
+		width: 100%
+		height: auto
+.vc-subtitle
+	font-size: 21px
+	font-family: "RobotoBold"
+	color: #fff
+	margin-bottom: 8px
+	+r(480,767)
+		font-size: 18px
+		margin-bottom: 10px
+	+r(320,479)
+		font-size: 17px
+		line-height: 26px
+		text-align: center
+	span
+		color: #fee32c
+.vc-uslovia
+	font-size: 15px
+	color: #23f2ff
+	text-decoration: underline
+	+r(320,479)
+		display: block
+		margin: 0 auto
+		width: 228px
+	&:hover
+		color: #23f2ff
+		text-decoration: none
+.vc-cont
+	background: #fff
+	font-size: 16px
+	color: #000
+	padding-top: 35px
+	padding-bottom: 50px
+	h2
+		font-size: 27px
+		color: #2d323a
+		font-weight: normal
+		font-family: "RobotoBold"
+		margin-top: 45px
+		margin-bottom: 40px
+		+r(320,479)
+			font-size: 23px
+	strong
+		color: #000
+		font-size: 17px
+		font-family: "RobotoBold"
+		font-weight: normal
+		+r(320,479)
+			font-size: 14px
+			line-height: 23px
+	p
+		font-size: 16px
+		line-height: 25px
+		margin-top: 10px
+		+r(480,767)
+			font-size: 14px
+			line-height: 23px
+		+r(320,479)
+			font-size: 14px
+			line-height: 23px
+		img
+			float: left
+			margin-right: 30px
+		a
+			color: #119ee7
+			text-decoration: underline
+			&:hover
+				text-decoration: none
+.vc_bt_quit_less
+	width: 284px
+	height: 74px
+	+br(10px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 27px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	margin: 0 auto
+	display: block
+	line-height: 66px
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.vc_quit_txt
+	color: #2d323a
+	font-size: 27px
+	font-family: "RobotoBold"
+	line-height: 66px
+	+r(768,970)
+		font-size: 17px
+	+r(480,767)
+		font-size: 17px
+		line-height: 60px
+		text-align: center
+	+r(320,479)
+		font-size: 18px
+		line-height: 24px
+		margin-top: 25px
+		text-align: center
+
+.vc_green_inf
+	background: #C3EBB9
+	width: 100%
+	height: 119px
+	+br(10px)
+	margin-top: 36px
+	span
+		color: #2d323a
+		font-size: 20px
+		text-align: center
+		display: block
+		line-height: 31px
+		padding-top: 27px
+		+r(480,767)
+			font-size: 13px
+			line-height: 29px
+		+r(320,479)
+			font-size: 13px
+			line-height: 24px
+			padding-top: 13px
+.ol_list
+	margin-top: 41px 
+ol.ol_list
+	li
+		color: #3c4755
+		font-size: 16px
+		+r(768,970)
+			font-size: 13px
+		+r(320,479)
+			font-size: 13px
+		&:before
+			counter-increment: myCounter
+			content: counter(myCounter)
+			color: #3c4755
+			font-size: 15px
+			font-family: "RobotoBold"
+			background: #FFD600
+			display: inline-block
+			text-align: center
+			margin: 4px 12px 4px 4px
+			line-height: 23px
+			width: 23px
+			height: 23px
+			+br(50px)
+.ul_list
+	margin-top: 41px
+ul.ul_list
+	li
+		background: url(../images/icon/ul_list.png) no-repeat left center
+		height: 30px
+		line-height: 30px
+		padding-left: 30px
+		font-size: 16px
+		color: #3c4755
+		+r(768,970)
+			font-size: 13px
+		+r(320,479)
+			font-size: 13px
+			height: auto
+			line-height: 17px
+			margin-bottom: 10px
+.tb_vp
+	margin-top: 49px
+	margin-bottom: 50px
+	overflow-x: auto
+	+r(320,479)
+		margin-top: 20px
+tr
+	th
+		padding: 15px 20px
+		border: 1px solid #C7C7C7
+		vertical-align: top
+		color: #2d323a
+		font-size: 16px
+		line-height: 20px
+thead
+	tr
+		th
+			background: #FFDF00
+			font-family: "RobotoBold"
+			color: #2d323a
+			font-size: 16px
+			line-height: 21px
+			padding: 0px 0px 0px 20px
+			border: 1px solid #FFEF81
+			vertical-align: middle
+.ai_link
+	font-size: 16px
+	color: #6ebaee
+	text-decoration: underline
+	margin-left: 20px
+	display: inline-block
+	margin-bottom: 60px
+	margin-top: 18px
+	+r(768,970)
+		width: 250px
+		margin-top: 10px
+		line-height: 20px
+	+r(320,479)
+		width: 200px
+		margin-top: 10px
+		line-height: 20px
+		font-size: 14px
+	&:hover
+		color: #6ebaee
+		text-decoration: none
+.ai_format
+	background: url(../images/icon/ai_format.png) no-repeat center center
+	width: 43px
+	height: 58px
+	display: block
+	float: left
+.rar_link
+	font-size: 16px
+	color: #6ebaee
+	text-decoration: underline
+	margin-left: 20px
+	display: inline-block
+	margin-bottom: 60px
+	margin-top: 18px
+	+r(768,970)
+		width: 250px
+		margin-top: 10px
+		line-height: 20px
+	+r(320,479)
+		width: 200px
+		margin-top: 10px
+		line-height: 20px
+		font-size: 14px
+	&:hover
+		color: #6ebaee
+		text-decoration: none
+.rar_format
+	background: url(../images/icon/rar_format.png) no-repeat center center
+	width: 43px
+	height: 58px
+	display: block
+	float: left
+.ppt_link
+	font-size: 16px
+	color: #6ebaee
+	text-decoration: underline
+	margin-left: 20px
+	display: inline-block
+	margin-bottom: 38px
+	margin-top: 18px
+	+r(768,970)
+		width: 250px
+		margin-top: 10px
+		line-height: 20px
+	+r(320,479)
+		width: 200px
+		margin-top: 10px
+		line-height: 20px
+		font-size: 14px
+	&:hover
+		color: #6ebaee
+		text-decoration: none
+.ppt_format
+	background: url(../images/icon/ppt_format.png) no-repeat center center
+	width: 43px
+	height: 58px
+	display: block
+	float: left
+.vc-com_tit
+	font-size: 35px
+	color: #2d323a
+	line-height: 50px
+	font-family: "RobotoBold"
+	margin-top: 49px
+	margin-bottom: 35px
+	+r(768,970)
+		font-size: 28px
+		line-height: 40px
+	+r(480,767)
+		font-size: 28px
+		line-height: 40px
+	+r(320,479)
+		font-size: 20px
+		line-height: 30px
+.vc-y_link
+	display: block
+	+br(7px)
+	width: 107px
+	height: 52px
+	-webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	-moz-box-shadow:    4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	box-shadow:         4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	font-size: 18px
+	color: #7d7d7d
+	font-family: "RobotoBold"
+	text-align: center
+	line-height: 50px
+	display: inline-block
+	margin-right: 30px
+	+r(320,479)
+		margin-right: 15px
+	&:hover, &:focus
+		text-decoration: none
+		background: #00CF56
+		color: #fff
+	&:active
+		-webkit-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+		-moz-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+		box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+	&:before
+		content: ''
+		background: url(../images/icon/y_like.png) no-repeat center center
+		width: 19px
+		height: 18px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 0px
+		left: -12px
+.vc-y_link
+	&:hover, &:focus, &:active
+		&:before
+			background: url(../images/icon/y_like_hover.png) no-repeat center center
+.vc-n_link
+	display: block
+	+br(7px)
+	width: 107px
+	height: 52px
+	-webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	-moz-box-shadow:    4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	box-shadow:         4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+	font-size: 18px
+	color: #7d7d7d
+	font-family: "RobotoBold"
+	text-align: center
+	line-height: 50px
+	display: inline-block
+	margin-right: 30px
+	&:hover, &:focus
+		text-decoration: none
+		background: #F26363
+		color: #fff
+	&:active
+		-webkit-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+		-moz-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+		box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+	&:before
+		content: ''
+		background: url(../images/icon/n_like.png) no-repeat center center
+		width: 19px
+		height: 18px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 0px
+		left: -12px
+.vc-n_link
+	&:hover, &:focus, &:active
+		&:before
+			background: url(../images/icon/n_like_hover.png) no-repeat center center
+.les_list_top
+	background: url(../images/les_top_bg.jpg) no-repeat center center
+	width: 100%
+	height: 377px
+	+cover
+	position: relative
+	-webkit-box-shadow: 0px 16px 24px 0px rgba(0,0,02,0.40)
+	-moz-box-shadow: 0px 16px 24px 0px rgba(0,0,02,0.40)
+	box-shadow: 0px 16px 24px 0px rgba(0,0,02,0.40)
+.ls_top_over
+	width: 100%
+	height: 100%
+	position: absolute
+	top: 0
+	left: 0
+	background: rgba(84, 101, 118, 0.5)
+.ls_title
+	font-size: 29px
+	color: #fff
+	font-weight: normal
+	line-height: 54px
+	font-family: "RobotoBold"
+	display: inline-block
+	margin-top: 66px
+	+r(480,767)
+		font-size: 22px
+		margin-top: 26px
+	+r(320,479)
+		font-size: 14px
+		margin-top: 0
+	span
+		position: relative
+		background: #262E38
+		padding: 5px 22px
+.ls_subtitle
+	font-size: 17px
+	line-height: 34px
+	display: inline-block
+	margin-top: 16px
+	+r(320,767)
+		line-height: 25px
+	+r(320,479)
+		font-size: 14px
+		margin-top: 0
+	span
+		position: relative
+		background: #262E38
+		padding: 6px 20px
+		+r(320,767)
+			display: inline-block
+.ls_txt
+	font-size: 17px
+	line-height: 34px
+	display: inline-block
+	margin-top: 7px
+	+r(320,767)
+		line-height: 25px
+	span
+		position: relative
+		background: #262E38
+		padding: 6px 20px
+		+r(320,767)
+			display: inline-block
+.ls_now_btn
+	width: 172px
+	height: 55px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 20px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	display: block
+	line-height: 50px
+	margin-top: 31px
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.ls_list_block
+	background: url(../images/ls_list_bg.jpg) repeat-y top center
+	width: 100%
+	min-height: 638px
+	padding-top: 82px
+	+r(320,767)
+		padding-bottom: 80px
+.ls_block_item
+	width: 210px
+	height: 236px
+	background: #fff
+	margin: 0 auto
+	display: block
+	padding-top: 27px
+	margin-bottom: 34px
+	&:hover, &:focus, &:active
+		text-decoration: none
+.line_ls
+	background: url(../images/icon/line_ls.png) no-repeat center center
+	width: 84px
+	height: 21px
+	font-size: 14px
+	color: #fff
+	text-align: center
+	line-height: 19px
+a.ls_block_title
+	font-size: 17px
+	color: #939393
+	line-height: 27px
+	margin: 17px 25px 0px 16px
+	display: block
+	&:hover
+		text-decoration: none
+.ls_block_btn
+	width: 92px
+	height: 30px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 12px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	line-height: 25px
+	margin-top: 36px
+	margin-left: 15px
+	display: none
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.ls_fine_txt
+	color: #fff
+	font-size: 13px
+	margin-left: 15px
+	margin-top: 20px
+.ls_fine
+	background: #80A2BC
+	.ls_block_title
+		color: #fff
+.ls_block_item-hover
+	background: #EDEDED
+	.ls_block_title
+		color: #2d323a
+	.ls_block_btn
+		display: block
+	.ls_fine_txt
+		display: none
+.ls_fine.ls_block_item-hover
+	.ls_block_btn
+		margin-top: 12px
+		width: 107px
+.ls_likes
+	background: #F6F6F6
+	width: 210px
+	height: 123px
+	margin: 0 auto
+	padding-top: 20px
+	padding-left: 14px
+	&_title
+		font-size: 17px
+		color: #2d323a
+		font-family: "RobotoBold"
+		margin-bottom: 17px
+	&_y
+		-webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		-moz-box-shadow:    4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		box-shadow:         4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		width: 68px
+		height: 42px
+		background: #fff
+		font-size: 15px
+		color: #7d7d7d
+		text-align: center
+		line-height: 38px
+		font-family: "RobotoBold"
+		+br(7px)
+		display: inline-block
+		margin-right: 10px
+		&:hover, &:focus
+			background: #00CF56
+			color: #fff
+			text-decoration: none
+		&:active
+			-webkit-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+			-moz-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+			box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+	&_n
+		-webkit-box-shadow: 4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		-moz-box-shadow:    4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		box-shadow:         4px 3px 10px 0px rgba(0, 0, 2, 0.35)
+		width: 68px
+		height: 42px
+		background: #fff
+		font-size: 15px
+		color: #7d7d7d
+		text-align: center
+		line-height: 38px
+		font-family: "RobotoBold"
+		+br(7px)
+		display: inline-block
+		&:hover, &:focus
+			background: #F26363
+			color: #fff
+			text-decoration: none
+		&:active
+			-webkit-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+			-moz-box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+			box-shadow: inset 4px 4px 0px 0px rgba(0,0,0,0.21)
+.prof_block_testing
+	float: right
+	height: 22px
+	line-height: 22px
+	margin-right: 45px
+	margin-top: 24px
+	+r(480,767)
+		float: none
+		margin: 5px 0px 20px 12px
+	+r(320,479)
+		float: none
+		margin: 5px 0px 20px 12px
+	a
+		font-size: 13px
+		color: #00aee0
+		font-family: "RobotoBold"
+		text-decoration: underline
+		&:before
+			content: ''
+			background: url(../images/icon/exit_link_icon.png) no-repeat center center
+			width: 2px
+			height: 22px
+			display: inline-block
+			vertical-align: middle
+			position: relative
+			top: 0px
+			left: -16px
+		&:hover
+			text-decoration: none
+.prof_name_testing
+	font-size: 13px
+	color: #fff
+	font-family: "RobotoBold"
+	margin-right: 36px
+	&:before
+		content: ''
+		background: url(../images/icon/prof_block_icon_w.png) no-repeat center center
+		width: 12px
+		height: 15px
+		display: inline-block
+		vertical-align: middle
+		position: relative
+		top: 0px
+		left: -12px
+.ball-block_testing
+	height: 37px
+	font-size: 12px
+	margin-top: 20px
+	line-height: 33px
+	+r(768,970)
+		margin-bottom: 20px
+	+r(320,479)
+		height: auto
+.col-ball_testing
+	font-size: 24px
+	color: #fff
+	font-family: "RobotoBold"
+	background: #0A79A4
+	text-align: center
+	width: 103px
+	height: 37px
+	display: inline-block
+	margin-left: 18px
+	margin-right: 15px
+	+br(5px)
+.ball-link_testing
+	color: #00baff
+	font-size: 13px
+	border-bottom: 1px dotted #00baff
+	&:hover, &:focus, &:active
+		color: #00baff
+		border-bottom: none
+		text-decoration: none
+.top_line_testing
+	width: 100%
+	min-height: 38px
+	background: #F1F1F1
+	font-size: 15px
+	color: #969696
+	line-height: 34px
+	+r(480,767)
+		line-height: 24px
+	+r(320,479)
+		line-height: 24px
+	strong
+		font-weight: normal
+		font-family: "RobotoBold"
+		display: inline-block
+	p
+		display: inline-block
+.testing_block
+	background: #FFF
+	color: #404146
+	padding-top: 17px
+	&_title
+		font-size: 26px
+		font-weight: normal
+		line-height: 30px
+		+r(480,767)
+			font-size: 21px
+			line-height: 20px
+		+r(320,479)
+			font-size: 21px
+			line-height: 20px
+.testing_num
+	display: inline-block
+	width: 50px
+	height: 50px
+	background: #4B6579
+	font-size: 18px
+	color: #fff
+	+br(50px)
+	text-align: center
+	line-height: 45px
+	+r(480,767)
+		width: 45px
+		height: 45px
+		line-height: 44px
+	+r(320,479)
+		width: 45px
+		height: 45px
+		line-height: 44px
+		margin: 0 auto 10px
+		display: block
+.testing_img_block
+	border: 1px solid #ccc
+	width: 254px
+	height: 144px
+	margin: 41px auto 0px
+	padding: 8px 24px
+.testing_form
+	margin-top: 27px
+.input_bg
+	min-height: 45px
+	background: #EBEBEB
+	margin-bottom: 11px
+	padding: 6px 10px 0px
+	font-size: 14px
+	color: #546577
+	+r(480,767)
+		line-height: 20px
+		padding: 0px 10px 10px
+	+r(320,479)
+		line-height: 20px
+		padding: 0px 10px 10px
+	input[type="text"]
+		height: 34px
+		border: 1px solid #ccc
+		width: 100%
+		font-size: 12px
+		padding: 0px 15px
+		+r(480,767)
+			margin-top: 10px
+		+r(320,479)
+			margin-top: 10px
+.radio
+	vertical-align: top
+	margin: 0 3px 0 0
+	width: 18px
+	height: 18px
+.radio + label
+	cursor: pointer
+.radio
+	&:not(checked)
+		position: absolute
+		opacity: 0
+.radio:not(checked) + label
+	position: relative
+	padding: 9px 0px 0px 35px
+	+r(480,767)
+		padding: 11px 0px 0px 35px
+	+r(320,479)
+		padding: 11px 0px 0px 35px
+.radio:not(checked) + label:before
+	content: ''
+	position: absolute
+	top: 7px
+	left: 1px
+	width: 18px
+	height: 18px
+	background: url(../images/icon/radio_normal.png) no-repeat center center
+.radio:checked + label:before
+	background: url(../images/icon/radio_check.png) no-repeat center center
+.checkbox
+	vertical-align: top
+	margin: 0 3px 0 0
+	width: 16px
+	height: 16px
+
+.checkbox + label
+	cursor: pointer
+
+.checkbox
+	&:not(checked)
+		position: absolute
+		opacity: 0
+.checkbox:not(checked) + label
+	position: relative
+	padding: 9px 0px 0px 35px
+	+r(480,767)
+		padding: 11px 0px 0px 35px
+	+r(320,479)
+		padding: 11px 0px 0px 35px
+
+.checkbox:not(checked) + label:before
+	content: ''
+	position: absolute
+	top: 7px
+	left: 3px
+	width: 16px
+	height: 16px
+	background: url(../images/icon/checkbox_normal.png) no-repeat center center
+
+.checkbox:checked + label:before
+	background: url(../images/icon/checkbox_check.png) no-repeat center center
+.testing_form_btn
+	width: 189px
+	height: 47px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 16px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	line-height: 25px
+	margin-top: 43px
+	display: block
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.testing_foot
+	background: #fff
+	padding-top: 86px
+	.test_ft
+		background: #F3F4F5
+		min-height: 56px
+		margin: 0px 15px 13px
+.testing_votes
+	font-size: 16px
+	color: #404146
+	display: inline-block
+	margin-top: 19px
+	margin-left: 6px
+	+r(480,767)
+		display: block
+		margin: 10px 0px 0px 0px
+		text-align: center
+	+r(320,479)
+		display: block
+		margin: 10px 0px 0px 0px
+		text-align: center
+	strong
+		font-weight: normal
+		font-family: "RobotoBold"
+		color: #546577
+.testing_progress
+	width: 262px
+	height: 13px
+	background: #fdd60f
+	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.21)
+	-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.21)
+	box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.21)
+	+br(50px)
+	position: relative
+	display: inline-block
+	margin-left: 30px
+	+r(480,767)
+		margin: 10px auto 0px
+		display: block
+	+r(320,479)
+		margin: 10px auto 0px
+		display: block
+		width: 240px
+	&_proc
+		position: absolute
+		top: 0
+		left: 0
+		width: 92px
+		height: 13px
+		background: #536e91
+		+br(50px)
+.testing_time
+	font-size: 12px
+	color: #404146
+	float: right
+	margin-top: 16px
+	margin-right: 10px
+	+r(480,767)
+		float: none
+		margin: 10px 0px
+		text-align: center
+	+r(320,479)
+		float: none
+		margin: 10px 0px
+		text-align: center
+	span
+		font-size: 18px
+		color: #00baff
+footer.testing_footer
+	min-height: 60px
+	background: #2d323a
+.taskon_testing
+	display: block
+	width: 100px
+	margin: 12px 0px 5px 5px
+	+r(480,767)
+		margin: 20px auto 0px
+	+r(320,479)
+		margin: 20px auto 0px
+.inf_foot_testing
+	font-size: 11px
+	color: #fff
+	margin-top: 25px
+	+r(480,767)
+		text-align: center
+	+r(320,479)
+		text-align: center
+.help_btn
+	display: block
+	font-size: 11px
+	color: #fff
+	text-align: center
+	width: 72px
+	height: 26px
+	background: #0BF
+	line-height: 22px
+	float: right
+	margin-top: 18px
+	+r(480,767)
+		float: none
+		margin: 20px auto
+	+r(320,479)
+		float: none
+		margin: 20px auto
+	&:hover, &:focus
+		background: #00C6C0
+		text-decoration: none
+		color: #fff
+	&:active
+		background: #436E94
+		text-decoration: none
+		color: #fff
+a.logo_testing
+	height: 34px
+	display: block
+	margin-top: 24px
+	width: 125px
+	+r(768,970)
+		margin: 20px auto 0px
+.successfully_title
+	font-size: 48px
+	line-height: 50px
+	font-family: "RobotoBold"
+	text-align: center
+	font-weight: normal
+	color: #4A6377
+	padding: 0px
+	margin-top: 50px
+	+r(320,479)
+		font-size: 35px
+.successfully_subtitle
+	font-size: 26px
+	line-height: 50px
+	color: #404146
+	padding-bottom: 5px
+	text-align: center
+.succes_title_block
+	font-size: 20px
+	text-align: center
+	color: #404146
+	line-height: 22px
+	padding-bottom: 5px
+	margin-top: 80px
+.succes_block_cont
+	color: #4A6377
+	font-size: 36px
+	text-align: center
+	line-height: 50px
+.stat_testing
+	margin-top: 80px
+	li
+		padding-bottom: 20px
+		font-size: 16px
+		line-height: 27px
+		color: #404146
+	span
+		background-color: #F7F7F7
+		border: 1px solid #EFEFEF
+		font-size: 18px
+		line-height: 38px
+		color: #404146
+		margin-right: 20px
+		width: 50px
+		height: 38px
+		display: inline-block
+		text-align: center
+.read_box_wr
+	border: 3px solid #ffdbdb
+	margin-bottom: 10px
+	.read_box
+		margin-bottom: 0
+.read_box
+	background-color: #fcf0f0
+	border: 1px solid #f6cbcb
+	color: #ff0000
+	font-size: 14px
+	line-height: 20px
+	text-align: center
+	padding: 15px
+	margin-bottom: 10px
+	position: relative
+	p
+		color: #ff0000
+		font-size: 14px
+		line-height: 20px
+		padding: 0
+		margin: 0
+.read_box_off
+	position: absolute
+	right: 8px
+	top: 8px
+	color: #855c5c
+	font-size: 14px
+	line-height: 20px
+	cursor: pointer
+	opacity: 0.7
+	+r(320,479)
+		top: -1px
+	strong
+		font-size: 18px
+	&:hover
+		opacity: 1
+.box_off_hide
+	display: none
+.gray_box
+	background-color: #f7f7f7
+	border: 1px solid #e9e9e9
+	color: #404146
+	font-size: 14px
+	line-height: 20px
+	text-align: center
+	padding: 15px
+	margin-bottom: 10px
+	p
+		color: #404146
+		font-size: 14px
+		line-height: 20px
+		padding: 0
+		margin: 0
+.pages
+	text-align: center
+	margin-bottom: 40px
+	margin-top: 25px
+	ul
+		overflow: hidden
+		padding: 12px 40px
+		padding-bottom: 10px
+		list-style: none
+		background-color: #f2f2f2
+		display: inline-block
+		+r(480,767)
+			padding: 12px 10px 10px
+		+r(320,479)
+			padding: 12px 10px 10px
+		li
+			display: inline-block
+			padding-left: 0px
+			margin-right: 7px
+			margin-bottom: 0
+			margin-left: 7px
+			font-size: 12px
+			line-height: 18px
+			color: #404146
+			text-align: center
+			+r(320,479)
+				margin-right: 0
+				margin-left: 0
+	a
+		height: 19px
+		width: 19px
+		display: inline-block
+		+br(100%)
+		font-size: 12px
+		line-height: 18px
+		color: #404146
+		text-decoration: none
+		text-align: center
+		&:hover
+			background-color: #4A6377
+			color: #fff
+	.selected
+		color: #fff
+		background-color: #4A6377
+	.pages_prev 
+		margin-right: 30px
+		text-decoration: underline 
+		width: auto
+		+r(480,767)
+			margin-right: 0
+		+r(320,479)
+			margin-right: 0
+		&:hover
+			text-decoration: none
+			background-color: transparent
+			color: #404040
+	.pages_next
+		margin-left: 30px
+		text-decoration: underline 
+		width: auto
+		+r(480,767)
+			margin-left: 0
+		+r(320,479)
+			margin-left: 0
+		&:hover
+			text-decoration: none
+			background-color: transparent
+			color: #404040
+h6
+	font-size: 18px
+	line-height: 22px
+	color: #404146
+	padding-bottom: 10px
+	text-align: center
+.error_fedback
+	padding: 80px 100px 0px
+	+r(320,969)
+		padding: 80px 0px 0px
+	h6
+		text-align: left
+	textarea
+		border: 1px solid #cbcbcb
+		width: 100%
+		max-width: 100%
+		padding: 10px
+		height: 100px
+		color: #404146
+		font-size: 14px
+		line-height: 18px
+		margin-bottom: 12px
+.error_fedback_btn
+	width: 189px
+	height: 47px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 16px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	line-height: 25px
+	margin-top: 10px
+	display: block
+	float: right
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.list_back 
+	text-align: center
+	padding-top: 55px
+	padding-bottom: 45px
+	color: #4A6377
+	font-size: 14px
+	a 
+		color: #4A6377
+		text-decoration: none  !important
+		border-bottom: 1px dashed #4A6377
+		font-size: 14px
+		display: inline-block
+		padding-bottom: 3px
+		&:hover
+			color: #4A6377
+			border-bottom-color: transparent
+.test_parameters
+	padding: 70px 100px 40px
+	text-align: center
+	h4
+		font-size: 30px
+		line-height: 36px
+		color: #404146
+		padding-bottom: 10px
+.ul_box
+	list-style: none
+	li
+		text-align: left
+		background:  url(../images/icon/ul_list.png) 0 5px no-repeat
+		padding-left: 24px
+		font-size: 16px
+		line-height: 20px
+		padding-bottom: 20px
+.start_test_btn
+	width: 230px
+	height: 50px
+	+br(50px)
+	text-align: center
+	color: #b39b02
+	font-family: "RobotoBold"
+	font-size: 26px
+	background-image: linear-gradient(to top, #fdd000 0%, #fff04e 100%)
+	box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+	color: #908505
+	border: none
+	border-bottom: 4px solid #D2BF00
+	line-height: 43px
+	display: block
+	margin: 20px auto 50px
+	&:hover, &:focus
+		background-image: linear-gradient(to top, #fde654 0%, #fef77d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border-bottom: 4px solid #D2BF00
+		text-decoration: none
+	&:active
+		background-image: linear-gradient(to top, #f4db15 0%, #fbd20d 100%)
+		box-shadow: 2px 3.5px 5px rgba(0, 0, 0, 0.12)
+		color: #908505
+		border: none
+		border-top: 4px solid #D2BF00
+		text-decoration: none
+.testing_info_foot
+	text-align: center
+	font-size: 20px
+	line-height: 20px
+	margin-top: 40px
+	margin-bottom: -60px
+.ball_hover
+	background: url(../images/phone_hover2.png) no-repeat center center
+	width: 222px
+	height: 88px
+	display: none
+	position: absolute
+	top: 58px
+	right: -14px
+	color: #3c4755
+	font-family: "RobotoLight"
+	font-size: 14px
+	line-height: 21px
+	text-align: center
+	padding-top: 25px
+	z-index: 4
+.show_ball_hover
+	display: block
+.show_ball_hover
+	+r(480,767)
+		display: none
+	+r(320,479)
+		display: none
\ No newline at end of file