/* CSS Document */

.customize-support #header {
    top: 32px !important;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p,
a, em, img, strong, sub,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
    font-family: 'Blinker', sans-serif;
    color: #0e0e0e;
    min-width: 320px;
}

html, body {
	height: 100%;
}

ol, ul {
	list-style: none;
}

a,
a:hover,
a:focus,
a:active {
	text-decoration: none;
	outline: none !important;
}

a,
button{
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

.container {
	position: relative;
    /*min-width: 1430px;*/
}

.aligner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}





/*############################# HEADER #############################*/

#header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9;
    background: none;
    -webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

#header.active {
    background: #0e0e0e;
    z-index: 99;
}

#header .bottom-bar {
    padding: 10px 0;
}

#header .top-bar {
    border-bottom: 1px solid #eaeaea;
    text-align: right;
}

#header .top-bar .box {
    display: inline-block;
    border-left: 1px solid #eaeaea;
    line-height: 45px;
    padding: 0 20px;
}

#header .top-bar .box:last-child {
    border-right: 1px solid #eaeaea;
}

#header .top-bar .box p {
    display: inline-block;
    color: #FFF;
    font-size: 20px;
}

#header .top-bar .box .social {
    display: inline-block;
}

#header .top-bar .box .social li {
    display: inline-block;
    padding: 0 0 0 30px;
}

#header .top-bar .box .social li img,
#header .top-bar .box img.icon,
#footer .social li img {
    -webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

#header .top-bar .box .social li img:hover,
#header .top-bar .box img.icon:hover,
#footer .social li img:hover {
    margin-top: -10px;
}

#header .top-bar .box .social li:first-child {
    padding: 0 0 0 15px;
}

#header .navbar {
    padding: 0;
}

#main-menu {
    padding: 18px 0 0 0;
}

#main-menu li {
    padding: 0 28px;
    position: relative;
}

#main-menu > li:after {
    content: "|";
    position: absolute;
    display: ;
    right: -1px;
    top: 0;
    color: #FFF;
    font-size: 20px;
}

#main-menu li:hover a,
#main-menu li.show a {
    font-weight: 700;
}

#main-menu li:last-child {
    padding: 0 0 0 28px;
}

#main-menu > li:first-child {
    padding: 0 28px 0 0;
}

#main-menu li:last-child:after {
    display: none;
}

#main-menu a {
    color: #FFF;
    font-size: 20px;
}

#main-menu .dropdown-toggle:after {
    display: none;
}



#main-menu .dropdown-menu {
    background: rgba(10,10,10,0.53);
    border: none;
    border-radius: 0;
    right: 0;
    margin: 10px 0 0 0;
}

#main-menu .dropdown-menu a {
    position: relative;
    font-weight: 400 !important;
    font-size: 14px;
    padding: 5px 5px 5px 28px;
    display: block;
}

#main-menu .dropdown-menu a:before {
    content: "";
    position: absolute;
    left: 30px;
    top: 11px;
    background: url('../img/icon-menu-arrow.png') center no-repeat;
    display: block;
    width: 5px;
    height: 9px;
    display: none;
}

#main-menu .dropdown-menu a:hover:before {
    display: block;
}

#main-menu .dropdown-menu a:hover {
    font-weight: 700;
    padding-left: 41px;
    background-color: rgba(10,10,10,0.23);
}

#header .navbar-toggler {
    border: 1px solid #FFF;
    padding: 8px;
    position: absolute;
    right: 0;
    top: -45px;
}

#header .navbar-toggler-icon {
    display: block;
    width: 1.5em;
    height: 2px;
    background: #FFF;
    margin: 0 0 6px;
}

#header .navbar-toggler-icon:last-child {
    margin-bottom: 0;
}

#main-menu .dropdown-submenu {
  position: relative;
    padding: 0 !important;
}

#main-menu .dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-left: .1rem;
  margin-right: .1rem;
}

#main-menu .dropdown-submenu li {
    padding: 0 !important;
}

#main-menu .dropdown-submenu a:focus,
#main-menu .dropdown-submenu li a:active {
    background-color: rgba(10,10,10,0.23) !important;
}

/*############################# CONTENT #############################*/

#content {
    position: relative;
    width: 100%;
}

.main-banner {
    position: relative;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    height: 805px;
    clear: both;
}

.main-banner.bg1 {
    background-image: url('../img/main-banner-bg.jpg');
}

.main-banner.bg2 {
    background-image: url('../img/main-banner-bg2.jpg');
}

.main-banner.bg3 {
    background-image: url('../img/main-banner-bg3.jpg');
}

.main-banner.bg4 {
    background-image: url('../img/main-banner-bg4.jpg');
}

.main-banner.bg5 {
    background-image: url('../img/main-banner-bg5.jpg');
}

.main-banner.bg6 {
    background-image: url('../img/main-banner-bg6.jpg');
}

.main-banner.bg7 {
    background-image: url('../img/main-banner-bg7.jpg');
}

