/* Garretts's CSS */
@import url('/wp-content/themes/cogop/assets/css/garrett.css');
@import url('/wp-content/themes/cogop/assets/css/eliezer.css');
@import url('/wp-content/themes/cogop/assets/css/popup-modal.css');

/*
 Theme Name: 	COGOP
 Theme URI: 	https://wordpress.org/themes/twentynineteen/
 Description: 	Custom theme built for Colorado GOP
 Author: 		COGOP
 Template: 		twentynineteen
 Version: 		2.1
 License:      	GNU General Public License v2 or later
 License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  	cogop
*/




/* ========= COLOR REFERENCES ========= */

:root {
    --red: #ab3e3f;
    --blue: #1340af;
    --gray: #696969;
    --yellow: #dbb537;
    --navyBlue: #222a45;
    --darkWhite: #f0f0f0;
    --white: #ffffff;

}

/* ======== TABLE OF CONTENTS ============
	1. TYPOGRAPHY
	2. GLOBAL
	3. MAIN CONTENT
		3a. Nav
		3b. Footer
		3c. Feature Background Image
		3d. Forms
        3e. Posts / Custom Post Types
======================================= */




/* ------------------------------ 
    1. Start Typography
------------------------------ */
h1,
h2,
h3,
h4,
h5,
h6,
a,
.btn,
button {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
}

h1,
.h1 {
    font-size: 3.9em;
}

.font-script {
    /* Cursive-Style Font */
    font-family: fave-script-pro, sans-serif;
    font-weight: 700;
    font-size: 166px;
    line-height: 211px;
    text-align: center;
}

h1:not(.site-title):before,
h2:before,
.entry .entry-title:before {
    /* SNEAKY TOP TEXT LINE */
    display: none;
}

h2,
.h2 {
    font-size: 3.5em;
}

h3,
.h3 {
    font-size: 3em;
}

h4,
.h4 {
    font-size: 2.125em;
}

h5,
.h5 {
    font-size: 1.75em;
}

h6,
.h6 {
    font-size: 0.9375em;
}

p,
.p {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    font-size: 0.875em;
    line-height: 1.4em;
    letter-spacing: 0.02em;
    color: var(--gray);
}

a,
a.anchor-theme {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    text-decoration: none !important;
    transition: none;
    font-size: 0.875em;
}

.text-normal {
    text-transform: none;
}

/* ------------------------------ 
    1. End Typography
------------------------------ */




/* ------------------------------ 
    2. Start Global
------------------------------ */
@-ms-viewport {
    width: device-width;
}

html {
    font-size: 16px;
    /* Adjust this on mobile to globally change H-tags :NOT P-tags) */
}

body {
    font-family: 'Prompt', sans-serif;
    font-size: 16px;
    /* Adjust this on mobile to globally change P-tags :NOT H-tags) */
    line-height: 25px;
    letter-spacing: 0.02em;
    color: var(--gray);
    background: #FFFFFF;
}

.desktop {
    display: block !important;
}

.mobile {
    display: none !important;
}

.active {
    border-bottom: 4px solid #dbb537;
}

.block {
    display: block;
}

.uppercase {
    text-transform: uppercase;
}

.text-shadow {
    text-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
}

