@import url(http://fonts.googleapis.com/css?family=Karla:200,400,700);
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700);
.cf:before. .cf:after{
    content: " ";
    display:table;
}
.cf:after{
    clear:both;
}
body{
    margin: 0 auto;
}
.img{
    max-width: 100%;
}
nav{
    font-family: 'Karla';
}
nav ul{
    margin-top:20px;
    padding:0;
    width:auto;
    float:right;
}
nav ul li{
    list-style: none;
    display:inline;
    margin:10px;
}
nav ul li a{
    color:#da6501;
    cursor:pointer;
    font-size:2.6rem;
    font-weight:700;
}

nav ul li a:visited{
    color:#95b4b4;
}
nav ul li a:active, nav a.active{
    color:#95b4b4;
}
nav ul li a:hover{
    font-weight:bolder;
    text-decoration:none;
    color:#95b4b4;
}


.mnav{
    float:left;
}
.mlogo{
    margin:10px 0;
    float:left;
    height:80px;
}
.mnav ul{
    float:right; 
    margin-top:25px;
}
.logo{
    height:130px;
    padding:0 30px;
}

.mhead{
    background-image: url(../img/test.jpg);
    background-size:cover;
    background-repeat:no-repeat;
}
.mhead h1{
    text-align: center;
    color:#95b4b4;
    padding:100px 0;
    font-family:'Roboto Slab';
    font-size:4.4rem;
}

.mdesc{
    margin:20px 0 50px 0;
    font-family: 'Roboto Slab';
    font-weight:400;
    text-align: center;
    font-size:1.6rem;
    color:#115050;
}
#errmsg{
    font-size:2.2rem;
    color:#990000;
    text-align: center;
    margin-top:40px;
}

#thkmsg{
    font-size:2.2rem;
    text-align: center;
    margin-top:40px;
}
form{
    padding:0 30px;
}
input{
    margin-bottom:10px;
    border:1px solid #333;
    padding:5px 0;
    text-indent:20px;
}
textarea{
    padding:5px 0;
    text-indent: 20px;
}
.send{
    float:right;
    border:none;
    padding:5px 20px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    text-indent: 0;
}

.web img{
    padding:0;
}
.targetDiv h1{
    font-family:'Roboto Slab';
    font-weight:700;
    color:#002747;
    text-align:center;
    margin-bottom:20px;
}
.web h2{
    font-family:'Roboto Slab';
    color:#063535;
    padding:0 15px;
    }
p.site{
    padding:0 15px;
    margin-bottom:70px;
}

#imagegallery, #placeholder, #description{
    display:none;
}
.dt{
    border:1px solid #ccc;
}

.mapps img{
    padding:40px;
}





@media only screen and (min-width : 480px){
    form{
        padding:0 100px;
    }
    p.site{
        padding:0 !important;
}
    .targetDiv h1{
        font-family:'Roboto Slab';
        color:#95b4b4;
}
    
    #placeholder{
        display:block;
        width:80%;
        margin:0 auto;
        padding-bottom:50px;
}

    #imagegallery{
        display:block;
        margin:0;
}
    #imagegallery img{
        width:100px;
        margin:30px 10px;
}
    #imagegallery li {
        list-style: none;
        display:inline;
}
    #description{
        display:block;
    }
}

@media only screen and (min-width : 768px) {
    html{
        background:url(../img/test.jpg);
        background-size:cover;
        background-repeat:no-repeat;
        background-attachment: fixed;
        margin:0 auto;
        height:100vh;
    }
    body{
        max-width: 760px;
        margin:0 auto;
        background-color:transparent;
    }
    
    nav{
        margin-top:20px;
        margin-bottom:150px;
        padding:0;
        font-size:2rem;
    }
    
    .introtxt{
        top:500px;
        text-align:center;
        margin-bottom:90px;
    }
    .introtxt h1, .introtxt h3{
        font-family:'Roboto Slab';
        color:#95b4b4;
    }
    .introtxt h3{
        font-size:2rem;
        font-weight:300;
    }
    .introtxt h1{
        font-size:3.2rem;
    }
    
    .folionav{
        padding:0;
        font-family:Karla;
        margin:0;
        clear:both;
    }
    .folionav ul{
        margin-top:20px;
        padding:0;
        text-align:center;
        width:100%;
        float:left;
    }
    .folionav ul li{
        list-style: none;
        display:inline;
        font-size:4rem;
        margin:0 35px;
    }

    .folionav ul li a{
        cursor: pointer;
        color:#da6501;
        font-weight:bolder;
    }
    .folionav ul li a:link{
        color:#ff851c;
    }
    .folionav ul li a:visited{
        color:#ff852c;
    }
    .folionav ul li a:active, nav a.active{
        color:#ff851c;
    }
    .folionav ul li a:hover{
        font-weight:bolder;
        text-decoration:none;
    }
    .targetDiv p{
        font-family:'Karla';
        font-size:1.6rem;
        padding:0 30px;
        color:#95b4b4;
}

    form{
        padding:0 150px;
    }
    
    .web img{
        margin-right:20px;
        margin-bottom:50px;
        border-radius:5px;
        padding:0;
}
    .web h2{
        font-family:'Roboto Slab';
        color:#95b4b4;
    }
    
    .print img{
        padding:0 90px;
        margin:40px 0px;
}
    .the_photos p{
    padding:0;
    margin-bottom:60px;
}
}

@media only screen and (min-width : 992px){
    body{
        max-width:960px;
    }
    
    .introtxt h1{
        font-size:3.6rem;
    }
    .folionav{
        margin-bottom:50px;
    }
    .folionav ul li{
        margin:0 60px;
        font-size:4.4rem;
    }
    
    .targetDiv h1{
        padding:0 57px;
        font-weight:700;
    }
    .targetDiv p{
        padding:0 120px;
        font-size:2rem;
    }
    
    form{
        padding:0 200px;
    }
    .web img{
        margin-right:40px;
    }
    
    .the_photos p{
    padding:0;
    margin-bottom:60px;
}
}

@media only screen and (min-width : 1220px){
    body{
        max-width:1220px;
    }
    .folionav ul li{
        margin-left:90px;
        font-size:4.8rem;
    }
    
    
    .targetDiv h1{
        padding:0 190px
    }
    .targetDiv p{
        padding:0 230px;
    }
    
    .web img{
        margin-right:90px;
    }
    
    .the_photos p{
    padding:0;
    margin-bottom:60px;
}
    .iphone{
        margin-top:90px;
    }
}