/**
 * This file is part of the O2System Venus UI Framework package.
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 *
 * @author         Steeve Andrian Salim
 * @copyright      Copyright (c) Steeve Andrian Salim
 */
// ------------------------------------------------------------------------

/**
 * Sass Demo
 * 
 * @author  Teguh Rianto
 * @package Components
 */
 .demo{
	.banner{
		padding: 0;
	}
	.banner-0{
		background-position: bottom;
		background-size: cover;
		padding-bottom: 80px;
		background-image: url('./assets/img/bg-venus.png');
		
		// &:before{
		// 	position: absolute;
		// 	content: "";
		// 	width: 100%;
		// 	height: 100%;
		// 	background-image: linear-gradient( 40deg, $primary 70%, darken($primary, 25%) 100%);
		// 	opacity: 0.8;
		// }
	}
	section{
		padding: 50px 0;
	}
	h4{
		margin-top: 30px;
		margin-bottom: 0rem;
	}
	h5{
		margin-top: 1.5rem;
		margin-bottom: 1rem;
	}

	.demo-navigations{
		background-size: cover;
		background-position: bottom;
		padding-bottom: 5rem;
		margin-top: 30px;

		.navbar{
			margin-bottom: 1.5rem;
		}
	}

	.bg-clean{
		background-image: url('./assets/img/bg-venus-clean.jpg');
	}

	.icons-container {
		position: relative;
		max-width: 450px;
		height: 300px;
		max-height: 300px;
		margin: 0 auto;
		i {
			font-size: 34px;
			position: absolute;
			left: 0;
			top: 0;
			&:nth-child(1) {
				top: 5%;
				left: 7%;
			}
			&:nth-child(2) {
				top: 28%;
				left: 24%;
			}
			&:nth-child(3) {
				top: 40%;
			}
			&:nth-child(4) {
				top: 18%;
				left: 62%;
			}
			&:nth-child(5) {
				top: 74%;
				left: 3%;
			}
			&:nth-child(6) {
				top: 36%;
				left: 44%;
				font-size: 65px;
				color: #f96332;
				padding: 1px;
			}
			&:nth-child(7) {
				top: 59%;
				left: 26%;
			}
			&:nth-child(8) {
				top: 60%;
				left: 69%;
			}
			&:nth-child(9) {
				top: 72%;
				left: 47%;
			}
			&:nth-child(10) {
				top: 88%;
				left: 27%;
			}
			&:nth-child(11) {
				top: 31%;
				left: 80%;
			}
			&:nth-child(12) {
				top: 88%;
				left: 68%;
			}
			&:nth-child(13) {
				top: 5%;
				left: 81%;
			}
			&:nth-child(14) {
				top: 58%;
				left: 90%;
			}
			&:nth-child(15) {
				top: 6%;
				left: 40%;
			}
		}
	}	

}