/* Theme Name: BerkBank Custom */

@import "css/bootstrap.min.css";
@import "fonts/fonts.css";

/* Body 
----------------------------------------------*/
body {
	font-family: "Roboto", sans-serif;
	font-size: 16px;
}

@media (max-width: 1199px) {
  body {font-size: 14px;}
}


body.mobile {padding-top: 90px;}

body.mobile .container {max-width: 900px;}

.micro-content {
	width: 100%;
	max-width: 550px;
	margin: 50px auto;
	padding: 25px;
	text-align: center;
	background: #f1f1f1;
	border-radius: 15px;
}

.mini-content {
	width: 100%;
	max-width: 300px;
	border-radius: 10px;
	background: #f1f1f1;
	padding: 15px 15px 1px 15px;
	text-align: center;
	margin: 0 auto;
}

@media (max-width: 768px) {
  .micro-content {max-width: 90%; margin: 25px auto;}
}


/* Home Services
----------------------------------------------*/

/* Equal-height row */
.content-blocks.row {
  display: flex;
  flex-wrap: wrap;
}
.content-blocks .col-sm-4 {
  display: flex;
  flex-direction: column;
}

/* Card container */
.content-block {
  border: 1px solid #e5e5e5;
  padding: 8px;
  text-align: center;
  height: 100%;
  min-height: 230px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: flex-start;
  flex: 1 1 auto;
}

/* Default row spacing */
.content-block__row { 
  margin: 2px 0;
}

/* Icon row: center vertically and horizontally */
.content-block__icon {
  flex: 1 1 auto;
  display: flex;
  align-items: center;    /* vertical centering */
  justify-content: center;/* horizontal centering */
  margin-bottom: 4px;   
}
.content-block__icon img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  display: block;
}

/* Title */
.content-block__title {
  font-weight: 700;
  color: #871f42;
  margin-bottom: 2px;     
}

/* Body text */
.content-block__text {
  font-size: 0.8em;
  color: #777;
  line-height: 1.4;
  margin-top: 2px;       
}

/* Button */
.content-block__button {
  display: block;
  width: 100%;
  background: #800000;
  color: #fff !important;
  font-weight: 700;
  font-size: 12px;
  text-decoration: none;
  border-radius: 5px;
  padding: 10px 12px;
  margin-top: auto;
}
.content-block__button:hover,
.content-block__button:focus {
  opacity: 0.92;
  text-decoration: none;
}

/* Mobile padding */
.block-container-mobile { padding: 5px 0; }



/* Theme Colors 
----------------------------------------------*/
a {
    color: #a30046;
    text-decoration: none;
}

