@charset "utf-8";

.posts{

}

.posts a:hover{
color: rgb(86, 86, 86);
}

.posts .title{
   text-align: center;
}

.posts .mainPic, .posts .imgCenter{
margin: 10px auto;
display: block;
padding: 10px;
background-color: #fff;
border: dashed 1px #eee;
}

.posts .mainPic{
width: 60%;
}

.posts .imgCenter{
width: 60%;
}



.posts .date{
font-style: italic;
color: rgb(131, 131, 131);
}

.posts .post{
border-bottom: dashed 2px #eee;
padding: 10px 0;
}

.posts .caption {
    color: RGB(68, 68, 68);
    font-size: 15px;
    margin: -13px 0 5px 0;
    font-style: italic;
}

.posts .preview{
color: rgb(63, 63, 63);
padding: 10px 15px;
font-size: 16px;
margin: 15px 0;
border-left: solid 6px rgb(228, 228, 228);
font-style: italic;
}

.blogInfo{
padding: 5px 20px;
border-style: solid;
border-color: #eee;
border-width: 1px;
border-left: solid 4px rgb(205, 225, 170);
overflow: hidden;
background-image: linear-gradient(to bottom, #FBFBFB, #F6F6F6);
}

.blogInfo h2{
margin: 2px 0;
font-weight: normal;
}

.blogInfo h2 a{
color: rgb(81, 81, 81);
}

.blogInfo h2 a:hover{
color: rgb(124, 149, 79);
}

.blogInfo h4{
color: rgb(89, 89, 89);
}

.blogInfo .avatar{
  height: 100px;
  width: 100px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  margin: 10px auto;
  border-radius: 50%;
  border: solid 6px rgb(236, 236, 236);
  float: left;
}

.blogInfo .title{
  float: left;
  margin: 30px 0 0 15px;
}

.manageLinks{
overflow: hidden;
clear: both;
}

.manageLinks a, .manageLinks span{
display: block;
float: left;
margin: 5px 15px 5px 0;
font-size: 13px;
border-radius: 5px;
text-decoration: none;
padding: 1px 10px;
opacity: 0.7;
}

.manageLinks .viewsCnt{
background-image: url(/styles/default/pictures/viewsCnt.png);
background-repeat: no-repeat;
background-position: left;
padding-left: 23px;
}

.manageLinks .commentsCnt{
background-image: url(/styles/default/pictures/commentsCnt.png);
background-repeat: no-repeat;
background-position: left;
padding-left: 20px;
}

.manageLinks span{
opacity: 1;
}

.manageLinks a.red{
  background-color: rgb(246, 235, 235);
}

.posts .user{
background-color: rgb(227, 242, 187);
color: rgb(0, 0, 0);
}

.manageLinks a.green{
background-color: rgb(225, 236, 193);
color: rgb(83, 98, 41);
}

.manageLinks .date{
color: rgb(72, 72, 72);
}

.manageLinks a:hover{
opacity: 1;
}

#imagesPreviews {
width: 80%;
margin: 10px auto;
}

#imagesPreviews .item {
  padding: 10px;
  overflow: hidden;
  margin: 10px auto 10px auto;
  background-color: #eee;
}

.image {
  width: 15%;
  float: left;
  margin: 10px;
}

.panel {
  float: left;
  margin: 10px;
  width: 70%;
  overflow: hidden;
  font-size: 85%;
}

.uploadImagesForm input[type=submit]{
background-image: linear-gradient(to bottom, rgb(255, 255, 255), rgb(242, 242, 242));
color: rgb(71, 71, 71);
border: 1px solid rgb(242, 242, 242);
}

.uploadImagesForm input[type=submit]:active {
 box-shadow: inset 1px 1px 3px 0 rgb(179, 179, 179);
 border: 1px solid rgb(255, 255, 255);
}

.shareBtns {
margin: 20px auto;
background-color: rgb(246, 246, 246);
padding: 10px;
border-top: 1px #eee solid;
border-bottom: 1px #eee solid;
text-align: center;
overflow: hidden;
clear: both;
}

.blogInfoModal{
  margin: 15px;
  width: 600px;
  overflow: hidden;
}

.blogInfoModal__avatar{
  max-width: 400px;
  border: dashed 1px rgb(221, 221, 221);
  display: block;
  margin: 10px auto;
}

.blogInfoModal__caption {
    font-size: 13px;
    color: #999;
    white-space: nowrap;
}
.blogInfoModal tr{
  border-bottom: 1px dashed rgb(221, 221, 221);
}

.blogInfoModal td{
  padding: 10px;
}