@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,greek,greek-ext,cyrillic,cyrillic-ext,latin-ext,vietnamese);
body{
	overflow:hidden;
	font-size: 12px;
	font-family: "open sans";
	color: #2e3436;
}
.main-container{
	width:100vw;
	height:100vh;
	background:#eaecf2;
	display: flex;
}
.main-container > div{
	height:100vh;
	float:left;
}
.main-container > div:nth-child(1){
	width:300px;
	border-right: 1px solid #ddd;
	border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.main-container > div:nth-child(2){
	width:calc(50% - 210px);
	background:#fff;
}
.main-container > div:nth-child(3){
	width:calc(100% - 300px);
}

.container-title{
	background: #ffffff;
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
    height:40px;
    display:flex;
    align-items:center;
    text-indent: 10px;
    padding:0px !important;
}
.container-title:hover{
	background:#FFF !important;
	color:#444 !important;
}
.menu-items{
    background: #d0d3dd;
    border-radius: 5px;
    margin-top: 15px;
    cursor:pointer;
    position:relative;
    overflow:hidden;
}
.menu-items *{
	cursor:pointer;
}
.login-config-items .window-bar{
	background:#7d7f88;
	height:30px;
	width:100%;
	margin-bottom:10px;
}
.login-config-items .url-address{
	width: 90%;
    height: 10px;
    background: #fff;
    margin: auto;
    border-radius: 5px;
    position: relative;
    top: 10px;
    overflow: hidden;
    color: green;
    font-size: 7px;
    text-indent: 5px;
}
.login-config-items .content-website-lines > div{
	    height: 6px;
    border-radius: 5px;
    background: #cbcfda;
    width: 90%;
    margin: 5px 0px 5px 10px;
}
.menu-items-login-container{
	margin-top:20px;
	margin-bottom:20px;
	width: 35%;
    background: #7d7f88;
    border-top-left-radius: 9px;
    border-bottom-left-radius: 9px;
    margin-left: 65%;
    padding: 8px;
}
.menu-items-login-container > div{
	margin-top: 5px;
    margin-bottom: 5px;
    background: #fff;
    height: 8px;
    border-radius: 5px;
}
.menu-items-login-container > div:nth-child(1){
	width:15px;
	height:15px;
	margin-top:0px;
	display:none;
}
.login-config-items .content-website-lines > div:nth-child(1),.login-config-items .content-website-lines > div:nth-child(5){
	width:70%;
}
.login-config-items .content-website-lines > div:nth-child(2),.login-config-items .content-website-lines > div:nth-child(4){
	width:60%;
}
.login-config-items .content-website-lines > div:nth-child(3){
	width:50%;
}
.menu-items:first-child{
	margin-top: 0px;
}
.items-bottom {
        height: 30px;
    text-align: center;
    color: #444;
    background: #fff;
    /* margin-left: -20px; */
    width: 100%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    line-height: 30px;
    color: #7d7f88;
    font-size: 14px;
    font-style: normal;
}
.form-group {
    margin-bottom: 30px;
}
#favicon-update .form-control,#login-update .form-control{
	border: 1px solid #d3d6dd;
    box-shadow: none;
    padding: 0px 6px;
    min-height: 28px;
    width: calc(100% - 50px);
    border-radius: 0px;
}
.main-setting,.login-setting{
	padding:15px;
	
}
.file-upload{
	border: 1px dashed #d2d2d2;
    width: 100px;
    height: 100px;
    margin: auto;
    margin-top: 10px;
    background-image:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE4LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDYwIDYwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2MCA2MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTM3LDIySDEyYy0wLjU1MiwwLTEsMC40NDgtMSwxczAuNDQ4LDEsMSwxaDI1YzAuNTUyLDAsMS0wLjQ0OCwxLTFTMzcuNTUyLDIyLDM3LDIyeiIgZmlsbD0iI2QzZDZkZCIvPg0KCTxwYXRoIGQ9Ik0xMiwxNmgxMGMwLjU1MiwwLDEtMC40NDgsMS0xcy0wLjQ0OC0xLTEtMUgxMmMtMC41NTIsMC0xLDAuNDQ4LTEsMVMxMS40NDgsMTYsMTIsMTZ6IiBmaWxsPSIjZDNkNmRkIi8+DQoJPHBhdGggZD0iTTM4LDMxYzAtMC41NTItMC40NDgtMS0xLTFIMTJjLTAuNTUyLDAtMSwwLjQ0OC0xLDFzMC40NDgsMSwxLDFoMjVDMzcuNTUyLDMyLDM4LDMxLjU1MiwzOCwzMXoiIGZpbGw9IiNkM2Q2ZGQiLz4NCgk8cGF0aCBkPSJNMzAsMzljMC0wLjU1Mi0wLjQ0OC0xLTEtMUgxMmMtMC41NTIsMC0xLDAuNDQ4LTEsMXMwLjQ0OCwxLDEsMWgxN0MyOS41NTIsNDAsMzAsMzkuNTUyLDMwLDM5eiIgZmlsbD0iI2QzZDZkZCIvPg0KCTxwYXRoIGQ9Ik0xMiw0NmMtMC41NTIsMC0xLDAuNDQ4LTEsMXMwLjQ0OCwxLDEsMWgxNGMwLjU1MiwwLDEtMC40NDgsMS0xcy0wLjQ0OC0xLTEtMUgxMnoiIGZpbGw9IiNkM2Q2ZGQiLz4NCgk8cGF0aCBkPSJNMywyaDI5djE0aDE0djE3aDJWMTQuNTg2TDMzLjQxNCwwSDF2NjBoMzF2LTJIM1YyeiBNMzQsMy40MTRMNDQuNTg2LDE0SDM0VjMuNDE0eiIgZmlsbD0iI2QzZDZkZCIvPg0KCTxwYXRoIGQ9Ik0zNSwzNnYyNGgyNFYzNkgzNXogTTU3LDU4aC05VjQ1LjQxNGw0LjI5Myw0LjI5M2wxLjQxNC0xLjQxNEw0Nyw0MS41ODZsLTYuNzA3LDYuNzA3bDEuNDE0LDEuNDE0TDQ2LDQ1LjQxNFY1OGgtOVYzOGgyMA0KCQlWNTh6IiBmaWxsPSIjZDNkNmRkIi8+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==');
    background-size:70%;
    background-position: center;
    background-repeat: no-repeat;
    cursor:pointer;
}
.file-upload.uploaded{
	background-image:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE4LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDU4IDU4IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1OCA1ODsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwb2x5Z29uIHN0eWxlPSJmaWxsOiNFRkVCREU7IiBwb2ludHM9IjQ2LDE0IDMyLDAgMSwwIDEsNTggNDYsNTggCQkiLz4NCgkJPGc+DQoJCQk8cGF0aCBzdHlsZT0iZmlsbDojRDVEMEJCOyIgZD0iTTExLDIzaDI1YzAuNTUyLDAsMS0wLjQ0NywxLTFzLTAuNDQ4LTEtMS0xSDExYy0wLjU1MiwwLTEsMC40NDctMSwxUzEwLjQ0OCwyMywxMSwyM3oiLz4NCgkJCTxwYXRoIHN0eWxlPSJmaWxsOiNENUQwQkI7IiBkPSJNMTEsMTVoMTBjMC41NTIsMCwxLTAuNDQ3LDEtMXMtMC40NDgtMS0xLTFIMTFjLTAuNTUyLDAtMSwwLjQ0Ny0xLDFTMTAuNDQ4LDE1LDExLDE1eiIvPg0KCQkJPHBhdGggc3R5bGU9ImZpbGw6I0Q1RDBCQjsiIGQ9Ik0zNiwyOUgxMWMtMC41NTIsMC0xLDAuNDQ3LTEsMXMwLjQ0OCwxLDEsMWgyNWMwLjU1MiwwLDEtMC40NDcsMS0xUzM2LjU1MiwyOSwzNiwyOXoiLz4NCgkJCTxwYXRoIHN0eWxlPSJmaWxsOiNENUQwQkI7IiBkPSJNMzYsMzdIMTFjLTAuNTUyLDAtMSwwLjQ0Ny0xLDFzMC40NDgsMSwxLDFoMjVjMC41NTIsMCwxLTAuNDQ3LDEtMVMzNi41NTIsMzcsMzYsMzd6Ii8+DQoJCQk8cGF0aCBzdHlsZT0iZmlsbDojRDVEMEJCOyIgZD0iTTM2LDQ1SDExYy0wLjU1MiwwLTEsMC40NDctMSwxczAuNDQ4LDEsMSwxaDI1YzAuNTUyLDAsMS0wLjQ0NywxLTFTMzYuNTUyLDQ1LDM2LDQ1eiIvPg0KCQk8L2c+DQoJCTxwb2x5Z29uIHN0eWxlPSJmaWxsOiNENUQwQkI7IiBwb2ludHM9IjMyLDAgMzIsMTQgNDYsMTQgCQkiLz4NCgk8L2c+DQoJPGc+DQoJCTxyZWN0IHg9IjM1IiB5PSIzNiIgc3R5bGU9ImZpbGw6IzQ4QTBEQzsiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIvPg0KCQk8cmVjdCB4PSI0NSIgeT0iNDIiIHN0eWxlPSJmaWxsOiNGRkZGRkY7IiB3aWR0aD0iMiIgaGVpZ2h0PSIxNiIvPg0KCQk8cG9seWdvbiBzdHlsZT0iZmlsbDojRkZGRkZGOyIgcG9pbnRzPSI1MS4yOTMsNDguNzA3IDQ2LDQzLjQxNCA0MC43MDcsNDguNzA3IDM5LjI5Myw0Ny4yOTMgNDYsNDAuNTg2IDUyLjcwNyw0Ny4yOTMgCQkiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==');
	background-size:70%;
    background-position: center;
    background-repeat: no-repeat;
}
input[type='file']{
	width: 100% !important;
    height: 100% !important;
    opacity: 0;
    cursor:pointer;
}
.file-upload-container > div{
	float:left;
}
#favicon-update{
	width:100%;
	float:left;
}
.file-upload-container{
	display: flex;
    float: left;
    text-align:center;
}
form label{
	font-weight: 400;
}
.file-upload-container label{
	margin-top:5px;
	text-align:center;
}
#demo-url,#demo-domain,#error-url,#help-fv{
	font-size: 12px;
    color: #7d7f88;
}
#error-url{
	color:red;
	margin-left:10px;
}
div[main-container]{
	display:none;
}
/* Form Css */
#login-page-container.form-top-left{
	align-items: flex-start;
    justify-content: flex-start;
}
#login-page-container.form-top-center{
	align-items: flex-start;
    justify-content: center;
}
#login-page-container.form-top-right{
	align-items: flex-start;
    justify-content: flex-end;
}
#login-page-container.form-center-left{
	align-items: center;
    justify-content: flex-start;
}
#login-page-container.form-center-center{
	align-items: center;
    justify-content: center;
}
#login-page-container.form-center-right{
	align-items: center;
    justify-content: flex-end;
}
#login-page-container.form-bottom-left{
	align-items: flex-end;
    justify-content: flex-start;
}
#login-page-container.form-bottom-center{
	align-items: flex-end;
    justify-content: center;
}
#login-page-container.form-bottom-right{
	align-items: flex-end;
    justify-content: flex-end;
}
/* Alignment */
.form-alignment-container{
	position: relative;
    width: 100px;
    height: 100px;
    background: #a9abad;
    border: 1px solid #a9abad;
    margin-top: 10px;
}
.form-alignment-container > li{
	position:absolute;
	width:20px;
	height:20px;
	background:#fff;
	display:block;
	cursor:pointer;
}
.form-alignment-container .form-top-left{
	top:0px;
	left:0px;
	width: 10px;
    height: 30px;
}
.form-alignment-container .form-top-center{
	top:0px;
	left:0px;
	right:0px;
	margin:auto;
	width: 30px;
    height: 10px;
}
.form-alignment-container .form-top-right{
	top:0px;
	right:0px;
	width: 10px;
    height: 30px;
}
.form-alignment-container .form-center-left{
	top:0px;
	bottom:0px;
	left:0px;
	margin:auto;
	width: 10px;
    height: 30px;
}
.form-alignment-container .form-center-center{
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	margin:auto;
	width: 30px;
    height: 30px;
}
.form-alignment-container .form-center-right{
	top:0px;
	bottom:0px;
	right:0px;
	margin:auto;
	width: 10px;
    height: 30px;
}
.form-alignment-container .form-bottom-left{
	bottom:0px;
	left:0px;
	width: 10px;
    height: 30px;
}
.form-alignment-container .form-bottom-center{
	bottom:0px;
	left:0px;
	right:0px;
	margin:auto;
	width: 30px;
    height: 10px;
}
.form-alignment-container .form-bottom-right{
	bottom:0px;
	right:0px;
	width: 10px;
    height: 30px;
}
.form-horizontal .form-group {
    margin-right: 0px;
    margin-left: 0px;
}