.main-banner.bg8 {
    background-image: url('../img/main-banner-bg8.jpg');
}

.main-banner.bg9 {
    background-image: url('../img/main-banner-bg9.jpg');
}

.main-banner.bg10 {
    background-image: url('../img/main-banner-bg10.jpg');
}

.main-banner.bg11 {
    background-image: url('../img/main-banner-bg11.jpg');
}

.main-banner.bg12 {
    background-image: url('../img/main-banner-bg12.jpg');
}

.main-banner.bg13 {
    background-image: url('../img/main-banner-bg13.jpg');
}

.main-banner.bg14 {
    background-image: url('../img/main-banner-bg14.jpg');
}

.main-banner.bg15 {
    background-image: url('../img/main-banner-bg15.jpg');
}

.main-banner.bg16 {
    background-image: url('../img/main-banner-bg16.jpg');
}

.main-banner h2 {
    color: #FFF;
    font-size: 35px;
    line-height: 40px;
    font-weight: 400;
    padding: 0 72px 0 0;
    letter-spacing: 1px;
}

.main-banner.images:before {
    content: "";
    position: absolute;
    left: -124px;
    top: 600px;
    background: url('../img/background-img1.png') no-repeat;
    width: 358px;
    height: 485px;
    display: block;
    z-index: 9;
}

.main-banner p.large {
    color: #FFF;
    font-size: 27px;
    line-height: 32px;
    font-weight: 400;
    padding: 0 72px 0 0;
    letter-spacing: 1px;
}

.main-banner.images:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 255px;
    background: url('../img/background-img2.png') no-repeat;
    width: 248px;
    height: 694px;
    display: block;
    z-index: 9;
}

.main-banner .text-shadow {
    text-shadow: 1px 1px 1px #000;
}

.main-banner h2.style2 {
    font-size: 27px;
    line-height: 30px;
    padding: 0 72px 0 0;
}

.main-banner.bg1 h2,
.main-banner.bg2 h2 {
    padding: 120px 72px 0 0;
}

.main-banner .arrow-down {
    position: absolute;
    left: 50%;
    bottom: 60px;
    z-index: 9;
    margin-left: -12px;
}

.icon-scroll,
.icon-scroll:before {
    position: absolute;
    left: 50%;
}
.icon-scroll {
    width: 25px;
    margin-left: 0;
    top: 50%;
    margin-top: -35px;
    border-radius: 25px;
}
.icon-scroll:before {
    content: '';
    width: 4px;
    height: 4px;
    background: #FFF;
    margin-left: -2px;
    top: 17px;
    border-radius: 4px;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: scroll;
}
@keyframes scroll {
    0%{opacity:1;}
    100%{opacity:0; transform:translateY(30px);}
}

.section {
    position: relative;
    width: 100%;
}

.section1 {
    background: #0e0e0e;
    height: 390px;
    padding-bottom: 40px;
}

.section1 h3 {
    color: #FFF;
    font-size: 30px;
    padding: 0 65px 0 130px;
}

.section1 .text {
    width: 83%;
}

.section1 .text p {
    color: #FFF;
    font-size: 20px;
    padding: 0 0 20px;
    line-height: 28px;
}

.float-box {
    width: 100%;
    background: #FFF;
    overflow: hidden;
    padding: 60px 0;
    box-shadow: 0 0 100px #0e0e0e;
    margin: -60px 0 35px;
}

.float-box p {
    width: 48%;
    margin: 0 auto;
    font-size: 26px;
    line-height: 27px;
    color: #0e0e0e;
}

.section2 {}

.section2 .box {
    position: relative;
    float: left;
    width: 25%;
    text-align: center;
    overflow: hidden;
}

.section2 .box img.bg {
    -webkit-transition: all .9s ease-out;
	-moz-transition: all .9s ease-out;
	-ms-transition: all .9s ease-out;
	-o-transition: all .9s ease-out;
}

.section2 .box:hover img.bg {
    transform: scale(1.1);
}

.section2 .box .text {
    position: absolute;
    top: 25%;
    left: 0;
    right: 0;
    z-index: 9;
}

.section2 .box .text h4 {
    font-size: 30px;
    line-height: 28px;
    color: #FFF;
}

.section2 .box .text .button {
    color: #FFF;
    font-size: 14px;
    border: 1px solid #FFF;
    border-radius: 20px;
    display: inline-block;
    padding: 1px 17px;
    margin: 20px 0 0 0;
}

.section2 .box .text .button:hover {
    color: #0e0e0e;
    background: #FFF;
}

.brands {
    clear: both;
    padding: 75px 0 60px;
    text-align: center;
}

.brands li {
    display: inline-block;
    padding: 0 60px;
    line-height: 60px;
    vertical-align: middle;
}

.brands li img {
    max-width: 100%;
}

.parallax {
    position: relative;
    width: 100%;
    height: 460px;
    background: url('../img/parallax-img.jpg') center no-repeat;
    background-attachment: fixed;
}