.bg-lightgrey {background: #f1f1f1;}
.bg-red {background: #861f41; color: #FFF;}
.bg-gold {background: #f4e9a9; color: #444;}
.text-blue, .blue {color: #036;}
.text-red, .red {color: #a30046;}
.text-pink, .pink {color: #c85d80;}
a.red, a.red:hover {color: #a30046; text-decoration: none;}
.btn-danger, .btn-danger:hover, .btn-red, .btn-dark:hover {background: #861f41; border-color: #861f41; color: #FFF;}
.btn-dark {background: #666; color: #FFF!important; font-size: 12px; padding: 1px 3px; font-weight: bold; text-transform: uppercase;}
.btn-darkbg, .btn-darkbg:hover, .btn-red:hover{background: #666; border-color: #666; color: #FFF;}

.btn-mobile-navigation, .btn-mobile-navigation:hover {
	color: #FFF;
	border: 0;
	padding: 5px 10px;
	background: none;
	border-radius: 10px;
	outline: none;
}

.btn-close, .btn-close:hover {
	color: #444;
	border: 0;
	padding: 5px 10px;
	background: none;
	border-radius: 10px;
	outline: none;
}

/* Headings 
----------------------------------------------*/
h1 {font-size: 30px; font-family: Georgia, "Times New Roman", Times, serif; color: #a30046; margin: 0 0 15px 0;}
h2 {font-size: 24px; font-weight: bold;}
h3 {font-size: 18px; font-weight: bold;}
h4 {font-size: 16px; font-weight: bold; line-height: 100%; margin: 0 0 15px 0; padding: 0; color: #a30046; }

h3.apy {font-size: 26px; font-weight: bold; margin: 0; padding: 0;}
h2.apy {font-size: 30px; font-weight: bold; margin: 0; padding: 0;}
h4.apy {font-size: 16px; font-weight: bold; margin: 0; padding: 0;}

h3.micro {font-size: 14px; font-weight: bold; text-transform: uppercase; color: #036; margin: 5px 0;}
h4.micro {font-size: 13px; font-weight: bold; text-transform: uppercase; padding: 10px 0; margin: 0;}

h3.bg-gold {background: #f4e9a9; font-size: 18px; font-weight: bold; text-transform: uppercase; margin: 0; padding: 8px;}

@media (max-width: 1199px) {
  h1 {font-size: 26px;}
  h2 {font-size: 20px;}
  h3 {font-size: 16px;}
  h4 {font-size: 14px;}
  
}

@media (max-width: 768px) {
  h1 {font-size: 28px;}
}


/* Spacers and Adjustments
----------------------------------------------*/
.spacing-1x, .spacer-1x {height: 10px;}
.spacing-2x, .spacer-2x {height: 20px;}
.spacing-3x, .spacer-3x {height: 30px;}
.spacing-4x, .spacer-4x {height: 40px;}
.spacing-5x, .spacer-5x {height: 50px;}

.nopadding {padding: 0; margin: 0;}
.nomargin {margin: 0;}
.nopadding-left {padding-left: 0;}
.nopadding-right {padding-right: 0;}

.textwidget {padding: 15px 15px 0 15px;}

@media (max-width: 768px) {
	.form-group .nopadding, .form-group .nopadding-left, .form-group .nopadding-right, .form-group .col-sm-10, .form-group .col-sm-4 {padding: 0 0 5px 0; margin: 0;}
	.form-group {margin-bottom: 0;}	
}

p {margin: 0 0 20px 0; line-height: 150%;}

.excerpt p {margin: 0; line-height: 150%;}

.breadcrumb {
    padding: 8px;
    margin-bottom: 15px;
    list-style: none;
    background-color: #FFF;
    border-radius: 0;
	border-bottom: 1px dashed #CCC;
	font-size: 13px;
}

.breadcrumb span.current-item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60px;
}

.form-group .bold {font-weight: bold; padding-top: 5px;}

hr {border-bottom: 1px solid #CCC;}

hr.thick-red {border-bottom: 5px solid #a30046;}

.table > tbody > tr > td {
     vertical-align: middle;
}

strong, b, .bold {font-weight: bold;}

span.wpcf7-list-item {
    display: block!important;
    margin: 0!important;
}

.email {font-size: 14px; color: #666;}

/* Wrapping Lines
----------------------------------------------*/
.top-line {padding: 10px 15px 10px 15px; text-align: right; font-size: 13px; line-height: 150%;}

.top-line a, .bottom-line a {color: #FFF; background: none;}

.bottom-line {padding: 7px 15px; font-size: 13px; line-height: 150%;}

@media (max-width: 991px) {
	.top-line, .bottom-line {font-size: 11px;}
}

/* Logo - Tagline 
----------------------------------------------*/
.tagline-logo {padding: 25px 15px;}
.search-wrap {width: 100%; max-width: 250px; margin: 0 0 15px auto;}
.tagline {font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; font-weight: bold; font-size: 13px;}
	@media (max-width: 991px) {
  		.tagline {font-size: 10px;}
	}	
	@media (max-width: 768px) {
		.tagline {font-size: 11px;}
	}

/* Navigation 
----------------------------------------------*/
.navbar {min-height: 30px;}
.navbar-custom {
	background-color: #861f41!important;
	border-style: solid;
	border-width: 5px 0;
	border-color: #cc9900;
	padding: 0;
	margin: 0 auto;
	font-size: 15px;
	text-transform: uppercase;
	border-radius: 0;
}

.nav>li>a, .nav>li>a:focus, .nav>li>a:hover {color: #FFF; background: #861f41; padding: 10px 10px;}

.nav>li>a:hover {text-decoration: underline;}

.navbar-custom-mobile {padding: 15px 0;}

@media (max-width: 1199px) {
  .navbar-custom {font-size: 13px;}
}

@media (max-width: 991px) {
	.navbar-custom {font-size: 11px;}
	.nav>li>a, .nav>li>a:focus, .nav>li>a:hover {padding: 8px 0px!important;} 
}

@media (max-width: 768px) {
	.navbar {min-height: 80px;}
}

/* Offcanvas
----------------------------------------------*/
.offcanvas-heading {
	text-align: right;
	padding: 15px 15px 0 15px;
}

.offcanvas-body {
	padding: 0px 15px 15px 15px;
	font-size: 18px;
}

.mobile-menu {
	padding: 0;
	margin: 0;
	list-style: none;
}

.mobile-menu li {
	padding: 10px;
	font-weight: bold;
	border-bottom: 1px dotted #999;
}

.mobile-menu a {
	color: #444;
	background: none;
	text-decoration: none;
}

.mobile-menu li .sub-menu {list-style: none; padding: 0; margin: 0 0 0 15px; font-size: 15px;}
.mobile-menu li .sub-menu li .sub-menu {list-style: square; padding: 0; margin: 0 0 0 25px; font-size: 13px;}

.mobile-menu li .sub-menu li {font-weight: normal; border-bottom: 0; padding: 5px;}

.mobile-menu li ul.sub-menu li.current_page_item a, 
.mobile-menu li ul.sub-menu li ul.sub-menu li.current_page_item a {color: #a30046;}

.mobile-menu li ul.sub-menu li.current_page_item ul.sub-menu a {color: #444;} 


.offcanvas {
	position: fixed;
	z-index: 20000;
	display: none;
	transform: translate3d(0, 0, 0);
	transition: transform 800ms cubic-bezier(0.645, 0.045, 0.355, 1);
	background: #f1f1f1;
	border-style: solid;
	border-width: 0px 1px;
	border-color: #f1f1f1;
	-webkit-box-shadow: 0px 0px 18px 0px #000; 
	box-shadow: 0px 0px 18px 0px #000;
	overflow: scroll;	
}

.offcanvas--right {
	top: 0;
	right: -320px;
	width: 300px;
	height: 100vh
}

.offcanvas--right--active { transform: translate3d(-320px, 0, 0) }

.offcanvas--left {
	top: 0;
	left: -350px;
	width: 280px;
	height: 100vh
}

.offcanvas--left--active { transform: translate3d(350px, 0, 0) }

.offcanvas--initialized { display: block }


/* Page Height
----------------------------------------------*/
@media only screen and (min-width : 768px) {
	.is-table-row, .is-table-row-alt {
		display: table;
		width: 100%;
		margin: 0;
	}
	.is-table-row .col-sm-3, .is-table-row .col-sm-9,
	.is-table-row-alt .col-sm-3, .is-table-row-alt .col-sm-9 {
		float: none;
		display: table-cell;
		vertical-align: top;
		padding-top: 10px;
	}
}

/* Block Contents 
----------------------------------------------*/
.block-contents {width: 100%;}

.block-titles {background: #eaeaea;}
.block-titles-red {color: #a30046; font-size: 14px; padding: 3px 8px; font-weight: bold; line-height: 150%; margin: 0;}
.block-titles .button-go {padding-top: 2px;}
.block-contents .col-sm-4 {margin: 0; padding: 0 8px;}

.block-container {border: 1px solid #CCC; background: #FFF; margin-bottom: 15px;}
.block-container-simple {background: #FFF; margin-bottom: 15px;}
.block-container-large {padding: 20px 8px; font-size: 18px; line-height: 115%; font-weight: bold; color: #666;}
.block-container-large sup {top: -3px;}
.block-container-large hr {margin: 8px auto; padding: 0; border-color: #ccc;}
.block-container-large a {color: #666; text-decoration: none;}

.block-container-main {border: 1px solid #CCC; background: #FFF; margin-bottom: 16px; min-height: 100px; padding: 15px;}
.block-container-mobile {margin-bottom: 16px; padding: 0;}


.block-container-simple ul {list-style: none; padding: 0; margin: 0;}
.block-container-simple li {list-style: none; padding: 0; margin: 0;}

.block-container-simple a {color: #a30046;}
.block-container-simple ul {list-style: none; margin: 0; padding: 0;}
.block-container-simple li a {padding: 8px; display: block;}

.block-container-simple ul li ul.sub-menu {list-style: none; margin: 0 0 0 25px; padding: 0;}

.block-container-simple ul li.current-menu-item a, 
.block-container-simple ul li.current-page-ancestor a,
.block-container-simple ul li.current_page_parent a
{background: #f4e9a9; color: #444; font-weight: bold; text-transform: uppercase;}

.block-container-simple ul li ul.sub-menu li a
{background: #FFF!important; color: #a30046!important; font-weight: normal; text-transform: none;}

.block-container-simple ul li ul.sub-menu li.current-menu-item a {
	font-weight: bold;
}

.block-container-simple ul li ul.sub-menu li.noformat a {font-weight: normal!important;}

.block-formatting ul, .block-formatting ol {margin-bottom: 25px;}


@media (max-width: 768px) {
	.block-contents {margin: 0 auto; width: 100%; max-width: 95%;}
}

/* Sidebar 
----------------------------------------------*/
.sidebar {padding: 15px;}

h3.block-grey {
	font-size: 14px;
	background: #eaeaea;
	color: #666;
	margin: 0;
	padding: 3px 8px;
	font-weight: bold;
	line-height: 150%;
}
	
h3.main-red {
	font-size: 18px;
	text-transform: uppercase;
	border-bottom: 2px solid #CCC;
	color: #a30046;
	margin: 0 0 10px 0;
	padding: 0 8px;
	font-weight: bold;
	line-height: 150%;
}

table.inslend {margin: 0 auto; width: 100%; max-width: 200px;}

/* Accordion 
----------------------------------------------*/
.panel-default>.panel-heading {
	color: #FFF;
	background-color: #861f41;
	border-color: #861f41;
}

.accordion-toggle, .accordion-toggle:hover, .accordion-toggle:focus, .accordion-toggle:active {color: #FFF; text-decoration: none;}

.side-products .panel-body a {color: #a30046;}
.side-products .panel-body ul {list-style: none; margin: 0; padding: 0; font-size: 14px;}
.side-products .panel-body li {list-style: none; padding: 0 0 5px 0;}
.side-products .panel-body li.more {font-weight: bold; font-size: 13px;}

a[aria-expanded=true] .fa-chevron-down {display: none;}
a[aria-expanded=false] .fa-chevron-up {display: none;}

/* Privacy Page Styles
----------------------------------------------*/

        .page_heading {
            color: #800000;
            font-size: 2rem;
        }
        .table-primary-heading {
            background-color: #D9D9D9;
        }
        .table-secondary-heading {
            background-color: #F2F2F2;
        }
        .info-list {
            list-style-type: disc;
            padding-left: 20px;
        }
        .info-list li {
            margin-bottom: 5px;
        }
        @media (max-width: 768px) {
            .table th, .table td {
                display: block;
                width: 100%;
                text-align: left !important;
            }
            .table thead {
                display: none;
            }
            .table tr {
                margin-bottom: 15px;
                display: block;
                border: 1px solid #dee2e6;
            }
            .table td {
                border: none;
                border-bottom: 1px solid #dee2e6;
                position: relative;
                padding-left: 50%;
            }
            .table td:before {
                position: absolute;
                top: 6px;
                left: 6px;
                width: 45%;
                padding-right: 10px;
                white-space: nowrap;
                font-weight: bold;
            }
            .table tr:nth-of-type(1) td:nth-of-type(1):before { content: "Reasons:"; }
            .table tr:nth-of-type(1) td:nth-of-type(2):before { content: "Does Bank share?"; }
            .table tr:nth-of-type(1) td:nth-of-type(3):before { content: "Can limit?"; }
        }


/* ========================================
   FDIC BAR - MOBILE / LANDSCAPE FIXED TOP
   ======================================== */
@media (max-width: 900px), (orientation: landscape) {

  /* FDIC bar - fixed at very top and always visible */
  #fdic-bar {
    display: block !important;       /* override .visible-xs-block hiding */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background-color: #ffffff !important;
    z-index: 20000 !important;
    border-bottom: 1px solid #ddd;
  }

  /* FDIC logo padding */
  #fdic-bar img {
    padding-left: 10px !important;
  }

  /* Navbar sits below FDIC bar */
  .navbar-mobile.navbar-fixed-top {
    position: fixed !important;
    top: 60px !important;        /* approximate FDIC bar height */
    z-index: 19990 !important;
  }

  /* Body pushed down for both bars */
  body.mobile {
    padding-top: 140px !important; /* 60 (FDIC) + ~80 (navbar) */
  }
}