.screen-container {
    height: 100%;
    background: #FFF;
    top: 0px;
    float: left;
    width: 100%;
}
#login-page-container{
	background: #a9abad;
    height: calc(100% - 80px);
    display:flex;
    display:-webkit-flex;
	align-items: center;
    justify-content: center;
	padding: 15px;
	position:relative;
	left:0px;
	right:0px;
	overflow-y: auto;
    overflow-x: hidden;
}

.login-container form{
	width:100%;
	margin-bottom:0px;
	min-width:300px;
}
.screen-container.deactive{
	background:#fff;
}
.screen-container.deactive .login-page-container{
	opacity: 0;
}
.container-title.deactive{
	color: #e0e0e3;
}
.login-container{
	float: left;
	padding:15px;
	position:relative;
	z-index:1;
}
.login-container .form-group {
	margin-bottom:15px;
}
body{
	overflow: hidden;
}

/** Color Picker **/

.color-selection {
	position: relative;
    width: 30px;
    height: 30px;
    padding: 5px;
    border-radius: 50%;
    margin-left: 10px;
    border: 1px solid #d3d6dd;
    cursor: pointer;
}
.color-selection > div {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #08173d;
    position: relative;
}
.color-choices {
    position: absolute;
    background: #fff;
    box-shadow: 0px 0px 7px #c1c1c1eb;
    width: 500px;
    height: auto;
    z-index: 11;
    border-radius: 5px;
    top: calc(100% + 10px);
    margin-left: -236px;
    display: none;
}
.color-paltte {
    list-style: none;
    padding-left: 0px;
    display: none;
}
.theme-picker {
    display: none;
    height: 210px;
    z-index: 1;
    position: relative;
}
.themecolorpicker-input {
    width: 173px;
    display: block;
}
.themecolorpicker{
	width: calc(100% - 173px);
}
.themecolorpicker-input {
    display: flex !important;
    align-items: center;
}
.themecolorpicker-input.white input {
    background-image:url("data:image/svg+xml,\00003csvg xmlns=\'http://www.w3.org/2000/svg\' width=\'24px\' height=\'24px\' viewBox=\'0 0 24 24\' fill=\'#ffffff\'>\00003cpath d=\'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z\'/>\00003cpath d=\'M0 0h24v24H0z\' fill=\'none\'/>\00003c/svg>");
    border-bottom-color: rgba(255, 255, 255, 0.3);
}
.themecolorpicker-input input {
    font-family: arial,sans-serif;
    padding: 0 0 5px 20px;
    margin: 0 0 10px;
    text-align: left;
    background: no-repeat left top;
    background-size: 14px;
    background-image: url("data:image/svg+xml,\00003csvg xmlns=\'http://www.w3.org/2000/svg\' width=\'24px\' height=\'24px\' viewBox=\'0 0 24 24\' fill=\'#000000\'>\00003cpath d=\'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z\'/>\00003cpath d=\'M0 0h24v24H0z\' fill=\'none\'/>\00003c/svg>");
    margin-left: 1em;
    margin-right: 1em;
    width: calc(100% - 27px);
    outline: none;
    border:none;
    border-bottom:1px solid;
    border-bottom-color: rgba(0, 0, 0, 0.3);
    font-weight: 600;
    font-size: 12px;
    
}
.color-block-container {
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    float: left;
}
.color-block-canvas-container {
    position: relative;
}
.color-block-circle {
    position: absolute;
    height: 1px;
    width: 1px;
    z-index: 10;
    cursor: pointer;
}
.themecolorpicker canvas {
    width: 100%;
    float: left;
}
.color-strip-container {
    margin: 0 16px 0 16px;
    min-width: 100px;
    position: relative;
    height: 52px;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    float: left;
}
.color-strip-canvas-container {
    position: relative;
}

