@media screen and (max-width: 1000px) {
    #wrapper {
       width:100%;
   }

    #gallery {
       width:100%;
   }

    #text {
       width:100%;
       height:auto;
       padding:20px 0;
       font-size:14px;
       text-align:center;
       left:0;
       bottom:300px;
   }

    #counter {
       top: 50px;
       height: 30px;
       line-height: 28px;
       right: 60px;
       /*background:rgba(0,0,0,0.3);*/
        bottom:50px;
   }

    #prev,  #next {
       width:30px;
       height:30px;
       bottom:50px;
       /*background:rgba(0,0,0,0.3);*/
   }

    #prev {
       right:30px;
   }

    .text_header {
       font-size:20px;
   }

    .text_small {
       font-size:10px;
   }
}

@media screen and (max-width: 600px) {
    #wrapper {
       height:300px !important;
   }

    #gallery {
       height:300px !important;
   }
}



#wrapper {/*
   width:1000px;
   height:500px;*/
   position:relative;
   margin:0 auto;
   /*padding-top:50px;*/
}

#gallery {
   width:100%;
   height:100vh;
}

#counter {
   width:75px;
   height:50px;
   line-height:48px;
   position:absolute;
   bottom:0;
   right:100px;
   z-index:100;
   color:#FFF;
   text-align:center;
   font-size:22px;
   font-weight:bold;
}

#prev, #next {
   width:50px;
   height:50px;
   position:absolute;
   bottom:0;
   z-index:100;
   font-size:20px;
   color:#FFF;
}

#prev {
   right:50px;
}

#next {
   right:0;
}

#text {
   height:auto;
   width:60%;
   padding:15px 20px;
   position:absolute;
   bottom:90px;
   right:20px;
   left:20px;
   margin: auto;
   z-index:200;
   background: rgba(6, 34, 86, 0.6);
   border: medium none;
   color: #ffffff;
   font-size: 15px;
   font-weight: 500;
   letter-spacing: 0.05em;
   /* line-height: 10px; */
   padding: 15px 30px;
   font-family: rohan, IRANSansNumber;
   text-align: right;
   direction: rtl;
}

.text_header {
   font-weight:bold;
   font-size:25px;
   padding-bottom:5px;
}

.text_small {
   padding-top:5px;
   font-size:14px;
}