@media only screen and (min-width: 500px) {               
     
        #pinfobox {
            
            
            width: 1408px;
            height: 0px;
            overflow: hidden;
            transition: 0.5s;
        }
        
        
        .help {
            
            width: 15px;
            height: 15px;
            position: relative;
            float: right;
            display: none;
            z-index: 505465465465;
            margin-right: 10px;
            margin-top: 2px;
            transition: 0.5s;
            
        }
        
        .help:hover {
            
            filter: brightness(70%);
            cursor: hand;
            
        }
        
        .arguvotetext {  
          position: relative;
          display: inline-block;
          width: 150px;
          background-color: rgba(0,0,0,0.1);
          float: left;
            
        }
        
        
        .upvote_store {
            
             position: relative;
          display: inline-block;
          float: left;
          background-color: transparent;
          width: 322px;
            
        }
        
        .downvote_store {
            
             position: relative;
          display: inline-block;
          float: left;
          background-color: transparent;
          width: 322px;
            
        }
        
        
        #headline {
            position: relative;
          display: block;
          float: left;
          width: 1408px;
          height: 110px;
          background: url("headline.png");
          vertical-align: center;
          line-height: 110px;
          left: 0px;
        }
        
        #headlinetext {
        
         position: relative;
         width: 1408px;
         height: 110px;
         
         background-color: transparent;
         border: 0;
         color: white;
         font-size: 60;
         font-family: Times New Roman;
         z-index: 4;
         outline: none;
         text-align: center;
         display: block;
        
        }
        
        
        .editpanel {
            
           position: relative;
           float: left;
         width: 1408px;
         height: 90px;
         background-color: rgb(22,22,22);
            
            
        }
        
        
        
        .debateinfo {
            
            display: inline-block;
           position: relative;
           float: right;
         width:1107px;
         margin-top: 2px;
         height: 80px;
         line-height: 80px; 
         background-color: rgb(33,33,33);
         font-size: 40px;
            
            
        }
        
        .inner_circle {
            
            backdrop-filter: brightness(30%) blur(2px);
            
        }
        
        .iniciator {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 704px;
            height: 150px;
            background-color: black;
            overflow: hidden;
        }
        
        .receiver {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 704px;
            height: 150px;
            background-color: black;
            overflow: hidden;
        }
        
        .picback {
            
             position: relative;
            display: inline-block;
            float: left;
            width: 120px;
            height: 120px;
            object-fit: cover;
            z-index: 2;
            transition: 0.5s;
            background-color: white;
            
        }
        
        .linky:hover {
            
            text-decoration: underline;
            cursor: hand;
        }
        
        .userhead {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 684px;
            height: 30px;
            line-height: 30px;
            
            text-align: left;
            padding-left: 20px;
            z-index: 2;
        }
        
        
        
        .userpic {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 120px;
            height: 120px;
            object-fit: cover;
            z-index: 2;
            transition: 0.5s;
        }
        
        .userpic:hover {
            
            cursor: hand;
            opacity: 0.8;
            
        }
        
        
        
        
        .usertext {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 120px;
            width: 584px;
            line-height: 120px;
            text-align: center;
            font-size: 24px;
            z-index: 1;
            -webkit-box-shadow: inset 10px 4px 15px -1px #000000; 
        box-shadow: inset 10px 4px 15px -1px #000000;
            
        }
        
        .userbackcase {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 120px;
            width: 590px;
            top: -120px;
            overflow: hidden;
            
            
        }
        
        
        .userback {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 130px;
            width: 590px;
            object-fit: cover;
            filter: brightness(40%) blur(2px);
            z-index: 0;
            
            
        }
        
        
        .textblock {
            
            
            position: relative;
            display: inline-block;
            float: left;
            height: 330px;
            width: 704px;
            
            background-color: black;
            
            
        }
        
        .argutext {
            
           position: relative;
            display: inline-block;
            float: left;
            height: 220px;
            width: 664px;
            padding: 20px;
            font-size: 15px;
            background-color: rgba(0,0,0,0.7);
            text-align: justify;
             
            
        }
        
        .arguimput {
            
             position: relative;
            display: inline-block;
            float: left;
            height: 220px;
            width: 664px;
            
            font-size: 15px;
            background-color: transparent;
            text-align: justify;
            color: white;
            font-family: Times New Roman;
            outline: none;
            border: 0px;
            overflow: hidden;
            resize: none;
            
        }
        
        .count {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 1408px;
            background-color: rgb(33,33,33);
            
            
        }
        
        .divide2 {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 10px;
            line-height: 10px;
            width: 1408px;
            background-color: rgba(0,0,0,0.8)
            
            
        }
        
        
        .greyupvote {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("bluebar.png");
            filter: brightness(30%);
            transition: 0.5s;
           
        }
        
        
        .greydownvote {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("redbar.png");
            filter: brightness(30%);
            transition: 0.5s;
           
        }
        
        
        
        .upvote_pic {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 30px;
            transition: 0.5s;
            
           
        }
        
        .upvote_pic:hover {
            
            
            cursor:hand;
            filter: brightness(60%);
        }
        
        
        .voterpic {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 30px;
            width: 40.25px;
            transition: 0.5s;
            object-fit: cover;
            
           
        }
        
        
        .morearguvotes {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 30px;
            width: 40.25px;
            transition: 0.5s;
            background-color: rgba(0,0,0,0.5);
            
           
        }
        
        
        .voterpic:hover {
            
            filter: brightness(120%);
            cursor: hand;
           
        }
        
        
        .upvote:hover {
            
            
            cursor: hand;
        }
        
        
        .downvote {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("redbar.png");
            filter: brightness(80%);
            transition: 0.5s;
            color: white;
            border-width: 0px;
            outline: none;
        }
        
        .downvote:hover {
            
            filter: brightness(100%);
            cursor: hand;
            
        }
        
        
        .upvotedata {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("bluebar.png");
            filter: brightness(100%);
            transition: 0.5s;
           
        }
        
        .downvotedata {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("redbar.png");
            filter: brightness(100%);
            transition: 0.5s;
           
        }
        
        
        
        .argusubmit {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 704px;
            border: none;
            transition: 0.5s;
            text-transform: upperCase;
            background-color: rgba(89,17,17,1);
            color: white;
            font-family: Times New Roman;
        }
        
        .argusubmit:hover {
            
            background-color: rgba(178,34,34,1);
            cursor: hand;
            
        }
        
        .argutime {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 40px;
            line-height: 40px;
            color: orange;
            width: 704px;
            background-color: rgba(0,0,0,0.8);
            
        }
        
        .arguwait {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 220px;
            line-height: 220px;
            text-align: center;
            color: white;
            font-size: 50px;
            width: 664px;
            background-color: rgba(0,0,0,0.5);
            
        }
        
        .arguend {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 60px;
            line-height: 60px;
            width: 1408px;
            background-color: rgb(15,15,15);
        }
        
        #category {
            
             z-index: 1;
             background: url("aktuback.png");
             opacity: 1;
        }
        
        #categories {
            
            background-color: rgba(0,0,0,0.8);
            
        }
        
        #articleimage {
            
            position: relative;
            top: -185px;
            z-index: 0;
            
            
        }
        
        
        /* DISCUSSION  */
        
        
        #asker {
            
            position: relative;
            display: inline-block;
            float: left;
            top: 0px;
            width: 1408px;
            height: 110px;
            
        }
        
        #askerhead {
            
            position: relative;
            display: inline-block;
            float: left;
            top: 0px;
            width: 1388px;
            height: 30px;
            line-height: 30px;
            text-align: left;
            padding-left: 20px;
            background-color: rgba(0,0,0,0.8);
            
        }
        
        #writtenby {
            
            background-color: rgba(0,0,0,0.5);
            
        }
        
        #discussionbody {
            
             position: relative;
            display: inline-block;
            float: left;
            top: 0px;
            width: 1408px;
            height: 600px;
            background-color: rgb(55,55,55);
            
        }
        
        #watch {
          
        display: block;
          float: left;
         background-color: rgba(150,80,0,1);
         color: white;
         font-size: 18;
         font-family: Times New Roman;
         width: 281.6px;
         height: 100px;
         opacity: 0.9;
         padding: 0;
        border: none;
        transition: 0.5s;
        
        
        
        }
        
        #watch:hover {
            
            background-color: rgba(178,98,0,1);
            cursor: hand;
            
        }
            
         
        
        
        
        #dismainimage {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 800px;
            height: 240px;
            object-fit: cover;
            
        }
        
        #disinfobox {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 608px;
            height: 240px;
            
            
            
        }
        
        .infohead1 {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 304px;
            height: 30px;
            background-color: rgb(44,44,44);
            line-height: 30px;
        }
        
        .infohead2 {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 304px;
            height: 30px;
            background-color: rgb(88,88,88);
            line-height: 30px;
        }
        
        .infobody1 {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 304px;
            height: 50px;
            background-color: rgb(100,100,100);
            line-height: 50px;
            
        }
        
        .infobody2 {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 304px;
            height: 50px;
            background-color: rgb(150,150,150);
            line-height: 50px;
            
        }
        
        
        .infopic {
            
            width: 50.5px;
            height: 50px;
            object-fit: cover;
            float: left;
            filter: brightness(80%);
            transition: 0.5s;
            
        }
        
        .noinfopic {
            
            width: 50.5px;
            height: 50px;
            object-fit: cover;
            float: left;
            filter: brightness(80%);
            transition: 0.5s;
            background-color: rgb(44,44,44);
            
        }
        
        
        .infopic:hover {
            
            filter: brightness(100%);
            cursor: hand;
            
        }
        
        
        .choose {
            
            display: block;
            position: relative;
            float: left;
            width: 704px;
            height: 80px;
            line-height: 80px;
            color: white;
            transition: all 0.5s ease-in-out;
        }
        
        
        
        #choosebox {
             display: block;
            position: relative;
            float: left;
            width: 1408px;
            height: 80px;
            background-color: black;
            
        }
        
        #choosebox:hover {
            
            cursor: hand;
            
        }
        
        
        #similar_debates {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 1408px;
            height: 235px;
            background-color: white;
            
        }
        
        
        
        
        
        .no_block {
            
            position: relative;
            float: left;
            display: inline-block;
            width: 352px;
            height: 235px;
            background: url("debatespics/0.jpg");
            overflow: hidden;
            background-size: cover;
            background-position: 50%;
            transition: 0.5s;
            
        }
        
        
        .similar_block {
            
            position: relative;
            float: left;
            display: inline-block;
            width: 352px;
            height: 235px;
            background: url("debatespics/0.jpg");
            overflow: hidden;
            background-size: cover;
            background-position: 50%;
            transition: 0.5s;
            
        }
        
        .similar_block:hover {
            
            opacity: 0.8;
            cursor: hand;
            
        }
        
        
        
        .iniblock {
            
         position: relative;
         display: block;
         float: left;
         width: 354.5px;
         height: 135.5px;
         background-size: cover;
        }
        
        
        
        
        .inititle {
            
         position: relative;
         display: block;
         float: left;
         width: 354.5px;
         height: 30px;
         background-color: rgba(0,0,0,0.6);
          z-index: 2;   
        }
        
        
        
        .inipic {
            
         position: relative;
         display: block;
         float: left;
         width: 30px;
         height: 30px;   
         object-fit: cover;   
          z-index: 2;   
        }
        
        .initext {
            
         position: relative;
         display: block;
         float: left;
         width: 314.5;
         height: 30px;
         line-height: 30px;
         text-align: left;
         padding-left: 10px;
         background-color: rgba(0,0,0,0.6);
         text-transform: upperCase;  
         font-size: 13px;
          z-index: 2;
         
        }
        
        .iniartrole {
            
         position: relative;
         display: block;
         float: left;
         width: 344.5px;
         height: 15px;
         line-height: 15px;
         text-align: left;
         padding-left: 10px;
         background-color: rgba(0,0,0,0.5);
         text-transform: upperCase;  
         font-size: 11px;
          z-index: 2;
         
        }
        
        .iniartback {
             
         position: relative;
         display: inline-block;
         float: left;  
         width: 360px;
         left: -5px;
         height: 132.5px;
         top: -40px;
         z-index: 0;
         object-fit: cover;
         filter: brightness(20%) blur(4px);
        }
        
        
        .reciblock {
            
         position: relative;
         display: inline-block;
         float: left;
         width: 344.5px;
         height: 135.5;
          background-color: transparent;
           
        }
        
        .recititle {
            
         position: relative;
         display: block;
         top: 100px;
         float: left;
         width: 354.5px;
         height: 30px;
         background-color: rgba(0,0,0,0.6);;
         bottom: 0px;   
        }
        
        .reciartrole {
            
         position: relative;
         display: inline-block;
         top: -46px;
         float: left;
         width: 344.5;
         height: 15px;
         line-height: 15px;
         text-align: right;
         padding-right: 10px;
         background-color: rgba(0,0,0,0.5);
         text-transform: upperCase;  
         font-size: 11px;
          z-index: 2;
         
        }
        
        .recitext {
            
         position: relative;
         display: inline-block;
         float: left;
         width: 314.5;
         height: 30px;
         line-height: 30px;
         text-align: right;
         padding-right: 10px;
         background-color: rgba(0,0,0,0.6);
         text-transform: upperCase;  
         font-size: 13px;
         z-index: 2;
          top: -46px;
        }
        
        .recipic {
            
         position: relative;
         display: inline-block;
         float: right;
         width: 30px;
         height: 30px;   
         top: -46px;
         object-fit: cover;
         z-index: 80;
            
        }
        
        .reciartback {
             
         position: relative;
         display: inline-block;
         float: left;  
         width: 360px;
         left: -5px;
         top: -50px;
         z-index: 0;
         object-fit: cover;
         filter: brightness(20%) blur(4px);
        }
        
        
        
        .dissartquestion {
            
         position: relative;
         display: inline-block;
         top: -226px;
         float: left;
         width: 354.5px;
         height: 145px;
         background-color: transparent;
         z-index: 6;
         text-align: center;
        }
        
        .dissartinside {
            
        position: relative;
        top: 50%;
        transform: translate(0, -50%);
         background-color: transparent;
         z-index: 7;
         max-width: 570px;
         max-height: 250px;
         padding-left: 50px;
         padding-right: 50px;
         text-align: center;
         font-size: 30px;
         margin-left: auto;
         margin-right: auto;
         
         font-family: Times New Roman;
         
         
        }
}




