/*
Theme Name: Official 2020
Author: Alexander Trejo
Description: Custom theme for Official Dog Resistry
Version: 1.0
*/
html {
	overflow-x:hidden;
}
body{
  margin: 0;
  padding: 0;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  color: #000;
  background-color: #ffffff;
  font-size: 1rem;
  overflow-x:hidden;
}

*             { outline: 0; box-sizing: border-box; }
img           { border: 0; }
a             { text-decoration: none; }
.full-width   { float: left; width: 100%; }
.half         { float: left; width: 50%; }
.hidden       { display:none; }
.nobr         { white-space:nowrap !important; }
.a-left       { text-align:left !important; }
.a-center     { text-align:center !important; }
.a-right      { text-align:right !important; }
.v-top        { vertical-align:top; }
.v-middle     { vertical-align:middle; }
.left         { float:left !important; }
.right        { float:right !important; }
.no-margin    { margin: 0; }
.no-padding   { padding: 0; }
.no-pad-mar   { padding: 0; margin: 0; }
.no-bg        { background:none !important; }
.img-resp     { max-width: 100%; height: auto; }
.img-full     { width: 100%; height: auto; }
.relative     { position: relative; }
.table        { display: table; }
.table-row    { display: table-row; }
.table-cell   { display: table-cell; float: none;}
.inline       { display: inline; }
.no-visible	  { visibility: hidden; }

.full-height {
    float: left;
    position: relative;
    width: 100%;
    height: 100vh;
}

.flex         { display: flex; }
.flex-column  { flex-direction: column; }
.flex-rcolumn { flex-direction: column-reverse; }
.flex-row     { flex-direction: row; }
.flex-rrow    { flex-direction: row-reverse; }
.flex-a-center{ align-items: center; }
.flex-a-end   { align-items: flex-end; }
.flex-a-start { align-items: flex-start; }
.flex-wrap    { flex-wrap: wrap; }
.flex-no-wrap { flex-wrap: nowrap; }
.flex-j-start { justify-content: flex-start; }
.flex-j-end   { justify-content: flex-end; }
.flex-j-center{ justify-content: center; }
.flex-j-between  { justify-content: space-between; }
.flex-j-around   { justify-content: space-around; }
.flex-j-evenly   { justify-content: space-evenly; }
.flex-self-start { align-self: flex-start; }
.flex-self-end   { align-self: flex-end; }
.flex-self-center{ align-self: center; }

button,
html [type=button],
input[type="text"],
input[type="submit"],
input[type="email"],
select,
textarea { -webkit-appearance: none; border-radius: 0; }

.container { max-width: 1660px; }
.full-container { max-width: 100%; padding: 0; }

.pt-15 { padding-top: 15px; }
.pb-15 { padding-bottom: 15px; }
.pt-20 { padding-bottom: 20px; }

/*==== COMMON ====*/
h1 { margin-top: 40px; font-weight: bold; font-size: 2.5rem; text-transform: uppercase; padding-bottom: 12px; margin-bottom: 40px; position: relative; }
h1:after{
  content: '';
  height: 2px;
  width: 12rem;
  display: inline-block;
  background-color: #34c1e7;
  position: absolute;
  bottom: 0;
  left: 0;
}

h2 { font-weight: bold; font-size: 2rem; text-transform: uppercase; padding-bottom: 12px; margin-bottom: 40px; position: relative; }
body.home h2:after{
  content: '';
  height: 2px;
  width: 8rem;
  display: inline-block;
  background-color: #34c1e7;
  position: absolute;
  bottom: 0;
  left: 0;
}

body.therapy-dog-information #content-wrapper h2 { margin-bottom: 15px; }


