/*
style.css
*/

*
{
	font-family: Tahoma, FreeSans, Arial, Verdana, Helvetica, Myriad Pro, Trebuchet, Lucida, sans-serif;
}

h1{
	font-family: Tahoma, FreeSans, Arial, Verdana, Helvetica, Myriad Pro, Trebuchet, Lucida, sans-serif;
}


div img
{
	color: black;
	background-color: white;
	text-align: center;
}

p
{
	color: #b00b69;
	background-color: white;
	width: 100%;
	font-size: 1.2em;
	text-align: center;
}

body {
    margin: 0;
    padding: 0;
	transition: 2s; 

}

.row{
display: flex;
justify-content: center;

}

.list{
margin: auto;
	align-self: center;
}

ul {

    padding: 0;
    display: flex;
}

ul li {
    list-style: none;
    width:  10px;
    height: 10px;
    background:  #b00b69;
    margin: 0 5px;
    border-radius: 50%;
    animation: animate 1.4s linear infinite;

}


 /*========= START ANIMATION LOADER ===========*/

@keyframes animate {
    0% {
        transform: translateY(0)
    }

    60% {
        transform: translateY(0)
    }

    80% {
        transform: translateY(-20px)
    }

    100% {
        transform: translateY(0px)
    }
}

ul li:nth-child(1) {
    animation-delay: -1.2s
}

ul li:nth-child(2) {
    animation-delay: -1.0s
}

ul li:nth-child(3) {
    animation-delay: -.8s
}

ul li:nth-child(4) {
    animation-delay: -0.6s
}



 /*========= START ANIMATION LOGO ===========*/

    @import "compass/css3";

    .dragon{

      cursor: pointer;
      transform: scale(1);
      animation: pulse 5s infinite;
	  transition: 2s;


    }

    @keyframes pulse {
      0% {
          transform: scale(0.97);
          transition: 5s;
		
      }

      70% {
          transform: scale(1);
          transition: 5s;
		
      }

      100% {
          transform: scale(0.97);
          transition: 5s;
		    
      }
    }