body{
    margin: 0 auto;
}

.container{
    margin: 0 auto;
    text-align: center;
}

.section-1{
    margin: 0 auto;
    padding:20px 10px 60px 10px;
    background: black;

}


.bg-1{
    margin: 0 auto;
    max-width: 1140px;
    color: red;
}

.bg-1 h1{
    animation: myAnim-01 4s linear 0s infinite normal none;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 10px;
    color: #FF0000;
    font-family: "Antonio", Sans-serif;
    font-size: 71px;
    font-weight: 600;
    text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.35);
}

.btn-01{
    animation: myAnim-02 4s linear 0s infinite normal none;
    padding: 7px 7px 7px 7px;
    background-color: #F4FF00;
    border-style: solid;
    border-width: 3px 3px 3px 3px;
    border-color: #000000;
    border-radius: 14px 14px 14px 14px;
    box-shadow: 0px 0px 10px 0px #FFFFFF;
}

.hr-1{
    padding: 10px 0;
    margin: 0px 200px 0px 200px ;
    border-top: solid 2px white;
    border-bottom: solid 2px  white;
    animation: myAnim-03 4s linear 0s infinite normal none;
}

.hedline-2{
    color: #3AFF00;
    font-size: 50px;
    line-height: 70px;
}
.txt-02{
    margin: 0 auto;
    animation: myAnim-01 4s linear 0s infinite normal none;
    color: red;
    font-size: 42px;
}

.section-2{
    margin: 0 auto;
    padding: 10px;
    background: red;

}


.bg-2{
    margin: 0 auto;
    max-width: 1140px;
    color: white;
    text-size-adjust: auto;
}


.section-3{
    margin: 0 auto;
    padding: 10px;
    background: white;

}



.bg-3{
    margin-bottom: 20px;
    margin: 0 auto;
    max-width: 1140px;
    text-size-adjust: auto;
}

.hedline-3{
    color: #030FBD;
    text-align: center;
    font-size: 51px;
    padding-top: 5px;
    border: dashed 5px rgb(117, 116, 116);
}



/*  */

.f-1{
    display: flex;
    flex-direction: row;
    padding: 0 100px;
    margin: 0 auto;
    list-style: none;
    font-size: 20px;
    color: #000000;
    font-weight: 600;
}

.f-1 li{
    padding-bottom: 16px;
}

.f-1 p{
    font-weight: 700;
    color: #800000;
    text-decoration: underline;
}

.left{
    width: 50%;
    text-align: start;
}
.right{
    text-align: start;
    width: 50%;
}

.bg-4{
    background: #8EA2E9;
    color: red;
    font-size: 48px;
}


.bg-5{
    margin-bottom: 20px !important;
    text-align: center;
    background: #E5FF99;
    color: #B30000 !important;
    padding: 10px;
    margin: 0 auto;
}
.bg-5 p{
    color: black;
}
.bg-5 h2{
    color: #B30000 !important;
    margin: 0;
    padding: 5px;
}


.section-4{
    margin: 0 auto;
    padding: 20px;
    background: #830101;
    color: white;
}
.p-1{
    font-size: 50px;
    font-weight: 600;
    margin: 0 auto;
}
.p-2{
    font-size: 28px;
}
.p-3{
    font-size: 26px;
}
.p-4{
    font-family: "Atma", Sans-serif;
    font-size: 32px;
    color: #F4FF00;
    margin: 0 ato;
}

.p-5{
    font-size: 16px;
}
.bg-6{
    margin: 0 auto;
    max-width: 1140px;
    text-size-adjust: auto;

}

.section-5{
    margin: 20px;
    margin-bottom: 40px;
}

/* Accordient  */

.heading-02{
    font-size: 26px;
}



.section-6{
    margin: 0 auto;
    padding: 10px;
    background: #838904;
    color: white;
}
.bg-7{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    justify-items: center;
    margin: 0 auto;
    max-width: 1140px;
    text-size-adjust: auto;
    text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.35);
    
}
.btn-2{
    animation: myAnim-04 2s ease 0s infinite normal forwards;
    color: white;
    text-decoration: none;
    font-size: 25px;
    background: #770808;
    padding: 10px 40px;
    border: solid 2px white;
    margin: 10px;
    border-radius: 10px;
    text-align: center;
    display: inline-block;
}

.headline-03 p{
    margin-top: 40px;
    margin: 0 auto;
}

.txt-01{
    font-size: 20px;
    margin-top: 40px;
    text-align: center;
    color: white;
    background: red;
    max-width: fit-content;
    padding: 20px;
    
}
.btn-4{
    color: white;
    text-decoration: none;
    font-size: 30px;
    background: black;
    padding: 10px 40px;
    border: solid 10px red;
    margin: 0 auto;
    border-radius: 10px;
    text-align: center;
    display: inline-block;
}

.faq h2{
    font-size: 32px
}