.text-start {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-end {
    text-align: right;
}

.bg-cover {
    background-size: cover !important;
}

.ls-018 {
    letter-spacing: 0.18em;
}

.ls-001 {
    letter-spacing: 0.01em;
}

.row-50 {
    min-height: 50vh;
}

.row-65 {
    min-height: 65vh;
}

.row-75 {
    min-height: 75vh;
}

.row-85 {
    min-height: 85vh;
}

.row-100 {
    min-height: 100vh;
}

.f-400 {
    font-weight: 400;
    /* Regular */
}

.f-600 {
    font-weight: 600;
    /* Semi-bold */
}

.f-700 {
    font-weight: 700;
    /* Bold */
}

.f-800 {
    font-weight: 800;
    /* Extra-bold */
}

.lh-1 {
    line-height: 1rem;
}

.white {
    color: white;
}

.red {
    color: var(--red);
}

.blue {
    color: var(--blue);
}

.gray {
    color: var(--gray);
}

.yellow {
    color: var(--yellow);
}

.navyBlue {
    color: var(--navyBlue);
}

.darkWhite {
    color: var(--darkWhite);
}

.buttonHover {
    transition: 0.25s all;
}

.buttonHover:hover {
    transform: scale(1.1);
    box-shadow: 0px 10px 5px -5px rgba(0, 0, 0, 0.425);
    transform: translateY(-2px);
}

section {
    position: relative;
}

.no-padding {
    padding: 0;
}

img {
    width: 100%;
}


/* ------------------------------ 
    2. End Global
------------------------------ */




/* ------------------------------ 
    3. Start Main Content
------------------------------ */
/* 3a. Nav */

/* 3b. Footer */

/* 3c. Feature Background Image */


/*** CONTENT IMAGE ***/


.content-image .image-heading a {
    color: var(--white);
    font-weight: 800;
    letter-spacing: 0.18em;
}

.content-image .image-heading a:hover {
    color: var(--yellow);
}

.content-image .red-border {
    padding: 0 8rem 4rem;
}

.content-image .image-subheading {
    font-weight: 800;
    letter-spacing: 0.01em;
}


/*** CONTENT VIDEO & CONTENT IMAGE ***/
.content-video,
.content-image,
.content-social-feed {
    background: var(--navyBlue);
}

.video-heading,
.image-heading {
    position: relative;
    z-index: 3;
    width: fit-content;
    display: block;
    margin: 0 auto -1.25rem;
    padding: 0 3rem;
}

.video-heading,
.image-heading {
    background: var(--navyBlue);
}



/*** CONTENT VIDEO ***/
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    overflow: hidden;
    max-width: 100%;
    height: auto;
}

.videoWrapper iframe,
.videoWrapper object,
.videoWrapper embed,
.videoWrapper video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.red-border {
    position: relative;
    z-index: 0;
    border-radius: 3px;
    background: transparent;
    border: 4px solid #ab3e3f;
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.16);
    padding: 4rem;
}

/*** CONTENT EXPLORE ***/

.content-explore .row {
    min-height: 1140px;
}

.content-explore .row .popup-nav {
    background: rgba(34, 42, 69, 0.7);
    width: 100%;
    min-height: 250px;
    padding: 1.25rem;
    margin-bottom: 12rem;
}

.content-explore .row .popup-nav .heading {
    letter-spacing: 0.18em;
    font-weight: bold;
}

.content-explore .popup-nav .link-item img {
    display: block;
    margin: 1.25rem auto;
    width: 100px;
    height: 100px;
}


.content-explore .row .popup-nav hr {
    background-color: var(--yellow);
    color: var(--yellow);
    border: none;
    height: 4px;
}

/*** CONTENT NEWS & UPDATES ***/

.content-news-updates .read-more a {
    border: 2px solid #9c4543;
    text-transform: none;
}

/*** CONTENT SOCIAL FEED ***/
.content-social-feed {
    border-bottom: 10px solid #fff;
}

.social-feed-wrapper {
    background: #fff;
}

/*** HERO & HERO DROPDOWN ***/
.hero .row,
.hero-dropdown .row {
    min-height: 65vh;
}

/*** HERO DROPDOWN ***/

.hero-dropdown .dropdown-container .form-control {
    min-height: 50px;
    width: 75%;
    /* Dropdown Arrow Icon style */
    background: url('./assets/svgs/arrows/dropdown_arrow.svg') no-repeat right rgba(34, 42, 69, 0.8);
    -webkit-appearance: none;
    background-position-x: 98%;
    color: #fff;
}

.hero-dropdown .dropdown-container button {
    width: 15%;
}

/*** HERO HUB ***/
.hero-hub {
    background: var(--red);
}

.hero-hub .row {
    min-height: 35vh;
}

.hero-hub-title h1 {
    line-height: 110px;
}

.hero-hub-nav {
    border-left: 3px solid var(--yellow);
}

.hero-hub-nav ul {
    padding: 0;
    margin: 0 3rem;
    list-style: none;
}

.hero-hub-nav li a {
    text-transform: uppercase;
    color: #fff;
    letter-spacing: 0.01em;
    font-weight: 700;
}



