/* 
    Document   : ui.login
    Created on : 19.04.2012, 18:48:02
    Author     : ubuntu
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

root { 
    display: block;
}

.margin-left-top-size-text {
    margin-top: 45px;
    margin-left: auto;
    margin-right: auto;
    width: 940px !important;
}



.margin-right-tabs {
    margin-right: 20px;
}

.max-with-teaser {
    width: 300px;
    margin-left: 0;
    display: inline;
    float: left;
}


.margin-bottom-text {
    margin-bottom: 20px;
   
}

.margin-top-bottom-main {
     margin-top: 40px;
}

.margin-bottom-logo {
    margin-bottom: 40px;
}

.with-tab{
    width: 310px;
}

.teaser-border-margin {
    margin-top:40px;
    margin-left:20px;
    border: 1px solid #CCE0F3;
    border-radius: 16px 16px 16px 16px;
    box-shadow: 2px 3px 10px #6683B8;
    
}

.text-font {
    font-family: Arial;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 8px;
}

.subtitle-font {
    font-family: Arial;
    font-weight: bold;
    font-size: 18px;
}

.text-font-size {
    font-size: 12px;
}

.tab-width {
    width: 587px;
}

.margin-header-body {
    margin-bottom: 8px;
}

.mamba-button-submit {
    display: inline;
    position:absolute;
    left:-10000px;
}

/**
 * PMOC-1472: Responsive existing login page
 * @author	mbrunner <markus.brunner@1und1.de>
 * @date	20140715
 */
/*
@viewport {
	width: device-width;
	zoom: 1;
}
*/ 
#emaillogin-LoginButton div {
	position: relative;
	top: 18px;
}
.tab-width {
	width: auto;
}
@media screen and (max-width: 1080px) {
	.login {
		min-width: 320px !important;
		width: auto !important;
	}
	.login #upsellteaser-cell {
		display: none;
	}
	.login .margin-left-top-size-text {
		width: 623px !important;
		margin: 45px auto 0;
		padding: 0 13px;
	}
}
@media 
only screen and (max-width: 768px), 
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2) {
	
	html {
		width: device-width;
		zoom: 1;
	}

	/**
	 * hide no-login-content for small devices
	 */
	.login #upselltextlink,
	.login #login-info,
	.login #openhelp,
	.login .onlinestorage-login-content {
		display: none !important;
	}
	/**
	 * scale login-content
	 */
	.margin-bottom-logo {
		margin-bottom: 1em;
	}
	.login #logo-container img {
		width: 75%;
	}
	.login .margin-left-top-size-text {
		width: 96% !important;
		margin: 0;
		padding: 2%;
	}
	.login .margin-left-top-size-text > table,
	.login .form > table {
		width: 100%;
	}
	.login .ui-tabs {
		width: 100% !important;
	}
	.login .tab-width {
		width: 98% !important;
		height: auto;
		margin: 0;
		padding: 1em 1px;
	}
	.login .tab-width > form {
		padding: 0 2%;
	}
	.login .ui-tabs .ui-state-default {
		width: 49% !important;
		margin: 0;
		padding: 0;
	}
	.login .ui-tabs .ui-state-default a div {
		padding: 3% !important;
		font-size: 150%;
	}
	#webmaillogin_form table,
	.login table.etable {
		width: 100% !important;
		margin-bottom: 0 !important;
	}
	.login .login-fields td {
		clear: both;
		display: block;
		margin-bottom: 10px;
	}
	.login .login-fields input {
		width: 96%;
		height: 30px;
		margin: 0;
		padding: 1% 2%;
		font-size: 1.4em;
	}
	#emaillogin-LoginButton div {
		display: block;
		float: left;
		width: 100%;
		height: 2em;
		margin: 0;
		padding: 0;
		text-align: center;
		line-height: 3em;
		height: 3em;
		font-size: 1.4em;
	}
	.login label {
		font-size: 150%;
	}
	.login .maxWidth {
		max-width: 100% !important;
	}
	.login table.etable tr td {
		padding: 0.2em 0;
	}
}