﻿/* footer start */
footer { height: auto;  line-height: 1; background: #424242;  font-size: 14px; color: #d6d6d6; text-align: center; font-weight: 400; margin:44px 0 0 0; }
footer .container { width: 1200px; margin: 0 auto; padding: 24px 0; display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
footer .container .copyright { text-align: left;  line-height: 2; }
footer .container .copyright a { display: inline-block; color: #d6d6d6;  }
footer .container .copyright a:hover { color: #D03B35; text-decoration: underline;}
footer .container .qrcode { display: block; margin: 0 3em; color: #d6d6d6; }
footer .container .qrcode img{  border:5px solid #FFF;-webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; }


/*side bar*/
.sidebar{ display: block; width: 48px;  padding: 0 8px; position: fixed; left: 50%; bottom: 36px; margin-left: 636px; z-index: 9; background:#fff; }
.sidebar_scroll{ bottom: 212px!important; }
.sidebar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 0 12px rgba(208, 208, 208, .7); -moz-box-shadow: 0 0 12px rgba(208, 208, 208, .7); -ms-box-shadow: 0 0 12px rgba(208, 208, 208, .7); box-shadow: 0 0 12px rgba(208, 208, 208, .7); }
.sidebar  a{ display: block; width: 48px;  padding:10px 0;  color: #5e9ede;  cursor: pointer; font-size: 12px; line-height: 1.8em; border-bottom: 1px solid #f0f0f0; text-align: center; opacity: .9;  -webkit-opacity: .9; -moz-opacity: .9; -o-opacity: .9;  position: relative; color: #666;}
.sidebar a{border-radius:5px; -webkit-border-radius:5px ; -o-border-radius:5px; -moz-border-radius:5px; }
.sidebar a:last-child{ border: none;}
.sidebar  a i{ display: block; height: 26px; line-height: 26px; text-align:center;; font-size: 26px; color: #666;}
.sidebar a:hover, .sidebar li:hover i{ color: #D03B35 }

/* footer end */

@media screen and (min-width:1024px) and (max-width:1200px){
footer .container { width: 1024px;  }
.sidebar{ left: auto; right: 12px; }
}
@media screen and (min-width:768px) and (max-width:1024px){
footer .container { width: 768px;  }
.sidebar{ left: auto; right: 12px; }
}

@media screen and (max-width:767px) {
footer { margin: 24px 0 0 0; }
footer .container { width: auto; padding: 24px 14px; flex-direction: column;  }
footer .container .copyright { text-align: center; margin: 0 0 14px 0;  }
.sidebar_scroll{ bottom: 236px!important; }
.sidebar{ left: auto; right: 14px; bottom: 24px; background: rgba(255, 255, 255, .9); }

}