সদস্য:SlowPhoton/test/styles.css

@media all {
  /* প্ৰধান পাতা শীৰ্ষ */
  .top-banner-table, #mp-topbanner{
    display: table;
    width: calc(100% - 10px);
  }
  .top-banner-row {
    display: table-row;
  }
  .top-banner-cell {
    padding: 3px 10px;
  }
  .top-banner-body {
    display: table-row-group;
  }
  .MainPageLogo {
    background-repeat: no-repeat;
    background-position: -5px -25px;
    width: 100%;
    border: 1px solid #a7d7f9;
    vertical-align: top;
    border-radius: 3px;
  }
  .top-banner-intro {
    padding-top:5px;
  }
  .top-banner-content {
    width: 100%;
    margin-bottom: 1px;
    vertical-align: top;
    font-size: 100%;
    background: transparent;
    line-height: 1.5em;
  }
  .top-banner-stats {
    font-size:100%;
    padding-top:5px;
    padding-right:5px;
    line-height: 1.6em;
    vertical-align: top;
  }
  .top-banner-links {
    display:table-caption;
    caption-side:bottom;
    text-align: center;
    font-size: 100%;
    margin: 0;
  }
  #mp-topbanner{
    margin: 0px 5px;
  }
  /* প্ৰধান পাতাৰ অনুক্ৰমণিকা */
  .index-box{
    margin: 5px;
    width: calc(100% - 10px);
    background: #f5faff;
    border: 1px solid #a7d7f9;
    vertical-align: top;
    border-radius: 3px;
    color: #000;
    padding: 0;
  }
  /* কৰোনা */
  #mf-corona{
    margin: 0px 3px 0px 5px;
  }
  /* প্ৰধান পাতাৰ কাঠামো */
  .main-page-table{
    display: block;
    border-spacing: 6px;
    width: 100%;
  }
  .main-page-row {
    display: table-row;
  }
  .main-page-row-fullwidth {
    display: block;
    width: 100%;
  }
  .main-page-cell, .main-page-head {
    border: 1px solid transparent;
    display: table-cell;
  }
  .main-page-body {
    display: block;
  }
  .content-box{
    border: 1px solid transparent;
  }
  /* নিৰ্বাচিত নিবন্ধ */
  .featured-article-box{
    border: 1px solid #a7d7f9;
    background: #fff;
    vertical-align: top;
    color: #000;
    border-radius: 3px;
  }
  .featured-article-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #faecc8;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  .featured-article-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  /* আপনি জানেন কি */
  .did-you-know-box{
    border: 1px solid #a7d7f9;
    vertical-align:top;
    border-radius: 3px;
  }
  .did-you-know-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  .did-you-know-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #F0F3CD;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  /* ভালো নিবন্ধ */
  .good-article-box{
    border: 1px solid #a7d7f9;
    background: #fff;
    vertical-align: top;
    color: #000;
    border-radius: 3px;
  }
  .good-article-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  .good-article-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #ddffd1;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  /* বিষয় অনুযায়ী বাংলা উইকিপিডিয়া */
  .topic-listing-box{
    border: 1px solid #a7d7f9;
    background: #fff;
    vertical-align: top;
    color: #000;
    border-radius: 3px;
  }
  .topic-listing-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #f9f9f3;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: center;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  .topic-listing-table{
    column-rule: 1px solid #ccc;
  }
  .topic-listing-cell{
    break-inside: avoid;
  }
  .topic-listing-sectionname{
    padding: 3px 0px;
    font-size: 130%;
  }
  .topic-listing-sectioncontents{
    padding: 3px;
    border-bottom: 1px dotted #ccc;
  }
  /* আজকেৰ নিৰ্বাচিত ছবি */
  .featured-picture-box{
    border: 1px solid #a7d7f9;
    vertical-align:top;
    border-radius: 3px;
  }
  .featured-picture-box{
    text-align:center;
  }
  .featured-picture-box .main-page-table {
    display: inline-block;
    text-align: left;
    padding: 6px 6px 0px 6px;
    width: calc(100% - 12px);
  }
  .featured-picture-box .main-page-row { display: block; }
  .featured-picture-box .main-page-head { display: block; }
  .featured-picture-box .main-page-cell { display: block; }
  .featured-picture-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  .featured-picture-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #E1B8F5;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #B1A5C2;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  .featured-picture-image img{
    box-shadow: 0 0 5px 1px silver;
    width: 75%;
    height: auto;
    max-width: 320px;
  }
  /* সম্পৰ্কিত সংস্থা */
  .related-organisations-box{
    border: 1px solid #a7d7f9;
    background: #fff;
    vertical-align: top;
    color: #000;
    border-radius: 3px;
  }
  .related-organisations-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  .related-organisations-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #FFDAB9;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  /* অবদানকাৰীৰ জন্য পাঠ্য */
  .contributor-help-box{
    border: 1px solid #a7d7f9;
    vertical-align:top;
    border-radius: 3px;
  }
  .contributor-help-icon{
    padding: 3px;
    float: right;
    margin: 2px 2px 0px 0px;
  }
  .contributor-help-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #f2e0ce;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #B1A5C2;
    text-align: left;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  /* সহপ্ৰকল্প */
  .sister-projects-box{
    display:block;
    caption-side:bottom;
    width: auto;
    margin: 0px 6px 0px 6px;
    border: 1px solid #a7d7f9;
    background: #fff;
    vertical-align: top;
    color: #000;
    border-radius: 3px;
  }
  .sister-projects-table{
    display: table;
    border-spacing: 6px;
    width: 100%;
  }
  .sister-projects-body {
    display: table-row-group;
  }
  /* উইকিপিডিয়াৰ সহপ্ৰকল্প */
  .other-projs-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #e7eef7;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: center;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
  /* অন্যান্য ভাষায় উইকিপিডিয়া */
  .other-langs-header{
    padding: 0.4em 0.5em;
    margin: 0;
    background: #dfdfdf;
    font-size: 115%;
    font-weight: bold;
    border: 1px solid #ccc;
    text-align: center;
    color: #000;
    border-radius: 3px 3px 0 0px;
  }
}
/* কেবল ডেস্কটপ ইন্টাৰফেসেৰ জন্য */
@media all and ( min-width: 720px ) {
  .top-banner-cell{
    display: table-cell;
  }
  .top-banner-intro{
    height: 1em;
    padding-left: 5px;
  }
  .top-banner-links{
    line-height: 1em;
    padding:0;
  }
  .top-banner-stats{
    text-align: right;
  }
  .topic-listing-table{
    columns:4;
  }
  .content-box {
    width: 50%;
    display: table-cell;
  }
}
/* কেবল মোবাইল ইন্টাৰফেসেৰ জন্য */
@media all and ( max-width: 719px ) {
  .top-banner-cell{
    display: block;
  }
  .top-banner-intro{
    padding: 0px 6px;
  }
  .top-banner-links{
    line-height: 1.5em;
    padding: 0px 6px;
  }
  .top-banner-stats{
    padding: 0px 6px;
    text-align: left;
  }
  .content-box {
    width: 100%;
    display: block;
  }
  .content-box + .content-box {
    margin-top: 6px;
  }
  .index-box{
    display: none;
  }
  .topic-listing-box{
    width:calc(100% - 12px);
    margin: 0px 6px 6px 6px;
  }
  .organisations-help-row{
    display: none;
  }
  .other-langs-table{
    display: none;
  }
}