/*
Theme Name: MOB
Theme URI: https://obajesoft.com.ng/wp/themes/MOB/
Author: Prince Abdulrahman Obaje, ObajeSoft Inc
Author URI: https://obajesoft.com.ng
Description: MOB is a clean and minimal WordPress blog theme with premium look and feel well suited for food, fashion, travel, lifestyle, sports and any other awesome blogs. This theme features WooCommerce integration that allows you to create fully functional eCommerce website side by side with your blog. This theme has several customization options that are available WordPress Theme Customizer. Theme is also multilingual ready and translated in several languages. This awesome blog theme is also SEO friendly helping you to achieve the highest positions on Google. Activello is the only WordPress blog theme you will ever need.
Version: 1.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
  scroll-behavior: smooth;
  --global--color--primary-fore: rgb(248, 248, 248);
  --global--color--secondary-fore: rgb(236, 144, 144);
  --global--color--primary: rgb(216, 46, 31); /* #7B0323 */
  --global--color--secondary: rgb(242, 121, 99);
  --global--color--secondary-bg: rgb(239, 187, 177);
  --global--color--tertiary-bg: rgb(216,46,31);
}

@font-face {
  font-family: "roboto";
  src: url('assets/fonts/Roboto/Roboto-Thin.ttf');
}

@font-face {
  font-family: "roboto-black";
  src: url('assets/fonts/Roboto/Roboto-Black.ttf');
}

@font-face {
  font-family: "roboto-medium";
  src: url('assets/fonts/Roboto/Roboto-Medium.ttf');
}


@font-face {
  font-family: "lato-regular";
  src: url('assets/fonts/Lato/Lato-Regular.ttf');
}

@font-face {
  font-family: "DMSans_18pt-Light";
  src: url('assets/fonts/DM_Sans/static/DMSans_18pt-Light.ttf');
}

@font-face {
  font-family: "EB_Garamond_Regular_400";
  src: url('assets/fonts/EB_Garamond/static/EBGaramond-Regular.ttf');
  font-weight: 400;
  
}

/* @font-face{
  font-family: "Atlas Grotesk Web Regular Regular";
  src: url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.eot");
  src: url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.eot?#iefix")format("embedded-opentype"),
      url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.woff")format("woff"),
      url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.woff2")format("woff2"),
      url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.ttf")format("truetype"),
      url("assets/fonts/Atlas_Grotesk/0a5fbb91dc4a457f5945dca11d44517d.svg#Atlas Grotesk Web Regular Regular")format("svg");
  font-weight:normal;
  font-style:normal;
  font-display:swap;
} */

.dm-sans-400 {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  /* font-weight: <weight>; */
  font-style: normal;
}

* {
  box-sizing: border-box
}

.main {
  padding: 16px;
  margin-top: 30px;
  height: 1500px; /* Used in this example to enable scrolling */
}

body {
  font-family:"lato-regular", sans-serif;
  font-optical-sizing: auto;
  background-color: #fffcf4;
  font-size: 17px;
  margin: 0;
}

#mainVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
}

.chest-bar {
  position: fixed;
  bottom: 0;
  background: rgb(114, 20, 20);
  opacity: 0.6;
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}

#myBtn {
  width: 200px;
  font-size: 18px;
  padding: 10px;
  border: none;
  background: var(--global--color--primary);
  color: #fff;
  cursor: pointer;
}

#myBtn:hover {
  background: #ddd;
  color: var(--global--color--primary);
  border: 1px solid var(--global--color--primary);
}

.content {
  margin: 0;
  padding: 0;
}

a{
  color: var(--global--color--primary);
  text-decoration: none !important;
}

a:hover{
  color: var(--global--color--secondary);
}

ol, ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
}

img{
  max-width: 100%;
}

/*Layout Styles Starts*/
.container{
  display: block;
  padding: 12px;
}