/*** HERO SELECT ***/
#directories .hero-select .row,
#getInvolved .hero-select .row {
    min-height: 90vh;
}

#getInvolved .hero-select .font-script {
    margin-bottom: 3rem;
}

.hero-select .row {
    min-height: 65vh;
}

.hero-select h1.font-script {
    margin-bottom: -2rem;
}

.hero-select .hero-heading p {
    /* ACF WYSIWYG auto generates a <p> tag on the content. this is to overwrite the styles */
    color: #fff;
    letter-spacing: 0.18em;
    text-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
    line-height: 1em;
    font-weight: 600;
    text-align: center;
}

.hero-select-nav {
    background-color: rgba(34, 42, 69, 0.75);
    width: 85%;
    display: block;
    margin: auto;
}

.hero-select-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}

.hero-select-nav li,
.hero-select-nav li p {
    line-height: 1.2em;
    color: #fff;
    letter-spacing: 0.01em;
    font-size: 0.9375em;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
}


/*** CO GOP Officers Custom Post Type Partial Block ***/
.cogop_officers .img-container {
    width: 100%;
    max-width: 70px;
}


.cogop_officers .img-container img {
    height: 70px;
    width: 70px;
    border-radius: 50%;
    display: block;
    margin: auto;
    object-fit: cover;
    object-position: center;
}

.cogop_officers .txt-container {
    font-weight: bold;
    letter-spacing: 0.01em;
    margin-bottom: 5px;
}


/*** CO GOP Staff & CO GOP Officials Custom Post Type Partial Block ***/

.cogop_staff .img-container {
    width: 100%;
    max-width: 234px;
}


.cogop_staff .img-container img,
.cogop_officials .img-container img {
    border-radius: 50%;
    display: block;
    margin: auto;
    object-fit: cover;
    object-position: center;
}

.cogop_staff .img-container img {
    height: 234px;
    width: 234px;
}


/*** CO GOP Officials [FEDERAL, STATEWIDE, AND 
STATE LEGISLATIVE OFFICIALS] Custom Post Type Partial Block ***/


.cogop_officials .img-container img {
    height: 157px;
    width: 157px;
}

.cogop_officials .bio-card {
    min-height: 157px;
}

/*** PARTY PLATFORM & BYLAWS LAYOUT ***/

.platform-bylaws {
    position: relative;
}


.platform-bylaws .content {
    padding: 6rem 8rem 0;
}


.yellow-line {
    height: 6px;
    width: 100%;
    max-width: 130px;
}


.platform-bylaws .left {
    background-color: var(--navyBlue);
}

.platform-bylaws .right {
    background-color: var(--red);
}

.platform-bylaws .body p {
    color: #fff;
}


.platform-bylaws .file-link a {
    color: var(--yellow);
    font-weight: 600;
}

.platform-bylaws .file-link a:hover {
    transform: scale(1.1);
    font-size: .9em;
    transition: 0.25s all;
}



.platform-bylaws .img-animation {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.platform-bylaws .img-animation img {
    width: 85%;
    display: block;
    margin: auto;
}

/*** Statewide Clubs Custom Post Type Block ***/
.statewide-clubs .club-card-footer a {
    font-size: .75em;
}


/*** Training Programs Custom Post Type Block ***/

.extra-trainings .extra-training-card-content {
    font-size: 0.9375em;
}


.extra-trainings .extra-training-card-footer p {
    font-weight: normal;
    font-size: 0.75em;
    letter-spacing: 0.01em;
    line-height: 19px;
    color: #696969;
}




/* 3d. Forms */
input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: var(--gray);
}

input::-moz-placeholder {
    /* Firefox 19+ */
    color: var(--gray);
}

input:-ms-input-placeholder {
    /* IE 10+ */
    color: var(--gray);
}

input:-moz-placeholder {
    /* Firefox 18- */
    color: var(--gray);
}

.form-header {
    letter-spacing: 0.18em;
    line-height: 34px;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.84);

}

.gform_body .ginput_container input,
.gform_body .ginput_container select,
.gform_body .ginput_container textarea {
    width: 266px;
    height: 40px;
    border-radius: 11px;
    background: rgba(34, 42, 69, 0.9);
    border: 1px solid #fff;
    color: #fff;
}

