/*
Theme Name: Letters
Author: Insight Designs
License: GNU General Public License v2 or later
*/



/*#############################################  
#############################################  FONTS
#############################################*/  

@font-face {
  font-family: "Gotham Black";
  src: url(../fonts/GothamPro-Black.woff) format("woff"); }

@font-face {
  font-family: "Gotham Black Italic";
  src: url(../fonts/GothamPro-BlackItalic.woff) format("woff"); }

@font-face {
  font-family: "Gotham Bold";
  src: url(../fonts/GothamPro-Bold.woff) format("woff"); }

@font-face {
  font-family: "Gotham Bold Italic";
  src: url(../fonts/GothamPro-BoldItalic.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Medium";
  src: url(../fonts/GothamPro-Medium.woff) format("woff"), url(../fonts/GothamPro-Medium.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Medium Italic";
  src: url(../fonts/GothamPro-MediumItalic.woff) format("woff"), url(../fonts/GothamPro-MediumItalic.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Regular";
  src: url(../fonts/GothamPro.woff) format("woff"), url(../fonts/GothamPro.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Regular Italic";
  src: url(../fonts/GothamPro-Italic.woff) format("woff"), url(../fonts/GothamPro-Italic.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Light";
  src: url(../fonts/GothamPro-Light.woff) format("woff"), url(../fonts/GothamPro-Light.woff2) format("woff2"); }

@font-face {
  font-family: "Gotham Light Italic";
  src: url(../fonts/GothamPro-LightItalic.woff) format("woff"), url(../fonts/GothamPro-LightItalic.woff) format("woff"); }




/************************************************** GENERAL STYLES */

body{
  font-family: "Gotham Light"!important;
}

body .wpb_button,
body .wpb_content_element,
body ul.wpb_thumbnails-fluid>li{
	margin-bottom: 0;
}

.gotham-med{
	font-family: "Gotham Medium"!important;
}

.gotham-reg{
	font-family: "Gotham Regular"!important;
}

body .title_hero{
	font-family: "Gotham Light"!important; 
}

body .title_hero b{
	font-family: "Gotham Black"!important; 
}

body #letter_grid_section,
body #roster_section h3{
    font-size: 56px;
	color: #ffffff;
	text-align: center;
}

body #letter_grid_section {
    background-size: 115%;
}

body #letter_grid_section .vc_general.vc_cta3.vc_cta3-shape-rounded {
    border-radius: 50px;
    background: rgba(0,0,0,.0);
    border: none;
    text-align: center;
    padding-bottom: 0px;
}

body #letter_grid_section  .vc_general.vc_cta3.vc_cta3-actions-right .vc_cta3-actions{
	display: inline-table;
}

body #letter_grid_section .vc_btn3.vc_btn3-size-md,
body #letter_grid_section .vc_btn3.vc_btn3-size-lg{
	background: #ffffff;
	border-radius: 60px;
	border: 2px solid #ffffff;
  font-family: "Gotham Medium";
  font-size: 60px;
  text-transform: uppercase;
  padding: 40px 60px;
  color: #000000;
}

body #letter_grid_section .vc_btn3.vc_btn3-size-lg i {
    font-size: 60px;
    line-height: 1;
}

body #letter_grid_section .vc_btn3.vc_btn3-size-md:hover,
body #letter_grid_section .vc_btn3.vc_btn3-size-lg:hover{
	background: #000000;
	border-radius: 60px;
	border: 2px solid #ffffff;
  font-family: "Gotham Medium";
  font-size: 60px;
  text-transform: uppercase;
  padding:  40px 60px;
  color: #ffffff;
}

body #letter_grid_section .vc_btn3.vc_btn3-size-md,
body #letter_grid_section .vc_btn3.vc_btn3-size-md:hover{
	font-size: 34px;
}

body #letter_grid_section .vc_btn3.vc_btn3-size-md i {
    font-size: 34px;
    line-height: 1;
}

body .vc_btn3.vc_btn3-size-lg .vc_btn3-icon {
    line-height: 46px;
}


