/*

|----------------------------------------------------------------------------

	Contact Buttons - All in One Button with Mailchimp Subscribe and Callback Request Form WordPress Plugin

	Author: MGScoder

	Author URL: https://codecanyon.net/user/mgscoder

	Version: 1.3

|----------------------------------------------------------------------------

*/

#cbdemoContent {

	max-width: 900px;

	margin: 0 auto;

	padding: 60px 15px;

}

#cbdemoContent img {

	max-width: 100%;

}

.text-center {

	text-align: center;

}



#mgscbcontact-buttons-widget {

	position: fixed;

	left: -60px;

	width: 32px;

	z-index: 99999;

}

#mgscbcontact-buttons-widget.slide-on-scroll {

	position: absolute;

}

#mgscbcontact-buttons-widget .cbcontact-button-link  {

	display: block;

	width: 32px;

	height: 32px;

	padding: 0;

	margin: 1px 0;

	text-align: center;

	line-height: 32px;

	font-size: 18px;

	background-color: #8e8e93;

	color: #fff;

	position: relative;

	left: 0;

	border-radius: 50%;

	-webkit-box-sizing: border-box;

	box-sizing: border-box;  

	-webkit-transition: all 250ms;

	transition: all 250ms;

}

#mgscbcontact-buttons-widget .cbcontact-button-link:hover, #mgscbcontact-buttons-widget .cbcontact-button-link:focus, #mgscbcontact-buttons-widget .cbcontact-button-link:active {

	color: #fff;

}

#mgscbcontact-buttons-widget .cbcontact-button-link:hover {

	color: #fff;

	-webkit-animation: fa-spin 5s 1 linear;

	animation: fa-spin 5s 1 linear;

	-webkit-animation-delay: 5s;

    animation-delay: 5s;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-hidden {

	left: -60px;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.bspace {

	margin-top: 5px;

}

#mgscbcontact-buttons-widget .show-hide-contact-icon-bar,

#mgscbcontact-buttons-widget .cbcontact-button-link.show-hide-contact-icon-bar:focus,

#mgscbcontact-buttons-widget .cbcontact-button-link.show-hide-contact-icon-bar:active {

	background-color: #0000ff;

	color: #fff;

	border: 0;

	outline: 0;

	padding: 0;

	width: 32px;

	border-radius: 50%;

	margin-top: 5px;

	margin-bottom: 5px;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.show-hide-contact-icon-bar:hover {

	color: #000;

	background-color: #ccc;

	padding: 0;

	width: 32px;

}



#mgscbcontact-buttons-widget .show-hide-contact-icon-bar .fa-times {

    color: #ff0000;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-facebook, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-facebook:hover {

    background-color: #3b5998;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-twitter, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-twitter:hover {

    background-color: #00acee;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-googleplus, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-googleplus:hover {

    background-color: #dd4b39;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-linkedin, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-linkedin:hover {

    background-color: #0077b5;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-instagram, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-instagram:hover {

    background-color: #495057;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-vimeo, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-vimeo:hover {

    background-color: #1ca7cc;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-pinterest, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-pinterest:hover {

    background-color: #cb2027;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-dribbble, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-dribbble:hover {

    background-color: #ec4a89;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-github, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-github:hover {

    background-color: #2b3137;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-behance, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-behance:hover {

    background-color: #8e8e93;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-subscribe, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-subscribe:hover {

    background-color: #fb9902;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-digg, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-digg:hover {

    background-color: #495057;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-youtube, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-youtube:hover {

    background-color: #fb0007;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-vimeo, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-vimeo:hover {

    background-color: #5d83aa;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-reddit, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-reddit:hover {

    background-color: #495057;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-xing, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-xing:hover {

    background-color: #666;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-tumblr, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-tumblr:hover {

    background-color: #8e8e93;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-whatsapp, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-whatsapp:hover {

    background-color: #495057;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-flickr, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-flickr:hover {

    background-color: #666;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-skype, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-skype:hover {

    background-color: #34b9f3;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-viber, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-viber:hover {

    background-color: #834995;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-telegram, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-telegram:hover {

    background-color: #2aa2d6;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-wordpress, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-wordpress:hover {

    background-color: #212529;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-fbmessanger, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-fbmessanger:hover {

    background-color: #0084ff;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-contactform, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-contactform:hover {

    background-color: #495057;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-callback, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-callback:hover {

    background-color: #53b232;

}