.row::after {
  content: "";
  clear: both;
  display: table;
}

  .col-s-8-33 {width: 8.33%;}
  .col-s-10 {width: 10%;}
  .col-s-16-66 {width: 16.66%;}
  .col-s-20 {width: 20%;}
  .col-s-25 {width: 25%;}
  .col-s-30 {width: 30%;}
  .col-s-33-33 {width: 33.33%;}
  .col-s-35 {width: 35%;}
  .col-s-41-66 {width: 41.66%;}
  .col-s-50 {width: 50%;}
  .col-s-58-33 {width: 58.33%;}
  .col-s-66-66 {width: 66.66%;}
  .col-s-70 {width: 70%;}
  .col-s-75 {width: 75%;}
  .col-s-80 {width: 80%;}
  .col-s-83-33 {width: 83.33%;}
  .col-s-91-66 {width: 91.66%;}
  .col-s-100 { width: 100%; }

  .col-s-8-33,
  .col-s-10,
  .col-s-16-66,
  .col-s-20,
  .col-s-25,
  .col-s-30,
  .col-s-33-33,
  .col-s-35,
  .col-s-41-66,
  .col-s-50,
  .col-s-58-33,
  .col-s-66-66,
  .col-s-70,
  .col-s-75,
  .col-s-80,
  .col-s-83-33,
  .col-s-91-66,
  .col-s-100 {
      float: left;
  }

  .padding-12 {
    padding: 12px;
}


/*------------------------------------------------------------------
  HEADER
-------------------------------------------------------------------*/
.senator-title{
  float: left;
  width: 500px;
  margin: auto;
  padding: 12px 0;
  text-align: center;
  align-items: center;
}

.senator-title-name{
  font-family: inherit;
  font-size: 22px;
  line-height: 80%;
  margin: 0;
  padding: 0;
}

.senator-title-designation{
  font-family: inherit;
  font-size: 18px;
  line-height: 90%;
  margin: 0;
  padding: 0;
}

.senator-title-federal{
  font-family:"EB_Garamond_Regular_400", sans-serif;
  font-size: 14px;
  line-height: 90%;
  margin: 0;
  padding: 0;
}

.senator-title-con{
  font-family:"EB_Garamond_Regular_400", sans-serif;
  font-size: 10px;
}

/* Navigation */
#navbar {
  overflow: hidden;
  background-color: var(--global--color--primary);
  color: #fff;
  z-index: 1000000;
  padding: 12px;
  box-shadow: 0 4px 8px 0 rgba(87, 2, 2, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* .navbar {
  padding: 12px;
  z-index: 1000000;
  overflow: hidden;
  background-color: var(--global--color--primary);
  font-family: "Atlas Grotesk Web Regular Regular", sans-serif;
  color: #fff;
} */

.site-nav a, 
.site-nav span{
  float: left;
}

.site-nav a,
.curtainNav a{
  padding: 6px 8px;
  font-size:16px;
  margin: auto;
  color: #fff;
}

/* curtain nav */
.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: var(--global--color--primary-fore);
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  left: 14px;
  width: 100%;
  margin-top: 30px;
}

.overlay a {
  float: none;
  padding: 8px;
  text-decoration: none;
  font-size: 16px;
  color: var(--global--color--primary);
  display: block;
  transition: 0.3s;
}

.overlay a:hover, 
.overlay a:focus {
  color: var(--global--color--primary);
}

.overlay .closecurtainbtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

/* The subnavigation menu */
.subnav {
  float: none;
  overflow: hidden;
}

