/* 
    Created on : 26.12.2016, 10:36:25
    Author     : DFD
	Styles for : WooCommerce order confirmation page
*/
body.woocommerce-order-received {
	background: transparent;
	#layout,
	#layout.no-title {
		padding: 70px 0;
	}
	#main-content .woocommerce {
		margin-left: 10px !important;
		margin-right: 10px !important;
		p {
			width: 100%;
			margin-bottom: 25px;
			&.woocommerce-thankyou-order-received {
				.rel();
				font-size: 30px;
				letter-spacing: -2px;
				line-height: 1.2;
				text-align: left;
				padding: 0 0 0 40px;
				margin-bottom: 70px;
				background: transparent;
				&:before {
					content: "\ea3c";
					font-family: "dfd-socicons-font";
					.abs();
					top: 50%;
					left: 0;
					height: 1em;
					line-height: 1;
					margin-top: -.5em;
					opacity: .2;
				}
			}
		}
		h2, h3 {
			font-size: 25px;
			font-weight: bold;
			letter-spacing: -1px;
			padding-bottom: 0;
			margin-bottom: 35px;
			border-bottom: none;
		}
		.woocommerce-thankyou-order-details {
			+ .clear {
				+ p {
					text-align: left;
					text-decoration: underline;
					margin-top: 55px;
					margin-bottom: 55px;
				}
			}
		}
		.wc-bacs-bank-details-heading {
			text-align: left;
			margin-bottom: 55px;
			+ h3 {
				text-align: left;
				color: #2d2d2d;
				border-bottom: none;
			}
		}
		.wc-bacs-bank-details {
			margin-bottom: 55px;
			li {
			}
		}
		header {
			h2 {
			}
			h3 {
				margin-bottom: 20px;
			}
		}
		> ul {
			.clearfix();
			list-style: none;
			margin: 0 -10px 25px;
			li {
				font-size: 12px;
				text-transform: uppercase;
				letter-spacing: .3px;
				line-height: 1.2;
				text-align: left;
				float: left;
				width: 25%;
				margin: 0;
				padding: 0 10px;
				strong {
					.rel();
					font-size: 14px;
					font-weight: normal;
					line-height: 1.2;
					text-align: left;
					.block();
					padding-top: 10px;
					margin-top: 10px;
					border-top: 2px solid @border-color;
				}
			}
		}
		.row {
			h2, h3 {
				margin-top: 55px;
			}
		}
		.shop_table {
			background: transparent;
			dl.variation {
				.clearfix();
				font: inherit;
				font-size: 10px;
				font-weight: normal;
				letter-spacing: .4px;
				text-transform: uppercase;
				line-height: 1.2;
				overflow: hidden;
				margin-top: 5px;
				margin-bottom: 0;
				color: #c3c3c3;
				> * {
					float: left;
					clear: none;
					padding-right: 5px;
					&:last-child {
						padding-right: 0;
					}
				}
				* {
					font: inherit;
					letter-spacing: inherit;
					text-transform: inherit;
					line-height: inherit;
					color: inherit;
				}
				p {
					font: inherit;
					letter-spacing: inherit;
					line-height: inherit;
					text-transform: inherit;
					margin-bottom: 0;
				}
			}
			small {
				font-family: inherit;
				font-size: 100%;
				font-weight: normal;
				color: #7b7b7b;
			}
			&:not(.customer_details) {
				.rel();
				table-layout: fixed;
				padding-left: 30px;
				padding-right: 30px;
				padding-top: 35px;
				padding-bottom: 35px;
				margin-bottom: 0;
				border-spacing: 0;
				border-width: 0;
				thead {
					background: transparent;
					th {
						font-size: 12px;
						text-transform: uppercase;
						letter-spacing: .3px;
						line-height: 1.2;
						padding: 0 0 20px;
						border-bottom: 2px solid @border-color;
					}
				}
				tbody {
					tr {
						th, td {
							font-size: 14px;
							padding: 20px 0;
							color: #2d2d2d;
							border-bottom: 1px dashed @border-color;
							strong {
								font-weight: inherit;
							}
						}
						td.product-name {
							line-height: 1.2;
						}
						&:nth-child(even) {
							background: transparent;
						}
						&:last-child {
							th, td {
								border-bottom: none;
							}
						}
					}
				}
				tfoot {
					background: transparent;
					tr {
						&:first-child,
						&:last-child {
							th {
								font-size: 12px;
								text-transform: uppercase;
								letter-spacing: .3px;
								line-height: 1.2;
							}
						}
						&:first-child {
							th, td {
								padding-top: 40px;
							}
						}
						&:nth-child(2) {
							th {
								line-height: 1.2;
								color: #2d2d2d;
							}
						}
						&:nth-child(3) {
							th, td {
								line-height: 1.2;
								color: #2d2d2d;
							}
						}
						&:last-child {
							th {
								font-size: 12px;
								text-transform: uppercase;
								letter-spacing: .3px;
								line-height: 1.2;
							}
							th,
							td {
								padding-bottom: 0;
								border-bottom: none;
							}
						}
						&:not(:first-child) {
							th, td {
								border-top: 1px dashed @border-color;
							}
						}
						th {
							font-size: 14px;
							padding: 20px 0;
						}
						td {
							font-size: 14px;
							padding: 20px 0;
							.amount {
							}
						}
					}
				}
			}
			&.customer_details {
				padding-top: 15px;
				padding-bottom: 15px;
				border-spacing: 0;
				border-width: 0;
				tbody {
					tr {
						background: transparent;
					}
					th {
					}
					td {
						padding-left: 0;
						padding-right: 0;
					}
					th, td {
						text-align: left;
						width: 50%;
					}
				}
			}
		}
		address {
			font-style: normal;
			line-height: 2.7;
		}
		.addresses {
			font-style: normal;
			h2, h3 {
				float: none;
			}
			.col-1,
			.col-2 {
				float: left;
				width: 50%;
			}
		}
		.five.columns {
			> * {
				&:not(header) {
					margin-bottom: 25px;
				}
				&:last-child {
					margin-bottom: 0;
				}
			}
		}
	}
}
@media only screen and (max-width: 1024px) {
	body.woocommerce-order-received {
		#main-content .woocommerce {
			> ul {
				li {
					width: 50%;
				}
			}
		}
	}
}
@media only screen and (max-width: 640px) {
	body.woocommerce-order-received {
		#main-content .woocommerce {
			> ul {
				li {
					width: 100%;
				}
			}
		}
	}
}
@media only screen and (max-width: 540px) {
	body.woocommerce-order-received {
		#main-content .woocommerce {
			.addresses {
				.col-1,
				.col-2 {
					float: left;
					width: 100%;
				}
			}
		}
	}
}