/* Site */
body {
    min-width: 1000px;
}
#body .container {
    margin-top: 80px;
    margin-bottom: 80px;
}

.content-wrapper {
    margin: 0 auto;
    max-width: 980px;
}

footer {
    padding: 40px 0px 40px 0px;
    background: url(../images/footer-bg.png) 0 0 repeat fixed;
    color:#fff;
}
    footer a {
        color:#ccc;
    }
        footer a:hover {
            color:#fff;
            text-decoration:none;
        }
.footer-middle-menu {
    float: left;
    width: 33.25%;
}
footer .powered-by {
    float:left;
    width: 33.25%;
}

.footer-menu {
    float: left;
    width: 33.25%;
}

.footer-menu li{
    list-style: none;
    margin-left: 0px;
    margin-top: 5px;
    margin-bottom: 3px;
}

.footer-menu li a {
    font-size: 21px;
}

.loading-block {
    position: absolute; height: 100%; background-color: white; opacity: 0.5; text-align: center; padding-top: 10%; margin-left: 0; z-index: 1000;
}

/* Dashboard */
.site-content.well {
    padding-top: 0px;
    padding-right: 0px;
}

.well.app-content {
    min-height: 404px;
    min-width: 180px;
    position: relative;
}

.app-name {
    overflow: hidden;
    text-align: center;
    margin: 0 0 20px 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.controls-row.app-content a {
    margin-left: 4px;
}

.app-content .btn-block + .btn-block {
    margin-top: 20px;
}

.app-content p + p {
    margin-bottom: 20px;
}

.app-contnet p + .btn {
    margin-bottom: 20px;
}

.dashboard-msg-item-timestamp {
    font-size: 10px;
}

/* Store */
.three-logo{
    width: 50px;
    float: left;
    height: 227px;
    background-image: url("../Images/3Logos.png");
    background-size: cover;
}

.store-price{
    float: left;
    font-size: 70px;
    margin-top: 108px;
    margin-left: 10px;
}

.well.product-content {
    min-height: 404px;
    min-width: 250px;
    position: relative;
}

.product-banner {
    width: 290px;
    margin-left: -20px;
}

.product-inner-container {
    padding: 10px 0;
    text-align: center;
}

.product-name {
    height: 40px;
    text-align: center;
    margin: auto;
    border: solid 1px #ccc;
    padding:8px;
    box-shadow: 0px 1px 4px #888;
}

.product-price {
    text-align: center;
    margin-bottom: 20px;
}

.store-page.product-price {
    margin-top: 70px;
    margin-bottom: 70px;
    font-size: 70px;
}

.product-description {
    margin-bottom: 20px;
}

.product-buy {
    position: absolute; bottom: 0; left: 0; width: 100%;
}

/* Login */
.logo-image {
    height:60px;
}
#login {
    position: relative;
    top: 15px;
}

    #login a {
        margin-top: 0;
    }

#logoutForm {
    display: inline;
}

/* Wizard */

.PageList {
    height: 205px;
    overflow-y: auto;
    border: solid 1px black;
}

.CategoryList {
    height: 345px;
    overflow-y: auto;
    border: solid 1px black;
}

.PageList div, .CategoryList li {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#saveButton {
    max-height: 30px;
    min-width: 60px;
}

iframe#preview.android {
    -moz-transform: scale(0.69);
    -o-transform: scale(0.69);
    -webkit-transform: scale(0.69);
    -ms-transform: scale(0.69);
    position: absolute;
    width: 360px;
    height: 640px;
    left: -25px;
    top: 45px;
}

iframe#preview.apple {
    -moz-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -ms-transform: scale(0.7);
    position: absolute;
    width: 320px;
    height: 568px;
    left: -19px;
    top: 54px;
}

iframe#preview.windows {
    -moz-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -ms-transform: scale(0.7);
    position: absolute;
    width: 320px;
    height: 533px;
    left: -20px;
    top: 60px;
}

.android-show, .apple-show, .winphone-show { display:none; }
.android-show.btn, .apple-show.btn, .winphone-show.btn { display: none;}

#wizard-tab[rel=android] .android-show { display:inherit;}
#wizard-tab[rel=apple] .apple-show { display:inherit; }
#wizard-tab[rel=winphone] .winphone-show { display:inherit; }

/* Submit Form*/
#AppGenContent .tab-pane {
    height: 90px;
}

#AppGenerationForm .control-group:not(:first-child)  {
    display: none;
}

.couponApplied {
    color: #468847;
}

/* Picture Uploader */

.control-group.picture-upload {
    height: 50px;
}

.qq-uploader {
    position: relative;
    width: 100%;
}

.control-group.error .qq-upload-button {
    border: solid red 1px;
}