/* Subnav button */
.subnav .subnavbtn {
  padding: 6px 8px;
  font-size:16px;
  color: var(--global--color--primary);
  border: none;
  outline: none;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

/* Add a red background color to navigation links on hover */
.navbar a:hover, 
.subnav:hover .subnavbtn {
  color: var(--global--color--primary);
  background-color: red;
}

/* Style the subnav content - positioned absolute */
.subnav-content {
  display: none;
  position: absolute;
  top: 0;
  left: 300px;
  background-color: inherit;
  height: 100%;
  z-index: 1;
}

/* Style the subnav links */
.subnav-content a {
  float: none;
  color: var(--global--color--primary);
  text-decoration: none;
}

/* Add a grey background color on hover */
.subnav-content a:hover {
  background-color: #eee;
  color: var(--global--color--primary);
}

/* When you move the mouse over the subnav container, open the subnav content */
.subnav:hover .subnav-content {
  display: block;
}

.web-intro{
  font-family: "EB_Garamond_Regular_400", sans-serif;
  font-size: 18px;
  line-height: 1.2rem;
}

.fadenav {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 10s;
  animation-name: subnavcontentanimate;
  animation-duration: 10s;
}

/*input starts here*/
.content input[type=text],
.content input[type=email],
.content input[type=tel],
.content input[type=url],
.content textarea,
.content input[type=button],
.content input[type=submit], 
.content input[type=reset],
.content button{
  padding: 8px 6px;
  display: block;
  width: 100%;
}

.content input[type=button],
.content input[type=submit], 
.content input[type=reset]{
  color: #ffffff;
  background-color: var(--global--color--primary);
  cursor: pointer;
  transition: background-color 0.4s ease-in-out;
}

.content input[type=button]:hover,
.content input[type=submit]:hover, 
.content input[type=reset]:hover{
  background-color: #ffffff;
  color: var(--global--color--primary);
}

.content input[type="text"]{
  padding: 8px 6px;
  margin: 8px 4px;
}

@-webkit-keyframes subnavcontentanimate {
  from {opacity: 1} 
  to {opacity: 0.4}
}

@keyframes subnavcontentanimate{
  from {opacity: 1} 
  to {opacity: 0.4}
}

@media screen and (max-height: 600px) {
  .overlay a {font-size: 20px}
  .overlay .closecurtainbtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}

@media screen and (max-width: 800px) {
  #main-nav{
    display: none;
  }

  .navbar-brand img{
    width: 80%;
    align-items: center;
  }

  .subnav-content {
    display: none;
    position: relative;
    top: 0;
    left: 0;
    text-align: center;
    background-color: inherit;
    height: 100%;
    z-index: 1;
  }

  .subnav:hover .subnav-content {
    display: block;
  }

  .subnavbtn{
    width: 100%;
    text-align: center;
  }
}
/*curtain nav ends */

.logo_box {
  padding: 0;
  margin: 0;
  text-align: center;
  align-items: center;
}

.logo_box img {
  width: 100%;
  height: auto;
  margin: auto;
  padding: 0;
  text-align: center;
  align-items: center;
}

.navbar-brand{
  float: right !important;
  padding: 0;
}

.navbar-brand a{
  padding: 0;
  margin: 0;
}

.navbar-toggler{
  display: none;
  background: #ffffff;
  border: 1px solid var(--global--color--primary-fore);
  border-radius: 0px;
  padding: 2px;
  margin: 10px 2px;
}

.navbar-toggler .icon-bar {
  display: block;
  float: none;
  width: 22px;
  height: 4px;
  margin: 2px;
  border-radius: 1px;
  background-color: var(--global--color--primary)
}

.navibar-toggler .icon-bar + .icon-bar {
  margin-top: 4px;
}

.navibar-toggler:hover{
  background: var(--global--color--primary-fore);
  color: var(--global--color--primary);
}

.navibar-toggler:hover .icon-bar{
  background: var(--global--color--primary);
}

.nav-link ul {
  padding:4px;
  margin:0px;
  list-style:none;
  position:relative
}

.nav-link ul ul {
  list-style:none;
  position:absolute;
  left:0;
  top:100%;
  display:none;
  padding:0px;
  margin:0px;
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  -o-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;

}

.nav-link li{
  float: left !important;
  font-size: 36px;
  transform: scale(.8, 1);
  display:inline;
  position:relative
}