/* Accordient  */
.accordion {
    max-width: 700px;
    margin: 0 auto;
    color: black;
    background-color: white;
    padding: 20px;
  }

  .accordion .container-a {
    position: relative;
  }
    
  .container-a .label {
    text-align: start;
    font-weight: 600;
    position: relative;
    padding: 10px 0;
    font-size: 25px;
    color: #0300A1;
    cursor: pointer;
  }

  .accordion .label::before {
    content: '+';
    font-weight: 600;
    color: #0300A1;
    position: absolute;
    top: 50%;
    left: -20px;
    font-size: 25px;
    transform: translateY(-50%);
  }
  
  /* Hides the content (height: 0), decreases font size, justifies text and adds transition */
  
  .accordion .content {
    position: relative;
    background: white;
    height: 0;
    font-size: 20px;
    text-align: justify;
    max-width: 650px;
    overflow: hidden;
    transition: 0.5s;
  }
  .accordion .content ul li{
    list-style: none;
  }
  
  .accordion .container-a.active .content {
    height: auto;
  }
  .accordion .container-a.active .label{
    color: red;
  }
  
  
  .accordion .container-a.active .label::before {
    content: '-';
    font-size: 25px;
    color: red;
  }
  


/* Responsive */
@media only screen and (max-width: 520px) {
    .bg-1 h1{
        font-size: 36px;
    }
    .hr-1{
        margin: 0 auto;
    }
    .hedline-2{
        font-size: larger;
        line-height: normal;
    }
    .hedline-3{
        font-size: larger;
    }
    .bg-4{
        font-size: 18px;
        font-weight: 600;
        padding: 3px;
    }

    .f-1{
        display: block;
        padding: 0;
    }
    .left , .right{
        width: 100%;
        font-size: 14px;
    }

    .bg-2{
        font-size: medium;
    }

    .bg-7{
        display: flex;
    }

    .btn-2{
        font-size: 16px;
        padding: 8px 20px;
    }
    .btn-4{
        padding: 8px 20px;
    }

    /* Text 000 */

    .section-4{
        padding: 20px 5px;
    }

    .p-1{
        font-size: 22px;
    }
    .p-2{
        font-size: 20px;
    }
    .p-3{
        font-size: 18px;
    }
    .p-4{
        font-size: 15px;
    }
    .p-5{
        font-size: 14px;
    }
    .bg-5 p{
        font-size: 14px;
    }


    .txt-01{
        font-size: 16px;
        padding: 5px;
    }
    .txt-02{
        font-size: 28px;
    }

    .btn-4{
        font-size: 20px;
    }

    .faq h2{
        font-size: 20px
    }

    .container-a .label{
        font-size: 15px;
    }
    .accordion .content{
        font-size: 14px;
    }
    
}

@media only screen and (max-width: 720px) {
    .hr-1{
        margin:  40px;
    }
    .hedline-3{
        font-size: 40px;
    }
    .f-1{
        display: block;
        padding: 20px;
    }
    .left , .right{
        width: 100%;
        font-size: 18px;
    }
    .bg-4{
        font-size: 32px;
        padding: 6px;
    }
    .p-1{
        font-size: 32px;
    }
    .container-a .label{
        font-size: 20px;
    }

}





/* Animation */



@keyframes myAnim-01 {
	0% {
		animation-timing-function: ease-in;
		opacity: 1;
		transform: translateY(-45px);
	}

	24% {
		opacity: 1;
	}

	40% {
		animation-timing-function: ease-in;
		transform: translateY(-24px);
	}

	65% {
		animation-timing-function: ease-in;
		transform: translateY(-12px);
	}

	82% {
		animation-timing-function: ease-in;
		transform: translateY(-6px);
	}

	93% {
		animation-timing-function: ease-in;
		transform: translateY(-4px);
	}

	25%,
	55%,
	75%,
	87% {
		animation-timing-function: ease-out;
		transform: translateY(0px);
	}

	100% {
		animation-timing-function: ease-out;
		opacity: 1;
		transform: translateY(0px);
	}
}


@keyframes myAnim-02 {
	0% {
		animation-timing-function: ease-out;
		transform: scale(1);
		transform-origin: center center;
	}

	10% {
		animation-timing-function: ease-in;
		transform: scale(0.91);
	}

	17% {
		animation-timing-function: ease-out;
		transform: scale(0.98);
	}

	33% {
		animation-timing-function: ease-in;
		transform: scale(0.87);
	}

	45% {
		animation-timing-function: ease-out;
		transform: scale(1);
	}
}

@keyframes myAnim-03 {
	0%,
	100% {
		transform: rotate(0deg);
		transform-origin: 50% 0;
	}

	10% {
		transform: rotate(2deg);
	}

	20%,
	40%,
	60% {
		transform: rotate(-4deg);
	}

	30%,
	50%,
	70% {
		transform: rotate(4deg);
	}

	80% {
		transform: rotate(-2deg);
	}

	90% {
		transform: rotate(2deg);
	}
}

@keyframes myAnim-04 {
	0% {
		animation-timing-function: ease-out;
		transform: scale(1);
		transform-origin: center center;
	}

	10% {
		animation-timing-function: ease-in;
		transform: scale(0.91);
	}

	17% {
		animation-timing-function: ease-out;
		transform: scale(0.98);
	}

	33% {
		animation-timing-function: ease-in;
		transform: scale(0.87);
	}

	45% {
		animation-timing-function: ease-out;
		transform: scale(1);
	}
}