.color-strip-circle {
    position: absolute;
    height: 20px;
    width: 20px;
    left: -10px;
    top: -5px !important;
    border: 2px white solid;
    border-radius: 22px;
    border-radius: 50%;
    z-index: 10;
    cursor: pointer;
}

.color-strip {
    border-radius: 5px;
}
.color-selection-container .form-control {
    border: 1px solid #d3d6dd;
    box-shadow: none;
    padding: 0px 6px;
    height: 28px;
    width: calc(100% - 50px);
    border-radius: 0px;
}
.color-selection-container .input-group2 {
    display: flex;
    display: -webkit-flex;
    align-items: center;
}
.color-choices{
	position: absolute;
    background: #fff;
    box-shadow: 0px 0px 7px #c1c1c1eb;
    width: 500px;
    height: auto;
    z-index: 11;
    border-radius: 5px;
    top: calc(100% + 10px);
    margin-left: -236px;
    display: none;
}
.color-choices:after, .color-choices:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.color-choices:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #fff;
	border-width: 16px;
	margin-left: -21px;
}
.color-choices:before {
	border-color: rgba(204, 204, 204, 0);
	border-bottom-color: #ccc;
	border-width: 17px;
	margin-left: -22px;
}
.color-selection:hover .color-choices{
	/* display:block; */
}
.color-block-circle {
    position: absolute;
    height: 1px;
    width: 1px;
    z-index: 10;
    cursor: pointer;
}
.color-block-circle > div {
    position: absolute;
    height: 20px;
    width: 20px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: transparent;
    left: -10px;
    top: -10px;
    cursor: pointer;
}