.gform_body .ginput_container input::placeholder,
textarea::placeholder {
    color: #fff;
    text-transform: uppercase;
    text-align: center;
}

.gform_confirmation_message {
    color: #fff;
    text-align: center;
    text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.84);
    margin: 3rem auto;
}

.gform_footer .gform_button {
    display: block;
    margin: auto;
    padding: 10px 30px;
    text-align: center;
    background: var(--red);
}

.gform_confirmation_wrapper {
    min-height: 30vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(34, 42, 69, 0.9);
}

/*** ABOUT PAGE FORM — Contact Form ***/

.about-form {
    background: url('./assets/images/2_bg_denver.jpg') no-repeat top center;
    background-size: cover;
    padding: 3rem 8rem;
}

.about-form .form-container {
    background-color: rgba(34, 42, 69, 0.75);
    padding: 3rem 3rem .5rem;
    position: relative;
}

.about-form .form-container::before {
    content: url('./assets/svgs/icons/2_icon_yellow.svg');
    position: absolute;
    top: -1.5rem;
    left: 3rem;
}

.about-form .form-container p {
    /*Ensures WYSIWYG content's font-color is white*/
    color: #fff;
}


.about-form .form-container .gform_footer .gform_button {
    /*Overrides the default GForm Button Styling*/
    /* float: right; */
    /* margin-bottom: -6rem; */
}


/*** Begin — VOLUNTEER PAGE FORM — Volunteer Form ***/

#volunteer .gform_wrapper {
    background-color: var(--navyBlue);
    padding: 6rem 8rem 0;
    color: #fff;
    z-index: 3;
    margin-top: -5rem;
}

#volunteer .gform_body .ginput_container input {
    background-color: #0D1020;
}

/* BEGIN - "Yes, send me text alerts!" checkbox styling */

#volunteer .gform_body #field_2_8.gfield .ginput_container_checkbox #input_2_8 {
    display: flex;
    justify-content: flex-end;
    position: relative;
    left: -6rem !important;
}

.gform_wrapper.gravity-theme .gfield-choice-input+label {
    max-width: 100% !important;
}

/* END  - "Yes, send me text alerts!" checkbox styling */

#volunteer .gform_body .ginput_container_checkbox .gchoice input[type=checkbox].gfield-choice-input {
    /* Checkbox Layout & Spacing (set to Default) */
    width: auto !important;
}


#volunteer .gfield_checkbox div {
    /* Checkbox & Text positioning */
    position: relative;
    padding-left: 1.75rem;

}

#volunteer .gfield_checkbox div label:after {
    /* Checkbox Styles */
    content: "";
    background: #0D1020;
    width: 13.88px;
    height: 13.88px;
    display: block;
    position: absolute;
    left: 0;
    top: 5px;
    border: 1px solid #fff;
    border-radius: 3px;
    z-index: 0;
}


/* Checkbox — CHECKED styles */
#volunteer .gfield_checkbox div label:before {
    /* */
    content: "";
    display: block;
    position: absolute;
    width: 6px;
    height: 15px;
    border: solid #fff;
    border-width: 0 3px 3px 0;
    left: 7px;
    top: 0;
    transform: rotate(45deg);
    opacity: 0;
    z-index: 1;
    transition: all 100ms;
}


#volunteer input[type="checkbox"] {
    opacity: 0;
    outline: none;
    z-index: 100;
    width: 13.88px;
    height: 13.88px;
    top: 0;
    left: 0;
    position: absolute;
    appearance: none;
    cursor: pointer;
}

#volunteer input[type="checkbox"]+label {
    cursor: pointer;
}

#volunteer input[type="checkbox"]:checked+label:before {
    opacity: 1;
}


#volunteer .gform_footer .gform_button {
    /*Overrides the default GForm Button Styling*/
    margin-bottom: -2.5rem;
}

/*** End — VOLUNTEER PAGE FORM — Volunteer Form ***/



/************************* BEGIN CTF TWEETS **************************/

.social-feed-wrapper {
    background-color: #222A45;
}

.ctf-verified img {
    width: .65em;
    height: .65em;
}