ul a {
  font-family: "Atlas_Grotesk_Web_Regular", sans-serif;
  text-decoration:none;
  padding:10px 0px;
  -moz-text-align-last:100px;
  float:left;
  text-align:center;
}

ul li:hover ul {
  display:block;
}

ul ul a {
  width:150px;
}

ul ul li {
  display:block;
  margin:0px
}

.site-nav{
  float: left;
}

.search-box{
  align-items: right;
  float: right !important;
}

.sticky {
  position: fixed;
  top: 0x;
  width: 100%;
}

.sticky + .content {
  padding-top: 120px;
}

/* advocacy section */
.advocacy_section{
  padding: 10%;
  background-color: var(--global--color--secondary-bg);
  margin: auto;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 10% auto; /* 15% from the top and centered */
  padding: 10px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.modal-content .close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.modal-content .close:hover,
.modal-content .close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.advocacy_section_lining{
  width: 100%;
  margin: auto;
}

.advocacy_section .advocacy-item{
  /* width: 100%; */
  background-color: #f6bb08;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
  padding:60px 0;
  cursor: pointer;
}

.advocacy_section .advocacy-item:hover{
  background-color: var(--global--color--secondary-bg);
}
/* end advocacy section */

.story_section {
  padding: 0 4%;
}

.story_section .container-fluid {
  -webkit-box-shadow: 1px -1px 24px -13px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 1px -1px 24px -13px rgba(0, 0, 0, 0.75);
  box-shadow: 1px -1px 24px -13px rgba(0, 0, 0, 0.75);
}

.story_section .col-md-6 {
  padding: 0;
  display: flex;
  align-items: center;
  background-color: #fcfcfc;
}

.story_detail,
.welcome_detail {
  margin-left: 40px;
  padding: 10% 0;
}

.story_detail h2 {
  text-transform: uppercase;
  color: #0c0b09;
  font-weight: bold;
}

.story_detail h3, .welcome_detail h3 {
  text-transform: uppercase;
  color: #254a93;
  margin: 0;
}

.story_detail p, 
.welcome_detail p {
  font-family: roboto-medium;
  font-size: 16px;
  line-height: 130%;
}

.story_detail {
  width: 85%;
}

.story_detail .story_detail-btn {
  margin-top: 25px;
}

.story_section .story_detail-btn a,
.story_section .story_detail-btn a:hover {
  text-transform: uppercase;
  color: #0c0b09;
}

.story_section .story_detail-btn a img {
  width: 25px;
}

.contact_form-container {
  background-image: url(assets/img/advocacy-900x600.jpg);
}

.contact_form-container form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.contact_form-container .contact_box {
  background-color: #fff;
  padding: 35px 40px;
  width: 50%;
  height: 60%;
  margin: 100px 50px;
}

.contact_form-container form input,
.contact_form-container form input:focus,
.contact_form-container form input:active {
  border: none;
  background-color: transparent;
  border-bottom: 1px solid #00cc99;
  width: 85%;
  margin-top: 12px;
  outline: none;
}

.contact_form-container form button {
  border: none;
  background-color: #254a93;
  color: #fff;
  padding: 8px 20px;
  margin-top: 15px;
}

.contact_section .row .col-md-6 {
  padding: 0;
}

/* end contact section */


/* info section */
.info_section {
  background-color: var(--global--color--tertiary-bg);
  color: var(--global--color--primary-fore);
  font-size: 14px;
  font-stretch: condensed;
}

.info_section .info_detail {
  display: flex;
  align-items: center;
}

.info_section .info_detail p {
  color: #fff;
}

.address_link-container {
  display: block;
}

.address_link-container a {
  display: flex;
  color: #fff;
  margin: 15px 0;
  align-items: center;
}

.address_link-container a img {
  margin-right: 10px;
}

.info_section .news_container h3,
.info_section .address_container h3 {
  text-transform: uppercase;
  color: #fff;
  font-size: 22px;
}

.address_container h5,
.news_container h5,
.quick_link h5{
  font-size: 18px;
}

.info_section .news_container form {
  margin: 28px 0;
}

.info_section .news_container form input {
  border: none;
  background-color: #fff;
  width: 70%;
  padding: 7px 10px;
}

.info_section .news_container form button {
  border: none;
  background-color: #254a93;
  color: #fff;
  font-size: 14px;
  padding: 8px 15px;
  margin-top: 15px;
  text-transform: uppercase;
}

.info_section .news_container .social_container {
  width: 50%;
  display: flex;
  justify-content: space-between;
}

/* end info section */

/* footer section*/

.footer_section {
  color: var(--global--color--primary);
  background-color: var(--global--color--secondary);
  font: 1em sans-serif;
  padding: 20px 0;
  font-family: "Roboto", sans-serif;
}

.footer_section p {
  color: #0c0b09;
  font-weight: 400px;
  margin: 0;
  text-align: center;
}

.footer_section a {
  color: #fff;
}

.quick_link a{
  text-decoration: none;
  display: block;
  padding: 2px 6px;
  color: var(--global--color--primary-fore);
}

.address_container,
.news_container,
.quick_link{
  margin: 4px 0;
  padding: 4px 0;
}

/* end footer section*/

/* Slideshow container */
.slideshow-container {
  max-width: 2000px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}


.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 10s;
  animation-name: fade;
  animation-duration: 10s;
}

