/**
Theme Name: Short Code Directory
Author: US Short Code Directory
Author URI: http://usshortcodedirectory.com
Description: Astra child theme for usshortcodedirectory.com
Version: 3.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: short-code-directory
Template: astra
*/

body {
	background: #ecf3f9 url('img/bg.jpg') no-repeat top center;
	background-size: 100% auto;
}

@media (min-width: 922px) {
	#primary-menu .menu-item {
		background: transparent url('img/dot.png') no-repeat center right;
		padding-right: 8px;
	}

	#primary-menu .menu-item:last-child {
		background: none;
		padding-right: 0;
	}
}


/**
 * Short code search results module
 */
.short-code-search-results {
	background-color: #ffffff;
	padding: 20px 30px;
	border-radius: 18px;
	box-shadow: 0px 10px 100px 0px #428ac933;
	margin-bottom: 40px;
}

.short-code-heading {
	border-bottom: 1px solid #c6dcef;
	background-size: 40px;
	padding: 5px 0 40px 60px;
}

.short-code-heading:after {
  content: "";
  display: table;
  clear: both;
}

.short-code-heading h1 {
	font-size: 30px;
	margin-bottom: 0;
}


.short-code-right h3 {
	margin-bottom: 1px;
}

.short-code-heading img {
	height: 24px;
	width: auto;
	margin-top: -3px;
}

@media (min-width: 1024px) {
	.short-code-heading {
		padding: 5px 0 40px 90px;
	}


	.short-code-heading p {
		margin-bottom: 0;
	}

	.short-code-left {
		float: left;
		width: 65%;
	}

	.short-code-right {
		float: right;
		max-width: 30%;
	}



}

.short-code-right h3 s,
.short-code-right {
	color: #999999;
}

.short-code-content {
	padding-top: 30px;
}

.short-code-content strong {
	font-weight: 600;
}

.short-code-content .stop-instructions {
	background-color: #ecf3f9;
	margin-bottom: 30px;
	padding: 30px 20px;
	text-align: center;
}

.short-code-content .stop-instructions p {
	margin-bottom: 0;
}

.short-code-content .stop-instructions p:first-child {
	margin-bottom: 10px;
}

@media (min-width: 1024px) {
	.short-code-search-results {
		padding: 70px 100px;
	}
}

/* Available codes */
.short-code-available .short-code-heading {
	background-image: url('img/available.png');
	background-repeat: no-repeat;
	background-position: top left;
	padding-bottom: 40px;

}

/* Unavailable codes */
.short-code-unavailable .short-code-heading {
	background-image: url('img/taken.png');
	background-repeat: no-repeat;
	background-position: top left;
	padding-bottom: 50px;
}

.usscd-invalid-search p {
	margin-bottom: 0;
}

/**
 * Short code related results module
 */
.short-code-related-results {
	background-color: #ffffff;
	padding: 20px 30px;
	border-radius: 18px;
	box-shadow: 0px 10px 100px 0px #428ac933;
	margin-bottom: 30px;
}

.short-code-related-results:after {
  content: "";
  display: table;
  clear: both;
}

.short-code-related-results .related-short-code {
	padding: 25px 5px 35px 5px;
	background: #ecf3f9;
	text-align: center;
	margin-bottom: 15px;
}

.short-code-related-results h3 {
	font-size: 50px;
	margin-bottom: 0;
}

.short-code-related-results strong {
	font-weight: 500;
}

.short-code-related-results p {
	font-size: 15px;
	margin-bottom: 0;
}

@media (min-width: 1024px) {
	.short-code-related-results {
		padding: 70px 100px;
	}

	.short-code-related-results .related-short-code {
		float: left;
		width: 23%;
		margin-right: 2%;
	}
}



/**
 * Short code search form module
 */
.short-code-search-form {
	position: relative;
}

.short-code-search-form input[type="search"] {
	line-height: 40px;
	padding: 20px 20px 20px 90px;
	box-shadow: 0px 5px 15px 0px #428ac944;
	background: #ffffff;
	border: 0px solid #dddddd;
	border-radius: 40px;
	width: 100%;
}

.short-code-search-form input[type="search"]:focus {
	box-shadow: 0px 1px 6px 0px #aaaaaa;
}

.short-code-search-form input.search-icon,
.short-code-search-form input.search-icon:focus,
.short-code-search-form input.search-icon:hover,
.short-code-search-form input[type="button"],
.short-code-search-form input[type="button"]:focus,
.short-code-search-form input[type="button"]:hover {
	border-radius: 40px;
	position: absolute;
	top: 0;
	bottom: 0;
	border-width: 1px;
	width: 60px;
	opacity: 0.5;
	border-color: transparent;
	-webkit-transition : border-color 500ms ease-out;
	-moz-transition : border-color 500ms ease-out;
	-o-transition : border-color 500ms ease-out;
	transition : border-color 500ms ease-out;
}

.short-code-search-form input.search-icon,
.short-code-search-form input.search-icon:focus,
.short-code-search-form input.search-icon:hover {
	background: transparent no-repeat center center url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pjxzdmcgdmlld0JveD0iMCAwIDMyIDMyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjx0aXRsZS8+PGcgaWQ9InNlYXJjaCI+PHBhdGggZD0iTTI5LjcxLDI4LjI5bC02LjUtNi41LS4wNywwYTEyLDEyLDAsMSwwLTEuMzksMS4zOXMwLC4wNSwwLC4wN2w2LjUsNi41YTEsMSwwLDAsMCwxLjQyLDBBMSwxLDAsMCwwLDI5LjcxLDI4LjI5Wk0xNCwyNEExMCwxMCwwLDEsMSwyNCwxNCwxMCwxMCwwLDAsMSwxNCwyNFoiLz48L2c+PC9zdmc+");
	background-size: 30px;
}

.short-code-search-form input[type="button"],
.short-code-search-form input[type="button"]:focus,
.short-code-search-form input[type="button"]:hover {
	display: none;
	right: 0;
	background: transparent no-repeat center center url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pjxzdmcgdmlld0JveD0iMCAwIDMyIDMyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDpub25lO3N0cm9rZTojMDAwO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2Utd2lkdGg6MnB4O308L3N0eWxlPjwvZGVmcz48dGl0bGUvPjxnIGlkPSJjcm9zcyI+PGxpbmUgY2xhc3M9ImNscy0xIiB4MT0iNyIgeDI9IjI1IiB5MT0iNyIgeTI9IjI1Ii8+PGxpbmUgY2xhc3M9ImNscy0xIiB4MT0iNyIgeDI9IjI1IiB5MT0iMjUiIHkyPSI3Ii8+PC9nPjwvc3ZnPg==");
	background-size: 30px;
}

.short-code-search-form.prepopulated input[type="button"] {
	display: block;
}

.short-code-search-form input.search-icon:focus,
.short-code-search-form input.search-icon:hover,
.short-code-search-form input[type="button"]:focus,
.short-code-search-form input[type="button"]:hover {
	border-color: #428ac9;
}

.short-code-search-form.prepopulated input.search-button {
	display: none;
}

.short-code-search-form input.search-button {
	position: absolute;
	top: 10px;
	bottom: 10px;
	right: 10px;
	border-radius: 40px;
	padding: 0 30px;
	font-size: 21px;
	font-weight: 500;
	-webkit-transition : background-color 250ms ease-out;
	-moz-transition : background-color 250ms ease-out;
	-o-transition : background-color 250ms ease-out;
	transition : background-color 250ms ease-out;
}

.short-code-search-form input.search-button:focus,
.short-code-search-form input.search-button:hover {
	background-color: #000000;
}