/************************************************** LIST VIEW STYLES */

body #letter_grid_section h1 {
    font-size: 56px;
    line-height: 1.1em;
}

body .letter_grid_container {
    max-width: 1920px;
    min-height: 2628px;
}

body .letter_grid_container h2 {
    font-size: 32px;
    line-height: 1em;
    position: absolute;
    bottom: 30px;
    width: 100%;
    background: rgba(0,0,0,.8);
    padding: 10px 5px;
    border-radius: 0 0 19px 19px;
    box-shadow: 0px -1px 8px rgba(0,0,0,.5);
    color: #ffffff;
}

body .letter_grid_container h2 a{
	color: #ffffff;
	text-decoration: none;
}

body .letter_list_view {
    height: 408px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 20px;
    box-shadow: 0 0 12px #000000;
}

body .wpb_text_column.wpb_content_element.page-counter {
    padding-top: 8px;
    font-size: 60px;
	font-family: "Gotham Black";
}

body #letter_grid_section .page-counter span.gray-text {
    color: #999999;
	font-family: "Gotham Light";
}


body #letter_grid_section .pagination-inactive .vc_btn3.vc_btn3-size-md, body #letter_grid_section .pagination-inactive .vc_btn3.vc_btn3-size-md:hover {
    opacity: .3;
    background: #ffffff;
    color: #000000;
    cursor: default;
}



/************************************************** FILTER MODAL STYLES */

body #letter_filters_sidebar h2 {
    font-size: 3rem;
}

body #letter_filters_sidebar b {
    font-size: 62px;
}

body h3.letter_filters_section_title {
    font-size: 46px;
    text-transform: uppercase;
    font-family: 'Gotham Medium';
}

body #letter_filters_sidebar h2 {
    font-family: 'Gotham Black';
    text-transform: uppercase;
}

body #letter_filters_sidebar {
    background: rgb(30 30 30 / 97%);
    border: 2px solid #ffffff;
    border-radius: 40px 0 0 40px;
    border-right: none;
    box-shadow: 0 0 12px #000000;
    top: 8%;
}

body #letter_filter_close_tab {
    background: #ffffff;
    top: 16%;
    box-shadow: 0 0 8px #000000;
}

body #letter_filter_close_tab span{
	color: #000000;
	cursor: pointer;
	text-transform: uppercase;
    font-family: 'Gotham Medium';
}

body .letter_filters_count {
    padding: 8px 15px;
    background: #ffffff;
    width: max-content;
    border-radius: 20px;
    text-align: center;
    margin: 40px auto;
    color: #000000;
    font-family: 'Gotham Medium';
    text-transform: uppercase;
    border: 2px solid #fff
}

body .letter_filters_count:hover{
	background: #000000;
	color: #ffffff;
}

body span.letter_filter_item {
    opacity: .7;
    font-size: 48px;
    margin: 0 9px;
    padding: 10px 5px 5px
}

body span.letter_filter_item.active {
    opacity: 1;
    font-family: 'Gotham Regular';
    border: 4px solid white;
}

body #letter_filters_sidebar {
    height: auto;
}

body #letter_filters_sidebar hr {
    margin: 1em;
}

/************************************************** INDIVIDUAL ITEM MODAL STYLES */


body .custom_modal_content {
    background-color: rgba(0,0,0,.8);
    margin: auto;
    padding: 40px 20px;
    border: 2px solid #fff;
    width: 87%;
    border-radius: 50px;
    box-shadow: 0 0 8px #000000;
    margin-bottom: 30px;
}

body span.custom_modal_close {
    font-size: 80px;
    background: #ffffff;
    padding: 5px 20px 6px 20px;
    margin-bottom: 40px;
    margin-right: 20px;
    border-radius: 20px;
    color: #000000;
    line-height: 1em;
    font-family: 'Gotham Black';
}

body .letter_wrapper {
    clear: both;
}


body .letter_slide img {
    margin-bottom: 20px!important;
    padding: 0 60px;
}

