/* *{
            outline:1px solid #FF0000;
        } */
        
        body{
            font-size:1.2em;
        }

        .twitter-card{
            border:0px;
        }
        #activities{
            display:grid;
            grid-template-columns: 33% 33% 33%;
        }
        #activities>div>img{
            width:100%;

        }
        table.service{
            width:100%;
            margin-top:30px;
        }
        table.service>thead{
            background-color: rgb(211, 211, 211);
        }

        .activity-images{
            height:500px;
        }

        th{
            padding:0.5em;
        }
        thead>tr{
            border:1px solid rgb(211, 211, 211);
        }
        tbody>tr{
            border:1px solid #000;
        }
        td{
            border: 1px solid rgb(211,211,211);
            padding:0.5em;
        }
        .service-price{
            width:150px;
        }

        header{
            height:400px;
            background-image: url(imagedata/header_bg.png);
            background-color:rgb(37, 35, 65);
            background-position: center;
            padding-top:300px;
            text-align: center;
        }
        h1{
            font-size:3em;
            color:#FFFFFF;
              text-shadow:
                1px 1px 1px #fff,
                1px -1px 1px #fff,
                -1px 1px 1px #fff,
                -1px -1px 1px #fff,
                0 0 22px #fff;
        }
        footer{
            height:100px;
        }
        #infomation{
            margin-left:auto;
            margin-right:auto;
            border:2px solid #000;
            width:60%;
            padding-bottom: 1em;
            padding-top:0.3em;
        }
        .row-eq-height{
            display: flex;
            flex-wrap: wrap;
        }
        
        hr {
            height: 5px;
            background-color: rgb(27, 27, 27);
            border: none;
        }
        hr.title-separator{
            width:60%;
        }
        #entire{
            max-width: 1200px;
            text-align:center;
        }
        #entire > section{
            margin-top:3em;
        }
        .ele-title{
            font-weight: bold;
            font-size:x-large;
            margin-bottom: 10px;
        }
        .sns-logos{

            margin-top:auto;
            margin-bottom: auto;
        }
        .carousel-control-prev-icon, .carousel-control-next-icon {
            height: 100px;
            width:50px;
            outline: black;
            background-color: rgba(0, 0, 0, 0.3);
            background-size: 100%, 100%;
        }

        .ul-content{
            list-style: disc;
            padding-left: 15px;
            text-align: left;
            padding-left: 5em;
        }
        .ul-align-left{
            display: flex;
            align-items: left;
            flex-direction: column;
        }
        .ul-title{
            text-align: left;
            font-weight: bold;
            padding-left:3em;
        }

        .contact-content{
            padding-left : 3em;
            font-size:1.5em;
            text-align: left;
        }

        .card-columns{
            display:inline-block;
        }

        @media (min-width: 768px) {

        .carousel-inner .carousel-item-right.active,
        .carousel-inner .carousel-item-next {
            transform: translateX(50%);
        }

        .carousel-inner .carousel-item-left.active,
        .carousel-inner .carousel-item-prev {
            transform: translateX(-50%);
        }
        }


        @media (min-width: 992px) {

            .carousel-inner .carousel-item-right.active,
            .carousel-inner .carousel-item-next {
                transform: translateX(33%);
            }

            .carousel-inner .carousel-item-left.active,
            .carousel-inner .carousel-item-prev {
                transform: translateX(-33%);
            }
        }

        @media (max-width: 768px) {
            .carousel-inner .carousel-item>div {
                display: none;
            }

            .carousel-inner .carousel-item>div:first-child {
                display: block;
            }
        }

        .carousel-inner .carousel-item.active,
        .carousel-inner .carousel-item-next,
        .carousel-inner .carousel-item-prev {
            display: flex;
        }

        .carousel-inner .carousel-item-right,
        .carousel-inner .carousel-item-left {
            transform: translateX(0);
        }