/*
@File: Finix Template Styles

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below>>>>>

*******************************************
*******************************************

** - Default CSS
** - Preloader Area CSS
** - Section Title CSS
** - Navbar Area CSS
** - Main Banner Area CSS
** - Approvals Area CSS
** - About Area CSS
** - Process Area CSS
** - Company Area CSS
** - Services Area CSS
** - Deserve Area CSS
** - Projects Area CSS
** - Clients Area CSS
** - Partner Area CSS
** - Blog Area CSS
** - Choose Area CSS
** - Solution Area CSS
** - Best Services Area CSS
** - Team Area CSS
** - Fun Facts Area CSS
** - Value Area CSS
** - Page Title Area CSS
** - Gallery Area CSS
** - FAQ Area CSS
** - Loan Calculator Area CSS
** - Table Area CSS
** - Apply Area CSS
** - Projects Details CSS
** - Sign In CSS
** - Sign Up CSS
** - 404 Error Area CSS
** - Terms of Service Area CSS
** - Contact Area CSS
** - Sidebar Widget Area CSS
** - Services Details Area CSS
** - Funding Area CSS
** - Works Area CSS
** - Funding Form Area CSS
** - Loan Area CSS
** - Overview Area CSS
** - Check Area CSS
** - Inquiry Area CSS
** - Pagination Area CSS
** - Blog Details Area CSS
** - Footer Area CSS
** - Copy Right Area CSS
** - Go Top CSS

*/
/*================================================
Default CSS
=================================================*/
@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
body {
  padding: 0;
  margin: 0;
  font-family: "Roboto", sans-serif;
  font-size: 16px; background: #fff3e8;
}

a {
  text-decoration: none;
  transition: 0.5s;
  color: #111111;
}
a:hover, a:focus {
  color: #e73c3e;
  text-decoration: none;
}

button {
  outline: 0 !important;
}

p {
  margin-bottom: 15px;
  line-height: 1.8;
  color: #606060;
  font-weight: 400;
  font-family: "Roboto", sans-serif;
  font-size: 16px;
}
p:last-child {
  margin-bottom: 0;
}

i {
  line-height: normal;
}

.d-table {
  width: 100%;
  height: 100%;
}
.d-table-cell {
  vertical-align: middle;
}

img {
  max-width: 100%;
  height: auto;
}

.ptb-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.pt-100 {
  padding-top: 100px;
}

.pb-100 {
  padding-bottom: 100px;
}

.pt-70 {
  padding-top: 70px;
}

.pb-70 {
  padding-bottom: 70px;
}

.ptb-50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: #111111;
  font-family: "Rubik", sans-serif;
  font-weight: 500;
}
.h1:last-child, .h2:last-child, .h3:last-child, .h4:last-child, .h5:last-child, .h6:last-child, h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child {
  margin-bottom: 0;
}

.buy-now-btn{ display: none;}
.single-page{ position: relative; background: url("../img/music-bg.jpg") no-repeat; background-size: 100%; }
.single-page { position: relative;}
.play-button{ position: absolute;  bottom: 9%;  left: 32%;}
.play-button button{background: url("../img/1.png") no-repeat; width:110px; height: 60px;}
.play-button button:hover{background: url("../img/button-hover.png") no-repeat; width:110px; height: 60px;}

.play-button img{ width: 80%;}
button{ background: none; border: 0; }

.logo-1 img{ width: 68%;}
.instrument{ position: relative; z-index: 111; margin: 40px 0 10px;}
/*.rotate-image{ position: absolute; content: "";  width: 219px; height: 216px; z-index: -1;top: -20%; width: 95%;  -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;}*/

.rotate-image{ position: absolute;width: 93%;
  text-align: center;
    position: absolute;z-index: -1;
  top: -20%;
  /*left: 18%;*/
    -webkit-animation:spin 8s linear infinite;
    -moz-animation:spin 8s linear infinite;
    animation:spin 8s linear infinite;}

.rotate-image img{ width: 219px; }

@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}



.instrument img{}

.body-text{background: url("../img/text-bg.png") no-repeat; padding: 50px 0;  margin: 10px 0; background-size: 100% 100%;}
.body-text h2{ font-family: "Great Vibes", cursive;font-size: 45px; padding-top: 30px; margin: 0;}
.body-text p{ font-family: "Aclonica", sans-serif; font-size: 12px;  color: #000;  line-height: 19px;  padding: 0 30px; height: 250px; overflow: scroll;}

@media only screen and (max-width: 360px) {
	body .play-button {position: absolute;  bottom: 9%; left: 32%;}
	.body-text p{line-height: 19px;}
	
}