.mobileonly {
	display: none;	
    position: relative;
}

.mainheadercontainer .inside {
    margin: 0 1em 1em 1em;
    padding: 1em;
}
	
.main-content {
    margin: 1em;
    position: relative;
}

.main-content h1 {
    font: 300 2.5em/1 Frutiger,Arial,Helvetica,sans-serif;
    padding-top: .285em;
    padding-bottom: .265em;
    width: 65%;
}

.main-content h2 {
    font: 300 1.125em/1.11111 Frutiger,Arial,Helvetica,sans-serif;
    padding-top: .22222em;
    padding-bottom: .2em;
    line-height: 1.3em;
    margin: 0.5em 0;
    width: 50%;
}

.main-content h2 span {
    color: #ef0000;
}

.main-content ul {
	list-style-image: url(/content/dam/ubs/microsites/digital/images/checkmark.png);
    margin-left: 1.5em;
    font: 300 1em/1.375 Frutiger,Arial,Helvetica,sans-serif;
    width: 75%;
}

.main-content p, .main-content ul li {
    font: 1em/1.375 Frutiger,Arial,Helvetica,sans-serif;
    padding-top: .145em;
    padding-bottom: .1175em;
    line-height: 1.8em;
    margin-top: .1875em;
    width: 100%;
}

.main-content p a {
    color: #007099;
}

.stoererbubble {
    background-image: url(/content/dam/ubs/microsites/digital/images/ebanking-mobile/callout_fr.png);
    width: 7em;
    height: 7em;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1em;
    position: absolute;
    top: -80px;
    right: -105px;
    z-index: 1;
    display: block;
}

a.activatenow-button {
    background: #6A7D39;
    border: none;
    display: inline-block;
    padding: 10px 20px;
    color: white;
    font: 1em/1.125 Frutiger,Arial,Helvetica,sans-serif;
    position: relative;
    text-decoration: none;
	margin: 1em 0 0 0;
}

a.activatenow-button:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
	right: -11px;
    border-top: 19px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 11px solid #6A7D39;
}

a.activatenow-button button {
    color: #fff;
    background: none;
    border: none;
    position: relative;
}

a.activatenow-button:hover {
	background-color: #4a5d19;
}

a.activatenow-button:hover:before {
	border-color: transparent transparent transparent #4a5d19;
}

.additionallink {
    margin-top: 1em !important;
}
    
ul.custom-bullet {
    list-style: none;
    display: inline-block;
    padding: 0;
    margin: 1em 0 0 0;
    width: 100%;
}
 
 
ul.custom-bullet li {
    font: .875em/1.42857 Frutiger,Arial,Helvetica,sans-serif;
}
 
 
ul.custom-bullet > li {
    clear: left;
    width: 75%;
}
 
ul.arrowstyleubs > li:before {
    background-image: url(/content/dam/static/scripts/keyclub-calculator/svg/link.svg);
    background-size: 13px;
    background-position: center;
 
}
 
ul.custom-bullet > li:before {
    content: "";
    height: 0.8em;
    width: 0.9em;
    display: block;
    float: left;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 100%:;
    margin-top: 4px;
    margin-right: 5px;
 
}
 
ul.arrowstyleubs > li a {
    color: #427C99;
    font-weight: bold;
}
    
.mainheadercontainer {background-color: white;}    
    
/* Mobile */
     
@media only screen and (max-device-width : 1024px) {
    
.desktoponly {display: none;}
    
.mobileonly {display: block;}
    
.mobileonly img {max-width: 100%; margin-bottom: 1em;}
    
.main-content {margin: 0; position: unset;}
    
.main-content h1, .main-content h2, .main-content ul, .main-content p, .main-content ul li  {width: auto;}
    
.mainheadercontainer {background-size: contain;}
    
a.activatenow-button {margin: 1em 0 0 0;}    
    
.stoererbubble {left: 10px; top: 10px;}
    
}
    
/* Tablet */
    
/*@media only screen 
and (max-device-width : 768px) 
and (orientation: portrait)  {
    .mainheadercontainer {background-position: -14em 0; padding: 0;}
    .mainheadercontainer .inside {margin: 0;}
    .main-content h1, .main-content h2 {width: 80%;}
}
    
@media only screen 
and (min-device-width : 1024px) 
and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
    .mainheadercontainer {background-position: -10em 0; padding: 0;}
    .mainheadercontainer .inside {margin: 0; padding: 0.1em;}
}*/
    
/* Animated background */
    
/*.mainheadercontainer {
    background-image:url(/content/dam/ubs/microsites/digital/images/ebanking-mobile/20181122-WMO-EBanking-Header-Desktop-2232x1000-DE.png);
    min-height: 390px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top right;
    margin: 10px auto;
    padding: 0.5em;
    transition: background-image 300ms linear;
}*/

.mainheadercontainer {
	background-image:url(/content/dam/ubs/microsites/digital/images/investment-ideas.png);
	min-height:500px;
    background-size: cover;
	background-repeat: no-repeat;
	margin: 10px auto;
	padding: 0.5em;
	width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
	
	}
    
/* Use additional CSS to control the `height` of `[data-slides]`, like so: */

.test { height: 220px; }
    
@media all and (min-width: 48em) {
	.test { height: 320px; }
}
    
div#preload { display: none; }