body.homepage {
    padding: 0;
    background-color: #fff;
}

body.homepage .navbar-default {
    background: rgba(255,255,255,0) !important;
    border: 0 !important;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
}
body.homepage .navbar-default.transparent {
    background: rgba(0,0,0,0.66) !important;
    border: 0 !important;
}

body.homepage .navbar.navbar-up {
    top: 0px;
}

body.homepage .navbar.navbar-down {
    top: -80px;
}

body.homepage .navbar .search {
    display: none;
}
body.homepage .navbar-default .navbar-nav>li>a {
    color: #FFF;
}

body.homepage .logo {
    background-image: url('../png/logo_inverse.png');
}

body.homepage .navbar .btn-outline {
    border-width: 2px !important;
    border-radius: 150px;
    min-width: 120px;
}

body.homepage .video-loading {
    display: block;
    margin: 150px auto 0;
}

body.homepage div.hero {
    width: 100%;
    height: 600px;
    padding-top: 110px;
    padding-bottom: 80px;
    font-weight: 700;
    /*background-color: #00c2cc;
    background: url(../img/dotted.png) center/auto repeat,linear-gradient(135deg,#00c2cc 0,#6f95d3 100%) fixed;
    background: linear-gradient(135deg,#00c4cc 0,#6e44bd 100%);
    background: linear-gradient(to top, #00c2cc 0%, #6f95d3 100%);*/
    background: #fff;
    position: relative;
}