.form-control {
    box-shadow: none;
    height: 28px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(211, 214, 221);
    border-image: initial;
    padding: 0px 6px;
    border-radius: 0px;
    font-size:12px;
}
#login-page-container .form-control {
    border-style: solid;
    border-color: rgb(211, 214, 221);
    min-height: 28px;
    height:auto;
}
.domain-mapping-container{
	opacity: 0.5;
	position:relative;
}
.domain-mapping-container:after{
	position:absolute;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	content:" ";
	display:block;
	z-index:5;
}
.domain-mapping-container.active{
	opacity: 1;
}
.domain-mapping-container.active:after{
	display:none;
}
.file-upload-container.domain-mapping-container > .col-xs-12{
	width:130px !important;
}
.file-upload-container.domain-mapping-container .file-upload{
	margin:0px;
}
.login-container{
	background:#fff;
}


.login-container form.form-horizontal{
    width: 400px;
}
.login-container form.form-inline{
    width: auto;
}

/** Float Input **/

.form-group.float-input {
  position: relative;
  margin-bottom: 15px;
  margin-top: 20px;
}

.form-group.float-input label {
  position: absolute;
  top: 0;
  padding: 7px 0 0 2px;
  transition: all 200ms;
  opacity: 0.5;
}

.form-group.float-input .form-control:focus + label,
.form-group.float-input .form-control:valid + label {
  font-size: 75%;
  transform: translate3d(0, -100%, 0);
  opacity: 1;
}

