﻿/*2023.10.03*/

/* ==================================================
   使用最小和最大中斷點寬度，
   也有一些 media queries 和 mixins 用於特定螢幕尺寸的其中一段
================================================== */

@media (max-width: 340px) {  /*xs-4吋手機,像是iphone5*/
  ...
}

@media (max-width: 575.98px) {  /*xs手機直式*/
  ...
}

@media (max-width: 767.98px) {  /*xs,sm手機直橫*/
	.text-center-xs {
		text-align: center;
	}
	body, p, .form-control {
		font-size:15px;
	}
	h1.title-header {
		font-size:29px;
		line-height: 1.1;
	}
	/*場地租借 - 檔期現況與預約*/
	h1.title-header small {
		font-size:70%;
	}
	.h1, h1 {
		font-size:29px;
	}
	.h2, h2 {
		font-size:24.5px;
	}
	.h3, h3 {
		font-size:23px;
	}
	.h4, h4 {
		font-size:20px;
	}
	.h5, h5 {
		font-size:17px;
	}
	.h6, h6 {
		font-size:15.5px;
	}
	.lead {
		font-size: 1rem;
		line-height: 1.75;
	}
	.btn {
		font-size: 14.5px;
		padding: 0.35rem 0.7rem;
	}
	footer {
		font-size: 14px;
		line-height: 1.25;
	}
	.col-form-label {
		font-size:17px; 
		font-weight:500;
	}
	.pt-5,
	.py-5 {
		padding-top: 2.5rem!important;
	}
	.pb-5,
	.py-5 {
		padding-bottom:2.5rem!important;
	}
	.line-center mark {
		font-size: 16px;
	}
	.nav-link {
		font-size: 16.5px;
	}
}

@media (max-width:991.98px) { /*xs,sm手機,md平板直式*/
	.container {
		width:96% !important;
		max-width:none;
	}
	.line-center mark {
		color: #766e6e !important;
	}
}

@media (min-width: 576px) and (max-width: 767.98px) {  /*sm手機橫式*/
  ...
}

@media (min-width: 768px) and (max-width: 991.98px) {  /*md平板直式*/
  ...
}

@media (min-width: 992px) and (max-width: 1199.98px) {  /*lg平板橫式*/
	.line-center mark {
		color: #766e6e !important;
	}
}


@media (min-width: 768px) and (max-width: 1199.98px) {  /* md平板直式~lg平板橫式 */
	/*場地租借 - 檔期現況與預約*/
	h1.title-header small {
		font-size:75%;
	}
	.h3, h3 {
		font-size:26px;
	}
	.h4, h4 {
		font-size:22px;
	}
	.h5, h5 {
		font-size:18.5px;
	}
	.h6, h6 {
		font-size:17px;
	}
}

@media (min-width: 992px) {  /*lg平板橫式~xl筆電桌機*/
  ...
}

@media (min-width: 1200px) {  /* xl筆電桌機 */
	.container {
		/*max-width:1140px;*/
		max-width:1120px;
	}
	.container-full {
		max-width: 90% !important;
	}
	.col-form-label {
		font-size:17px; 
	}
}

@media (min-width: 1600px) {  
	.container {
		max-width:1280px;
	}
	.container-full {
		max-width: 90% !important;
	}
	/*遇見文創-品牌內頁*/ /*場地租借*/
	.bread > .container,
	.venue-rental > .container {
		max-width: 1540px !important;
	}
	.h1, h1 {
		font-size:55px; /* 未來打算用於slogan */
	}
	h1.title-header {
		font-size:45px;
		margin-bottom: 1.4rem;
		line-height: 1;
	}
	.h2, h2 {
		font-size:34px;
	}
	.h3, h3 {
		font-size:32.5px;
	}
	.h5, h5 {
		font-size:20.5px;
	}
	.h6, h6 {
		font-size:18px;
	}
	.lead {
		font-size:19px;
	}
}


 /* 橫式-限手機版 */ 
@media only screen and (orientation : landscape) and (max-height:600px) {
  ...
}

