suite

app/assets/stylesheets/public.scss

@@ -33,6 +33,7 @@ body{
   margin:0;
   background:#c5c6e4;
   background:#deddec;
+  background:#f3f2f8;
 }
 
 .slide_home_wrapper{
@@ -119,7 +120,8 @@ body{
   clear:both;
 }
 .center{
-  max-width:1010px;
+  max-width:990px;
+  padding:0 20px;
   margin:auto;
 }
 .btn{
@@ -508,7 +510,7 @@ a{
 }
 
 #sub_footer{
-  background:rgba(#20102d, 1);
+  background:rgba(#2e253b, 1);
   text-align:center;
   color:white;
   
@@ -520,7 +522,7 @@ a{
     font-weight:bold;
     a{
       padding:0 10px;
-      color:white;
+      color:rgba(white,0.9);
     }
   }
   h3{
@@ -627,3 +629,169 @@ a{
   
   
 }
+
+
+
+
+.bars{
+  display:none;
+  
+}
+
+
+@media screen and (max-width: 880px) {
+  #top_band{
+    height:auto !important;
+    min-height:120px;
+    .h1_inner{
+      position:static;
+      padding:20px 10px;
+    }
+    h1{
+      font-size:2em;
+    }
+  }
+  .bars{
+    display:block;
+    position:absolute;
+    top:0px;
+    right:0px;
+    
+    color:white;
+    font-size:23px;
+    padding:16px 17px;
+    z-index:4;
+  }
+  
+  #logo{
+    position:relative;
+    margin:auto;
+    height:50px;
+    display:block;padding-top:15px;
+    top:0; left:0;
+  }
+  #menu_top{
+    position:fixed;
+    top:0;
+    right:0;
+
+    left:0;
+    min-height:30px;
+  }
+  
+  #menu_top .menu{
+    display:none;
+    position:fixed;
+    top:0;
+    right:0;
+    bottom:0;
+    left:0;
+    padding-right:30px;
+    background:rgba(#2e253b, 0.95);
+    overflow:auto;
+    padding-top:80px;
+  }
+  
+  
+  #menu_top .menu a{
+    display:block;
+    padding:5px 10px;
+  }
+  
+  
+  #sub_menu_top{
+    position:relative;
+    .normal{
+      display:none;
+    }
+    .active{
+      display:block !important;
+    }
+   
+  }
+.row-fluid{
+margin:0px !important;
+
+}
+
+
+
+.span_8, .span_4,  .span_3, .span_6{
+margin:0px !important;
+padding:0 !important;
+float:none !important;
+width:auto !important;
+display:block;
+}
+
+#menu_top_container ul{
+  text-align:center;
+  padding:0;
+  margin:0;
+  li{
+    display:block;
+    
+  }
+  a{
+    display:block;
+  }
+  
+}
+
+#menu_top_container #logo{
+  float:none;
+  margin:auto;
+  margin:0px auto;
+  padding-top:10px;
+  
+}
+
+.menu_item_content{
+  padding:1px;
+}
+
+.menu_item_top .first_title{
+  padding:5px 10px;
+  font-size:20px;
+}
+
+.slider_home .title{
+  padding:5px;
+  font-size:18px;
+  right:0;
+  text-align:center;
+}
+
+#menu ul {
+  display:none;
+}
+.bars{
+  display:block;
+}
+
+
+.partners{
+  
+  
+
+  .partner{
+   
+    .p_inner{
+      width:120px;
+      
+    }
+
+  }
+
+
+  
+  
+}
+
+
+
+
+}
+
+
+

app/views/layouts/public.html.haml

@@ -159,10 +159,12 @@
     -else
       #top_band.slide_home_wrapper.with_ratio{:style => "background-image:url('#{@img_url}');", :data => {:ratio => 0.35}}
         
-      
+        
+        
+        
         #menu_top
-          .sub_menu
+          .bars{:onclick => '$("#menu_top .menu").toggle()'}
-            =render :partial => "public/shared/second_menu"
+            =ic :bars
           .menu
             =render :partial => "public/shared/first_menu"
         =link_to image_tag("/logo.png", :id => "logo"), "/"