/*------------------------------------------------------------------
[Table of contents]

1. Reset css
2. General
3. Left informations
4. Buttons
5. Social networks
6. Bootstrap overrides
7. Form 
8. ContactMe overrides
9. Media queries
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[1. Reset css]
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}

* {font-family:Helvetica,Arial,Sans-serif;font-weight:200;color:#000;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html, body {margin:0;padding:0;border:0;}
strong, b{font-weight:700;}
a:hover, a:focus, a:active, a:hover *, a:focus *, a:active * {outline:none;text-decoration:none;}
a {-webkit-transition:all 0.4s ease-out;-moz-transition:all 0.4s ease-out;-ms-transition:all 0.4s ease-out;-o-transition:all 0.4s ease-out;transition:all 0.4s ease-out;cursor:pointer;text-decoration:none;color:inherit;}
input {line-height:normal;}
input, textarea, select {-webkit-appearance:none;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;}
textarea {vertical-align:top;}
input:focus, select:focus, textarea:focus {outline:none;}

/*------------------------------------------------------------------
[2. General]
*/
html {height:100%;}
body {background:#FFF;min-height:100%;height:100%;overflow-x:hidden;}
.gallery-items {display:none;}
.j-hide {display:none;}

.jonny {background:#FFF;display:table;width:100%;min-height:100%;height:1px;text-align:center;}
.jonny > div {overflow:hidden;display:table-cell;vertical-align:top;height:0;}

/*------------------------------------------------------------------
[3. Left informations]
*/
.jonny .infos {width:66%;position:relative;}
.jonny .infos > img {position:absolute;top:0;left:50%;height:100%;width:auto;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);z-index:5;}
.jonny .infos > .videoCover {position:absolute;top:0;left:0;height:100%;width:100%;background:#000;z-index:5;}
.jonny .infos > .videoCover iframe {position:absolute;top:0;width:100%;height:100%;}
.jonny .infos .contain {position:relative;z-index:10;width:100%;height:100%;display:table;}
.jonny .infos .contain > div {display:table;width:100%;height:100%;padding:50px 40px;box-sizing:border-box;background:rgba(0,0,0,0.65);}
.jonny .infos .contain > div > div {display:table-cell;vertical-align:middle;width:100%;height:auto;}
.jonny .infos .logo {max-height:145px;}
.logob {max-height: 145px;margin: 25px 0;}
.jonny .infos .title {margin-top:20px;font-family:'Montserrat',sans-serif;font-size:70px;line-height:66px;font-weight:800;color:#FFF;word-break:break-word;}
.jonny .infos .description {margin:10px auto 0 auto;display:block;width:70%;font-size:16px;line-height:22px;color:#FFF;word-break:break-word;}
.jonny .infos .buttoninfo {margin:10px auto 0 auto;display:block;width:70%;font-size:18px;margin-top:30px;line-height:14px;color:#FFF;word-break:break-word;}
.jonny .infos .countdown {margin-top:10px;font-size:0;}
.jonny .infos .countdown > div {display:inline-block;margin-top:20px;text-align:center;}
.jonny .infos .countdown > div > div {width:90px;height:90px;margin:0 10px;font-size:44px;line-height:39px;font-weight:600;padding:23px 0;box-sizing:border-box;text-align:center;color:#FFF;border:solid 4px #FFF;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;}
.jonny .infos .countdown > div > span {display:block;margin-top:6px;font-size:14px;line-height:14px;font-weight:600;color:#FFF;}
.jonny .infos .phone {display:block;margin-top:32px;padding-top:64px;font-size:36px;line-height:20px;font-weight:bold;color:#FFF;word-break:break-word;background-repeat:no-repeat;background-size:50px 50px;background-position:top center;background-image:url(../img/social/telegram.png);}

/*------------------------------------------------------------------
[4. Buttons]
*/
.buttons {font-size:0;text-align:left;}
.buttons.centered {text-align:center;}
.jonny .infos .buttons {margin-top:8px;}
.buttons > a {display:inline-block;margin:10px 10px 0 10px;box-sizing:border-box;font-size:14px;line-height:14px;font-weight:bold;color:#FFF;text-align:center;padding:13px 20px;min-width:140px;border:solid 1px #FFF;-moz-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;}
.buttons > a:hover {opacity:0.9;}
.buttons > a.icon {padding-left:60px;background-repeat:no-repeat;background-size:36px;background-position:left 12px center;}
.buttons > a.icon-calc {background-image:url(../img/ui/calc.png);}
.buttons > a.icon-price {background-image:url(../img/ui/price.png);}
.buttons > a.icon-pic {background-image:url(../img/ui/pic.png);}
.buttons > a.icon-maps {background-image:url(../img/ui/maps.png);}
.buttons > a.sky-blue {background-color:#3F9FFF;border-color:#3F9FFF;}
.buttons > a.light-green {background-color:#00D466;border-color:#00D466;}
.buttons > a.black {background-color:#111111;border-color:#111111;}
.buttons > a.light-orange {background-color:#E99C4D;border-color:#E99C4D;}
.buttons > a.strong-orange {background-color:#E86D4B;border-color:#E86D4B;}
.buttons > a.dark-green {background-color:#295E4F;border-color:#295E4F;}
.buttons > a.blue-navy {background-color:#22315E;border-color:#22315E;}
.buttons > a.blue-ocean {background-color:#324AAE;border-color:#324AAE;}
.buttons > a.special {background-color:#FF8222;border-color:#FF8222;}
.buttons > a.green-moss {background-color:#5E8E7C;border-color:#5E8E7C;}
.buttons > a.red {background-color:#E65644;border-color:#E65644;}
.buttons > a.old-purple {background-color:#4A374E;border-color:#4A374E;}

/*------------------------------------------------------------------
[5. Social networks]
*/
.jonny .infos .social {margin-top:32px;font-size:0;}
.jonny .infos .social > a {display:inline-block;width:40px;height:40px;margin:5px;border:solid 3px #FFF;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;background-repeat:no-repeat;background-size:26px 26px;background-position:center center;}
.jonny .infos .social > a.facebook {background-image:url(../img/social/facebook.png);}
.jonny .infos .social > a.whatsapp {background-image:url(../img/social/whatsapp.png);}
.jonny .infos .social > a.telegram {background-image:url(../img/social/telegram.png);}
.jonny .infos .social > a.instagram {background-image:url(../img/social/instagram.png);}
.jonny .infos .social > a.tiktok {background-image:url(../img/social/tiktok.png);}
.jonny .infos .social > a.youtube {background-image:url(../img/social/youtube.png);}
.jonny .infos .social > a.sitelink {background-image:url(../img/social/site.png);}

/*------------------------------------------------------------------
[6. Bootstrap overrides]
*/
/* Modal */
.customModal .modal-content {padding-bottom:40px;border:none;overflow:hidden;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}
.customModal .modal-content .fit-width {width:100%;height:auto;}
.customModal .modal-content img {margin:0 0 15px 0;}
.customModal .modal-content h3 {margin:40px;padding:0;font-family:Montserrat,sans-serif;font-size:30px;line-height:30px;font-weight:800;color:#000;}
.customModal .modal-content p {margin:0 40px 15px 40px;padding:0;font-size:14px;line-height:16px;color:#000;}
.customModal .modal-content .marginTop {margin-top:40px;}
/* Popover */
.popover .popover-content {text-align:center;}
.popover .popover-content .j-hide {display:block;}

/*------------------------------------------------------------------
[7. Form]
*/
.jonny .form {width:34%;min-width:340px;}
.jonny .form > div {display:table;width:100%;height:100%;padding:50px 20px;box-sizing:border-box;}
.jonny .form > div > div {display:table-cell;vertical-align:middle;width:100%;height:auto;}
.jonny .form > div > div > h3 {font-family:'Montserrat',sans-serif;font-weight:800;font-size:30px;line-height:30px;margin-bottom:30px;}
.jonny .form > div > div > h3 > span {color:#2ECC71;font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;}

/*------------------------------------------------------------------
[8. ContactMe overrides]
*/
.contactMe .btn {width:100% !important;background:#FF8222 !important;-moz-border-radius:4px !important;-webkit-border-radius:4px !important;border-radius:4px !important;-moz-box-shadow:0 3px 0 0 #FF8222;-webkit-box-shadow:0 3px 0 0 #FF8222;box-shadow:0 3px 0 0 #FF8222;}

/*------------------------------------------------------------------
[9. Media queries]
*/
@media only screen and (max-width:1049px) {
	.jonny .infos .title {margin-top:50px;font-size:40px;line-height:36px;}
}
@media only screen and (max-width:767px) {
	.jonny {display:block;}
	.jonny .infos {display:table;width:100%;min-height:100%;}
	.jonny .infos .contain {display:table-cell;}
	.jonny .infos .title {margin-top:12px;font-size:33px;line-height:32px;}
	.jonny .form {display:block;width:100%;height:auto;min-width:250px;}
	.jonny .form > div {display:block;}
	.jonny .form > div > div {display:block;}
}
@media only screen and (max-width:449px) {
	.jonny .infos .description {width:100%;}
}
.tada {animation: tada 4s infinite;}
@keyframes tada {
	0% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
	10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);}
	30%, 50%, 70%, 90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);}
	40%, 60%, 80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);}
	100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
.pulse {animation: pulse 2s infinite;}
@keyframes pulse {
	0% {-moz-box-shadow: 0 0 0 0 rgba(249,211,71,1);box-shadow: 0 0 0 0 rgba(249,211,71,1);}
	70% {-moz-box-shadow: 0 0 0 10px rgba(249,211,71,0);box-shadow: 0 0 0 10px rgba(249,211,71,0);}
	100% {-moz-box-shadow: 0 0 0 0 rgba(249,211,71,0);box-shadow: 0 0 0 0 rgba(249,211,71,0);}
}
@media only screen and (max-width:767px) {
	.mhide{display:none!important;}
}
@media only screen and (min-width:768px) {
	.dhide{display:none!important;}
}
.invnumber{
	display:none;
	text-align: left;
	background-color: #1E2021;
	padding: 10px;
	border-radius: 3px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	right: -4px;
	color: #FFF;
	font-size: 13px;
	line-height: 1.4;
	margin-top: 8px;
	transform-origin: 100% 0%;
	-webkit-animation: fadeIn 0.3s ease-in-out;
	animation: fadeIn 0.3s ease-in-out;
}
.invnumber:before{
	float: left;
	content: '';
	width:0;
	height: 0;
	border:6px solid transparent;
	border-bottom-color:#1E2021;
    margin-top: -22px;
    margin-left: 10px;
}
@-webkit-keyframes fadeIn {
	0% {opacity:0;transform: scale(0.6);}
	100% {opacity:100%;transform: scale(1);}
}
@keyframes fadeIn {
	0% {opacity:0;}
	100% {opacity:100%;}
}