.qq-upload-button {
    display: block;
    width: 100px;
    padding: 0px;
    text-align: center;
    background: transparent;
    border-bottom: 1px solid #DDD;
    color: #FFF;
    float: left;
}

    .qq-upload-button:hover {
        cursor:pointer;
    }

.qq-upload-button-hover {
    background: #ccc;
    opacity: 0.6;
    cursor: pointer;
}

.qq-upload-button-focus {
    outline: 1px dotted #000000;
}

.qq-upload-drop-area, .qq-upload-extra-drop-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 30px;
    z-index: 2;
    /*background: #FF9797;*/
    text-align: center;
    display: none !important;
}

    .qq-upload-drop-area span {
        display: none;
        position: absolute;
        top: 50%;
        width: 100%;
        margin-top: -8px;
        font-size: 16px;
    }

.qq-upload-extra-drop-area {
    position: relative;
    margin-top: 50px;
    font-size: 16px;
    padding-top: 30px;
    height: 20px;
    min-height: 40px;
}

.qq-upload-drop-area-active {
    background: #FF7171;
}

.qq-upload-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.qq-upload-list li {
    margin: 0;
    padding: 0;
    line-height: 15px;
    font-size: 16px;
    background-color: #FFF0BD;
}

.qq-upload-file {
    display: none !important;
}

.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text, .qq-upload-finished {
    margin: 2px;
}

.qq-upload-file {
    font-size: 10px;
}

.qq-upload-spinner {
    display: inline-block;
    background: url("../Images/loading.gif");
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
}

.qq-drop-processing {
    display: none;
}

.qq-drop-processing-spinner {
    display: inline-block;
    background: url("../Images/processing.gif");
    width: 24px;
    height: 24px;
    vertical-align: text-bottom;
}

.qq-upload-finished {
    display: none;
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
}

.qq-upload-retry {
    display: none;
    color: #000000;
}

.qq-upload-cancel {
    color: #000000;
}

.qq-upload-retryable .qq-upload-retry {
    display: inline;
}
.qq-upload-size {
    display: none;
}
.qq-upload-size, .qq-upload-cancel, .qq-upload-retry {
    font-size: 10px;
    font-weight: normal;
}

.qq-upload-failed-text {
    display: none;
    font-style: italic;
    font-weight: bold;
}

.qq-upload-failed-icon {
    display: none;
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
}

.qq-upload-fail .qq-upload-failed-text {
    display: inline;
}

.qq-upload-retrying .qq-upload-failed-text {
    display: inline;
    color: #D60000;
}

.qq-upload-list li.qq-upload-success {
    background-color: #5DA30C;
    color: #FFFFFF;
    display: none;
}

.qq-upload-list li.qq-upload-fail {
    background-color: #D60000;
    color: #FFFFFF;
}

.qq-progress-bar {
    background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */
    width: 0%;
    height: 15px;
    border-radius: 6px;
    margin-bottom: 3px;
    display: none;
}

.image-upload-block {
    float: left;
    display: block;
    position: relative;
    padding: 0px 16px 0px 0px;
}

.attribute-uploader-delete-button {
    left: 50px;
    display: block;
    visibility: hidden;
    position: relative;
    background-image: url('../images/button-app-delete.png');
    height:20px;
    width:20px;
    background-size:contain;
}

.attribute-uploader-delete-button:hover {    
    background-image: url('../images/button-app-delete-hover.png');
    cursor:pointer;
}

.attribute-uploader {
    margin-right: 2px;
}

.qq-upload-button {
    width: 46px;
    height: 36px;    
    overflow: visible;    
    background-color: #ccc;
    margin: 0 auto;
    background-image: url('../images/upload-icon.png');
    background-position: center;
    background-repeat: no-repeat;
}

.qq-upload-button li{
    width: 80px;
    height: 80px;
}

.image-info.btn {
    position: relative;
    left: 51px;
    width: 16px;
    height: 16px;
    padding: 0;
}
.image-info.btn i {
    position: absolute;
    left: 1px;
    top: 0px;
}


/* End */


body {
    font-family: 'Roboto', sans-serif;
}

.center{
	font-size: 2.5em;
	padding: 80px 0 0 0;
	text-align: center;
}

#nav{
	list-style: none;
	position: fixed;
	right: 20px;
    top: 70px;
}
    #nav li{
	    margin: 0 0 15px 0;	
    }

.header-link {
    text-decoration: none;
    color: black;
    float: left;
    margin: 20px 20px 0;
}

.header-link:hover, .header-link:focus {
    text-decoration: none;
    color: black;
}

.phone {
    position: fixed;
    top: 80px;
    left: 50%;
    margin-left: -162px;/* half the width of the phone*/
    z-index:1025;
    background:url(../images/phones/iphone-white-flat.png) no-repeat;
    background-size: contain;
    /*width: 325px;
    height: 640px;*/
    height: 570px;
    /*background-position-x: center;*/
    background-position: center top;
    width: 325px;
}