.section3 {
    padding: 60px 0 70px;
}

.section3 header {
    text-align: center;
    padding-bottom: 70px;
}

.section3 header h2 {
    font-size: 30px;
}

.section3 header p {
    font-size: 20px;
}

.section3 form {}

.section3 form label {
    display: block;
    font-size: 20px;
    padding-bottom: 10px;
}

.section3 form .file,
.section3 form input,
.section3 form textarea {
    display: block;
    border: 1px solid #cdcdcd;
    border-radius: 10px;
    height: 56px;
    width: 100%;
    padding: 0 10px;
    line-height: 56px;
    font-size: 20px;
    margin-bottom: 56px;
}

.section3 form textarea {
    resize: none;
    height: 135px;
    line-height: 20px;
}

.section3 form .small {
    position: absolute;
    bottom: 10px;
    left: 20px;
    font-size: 16px;
    line-height: 18px;
    color: #b6b6b6;
}

.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.section3 form label.button {
    color: #b6b6b5;
    background: #f0f0f0;
    border: 1px solid #cdcdcd;
    height: 47px;
    line-height: 47px;
    border-radius: 10px;
    float: right;
    padding: 0 25px;
    margin: 4px -6px 0 0;
    cursor: pointer;
}

.section3 form .bottom {
    text-align: right;
    margin: -15px 0 0 0;
}

.section3 form .captcha {
    display: inline-block;
}

.section3 form button {
    display: inline-block;
    background: #0e0e0e;
    border-radius: 10px;
    color: #FFF;
    font-size: 20px;
    height: 58px;
    line-height: 58px;
    border: none;
    padding: 0 110px;
    margin:  0 0 0 25px;
    cursor: pointer;
    border: 1px solid #0e0e0e;
}

.section3 form button:hover {
    background: #FFF;
    color: #0e0e0e;
}

#map-canvas {
	height: 330px;
	width: auto;
}

#interactive-image {
    position: relative;
    background: url('../img/interactive-image.jpg') right top no-repeat;
    background-size: auto 100%;
    height: 937px;
    overflow: hidden;
}

#interactive-image .items {
    position: absolute;
    right: 112px;
    top: 94px;
    bottom: 0;
    width: 50%
}

#interactive-image .items .button {
    position: relative;
    background: #0e0e0e;
    border-radius: 100%;
    width: 27px;
    height: 27px;
    text-align: center;
    color: #FFF;
    font-size: 15px;
    line-height: 27px;
    display: block;
    z-index: 8;
}

#interactive-image .deploy {
    position: relative;
    background: #FFF;
    border-radius: 5px;
    padding: 17px 24px;
    margin-top: 15px;
    box-shadow: 0 0 24px #222;
    display: none;
    z-index: 10;
}

#interactive-image .items .button:after {
    content: "";
    width: 37px;
    height: 37px;
    position: absolute;
    top: -5px;
    left: -5px;
    border-radius: 100%;
    border: 1px solid#0e0e0e;
}

#interactive-image .items .item {
    position: absolute;
    width: 274px;
}

#interactive-image .items .item1 {
    top: 8px;
    right: 53px;
}

#interactive-image .items .item2 {
    top: 337px;
    right: 50px;
}

#interactive-image .items .item3 {
    top: 699px;
    right: 55px;
}

#interactive-image .items .item4 {
    top: 294px;
    right: 376px;
}

#interactive-image .items .item5 {
    top: 413px;
    right: 225px;
}

.half-text {
    padding: 120px 0;
    clear: both;
}

.half-text h3 {
    font-size: 30px;
}

.half-text li {
    font-size: 19px;
}

.half-text p {
    font-size: 20px;
}

/*############################# FOOTER #############################*/

#footer {}

#footer .top {
    padding: 30px 0 27px;
}

#footer .top ul {
    padding: 15px 0 0 0;
}

#footer .top li {
    position: relative;
    display: inline-block;
    font-size: 18px;
    padding: 0 40px 0 0;
}

#footer .top li:after {
    content: "|";
    position: absolute;
    display: block;
    right: 15px;
    top: -1px;
    color: #0e0e0e;
    font-size: 20px;
}

#footer .top li:last-child:after {
    display: none;
}

#footer .top li img {
    margin: -2px 2px 0 0;
}

#footer .top li a {
    color: #0e0e0e;
}

#footer .logo {
    float: right;
}

#footer .bottom {
    background: #0e0e0e;
    padding: 0 0 13px;
}

#footer .bottom p {
    color: #FFF;
    font-size: 16px;
    padding: 17px 0 0 0;
}

#footer .bottom p.label {
    display: inline-block;
    text-align: right;
}

#footer .bottom .social {
    display: inline-block;
    text-align: right;
}

#footer .bottom .social li {
    display: inline-block;
    padding: 0 0 0 30px;
}

#footer .bottom .social li:first-child {
    display: inline-block;
    padding: 0 0 0 10px;
}