.form-group.float-input .form-control{
	border-top:0px;
	border-left:0px;
	border-right:0px;
	background: transparent;
}
.form-group.float-input .form-control:focus{
    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset, rgba(102, 175, 233, 0.6) 0px 1px 0px;
}

.pretty.p-default.p-fill{
	margin-right:15px;
}

.logo-container{
	display: flex;
    justify-content: center;
    display: -webkit-flex;
    position: relative;
}
.logo-container img{
	max-width:100%;
}
#login-page-container{
	background-repeat: no-repeat;
	background-position: center;
}
#resource-update .form-group{

}
#resource-update .form-group .control-label{
	/* margin-right:10px; */
}
.no-right-margin{
	
}
.no-left-padding{
	padding-left:0px;
}
.element-selection-container{
	display:flex;
	display:-webkit-flex;
	align-items:center;
}
.element-selection-container label{
	margin-bottom:0px;
}
.advance-element .form-group{
	padding-left:0px;
	
}
.advance-element{
	float: none;
}
.col-xs-6{
	min-width:150px;
}
.bg-ss-container{
	display:none;
}
#login-page-container[bg-size='fz']{
	background-size:100% 100% !important;
}
#login-page-container[bg-size='contain']{
	background-size:contain !important;
}
#login-page-container[bg-size='cover']{
	background-size:cover !important;
}

.help-detail{
	font-size: 10px;
    color: #7d7f88;
    cursor:pointer;
    display:none;
}

.domain-mapping-container.active .file-upload.invalid-ssl{
	border: 1px dashed #f00;
}
.selection-container{
	overflow:hidden;
	position:relative;
	background:#eeeeee;
}
.customize-list,.customize-main-list,.customize-themes{
	list-style: none;
    padding-left: 0px;
    text-indent: 10px;
    background: #eeeeee;
    border-top: 1px solid #ddd;
}
.customize-list li,.customize-main-list li,.customize-themes li{
	line-height: 35px;
    border-bottom: 1px solid #ddd;
    cursor:pointer;
    border-left:5px solid transparent;
    background:#FFF;
}
.customize-list li:hover,.customize-main-list li:hover,.customize-themes li:hover{
	color: #0073aa;
    background: #f3f3f5;
}
.customize-items-child{
	list-style: none;
    padding-left: 0px;
    position:absolute;
    left:100%;
    transition: all 0.2s;
    z-index:2;
    width:100%;
    height: 100vh;
    top: 0px;
    background: #eeeeee;
    color:#555d66;
}
.customize-items-child.open{
    left:0%;
}
.customize-items-child li{
	padding: 5px 10px;
}
.customize-back-btn{
	margin-right: 10px;
    background-position: 11px;
    display: block;
    float: left;
    width: 48px;
    height: 39px;
    padding: 0 24px 0 0;
    background-color: #fff;
    background-image: url(../images/new/arrow-left.svg);
    background-size: 15px;
    background-repeat: no-repeat;
    border: none;
    border-right: 1px solid #ddd;
    border-left: 4px solid #fff;
    box-shadow: none;
    cursor: pointer;
    transition: color .15s ease-in-out,border-color .15s ease-in-out,background .15s ease-in-out;
}
.customize-header{
	font-size:12px;
}
.customize-title{
	font-size:14px;
}
.customize-control-title {
    display: block;
    font-size: 12px;
    line-height: 1.75;
    font-weight: 600;
    margin-bottom: 4px;
}
.customize-control .attachment-media-view .default-button, .customize-control .attachment-media-view .remove-button, .customize-control .attachment-media-view .upload-button, .customize-control-header button.new, .customize-control-header button.remove {
    width: auto;
    height: auto;
    white-space: normal;
}

