@import url('https://satekhunarr.com/front/css/font.css');
@import url('https://fonts.googleapis.com/css?family=Lexend+Deca&display=swap');

/*html*/
/*{*/
/*    scroll-behavior: smooth;*/
/*}*/
body
{
	font-family: 'Lexend Deca', Pyidaungsu, sans-serif !important;
}
.navbar
{
	padding: 1% 5%;
}
.logo, .nav-but {
  padding: 0;
}
.bord {
  border: 1px solid #fff;
  padding: 5px 10px;
  border-radius: 10px;
}
.btn
{
	border:2px solid #333;
	font-weight: 700;
	border-radius: 10px !important;
    color: #000;
}
.ban-text {
	position: absolute;
}

.pad
{
	padding-left: 5%;
	padding-right: 5%;
}
.pad2
{
	
	padding-left: 4.5%;
    padding-right: 3.5%;
}
.quote
{   
	color:#fff;
	line-height: 2.2em !important;
	border-radius: 5px;
	/*padding: 120px 10px !important;*/
	padding : 120px 10px 390px 10px !important;
	margin:10px 5px;
	/*height : 480px !important;*/
}
.subquote
{   
	color:#fff;
	line-height: 2.2em !important;
	border-radius: 5px;
	padding:20px 20px 100px 20px;
	/*margin:10px 15px;*/
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.8;
}

.btn-warning
{
	border-radius: 0px;
	border:0px;
	font-weight: 900;
}

/*Pagination*/
.pagination {
	float: right;
  padding-right: 3.5%;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 0;
}

/*Footer Section*/
.footer-dark {
  padding: 30px 4%;
  color: #000;
  background-color: #F8F9FA;
}
.copy {
  padding-top: 20px;
}


/*mobile responsive*/
@media (min-width: 320px) and (max-width: 425px) {
.col-md-4 {
 padding: 10px 10px;
}
.navbar {
  padding: 0;
}
.navbar-brand {
  width: 180px;
}
.modal-content {
  width: 80%!important;
}
.btn-block {
  width: 40%!important;
}
.logo, .nav-but {
  width: auto;
}
.foot-img {
  width: 230px;
}
}

/*Tablet responsive*/
@media (min-width: 768px) {
.modal-content {
  width: 50%!important;
}
.btn-block {
  width: 30%!important;
}
}




/*Pop Up Box*/
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.2); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 40%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.8s;
  animation-name: animatetop;
  animation-duration: 0.8s;
}

/* Modal Content Close */
.modal-content-close {
  -webkit-animation-name: animatetopclose;
  -webkit-animation-duration: 1s;
  animation-name: animatetopclose;
  animation-duration: 1s;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* Add Animation - Close */
@-webkit-keyframes animatetopclose {
  from {top: 0; opacity:1} 
  to {top: -300px; opacity:0}
}

@keyframes animatetopclose {
  from {top: 0; opacity:1} 
  to {top: -300px; opacity:0}
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  background-color: #F7D200;
  color: white;
  padding-left: 8%;
}

.pop-up {
  background: #F8F9FA;
  padding: 5% 10%;
}
.modal .btn-block, #register .btn {
    display: block;
    width: 20%;
    float: right;
}
.modal .btn, #register .btn {
	border: 1px solid #F7D200;
    font-weight: 700;
    border-radius: 7px;
    background: #FFC107;
}
.btn:hover {
	background: #ffc107c7;
	border: 1px solid #FFC107;
} 
#myBtn {
	color: #000;
	border: 1px solid #000;
	background: #F8F9FA;
  float: right;
}
#myBtn:hover {
  background: #ececec;
}
.copyright {
  background: #00000026;
  padding: 10px 0;
  font-size : 12px;
}

/*Pagination*/
.page-link{
    color : #212529 !important;
    background : #fff !important;
}

.page-link:hover {
    background : #dee2e6 !important;
}

.page-item.active .page-link {
    background : #666 !important;
    border : 1px solid #555 !important;
    color : #fff !important;
}

/* Footer */
.foot-img{
    width : 270px !important;
}

footer h5{
    font-size : 1.15rem;
}

footer .text a{
    font-size : 0.9rem;
}


.ban-text h4,.subquote h4{
    font-size : 1.25rem !important;
}
.ban-text h5,.subquote h5{
    font-size : 1.15rem !important;
}
.ban-text span{
    font-size : 0.85rem !important;
}

.social-icon a{
    font-size : 16px !important;
    color : #555 !important;
    transition : 1.5s;
}

/*.social-icon .fb{*/
/*    margin-right : 8px;*/
/*}*/

.social-icon .fb:hover{
    /*font-size : 17px !important;*/
    color :  blue !important;
}

.social-icon .inst:hover{
    font-size : 17px !important;
    color : red !important;
}
h4.head1
{
    font-size:1.6em !important;
    text-shadow: 1px 1px 5px #111 !important;
}
.ban-text
{
    width:95% !important;
}

/*Recent Post*/
.recent{
    margin-top : 30px !important;
}

/*Ad Banner Image*/
@media (min-width: 768px) {
.ad_ban_image{
    width: 100.5%;
}
}
@media (max-width: 768px) {
.ad_ban_image{
    width: 100%;
}
}
.ad_ban_image{
    border:1px #333 solid;
}

/*Responsive For Mobile*/
@media (max-width: 425px) {
    .quote{
        padding : 50px 10px !important;
        /*padding : 50px 10px 600px 10px !important;*/
    }
    .ban-text h4,.subquote h4{
        font-size : 1.1rem !important;
    }
    .ban-text h5,.subquote h5{
        font-size : 1rem !important;
    }
    .ban-text span{
        font-size : 0.75rem !important;
    }
    h4.head1{
        font-size : 1.4rem !important;
    }
}

.p-400{
    padding-bottom : 400px !important;
}
.p-500{
    padding-bottom : 500px !important;
}
.p-600{
    padding-bottom : 600px !important;
}
.p-700{
    padding-bottom : 700px !important;
}
.p-800{
    padding-bottom : 800px !important;
}

@media (max-width: 425px) {
.fb-share-button{
    left : 65% !important;
}
}
@media (min-width: 425px) and (max-width: 768px) {
.fb-share-button{
    left : 70% !important;
}
}
@media (min-width: 768px) and (max-width: 1024px) {
.fb-share-button{
    left : 85% !important;
}
}
@media (min-width: 1024px) {
.fb-share-button{
    left : 90% !important;
}
}

.fb-share-button iframe{
    width : 100px !important;
    height : auto !important;
}

/*Privacy Policy*/
.policy{
    text-align : justify;
}
@media (max-width: 768px) {
.policy h4{
    font-size : 1.3rem !important;
}
}

.register-box{
    box-shadow :2px 2px 5px #555;
}

@media (max-width: 768px) {
.video iframe{
    width : 300px;
    /*height : 310px;*/
    box-shadow : 2px 2px 5px #555;
}
.thank-title h3,.photo h3,.video h3{
    font-size : 1.3rem;
}
}

@media (min-width: 768px) {
.video iframe{
    width : 545px;
    height : 305px;
    box-shadow : 2px 2px 5px #555;
}
}

.video{
    background: #e9ecef42;
    padding: 30px 0;
}

.photo{
    padding : 30px 0;
}

.photo img{
    box-shadow : 2px 2px 10px #777;
}