.blue-btn { display: inline-block; background-color: #056399; border: 2px solid #056399; color: #fff; font-size: 1.2rem; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.blue-btn:hover { background-color: #fff; color: #056399;; text-decoration: none; }
.pink-btn { display: inline-block; background-color: #34c1e7; border: 2px solid #34c1e7; color: #fff; font-size: 1.2rem; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.pink-btn:hover { background-color: #fff; color: #34c1e7; text-decoration: none; }
.gray-btn { display: inline-block; background-color: #d0d0d0; color: #fff; font-size: 1.2rem; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.gray-btn:hover { background-color: #909090; color: #fff; text-decoration: none; }
.white-btn { display: inline-block; background-color: #fff; color: #34c1e7; border: 2px solid #34c1e7; font-size: 1.2rem; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.white-btn:hover { background-color: #34c1e7; color: #fff; text-decoration: none; }
.green-btn { display: inline-block; background-color: #BECC39; border: 2px solid #BECC39; color: #fff; font-size: 1.2rem; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.green-btn:hover { background-color: #fff; color: #BECC39; text-decoration: none; }
.basic-btn { border: 1px solid #007bff; padding: 0.2rem 0.5rem; border-radius: 7px; color: #007bff; }
.basic-btn:hover { text-decoration: none; background-color: #007bff; color: #fff; }

.ui-widget-content a.pink-btn { color: #fff; }

.light-blue-bg { background-color: #e5f5fe; }

#sidebar-right {
	padding: 40px 15px;
  margin: 20px 0;
	border-left: 8px solid #e5f5fe;
}
#sidebar-right .widget{}

.alignleft {
	float: left;
	margin: 0.5em 1em 0.5em 0;
}

.alignright {
	float: right;
	margin: 0.5em 0 0.5em 1em;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.round-btn { border: 2px solid #34c1e7; color: #000; padding: 1px 8px; border-radius: 5px; transition: all 0.2s ease; }
.round-btn:hover { background-color: #34c1e7; text-decoration: none; color: #fff; }

.wpsm_panel-body_inner { padding: 10px; }

.field-error { border-color: #ff0000; background-color: #F2D0D2; }

#content-wrapper img { max-width: 100%; height: auto; }

body.page-template-accordion-tpl .ui-widget { font-family: inherit; font-size: inherit; }

.video-wrap {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
  width:100%;

}
.video-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*==== HEADER ====*/
header { background-repeat: repeat;; }
#logo-wrap { display: flex; align-items: center; }
#logo-wrap img { width: auto; max-height: 125px; }
.site-name { font-size: 2.5rem; color: #04254f; font-weight: bold; text-transform: uppercase; }
/* header .pink-btn { text-transform: uppercase; } */
header .pink-btn, header .blue-btn, header .green-btn { font-size: 1.1rem; padding: 0.5rem; }

.user-login-logout { padding-bottom: 10px; font-size: 0.9rem; text-align: right; }
.user-login-logout a { color: #000; }

#mobile-user-bar{ display: none; }
#mobile-user-bar a { color: #2d9cdb; }

#main-menu-container { float: left; width: 100%; background-color: #34c1e7; color: #fff; }
.menu-item a { color: #fff; text-transform: uppercase; }
.menu-item a:hover { color: #34324c; text-decoration: none; }
.navbar-toggler-icon { height: auto; }

.navbar-expand-lg .navbar-nav {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

nav .blue-btn,
nav .green-btn,
nav .pink-btn { padding: 0.3rem; font-size: 1rem; }
nav .pink-btn { background-color: #056399; border: 2px solid #056399; }

#navbarSupportedContent .form-control { border-radius: .25rem 0 0 .25rem; border: 0; }
#navbarSupportedContent .form-control:focus { border: 0; box-shadow: none; }
.search-btn { float: left; background-color: #fff; border: 0; border-radius: 0 .25rem .25rem 0; height: calc(2.25rem + 2px); }
.search-btn i { color: #d0d0d0; }

/*==== HOME PAGE ====*/
#hero-image {
  background-size: cover;
  background-position: center right;
  padding: 5rem 0;
  position: relative;
}

#hero-image:before{
  content: '';
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.2);
}

#cta-form { color: #fff; font-size: 1.1rem; /*background-color: #34324c;*/ padding: 1rem; border-radius: 10px; margin: 0 15px; }
#cta-form h2 { font-size: 2rem; font-weight: bold; text-transform: uppercase; }
#cta-form input[type="text"] { background-color: transparent; border: 1px solid #fff; padding: 3px 5px; color: #fff; magin-bottom: 5px; }
#cta-form input[type="submit"] { border: 0; border-radius: 6px; }

#cta-form  input[type="text"]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #fff;
}
#cta-form  input[type="text"]::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
}
#cta-form  input[type="text"]:-ms-input-placeholder { /* IE 10+ */
  color: #fff;
}
#cta-form  input[type="text"]:-moz-placeholder { /* Firefox 18- */
  color: #fff;
}
#cta-form  input[type="text"]::placeholder {
  color: #fff; opacity: 1;
}

#register-badge { padding: 4rem 0; }
#register-badge h2 { margin-bottom: 80px; }
#register-badge h2:after { right: 0; margin: 0 auto; }
#register-badge .light-blue-bg { font-size: 1.2rem; }

#register-blocks { margin: 30px 0; }
#register-blocks-wrap { margin-left: 0; margin-right: 0; }
#register-blocks-wrap h2 { margin-bottom: 10px; }
#register-blocks-wrap h2::after { display: none; }
#register-blocks-wrap h2 .fa { color: #34c1e7; margin-right: 15px; }
#register-blocks-wrap > div { padding: 0; }
#register-blocks-wrap > div:first-child { border-right: 1px solid #e5f5fe; border-bottom: 1px solid #e5f5fe; }
#register-blocks-wrap > div:nth-child(2) { border-left: 1px solid #e5f5fe; border-bottom: 1px solid #e5f5fe; }
#register-blocks-wrap > div:nth-child(3) { border-right: 1px solid #e5f5fe; border-top: 1px solid #e5f5fe; }
#register-blocks-wrap > div:last-child { border-left: 1px solid #e5f5fe; border-top: 1px solid #e5f5fe; }
.register-blocks-inner { padding: 30px 15px; }
.ada-register-buttons { margin-top: 25px; }
.ada-register-buttons .pink-btn { padding: 0.1rem 1rem; font-weight: 300; }
.ada-register-buttons .pink-btn:first-child { margin-right: 15px; }

#federal-law {
  background-size: cover;
  background-position: center center;
  padding: 4rem 0;
  position: relative;
  color: #fff;
  font-size: 1rem;
}
#federal-law:before{
  content: '';
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
}
#federal-law h2 { color: #fff; }

#federal-law ul { padding-left: 20px; }
#federal-law ul li { padding-bottom: 8px; }
#federal-law .pink-btn { margin-top: 1rem; }
.federal-law-text { column-count: 2; }

#featured-products { background-color: #f8f8f8; padding: 2rem 0; }
#featured-products h4 { text-align: center; font-weight: bold; }
#featured-products img { border: 8px solid #eee; margin-bottom: 1rem; }
#products-slider li a { display: inline-block; width: 100%; text-align: center; }
.bx-wrapper img { display: inline; }

#reasons { padding: 4rem 0; }
.blk-icon { margin: -13px 5px 0px 0px; align-self: flex-start; }
.blk-icon i { color: #34324c; font-size: 36px; margin-right: 15px; }
.blk-label { font-weight: bold; font-size: 1.2rem; }
.blk-content { margin: 0.5rem 0 3rem 0; }

/*==== GRAVITY FORM ====*/
.ginput_container input[type="text"],
.ginput_container select { border: 1px solid #c0c0c0; border-radius: 4px; }
.gform_page_footer input[type="button"],
.gform_page_footer input[type="submit"],
.gform_footer input[type="submit"] { display: inline-block; background-color: #34c1e7; color: #fff; font-size: 1.2rem; border: 0; border-radius: 6px; padding: 0.5rem 1rem; transition: all 0.2s ease; }
.gform_page_footer input[type="submit"]:hover,
.gform_page_footer input[type="button"]:hover,
.gform_footer input[type="submit"]:hover { background-color: #056399; color: #fff; }

/*==== REGISTER PAGE ====*/
.widget_black_studio_tinymce h3 { text-align: center; }
.doj-logo {
	max-width: 125px;
	height: auto;
}
/*
#field_10_10,
#field_10_92,
#field_10_32,
#field_10_93 {
  width: 48%;
  margin: 20px 1%;
  padding: 15px;
  background-color: #f5f5f5;
  clear: none;
  float: left;
  min-height: 10rem;
}
*/
/*==== LOGIN PAGE ====*/
#login h1 { display: none; }
body.login h1.page-title { margin-top: 3rem; }
body.login h1.page-title::after { display: none; }
.login footer { padding: 3rem 0; }

/*==== MEMBER DASHBOARD ====*/
#dashboard-menu ul { list-style: none; margin: 0; padding: 0; }
#dashboard-menu ul li { display: inline-block; padding: 2px 8px; float: left; border-bottom: 1px solid #c0c0c0; position: relative; }
#dashboard-menu ul li.active { background-color: #fff; border-bottom: 0; border-left: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; border-top: 1px solid #c0c0c0; }
#dashboard-menu ul li a { color: #c0c0c0; }
#dashboard-menu ul li.active a { color: #007bff; font-weight: bold; }
#dashboard-menu ul li a:hover { color: #1e00ff; text-decoration: none; }
.total-msg{
    font-size: 11px;
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: #d83432;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    position: absolute;
    top: -2px;
    right: -4px;
    font-weight: bold;
}
#dashboard-content { padding: 2rem 0; float: left; width: 100%; }

#card-preview { width: 500px; }

 /* select with CSS avatar icons */
option.cardid-icon {
  background-repeat: no-repeat !important;
  padding-left: 20px;
}
.cardid-icon .ui-icon {
  background-position: left top;
}

body.dashboard .ui-menu .ui-menu-item:not(:first-child){ height: 50px; position: relative; padding-left: 60px; }
body.dashboard .ui-menu .ui-menu-item:hover { background-image: none; background-color: #f5f5f5; }
body.dashboard  li.ui-menu-item .ui-icon { width: 50px; height: 50px; }

.ui-icon-triangle-1-s {
	float: right;
	margin-top: 0;
}
body.dashboard  .ui-icon-triangle-1-s {
	background-position: -65px -11px;
}
#card-id-button {
	text-align: left;
	white-space: nowrap;
	width: 14em;

	padding: .4em 1em;
	display: inline-block;
	position: relative;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow: visible;

  background-image: none;
}

.crop-wrap { width: 500px; height: 500px; margin-bottom: 60px; }
.crop-wrap .croppie-container { height: 500px; }

.download-card { text-align: center; font-size: 1.5rem; }
.download-card i { margin-right: 10px; }
.download-card img { margin-bottom: 10px; }

.dog-action-links a { margin-right: 0.9rem; font-size: 0.85rem; }

/*==== DOG LIST ====*/
body.post-type-archive-dog #content-wrapper h2 { margin-bottom: 0; margin-top: 40px; }
.paginate-links { margin-bottom: 5px; }
.paginate-links .page-numbers:not(.current):not(.next):not(.prev):not(.dots) { border: 1px solid #007bff; padding: 0 3px; margin: 0 2px; }
.paginate-links .page-numbers:not(.current):not(.next):not(.prev):not(.dots):hover { background-color: #007bff; color: #fff; text-decoration: none; }

#search-dog input[type="text"] {
	width: calc(100% - 75px);
	padding: 4px;
	height: 36px;
	border: 1px solid #007bff;
  vertical-align: middle;
}

#search-dog button {
	height: 36px;
	margin-left: -5px;
	border-radius: 0;
}

/*==== PRODUCT CARD ====*/
.product-card-wrap {
	display: flex;
	border-bottom: 2px solid #f0f0f0;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}

.product-card-wrap .product-card-img { padding-right: 2rem; }
#content-wrapper .product-card-wrap .product-card-img img { max-width: 150px; height: auto; }

.product-card-small {
	border-bottom: 2px solid #f0f0f0;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}

.product-card-small .product-card-img { text-align: center; }
.product-card-small .product-card-img img { max-width: 100%; height: auto; }
.product-card-small .product-card-content { text-align: center; }

/*==== NEWS PAGE ====*/
.btn-share { position: relative; top: 0; color: #fff; padding: 0.3rem 1rem; border-radius: 5px; font-size: 0.9rem; transition: all 0.2s ease; }
.btn-share:hover { color: #fff; text-decoration: none; top: -4px; opacity: 0.8; }
.btn-share i { padding-right: 0.5rem; }
.fb-share { background-color: #4267B2; }
.twitter-share { background-color: #55acee; }
.copy-share { background-color: #c38f2c; }

#content-sidebar li { list-style: none; }
#content-sidebar h2 {	margin: 20px 0; }

.news-item {
  float: left;
  width: 100%;
	padding-bottom: 2.5rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid #e0e0e0;
}

/*==== FOOTER ====*/
footer { float: left; width: 100%; background-color: #34c1e7; padding: 3rem 0; color: #fff; }
.footer-social { margin: 0; padding: 0; list-style: none; text-align: center; }
.footer-social li { display: inline-block; padding: 0 1.5rem; }
.footer-social li a { color: #fff; }

.footer-menu { margin: 2rem 0 0 0; padding: 0; list-style: none; text-align: center; }
.footer-menu li { display: inline-block; padding: 0 1.5rem; border-right: 1px solid #fff; line-height: 1; }
.footer-menu li:last-child { border-right: 0; }
.footer-menu li a { color: #fff; }
.footer-menu li a:hover { color: #056399;; }

.footer-separator { max-width: 20rem; min-width: 150px; height: 2px; background-color: #2173a2; border-bottom: 1px solid #5cc4ff; margin: 3rem auto; }

.mobile-show { display: none; }
.mobile-hide { display: block; }

.terms-links { width: 100%; text-align: center; font-size: 0.9rem; margin-top: 1.5rem; }
.terms-links a { color: #fff; text-decoration: none; }
.terms-links a:hover { text-decoration: underline; }


@media screen and (max-width: 1020px){
  .navbar-expand-lg .navbar-nav .nav-link { font-size: 0.9rem; }
}


@media screen and (max-width: 992px){
  .mobile-show { display: block; }
  .mobile-hide { display: none; }

  h1 { font-size: 2rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.3rem; }
  .site-name { font-size: 2rem; line-height: 2.2rem; }
  .navbar { padding: 0.5rem; }
  .navbar-nav .menu-item { text-align: center; padding: 4px 0; }
  #navbarSupportedContent form { display: none; }

  #hero-image { background-position: center center; }

  #mobile-user-bar{ display: flex; justify-content: space-evenly; background-color: #e5f5fe; }

  #cta-form input[type="text"] { margin-bottom: 15px; }

  body.home .light-blue-bg { display: none; }
  #sidebar-right { display: none; }

  #register-badge h2 { margin-bottom: 60px; }
  #register-badge .light-blue-bg { padding: 30px; }
  #badges-wrap > div { margin-bottom: 20px; }

  #register-blocks-wrap > div { border: 0; }

  .federal-law-text { column-count: 1; }

  #dashboard-content .table h3 { margin-top: 30px; }
  #dashboard-content form h3 { margin-top: 30px; }
  #dashboard-content form h3:first-child { margin-top: 0px; }
  .dog-action-links a { margin-right: 0; display: block; margin-bottom: 0.5rem; font-size: 1rem; }

  .cr-slider-wrap { display: none; }

  .footer-menu li { display: block; padding: 0.5rem 0; border-right: 0; }

  #search-dog { margin-top: 20px; }

  .cr-slider-wrap { display: block; }

  .product-card-wrap { flex-direction: column; }
  .product-card-wrap .product-card-img { padding-right: 0; text-align: center }
  #content-wrapper .product-card-wrap .product-card-img img { max-width: 100% }
  .product-card-wrap .product-card-content { text-align: center }

/*
  #field_10_10,
  #field_10_92,
  #field_10_32,
  #field_10_93 {
    width: 100%;
    margin: 10px 0;
    min-height: auto;
  }
*/
}

@media screen and (max-width: 500px){
  #crop-wrap { width: 350px; height: 350px; margin-bottom: 40px; }
  #crop-wrap .croppie-container { height: 100%; }

  #content-wrapper img { width: 100%; }
}

.gform_legacy_markup_wrapper .ginput_complex select.ginput_card_expiration.ginput_card_expiration_month, .gform_legacy_markup_wrapper .ginput_complex select.ginput_card_expiration.ginput_card_expiration_year {
	padding: 5px 4px !important;
}

@media screen and (max-width: 640px){
	.gform_wrapper.gravity-theme .ginput_complex span {
		display:block !important;
	}
	.gform_wrapper.gravity-theme .ginput_container_creditcard span.ginput_card_security_code_icon {
		display: inline-block !important;
	}
	.ginput_card_expiration_container.ginput_card_field {
		display: grid !important;
		grid-template-columns: auto auto;
    	gap: 5px;
	}
	.ginput_card_security_code {
		width: auto !important;
	}
	span.ginput_card_security_code_icon {
		display: inline-block !important;
	}
	.gform_wrapper.gravity-theme .ginput_complex .ginput_card_expiration_container.gform-grid-row {
		display: grid !important;
	}
}

