/*
作者: 大貓 , 20180306開始
1.   checkbox樣式
2.   font awesome樣式
3.   SEO TAG樣式
4.   彩色框

/*----------- 1. checkbox --------------*/
.checkbox label:after, 
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    float: left;
    margin-right: .5em;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.radio .cr .cr-icon {
    margin-left: 0em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}

.weather_desc{
	float:left;margin:20px 0px 0px 60px;
}
.weather_desc img {
	width:50px;
}
@media screen and (max-width: 800px){
	.weather_desc{
		float:left;margin:0px 0px 0px 20px;
		font-size: .8em;
	}
	.weather_desc img {
		width:30px;
	}
}

/*----------- 2. font awesome --------------*/
.social .instagram a:before {
	content: "\f16d";
	font-family: FontAwesome;
}
.social .instagram a {
	font-size: 30px;
	display: inline-block!important;
	text-align: center;
	padding: 0;
}
.social .instagram a:hover {
	background: #495057 !important;
}

/*----------- 3. SEO TAG --------------*/
.seoTag {
    border: 1px solid #d0d0d0;
    float: left;
    font-size: 16px;
    line-height: 21px;
    color: #666;
	background-color:#FFF;
	padding:5px;
	margin-right:10px;
}

/*----------- 4. COLOR BORDER --------------*/
.colorBorder4{
	border: 4px solid transparent;
	border-image: 
	linear-gradient(135deg, 
	rgb(58, 145, 192) 0%,
	rgb(148, 197, 39) 33%,
	rgb(145, 195, 34) 33%,
	rgb(249, 202, 125) 75%,
	rgb(244, 154, 5) 95%);
	border-image-slice: 1;
}
.colorBorder3{
	border: 3px solid transparent;
	border-image: 
	linear-gradient(135deg, 
	rgb(58, 145, 192) 0%,
	rgb(148, 197, 39) 33%,
	rgb(145, 195, 34) 33%,
	rgb(249, 202, 125) 75%,
	rgb(244, 154, 5) 95%);
	border-image-slice: 1;
}
.colorBorder2{
	border: 2px solid transparent;
	border-image: 
	linear-gradient(135deg, 
	rgb(58, 145, 192) 0%,
	rgb(148, 197, 39) 33%,
	rgb(145, 195, 34) 33%,
	rgb(249, 202, 125) 75%,
	rgb(244, 154, 5) 95%);
	border-image-slice: 1;
}
.colorBorder1{
	border: 1px solid transparent;
	border-image: 
	linear-gradient(135deg, 
	rgb(58, 145, 192) 0%,
	rgb(148, 197, 39) 33%,
	rgb(145, 195, 34) 33%,
	rgb(249, 202, 125) 75%,
	rgb(244, 154, 5) 95%);
	border-image-slice: 1;
}
