Просмотр архива дизайн с панелью для johncms 5.2.1.


body {
    color: #000000;
    font-family: Arial, Tahoma,
sans-serif;
    font-size: 13px;
    max-width: 400px;
    min-width:
239px;
    margin: 0 auto;
    padding-bottom: 30px;
    /*overflow-x:
hidden;*/
    

}
* { 
    margin: 0; 
    padding: 0; 
}
html
{overflow: scroll;background: #EEF0F4 url(images/mybg.png) 40% 100%/cover
fixed;height: 100%}
a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);

    -webkit-touch-callout: none; 
    text-decoration: none;color:
#553;
}
a:active {
    color: #666600;
}

a:hover {
    color:
#FF0000;
    text-decoration: underline;
}

a:link, a:visited {
   
color: #29588B;
    text-decoration: none;
}

form {
    font-size:
small;
    margin: 0;
    padding: 0;
}

h3 {
    margin: 0;
   
padding: 0 0 2px 0;
}

hr {
    border: 0;
    border-top: 1px solid
gray;
    margin: 0;
}

p {
    margin-bottom: 6px;
    margin-top:
6px;
}

textarea {
    width: 99%;
    max-width: 640px;
    border:
1px solid #ADB7BF;
    padding: 5px;
    margin-bottom: 3px;
   
border-radius: 2px;
}

ul {
    margin: 0;
    padding-left:
20px;
}

input, select {
    border: 1px solid #ADB7BF;
    padding:
3px;
    border-radius: 2px;
}

input[type="submit"] {
   
background: #E3E8EA;
    padding: 3px 5px;
}

.icon {
    padding: 3px
6px 3px 1px;
    vertical-align: middle;
}

img{
    border:
0;
}

.alarm {
    background-color: #F23439;
    border-bottom: 1px
solid #CB1A1C;
    color: #ffffff;
    font-weight: bold;
    padding:
4px;
}

.bblist {
    color: #4A5663;
    background: transparent
url(../../images/dot.gif) no-repeat left;
    padding: 0px 0px 0px
10px;
}

/*Панель bb*/
.bbpopup {
    margin-top: 3px;
}

/*
Ссылки для панели bb*/
.bbpopup a {
    border: 1px solid
#a7a7a7;
    height: 10px;
    display: inline-block;
    margin: 1px;

   vertical-align: middle;
    width: 10px;
}

.bmenu {
   
background-color: #D3D8DB;
    border-bottom: 1px solid #bbb;
    margin:
1px 0px;
    padding: 2px 4px 4px 4px;
}

.end {
    text-align:
center;
}

.fmenu {
    background-color: #E8E8FF;
    border-top: 1px
solid #D6D6F7;
    border-left: 1px solid #D3D8DE;
    border-right: 1px
solid #D3D8DE;
    color: #FFFFFF;
    margin-top: 7px;
    padding:
6px;
}

.footer {
    color: #666;
    padding: 10px;
    display:
block;
}

.func {
    border-left: 4px solid #9acd32;
    color:
#757575;
    font-size: x-small;
    margin-left: 2px;
    margin-top:
4px;
    padding-left: 4px;
}

.gmenu {
    background-color:
#EDF7E8;
    margin: 1px 0px;
    border-bottom: 1px solid #DBEDD3;
   
padding: 3px 4px 3px 4px;
}

.gray {
    color: #586776;
}

.greply
{
    border-left: 4px solid #009900;
    color: #009900;
    padding:
2px 0 2px 4px;
}

.hdr {
    background-color: #f1f1f1;
   
border-bottom: 1px solid #595959;
    font-weight: bold;
   
padding-left: 2px;
}

.logo {
    text-align: center;
    padding:
14px 0;
}

.header {
    background: #404055;
    color: #fff;
   
margin: 0;
    padding: 7px;
}

.left {
    float: left;
}

.list1
{
    background-color: #F7F7F5;
    text-shadow: 0px 1px #fff;
   
margin: 2px 0px;
    padding: 5px;
    color: #222;
}

.list2 {
   
text-shadow: 0px 1px #f0f0f0;
    background-color: #F0F2F5;
    margin:
2px 0px;
    padding: 5px;
    color: #222;
}



.spoilerhead {
   
background: #E8E8F2;
    color: #211F67;
    padding: 3px;
    border:
1px solid #9898AD;
}

.spoilerbody {
    background: #FAFAFC;
   
border: 1px solid #AFAFC4;
    border-top: none;
    padding: 4px;
   
color: #333;
    border-radius: 0px 0px 3px 3px;
}