.attachment-media-view .button-add-media, .customize-control .attachment-media-view .placeholder, .customize-control-header .placeholder {
    width: 100%;
    position: relative;
    text-align: center;
    cursor: default;
    border: 1px dashed #b4b9be;
    box-sizing: border-box;
    padding: 9px 0;
    line-height: 1.6;
}
.customize-control .attachment-media-view .button-add-media {
    cursor: pointer;
    background-color: #edeff0;
    color: #32373c;
    width:100%;
}

/****/

input[type=checkbox].loginpress-radio, input[type=checkbox].loginpress-radio:after, input[type=checkbox].loginpress-radio:before, input[type=checkbox].loginpress-radio *, input[type=checkbox].loginpress-radio *:after, input[type=checkbox].loginpress-radio *:before, input[type=checkbox].loginpress-radio + .loginpress-radio-btn {
    box-sizing: border-box;
}
input[type=checkbox].loginpress-radio + .loginpress-radio-btn {
    outline: 0;
    display: block;
    width: 32px;
    height: 18px;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
input[type=checkbox].loginpress-radio-ios + .loginpress-radio-btn {
    background: #fff;
    border-radius: 2em;
    padding: 2px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    border: 2px solid #555d66;
}

input[type=checkbox].loginpress-radio + .loginpress-radio-btn:after {
    position: relative;
    display: block;
    content: "";
    width: 50%;
    height: 100%;
}
input[type=checkbox].loginpress-radio + .loginpress-radio-btn:after {
    left: 0;
}
input[type=checkbox].loginpress-radio-ios + .loginpress-radio-btn:after {
    border-radius: 2em;
    background: #fbfbfb;
    -webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
    transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
    border: 2px solid #555d66;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
}
input[type=checkbox].loginpress-radio:checked + .loginpress-radio-btn:after {
    left: 15px;
    border-color: #fff;
    background: #33b3db;
}

input[type=checkbox].loginpress-radio-ios:checked + .loginpress-radio-btn {
    background: #33b3db !important;
    border-color: #33b3db !important;
}
input[type=checkbox].loginpress-radio.loginpress-radio-ios{
	display:none;
}
.customize-control.customize-control-ios > label{
	width:100%;
	display:block;
}
input[type="checkbox"].loginpress-radio-ios + .loginpress-radio-btn{
	margin-bottom:0px;
	margin-top: 2px;
}

/*
* Range Silder
*/
.customize-control-loginpress-range:hover .loginpress-range-reset {
	opacity: 1;
}


.customize-control-loginpress-range .loginpress-range-reset {
	cursor: pointer;
	height: 19px;
	left: 0;
	position: relative;
	top: 5px;
	-webkit-transition: opacity 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
	transition: opacity 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
	width: 19px;
}

.customize-control-loginpress-range .loginpress-range-reset::after {
	content: "\f531";
	cursor: pointer;
	font: 100 20px/1 dashicons;
	left: 0;
	position: relative;
	top: 2px;
	z-index: 999;
}

.loginpress-range-slider {
    width: 100%;
}

.loginpress-range-slider_range {
    -webkit-appearance: none;
    width: calc(100% - (75px)) !important;
    height: 5px;
    border-radius: 2.5px;
    background: #d7dcdf;
    outline: none;
    padding: 0;
    margin: 0;
}

.loginpress-range-slider_range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #0085ba;
    cursor: pointer;
    -webkit-transition: background .15s ease-in-out;
    transition: background .15s ease-in-out;
}

.loginpress-range-slider_range::-webkit-slider-thumb:hover {
    background: #0085ba;
}

.loginpress-range-slider_range:active::-webkit-slider-thumb {
    background: #0085ba;
}

.loginpress-range-slider_range::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 50%;
    background: #0085ba;
    cursor: pointer;
    -webkit-transition: background .15s ease-in-out;
    transition: background .15s ease-in-out;
}

.loginpress-range-slider_range::-moz-range-thumb:hover {
    background: #0085ba;
}

.loginpress-range-slider_range:active::-moz-range-thumb {
    background: #0085ba;
}

