/* =========================================
/* Google Font
========================================= */

@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300,700);
@import url(https://fonts.googleapis.com/css?family=Muli:400,300);
@import 'https://fonts.googleapis.com/css?family=Montserrat';

/* =========================================
Global Styles
========================================= */

body {
    color: #3A3937;
    font-family: 'Muli', sans-serif;
    /*font-family: 'Montserrat', sans-serif;*/
    font-size: 16px;
    font-weight: 300;
    line-height: 28px;
    margin: 0;
    padding: 0;
}

h1 {
    margin-bottom: 30px;
    font-size: 40px;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
}

p {
    font-weight: 300;
    letter-spacing: 0.5px;
}

strong {
    font-weight: 400;
}

img {
    /*display: block;*/
    /*width: 100% \9;*/
    /*max-width: 100%;*/
    /*height: auto;*/
}

ul {
    padding: 0;
}

ul li {
    list-style: none;
}
a {
    color: #3A3937;
    font-weight: bold;
}

a:hover {
    color: #7AB37C;
    text-decoration: underline;
}

.dark-bg {
    background-color: #86ce8e;
}

.underline {
    position: relative;
    font-size: 20px;
    max-width: 350px;
    margin: auto;
    margin-bottom: 80px;
    color: #0099FF;
}

.underline:before {
    position: absolute;
    content: "";
    width: 150px;
    height: 1px;
    background-color: #777;
    top: 50%;
    left: 0;
}

.underline:after {
    position: absolute;
    content: "";
    width: 150px;
    height: 1px;
    background-color: #777;
    top: 50%;
    right: 0;
}

.custom-btn {
    background-color: transparent;
    color: #fff;
    border-radius: 0;
    border: 2px solid #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    color: #3A3937;
    border: 1px solid #3A3937;
}

.custom-btn:hover{
    background-color: #8DCA8F;
    border-color: #8DCA8F;
    color: #fff;
}

.btn:active,
.btn.active {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.btn-order {
    border:2px solid #fff;
    /* text-transform: uppercase; */
}
.navigation .navbar-default .navbar-nav>li>a.btn-order {
    padding: 10px 15px;
    margin: 13px 0 0 20px;
}
.header {
    text-align: center;
    width: 80%;
    margin: 0 auto;
}

.header p {
    margin-bottom: 30px;
}

.bg-color-blue {
    background: #6eb4e3;
}
.bg-color-purple {
    background: #9567ac;
}
.bg-color-green {
    background: #78b37c;
}
.bg-color-pink {
    background-color: #ef4f6c;
}

.section-padding {
    padding: 90px 0;
}

.section-padding-no-bottom {
    padding: 0px 0 0 0;
}

.section-padding-text-only {
    padding: 50px 0 90px 0;
}

.social a {
    display: block;
    width: 40px;
    font-size: 28px;
    border-radius: 100%;
    text-align: center;
    color: #949494;
    margin: 10px 0;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.social a:hover {
    color: #0099FF;
}

.logo {
    max-width: 25vw;
}

.dark-text {
    color: black;
}
.empty-spaces {
    margin-top: 30vh;
}
/* =========================================
   3. Section Header
========================================= */



#why-umi-1, #why-umi-2, #why-umi-3, #why-umi-4 {
    height: 100vh;
}

#why-umi-1 {
    height: 80vh;
}
#why-umi-4 {
    height: 85vh;
}

#why-umi-1 {
    background: url(../images/why-umi-1.png) no-repeat;
    background-size: contain;
    background-position: right bottom;
}

#why-umi-1 .section-padding {
    padding: 50px 0;
}

#why-umi-2 {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2a3746+0,2a3746+50,645844+50,645844+100 */
    background: #2a3746;
    background: -moz-linear-gradient(left,  #2a3746 0%, #2a3746 50%, #645844 50%, #645844 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #2a3746 0%,#2a3746 50%,#645844 50%,#645844 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #2a3746 0%,#2a3746 50%,#645844 50%,#645844 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a3746', endColorstr='#645844',GradientType=1 ); /* IE6-9 */
}
#brown-bg {
    background: url(../images/why-umi-2.png) no-repeat;
    background-size: 100%;
    background-position: -15px 75%;
    height: 100vh;
}
#why-umi-1 h1.smaller-heading, #why-umi-2 h1.smaller-heading, #why-umi-3 h1.smaller-heading, #why-umi-4 h1.smaller-heading {
    font-size: 46px;
}
#why-umi-2 p, #why-umi-3 p{
    text-align: center;
}
#why-umi-3 {
    background-image: url(../images/why-umi-3a.png), url(../images/why-umi-3b.png);
    background-position: 50% 20px, 50% 106%;
    background-repeat: no-repeat, no-repeat;
    background-size: 80%, 80%;
}
#why-umi-3 h1.smaller-heading {
    margin-top: 20vh;
}
#why-umi-4 {
    /*background: #86ce8e url(../images/why-umi-4.png) no-repeat;
    background-size: 70%;
    background-position: 15% 50%;*/
    background: #86ce8e url(../images/why-umi-4-alt.png) no-repeat;
    background-size: 75%;
    background-position: 53% 83%;
}