#ctf .ctf-header-text,
#ctf .ctf-header-img {
    display: none;
}

.ctf-header-text {
    width: fit-content;
    display: block;
    margin: auto;
    padding-bottom: .75rem;
    border-bottom: 4px solid #ab3e3f;
}

.follow-info ul {
    width: 70%;
    padding: 0;
    margin: 0 auto;
    list-style: none;
    text-align: center;
    display: flex;
    justify-content: space-between;
    font-size: 0.9375em;
    color: #fff;
    letter-spacing: 0.01em;
    line-height: 19px;
}


.follow-info li span {
    color: #DBB537;
    font-weight: 700;
}

#ctf .slick-slider {
    margin: 20px auto;
    padding: 3rem 6rem;
}

#ctf .ctf {
    background-color: transparent;

}


#ctf .slick-track {
    display: flex !important;
    align-items: center !important;
}

/* BEGIN - HEADER SECTION */

#ctf .ctf-no-bio {
    display: none;
}

/* END - HEADER SECTION */

/* BEGIN - BODY SECTION */
.ctf-tweets .ctf-item>div {
    background-color: #fff;

}

#ctf .ctf-tweets {
    margin-top: 2rem;
    max-height: 400px !important;
    width: 100% !important;
    overflow-y: hidden !important;
}

#ctf .ctf-item {
    overflow-y: auto !important;
    background-color: #fff;
    position: relative;
}

#ctf .ctf-author-box {
    margin-top: 1rem;
    margin-left: 1.5rem;
}

#ctf .ctf-context {
    width: 100%;
    padding: 0 .5rem;
    margin-bottom: 2px;
    display: block;
    margin: auto !important;
}

#ctf .ctf-tweet-content {
    margin-left: 0;
    margin-top: 3px;
    padding: 0 2rem 2rem !important;
}

#ctf .ctf-quoted-tweet {
    display: block;
    margin: 3rem .5rem !important;
    padding: 8px 12px;
}

/* END - BODY SECTION */

/* BEGIN - FOOTER SECTION */
#ctf .ctf-tweet-actions {
    margin-left: 15px;
    margin-top: 3px;
    max-width: 100%;
}

/* END - FOOTER SECTION */

/*** Begin - Scale Effect **/

#ctf .ctf-item {
    margin: 0 -2.5rem;
    width: 100%;
    height: 200px;
    transition: all .6s ease-in-out;
}

.ctf-tweets .slick-center {
    height: 300px !important;
    z-index: 1;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22);
}

.ctf-tweets .slick-slide>div {
    transform: scale(.7);
    transition: transform .3s cubic-bezier(.4, 0, .2, 1);
    overflow: hidden;
}

.ctf-tweets .slick-center>div {
    position: relative;
    transform: scale(1);
    z-index: 2;
    margin: 0 -6rem;
    cursor: pointer;

}

/*** End- Scale Effect **/

/*** Begin - Slider Arrows Styles ***/
.ctf-tweets .slick-prev:before {
    content: url('./assets/svgs/arrows/arrow_left.svg');
}

.ctf-tweets .slick-next:before {
    content: url('./assets/svgs/arrows/arrow_right.svg');
}

.ctf-tweets .slick-prev {
    left: 20px;
    z-index: 9999;
}

.ctf-tweets .slick-next {
    right: 20px;
    z-index: 9999;
}

/*** End  - Slider Arrows Styles ***/



.ctf-tweets .slick-center div p {
    display: block;
}


/* HIDDEN */

#ctf .ctf-more,
#ctf .ctf-corner-logo,
#ctf .ctf-header .ctf-header-follow {
    display: none !important;
}

#ctf .ctf-tweet-text-media-wrap {
    /* Temporarily Disabled 
    — Needs to purchase the Pro plugin version to show media uploads */
    display: none;
}




/************************* END CTF TWEETS **************************/





/* 3d. Posts / Custom Post Types */

.entry-header .entry-title a {
    color: var(--red) !important;
    font-weight: bold;
    /* font-size: 27px; */
    letter-spacing: 0.01em;
    /* line-height: 34px; */
}


/* ------------------------------ 
    3. End Main Content
------------------------------ */