/*   
   
    Description: Styles for HTML template
    Author URI: https://creativelyewe.com
	Description: custom payments page 
	Author: Susan Belanger
	Author URI: https://creativelyewe.com
	Version: 0.0.1

*/

/* CSS Document for payments */



#page, #page.account {
    /* max-width: 1100px; */
    min-height: 600px;
    background: #fbfdf9;
    height: auto;
    margin: 0 auto;
    position: relative;
    padding-bottom: 50px;
    box-shadow: 3px 5px 8px rgb(0 0 0 / 80%);
}


section.main, section.secondary {
    padding: 3% 2%;
    margin: 0 auto;
    max-width: 1100px;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5% 0 0;
    position: relative;
    height: auto;
}

.main {
    padding: 3% 0 0 0;
}

.container.main {
    margin: 0;
}


section.main h2, section.main.store h2, section.secondary h2, div.container.main h2#post-title, div.container.main h2#post-title.single.announce {
    font-family: 'Kurale', serif;
    font-size: 3em;
    margin: 0 0 0.7em 0;
    letter-spacing: 1px;
    line-height: 1.1em;
    color: #426a86;
    padding-left: 0.5em;
}


section::after, .backLink aside::after, .woocommerce::after, .container.main::after, footer div.container::after {
    content: '';
    display: block;
    clear: both;
}

section.main div.entry div.woocommerce {
    border-top: 3px solid #1f516d;
    padding-top: 3%;
    margin-bottom: 5%;
}


.woocommerce div.product div.summary, .woocommerce div.product div.summary p.email {
    margin-bottom: 2em;
    font-family: 'Raleway', sans-serif;
    font-size: 1.3em;
    color: #44697d;
}

.woocommerce div.product form.cart {
    margin-bottom: 2em;
    margin-top: 8%;
}

.woocommerce div.product form.cart .button {
    vertical-align: middle;
    float: left;
    padding: 1em 2em 2em 1em;
}

label, legend {
    display: block;
    margin-bottom: .5rem;
    font-weight: 600;
}


.woocommerce ul.products li.product span.price, .woocommerce div.product p.price, div.summary.entry-summary p.price span.woocommerce.-Price-amount.amount, woocommerce .woocommerce-variation.single_variation span.price, input#nyp-1.input-text.amount.nyp-input.text {
    color: #244e86;
    font-family: Georgia, 'PT Serif', 'Palatino Linotype', 'Times New Roman', Times, serif;
    font-family: 'PT Serif', serif;
    font-size: 2.3em;
    /* display: none; */
    font-weight: bold;
    max-width: 100%;
}

.product .nyp .nyp-input, .wcopc .product-item .nyp .nyp-input {
    margin: 3% 3% 5% 0%;
    padding: 30px 20px;
    font-size: 1.8em;
    color: #426a86;
    min-height: 50px;
    letter-spacing: 1px;
    font-family: 'Georgia', 'Times New Roman', Times, Palatino, serif;
    display: block;
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
    padding: 1em 2em 2em 2em;
}

input {
    line-height: normal;
}

input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}



.container.payment {
    text-align: left;
    max-height: 92px;
    padding: 0 1% 0 0;
    border-bottom: 1px solid #414141;
}


.container.payment ul.payment {
    margin-right: 0;
}

ul.social, ul.payment {
    display: block;
    margin: 0;
    list-style-type: none;
}


ul.payment {
    padding: .6% 0;
}

ul.payment li {
    font-size: 3em;
    color: #f4f4f5;
    padding: 0 0 0 3%;
}

ul.payment li {
    height: 50px;
    float: right;
    display: inline;
    width: 105px;
}

ul.payment li .amex {
    background: url(../images/22.png);
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
    height: 45px;
}


ul.payment li .discover {
    background: url(../images/14.png);
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
    height: 45px;
}

ul.payment li .visa {
    background: url(../images/1.png);
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
    height: 45px;
}

ul.payment li .mastercard {
    background: url(../images/2.png);
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
    height: 45px;
}