#mgscbcontact-buttons-widget .cbcontact-button-link.cb-phone, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-phone:hover {

    background-color: #8e8e93;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-email, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-email:hover {

    background-color: #666;

}



#mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn1, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn1:hover {

    background-color: #f7de7b;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn2, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn2:hover {

    background-color: #515669;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn3, #mgscbcontact-buttons-widget .cbcontact-button-link.cb-extrabtn3:hover {

    background-color: #627b83;

}



#mgscbcontact-buttons-widget .cbcontact-button-link.cb-ancor::after {

	font-size: 12px;

	line-height: 1.48;

	background-color: rgba(0, 116, 232, 0.98);

	color: #fff;

	content: attr(rel);

	display: block;

	margin-top: -30px;

	padding: 0 10px;

    border: 5px solid transparent;

    border-left: 4px solid #ff0000;

	border-radius: 10px;

	position: absolute;

	white-space: nowrap;

	opacity: 0;

	left: -9999px;

	-ms-transform: scale(0);

	-webkit-transform: scale(0);

	transform: scale(0);

	-webkit-transform-origin: 10% 50%;

	transform-origin: 10% 50%;

	-webkit-transition: opacity .1s ease .3s,left 0s ease .3s,margin-top 300ms ease .3s,-webkit-transform 300ms ease .3s;

	transition: opacity .1s ease .3s,left 0s ease .3s,margin-top 300ms ease .3s,-webkit-transform 300ms ease .3s;

}

#mgscbcontact-buttons-widget .cbcontact-button-link.cb-ancor:hover::after {

	font-size: 12px;

	line-height: 1.48;

	opacity: 1;

	margin-top: -30px;

	left: 38px;

	padding: 0 10px;

    border: 5px solid transparent;

    border-left: 4px solid #ff0000;

	border-radius: 10px;

	-ms-transform: scale(1);

	-webkit-transform: scale(1);

	transform: scale(1);

	-webkit-transition: opacity .1s ease .3s,left 0s ease,margin-top .3s ease .3s,-webkit-transform .3s ease .3s;

	transition: opacity .1s ease .3s,left 0s ease,margin-top .3s ease .3s,-webkit-transform .3s ease .3s;

}

	

.cbcontact-button-link .cbwaves {

	position: relative;

	display: inline-block;

	width: 50px;

	left: -9px;

	top: -42px;

	height: 50px;

	border-radius: 50%;

	border-width: 4px;

	border-style: solid;

	border-color: #043e7c;

	-webkit-animation-name: waves;

	animation-name: waves;

	-webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);

	animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);

	-webkit-animation-duration: 1s;

	animation-duration: 1s;

	-webkit-animation-iteration-count: infinite;

	animation-iteration-count: infinite;

}	



@-webkit-keyframes waves {

	0% {

		-ms-transform: scale(0.5);

		-webkit-transform: scale(0.5);

		transform: scale(0.5);

		opacity: 0.0;

	}

	25% {

		-ms-transform: scale(0.5);

		-webkit-transform: scale(0.5);

		transform: scale(0.5);

		opacity: 0.1;

	}

	50% {

		-ms-transform: scale(0.6);

		-webkit-transform: scale(0.6);

		transform: scale(0.6);

		opacity: 0.3;

	}

	75% {

		-ms-transform: scale(0.75);

		-webkit-transform: scale(0.75);

		transform: scale(0.75);

		opacity: 0.5;

	}

	100% {

		-ms-transform: scale(1);

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0.0;

	}

}

