html,body {
    overflow: hidden;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: black;
    font-family: Calibri, Verdana, Helvetica, Arial, sans-serif;
    height: 100%
}

.box {
 width: 100%;
 } #popup {
 display: none;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 width: 100%;
 height: 100%;
 transition: 1s;
 background: #fff;
 text-align: center;
 z-index: 999;
}  #close {
 position: absolute;
 right: 10px;
 cursor: pointer;
 font-weight: bold;
 color: #fff;
 font-size: 35px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
 display: block;
 -webkit-transition: 0.5s;
 transition: 0.5s;
}
#close:hover {
 color: #fff;
 -webkit-transform: rotate(360deg);
 transform: rotate(360deg);
}  header {
 width: 100%;
 height: 42px;
 background: red;
}  footer {
 width: 100%;
 height: 42px;
 background: red;
 position: absolute;
 bottom: 0;
} 

.all {
	position: absolute;
	width: 100%;
	height: 100%;
}

.up {
	position: absolute;
	background: white;
	border-bottom: 1.5px solid gray;
	top: 0;
	right: 0;
	width: 100%;
	height: 42px;
}

.down {
	position: absolute;
	background: black;
	border-top: 1.5px solid gray;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 42px;
}  input[type="button"] {
 background: black;
 border: 0px;
 width: 42px;
 height: 100%;
 color: #ddd;
 font-size: 20px;
 -webkit-appearance: none;
 text-align-last: center;
 cursor: pointer;
} input[type="button"]:hover {
 background: red;
 text-align: center;
}  

.three {
	position: absolute;
	background: black;
	width: 100%;
	height: 100%;
}


.select-box {
	width: 100%;
	margin: auto;
	text-align-last: center;

}

#com { 	
   	text-align: 
   	center; 
   	color: white;
 		font-size: 12px;
 		margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) 
}

#company { 	
   	text-align: 
   	center; 
   	color: gray;
 		font-size: 12px;
 		margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) 
}


.select-box select {
	height: 100%;
	padding: 10px 15px;
	line-height: 22px;
	font-size: 16px;
	width: 100%;
	border: none;
	-webkit-appearance: none;
	appearance: none;
	text-align-last: center;

}


.select-box: after{
	content:;
	position: absolute;
	right: 8px;
	top: 50%;
	margin-top: -4px ;
	border-top: 8px solid #ccc;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	pointer-events: none;
	text-align-last: center;
}

    .myselect {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      width: 100%;
      padding: 6px 12px;
      border-radius: 4px;
      border: 1px solid none;
      font-size: 1rem;
      line-height: 1;
      background: #fff url(../img/down.svg) no-repeat center right 18px / 18px 18px;
      transition: all .2s ease-in-out;
      overflow:scroll
    }

    /*IE*/
    .myselect::-ms-expand {
      display: none;
    }

    .myselect:focus {
      outline: 0;
      border-color: none;

    }

    h1 {
      font-size: 1.8rem;
    }

