/******************************************************************************
#                      PHP Stripe Payment Terminal v1.3
#******************************************************************************
#      Author:     Convergine.com
#      Email:      info@convergine.com
#      Website:    http://www.convergine.com
#	
#
#      Version:    1.3
#      Copyright:  (c) 2013 - Convergine.com
#      
#*******************************************************************************/
	
	
	@import url(https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap);
	
	
	/**** MAIN STYLES ****/
     body {font-size:16px;  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Ubuntu,sans-serif !Important; color:#069; background:url(../images/bg.png) repeat;}
     .wrapper {  padding:15px; margin-top:20px; }
     h1 {font-size:18px;}
    .pppro_footer { width:580px; margin:0 auto; text-align:right; padding-top:15px;}

    .form_container h1 { font-size:28px; font-weight:bold;text-shadow: 1px 1px 0 white; text-align:left; width:580px; margin:0 auto; padding-bottom:20px; color:#666; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; padding-top:30px;}
    .clr { clear:both;}

    /**** PROCESSING PAGE (REDIRECTION) ****/
    .wait_msg { font-size:16px; }


    /**** ACCORDIONS STYLING ****/
    #accordion {color:#000;background-color:#FFF;}
    /* accordion header */
    #accordion h2 {background:#e4e4e4;margin:0;text-align:left;height:30px;padding:10px 0 0 15px;font-size: 13px;font-weight: 500;color: hsla(0,0%,10%,.7);border:1px solid #fff;border-bottom:1px solid #ddd;cursor:pointer;text-shadow: 1px 1px 0 white;}
    /* currently active header */
    #accordion h2 {cursor:default;background-color: #fff;line-height: 40px;height: auto;text-shadow: none !important;padding: 0px 11px;}
    /* accordion pane */
    #accordion .pane {border:1px solid #fff; border-width:0 2px;  padding:15px;	 color:#000; font-size:12px;  text-align:left;}
    .ui-widget { width:580px;}
    .ui-widget .ui-state-error, .ui-widget .ui-state-error p, .ui-widget .ui-state-highlight, .ui-widget .ui-state-highlight p, .ui-widget .ui-state-info, .ui-widget .ui-state-info p { font-size:13px; text-align:left;}
    .ui-widget .ui-state-info { padding-top: 10px !important; padding-bottom: 10px !important;}
    /**** FORM STYLING ****/
    .pppt_form label {float:left;/* width:140px; */font-size:13px;font-weight:bold;text-align:right;padding: 0px 5px 0 0;font-size: 13px;font-weight: 500;color: hsla(0,0%,10%,.7);}
    .pppt_form .long-field {float: none;-webkit-border-radius: 3px;-khtml-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;width: 100%;height: 37px;font-size: 13px;padding: 8px 12px;border: none;transition: box-shadow .08s ease-in,color .08s ease-in,filter 50000s;box-shadow: 0 0 0 1px #e0e0e0, 0 2px 4px 0 rgb(0 0 0 / 7%), 0 1px 1.5px 0 rgb(0 0 0 / 5%);color: hsla(0,0%,10%,.9);margin-bottom:8px;}
    .pppt_form .long-field:hover { border:1px solid #CCC;}
    .pppt_form .long-field:focus { border:1px solid #6B1289;}
    .pppt_form .small-field {float:left;-webkit-border-radius: 3px;-khtml-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;width:60px;height:20px;padding-left:5px;border:1px solid #666666;background-color: #ffffff;margin-bottom:8px;margin-right:10px;}
    .pppt_form .small-field:hover { border:1px solid #CCC;}
    .pppt_form .small-field:focus { border:1px solid #6B1289;}
    .pppt_form .lft-field { float:left; margin-right:10px; margin-bottom:8px;}
    .pppt_form .paypal { margin-top: 6px;}
    .pppt_form .submit-btn {margin:0 auto;width: 100%;margin-top:15px;margin-bottom: 16px;}


    /******* HINT STYLING ********/
    .hint { width:450px; height:300px; background-color:#FFF; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000; text-align:center; margin:0; padding:10px;}
    .hint p { margin:10px 0 10px 0; text-align:center;}

    .error { color:red; padding:3px 0 0 5px; font-weight: bold; display: inline-block;}
    



.m-label label {
    text-align: left;
    display: block !important;
    float: none !important;
    width: 100%;
    margin-top: 0px !important;
    padding: 0px !important;
}

.hidden {
    display: none;
}

p.top-txt {
    text-align: left;
    font-weight: 500;
    font-size: 20px;
}

p.top-txt img {
    width: 17px;
    margin-right: 4px;
}

form#ff1 {
    max-width: 514px;
}


.left-panel {
    max-width: 300px;
    text-align: left;
}

.left-panel h1 {
    font-size: 28px;
}

.left-panel p {
    color: hsla(0,0%,10%,.6);
    font-weight: 700;
    margin-bottom: 0px;
    margin-top: 17px;
}


.row.main:before {
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    background: #ffffff;
    content: " ";
    height: 100%;
    box-shadow: 15px 0 30px 0 rgb(0 0 0 / 18%);
    position: fixed;
    right: 0;
    top: 0;
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    width: 50%;
}


.col-md-6 {
    flex: 0 0 auto;
    width: 50%;
    z-index: 1;
    position:relative;
}

.left-panel-bottom ul {
    list-style-type: none;
    padding-left: 0px;
}


.left-panel-bottom {
    height: 80%;
    display: flex;
    align-items: end;
    width: 300px;
}

.left-panel-bottom li {
    font-size: 12px;
    opacity: 0.6;
}




input[type="submit"] {
    background-color: rgb(0, 116, 212);
    color: rgb(255 255 255 / 75%);
    border: 0;
    height: 44px;
    font-size: 15px;
    line-height: 1.15;
    font-weight: 500;
    width: 100%;
    border-radius: 6px;
}


.pppt_form .pane p {
    color: hsla(0,0%,10%,.7);
    line-height: 17px;
    text-align: center;
    font-size: 13px;
}

img.lft-field {
    margin-right: 0px !important;
    width: 28px;
}


input.lft-field {
    margin-right: 4px !important;
    margin-left: 11px;
}

@media screen and (max-width:767px) {
    
    .row.main:before {
        display:none;
    }
    
    .left-panel {
    text-align: center;
}

p.top-txt {
    display: none;
}

img.lft-field {
    width: 30px;
}

input.lft-field {
    margin-right: 4px !important;
    margin-left: 3px;
}

.cvv-dev {
    display: block;
    clear: both;
}
}



.tankyou-box {
    margin-bottom: 48px;
    margin-left: auto;
    margin-right: auto;
    max-width: 443px;
    padding-top: 63px;
}

.tankyou-box h2 {
    color: rgb(82, 83, 88);
    font-weight: 500;
    font-size: 24px;
    text-align: left;
    margin-bottom: 33px;
}

.tankyou-box-inner {
    
    
    
    
     background-color: white;
    border-radius: 6px;
    box-shadow: 0 0 0 1px rgb(175 175 175 / 20%), 0 15px 35px 0 rgb(49 49 93 / 8%), 0 5px 15px 0 rgb(0 0 0 / 6%);
    padding: 32px 32px 16px;
}


.tankyou-box ul {
    padding: 0px;
    list-style-type: none;
    margin-top: 29px;
}

.tankyou-box p {
    color: hsla(0,0%,10%,.5);
    font-size: 14px;
    font-weight: 600;
}

.tankyou-box ul li b {
    font-weight: 400;
    font-family: fantasy;
}

.tankyou-box ul li {
    color: hsla(0,0%,10%,.5);
    font-size: 13px;
    font-weight: 500;
}
.InvoiceThumbnail-image {
    margin-left: -35px;
    margin-top: -25px;
}

.InvoiceThumbnail {
    height: 74.8467px;
    position: relative;
    width: 60.5902px;
        margin-bottom: 24px;
}
.InvoiceThumbnail-successMark {
    background-color: white;
    border-radius: 40px;
    height: 20px;
    min-height: 20px;
    min-width: 20px;
    padding: 0;
    position: absolute;
    right: -10px;
    top: 65px;
    width: 20px;
}

.InvoiceThumbnail-successMark .InlineSVG {
    height: 20px;
    width: 20px;
}
.InvoiceThumbnail-successMark path {
    fill: #1ea672;
}


.InvoiceThumbnail span {
    color: hsla(0,0%,10%,.6);
    line-height: 24px;
    font-weight: 500;
    font-size: 14px;
}




.wrapper.thankyou {
    height: 100vh;
    background-color: #f0f2f8;
    padding: 0px;
    margin: 0px;
}


.wrapper.thankyou span {
    color: hsla(0,0%,10%,.6);
    line-height: 24px;
    font-weight: 500;
    font-size: 14px;
}