
.#{$theme-prefix}gradient {
	background: rgb(69,139,202); /* Old browsers */
	background: -moz-linear-gradient(45deg, rgba(69,139,202,1) 0%, rgba(63,177,229,1) 30%, rgba(44,193,215,1) 61%, rgba(25,185,161,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(69,139,202,1) 0%,rgba(63,177,229,1) 30%,rgba(44,193,215,1) 61%,rgba(25,185,161,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, rgba(69,139,202,1) 0%,rgba(63,177,229,1) 30%,rgba(44,193,215,1) 61%,rgba(25,185,161,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#458bca', endColorstr='#19b9a1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

// NEW ICON
#adminmenu #toplevel_page_qtt-welcome .wp-menu-image img{

    height: 100%;
    width: auto;
    margin: 0;
    padding: 0;
    opacity: 1;
    padding: 5px;
    box-sizing: border-box;
}

.#{$theme-prefix}welcome{

	* {
		box-sizing: border-box;
	}

	&__container {
		display: table;
		width: 100%;
		height: 100%;
		padding: 30px 30px 30px 10px;
		vertical-align: middle;

	}
	&__wrapper {
		background: #fff;
		display: table-cell;
		width: 100%;
		height: 100%;
		padding: 80px 30px;
		vertical-align: middle;
		border-radius: 3px;
		box-shadow: 0 0 15px 5px rgba(0,0,0,0.1);
		
	}
	&__logo {
		
		text-align: center;
		
		transition-delay: 2.1s;
	}
	&__title {
		margin: 1.7em 0 0.8em 0;
		text-align: center;
		
		transition-delay: 2.3s;
	}
	&__description {
		margin: 0 auto 1em auto;
		text-align: center;
		font-size: 20px;
		opacity: 0.7;
		max-width: 700px;
		
		transition-delay: 5.5s;
	}
	&__actions {
		margin: 30px 0 30px 0;
		clear: both;
		text-align: center;
		
		transition-delay: 6.8s;

	}
	&__btn {
		@extend .#{$theme-prefix}gradient;
		color: #fff;
		text-transform: uppercase;
		padding: 0 30px;
		line-height: 70px;
		font-size: 18px;
		border-radius: 4px;
		text-decoration: none;
		display: inline-block;
		border-bottom: 0px solid #025c8f;
		border-top: 3px solid #025c8f;
		transition: border 0.3s;
		&:hover {
			color: #fff;
			border-top: 0px solid #89c4e5;
			border-bottom: 3px solid #025c8f;

		}
	}
	&__followup {
		margin: 0 auto 1em auto;
		text-align: center;
		font-size: 15px;
		opacity: 0.6;
		max-width: 700px;
		
		transition-delay: 7.5s;
	}
	// form
	// 
	&__form {
		max-width: 700px;
		margin: 30px auto;
		padding: 20px;
		input[type="text"] {
			width: 80%;
			float: left;
			margin: 0;
		    line-height: 27px;
		    padding: 0 0 0 14px;
		    border-radius: 14px 0 0 14px;
		}
		input[type="submit"] {
			width: 20%;
			float: left;
			margin: 0;

			 border-radius: 0 14px 14px 0;
		}
	}
	&__center {
		text-align: center;
	}
	// Message in tgm
	&__activation-msg {
		background: white;
		border: 1px solid #ddd;
		margin: 20px 0;
		padding: 30px;
		border-left: 4px solid #f00;
		font-size: 18px;
	}
	// Top notice
	&__notice {
		padding: 10px 30px;
		h3 {
			margin: 7px 0 3px 0;
		}
		p {
			margin-top: 3px;
		}
		img {
			float: left;
			margin-right: 20px;
			border-right: 1px solid #dedede;
			padding-right: 20px;
			max-height: 55px;
			width: auto;
		}
	}
	&__msg {
		&__error {
			color: red;
		}
		&__success {
			color: green;
		}
	}
	&__info {
		padding-left: 30px;
		background: white;
		padding-bottom: 20px;

    	border-radius: 3px;
    	box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.1);
    	
		h3 {
			display: block;
			position: relative;
			padding: 30px 0 0 0;
			margin: 0;
			opacity: .8;
			&::after {
				content: " ";
				display: inline-block;
				width: 8px;
				height: 8px;
				transform: rotate(135deg);
				border: 2px solid;
				border-left: none;
				border-bottom: none;
				margin-left: 30px;
			}
		}
		ul {
			opacity: .7;
			margin-bottom: 0;
			max-height: 0;
			transition: max-height 1s ease-out, padding-bottom 0.2s;
			overflow: hidden;
			padding: 0;
			padding-bottom: 0;
			font-size: 16px;
			li {
				margin-left: 20px;
				list-style: square;
				padding: 5px 0;
			}
		}
		&:hover {
			ul {
				max-height: 500px;
			}
		}
	}
}