@keyframes waves {

	0% {

		-ms-transform: scale(0.5);

		-webkit-transform: scale(0.5);

		transform: scale(0.5);

		opacity: 0.0;

	}

	25% {

		-ms-transform: scale(0.5);

		-webkit-transform: scale(0.5);

		transform: scale(0.5);

		opacity: 0.1;

	}

	50% {

		-ms-transform: scale(0.6);

		-webkit-transform: scale(0.6);

		transform: scale(0.6);

		opacity: 0.3;

	}

	75% {

		-ms-transform: scale(0.75);

		-webkit-transform: scale(0.75);

		transform: scale(0.75);

		opacity: 0.5;

	}

	100% {

		-ms-transform: scale(1);

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0.0;

	}

}





/*

|----------------------------------------------------------------------------

	Mailchimp Subscribtion

|----------------------------------------------------------------------------

*/

.cbmodal-body {

	background-color: #eee;

	width: 300px;

	max-width: calc(100% - 120px);

	bottom: 100px;

	position: fixed;

	border-radius: 10px;

	padding: 30px 15px 50px;

}

.cbmodal-body.hidediv {

	left: -9999px;

	-ms-transform: scale(0);

	-webkit-transform: scale(0);

	transform: scale(0);

	-webkit-transform-origin: 10% 50%;

	transform-origin: 10% 50%;

	-webkit-transition: opacity .1s ease .3s,left 0s ease .3s,margin-top 300ms ease .3s,-webkit-transform 300ms ease .3s;

	transition: opacity .1s ease .3s,left 0s ease .3s,margin-top 300ms ease .3s,-webkit-transform 300ms ease .3s;

}

.cbmodal-body.showdiv {

	left: 70px;

	z-index: 99999;

	-ms-transform: scale(1);

	-webkit-transform: scale(1);

	transform: scale(1);

	-webkit-transition: opacity .1s ease .3s,left 0s ease,margin-top .3s ease .3s,-webkit-transform .3s ease .3s;

	transition: opacity .1s ease .3s,left 0s ease,margin-top .3s ease .3s,-webkit-transform .3s ease .3s;

}

.cbmodal-body h5 {

	font-size: 18px;

    color: #0147fe;

	text-transform: capitalize;

	letter-spacing: inherit;

	padding: 15px 0 0;

}

.cbmodal-body button.close {

    font-size: 42px;

	padding: 0;

	line-height: 1;

	font-weight: bold;

    border: none;

    right: -10px;

    position: absolute;

    top: -30px;

	width: 50px;height: 50px;

	background-color: #eee;

    color: #d22d2d;

	cursor: pointer;

	border-radius: 50%;

}



/* mc-form */

.cbmodal-body .mc-form-holder {

    margin: 0 auto 10px;

    max-width: 300px;

	position: relative;

}

.cbmodal-body .form-control {

    background-color: transparent;

    border: 1px solid #0147fe;

    border-radius: 5px;

    display: inline;

    height: 44px;

    padding: 3px 10px 5px;

    vertical-align: top;

	width: 260px;

}

.cbmodal-body  #mc-form .form-control {

    border-radius: 5px 0 0 5px;

	width: 210px;

}

.cbmodal-body .form-control:focus {

    border-color: #3e3e3e;

    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.075) inset, 0 0 6px 0 #0147fe;

    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.075) inset, 0 0 6px 0 #0147fe;

    outline: 0 none;

}

.cbmodal-body #mc-form .btn {

    background-color: #0147fe;

    border: medium none;

    border-radius: 0 4px 4px 0;

    box-sizing: border-box;

    color: #fff;

    display: inline;

    font-family: fontawesome;

    font-size: 18px;

    height: 44px;

    margin: 0 0 0 -6px;

	padding: 0;

    text-align: center;

    -webkit-transition: all 0.23s ease-in-out 0s;

    -moz-transition: all 0.23s ease-in-out 0s;

    -ms-transition: all 0.23s ease-in-out 0s;

    -o-transition: all 0.23s ease-in-out 0s;

    transition: all 0.23s ease-in-out 0s;

    width: 60px;

	cursor: pointer;

}

.cbmodal-body label {

    font-size: 16px;

	line-height: 1.2;

    font-weight: normal;

    left: 0;

    position: absolute;

    top: 45px;

}

.cbmodal-body .error {

    color: #d22d2d;

}

.cbmodal-body .valid {

    color: #37a000;

}



#msgContactSubmit.h3 {

    margin: 0 0 20px;

}