.customize-control input[type=number].loginpress-range-slider_val {
    display: inline-block;
    position: relative;
    width: 60px;
    color: #32373c;
    line-height: 20px;
    border-radius: 3px;
    padding: 5px;
    margin-left: 3px;
}

::-moz-range-track {
    background: #d7dcdf;
    border: 0;
}

input::-moz-focus-inner, input::-moz-focus-outer {
    border: 0;
}

.customize-control-header{
	background: #fff;
    padding: 5px;
    margin-left: -10px;
    margin-right: -10px;
    padding-left: 10px;
    border: 1px solid #ddd;
    font-weight: 600;
    /* letter-spacing: 2px; */
    text-transform: capitalize;
    color: #555;
    background-color: #fff;
    position: relative;
}
.customize-items-child{
	overflow-y: auto;
    overflow-x: hidden;
}
#browser-frame{
	margin: 15px;
    border: 1px solid #e8eaee;
    box-shadow: 0px 0px 14px 10px #FFFFFF;
    width:calc(100% - 30px);
    height:calc(100% - 30px);
}
.browser-topbar{
	background: #e8eaee;
    height: 80px;
    position:relative;
}
.browser-address-bar{
	background:#FFF;
	position:absolute;
	bottom:0px;
	height:40px;
	left:0px;
	right:0px;
}
.browser-url-bar{
	position:absolute;
	left: 100px;
    right:10px;
    top: 5px;
    bottom: 5px;
    border-radius: 15px;
    background: #e8eaee;
        color: #555556;
    font-weight: 500;
    text-indent: 18px;
    padding-top: 6px;
}
.browser-address-bar-tab{
	display: flex;
	display:-webkit-flex;
	bottom: 100%;
    height: 30px;
    top: auto;
    width: auto;
    right: auto;
    min-width: 200px;
    left: 86px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background:#FFF;
    position:absolute;
    padding-left:6px;
    padding-right:6px;
}
.browser-btn img{
	width: 18px;
    margin: 5px 7px;
    margin-top: 11px;
}
.browser-window-btn{
	position:absolute;
	top: 12px;
    left: 6px;
	bottom:80px;
	
}
.browser-window-btn > div{
	margin: 5px;
    width: 12px;
    height: 12px;
    display: inline-block;
	border-radius:50%;
	background:#FFF;
}
#browser-app-fv{
	width:15px;
	height:15px;
	background: #e8eaee;
	background-size: 100%;
    background-repeat: no-repeat;
    background-position:center;
}
#browser-app-title{
	width:auto;
	height:15px;
	font-size:12px;	
}
.browser-address-bar-tab > div{
	display:inline-block;
	margin: 8px 5px;
}
.form-group:last-child{
	margin-bottom:0px !important;
}
.forget-pwd{
	text-align:right;
}
.footer-note{
	background:#fff;
	color:#444;
	text-align:center;
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
}
.footer-note.container-padding{
	padding:5px;
}
.login-container button{
	transition: 0.5s border,0.5s background-color;
}
.config-btn{
	position: absolute;
    right: 10px;
    display:none;
    z-index:2;
}
.config-btn:before{
	font-size: 10px;
    /* width: 16px; */
    /* height: 16px; */
    border: 2px solid #FFF;
    background: #234292;
    color: #FFF;
    padding: 6px;
    border-radius: 50%;
    box-shadow: 0px 0px 2px #444;
    position:absolute;
    cursor:pointer;
}
.logo-container .config-btn{
	left:60%;
	right: auto;
}
#login-page-container > .config-btn[data-container="customize-background"]{
	left:15px;
	top:15px;
	right: auto;
}
#login-page-container > .config-btn[data-container="customize-footer"]{
	left:15px;
	bottom:40px;
	right: auto;
	top:auto;
}
.login-container button{
	position:relative;
}
#browser-frame:hover .config-btn{
	display:block;
}
.flex-boxs{
	display:flex;
	display:-webkit-flex;
	align-items:center;
}
.flex-boxs > *{
	margin:2px;
}
.flex-boxs > *:first-child{
	margin-left:0px;
}
.flex-boxs > *:last-child{
	margin-right:0px;
}
.apply-btn{
	    float: right;
    position: absolute;
    right: 10px;
    background: #234292;
    color: #FFF;
    border: 2px solid #234292;
    /* font-weight: 500; */
    box-shadow: 1px 1px 5px #c1c1c1;
}
.restore-default-btn{
	background: #234292;
    color: #FFF;
    border: 2px solid #234292;
    box-shadow: 1px 1px 5px #c1c1c1;
    width: 100%;
    height: 28px;
}
.restore-default-btn:hover,.apply-btn:hover{
	background:#3e64c7;
	border: 2px solid #3e64c7;
}
.white-label-sub-items{
	position:absolute;
	top:0px;
	left:100%;
	width:100%;
	height:100%;
	transition: all 0.2s;
}
.white-label-sub-items.active{
	display:block;
	left:0%;
}
.themes-thubmail{
	display:inline-block;
	width:calc(50% - 10px);
	margin:5px;
	float:left;
	border: 1px solid #ddd !important;
    box-shadow: 0px 0px 5px #dadada;
    padding:2px;
    line-height: 20px !important;
    text-indent: 0px;
    text-align: center;
}
.themes-thubmail img{
	width:100%;
	float: left;
	border: 1px solid #d4d4d4;
}

