media

app/assets/styles/content/centerbar/organization.scss

@@ -1,10 +1,14 @@
-.organization-info {
+$organizationInfoSelector: 'organization-info';
+$organizationMediaSelector: 'organization-media';
+
+.#{$organizationInfoSelector} {
 
     &__container {
         box-sizing: border-box;
         border: 1px solid #ebebeb;
         border-radius: 10px 0 0 0;
         padding: 0 2px 0 9px;
+        margin-bottom: 10px;
     }
 
     &__header {
@@ -177,9 +181,14 @@
             color: #004d7b;
             text-decoration: none;
 
+            #{$organizationInfoSelector}--active &,
             &:hover {
                 background: #ebebeb;
             }
+            #{$organizationInfoSelector}--active & {
+                color: #929292;
+            }
+
         }
     }
 
@@ -235,4 +244,67 @@
             background: url(../img/icon_table_link.png);
         }
     }
+
+    &__socials {
+        filter: grayscale(1);
+
+        & > li {
+            display: inline-block;
+        }
+    }
+
+    &__slidedown {
+        margin-bottom: 14px;
+
+        &-title {
+            font-family: $fontcuprum;
+            padding: 9px 0;
+            position: relative;
+            font-size: 20px;
+            font-weight: 600;
+            color: #3b434d;
+        }
+
+        &-content {
+
+        }
+
+        &-handler {
+            position: absolute;
+            top: 50%;
+            right: 3px;
+            width: 15px;
+            height: 9px;
+            margin-top: -4px;
+            cursor: pointer;
+            background: url(../img/blockslide_sprite.png) no-repeat;
+        }
+    }
+}
+
+.#{$organizationMediaSelector} {
+    &__container {
+        font-family: $fontcuprum;
+        border: 1px solid #ebebeb;
+        padding: 8px 9px 0 9px;
+    }
+
+    &__header {
+        color: #3b434d;
+        font-size: 17px;
+        font-weight: bold;
+        margin-bottom: 17px;
+    }
+
+    &__list {
+        font-family: $fontopensans;
+        font-size: 15px;
+        margin-bottom: 5px;
+        display: block;
+
+        &-item {
+            margin-bottom: 3px;
+            display: block;
+        }
+    }
 }

app/www/css/all.css

@@ -2841,7 +2841,8 @@ body {
   box-sizing: border-box;
   border: 1px solid #ebebeb;
   border-radius: 10px 0 0 0;
-  padding: 0 2px 0 9px; }
+  padding: 0 2px 0 9px;
+  margin-bottom: 10px; }
 
 .organization-info__header {
   margin-bottom: 30px; }
@@ -2981,8 +2982,10 @@ body {
     line-height: 14px;
     color: #004d7b;
     text-decoration: none; }
-    .organization-info__menu-link:hover {
+    organization-info--active .organization-info__menu-link, .organization-info__menu-link:hover {
       background: #ebebeb; }
+    organization-info--active .organization-info__menu-link {
+      color: #929292; }
 
 .organization-info__show-services {
   background: #ebebeb;
@@ -3028,6 +3031,50 @@ body {
     left: 0;
     background: url(../img/icon_table_link.png); }
 
+.organization-info__socials {
+  filter: grayscale(1); }
+  .organization-info__socials > li {
+    display: inline-block; }
+
+.organization-info__slidedown {
+  margin-bottom: 14px; }
+  .organization-info__slidedown-title {
+    font-family: "cuprum", Impact, "Charcoal CY", sans-serif;
+    padding: 9px 0;
+    position: relative;
+    font-size: 20px;
+    font-weight: 600;
+    color: #3b434d; }
+  .organization-info__slidedown-handler {
+    position: absolute;
+    top: 50%;
+    right: 3px;
+    width: 15px;
+    height: 9px;
+    margin-top: -4px;
+    cursor: pointer;
+    background: url(../img/blockslide_sprite.png) no-repeat; }
+
+.organization-media__container {
+  font-family: "cuprum", Impact, "Charcoal CY", sans-serif;
+  border: 1px solid #ebebeb;
+  padding: 8px 9px 0 9px; }
+
+.organization-media__header {
+  color: #3b434d;
+  font-size: 17px;
+  font-weight: bold;
+  margin-bottom: 17px; }
+
+.organization-media__list {
+  font-family: "opensans", Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;
+  font-size: 15px;
+  margin-bottom: 5px;
+  display: block; }
+  .organization-media__list-item {
+    margin-bottom: 3px;
+    display: block; }
+
 .opinion__container {
   float: right;
   width: 33%;