@charset "utf-8";

body{
	font-family:"微軟正黑體";
    font-size:18pt;
}

.top-logo{
	background-color:#FFC;
	background-image:url(../images/top.png);
    background-position: center;
	background-size:cover; 
	height:256px;
	font-size:2em;
	font-weight:bold;
	padding:20px 20px;
	color:#063;
    display:block;
}
.top-logo img{
    width:100%;
    height:100%;
    
}

.container{
    margin:0px auto;
    width:90%;
}

h1{
    font-weight:bold;
    color:coral;
    text-align:left;
    padding-bottom:6px;
	border-bottom:2px dotted #00a99d;
}

#dv-download{
	float:right;
	font-size:0.9em;
}

.dv-download{
	font-size:0.7em;
}

h1 img{
    width:50px; 
}

h2{
    font-weight:bold;
    background-color:beige;
    color:saddlebrown;
    padding:20px;
    border-radius:20px;
    margin-bottom:20px;
    border-bottom:2px solid saddlebrown;
}


.page {
    padding: 20px 0px;
    border-bottom: 1px dotted gray;
}

.page:last-child{
    border-bottom:none;
}

.page img{
    width:100%;
    margin:20px 10px;
}

.grid{
    background-color:beige;
    border:15px solid white;
    padding-bottom:20px;
}


.large2{font-size:1.2em; font-weight:bold;}
.text-m{padding-top:30%;}

.text-c{text-align:center;}

.text-t-30{margin-top:-30%;}
.text-t-10{margin-top:-10%;}
.text-t5{margin-top:5%;}
.text-t10{margin-top:10%;}
.text-t20{margin-top:20%;}
.text-t30{margin-top:30%;}

.dialog1, .dialog2, .dialog3{border-radius:10px; padding:10px;}
.dialog1{background-color:powderblue;}
.dialog2{background-color:antiquewhite;}
.dialog3{background-color:khaki}

.btn-area{text-align:center; padding:6px 10px; margin-bottom:20px;} 
.btn-success {padding:6px 10px; border-radius:10px; margin-bottom:20px;}



#footer{
	background-color:#00a99d;
	height:80px;
	font-size:0.8em;
	font-weight:bold;
    padding:10px 0px;
	color:white;
    display:block;
    text-align:center;
}

@media screen and (max-width: 1920px) {
    .container{width:1170px;}

}

@media screen and (max-width: 1200px) {
    .top-logo{
		height:130px;
	}
    /*h1{border:1px red solid;}*/
    .container{max-width:1007px;}
    .text-m{padding-top:10%;}
}

@media screen and (max-width: 992px) {
    body{
        font-size:5em;
    }

    .top-logo{
		height:120px;
		background-image:url(../images/top4mobil-h.png);
        background-repeat:no-repeat;
        background-size:cover;
	}

   .container{max-width:970px;}
    h1{
        font-size:2em;
        /*border:1px green solid;*/
        padding:20px 0px;
    }
    h1 img{width:120px; }

    h2{font-size:1em;}

    #footer{height:160px;}
}


@media screen and (max-width: 750x) {
    .top-logo{
		height:106px;
		background-image:url(../images/top4mobil-h.png);
        background-repeat:no-repeat;
        background-size:cover;
	}

    h1{border:1px blue solid;}
   .container{width:750px;}
}

@media screen and (max-width: 480px) {
    .top-logo{
		height:80px;
		background-image:url(../images/top4mobil-v.png)
	}
    /*h1{border:1px #ff00dc solid;}*/
}