body .letter_wrapper {
    font-size: 44px;
    line-height: 1.2em;
}

body .custom_modal {
    padding-bottom: 40px;
}

body .letter_grid_container .letter_wrapper h2 {
    font-size: 48px;
    line-height: 1em;
    position: relative;
    bottom: inherit;
    width: 100%;
    background: transparent;
    padding: 0px 0px 15px 0px;
    border-radius: 0;
    box-shadow: none;
    font-family: 'Gotham Medium';
}

body .pagination-numbers.wpb_column.vc_column_container.vc_col-sm-1\/5 {
    width: 14%;
}


body .prev-next-button-container.wpb_column.vc_column_container.vc_col-sm-1\/5{
	width: 23%;
}



/************************************************** ROSTER STYLES */


body #roster_section .hg-theme-default .hg-button {
    padding: 60px;
    background: #ffffff;
    margin: 6px 11px;
    border-radius: 20px;
    font-size: 60px;
    text-transform: capitalize;
}

body #soldierTable_filter {
    position: absolute;
    width: 100%;
    text-align: center;
    margin-left: -40px;
    top: -240px;
}

body #soldierTable_filter label {
    background: white;
    padding: 40px;
    border-radius: 40px;
}

body section#roster_section {
    background: #000;
	padding-top:0px;
}

body .simple-keyboard.hg-theme-default.hg-layout-default {
    background: #000;
    padding: 0 30px;
    font-family: 'Gotham Bold';
    max-width: 1600px;
    margin: 30px auto;
}

body #roster_section div#soldierTable_wrapper {
    background: #fff;
    margin-top: 300px;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 40px;
}

body #roster_section .container.soldier_table_container {
    padding-left: 0px;
    padding-right: 0px;
    max-width: 1920px;
    font-size: 40px;
}


body #roster_section .dataTables_wrapper .dataTables_paginate .paginate_button.current, body #roster_section .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border-radius: 50%;
    background: #000000;
}

body #roster_section .dataTables_wrapper .dataTables_info {
    width: 100%;
    text-align: center;
    float: none;
}

body #roster_section .dataTables_wrapper .dataTables_info .clear-roster-search {
    margin-left: 30px;
    padding: .5em 1em;
    background: black;
    color: white;
    border-radius: 1em;
    text-decoration: none;
}

body #roster_section .dataTables_wrapper .dataTables_paginate {
    width: 100%;
    text-align: center;
    float: none;
    margin-top: 40px;
}

body #roster_section .dataTables_wrapper .dataTables_length,
body #roster_section .dataTables_wrapper .dataTables_filter,
body #roster_section .dataTables_wrapper .dataTables_info,
body #roster_section .dataTables_wrapper .dataTables_processing,
body #roster_section .dataTables_wrapper .dataTables_paginate {
    color: #333;
    font-family: 'Gotham Medium';
}

body #roster_section .dataTables_wrapper .dataTables_paginate a.paginate_button.current{
	color: #ffffff!important;
}

body #roster_section table#soldierTable {
    font-family: 'Gotham Medium';
}

body #roster_section tr.soldier_table_header_row {
    font-family: 'Gotham Regular';
    font-size: 28px;
    text-transform: uppercase;
    background: #454545;
	margin-top: 20px;
    color: #ffffff;
}

body #roster_section table.dataTable tbody tr.even {
    background-color: #f3f3f3;
}

body #roster_section .dataTables_wrapper .dataTables_filter input {
    margin-left: 10px;
    border: none;
    border-bottom: 1px solid #aaa;
    font-size: 56px;
}

body #roster_section .dataTables_wrapper .dataTables_filter input:focus {
    outline: none;
}

body #roster_section .dataTables_wrapper .dataTables_length select {
    border-radius: 20px;
    padding: 10px 5px;
    text-align: center;
    margin: 0 5px;
}

#video-credit {
    color: white;
    position: absolute;
    right: 100px;
    font-size: 40px;
    bottom: 60px;
}