/*Fonts*/
@import 'https://fonts.googleapis.com/css?family=Open+Sans';
@import 'https://fonts.googleapis.com/css?family=Galada';

::selection {
background: #ffb7b7; /* WebKit/Blink Browsers */
}
::-moz-selection {
background: #ffb7b7; /* Gecko Browsers */
}
* { 
-moz-box-sizing: border-box; 
-webkit-box-sizing: border-box; 
box-sizing: border-box; 
}
:focus {outline:none}
/*Reset*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, textarea, p, blockquote, th, td { 
padding:0;
margin:0;}
body,input{
font-family:'Open sans',sans-serif;
font-size:18px;
color:#4c4c4c;
}
body {
    background-color: #e8e8e8; 
    background-image: url('/static/images/background_1.png');
    
    /*background-size: cover;
    position: relative; /* 將圖片位置設置相對於 body */
    background-repeat: no-repeat;
    background-attachment: fixed;

    background-size: contain; /* 以圖片原始尺寸縮放，保持圖片完全可見 */
    background-position: center center; /* 將背景圖片置於頁面中央 */

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}
form{
margin: 10px 35px;
}
input{
border:none;
}
a{
    text-decoration: none;
    /*color:#000000;*/
    color:white;
    text-shadow: 0.05em 0.05em 0.1em rgb(15, 15, 15);
}
a:hover{
color: rgba(255, 152, 0, 0.79);
text-decoration: underline;
}
input[type=text], input[type=password] {
width: 260px;
height:39px;
border:1px solid #cbc9c9;
padding-left:5px;
margin-left:-5px;
margin-top:3px;
border-radius:0px 3px 3px 0px;
-webkit-border-radius:0px 3px 3px 0px;
-moz-border-radius:0px 3px 3px 0px;
}
input[type=submit] {
    width: 300px;
    height: 40px;
    margin-left: 17px;
    border-radius: 3px; 
    background-color: #ae6a6a;
    color: #f8f8f8;
    border: none; 
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
input[type=submit]:hover{
background-color:#607d8b;
color:#f8f8f8; 
cursor:pointer;
}

::-webkit-input-placeholder {
    font-size: 14px; /* 占位符大小 */
}

input::placeholder {
    color: #999; 
}
#icon{
background-color:#F4F4F4;
color:#625864;
display:inline-block;
font-size:14px;
padding-top:10px;
padding-bottom:7px;
width:40px;
margin-left: 15px;
margin-bottom:20px;
text-align:center;
border-top:solid 1px #cbc9c9;
border-bottom:solid 1px #cbc9c9;
border-left:solid 1px #cbc9c9;
border-radius:3px 0 0 3px;
-webkit-border-radius:3px 0 0 3px;
-moz-border-radius:3px 0 0 3px; 
}
.wrapper{
margin:7% auto;
width: 600px;
height: 280px; 
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}
.wrapper h1{
font-family:'Open sans','sans-serif' !important;
/*color:#000000;*/
color:white;
text-shadow: 0.05em 0.05em 0.1em rgb(15, 15, 15);
letter-spacing:1px;
text-align:center;
padding-top:5px;
padding-bottom:5px;
}
.wrapper h3{
font-family: 'Galada', cursive;
/*color:#000000;*/
color:white;
text-shadow: 0.05em 0.05em 0.1em rgb(15, 15, 15);
letter-spacing:5px;
text-align:center;
padding-top:5px;
padding-bottom:5px;

}
.wrapper hr{
opacity:0.2;
}


img {
    width: 80px;
    height: 39px;
    border-color: #cbc9c9;
}

.alert_set{
    margin-top:5px; 
    margin-left:17px; 
    width: 300px;
}


.language{
    background-color: rgba(255, 255, 255, 0); 
    float: right;
}

.language-d{
    background-color: rgba(255, 255, 255, 0); 
    padding: 4px; 
    border-radius:2px;
}


#language-select{
    font-family:'Open sans','sans-serif' !important;
    font-size:16px !important;
    border-width: 0px; 
    border: 1px solid black; 
    background-color: rgba(255, 255, 255, 0);
}