body.homepage div.hero .stripes {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    transform: skewY(-5deg);
    transform-origin: 0;
    background: linear-gradient(150deg,#53f 15%,#05d5ff 70%,#a6ffcb 94%);
    background: url(../png/dotted6654.png) center/auto repeat, linear-gradient(45deg,#239bc1,#01bfc7);
    /* background: linear-gradient(150deg,#335fff 15%,#05d5ff 70%,#a6ffcb 94%);
    background: url(../img/dotted.png) center/auto repeat,  linear-gradient(135deg, #00c4cc 25%, #016BC0 75%); */
}

body.homepage div.hero h1 {
    font-size: 46px;
    color: #fff;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 1.3;
}

body.homepage div.hero p {
    font-size: 20px;
    font-weight: 400;
    margin-top: 20px;
    color: #d9fcff;
}

body.homepage div.hero .btn.btn-success {
    padding: 16px 28px;
    font-size: 16px;
    background-color: #abc722;
    background-color: #a754bc;
    background-color: #4ed99b;
}

body.homepage div.hero .btn.btn-link {
    font-size: 16px;
    color: #FFF;
    text-decoration: none;
}

.loadervideo {
    text-align: center;
    padding: 50px;
}
body.homepage div.hero .btn.btn-link:hover {
    color: #e3fa69;
}

body.homepage div.hero .laptop {
    width: 100%;
    max-width: 600px;
    margin-top: 45px;
}

body.homepage div.hero .laptop-frame {
    width: 90%;
    margin: 0 auto;
    background-color: #0d1423;
    border-radius: 8px 8px 0 0;
    padding: 10px 10px 14px 10px;
}

body.homepage div.hero .laptop-placeholder {
    min-height: 245px;
    background-color: #fff;
}

body.homepage div.hero .laptop-shadow {
    width: 50px;
    margin: 0 auto;
    background-color: #d3dde5;
    height: 5px;
    border-radius: 0 0 80px 80px;
}

body.homepage div.hero .laptop-down {
    background-color: #c1c8d2;
    width: 100%;
    height: 15px;
    border-radius: 0 0 80px 80px;
}
body.homepage div.hero .home-video {
    width: 100%;
}

body.homepage h2 {
    font-size: 46px;
    font-weight: 700;
}

body.homepage section.features {
    padding-top: 80px;
    padding-bottom: 80px;
    background-color: #fff;
}


.imac {
    background-image: url(../png/cinema-display.png);
    width: 700px;
    background-size: 640px;
    height: 565px;
    background-repeat: no-repeat;
    position: absolute;
    right: -132px;
    top: 11px;
}


body.homepage div.info-box {
    padding: 0 10px;
}
body.homepage div.info-box.info-box-left {
    margin-bottom: 30px;
    position: relative;
    text-align: left;
    height: 110px;
}

body.homepage div.info-box.info-box-left .img {
    width: 40px;
    height: 40px;
    position: relative;
    float: left;
    color: #0FACF3;
    font-size: 35px;
    line-height: 40px;
}


body.homepage .dropdown-notifications .dropdown-toggle {
    color: #fff;
}

.info {
    position: relative;
    margin: 10px 0 0 50px;
}

.info .hd {
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: normal;
}

.info-box-left .sub-txt {
    font-size: 15px;
    line-height: 1.6;
    color: #8392a0;
}

.title {
    margin-bottom: 20px;
    font-weight: 400;
    color: #3b4c5c;
    line-height: 1.2;
}

.title-sub {
    font-size: 20px;
    margin-bottom: 40px;
    font-weight: 400;
    color: #97a3ae;
}


body.homepage .btn-xxl {
    padding: 16px 30px;
    font-size: 22px;
}


body.homepage section.mockups {
    padding: 120px 0px 60px;
    background-color: #fff;
}
body.homepage section.mockups .title {
    font-size: 46px;
    padding-top: 10px;
    color: #4575c3 !important;
}
body.homepage section.mockups .title-sub {
    font-size: 24px;
}

.text-vcenter {
    position: relative;
	top: 50%;
	transform: translateY(-50%);
    height: auto;
}

body.homepage section.templates {
    padding: 80px 0px 60px;
    background-color: #64e9ea;
    background: linear-gradient(to bottom right,#6896c5 0,#64e9ea 100%);
    background: url(../dotted.html), linear-gradient(45deg, #c5e237 0%, #9cfff2 100%) fixed;
    background: url(../dotted.html), linear-gradient(45deg, #63cad8 0%, #3b409b 100%) fixed;
    background: url(../dotted.html), linear-gradient(45deg, #c2f1d1 0%, #c1e6e9 100%) fixed;
    background: #4CA1AF;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #C4E0E5, #4CA1AF);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to bottom, #C4E0E5, #4CA1AF); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
body.homepage section.templates .title {
    font-size: 46px;
    padding-top: 10px;
    color: #FFF !important;
}
body.homepage section.templates .title-sub {
    font-size: 24px;
    color: #f5f5f5;
}


body.homepage section.templates div.template {
    display: inline-block;
    /*width: 20%;*/
    /*float: left;*/
}

body.homepage section.templates div.template > div.inner {
    padding: 5px;
}

body.homepage section.templates div.template > div.inner > a > img {
    width: 100%;
    border-radius: 6px;
    box-shadow: 3px 3px 5px rgba(0,0,0,.15);
}


/* Section Social Media Sizes*/
body.homepage section.social-media-sizes {
    padding: 120px 0px 60px;
    background-color: #fff;
}
body.homepage section.social-media-sizes .aspect-choice span {
    /*width: 100px;
    margin-left: -50px;
    display: inline-block;
    word-break: break-word;*/
    font-size: 9px;
}

/* Section Features List */
body.homepage section.features-list {
}
body.homepage section.features-list .feature {
    margin-bottom: 100px;
}
body.homepage section.features-list .feature h3 {
    font-weight: 400;
    font-size: 33px;
    color: #3b4c5c;
}
body.homepage section.features-list .feature p {
    font-weight: 300;
    font-size: 18px;
    color: #3b4c5c;
}
body.homepage section.features-list .feature img {
    max-width: 380px;
}


.modal-home-video .icon-close {
    position: absolute;
    top: -40px;
    right: -42px;
    font-size: xx-large;
    color: #FFF;
    cursor: pointer;
}

.modal-home-video img {
    border-radius: 8px;
}

.collaborative-items {
    margin-top: 30px;
}
.collaborative-item {
    text-align: center;
    /*background-color: rgba(0,0,0,.02);*/
    padding: 25px 0;
    border-radius: 8px;
}

.collaborative-item h3 {
    font-weight: 700;
    font-size: 28px;
}
.collaborative-item .icon {
    font-size: 30px;
    color: #0facf3;
    /*display: none;*/
    /*border: 2px solid #0facf3;*/
    /*padding: 20px;*/
    /*border-radius: 50%;*/
    /*width: 60px;*/
    /*height: 60px;*/
}