.maintxt {
   
background: #fff;
    font-weight: normal;
    margin: -6px 0px -6px
0px;
    padding: 0px;
    border-left: 1px solid #D3D8DE;
   
border-right: 1px solid #D3D8DE;
}

.maintxt p a:link, .maintxt p
a:visited {
    padding-left: 8px;
}

.menu {
    color: #444;
   
background-color: #F7F7FF;
    padding: 4px 8px;
}

.menu a:link, .menu
a:visited {
    color: #49729E;
    text-decoration: none;
}

.news
{
    background-color: #EDEDF7;
    border: 1px solid #ddd;
    margin:
2px;
    color: #2E2E43;
    font-size: x-small;
    padding: 3px 4px
4px 4px;
}

.phdr {
    background-color: #eee;
    padding: 9px
8px;
    color:#838383;
}
.phdr b {font-weight: 400;}
.phdr a:link,
.phdr a:visited {
    color: #3B4374;
}

.phpcode {
   
background-color: #E0E6E9;
    border: 1px dotted #9FAEBB;
   
margin-top: 4px;
    padding: 0 2px 0 2px;
    overflow:
auto;
}

.quote {
    border-left: 4px solid #c0c0c0;
    color:
#878787;
    font-size: x-small;
    margin-left: 2px;
    padding: 2px
0 2px 4px;
}

.reply {
    border-left: 4px solid #EE0000;
    color:
#EE0000;
    padding: 2px 0 2px 4px;
}

.rmenu {
    background-color:
#EAC4D3;
    border-bottom: 1px solid #E3B9C9;
    margin: 1px 0px;
   
padding: 4px;
    color: #172C34;
}

.sitemap {
    background-color:
#eeecd9;
    margin: 0;
    padding: 2px 4px 3px 4px;
    font-size:
xx-small;
    height: 38px;
    overflow: auto;
}

.status {
   
color: #CD853F;
    font-size: x-small;
    font-weight: bold;
   
padding-left: 0;
}

.sub {
    border-top: 1px dotted #ccc;
   
font-size: x-small;
    margin-top: 4px;
}

.tmn {
   
background-color: #E8E8FF;
    border-bottom: 1px solid #D6D6F7;
   
border-left: 1px solid #D3D8DE;
    border-right: 1px solid #D3D8DE;
   
color: #52432C;
    margin-bottom: 6px;
    padding: 5px;
}

.topmenu
{
    color: #444;
    background-color: #F4f4f4;
    padding: 4px
8px;
    font-size: 12px;
}

.topmenu input {
    font-size:
x-small
}

.user {
    background-color: #E3E5E8;
    margin: 1px
0px;
    border-bottom: 1px solid #C6CED3;
    padding: 3px 4px 3px
4px;
}

.user .gray {
    color: #2E2E31;
}

.alarm a:link, .alarm
a:visited {
    color: #FFFFFF;
    font-size: x-small;
}

.clip
a:link, .clip a:visited {
    color: #424e59;
}

.footer a:link,
.footer a:visited {
    color: #888;
    text-decoration:
none;
}

.footer a:hover {
    text-decoration:
underline;
}

.green, .green a:link, .green a:visited {
    color:
#008000;
}

.greply a:link, .greply a:visited {
    color:
#008800;
}

.red, .red a:link, .red a:visited {
    color:
#FF0000;
}

.reply a:link, .reply a:visited {
    color:
#DD0000;
}

.sub a:link, .sub a:visited {
}

.tmn a:link, .tmn
a:visited, .fmenu a:link, .fmenu a:visited {
    color: #444;
   
text-decoration: none;
}

.fmenu a:hover, .tmn a:hover, .gmenu a:hover,
.bmenu a:hover, .menu a:hover, .tmn a:hover {
    text-decoration:
underline;
}

.currentpage {
    background-color: #fff;
    border:
1px solid #ADB7BF;
    border-radius: 2px;
    padding: 1px
6px;
}

a.pagenav {
    border: 1px solid #C1CBD3;
    padding: 0px
3px 0px 3px;
    text-decoration: none;
    border-radius: 2px;
   
padding: 0px 5px;
}

a.pagenav:hover {
    background-color: #F5F7F7;

   border: 1px solid #A0AAB4;
}


.main {
  
  background: #fafafa;

 padding: 20px;
  z-index: 99999;
  position: relative;
  
}


