body {
	background-color: #ebe7dc;
	font-family:'Arial';
	color: white;
	         }


#logo  {
			 width: 250px;
			 padding-right: 20px;
			 padding-top: 7px;
			 float: right;
		 }
.title {
			 margin-top: 40px;
			 padding-top: 20px;
			 padding-left: 20px;
			 font-size: 40px;
			 color: rgb(183,183,186);

		 }
.container {
			 width: 95%;

			 margin:20px  auto 0px  auto;
			 box-sizing: border-box;
			 border-radius: 30px;
			 border: 2px solid black;
			 background-color: #333;
		 }

.button {  
                       	
	                background-color: rgb(183,183,186);
                        color: #777;
			font-size: 24px;
			box-sizing: border-box;
			border-radius: 5px;
			}
		 
.btn {
			 margin-right: 80px;
			 margin-bottom: 20px;
			 background-color: rgb(183,183,186);
			 font-size: 24px;
			 float: right;
			 color: #777;
		 }
#bttn {                
                          position: relative;
                         
			  margin-top: -5%;
			  margin-left: 70px;
			  
		  }
#bttn2 {
	                  position: relative;
			  margin-top: -5%;
			  float: right;
		    }
 
#player {
			  width: 250px;
			   height: 80px;
		   }
.content {
                           min-height: 450px;
			   color: white;
			   margin-top: 40px;
			   margin-bottom: 20px;
			   padding: 20px;
		   }

table {
			   
	                   width: 100%;
			   border-collapse: collapse;
			   word-break:normal;
			   margin: auto auto;
		   }
th {
			   padding: .5em;
			   text-align: left;
			   border: 1px solid #bbbbbb;
		           border-bottom: 3px solid black;
		           background:#666;
				   }
td {
	 border: 1px solid #000;
         padding: 10px;
         text-align: left;
	

	 }
.table-scrollable {
		    width: 100%;
		    overflow-y: auto;
	            margin: 0 0 1em;
				}

.table-scrollable::-webkit-scrollbar {
		 -webkit-appearance: none;
	          width: 14px;
	          height: 14px;
			        }

.table-scrollable::-webkit-scrollbar-thumb {
			border-radius: 8px;
		 border: 3px solid #fff;
	        background-color: rgba(0, 0, 0, .3);
	                     }
.select-wrapper {
	  position: relative;
	  border: none;
	  width: 350px;
	  height: 220px;
	  padding-left: 10px;
          color: black;
          font-family: 'Arial', sans-serif;
          font-size: 16px;
		}
select {
		-moz-appearance: none;
	        -webkit-appearance: none;
	         appearance: none;
	         border: none;
		      }

select::-ms-expand {
	   display: none;
		   }
	
.select-wrapper::before {
	background-image: url("images/dropdown.png");
	position: absolute;
	right: 15px;
	top: 10px;
	color: #fff;
	}

input[type="text"] {
       width: 100%;
		}
p.result {
       color: rgb(183,183,186);
       font-size: 20px;
       }
p.hint {
       color: rgb(183,183,186);
       }
p.support {
	 color: #666;
      }
.footer {
      text-align: center;
      font-size: 10px;
      color: rgb(183,183,186);
      margin-bottom: 10px;
      }
.descr {
       display: block;	
       width: 92%;
       margin: 100px auto 0 auto;
       color: #777;
       }
.social { 
       position: relative;
       margin-top: 160px;
       text-align: center;
      	 }
.social  ul {  
       padding: 0;
                }
.social li {
	display: inline;
	text-align: center;
	padding: 10px;
       
   }