@-webkit-keyframes fade {
  from {opacity: 1} 
  to {opacity: 0.4}
}

@keyframes fade {
  from {opacity: 1} 
  to {opacity: 0.4}
}

/* welcome section */
.welcome_section .col-md-6 {
  padding: 0 4%;
}

.welcome_detail {
  width: 75%;
}

.welcome_detail h2 {
  text-transform: uppercase;
  color: #0c0b09;
  font-weight: bold;
}

.welcome_detail h3 {
  text-transform: uppercase;
  color: #254a93;
  position: relative;
}

.welcome_detail h3::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  height: 1.5px;
  width: 140px;
  background-color: #36bb25;
}

.welcome_detail h2,
.welcome_detail p,
.welcome_detail .welcome_detail-btn {
  margin-top: 25px;
}

.welcome_section .welcome_detail-btn a,
.welcome_section .welcome_detail-btn a:hover {
  text-transform: uppercase;
  color: #0c0b09;
}

.welcome_section .welcome_detail-btn a img {
  width: 25px;
}

/* end welcome section */

/* Blog section starts here */
.blog_news{
  padding: 6px;
  font-optical-sizing: auto;
  font-style: normal;
}

.latest_blog_entry_title{
  display: block;
  padding: 6px 0;
  color: var(--global--color--primary) !important;
  line-height: 1px;
}

.post_section {
  padding: 2%;
}

.entry-header .entry-title{
  padding-top: 2px;
  font-size: 34px;
}

.entry-content{
  font-size: 18px;
  line-height: 1.8rem;
}

.cat-header-title{
  padding-top: 2px;
  font-size: 34px;
  font-style: italic;
}

.post-content{
  margin: 2px 0;
  padding: 4px;
  line-height: 1.2oem;
  font-size: 16px;
}

.post-content a{
  text-decoration: none !important;
  color: var(--global--color--primary);
}

.post-content a:hover{
  color: var(--global--color--secondary);
}