/*
*  Themes CSS
**/
.screen-layout-items{
	background:#c2c2c2;
	height: calc(100% - 80px);
	display:flex;
	display:-webkit-flex;
	overflow:hidden;
}
.screen-layout-items .screen-menu{
    width: 100px;
    height: 100%;
    background: #08173d;
    z-index:1;
    position:relative;
    background-size: auto 100% !important;
    background-position: center !important;
}
.menu-overlay{
	position:absolute;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	z-index:-1;
}
.screen-old-layout{
	width: calc(100% - 100px);
    height: calc(100% - 20px);
    background: #fff;
    margin-left: 10px;
    margin-top: 10px;
    position:relative;
}
.app-logo{
	background:#1e2c4e;
	width: 78px;
    height: 78px;
    border-radius: 50%;
    margin: auto;
    margin-top: 10px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.title-frame{
	position: absolute;
    top: 0px;
    height: 30px;
    left: 0px;
    right: 0px;
    background: #234292;
    z-index: 1000;
    color:#fff;
    line-height:30px;
    text-indent:10px;
    font-weight: 500;
}
.bottom-frame{
	position: absolute;
    bottom: 0px;
    height: 30px;
    left: 0px;
    right: 0px;
}
.app-menu ul{
	list-style:none;
	padding-left:0px;
}
.app-menu > ul{
	margin-top:10px;
}
.app-menu ul li{
	padding: 25px 35px;
	position:relative;
}
.app-menu svg{
	width:100%;
}
.app-menu ul ul{
	position: absolute;
    left: 100%;
    top: 0px;
    width: 100px;
    background:#1542b7;
    width: 125px;
        box-shadow: 0px 0px 5px #828282a8;
}
.app-menu ul ul label{
	font-weight:500;
	margin-bottom:0px;
}
.app-menu > ul > li > ul{
	margin-left: 8px;
	color:#fff;
}
.app-menu ul ul ul{
	    box-shadow: 2px 0px 5px #828282a8;
}
.app-menu ul ul li{
	padding:8px;
}
.menu-arrow{
	-webkit-clip-path: polygon(0 50%, 100% 100%, 100% 0);
	clip-path: polygon(0 50%, 100% 100%, 100% 0);
	position:absolute;
	width:10px;
    height: 20px;
    top: 10px;
    left: -7px;
	background:#152858;
}
.selected-submenu{
	background: #152858;
	color:#fff;
}
.selected-app{
	/* background:#224292; */
}
.customise-items hr{
    border-top: 2px solid #d3d6dd;
    margin: 5px 0px;
}
.customise-items{
	color: #7d7f88;
	padding:0px;
}
.bottom-frame ul{
	padding-left:0px;
	list-style:none;
	display: flex;
    display:-webkit-flex;
}
.bottom-frame ul li{
	    width: 30px;
    height: 30px;
    display: inline-flex;
    display:-webkit-inline-flex;
    justify-content: center;
}
.bottom-frame ul li svg{
	width:60%;
	margin:auto;
}
.selected-bottom-icon{
	background:#234292;
}
.overlay-selected-app{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	background: #224292;
	z-index: -1;
}
.selected-texture {
    box-shadow: 0px 0px 2px 4px #0593ff;
}
.texture-container > div{
	width:calc(33.33% - 10px);
	display:inline-block;
	margin:2px;
}
.texture-container > div > div {
    height: 120px;
    background: #eaecf2;
    border-radius: 5px;
    background-size: 100% 100%;
}
.texture-container > div > div {
    cursor: pointer;
}
#browser-frame[data-customisation="customize-themes"]:hover .config-btn{
	display:none !important;
}
.application-link-btn img{
	height: 40px;
}
#mobile-app-container{
	display: flex;
	display: -webkit-flex;
}
#login-page-container > #mobile-app-container{
	position:absolute;
	top:10px;
	bottom:10px;
	left:10px;
	right:10px;
	z-index:0;
}
.application-link-btn:nth-child(2){
	margin-left:10px;
}