@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@700&display=swap');


*{margin:0;
  padding:0;
  box-sizing:border-box;
}
html{
       background-image: url('/img/bg.png');
    background-repeat: repeat-x;
    animation: slideleft 20000s infinite linear;
    -webkit-animation: slideleft 20000s infinite linear;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-attachment: fixed;
    position: relative;
    min-height: 100vh;
    min-width: 100vw

}


@keyframes slideleft {
    from {
        background-position: 0%;
    }
    to {
        background-position: 90000%;
    }
}

@-webkit-keyframes slideleft {
    from {
        background-position: 0%;
    }
    to {
        background-position: 90000%;
    }
}

.frmlog{width: 400px;
        height:400px;
	margin: 0 auto;
	margin-top: 15%;
    position: relative;
	padding: 3em 2em;

    
background: rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
	box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
border-radius: 50%;
justify-content:center;
text-align:center;
}
.logo-1{
    justify-content:center;
    height:80px;
    width:80px;
  position:absolute;
  top:-7%;
  left:42%;
  opacity:0.9;
}
.info{direction:rtl;}

.txt{

	background: rgba(255, 255, 255, 1);
    box-shadow:2px 2px 4px black;
      border-radius:20px;
        height :35px;  
     width:250px; 
     padding:1%;
     margin:2%;
     margin-right:4%;
     font-family: 'Almarai', sans-serif;

}

    .txt:hover {
        transform: scale(1.1);
        transition-duration: 0.25s;
        box-shadow: 2px 2px 4px #386395;

    }

h2{    font-family: 'Almarai', sans-serif;
       padding:3%;
color:white;
font-size:24px;
}
i{
    color:#386395;
    font-size:1.3em;
    vertical-align:central;
    text-shadow: 0px 0px 10px white;
        
}


.send{color:white;
                             
 margin-top:-4%;
 background-color:#386395;
 border-radius:6px;
 border:1px solid white;
 font-family: 'Almarai', sans-serif;
 height:62px;
 Width:62px;
 border-radius:50%;

                           
}
.lbl-1{font-size:1em;
       position:absolute;
       top: 57%;
       left:25%;
       font-weight:bolder;
}

.send:hover{transform:scale(1.1);
                                    background-color:#499dfe;
                                   box-shadow:2px 2px 2px black;
  transition-duration:0.25s;}



.social{
    display:flexbox;
    justify-content:center;
    margin-top:5%;
    
}
 i{font-size:30px;
            vertical-align:middle;
   align-content:center;  
   color:white;
   text-shadow:3px 3px 10px #499dfe;

         
}

a:hover{
transform:scale(1.2);
transition-duration:0.25s;
color:red;
}

ul li{
    list-style:none;
    display:inline;
}
.frgt{
font-family: 'Almarai', sans-serif;
}
.web{
    margin-right:-40%;
}
.mail{
 position:absolute;
    top:90%;
    left:45%;
}


@media(max-width:600px) {

.frmlog{width: 300px;
        height:300px;
	margin: 0 auto;
	margin-top: 40%;
    position: relative;
	padding: 3em 2em;

    
background: rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
	box-shadow: -1px 4px 28px 0px rgba(0,0,0,0.75);
border-radius: 50%;
justify-content:center;
text-align:center;
}

.logo-1{
    justify-content:center;
    height:60px;
    width:60px;
  position:absolute;
  top:-7%;
  left:42%;
  opacity:0.9;
}

h2{    font-family: 'Almarai', sans-serif;
       padding:1%;
color:white;
font-size:12px;
}

.txt{

	background: rgba(255, 255, 255, 1);
    box-shadow:2px 2px 4px black;
      border-radius:20px;
        height :30px;  
     width:240px; 
     padding:1%;
     margin:2%;
     margin-right:4%;
     font-family: 'Almarai', sans-serif;

}

.lbl-1{font-size:0.5em;
       position:absolute;
       top: 59%;
       left:35%;
       font-weight:bolder;
}

.send{color:white;
                             
 margin-top:-6%;
 background-color:#386395;
 border-radius:6px;
 border:1px solid white;
 font-family: 'Almarai', sans-serif;
 height:48px;
 Width:48px;
 border-radius:50%  }
.frgt{
font-family: 'Almarai', sans-serif;
font-size:0.5em;

}


.mail{

    position:absolute;
    top:92%;


}
   


 i{font-size:20px;
            vertical-align:middle;
   align-content:center;  
   color:white;
            vertical-align:middle;
   align-content:center;  

   text-shadow:3px 3px 10px #499dfe;      
}


}