/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
* {
    -webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}

.logo {
    top: 20%;
}

.tut1 {
    background-image: url(slide1.png);
    background-size: contain;
}

.dev {
    background-image: url(meetDev.png);
    background-size: cover;
}
.aboutpic {
    background-image: url(about2.png);
    background-size: cover;
}

.welcome {
    background-image: url(welcome.png);
    background-size: cover;
}

.crying {
    background-image: url(crying.png);
    background-size: cover;
}

.content {
    background-image: url(content.png);
    background-size: cover;
}

.progress {
    background-image: url(progress.png);
    background-size: cover;
}

.stopCrying {
    width: 65px;
    height: 65px;
    position: fixed;
    top: 87%;
    right: 7%;
}

.checkmark {
    width: 75px;
    height: 75px;
    top: 50%;
    right: 50%;
    background-image: url(checkmark.png);   
}

body {
    background-color: #FFF685; 
}

.heading {
    background-color: #82CBA9;
    padding: 50px;
}

.start {
    height: 65px;
    background-color: #F2C916;
    line-height: 25px;
    width: 80%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    border-style: solid;
    border-width: 7px;
    border-color: white;
}

.results {
    height: 65px;
    background-color: #82CBA9;
    line-height: 33px;
    width: 80%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    border-style: solid;
    border-width: 7px;
    border-color: white;
}

.about {
    height: 65px;
    background-color: #5A61AB;
    line-height: 25px;
    width: 80%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    border-style: solid;
    border-width: 7px;
    border-color: white;
}

.meet {
    height: 65px;
    background-color: #2A3149;
    line-height: 20px;
    width: 80%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    border-style: solid;
    border-width: 7px;
    border-color: white;
    
}

p {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 200%;
}

h1 {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 400%;
}

h2 {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 150%;
    padding-left:20px;
    padding-right:20px;
}

h3 {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 200%;
    position: relative;
    top: -30px;
}

h4 {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 150%;
    padding-left:20px;
    padding-right:20px;
    padding-bottom:50px;
    position: relative;
    bottom: 20px;
}

h5 {
    font-family: verdana;
    color: #5A61AB;
    text-align: center;
    font-size: 200%;
    padding-left:20px;
    padding-bottom:50px;
}
h6 {
    font-family: verdana;
    color: #5A61AB;
    text-align: center;
    font-size: 120%;
    padding-left:20px;
    padding-right:20px;
    position: relative;
}

h7 {
    font-family: verdana;
    color: #82CBA9;
    text-align: center;
    font-size: 400%;
    padding-top:300px;
}

.header {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 50%;
    width: 100%;
    left: 0;
    margin-top: 20px;
    
}

a:link {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 100%;
    text-decoration: none;
}

a:visited {
    font-family: verdana;
    color: #FFFFFF;
    text-align: center;
    font-size: 100%;
    text-decoration: none;
}

.home {
    line-height: 30px;
    margin-left: 20px;
    margin-top: 40px;
    font-size: 100%;
}

.homepage {
    line-height: 30px;
    left: 50%;
    top: 90%;
    font-size: 100%;
}

.next {
    width: 50px;
    height: 50px;
    background-color: #FFF685;
    line-height: 30px;
    position: fixed;
    top: 75%;
    right: 5%;
    font-size: 100%;
}

.bottle {
    width: 75px;
    height: 75px;
    position: relative;
    margin-top: 500px;
    margin-left: 10px;
    /*background-color: #5A61AB; */
    background-image: url(bottle.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.diaper {
    width: 75px
    height: 75px
    margin-top: -75px;
    margin-left: 95px;
    /*background-color: #82CBA9 ;*/
    background-image: url(diaper.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.burp {
    width: 100px;
    height: 100px;
    margin-top: -75px;
    margin-left: 180px;
    background-color: #8B7B8B ;
}

.rock {
    width: 75px;
    height: 75px;
    margin-top: -75px;
    margin-left: 265px;
    background-color: #F2C916 ;
}

.baby {
    width: 75px;
    height: 75px;
    margin-top: -75px;
    margin-left:auto;
    background-image: url(baby.png);

}

.question {
    margin-top: 40px;
}

.ans1 {
    margin-top: -45px;
    border-color: #5A61AB;
}

.ans1Button {
    position: relative;
    top: 0px;
    left: 50px;
    background: transparent;
}

.ans2 {
    margin-top: 15px;
    border-color: #5A61AB;
}

.ans3 {
    margin-top: 15px;
    border-color: #5A61AB;
}

.ans4 {
    margin-top: 15px;
    border-color: #5A61AB;
}