.top .content {
    color: #fff;
    margin-top: 20px;
}

.top .content h1 {
    font-size: 68px;
    /*margin-top: 110px;*/
    font-weight: 600;
}
.top .content h1.uniform-heading {
    font-size: 40px;
}

.top .content h2 {
    font-size: 32px;
    font-weight: 300;
    margin-bottom: 30px;
}

.top .content p {
    font-size: 16px;
    margin-bottom: 10px;
    letter-spacing: 1px;
    /*font-weight: normal;*/
}

.top .content p.p-smaller {
    font-size: 14px;
    line-height: 17px;
    /*margin-bottom: 10px;
    letter-spacing: 1px;*/
}

.top .content .button img {
    max-width: 200px;
    /* border: 2px solid #fff; */
}

.top .content .button .custom-btn {
    color: #fff;
    border-color: #fff;
}

#centered {
    text-align: center;
}
#justify {
    text-align: justify;
}
.top .content h1.bottom-left {
    margin-top: 70px;
}
.top .content h1.smaller-heading {
    font-size: 30px;
    line-height: 120%;
}

.float-middle {
    margin: 0 auto 0 auto;
    float: none;
}
.float-top {
    margin: 30% auto 0 auto;
    float: none;
}
.float-none {
    margin: -10px auto 0 auto;
    float: none;
    text-align: center;
}
.float-right {
    margin: -10px auto 0 auto;
    float: right;
}
/* =========================================
   4. Section Menu
========================================= */

.navigation .navbar .navbar-brand img {
    max-height: 40px;
}

.navigation .navbar-default .navbar-nav>li>a {
    color: #fff;
    font-weight: 600;
    padding-top: 15px;
    padding-bottom: 5px;
    /*font-size: 1.3em;*/
}

.navigation .navbar-default .navbar-nav>li>a:hover,
.navigation .navbar-default .navbar-nav>.active>a,
.navigation .navbar-default .navbar-nav>.active>a:hover,
.navigation .navbar-default .navbar-nav>.active>a:focus {
    background: none;
}

.navigation .btn-default:hover,
.navigation .btn-default:focus,
.navigation .btn-default:active,
.navigation .btn-default.active {
    border-color: transparent;
}


.navbar-default .navbar-nav>li>a {
    color: #fff;
}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>.active>a,
 .navbar-default .navbar-nav>.active>a:hover,
 .navbar-default .navbar-nav>.active>a:focus {
    background: none;
    /*color: #0099FF;*/
    /*color: #8DCA8F;*/
 }

.navigation .navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>.active>a {
    border-bottom: 2px solid #fff;
}
.navigation .navbar-default .navbar-nav>li>a.btn-order:hover {
    background: #fff;
    color: #3a3937;
}

/* =========================================
   7. Section Description
========================================= */
#run-your-umi {
    background: #fff;
}
#how-it-works {
    background: #f3f3f3;
}

.app-image {
    /*max-width: 441px;*/
    /*margin: auto;*/
    margin-left: 85px;
}

.description .thumbnail-cooks {
    clear: both;
    margin-top: 10px;
}
.description .thumbnail-cooks ul {
    list-style-type: none;
    margin: 0;
    padding: 0
}
.description .thumbnail-cooks li {
    display: inline-block;
    margin: 5px 5px 10px 5px;
}
.description .thumbnail-cooks img {
    /*max-width: 19.61vw;*/
    max-width: 16.39vw;
}
.description .content h4 {
    font-size: 28px;
    margin-bottom: 30px;
    font-weight: 100;
}
.description .content .button .get-btn {
    padding-right: 30px;
}
.description .content .button a {
    margin-right: 30px;
    margin-bottom: 30px;
    font-weight: 400;
}
.description .content .button i {
    margin-right: 15px;
}
.description .content p {
    /*margin-bottom: 70px;
    font-weight: 300;
    letter-spacing: 1px;*/
    margin-bottom: 20px;
    font-weight: 100;
    /* letter-spacing: 1px; */
    font-size: 15px;
    /*text-align: center;*/
}
.description .button {
    margin-bottom: 20px;
}
.description .content .list-item {
    list-style: none;
    margin: 0;
    padding: 0 0 35px 0;
}
.description .content .list-item li i {
    margin-right: 15px;
    color: #0099FF;
    color: #8DCA8F;
}
.description .content .list-item li {
    margin-bottom: 15px;
}