#header, #first, #second{
	width: 100%;
}

#first{
	background:url(../images/homepage-bg.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 710px;
	margin: 0 auto;
	padding: 0;
    margin-top: 60px;
}

#second{
	background: url(../images/FrontPage/homepage-bg-2.jpg) 50% 0 no-repeat fixed;
	color: white;
    height: 600px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}

#third{
	background: url(../images/frontPage/homepage-bg-3.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 450px;
	/*padding: 100px 0 0 0;*/	
}
#LogoImageContent a {
    margin: 0px 20px 0px 20px;
}


#feature-text p {
    padding-top: 20px;
    text-align: center;
    font-size: 18px;
    display: none;
    background-color: transparent;
    border: none;
    margin: 0px;
    padding: 0px;
    width: 100%;
     
    float: none;
    position: relative;
    z-index: auto;
    top: auto;
    left: auto;
    bottom: auto;
    right: auto;
    overflow: hidden;
}

#fourth {
	background: url(../images/frontPage/homepage-bg-4.png) 0 0 repeat fixed;
    height:400px;
}

#fifth{
	background: #fff;
	height: 400px;
	margin: 0 auto;
	padding: 40px 0 0 0;
}

.getStartDiv {
    left: 80px;
    bottom: -16px;
    position:relative;
}
    .getStartDiv a { 
        border-radius: 15px;
    }

.getStartDivContainer {
    width: 242px;
    margin-left: 48px;
    height: 90px;
}

.getStartContent{
    text-align: center;
    margin-top: 85px;
}

.left { 
    float: left;
}
.right { 
    float: right;
}
.feature-container .row-content {
    margin: 0px;
}
.row-content {
    border-bottom: 2px solid #ccc;
    margin: 0px 0px 30px 0px;
}
    .row-content .row-left-40 {
        float:left;
        position:relative;
        width:40%;
    }
    .row-content .row-left-60 {
        float:left;
        position:relative;
        width:60%;
    }

.story .left, .story .right { width: 30%;}

.story .middle { margin-right: 9%;margin-top: 75px; }

.story {
	margin: 0 auto;
	min-width: 980px;
	overflow: auto;
	width: 1000px;
}

.float-left{    
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px;
    -webkit-box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
    -moz-box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
    box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
}
.float-right{    
	float: right;
	
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px;
    -webkit-box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
    -moz-box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
    box-shadow: inset 0px 0px 3px rgba(255, 255, 255, 1);
}

.story .float-right .promo {
    font-size:23px;
}
.story .float-right .promo a {
    color:#FFB900;
}


.story .float-left, .story .float-right{
	padding: 15px;
	position: relative;
	width: 260px;	
    background:rgba(204, 204, 204, 0.7);
    font-size: 1.3em;
    line-height: 31px;
}
    .story .float-left{
        margin-top:135px;
    }
    .story .float-right
    {
        margin-top:250px;
    }

    .front-image {
        float: left;
        width: 100px;
        height: 125px;
        margin: 3px;       
        background-repeat: no-repeat;
        background-size: contain;
    }

    .image-touch{ background-image: url('../Images/FrontPage/touch.png');}
    .image-magic {background-image: url('../Images/FrontPage/magic.png');}
    .image-engine {background-image: url('../Images/FrontPage/wrench.png');}
    .image-idea{ background-image: url('../Images/FrontPage/lightbulb.png');}

#first .float-left, #first .float-right {
    background:rgba(40, 148, 202, 0.7);
}
#first .first-left-one {
}
#first .first-right-one {
    margin-top:-180px;
    position:relative;
}

#second .float-left, #second .float-right {
    background:rgba(51, 153, 0, 0.6);
}
#second .second-left-one {
    position:relative;
    margin-top:140px;
}
#second .second-left-two {
    position:relative;
    top:23px;
    margin-top:0px;
}
#second .second-right-one {
    position:relative;
    top:-90px;
    margin-top:0px;
}
#second .second-right-two {
    margin-top:-100px;
}
#second .second-right-three {
    margin-top: 10px;
}

#third .story {
    padding: 80px 0px 0px 0px;
}
#third .float-left, #third .float-right {
    background:rgba(255, 153, 0, 0.7);
}
#third .third-left-one {
    position:relative;

}
#third .third-left-two {
    position:relative;
    top:40px;    
}
#third .third-right-one {
    position:relative;
    top:0px;
    margin-top:-180px;

}
#third .third-right-two {
    position:relative;
    top:0px;
    margin-top:-110px;
}

#fourth .float-left, #fourth .float-right {
    background:rgba(51, 153, 204, 0.7);
}

.clear
{
    clear:both;
}

