body{font-family: 'Mulish', sans-serif}
.pn-account{padding: 0 45% 0 10%;position: relative;display: flex;align-items: center;justify-content: center}
.pn-account:before{content: "";position: absolute;width: 45%;height: 100%;top: 0;right: 0;background-color: rgba(66,139,202,0.8);z-index: 1}
.pn-account:after{content: "";width: 45%;height: 100%;position: absolute;background-image: url(../images/img-account.jpg);background-repeat: no-repeat;background-size: cover;right: 0;top: 0}
.pn-account .pn-content{width: 100%;padding-right: 115px;text-align: center;}
.pn-account .pn-content .pn-logo{display: inline-block;margin-bottom: 60px;position: relative;padding-left: 115px;min-height: 95px;}
.pn-account .pn-content .pn-logo:hover{text-decoration: none}
.pn-account .pn-content .pn-logo span{position: absolute;left: 0;top: 50%;transform: translateY(-50%);-moz-transform: translateY(-50%);-webkit-transform: translateY(-50%);}
.pn-account .pn-content .pn-logo strong{white-space: nowrap;display: inline-block;vertical-align: top;color: #17497e;font-size: 17px;line-height: 25px;margin: 15px 0 15px 0;font-weight: 900;position: relative}
.pn-account .pn-content .pn-logo strong sup{font-size: 20px;position: absolute;right: -15px;top: 0;}
.pn-account .pn-content .pn-logo p{font-size: 35px;line-height: 40px;font-weight: 900;margin-bottom: 0;color: #6bbfe4;}
.pn-account .pn-content .pn-title{margin: 0 0 30px 0;font-weight: bold;color: #e27240;font-size: 35px;line-height: 40px;}
.pn-account .pn-content .form-group{height: 50px;background-color: #fff;border-radius: 0;box-shadow: none;border: 1px solid #dbdbdb;margin-bottom: 20px;border-radius: 100px;padding: 0 30px 0 50px;position: relative;max-width: 500px;margin-left: auto;margin-right: auto;}
.pn-account .pn-content .form-group:focus{border: 1px solid #082950;box-shadow: 0 8px 10px rgba(0,0,0,.1)}
.pn-account .pn-content .form-group span{position: absolute;left: 0;width: 50px;height: 50px;text-align: center;font-size: 20px;line-height: 50px;color: #b7b7b7;}
.pn-account .pn-content .form-group .form-control{border: none;height: 100%;width: 100%;box-shadow: none;padding: 0;}
.pn-account .pn-content button{padding: 14px 15px 13px 15px;color: #fff;display: block;border-radius: 100px;font-size: 16px;line-height: 23px;transition: all ease .3s;background-color: #064a85;border: none;width: 100%;max-width: 500px;margin-left: auto;margin-right: auto;}
.pn-account .pn-content button:hover,.pn-account .pn-content button:focus{box-shadow: 5px 5px 1px rgba(0,0,0,.1);background-color: #064a85;color: #fff}
#captcha-field{display: inline-block}
.g-recaptcha{display: inline-block; transform: scale(0.8)}
@media only screen and (max-width: 1199px){
    .pn-account .pn-content .pn-title{font-size: 25px;line-height: 30px}
}
@media only screen and (max-width: 991px){
    .pn-account .pn-content .pn-logo{padding-left: 0;margin-bottom: 30px;}
    .pn-account .pn-content .pn-logo span{position: inherit;top: inherit;transform: inherit;-moz-transform: inherit;-webkit-transform: inherit;display: block;}
    .pn-account .pn-content{width: calc(100% + 100px);padding: 30px;margin-right: -100px;z-index: 1;border-radius: 10px;box-shadow: 0 0 5px rgba(0,0,0,.2);background-color: #fff;}
}
@media only screen and (max-width: 767px){
    .pn-account .pn-content .pn-logo p,.pn-account .pn-content .pn-title{font-size: 20px;line-height: 25px}
    .pn-account .pn-content .pn-logo strong{font-size: 13px;line-height: 18px}
}
@media only screen and (max-width: 570px){
    .pn-account{padding: 0}
    .pn-account .pn-content{width: 90%;margin-right: 0}
    .pn-account:before,.pn-account:after{width: 100%;}
}
@media only screen and (max-width: 370px){
    .pn-account .pn-content{padding: 15px}
    .pn-account .pn-content .pn-title{font-size: 17px;line-height: 22px;}
    .g-recaptcha{transform-origin: left}
}