new logic yets and moread

style.css

@@ -1679,15 +1679,12 @@ a{
 
 .moread{
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
   grid-gap: 2rem; 
   margin-top: 8px;
   margin-bottom: 28px;
 }
 
-  .moread_card{
-    
-  }
 
   .moread_rubric{
     padding-top: 28px;
@@ -1765,7 +1762,7 @@ a{
 .yets{
   display: grid;
   grid-gap: 1rem; 
-  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  grid-template-columns: repeat(2, minmax(250px, 1fr));
   margin-top: 8px;
   margin-bottom: 28px;
   padding: 8px;
@@ -1778,6 +1775,10 @@ a{
     font-weight: bold;
   }
 
+    #yets-5, #yets-6{
+      display: none;
+    }
+
 .publ-to-main{
   text-align: center;
   margin-bottom: 22px;
@@ -2302,6 +2303,7 @@ span.rub_back_title{
 
 
 
+
 @media screen and ( max-width: 580px ) {
 
   #left{
@@ -2491,12 +2493,29 @@ span.rub_back_title{
   }  
 
 
+  #moread_5, #moread_6, #yets-5, #yets-6{
+    display: none;
+  }
+
+
 }
 
 
+@media screen and (min-width: 1800px) {
+
+  #yets-5, #yets-6{
+    display: block;
+  }
+
+  .moread{
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  }
+
+}
+
 
 /** ultrabooks and ipads **/
-@media (max-width: 768px) {
+@media (max-width: 820px) {
 
   body {
     width: 100%;
@@ -2504,7 +2523,7 @@ span.rub_back_title{
     overflow-x: hidden;
   }
 
-
+  
   h1 {
     font-size: 24px;
   }
@@ -2683,7 +2702,8 @@ span.rub_back_title{
 
 }
 
-  
+
+ 
 }  
 
 
@@ -2854,7 +2874,6 @@ and (max-device-width : 667px) {
 
 
   
-  
 }
 
 
@@ -2863,4 +2882,6 @@ and (max-device-width : 667px) {
 
 
 
+
+