@media only screen and (max-width: 500px) {              

        
        .editpanel {
            
            position: relative;
            display: block;
            width: 100%;
            
        }


        .editbox {
            
            width: 100%;
            display: none;
        }


        #articleimage {
            
            display: none;
            
            
        }
        
        #banners {
            
            height: 100px;
            
        }
        
        #dismainimage {
            
            position
            position: relative;
            display: inline-block;
            float: left;
            width: 100%;
            height: 240px;
            object-fit: cover;
            
        }


        #disinfobox {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 100%;
            height: 240px;
            
            
            
        }
        
       
        
        .arguimput {
            
             position: relative;
            display: inline-block;
            float: left;
            height: 220px;
            width: 100%;
            
            font-size: 20px;
            background-color: transparent;
            text-align: justify;
            color: white;
            font-family: Times New Roman;
            outline: none;
            border: 0px;
            overflow: hidden;
            resize: none;
            
        }
        
        
        .userhead {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 98%;
            height: 30px;
            line-height: 30px;
            
            text-align: left;
            padding-left: 2%;
            z-index: 2;
        }
        
        .iniciator {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 100%;
            height: 80px;
            background-color: black;
            overflow: hidden;
        }
        
        .receiver {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 100%;
            height: 150px;
            background-color: black;
            overflow: hidden;
        }
        
        .textblock {
            
            
            position: relative;
            display: inline-block;
            float: left;
            height: auto;
            width: 100%;
            
            background-color: black;
            
            
        }
        
        #similar_debates {
                
                
                display: none;
                
            }
            
            
            
        .infopic {
            
            width: 16.66666%;
            height: 50px;
            object-fit: cover;
            float: left;
            filter: brightness(80%);
            transition: 0.5s;
            
        }
        
        .noinfopic {
            
            width: 16.66666%;
            height: 50px;
            object-fit: cover;
            float: left;
            filter: brightness(80%);
            transition: 0.5s;
            background-color: rgb(44,44,44);
            
        }
        
        .infohead1 {
                
                position: relative;
                display: inline-block;
                float: left;
                width: 50%;
                height: 30px;
                background-color: rgb(44,44,44);
                line-height: 30px;
            }
            
            .infohead2 {
                
                position: relative;
                display: inline-block;
                float: left;
                width: 50%;
                height: 30px;
                background-color: rgb(88,88,88);
                line-height: 30px;
            }
            
            .infobody1 {
                
                position: relative;
                display: inline-block;
                float: left;
                width: 50%;
                height: 50px;
                background-color: rgb(100,100,100);
                line-height: 50px;
                
            }
            
            .infobody2 {
                
                position: relative;
                display: inline-block;
                float: left;
                width: 50%;
                height: 50px;
                background-color: rgb(150,150,150);
                line-height: 50px;
                
            }
            
            
            .debateinfo {
                
                display: inline-block;
               position: relative;
               float: right;
             width: 100%;
             height: 40px;
             line-height: 40px; 
             background-color: rgb(33,33,33);
             font-size: 20px;
                
                
            }
            
            .picback {
            
             position: relative;
            display: inline-block;
            float: left;
            width: 15%;
            height: 50px;
            object-fit: cover;
            z-index: 2;
            transition: 0.5s;
            background-color: white;
            
        }
        
            
            
        .userpic {
            
            position: relative;
            display: inline-block;
            float: left;
            width: 100%;
            height: 50px;
            object-fit: cover;
            z-index: 2;
            transition: 0.5s;
        }
        
        .userpic:hover {
            
            cursor: hand;
            opacity: 0.8;
            
        }
        
        .usertext {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 50px;
            width: 85%;
            line-height: 50px;
            text-align: center;
            font-size: 24px;
            z-index: 1;
            -webkit-box-shadow: inset 10px 4px 15px -1px #000000; 
        box-shadow: inset 10px 4px 15px -1px #000000;
            
        }
        
        
        .userbackcase {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 50px;
            width: 100%;
            top: -50px;
            overflow: hidden;
            
            
        }        
        
        
        .userback {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 50px;
            width: 100%;
            object-fit: cover;
            filter: brightness(40%) blur(2px);
            z-index: 0;
            
            
        }
        
        
        .count {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 100%;
            background-color: rgb(33,33,33);
            
            
        }
        
        
        .argutext {
            
           position: relative;
            display: inline-block;
            float: left;
            height: auto;
            width: 94%;
            padding-left: 3%;
            padding-right: 3%;
            padding-top: 20px;
            padding-bottom: 20px;
            font-size: 15px;
            background-color: rgba(0,0,0,0.7);
            text-align: left;
             
            
        }
        
        .argutime {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 20px;
            line-height: 20px;
            color: orange;
            width: 100%;
            background-color: rgba(0,0,0,0.8);
            
        }
        
        
        
        .upvotedata {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 50%;
            background: url("bluebar.png");
            filter: brightness(100%);
            transition: 0.5s;
           
        }
        
        .downvotedata {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 50%;
            background: url("redbar.png");
            filter: brightness(100%);
            transition: 0.5s;
           
        }
        
        
        
        
        
        
        
        
        .upvote_pic {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 30px;
            transition: 0.5s;
            
           
        }
        
        .upvote_pic:hover {
            
            
            cursor:hand;
            filter: brightness(60%);
        }
        
        
        .voterpic {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 30px;
            width: 40.25px;
            transition: 0.5s;
            object-fit: cover;
            
           
        }
        
        
        .morearguvotes {
            
            position: relative;
            display: inline-block;
            float: right;
            height: 30px;
            width: 40.25px;
            transition: 0.5s;
            background-color: rgba(0,0,0,0.5);
            
           
        }
        
        
        .voterpic:hover {
            
            filter: brightness(120%);
            cursor: hand;
           
        }
        
        
        .upvote:hover {
            
            
            cursor: hand;
        }
        
        
        .downvote {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 30px;
            line-height: 30px;
            width: 352px;
            background: url("redbar.png");
            filter: brightness(80%);
            transition: 0.5s;
            color: white;
            border-width: 0px;
            outline: none;
        }
        
        .downvote:hover {
            
            filter: brightness(100%);
            cursor: hand;
            
        }
        
        
        
        .choose {
            
            display: inline-block;
            position: relative;
            float: left;
            width: 100%;
            height: 40px;
            line-height: 40px;
            color: white;
            transition: all 0.5s ease-in-out;
        }
        
        
        
        #choosebox {
             display: block;
            position: relative;
            float: left;
            width: 100%;
            height: 80px;
            background-color: black;
            
        }
        
        #choosebox:hover {
            
            cursor: hand;
            
        }
        
        
        .arguwait {
            
            position: relative;
            display: inline-block;
            float: left;
            height: 220px;
            line-height: 220px;
            text-align: center;
            color: white;
            font-size: 25px;
            width: 100%;
            background-color: rgba(0,0,0,0.5);
            
        }
        
        #commentsblock {
            
            margin-bottom: 10px;
            
        }
        
        #keywords {
            
            margin-bottom: 0px;
            
        }
       
       
       
         .emptyargu {
            
            display: none;
            
        }
       
}
