[مشكلة] : مشكلة في قالب بلوجر
 

السلام عليكم
عندي مشكلة بقالب بلوجر وهي عدم دقة التجاوب على الاجهزه المحمولة بداخل التدوينة
يعني القالب متقلص جدا من داخل التدوينة فقط
وهذا الكود المسؤول عن التجاوب اذا ممكن احد الاخوه التعديل عليه وشكرا

رمز Code:
/* RESPONSIVE
----------------------------------------------- */
@media only screen and (min-width: 1001px) and (max-width: 1220px) {
.container {
max-width: 960px;
}

header {
width: 960px;
}
#logo {
width: 50.2%;
}
#navigation {
text-align: right;
margin-right: 0px;
}
#navigation, #search, #social {
width: auto;
}
.main-posts {
width: 613px;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.summary-outer .toptip img, .overlay {
width: 228px;
height: 228px;
}
[data-title]:before, [data-title]:after {
bottom: 40%;
}
[data-title]:before {
left: 8%;}
.overlay {
line-height: 194px;
}
aside {
width: 332px;
margin-left: 15px;
}
}
@media only screen and (min-width: 1000px) {
#navigation {
display: inline-block !important;
}
}
@media only screen and (max-width: 1000px) {
#navigation {
display: none;
}
.m-button {
display: inline-block;
}
}
@media only screen and (min-width: 811px) and (max-width: 1000px) {
.container {
max-width: 765px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}

header {
width: 765px;
}
.date-outer:nth-child(3n+3) {
margin-right: 0;
}

.date-outer:nth-child(4n+4) {
margin-right: 15px;
}
aside {
margin: 0 0 30px;
}
footer .footer-section {
width: 48%;
margin-right: 4%;
}
footer #section-3 {
margin-right: 0px;
}
footer #section-4 {
width: 100%;
margin-top: 20px;
}
footer .footer-rights {
text-align: center;
}
}
@media only screen and (min-width: 661px) and (max-width: 810px) {
header, .container {
max-width: 612px;
}
#logo {
width: 50%;
}
.page-head h1 {
font-size: 40px;}
#navigation {
margin-top: 67px;
}
.m-button {
width: 147px;
float: right;
}

#profile .about {

position: relative;

}

#profile .social-media {

margin-top: -25px;
}

.date-outer:nth-child(3n+3) {
margin-right: 0;
}

.date-outer:nth-child(4n+4) {
margin-right: 15px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.summary-outer .toptip img, .overlay {
width: 194px;
height: 194px;
}
[data-title]:before, [data-title]:after {
bottom: 40%;
}

[data-title]:before {

left: 6%;
width: 170px;}
.overlay {
line-height: 194px;
}
aside {
margin: 0 0 30px;
}
footer .footer-section {
width: 48%;
margin-right: 4%;
}
footer #section-3 {
margin-right: 0px;
}
footer #section-4 {
width: 100%;
margin-top: 20px;
}
footer .footer-rights {
text-align: center;
}
}
@media only screen and (max-width: 660px) {
header {
text-align: center;
}
#logo, #search, #social {
width: 100%;
margin-bottom: 15px;
}
#search .s-input {
width: 80%;
box-sizing: border-box;
height: 34px;
}
.s-submit {
box-sizing: border-box;
}
#navigation {
margin-top: 155px;
}
.m-button {
text-align: center;
width: 100%;
}
.m-button i {
position: relative;
display: table;
margin: 0 auto;
}
.footer-section {
width: 100% !important;
margin-top: 20px;
margin-right: 0 !important;
}
footer .footer-rights {
text-align: center;
}
blockquote {
margin: 0;
}
.left-older-link {
margin-bottom: 30px;
}
.left-older-link, .right-newer-link {
width: 100% !important;
}
footer:before {
background: none repeat scroll 0% 0% transparent;
}
}
@media only screen and (min-width: 451px) and (max-width: 660px) {
header, .container {
max-width: 403px;
}
.main-posts, aside {
width: 100%;
}

div#profile {
padding: 0px 0;}

#profile .about {
margin: 40px 0 0 175px;
padding: 10px 0;
position: relative;width: 260px;}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.date-outer:nth-child(3n+3) {
margin-right: 15px;
}

.page-head h1 {
font-size: 25px;}

.page-head h1 small {
font-size: 14px;}

.date-outer:nth-child(2n+2) {
margin-right: 0px;
}
.summary-outer .toptip img, .overlay {
width: 194px;
height: 194px;
}
[data-title]:before, [data-title]:after {
bottom: 40%;
}
[data-title]:before {
left: 7%;
padding: 20px 10px;
width: 169px;}
.overlay {
line-height: 194px;
}
aside {
margin: 0 0 30px;
}
}
@media only screen and (min-width: 309px) and (max-width: 450px) {
header,.container {
max-width: 245px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 0;
margin-bottom: 15px;
}

.page-head h1 {
font-size: 15px;}

#profile .avatar {
position: absolute;
top: 18%;}

#profile .about {

position: relative;
top: 50%;
width: 100px;
margin-top: 40px;
}
.page-head h1 small {
font-size: 14px;}

.date-outer:nth-child(3n+3) {
margin-right: 0;
}
.summary-outer .toptip img, .overlay {
width: 245px;
height: 245px;
}
aside {
margin: 0 0 30px;
}
h3.post-title span {
border-bottom-width: 0;
}
}
@media only screen and (max-width: 308px) {
header,.container {
max-width: 80%;
}
#logo, #search, #social {
margin-bottom: 11px;
}
#social a, .s-submit {
margin-top: 4px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 0;
margin-bottom: 15px;
}
.date-outer:nth-child(3n+3) {
margin-right: 0;
}
.summary-outer .toptip img, .overlay {
width: 100%;
height: 100%;
}
[data-title]:before, [data-title]:after {
bottom: 119px;
}
.overlay i {
display: none;
}
aside {
margin: 0 0 30px;
}
h3.post-title span {
border-bottom-width: 0;
}
}
@-moz-document url-prefix() {
nav li ul {
top: 108px;
}
}