@import url('https://fonts.googleapis.com/css2?family=Cairo&display=swap');
  body {
  font-family: 'Cairo', sans-serif;
  display: inline;
  align-items: center;
  height:100vh;
  padding: 0;

}
.body {
    background-image: linear-gradient(#d3c5ff8c 1%, #aaf3ff 100%);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  	height:100%;
    width: 100%;
    padding: 0;
    margin: 0;
  padding-top: 40px;
  padding-bottom: 40px;
}

.iphone-x {
  position: relative;
  margin: 40px auto;
  width: 360px;
  height: 780px;
  background-color: #7371ee;
  background-image: linear-gradient(60deg, #5551da 1%, #24dad0 100%);
  border-radius: 40px;
  box-shadow: 0px 0px 0px 11px #1f1f1f, 0px 0px 0px 13px #191919, 0px 0px 0px 20px #111;
}
.iphone-x:before, .iphone-x:after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.iphone-x:after {
  bottom: 7px;
  width: 140px;
  height: 4px;
  background-color: #f2f2f2;
  border-radius: 10px;
}
.iphone-x:before {
  top: 0px;
  width: 56%;
  height: 30px;
  background-color: #1f1f1f;
  border-radius: 0px 0px 40px 40px;
}



.iphone-x .Speaker,
.iphone-x .Camera,
.iphone-x .screen,
.iphone-x .btns-phone {
  position: absolute;
  display: block;
}



.iphone-x .Speaker {
  top: 0px;
  left: 50%;
  transform: translate(-50%, 6px);
  height: 8px;
  width: 15%;
  background-color: #101010;
  border-radius: 8px;
  box-shadow: inset 0px -3px 3px 0px rgba(255, 255, 255, 0.2);
}
.iphone-x .Camera {
  left: 10%;
  top: 0px;
  transform: translate(180px, 4px);
  width: 12px;
  height: 12px;
  background-color: #101010;
  border-radius: 12px;
  box-shadow: inset 0px -3px 2px 0px rgba(255, 255, 255, 0.2);
}
.iphone-x .Camera:after {
  content: "";
  position: absolute;
  background-color: #2d4d76;
  width: 6px;
  height: 6px;
  top: 2px;
  left: 2px;
  top: 3px;
  left: 3px;
  display: block;
  border-radius: 4px;
  box-shadow: inset 0px -2px 2px rgba(0, 0, 0, 0.5);
}
.iphone-x .screen {
  top: 10%;
  text-align: center;
  text-decoration: none;
  width: 100%;
  font-weight: 100;
  padding-top: 60px;
}
.iphone-x .btns-phone {
	bottom: 50px;
    width: 60px;
    height: 60px;
    border: 0;
    color: #c3c3c3;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    left: 30px;
    color: #fff;
  	font-size: 24px;
    display: flex;
    align-content: center;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.iphone-x .btns-phone + .btns-phone {
  left: auto;
  right: 30px;
}

.logo-img{
    display: inline-block;
    width: 72px;
    height: 72px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIgdmlld0JveD0iMCAwIDYzOCA2MzgiPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6ICMwMDIzZjY7CiAgICAgIH0KCiAgICAgIC5jbHMtMSwgLmNscy0yIHsKICAgICAgICBmaWxsLXJ1bGU6IGV2ZW5vZGQ7CiAgICAgIH0KCiAgICAgIC5jbHMtMiB7CiAgICAgICAgZmlsbDogIzAwMGUzZDsKICAgICAgfQogICAgPC9zdHlsZT4KICA8L2RlZnM+CiAgPHBhdGggaWQ9IkNvbG9yX0ZpbGxfMyIgZGF0YS1uYW1lPSJDb2xvciBGaWxsIDMiIGNsYXNzPSJjbHMtMSIgZD0iTTAsOTIuNjA3QzAsMjQ3LjQ0NCwwLDQwMi4yODEsMS4xMiw1NTcuMTE4YzIzLjUyOSwwLDQ3LjA1OCwwLDcyLjU1MS44ODYsMC42OC00NS4xNS4wMTQtOTEuNzEyLDAuMjc2LTEzOC40NzUsMC00NS44NjQsMC05MS43MjcuNzU4LTEzOS42NiwzMi44NzYsMzQuMzM0LDY1LjM3NSw2OC41ODYsOTguODE4LDEwMy4wNTUsNTkuOTQxLTY2LjA1MiwxMTUuMDYzLTEzNy4xNjMsMTc5LjQzNi0xOTkuN0ExOTkuNTU4LDE5OS41NTgsMCwwLDEsNDEzLjM3NSwxNDQuOWM0My4yMzktMTcuMzU1LDkyLjIzLTE4LjUxOCwxMzYuNzM4LTEuMDcyLDQwLjA0NiwxNy44MzMsNjEuODUyLDM0LjkwOCw4Mi42ODEsNjUuNDExbDIuMjE3LDAuMTYxYy0xOS4wOTEtMzkuNzkyLTM5LTYzLjg0My03Mi4xNjctODUuODQ5LTI5LjgyOS0yMS4xNC04OS4zNTYtMzcuMzA5LTEzNS41MzctMzIuNzc0LTMyLjgsMS4wODktNzAuNjE0LDEyLjA5LTkxLjIwOSwyMy44MjQtMzQuMTQ1LDE2LjI5MS01Ny4xODcsMzguNTUxLTc5LjIyNCw2MC40NTMtMjkuODIyLDMxLjIxMi01OC42ODQsNjIuMDctODguMDY5LDkyLjM3OUMxMTIuNTE0LDIwOC4xNDEsNTcuNDM3LDE1MC4zMTEsMi4zMTYsOTIuNTI3LDIuMjQxLDkyLjYwNywwLDkyLjYwNywwLDkyLjYwN1oiLz4KICA8cGF0aCBpZD0iQ29sb3JfRmlsbF8yIiBkYXRhLW5hbWU9IkNvbG9yIEZpbGwgMiIgY2xhc3M9ImNscy0yIiBkPSJNMzQ2LjkzNywyMzUuMUMzMjIuMzEsMjYwLjczLDI5OS42NywyODguNDMzLDI3NS44LDMxNi4wMjZjMCw3OS41OCwwLDE1OS4xNi0uODc1LDI0MC44MywyMy4wMTgsMC42NSw0Ny4yNy4wMSw3MS44LDAuMjYyLDAuNzUtLjM5MiwzLjE4OS45OCwzLjM3Ny0yLjM1MiwwLTM3LjI0MiwwLTc0LjQ4NCwxLjEyNi0xMTEuNzI2LDMzLjQsMCw2Ni43OTIsMCwxMDEuMzE0LjIsMjkuMjY5LTEuNDM5LDU4LjUzNywzLjE3LDg5LTUuODEsNDYuMTQzLTE4LjM4Nyw2NS40MTUtNDAuMDc3LDg0LjA0Ni04My4xMjEsMTUuOTgzLTM3LjQsOS4xNTItODQuNjUtOC4xMTgtMTE3LjAyM0M1OTMuNywyMDAuMDE0LDU2NS40ODQsMTcyLjYyNyw0OTkuNTA5LDE2NGMtMjcuMTM4LTIuNTI4LTYwLjAzMyw0LjMxNC04NC40ODEsMTYuNDkyQTE0OS42MzksMTQ5LjYzOSwwLDAsMCwzODYuMjk0LDE5OC42Yy0xMC44NSwzLjk1NC0zLjQsMjcuMDI0LTUuOCw0MC45ODIsMC4zNzYsMC43ODQtLjkzOCwzLjMzMiwyLjI1MiwyLjM1Miw0MC4xNSwwLDgwLjMsMCwxMjEuNDUzLjE3NCwzMy40NTYsNy4xLDQyLjM5LDIxLjA3OCw1My43OTMsNDYuNzg2LDguMjE3LDIzLjAzMy0zLjg2Niw0OS40NjktMTQuNDA3LDU4LjY3Mi04Ljg4Miw4LjcxMS0xNi40NjksMTUuMDY4LTM3LjAxLDE3Ljg1NC01MS40MDgsMC0xMDIuODE2LDAtMTU2LjE5My44ODEtMC43LTIwLjgzMS0uMDEzLTQzLjEwOS0wLjI4Mi02NS41NjR2LTY1Ljg2UzM0Ni43MjEsMjM0Ljg3OCwzNDYuOTM3LDIzNS4xWiIvPgo8L3N2Zz4K) 0 0 no-repeat;
}


.iphone-x .btns-phone:hover {
color:#000;
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 5px 20px 0 rgba(21,21,21,.2);
    -moz-box-shadow: 0 5px 20px 0 rgba(21,21,21,.2);
    -webkit-box-shadow: 0 5px 20px 0 rgba(21,21,21,.2);
    -o-box-shadow: 0 5px 20px 0 rgba(21,21,21,.2);
    -ms-box-shadow: 0 5px 20px 0 rgba(21,21,21,.2);
}

.text-screen{
  color: #fff;

}

    
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }




.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: auto;
}
a{
	text-decoration: none;
}
.form-signin .checkbox {
  font-weight: 400;
}
.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.flex-c {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
}
.login-social {
    font-size: 25px;
    color: #393939;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #fff;
    margin: 5px;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,.1);
    -moz-box-shadow: 0 5px 20px 0 rgba(0,0,0,.1);
    -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,.1);
    -o-box-shadow: 0 5px 20px 0 rgba(0,0,0,.1);
    -ms-box-shadow: 0 5px 20px 0 rgba(0,0,0,.1);
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  }
.login-social:hover {
    color: #3b5998;
    box-shadow: 0 5px 20px 0 rgba(21,21,21,.8);
    -moz-box-shadow: 0 5px 20px 0 rgba(21,21,21,.8);
    -webkit-box-shadow: 0 5px 20px 0 rgba(21,21,21,.8);
    -o-box-shadow: 0 5px 20px 0 rgba(21,21,21,.8);
    -ms-box-shadow: 0 5px 20px 0 rgba(21,21,21,.8);
  -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
}
.login-social.facebook:hover {
    color: #38529a;
}
.login-social.twitter:hover {
    color: #1c9cea;
}


.copyrights{
margin-top:80px;

}
.logintext{ color:#efefef !important}