.btn
{ 
    position: relative; 
    height: 18px;
    float: left;
   
width:26px;
    padding:13px 8px;
    cursor:pointer;
}
#lines:before {

    border-bottom: 9px double #F5F8FA;
    border-top: 3px solid
#F5F8FA;    
    content:"";
    height: 3px; 
    position:
absolute; 
    left:11px;  
    top: 15px; 
    width:18px;

}
.btn:hover,#lines:hover:before {
  border-color:
#fff;
}
.btn:hover,#user:hover {
  background:
rgba(0,0,0,0.07);
}

.lol {
  background:rgba(97, 159, 226, 1);
 
box-shadow: inset 0 -2px 1px rgba(0,0,0,0.1);
  padding:0;
  color:
#fff;
}
.lolbg {background: #34384B;}
#menu {
  float: left;
 
padding: 15px 2px 14px 2px;
  text-align: center;
 
display:block;
}

#arrow {
    display:inline-block;
   
position:relative;
    top:-7px;
    left:0px;
    content:
"";
    height:0;
    width:0;
    padding:0;
    margin:-8px
1px;
    border:4px solid transparent;
   
border-top-color:#FFF;
}
#arrow:hover:after {
   
border-top-color:#CCC;
}
.clear {clear:
both;}



.nav{
padding:0;margin:0;
  display:block;
  text-align:
left;
  float: right;
}
.nav
li{
position:relative;
color:white;
display:block;
vertical-align:middle;
list-style:none;
/*
float:left;*/
}
a.dropdown-toggle{color:#fff;text-decoration:none;padding:
14px 15px;display:block;}
a.dropdown-toggle:hover {background:
rgba(0,0,0,0.07);}
a.dropdown-toggle:active,.a.btn:active {background:
rgba(0,0,0,0.13);}
.nav
li:hover,.active-drop{background:#ddd);}
ul.dropdown-menu{

padding:0;margin:0;
border:none;
background:#fff;
 position:absolute;

z-index:99999998;
 top:48px;
 right:5px;
 border: 2px solid #C9D6E5;

width:150px;   
}
ul.dropdown-menu li{
    width:100%;
   
margin:0;
}
ul.dropdown-menu  li a {color: #666;padding: 8px
10px;border-bottom: 1px solid #E5EAED;display: block}
#none {border:
none;}
.nav li.admin{float:right;}
.nav li.admin:hover >
ul.dropdown-menu{display: block;}




#slidingMenu::-webkit-scrollbar
{  
    width: 5px;
}  
#slidingMenu::-webkit-scrollbar-track {  
   
background: #2C2F41;   
}  
#slidingMenu::-webkit-scrollbar-thumb {  
  
 background-color: #4C5270;  
} 

#slidingMenu::-webkit-scrollbar-thumb:hover {  
    background-color:
#464C68;  
}



#slidingMenu { 

  background: #475566;      
 
top: 0px; 
  width: 200px;
  display: block;
  position: absolute;
 
visibility: hidden;
  z-index: 0;
  left: 0px;
  overflow-x: hidden;
 
overflow-y: hidden; /* to block user interaction on wp7 (z-index wont work)
*/
 }
#slidingMenu ul {
  margin: 0;
  padding: 0;
  list-style: none;

  background: #3E4755;  
}
#slidingMenu  .user {
  background:
#34384B;
  margin:0;
  padding: 0;
  border: none;
}
#slidingMenu 
.user img {margin-right: 2px;}
#slidingMenu  p {margin:0;padding:
0;}
#slidingMenu  h3 {color: #F68383;padding:7px 10px;font-weight:
400;}
#slidingMenu  .user a {color: #9DA7B4;display: block;padding: 5px
6px;}
#slidingMenu  span.green {color: #3DBF82;}

.count {float:
right;color: #626F7C;}
#slidingMenu ul li { 
  display: block;
 
list-style: none;
}

#slidingMenu ul li a { 
  position: relative; 
 
display: block;  
  padding:12px 14px; 
  color: #c5cbdb; 
  font-size:
15px; 
  text-decoration: none; 
}

#slidingMenu ul li a:hover { 
 
color: #eee;
  background: rgba(0,0,0,0.1);
  text-decoration: none;

}
#slidingMenu ul li a#first {
  background: #3E435A;
}
#page {    

 position: relative;
  left: 0;
  top: 0px;
  z-index: 99999; 
 
background:#fff;
  box-shadow: 3px 0 12px
rgba(0,0,0,1);
}
#mobileContainer { 
  overflow: hidden;
  position:
relative;
  background: #53597A; 
}