@import url('https://fonts.googleapis.com/css?family=Prompt');

/* ### For Queen Mother ### */
html{
    -moz-filter: grayscale(90%);
    -ms-filter:grayscale(90%);
    -o-filter:grayscale(90%);
    /* IE */
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    filter: gray;
    /* Chrome, Safari */
    -webkit-filter: grayscale(90%);
    /* Firefox */
    filter: grayscale(90%);
}
body{
    font-family: 'Kanit', sans-serif;
}
section {
    min-height: 100%;
}
a {
    color: green;
}
a:hover {
    color: green;
}
#btngif{
	background-color:#3b5998;
	color:white;
}

/*#btngif:hover{
	background-color:#8b9dc3;
	color:black;
}*/
#imgsize{
	width: 30%;
	height: 30%;
}
#gifsize{
	width: 50%;
	height: 50%;
}
#img{
    width: auto;
	/*border-style: solid;
    border-color: coral;*/
	border-radius: 10px;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

#img:hover{
    width: auto;
	/*border-style: solid;
    border-color: red;*/
	border-radius: 10px;
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.img-thumbnail{
	display: block;
    margin-left: auto;
    margin-right: auto;
    width: auto;
}

.row {
	padding: 10px;
}
.text-center{
    font-size: 30px;
    font-weight: bold;
}
h4 { font-family: 'Open Sans'; margin: 0;}

.modal,body.modal-open {
    padding-right: 0!important
}

body.modal-open {
    overflow: auto
}

body.scrollable {
    overflow-y: auto
}

.modal-footer {
	display: flex;
	justify-content: flex-start;
}
.btn {
    position: absolute;
    right: 10px;
}
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: rgba(35, 119, 95, 0.8) url(../img/cd-top-arrow.svg) no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
    transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
  }
  
  .cd-top.cd-top--show,
  .cd-top.cd-top--fade-out,
 .cd-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
    transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
  }
  
 .cd-top.cd-top--show {
    visibility: visible;
    opacity: 1;
  }
  
.cd-top.cd-top--fade-out {
    opacity: .5;
}
  
  .cd-top:hover {
    background-color: #333333;
    opacity: 1;
  }