/*
Theme Name: RdeAnda
Theme URI: https://rdeanda.mx
Author: WebMinutos
Author URI: https://webminutos.com

Version: 1.0
Template: genesis
*/

/* Reset */
*{ box-sizing: border-box; }
body, h1, h2, h3, h4, h5, h6, p, ul, ol { padding: 0; margin: 0; }
a { text-decoration: none; }

/* Structure */
.site-header > .wrap,
.content-wrap,
.site-footer > .wrap {
	padding: 0 5%;
}

/* Typography */
body,
button,
input,
textarea {
	-webkit-font-smoothing:antialiased;
	font-size: 100%;
}

/* Colors */
:root {
	--blue: #003981;
}

/* Inputs */
::placeholder { color: rgba(0, 0, 0, 0.38); }

textarea:focus, input:focus{
    outline: none;
}

input,
textarea {
	padding: 0.75rem;
	width: 100%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 0.5rem;
	margin-bottom: 0.5rem;
}

input[type="submit"] {
	border: 0;
	padding: 1rem;
	cursor: pointer;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	border: 0;
	color: white;
	background-color: var(--blue);
	border: 2px solid var(--blue);
	margin-bottom: 0;
}

input[type="submit"]:hover {
	background-color: transparent;
	color: var(--blue);
}

/* Site Header */
.site-header {
	padding: 1.25rem 0;
}

.nav-primary { display: none; }

/* Site Hero */
.site-hero {
	position: relative;
	padding: 5rem 0;
	background-color: #1b1b1b;
}

.site-hero > .content-wrap { position: relative; }

.site-hero::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('images/abogados-cdmx.jpg');
	background-size: cover;
	background-position: center;
	opacity: 0.2;
}

/* Site Footer */
.site-footer {
	margin-top: 2rem;
	padding: 3rem 0;
	background-color: rgba(0, 0, 0, 0.1);
}

.copyright {
	margin-top: 2rem;
	text-align: center;
}

/* Typography */
h1, h2, h3, h5 { font-family: "Playfair Display", serif; }
h4, p, ul, ol, input, textarea { font-family: "Montserrat", sans-serif; }

/* 2.986rem */
/* 2.488rem */
/* 2.074rem */
/* 1.728rem */
/* 1.44rem */

h1 {
	font-size: 1.44rem;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

h2 {
	font-size: 2.488rem;
	margin-bottom: 1.5rem;
}

h3 {
	font-size: 1.728rem;
	margin-top: 1rem;
	margin-bottom: 0.75rem;
}

h4 {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 1rem;
	margin-bottom: 0.75rem;
}

h5 {
	font-size: 1.2rem;
}

.site-title {
	font-size: 2.074rem;
	margin: 0;
}

.content-wrap p {
	line-height: 1.5rem;
	margin-bottom: 1.25rem;
}

.site-hero p {
	line-height: 1.5rem;
	margin-bottom: 2.25rem;
}

.btn {
	background-color: var(--blue);
	border: 2px solid var(--blue);
	display: inline-block;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
	color: white;
	padding: 1rem 2.5rem;
	border-radius: 0.75rem;
}

.btn:hover {
	background-color: transparent;
	border: 2px solid white;
}

.black-box { margin: 0 auto; margin-top: 3rem; border-radius: 1rem; }

/* Framework */
section { padding: 3.5rem 0; }
.text-center { text-align: center; }
.m-bottom-no { margin-bottom: 0 !important; }
.m-bottom-2rem-m { margin-bottom: 1rem; }
.flex-m { display: flex; }
.flex-vertical-center-m { align-items: center; }
.col-left-m { margin-right: 10px; }
.white-60 { color: rgba(255, 255, 255, 0.60); }
.white-87 { color: rgba(255, 255, 255, 0.87); }
.white { color: rgba(255, 255, 255, 1); }
.border-bottom-m-only { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.separator-m-only { padding: 2rem; }
.padding-1rem { padding: 1rem; }
.padding-2rem { padding: 2rem; }

/* Custom Colors */
.blue { color: #003981; }
.bg-blue { background-color: #003981; }
.bg-black { background-color: rgba(0, 0, 0, 0.9); }

@media only screen and (min-width:768px){
	.site-header > .wrap,
	.content-wrap,
	.site-footer > .wrap {
		margin: 0 auto;
		padding: 0;
		max-width: 700px;
	}
}

@media only screen and (min-width: 960px) {
	/* Defaults */
	.border-bottom-m-only { border: 0; }
	.separator-m-only { display: none; }

	.site-header > .wrap,
	.content-wrap,
	.site-header > .wrap {
		max-width: 940px;
	}

	/* Grid */
	.flex { display: flex; flex-wrap: wrap; }
	.col-4, .col-6, .col-8 { padding: 0 15px; }
	.col-4 { width: 33.33%; }
	.col-6 { width: 50%; }
	.col-8 { width: 66.66%; }

	.site-header > .wrap { display: flex; justify-content: space-between; }
	.nav-primary { display: block; margin-top: 1.5rem; }
	.menu-primary { text-transform: uppercase; }
	.menu-primary li { display: inline-block; }
	.menu-primary a { padding: 0 0.75rem; font-weight: 500; color: rgba(0, 0, 0, 0.9); font-size: 15px; }
	.menu-primary a:hover { color: var(--blue); font-weight: 600; }

	.black-box { margin-top: 2rem; align-content: center; }

	.site-hero::before {
		background-position: top;
	}
}