.emphasis {
    font-weight:bold;
    color: #f6ea0e;
}

#draggable5 {
    height: 30px;
    width: 100%;
    /*background-color: red;*/
    top: 200px;
    background-image: url('../Images/phones/drag.png');
}

.phone-content {
    background-color: transparent;
    height: 400px;
    width: 225px;
    padding: 0px;
    margin-top: 85px;
    margin-left: 53px;
    background-image: url('../Images/phones/iphone-before.png');
    background-size:contain;
}

.phone-overlay {
    background-color: transparent;
    height: 216px;
    width: 225px;
    padding: 0px;
    position: absolute;
    top: 85px;
    left: 53px;
    background-image: url('../Images/phones/iphone-after.png');
    background-size:cover;
}

.product-price-logo {
    margin-right: 10px;
    width: 35px;
}

/* landing page */
.landing-background {
    left: 0px; top: 0px; position: fixed; overflow: hidden; z-index: -999999; margin: 0px; padding: 0px; height: 1337.5px; width: 1920px;
}

.landing-background-img {
    position: absolute; margin: 0px; padding: 0px; border: none; z-index: -999999; width: 1920px; height: 1337.5px; left: 0px; top: -266.25px;
}

.l-container {
    background: rgba(0,0,0,.4);
    padding: 7px 15px;
    float: left;
    clear: both;
}
.bigButtonContainer {
    float:right;
    width: 39%;
}
.makeApp {
    font-size: 45px;
    width: 295px;
    margin: 0 auto;
    float: none;
    margin-bottom: 1%;
}

.makeApp a, .l-container a{ color: yellow;}

.hand-image {
    background-image: url('../Images/landing/hand.png');
    background-size: contain;
}
.idea-image {
    background-image: url('../Images/landing/idea.png');
    background-size: contain;
}
.wrench-image {
    background-image: url('../Images/landing/wrench.png');
    background-size: contain;
}

.device-container {
    float: left;
    background-image: url('../Images/landing/devices.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
    /*height: 490px;
    width: 439px;*/
    width: 39%;
    height: 420px;
    margin-top: 45px;
}

.content-container {
    display: table;
    margin: 0 auto;
    /*width: 90%;*/
    width: 1300px;
}

.l-image {
    width: 100px;
    height: 100px;
    float: left;
}

.image-text {    
    font-size: 25px;
    color: white;
    margin-top: 30px;
}
.begin-page .image-text {
    font-size: 22px;
    margin-top: 22px;
}
.begin-page .l-image{ width: 80px;height: 80px;}
.header-banner.l-container {
    float: left;
    width: 100%;
    padding: 0px;
}
.header-banner .des-container {
    font-size: 35px;
    color: white;
    float: left;
    width: 100%;
    word-wrap: break-word;
}
.header-banner .des-container .desc {
    margin-top: 65px;
}

.icons-container {
    margin-top: 4%;
    margin-right: 3%;
    float:left;
    width: 58%;
}

.icons-container .l-container{margin-bottom: 2%;}

.header-Logo {
    background-image: url('../Images/landing/white logo.png');
    background-size: contain;
    float: left;
    width: 300px;
    height: 141px;
}
.price-container {
       background-image: url('../Images/landing/bubble.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: 140px;
    height:140px;
}
.price {
    font-size: 55px;
    color: white;
    padding-top: 33px;
    margin-left: 19px;
}

.banner-image.l-image {
         background-image: url('../Images/landing/banner.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height:120px;
    margin: 0 auto;
    margin-top: 7px;
    float: none;    
}

.l-container.stat {
    float: left;
    clear: none;
    color: white;
    text-align: center;
    width: 29%;
    margin-left:1%;
}

.l-container.stat .num{
    font-size: 69px;    
}

.l-container.stat .desc{
    font-size: 30px;    
}

.stat-container {
    margin: 0 auto;
    width: 100%;
}

@media only screen and (max-width : 1300px) {
    .content-container {
        width: 90%;
    }
}
/* iPads ----------- */

@media only screen 
and (max-width : 1024px) {
/* Styles */
    body{ min-width: 320px;}
    .l-container.stat {
        width: 27%;
    }
}
@media only screen 
and (max-width : 900px) {
/* Styles */
.header-banner .des-container .desc{ margin-top: 0px!important;font-size: 35px!important;}
.header-Logo{ width: 88px;height: 41px;}
}

@media only screen 
and (max-width : 768px) {
/* Styles */
 .l-container.stat,.device-container,.icons-container,.bigButtonContainer {
     width: 98%;
 }
 .device-container {
     background-position: 50% 0;
      
 }

 .makeApp {
     font-size: 55px;
width: 97%;
     text-align: center;
 }
}

@media only screen and (max-width : 500px) {
    .banner-image.l-image {
    height: 65px;    
    }
    
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}