#msgContactSubmit.text-success {

    color: #37a000;

}

#msgContactSubmit.text-danger, .text-danger {

    color: #ce0606;

}



.cbmodal-body .form-group {

	width: 100%;

    margin: 0 0 15px;

}

#mgscbcontact-buttons-widget button.show-hide-contact-icon-bar, .btn {

	cursor: pointer;

}

#submitButtonHolder .btn.btn-custom {

	font-size: 16px;

	overflow: hidden;

	padding: 6px 25px;

	text-transform: uppercase;

    background-color: #0147fe;

    color: #fff;

    -webkit-box-shadow: 0 0 1px transparent;

    box-shadow: 0 0 1px transparent;

    display: inline-block;

    position: relative;

    vertical-align: middle;

	border-radius: 8px;

	border: 1px solid #0147fe;

}

input::placeholder {

  color: #666;

}

#submitButtonHolder {

    margin: 0;

}



/*

|----------------------------------------------------------------------------

	Math Captcha

|----------------------------------------------------------------------------

*/

#humanCheckCaptchaBox, #humanCheckCaptchaInput, #firstDigit, #secondDigit,  #mathfirstnum, #mathsecondnum {

    display: inline;

}

#humanCheckCaptchaInput.form-control {

    height: 30px;

    margin-left: 10px;

    padding: 4px;

    text-align: center;

    width: 45px;

}

#firstDigit #mathfirstnum, #secondDigit #mathsecondnum {

	border: none;

	box-shadow: none;

    width: 30px;

    height: 30px;

	padding: 0;

    pointer-events: none;

    text-align: center;

}





/*

|----------------------------------------------------------------------------

	Right Align

|----------------------------------------------------------------------------

*/	

#mgscbcontact-buttons-widget.hpright {

    right: -60px;

	left: auto;

}

#mgscbcontact-buttons-widget.hpright .cbcontact-button-link.cb-hidden {

    right: -60px;

	left: auto;

}

#mgscbcontact-buttons-widget.hpright .cbcontact-button-link {

	right: 0;

}



#mgscbcontact-buttons-widget.hpright .cbcontact-button-link.cb-ancor:hover::after {

    right: 45px;

	left: auto;

}



#mgscbcontact-buttons-widget.mobile-viewcb {

	position: fixed !important;

	top: auto !important;

	bottom: 40px !important;

}



#mgscbbuynowbtn-fixed-box {			

	position: fixed;

	right: 0;

	bottom: 50px;

	z-index: 99999;

}

#mgscbbuynowbtn-fixed-box .btn-holder {

	margin: 0;

}

#mgscbbuynowbtn-fixed-box .btn.btn-primary.btn-lg {

    background-color: #0000ff;

    padding: 6px 10px;

    color: #fff;

    border-radius: 6px 0 0 6px;

}





/*

|----------------------------------------------------------------------------

	Responsive

|----------------------------------------------------------------------------

*/

@media screen and (max-width: 767px) {

	.cbmodal-body {

		bottom: 40px;

		padding: 15px 15px 30px;

	}

	.cbmodal-body #callbackform #humanCheckCaptchaInput.form-control {

		width: 45px;

	}

}

@media screen and (max-width: 420px) {

	.cbmodal-body #callbackform .form-control {

		width: 250px;

		max-width: calc(100% - 78px);

	}

	.cbmodal-body #mc-form .form-control {

		width: 215px;

		max-width: calc(100% - 78px);

	}

	.cbmodal-body #mc-form .btn {

		width: 50px;

	}

}

@media screen and (max-width: 360px) {

	.cbmodal-body #callbackform .form-control {

		width: 230px;

		max-width: calc(100% - 30px);

	}

}

@media screen and (max-width: 320px) {

	.cbmodal-body #callbackform .form-control {

		width: 210px;

	}

	#firstDigit #mathfirstnum, #secondDigit #mathsecondnum {

		width: 20px;

	}

}



@media screen and (max-height: 568px) {

	#callbackform {

		max-height: calc(100vh - 240px);

		overflow-y: scroll;

		overflow-x: hidden;

	}

}