.how-thumb {
    max-height: 220px;
    margin-bottom: 25px;
    /* width: auto; */
    /* position: relative; */
    /* left: 25%; */
}
.description .content .h4-small {
    text-align: center;
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
}
.hiw-padding {
    padding: 0px 35px;
    text-align: center;
    margin-top: 30px;
}
.small-line {
    border-bottom: 3px solid #c0c0c0;
    width: 12%;
    margin: 0 auto 30px auto;
    height: 3px;
}
/* =========================================
   11. Section Subscribe
========================================= */

.subscribe {
    /*text-align: center;*/
}

.subscribe .subscribe-header {
    width: 70%;
    margin: 0 auto;
    color: #fff;
    text-align: center;
}

.subscribe .subscribe-header h1 {
    color: #fff;
    font-size: 40px;
}

.subscribe .subscribe-header p {
    width: 75%;
    margin: 30px auto;
}

.subscribe .subscribe-form input.wide {
    width: 74%;
    margin: auto;
    height: 60px;
    border-radius: 0;
    background-color: transparent;
    margin-right: 20px;
}

.subscribe .subscribe-form input.narrow {
    width: 20%;
    margin: auto;
    height: 60px;
    border-radius: 0;
    background-color: transparent;
    margin-right: 15px;
}

.input-group-addon {
    padding: 0 !important;
    font-size: 14px;
    font-weight: 400;
    color: #555;
    text-align: center;
    background-color: none;
    border: 1px solid #ccc;
    border-radius: 0px;
    height: 60px;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.input-group-addon:hover {
    background-color: #8DCA8F;
    border-color: #8DCA8F;
    color: #fff;
}

.input-group-addon button {
    background: transparent;
    border: none;
    margin-bottom: 0px;
    padding: 10px 70px;
    font-size: 20px;
    font-weight: 400;
    outline: none;
}

.social {
    float: left;
    width: 40%;
    /* margin-bottom: 50px; */
}

.social ul {
    /* margin: 0 auto; */
    /* text-align: center; */
}

.social li {
    float: left;
    list-style: none;
    margin-right: 10px;
}


/* =========================================
   13. Section Footer
========================================= */

.footer {
    float: right;
    width: 60%;
    padding-top: 10px;
    text-align: right;
}

.footer .contact input {
    width: 100%;
    height: 50px;
    border-radius: 0;
    background-color: transparent;
    margin-bottom: 30px;
}

.footer h1 {
    margin-bottom: 60px;
}

.footer .contact textarea {
    width: 100%;
    border-radius: 0;
    background-color: transparent;
    margin-bottom: 10px;
    outline: 0;
    padding: 10px;
    border: 1px solid #ccc;
    min-height: 210px;
}

.footer .contact .contact-submit {
    padding: 10px 30px;
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 50px;
}

.footer .contact .contact-submit i {
    margin-right: 10px;
}


/* =========================================
   14. Section Copyright
========================================= */

.copyright {
    text-align: center;
    padding: 25px 0 10px 0;
    font-size: 12px;
}

.tos {
    /* line-height: 1.6em; */
}
.tos h5 {
    font-size: 24px;
}
.tos ul {
    /*list-style-type: circle;*/
    margin: 0 20px;
    padding: 0;
}

.tos ul li {
    list-style-type: circle;
    margin: 0;
    padding: 0;
}

.tos p,
.tos ul li {
    letter-spacing: 0;
    font-size: 15px;
    /* font-weight: normal; */
    line-height: 24px;
    margin: 0 0 30px 0;
    text-align: justify;
}

ul#trust-ul {
    margin-left:20px;
}
ul#trust-ul li{
    /*list-style-image: url(../images/star-icon.png);*/
    background: url(../images/star-icon.png) no-repeat left 5px;
    background-size: 6%;
    padding: 4px 0px 30px 50px;
    list-style: none;
    margin: 0;
}