@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
:root{--body-color:#fff;--font-family: 'Roboto', sans-serif;}
h1,h2,h3,h4,h5,h6,p,a{font-family: 'Roboto', sans-serif;}
body{background:var(--body-color);margin:0;padding:0;font-family:var(--font-family); }
.text-orange{color:#f47a62;}
.bg-orange{background:#f47a62;}
.f5-size{font-size:30px;}
button:focus{outline: 0px;}
.btn-size{font-size: 18px;}
.fp-size{font-size: 12px;}
a:hover{color:#f47a62;}
.pl-md-6{padding-left:6em;}
.pr-md-6{padding-right:6em;}
.pb-btn{margin-bottom: 2.2em;}
.welcome-btn{height: 59px !important;border-radius: 7px; display: flex;box-shadow: 0px 0px 11px 2px #dce8ea !important;border: 1px solid #cccbcb !important;}
/***banner***/
.banner-image .top{top:0;}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: rgb(244 122 98);cursor: pointer;}
.header-top nav ul li {  margin: 0px 12px;}
.navbar-light .navbar-nav .nav-link { color: #000;}
.header-top nav ul li.active {background: #f47a62;color: #fff; border-radius: 20px; padding: 0px 21px;}
.header-top nav ul li.active a{color: #fff !important;}
.bg-image-content { position: absolute; top: 48%; display: flex; justify-content: center;text-align: center;  left: 0; right: 0;}
.bg-slide {background: rgba(0,0,0,0.3); clip-path: polygon(0% 0%, 86% 0, 100% 100%, 0% 100%); padding:30px 19px;text-align: left;padding-right: 40px;}
.bg-slide h3 { font-size: 43px;  color: #fff;font-weight: 700;}
.img-content-data p{color:#fff;line-height: 34px; text-align: left;margin-left: 15px;}
.bg-image-banner { background:rgb(255 231 231 / 20%);width:100%;position: relative;  height: 200px; display: flex;  align-items: center;  justify-content: center;z-index: 1;}
.bg-image-banner img {  z-index: 2;}
.bg-image-banner:before {  content: ""; background: rgb(255 231 231 / 20%); height: 360px;  display: flex; align-items: center;
    justify-content: center;  z-index: 1;  width: 90%;  position: absolute;}
    .bg-image-banner:after {  content: ""; background: rgb(255 231 231 / 20%); height: 420px;  display: flex; align-items: center;
    justify-content: center;  z-index: 1;  width: 70%;  position: absolute;}
/********Login form********/
.popuptop-model .modal-dialog {max-width: 800px; margin: 0px; height: 100%; right: 0; position: absolute; width: 33%;}
.popuptop-model .modal-content { height: 100%;border-radius: 0px;}
.popuptop-model .modal.fade .modal-dialog {right: -350px; -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;-moz-transition: opacity 0.3s linear, left 0.3s ease-out; -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out; position: fixed; width: 42%; height: 100%;  border: none;}
.popuptop-model .modal.fade.show .modal-dialog { right: 0;}
.popuptop-model  .inner-body-model {width: 65%; margin: 0 auto; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 100%;}
.popuptop-model .content-header {margin-bottom: 41px; width: 100%;}
.inner-body-model .form-box input {height: 52px; border-radius: 7px;}
.popuptop-model .inner-body-model .btn-form {border-radius: 7px; height: 50px;}
.popuptop-model .inner-body-model .btn-form button {  line-height: 32px;}
.popuptop-model button.close {position: absolute;  right: 5%; font-size: 69px;  color: #f47a62;  font-weight: 300;  opacity: 1;  top: 3%;}
/********Login form********/
.banner-login { background: url(../images/home_image.png);background-position: center; background-size: cover;height:100vh;}
.banner-login  .inner-body-model {width: 60%; margin: 0 auto; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 100%;}
.banner-login .content-header {margin-bottom: 41px; width: 100%;}
.banner-login .form-box input {height: 52px; border-radius: 7px;}
.banner-login .inner-body-model .btn-form{border-radius: 7px;height:50px;}
.banner-login .inner-body-model .btn-form button{line-height: 32px;}
.banner-login .inner-login{height:100vh;}
/**************sign up********/
.sign-left{margin: 0 auto;}
.Main-inner input, .Main-inner select {height: 52px; border-radius: 7px;}
 .Main-inner textarea.form-control {height: 52px; border-radius: 7px;}
div#signbutton {height: 59px;border-radius: 7px; display: flex;}
a.btn.btn-done.bg-green { position: absolute; right: 13px; top: 50%;  background: #07a307;  border-radius: 20px;  color: #fff; font-size: 12px;
    padding: 5px 23px;}
    i.fa.fa-plus.top-click {font-weight: 100 !important; color: #f47a62;  border: 1px solid #f47a62;  padding: 2px 4px;  margin-left: 10px;}

/***********display********/
.inner-body-welcome { display: none;}
.rend-btn {display: none;}
.country-btn {display: none;}
.child-add{display: none;}



/*******welcome page********/
.inner-welcome-text { margin: 0 auto; height: 100vh;display: flex;align-items: center;}
.inner-welcome-text .inner-body{border-radius: 50px;}


/*****media******/
@media(min-width:1700px){
	.popuptop-model .inner-body-model .btn-form {height: 60px;}
}


@media(max-width:1024px){
	.banner-login  .inner-body-model {justify-content: flex-start;}
	.banner-login  .inner-body-model {width: 80%;}
	.pl-md-6{padding-left:1em;}
.pr-md-6{padding-right:1em;}
.popuptop-model .modal.fade .modal-dialog { width: 66%;}
ul.navbar-nav.ml-auto { width: 20%;  margin-left: 0 !important;}
.bg-slide h3 {font-size: 30px;}
.bg-slide p {  font-size: 12px;}
}
@media(max-width:767px){
.pb-btn{margin-bottom: 1em;}
.col-lg-5.col-md-6.col-sm-12.inner-login.bg-white { background: rgb(255 255 255 / 49%) !important; padding-top: 52px;}
ul.navbar-nav.ml-auto { width: 40%;  margin-left: 0 !important;}
.popuptop-model .modal.fade .modal-dialog {  width: 100%;}
.img-content-data p{color:#fff;line-height: 25px; text-align: left;margin-left: 15px;}
.popuptop-model  .inner-body-model { width: 75%; height: 600px; overflow-y: scroll;justify-content: flex-start;margin-top: 30px;}
.bg-slide {background: rgba(0,0,0,0.3); clip-path: polygon(0% 0, 100% 0%, 92% 100%, 0% 100%); padding: 19px;text-align: center;}
.col-lg-6.col-md-4.col-sm-12.d-md-flex.d-sm-none { display: none;}
.bg-image-content {  top: 37%;z-index: 1;}
nav { z-index: 3;}
}