 /*
Theme Name: VOICES Style
Author: Sean Dudley
Author URI: http://www.voicesofsept11.org
Description: This theme is a design based on the styles provided by Voices of September 11th.
Tags: 9/11, World Trade Center, Voices of September 11th, VOICES, 9/11 Living Memorial, Mary Fetchet, WTC
*/


/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  -----------      Headings and Text     ------------ */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_h0 {
  font-family: Arial,Helvetica,sans-serif;  
  font-size: 20pt;
  line-height:23pt; 
  color: #003777;
  font-weight:bold;
  padding-bottom:3px;
}
.voices_h1 {
  font-family: Arial,Helvetica,sans-serif;  
  font-size: 17pt;
  line-height:20pt; 
  color: #003777;
  font-weight:bold;
  padding-bottom:3px;
}
.voices_h2 {
  font-family: Arial,Helvetica,sans-serif;
  color: #646464; 
  font-size: 15pt;
  line-height:18pt;
  font-weight:bold;
}
.voices_h3 {
  font-family: Arial,Helvetica,sans-serif; 
  color: #003777;  
  font-size: 13pt;
  line-height:16pt;
  font-weight:bold;
}
.voices_h4 { 
  font-family: Arial,Helvetica,sans-serif; 
  color: #646464; 
  font-size: 13pt;
  line-height:16pt;
  font-weight:bold;
}
.voices_h5 { 
  font-family: Arial,Helvetica,sans-serif; 
  color: #003777; 
  font-size: 11pt;
  line-height:14pt;
  font-weight:bold;
}
.voices_h6 { 
  font-family: Arial,Helvetica,sans-serif; 
  color: #646464; 
  font-size: 11pt;
  line-height:14pt;
  font-weight:bold;
}
.voices_h0_ul {
  font-family: Arial,Helvetica,sans-serif; 
  color: #003777;  
  font-size: 16pt;
  line-height:19pt;
  font-weight:bold;
  padding-bottom:3px;
  border-bottom:#003777 2px solid;
}
.voices_h1_ul {
  font-family: Arial,Helvetica,sans-serif; 
  color: #003777;  
  font-size: 13pt;
  line-height:16pt;
  font-weight:bold;
  padding-bottom:3px;
  border-bottom:#003777 1px solid;
}
.voices_h2_ul {
  font-family: Arial,Helvetica,sans-serif; 
  color: #646464; 
  font-size: 13pt;
  line-height:16pt;
  font-weight:bold;
  padding-bottom:3px;
  border-bottom:#003777 1px solid;
}
.voices_text { 
  font-family: Arial,Helvetica,sans-serif;
  color: #646464; 
  font-size: 11pt;
  line-height:13pt;
} 
.voices_subtext { 
  font-family: Arial,Helvetica,sans-serif;
  color: #646464; 
  font-size: 9pt;
  line-height:11pt;
}
.voices_text_bold { 
  font-family: Arial,Helvetica,sans-serif;
  color: #646464; 
  font-size: 11pt;
  font-weight:bold;
  line-height:13pt;
} 
.voices_caption { 
  font-family: Arial,Helvetica,sans-serif;
  color: #646464; 
  font-size: 8pt;
  line-height:10pt;
}
.voices_url {
  text-decoration:none;
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url:hover {
  text-decoration:none; 
  color:#026bb0;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url:active {
  text-decoration:none; 
  color:#026bb0;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.vos_url {
  text-decoration:none;
  color:#026bb0;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.vos_url:hover {
  text-decoration:none; 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.vos_url:active {
  text-decoration:none; 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_bold {
  text-decoration:none; 
  color:#026bb0;
  font-weight:bold;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_bold:hover {
  text-decoration:none; 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_bold:active {
  text-decoration:none; 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_spacer { 
  font-size:8px;
  line-height:8px;
}
.voices_spacer_sm { 
  font-size:5px;
  line-height:5px;
}
.voices_url_h1 {
  color:#003777;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_h1:hover {
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_h1:active { 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_url_h2 {
  color:#003777;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear; 
  text-decoration: none;
}
.voices_url_h2:hover {
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear; 
  text-decoration: none;
}
.voices_url_h2:active { 
  color:#00adef;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear; 
  text-decoration: none;
}

.voices_header {
  text-align: left; 
  font-family: Arial,Helvetica,sans-serif;  
  font-size: 16pt;
  line-height:20pt; 
  color: #ffffff;
  border:#003777 1px solid;
  background-color: #1b75bb;
  font-weight:bold;
  padding-left:15px;
  padding-right:5px;
  padding-top:5px;
  padding-bottom:5px;
}
.voices_quote_lg { 
  font-family: Arial,Helvetica,sans-serif; 
  color: #646464; 
  font-size: 14pt;
  line-height:17pt;
  font-style: italic;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------        Buttons        -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_btn {
  font-family: Arial,Helvetica,sans-serif;
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
  text-align:center;
  text-decoration: none;
  background: #0066b3;
  border: solid #033b66 2px;
  padding: 10px 20px 10px 20px;
  border-radius: 15px;
  -webkit-border-radius: 15;
  -moz-border-radius: 15;
  padding: 10px 20px 10px 20px;
  width: inherit;
  height: inherit;
  box-sizing: inherit;
  display: inline-block;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  text-decoration: none;
}

.voices_btn:hover {
  background: #5aa1e3; 
  color: #ffffff;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  text-decoration: none;
}
.voices_btn_sm {
  font-family: Arial,Helvetica,sans-serif;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  text-align:center;
  text-decoration: none;
  background: #0066b3;
  border: solid #033b66 1px;
  padding: 5px 10px 5px 10px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  padding: 5px 10px 5px 10px;
  width: inherit;
  height: inherit;
  box-sizing: inherit;
  display: inline-block;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  text-decoration: none;
}

.voices_btn_sm:hover {
  background: #5aa1e3; 
  color: #ffffff;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  text-decoration: none;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  ------------    Image Hover Effects    ------------ */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_image_darken_bg {
  background-color:#000000;
  display:inline-block;
}
a.voices_image_darken img {
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
a.voices_image_darken:hover img {
  opacity: 0.5;
}
a.voices_image_darken:hover { 
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_image_grow_container {
  width:247px; 
  height:100px; 
  overflow:hidden;
}
.voices_image_grow img {
  width: 247px;
  height: 100px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.voices_image_grow img:hover {
  width: 296px;
  height: 120px;
}
.voices_image_grow_gallery_container {
  width:200px; 
  height:150px; 
  border:#003777 1px solid; 
  overflow:hidden;
}
.voices_image_grow_gallery img {
  width:200px;
  height:150px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.voices_image_grow_gallery img:hover {
  width: 250px;
  height: 188px;
}
.voices_image_tilt img {
  -webkit-transition: all 0.7s ease;
  -moz-transition: all 0.7s ease;
  -o-transition: all 0.7s ease;
  -ms-transition: all 0.7s ease;
  transition: all 0.7s ease;
}
.voices_image_tilt img:hover {
  -webkit-transform: rotate(15deg);
  -moz-transform: rotate(15deg);
  -o-transform: rotate(15deg);
  -ms-transform: rotate(15deg);
  transform: rotate(15deg);
}
.voices_image_blur img {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.voices_image_blur img:hover {
  -webkit-filter: blur(5px);
}
.voices_image_bw img {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.voices_image_bw img:hover {
  -webkit-filter: grayscale(100%);
}
.voices_image_brighten_bg {
  background-color:#ffffff;
  display:inline-block;
}
a.voices_image_brighten img {
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
a.voices_image_brighten:hover img {
  opacity: 0.5;
}
a.voices_image_brighten:hover { 
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.voices_image_sepia img {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.voices_image_sepia img:hover {
  -webkit-filter: sepia(100%);
  filter: sepia(100%);
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------        Tables         -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
.voices_column_left {
  float:left; 
  width:50%;
}
.voices_column_right {
  float:right; 
  width:50%;
}
.voices_3column_container {
  display:inline-block; 
  width:100%; 
  background-color:#f2f2f2;
  border: #646464 1px solid;
  padding:10px;
}
.voices_3column_left {
  float:left; 
  width:33%;
}
.voices_3column_right {
  float:right; 
  width:33%;
}
.voices_3column_center {
  margin:0 auto;
  width:34%;
}
.voices_column_container {
height: 110px; 
margin-bottom:20px;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------         Boxes         -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_box {
float: left;
margin-right: 15px;
margin-bottom: 15px;
overflow:hidden;
border: 1px solid #464546;
min-width: 120px;
}
.voices_box_noborder {
float: left;
margin-right: 15px;
margin-bottom: 15px;
overflow:hidden;
min-width: 120px;
}
.voices_box_container {
width: 100%;
display: flex;
display: inline-block;
height: inherit;
background-color:#f9f9f9;
padding-left:15px;
padding-right:15px;
padding-top:15px;
border: 1px solid #e0e0e0;
margin-bottom:15px;
}
.voices_box_container_2 {
width: 100%;
display: flex;
display: inline-block;
height: inherit;
background-color:#feffff;
padding-left:15px;
padding-right:15px;
padding-top:15px;
border: 1px solid #e0e0e0;
margin-bottom:15px;
}
.voices_box_container_3 {
width: 100%;
display: flex;
display: inline-block;
height: inherit;
background-color:#ffffff;
padding-left:15px;
padding-right:15px;
padding-top:15px;
margin-bottom:15px;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------         Boxes         -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_imgbox {
float: left;
height: 125px;
margin-right: 15px;
overflow:hidden;
border: 1px solid #464546;
}
.voices_imgbox_container {
min-height:160px;
width: 100%;
background-color:#f9f9f9;
padding:15px;
border: 1px solid #1b75bb;
margin-bottom:15px;
padding-bottom:15px;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------        Slider         -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */


.radio {
  /*display: none;*/
}
.voices_slider_images {
  overflow: hidden;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
}
.voices_slider_images-inner {
  width: 500%;
  transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
  transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
.voices_slider_image-slide {
  width: 20%;
  float: left;
  padding-left: 20px;
  padding-top: 20px;
}
.voices_slider_image-slide,
.fake-radio,
.radio-btn {
  transition: all 0.5s ease-out;
}
.fake-radio {
  float: right;
}




/* Move slides overflowed container */
#slide1:checked ~ .voices_slider_images .voices_slider_images-inner {
  margin-left: 0;
}
#slide2:checked ~ .voices_slider_images .voices_slider_images-inner {
  margin-left: -100%;
}
#slide3:checked ~ .voices_slider_images .voices_slider_images-inner {
  margin-left: -200%;
}




/* Color of bullets */
#slide1:checked ~ div .fake-radio .radio-btn:nth-child(1),
#slide2:checked ~ div .fake-radio .radio-btn:nth-child(2),
#slide3:checked ~ div .fake-radio .radio-btn:nth-child(3) {
  background: white;
}
.radio-btn {
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background: white;
  display: inline-block !important;
  margin: 0 1px;
  cursor: pointer;
}
/* Color of bullets - END */




/* Text of slides */
#slide1:checked ~ .labels .label:nth-child(1),
#slide2:checked ~ .labels .label:nth-child(2),
#slide3:checked ~ .labels .label:nth-child(3) {
  opacity: 1;
}

.label {
  opacity: 0;
  position: absolute;
}
/* Text of slides - END */



/* Calculate AUTOPLAY for BULLETS */
@keyframes bullet {
  0%, 33.32333333333334%	{
    background: red;
  }
  33.333333333333336%, 100% {
    background: gray;
  }
}


#play1:checked ~ div .fake-radio .radio-btn:nth-child(1) {
  animation: bullet 24300ms infinite -1000ms;
}

#play1:checked ~ div .fake-radio .radio-btn:nth-child(2) {
  animation: bullet 24300ms infinite 3100ms;	
}

#play1:checked ~ div .fake-radio .radio-btn:nth-child(3) {
  animation: bullet 24300ms infinite 7200ms;	
}
/* Calculate AUTOPLAY for BULLETS - END */




/* Calculate AUTOPLAY for SLIDES */
@keyframes slide {
  0%, 25.203252032520325%	{ margin-left: 0; }
  33.333333333333336%, 58.53658536585366%	{ margin-left: -100%; }
  66.66666666666667%, 91.869918699187%	{ margin-left: -200%; }
}


.voices_slider_st > #play1:checked ~ .voices_slider_images .voices_slider_images-inner {
  animation: slide 24300ms infinite;	
}
/* Calculate AUTOPLAY for SLIDES - END */





/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------         Boxes         -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.voices_calloutbox {
min-height:120px;
width: 95%;
background-color:#f9f9f9;
padding:15px;
border: 4px solid #1b75bb;
margin:15px;
padding-bottom:15px;
}





/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  ------------      New Site Fonts       ------------ */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

.vos_subtitle {
color: #026BB0;
font-size: 28px;
line-height: 29px;
font-family: "Poppins", sans-serif;
}

.vos_subtitle_2 {
color: #026BB0;
font-size: 23px;
line-height: 24px;
font-family: "Poppins", sans-serif;
}

.vos_subtitle_3 {
color: #026BB0;
font-size: 19px;
line-height: 20px;
font-family: "Poppins", sans-serif;
}

.vos_subtitle_4 {
font-size: 19px;
line-height: 20px;
font-family: "Poppins", sans-serif;
}

.vos_h1 {
color: #026BB0;
font-size: 28px;
line-height: 33px;
font-family: "Poppins", sans-serif;
}

.vos_h2 {
color: #026BB0;
font-size: 23px;
line-height: 25px;
font-family: "Poppins", sans-serif;
}

.vos_h3 {
color: #026BB0;
font-size: 19px;
line-height: 21px;
font-family: "Poppins", sans-serif;
}

.vos_h4 {
color: #026BB0;
font-size: 16px;
line-height: 18px;
font-family: "Poppins", sans-serif;
}

.vos_h5 {
font-size: 16px;
line-height: 18px;
font-family: "Poppins", sans-serif;
}

.vos_caption {
font-size: 14px; 
line-height: 1.2; 
margin-top: 5px;
}

.vos_img_right { 
float: right;
padding-left: 3%; 
padding-bottom: 15px;
margin-top: 8px;
width: 35%; 
min-width: 200px;
}

.vos_img_left { 
float: left;
padding-right: 3%; 
padding-bottom: 15px; 
margin-top: 8px;
width: 35%; 
min-width: 200px;
}

.vos_row:after {
content: "";
display: table;
clear: both;
}

.vos_column { 
float: left;
width: 50%;
padding: 10px;
}

.vos_3column { 
float: left;
width: 33.33%;
padding: 10px;
}

@media screen and (max-width: 600px) {
.vos_column {
width: 100%;
}

@media screen and (max-width: 600px) {
.vos_3column {
width: 100%;
}

.vos_img {
min-width: 200px;
}




/*  --------------------------------------------------- */
/*  --------------------------------------------------- */
/*  --------------          Fixes        -------------- */
/*  --------------------------------------------------- */
/*  --------------------------------------------------- */

body.voices .imagelink {
  outline-color: blue;
  outline-style: solid;
  outline-width: medium; }

body.voices .qfix table {
  border: none 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px; }

body.voices .qfix tbody {
  border: none 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px; }

body.voices .qfix img {
  border: none; }

body.voices .qfix ul {
  padding-left:15px; }

body.voices .qfix li {
  padding-left:15px;
  padding-bottom:2px; }
  


.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
     
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} 

</style>