.blog_contenty h4 {
  display: block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.blog_content h4 a{
  color: var(--global--color--primary) !important;
  font-size: 18px;
  line-height: 1px;
}

.blog_content p{
  font-size: 16px;
  line-height: 120%;
}

.blog_content .admin,
.blog_content .time,
.blog_content .count{
  font-size: 14px;
}

.blog_img{
  max-height: 240px;
  width: 100%;
}

.blog_img img{
  max-height: 240px;
  border-radius: 5px;
}

/*input starts here*/
.post_section input[type=text],
.post_section input[type=email],
.post_section input[type=tel],
.post_section input[type=url],
.post_section textarea,
.post_section input[type=button],
.post_section input[type=submit], 
.post_section input[type=reset],
.post_section button{
  padding: 8px 6px;
  display: block;
  width: 100%;
}

.post_section input[type=button],
.post_section input[type=submit], 
.post_section input[type=reset]{
  color: #ffffff;
  background-color: var(--global--color--primary);
  cursor: pointer;
  transition: background-color 0.4s ease-in-out;
}

.post_section input[type=button]:hover,
.post_section input[type=submit]:hover, 
.post_section input[type=reset]:hover{
  background-color: #ffffff;
  color: var(--global--color--primary);
}

input[type="text"]{
  padding: 8px 6px;
  margin: 8px 4px;
}

.navbar-brand button{
  padding: 8px 6px;
  background-color: #f2f2f2;
  color: var(--global--color--primary);
  transition: border-radius 2s;
}

.navbar-brand button:hover{
  color: var(--global--color--secondary-bg);
  border-radius: 20px;
}
/*input ends here*/

/*profile starts here*/
.profile-img{
  margin: 0;
  padding: 0;
  position: relative;
}

.profile-img img{
  width: 100%;
}

.profile-title{
  position: absolute;
  font-size: 64px;
  color: #f1f1f1;
  left: 22px;
  bottom: 24px;
  text-shadow: 2px 2px #8d0707;
}

.profile-content{
  margin: 0;
  padding: 10px 48px;
}

.profile-content p{
  font-size: 18px;
}

.profile-background-1{
  height: auto;
  background-color: var(--global--color--primary-fore);
}

.profile-easi{
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

@keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}

.fadeIn {
  opacity: 0;
  cursor: pointer;
  transition: 0.25s all ease-in-out;
}

.fadeIn:hover {
  opacity: 1;
}

@keyframes fadeInOutAnimation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeInOut {
cursor: pointer;
animation: fadeInOutAnimation 1.5s;
animation-direction: alternate-reverse;
animation-timing-function: ease-in-out;
}

.profile-set{
  animation: example 5s linear 2s infinite alternate;
}


/*profile ends here*/

/* Blog section ends here */

@media screen and (max-width: 600px) {
  .col-s-8-33,
  .col-s-10,
  .col-s-16-66,
  .col-s-20,
  .col-s-25,
  .col-s-30,
  .col-s-33-33,
  .col-s-35,
  .col-s-41-66,
  .col-s-50,
  .col-s-58-33,
  .col-s-66-66,
  .col-s-70,
  .col-s-75,
  .col-s-80,
  .col-s-83-33,
  .col-s-91-66,
  .col-s-100,
  .mega-menu-column {
    width: 100%;
  }

  .search-box{
    display: none;
  }

  .logo-box{
    float: left;
    width: 80%;
  }

  .navbar-toggler{
    display: block;
    float: right;
  }

  .senator-title{
    width: 380px;
  }
  
  .senator-title-name{
    font-size: 20px;
  }
  
  .senator-title-designation{
    font-size: 16px;
  }
  
  .senator-title-federal{
    font-size: 12px;
  }

  .nav-link, 
  .nav-link ul, 
  .nav-link span,
  .dropdown,
  .dropdown .dropbtn,
  .mega-menu-column,
  .navbar-brand{
    float: none;
    align-items: center;
    text-align: center;
  }

  .nav-link li{
    float: none;
  }

  .nav-link ul ul{
    position: relative;
  }

  .nav-link a, 
  .nav-link li, 
  .dropdown .dropbtn{
    display: block;
    width: 100%;
  }

  .nav-link li, .nav-link .dropbtn {display: none;} 
  .nav-link a.icon {
    float: right;
    display: block;
  }

  .nav-link.responsive {position: relative; display: block;}
  .nav-link.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  .nav-link.responsive li, 
  .nav-link.responsive .dropbtn {
    float: none;
    display: block;
    text-align: left;
  }

  .site-nav, .search-box{
    float: none;
    display: block;
  }

  .subnav a,
  .curtainNav a{
    font-size: 16px;
    line-height: 50%;
  }

  .profile-title{
    font-size: 44px;
  }
  
  .profile-content{
    margin: 0;
    padding: 8px 38px;
  }
}
/*Custom Styles Ends*/

/*Custom Animations*/
@keyframes fadeAndGrow {
  0% { opacity: 0; transform: scale(0); }
  50% { opacity: 0.7; transform: scale(1.2); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes fade {
  0% { opacity: 0; }
  50% { opacity: 0.7; }
  100% { opacity: 1;  }
}

.mainSlides {
  animation: fade 2s ease-in-out alternate infinite;
}

@keyframes spinAndColor {
  0% { transform: rotate(0); background-color: #3498db; }
  50% { transform: rotate(180deg); background-color: #e74c3c; }
  100% { transform: rotate(360deg); background-color: #2ecc71; }
}

.spinner {
  animation: spinAndColor 3s infinite;
}

@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-30px); }
}

.ball {
  animation: bounce 1s infinite;
}

@keyframes textEntrance {
  0% { transform: translateY(300px); opacity: 0; }
  50% { transform: translateY(15px); opacity: 0.5; }
  100% { transform: translateY(0); opacity: 1; }
}

@keyframes slideTitleEntrance {
  0% { transform: translateY(300px); opacity: 0; }
  50% { transform: translateY(15px); opacity: 0.5; }
  100% { transform: translateY(0); opacity: 1; }
}

@keyframes slideDescriptioneEntrance {
  50% { opacity: 0; }
  60% { opacity: 1; }

}

@keyframes pEntrance {
  0% { transform: translateY(200px); opacity: 0; }
  50% { transform: translateY(5px); opacity: 0.5; }
  100% { transform: translateY(0); opacity: 1; }
}

.mainSlides h2 {
  color: #1e023b;
  animation: slideTitleEntrance 3s ease-in-out;
}

.chest-bar h1 {
  animation: slideDescriptioneEntrance 3s ease-in-out;
}

.chest-bar p {
  animation: pEntrance 6s ease-in-out;
}

/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn {
  float: left;
  width: 75%;
}

/* Right column */
.rightcolumn {
  float: left;
  width: 25%;
  padding-left: 20px;
}

.thirdcolumm{
  float: left;
  width: 33.33%;
  padding-left: 6px;
}

.quartercolumm-25{
  float: left;
  width: 25%;
  padding-left: 6px;
}

.quartercolumm-75{
  float: left;
  width: 75%;
  padding-left: 6px;
}

/* Add a card effect for articles */
.card {
  background-color: white;
  padding: 10px;
  margin-top: 20px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 600px) {
  .leftcolumn, 
  .rightcolumn, 
  .thirdcolumm, 
  .quartercolumm-25, 
  .quartercolumm-75 {
    width: 100%;
    padding: 0;
  }
}

/*font family*/
.main-navigation li,
.site-title,
.site-title a,
.site-description,
.site-description a,
.slide-title,
.bn-title,
.comment-reply-title,
.comments-title,
.comment-form .form-submit input,
.read-more,
.slicknav_nav li a,
.widget-title,
.page-header .page-title,
.single .entry-header .entry-title,
.page .entry-header .entry-title,
h1, h1 a,
h2, h2 a,
h3, h3 a,
h4, h4 a,
h5, h5 a,
h6, h6 a{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	line-height: 1.1;
}

#news h4,
#news h4 a{
  font-weight: bold;
}

/*archive pages*/
.taxonomy-description {
	padding-bottom: 20px;
}