/*=========================================================================================
	File Name: demo.scss
	Description: CSS used for demo purpose only. Remove this css from your project.
	----------------------------------------------------------------------------------------
	Item Name: Chameleon Admin - Modern Bootstrap 4 WebApp & Dashboard HTML Template + UI Kit
	Version: 1.0
	Author: ThemeSelection
	Author URL: https://themeselection.com/
==========================================================================================*/

.fonticon-container{
	> .fonticon-wrap{
		float: left;
		line-height: 4.8rem;
		text-align: center;
		// border: 2px solid $primary;
		// border-radius: 0.1875rem;
		margin-right: 1.75rem;
		margin-bottom: 1.75rem;
		> i{
			font-size: 2.28rem;
			transition: all .2s ease-in-out;
		}
		&.youtube{
			width: 100px;
		}
	}
	&:hover{		
		i{
			color: $primary;
			/* font-size: 2.9rem;
			transform: scale(1.3); */
		}
	}

	>.fonticon-classname, >.fonticon-unit{
		display: block;
    	font-size: 1.5rem;
	    line-height: 1.2;
	}

	>.fonticon-unit{
		font-size: 1rem;
		font-style: italic;
	}
}

.scroll-example{
	padding: 0.5rem;
	position: relative;
	border: 2px solid darken($content-bg,10%);
	overflow: auto;

	.horz-scroll-content{
		width:1200px;
	}
}


.browser{
	background: #e0e0e0;
    border: 4px solid #e0e0e0;
    width: 100%;
    height: 12rem;
    padding-top: 20px;
    margin: 0 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.browser iframe {
    border: 0;
    background: #fff;
    height: 100%;
    width: 100%;
}

.loader-wrapper {
	height: 8em;
}

.maintenance-icon{
	font-size:4rem;
}

.animationIcon{
	right: 30px;
	bottom: 10px;
}

.navbar-color-option, .sidebar-color-option{
	width: 32px;
	height: 32px;
	border-radius: 0.35rem;
	float: left;
	margin-right: 1.6rem;
	&:hover{
		cursor: pointer;
	}
	&.active{
		// border: 2px solid $danger;
		position: relative;
		&:before{
			content: "";
			position: absolute;
			top: -5px;
			left: -5px;
			padding: 19px 19px;
			border-radius: 12%;
			border: 2px solid #767575;
		}
	}
}
.sidiebar-bg-img{
	border: 2px solid #c3c3c3;
	&:hover{
		cursor: pointer;
	}
	&.selected{
		border: 2px solid #000;
	}
}