@font-face {
    font-family: myFirstFont;
    src:url(../fonts/PTC55F.ttf);
}
* {
    font-family: myFirstFont;
    color: #5e6061;
    letter-spacing: 1px;
    background: url('../img/ee.jpg');
}
.logo{
width:100%;
}
.logbg{
    font-family: myFirstFont;
border: 0px solid;
height: 300px;
left: 50%;
margin-left: -235px;
margin-top: -200px;
position: absolute;
background: none repeat scroll 0 0 transparent;
top: 50%;
width: 490px;
border: 0px solid;
background: #fff;
box-shadow: 0px 0px 14px #949a9e;
}

.btntext{
    font-family: myFirstFont;
    border: 2px solid #000;
    color: #000;
    font-size: 16px;
    height: 40px;
    line-height: 20px;
    padding: 0 10px;
    width: 93.5%;
    margin-bottom: 10px;
    opacity: 0.9;
}
.btn {
    background: none repeat scroll 0 0 #798ABA;
    border: medium none;
    color: #fff !important;
    cursor: pointer;
    font-size: 16px;
    font-family: myFirstFont;
    height: 40px;
    text-align: center;
    width: 100%;
    transition: all 0.5s ease;
}
.btn:hover{
    background: none repeat scroll 0 0 #806FAB;
}

.btn:active{
    background: none repeat scroll 0 0 #808080;
}
.logfield{
width: 75%;margin: auto;margin-left: 70px;background: none repeat scroll 0% 0% transparent;margin-top:5%
}

@media only screen and (max-width: 320px) and (min-width:239px) {
.logbg{
   background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 300px;
    left: 50%;
    margin-left: -118px;
    margin-top: -232px;
    position: absolute;
    top: 50%;
    width: 250px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 17px;
}
.btn{
	width:106%;
}

}
@media only screen and (max-width: 320px) and (min-width:239px) {
.logbg{
   background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 300px;
    left: 50%;
    margin-left: -118px;
    margin-top: -232px;
    position: absolute;
    top: 50%;
    width: 250px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 23px;
}
.btn{
	width:106%;
}

}

@media only screen and (max-width : 600px) and (min-width:320px) {
  .logbg{
    background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 228px;
    left: 50%;
    margin-left: -85px;
    margin-top: -127px;
    position: absolute;
    top: 50%;
    width: 200px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 21px;
}
.btn{
	width:110%;
	height:30px;
}
.btntext{
	margin-bottom:2px;
	height:30px;
}
}

@media only screen and (max-width : 568px)  and (min-width:600px) and  (orientation : landscape) {
  .logbg{
    background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 252px;
    left: 50%;
    margin-left: -80px;
    margin-top: -125px;
    position: absolute;
    top: 50%;
    width: 191px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 23px;
}
.btn{
	width:106%;
height:25px;
}
.btntext{
height:25px;
}
}

@media only screen and (max-width : 736px) and (min-width:600px) and (orientation : landscape) {
  .logbg{
    background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 300px;
    left: 50%;
    margin-left: -110px;
    margin-top: -160px;
    position: absolute;
    top: 50%;
    width: 250px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 23px;
}
.btn{
	width:106%;
height:30px;
}
.btntext{
height:30px;
}
}
@media only screen and (max-width : 667px) and (min-width:600px) and (orientation : landscape) {
  .logbg{
    background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 300px;
    left: 50%;
    margin-left: -110px;
    margin-top: -160px;
    position: absolute;
    top: 50%;
    width: 250px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 23px;
}
.btn{
	width:106%;
height:30px;
}
.btntext{
height:30px;
}
}

@media only screen and (max-width: 240px) and (min-width:0px) {
.logbg{
   background: none repeat scroll 0 0 transparent;
    border: 0 solid;
    font-family: myFirstFont;
    height: 300px;
    left: 50%;
    margin-left: -118px;
    margin-top: -232px;
    position: absolute;
    top: 50%;
    width: 250px;
}

.logfield{
width: 75%; background: none repeat scroll 0% 0% transparent; margin: 5% auto auto 17px;
}
.btn{
	width:106%;
}

}