﻿.underCenterBox {
	margin: 100px 0;
}
.underCenterBox a:first-of-type button {
	background-color: #eee;
}
.underCenterBox button {
	color: #3c3c3c;
	padding: 15px 30px;
	font-size: x-large;
	border-radius: 8px;
	margin: 0px;
}
.underCenterBox a {
	display: inline-block;
	margin: 20px;
	padding: 0;
}
.topFlex { margin-top: 50px; }
body { background-image: url("img/world.png"); background-repeat: no-repeat; background-position: center top; background-size: contain; /* background-attachment: fixed; */ background-position-y: 50px; }


/* 
CUI Theme
*/
#custom .cui-icon-dell-halo:before {
    content: "";
}

#custom .cui-application-frame .dell-logo {
    width: 47px;
    background-image: url('img/companylogo.png');
    height: 30px;
    background-size: auto 30px;
    background-repeat: no-repeat;
}

#custom .cui-application-name {
    display:none;
}

#custom .cui-application-name.block {
    display:block;
}

#custom .cui-application-title:before {
    content: '4Fold'
}

#custom .cui-masthead {
    background: none repeat scroll 0 0 #ff0000;
    color: #FFFFFF;
}

#custom .cui-masthead .cui-masthead-break {
    background-color: #FFFFFF;
}

#custom .cui-masthead .cui-drawer.cui-drawer-showing {
    background: none repeat scroll 0 0 #ff0000;
}

#custom .cui-masthead .cui-application-title a,
#custom .cui-masthead .cui-masthead-controls .cui-button {
    color: #FFFFFF;
}

#custom .cui-button.cui-button-type-primary:not([disabled="disabled"]),
#custom .cui-button.cui-button-type-primary:active:not([disabled="disabled"]),
#custom .cui-button.cui-button-type-primary:focus:not([disabled="disabled"])
#custom .cui-table tbody tr.selected,
#custom .cui-table tbody tr.selected:hover {
    color: #FFFFFF;
    background-color: #c4000d;
}

#custom .cui-masthead-controls .cui-button:not(.cui-button-type-primary):active:not([disabled="disabled"]),
#custom .cui-masthead-controls .cui-button:not(.cui-button-type-primary):focus:not([disabled="disabled"]) {
    color: #FFFFFF;
}

#custom a.applink .applinklink h3,
#custom .cui-modal .cui-remove,
#custom .cui-button:not(.cui-button-type-primary):active:not([disabled="disabled"]),
#custom .cui-button:not(.cui-button-type-primary):focus:not([disabled="disabled"]),
#custom .section-controls span:focus,
#custom .section-controls a[cui-icon]:focus,
#custom .icon-ctrl:focus,
#custom .cui-checkbox input[type="checkbox"] + span:hover,
#custom .cui-checkbox input[type="checkbox"] + span:focus,
#custom .cui-checkbox input[type="checkbox"]:checked + span {
    color: #c4000d;
}

#custom .cui-menu .cui-menu-item:hover,
#custom .cui-menu .cui-menu-item:focus,
#custom .cui-table tbody tr:hover,
#custom .cui-modal .cui-remove:hover,
#custom .cui-modal .cui-remove:focus,
#custom .icon-ctrl:focus,
#custom .section-controls a[cui-icon]:focus,
#custom ul#camBreadcrumbs.cui-breadcrumb a:focus,
#custom .cui-tooltip-icon:focus {
    background: none repeat scroll 0 0 #f0bfc3;
}

#custom ul#camBreadcrumbs.cui-breadcrumb, 
#custom ul#camBreadcrumbs.cui-breadcrumb a {
    color: #c4000d;
}

#custom ul#camBreadcrumbs.cui-breadcrumb a:hover {
    background-color: #f0bfc3;
}

#custom ul#camBreadcrumbs.cui-breadcrumb a[ng-href=""], 
#custom ul#camBreadcrumbs.cui-breadcrumb a[ng-href=""]:hover {
    color: #333;
}

#custom .cui-textbox:focus,
#custom .cui-textarea:focus,
#custom .cui-drop-down-list:focus {
    border: 1px solid #c4000d;
    box-shadow: 0 0 4px #f0bfc3 inset;
}

#custom .cui-masthead-controls .cui-button.cui-button-type-primary:active:not([disabled="disabled"]):after,
#custom .cui-masthead-controls .cui-button.cui-button-type-primary:focus:not([disabled="disabled"]):after,
#custom .cui-masthead-controls .cui-button:active:not([disabled="disabled"]):not(.cui-button-type-transparent):after,
#custom .cui-masthead-controls .cui-button:focus:not([disabled="disabled"]):not(.cui-button-type-transparent):after {
    border:1px solid #FFFFFF;
}

#custom .cui-button:active:not([disabled="disabled"]):not(.cui-button-type-transparent):after,
#custom .cui-button:focus:not([disabled="disabled"]):not(.cui-button-type-transparent):after {
    border: 1px solid #c4000d;
}

#custom .cui-button.cui-button-type-primary:active:not([disabled="disabled"]):after,
#custom .cui-button.cui-button-type-primary:focus:not([disabled="disabled"]):after {
    border: 1px solid #FFFFFF;
}

#custom cui-tooltip.helptooltip {
    color: #c4000d;
}

#custom .cui-masthead .cui-application-title .cui-application-subname {
	color: #eee;
}

#custom .cui-start-screen .dell-logo i {
    background-image: url('img/companylogo.png');
    background-repeat: no-repeat;
    background-position: center;
    height: 200px; 
    display:block;
}

#custom .cui-start-screen-copyright, 
#custom .cui-start-screen-application-name,
#custom .cui-theme-blue {
    color: #FFFFFF;
}

#custom .cui-theme-blue {
    background-color: #c4000d;
}

#custom .drop-element.drop-theme-cui-menu .drop-content li:hover, 
#custom .drop-element.drop-theme-cui-menu .drop-content li:focus {
    background: none repeat scroll 0 0 #c4000d;
}

#custom .helptooltip {
    color: #c4000d;
}

@media only screen and (max-width: 1200px) {
    #custom .cui-masthead .cui-masthead-controls.cui-masthead-drawer-showing .cui-button.cui-button-type-default {
        color: #333;
    }

    #custom .cui-masthead .cui-masthead-controls.horizontal-list .cui-drop-down-button:hover, 
    #custom .cui-masthead .cui-masthead-controls.horizontal-list .cui-button:hover {
        background-color: #f0bfc3;
    }
}

/*
Status/Error pages
*/
.statuspage,
.errorpage {
    padding-top: 30px;
}

.statuspage h2,
.errorpage h2 {
    margin-left: 0;
    margin-top: 50px;
}


/*
Login page
*/
html { min-height: 100%; position: relative; }
.login { overflow: auto; font-size: 10pt; height: 100%; background-color: #0e1f25; color: #FFFFFF; margin: 0 0 50px; } /* 50px is the footer height */
.login a { color: #FFFFFF; }

.loginLogo { background-image: url('img/companylogo.png'); background-repeat: no-repeat; height: 160px; width: 160px; margin: 5.25% auto 5% auto; }
.loginTitle { font-family: 'Museo Sans Webfont', 'Trebuchet MS', sans-serif; font-size: 36px; text-align: center; width: 100%; margin-bottom: 30px; overflow: hidden;  }
.loginTitle:before { content: 'Portal Login'; }

#errorMessageDiv, #socialAuthMessageDiv { font-size: 11px; width: 684px; text-align: center; margin: 40px auto 30px auto; padding: 20px 30px; border-top: 1px solid; border-bottom: 1px solid; }

.login input[type='text'], .login input[type='password'] { width: 230px; margin: 5px; }

.login .footer { position: absolute; left: 0; bottom: 0; height: 30px; margin-top: 20px; width: 100%; }

.login .modal { color: #282828; display: none; top: 100px; left: 50%; margin-left: -295px; width: 550px; padding: 20px; background-color: #fff; position: absolute; z-index: 101; -moz-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3); -box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3); }
.login .modalBG { position: fixed; height: 100%; width: 100%; background: #d6d6d6; background: rgba(214,214,214,.8); z-index: 100; display: none; top: 0; left: 0;  }
.login .modal h2 { font-size:24px; font-weight:normal; padding-bottom:10px; margin-top:0; }
.login .modal p { margin-left: 15px; }

.login .dellDefenderCloudDiv {
    margin: 50px auto 10px;
    width: 400px;
}

.login .dellDefenderCloudButtons {
    width:240px;
    margin: 10px auto;
}

.login .dellDefenderCloudButtons button {
    padding: 0; 
    display: inline-block; 
    width: 49%;
}

.login #loginSubmitButton,
.login #secondaryLoginSubmitButton {
    margin-top:20px;
}

.login .waitIndicator { 
    display: none; margin: 24px auto; 
    background-image: url('img/spinner.white.png'); 
    -webkit-animation: spin 1.4s infinite linear;
    -moz-animation: spin 1.4s infinite linear;
    animation: spin 1.4s infinite linear;
    background-repeat: no-repeat;
    background-size: contain; width: 48px; height: 48px; background-repeat: no-repeat;
}

/*
four-fold custom start
*/
#custom .loginLogo { width: 310px; height: 120px; }
#custom #errorMessageDiv, #custom #socialAuthMessageDiv { width: 100%; }
#custom .cui-application-frame .dell-logo { width: 80px; }
.login { margin: 0; }
nav { background-color: #3c3c3c; }
nav ul { list-style-type: none; margin: 0; padding: .25% 0; }
nav li { display: inline-block; width: 30%; }
nav a { font-family: 'Museo Sans Webfont', 'Trebuchet MS', sans-serif; font-size: 1.5em; text-transform: capitalize; padding: .5em 0; opacity: 0.85;}
.login nav ul li a:hover { opacity: 1; text-decoration: none; }
q:before, q:after { display: none; }


#topDiv { padding-bottom: 2em; }
.ffCustom { padding: 5% 0 0 0; }
.ffCustom div { text-align: left; }
.ffCustom div.lastOne { padding-bottom: 7em; }
.ffCustom h2 { font-size: 3em; margin: 0 0 2.5%; }
.ffCustom h3 { font-size: 1.75em; color: gray; margin: 5% 0 0; font-weight: bold; }
.ffCustom p { font-size: 1em; margin: 0 auto; }

#information, #about, #custom .footer { background-color: #ffffff; color: #000000; }
#topDiv, #information, #testimonials, #about { position: relative; }
#topDiv .slogan, #topDiv .rightBox { display: none; }
#forgotLogin, #forgotPasswordAnchor { display: inline-block; width: 49%; vertical-align: text-top;}
#testimonials p { margin-bottom: 1.5em; }
#testimonials .quoteReference { display: block; font-size: 80%; text-align: right; margin-right: 10%; }
.ffCustom .ffCustom_flex { display: -moz-flex; display: -webkit-flex; display: flex; -moz-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; margin-bottom: 2%; }
.ffCustom div.left_column { -moz-flex: 1; -webkit-flex: 1; flex: 1; background-repeat: no-repeat; background-position: 85% 1.5em; }
.ffCustom div.middle_column { -moz-flex: 3; -webkit-flex: 3; flex: 3; }
.ffCustom div.right_column { -moz-flex: 1; -webkit-flex: 1; flex: 1; background-repeat: no-repeat; }
.ffCustom .left_column, .ffCustom .right_column { background-size: 45%; }
#information div.email .left_column { background-image: url("img/compass.svg"); }
#information div.fileStorage .left_column { background-image: url("img/compass_tool.svg"); }
#information div.support .left_column { background-image: url("img/pencil.svg"); }
#information div.advertising .left_column { background-image: url("img/protractor.svg"); }
#about a { text-decoration: underline; color: #0e1f25; }
#testimonials p, #about p { padding: 0; }



#custom .footer .fineprint { display: none; }

@media screen and (min-width: 500px) {
	.ffCustom .left_column, .ffCustom .right_column { background-size: 35%; }
}

@media screen and (min-width: 768px) {
	nav a { font-size: 2em; padding-left: 10%; padding-right: 10%; }
	.loginTitle { margin: .5em 0 0; }
	#custom .loginLogo { margin: 0 auto; }
	#custom .footer { height: 0; }
	#about { background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
	#about { background-image: url("img/people-working.png"); }
	#topDiv .topFlex { margin-top: 40px; display: -moz-flex; display: -webkit-flex; display: flex; max-width: 100%; -moz-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; }
	#topDiv .leftBox, #topDiv .rightBox, #topDiv .rightBox { margin: 1em auto; }
	#topDiv .slogan, #topDiv .rightBox { display: block; }
	#topDiv .slogan { font-size: 1.75em; text-transform: capitalize; margin: 4% auto; }
	#topDiv .rightBox { font-size: 1.5em; text-align: left; text-transform: capitalize; }
	#topDiv .rightBox li { list-style: none; }
	#topDiv .rightBox li i { margin-right: 2%; }
	#topDiv .rightBox .cui-textbox { max-width: 95%; }
	#topDiv .leftBox { -moz-flex: 3; -webkit-flex: 3; flex: 3; }
	#topDiv .rightBox { -moz-flex: 2; -webkit-flex: 2; flex: 2; }
	#topDiv .rightBox { -moz-flex: 2; -webkit-flex: 2; flex: 2; padding-right: 5%; }
	.ffCustom, .login #topDiv { height: 100vh; width: 100vw; }
	.ffCustom { padding-top: 2.5%; }
	.ffCustom h2 { font-size: 3.5em; margin: 0; }
	.ffCustom h3 { font-size: 2.25em; }
	.ffCustom p { font-size: 1.5em; }
	.ffCustom .quoteOne, .ffCustom h3 { margin-top: 2.5%; }
	.ffCustom .left_column, .ffCustom .right_column { background-size: 20%; }
	#testimonials .left_column { background-position: 86% 0; }
	#testimonials .right_column { background-position: 7% 0; }
	#testimonials .quoteOne .left_column { background-image: url("img/sarah.png"); }
	#testimonials .quoteTwo .right_column { background-image: url("img/amon.png"); }
	#testimonials .quoteThree .left_column { background-image: url("img/scott.png"); }
	#testimonials .quoteFour .right_column { background-image: url("img/pam.png"); }
	#about h2 { margin-bottom: 2%; }
	.ffCustom .inf_afterImage, .ffCustom .test_afterImage, .ffCustom .cont_afterImage { background-color: #3c3c3c; background-repeat: no-repeat; background-position: center;  padding: 0; width: 100%; height: 5em; position: absolute; bottom: 0; z-index: 0; }
	.top_afterImage { background-color: #3c3c3c; background-repeat: no-repeat; background-position: center;  padding: 0; width: 100%; height: 5em; }
	.top_afterImage { background-image: url("img/ocean.png"); }
	.ffCustom .inf_afterImage { background-image: url("img/asia.png"); }
	.ffCustom .test_afterImage { background-image: url("img/africa-eu.png"); }
	.ffCustom .cont_afterImage { background-image: url("img/americas.png"); }
}



@media screen and (min-width: 900px) {
/* 	#testimonials .quoteOne:before, #testimonials .quoteThree:before { left: 9%; } */
}

@media screen and (min-width: 1200px) {
	nav a { font-size: 2.5em; }
	#information .left_column { background-position-y: 2em; }
}

@media screen and (min-width: 1500px) {
	.ffCustom h2 { font-size: 4.5em; }
	.ffCustom h3 { font-size: 3.5em; }
	.ffCustom p { font-size: 2em; }
	#information .left_column { background-position-y: 3em; }
	#about { background-position-y: 70%; }
}

@media screen and (max-height: 640px) {
	.loginLogo { margin: 3% auto;}
	.ffCustom h2, .login .ffCustom h3, .login .ffCustom p { margin: 0 0 1%; }
	.ffCustom h2 { font-size: 1.5em; }
	.ffCustom h3 { font-size: 1.25em; }
	.ffCustom p { font-size: 1em; }
	#topDiv, #about { background-size: cover; }
	#information .left_column { background-size: 20%; background-position-y: 0; }
}
/*
four-fold custom end
*/

/*
Caching for loading image
*/

.login .footer {
    background: url(img/spinner.blue.png) no-repeat -9999px -9999px;
}

.login .fineprint {
    background: url(img/spinner.black.png) no-repeat -9999px -9999px;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg); 
  } 
}

@-moz-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

/* IE 8 overrides */
@media \0screen {
    #custom .cui-application-frame .dell-logo {
         /* IE8 alternative for background-size */
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/companylogo.png', sizingMethod='scale');
        background-image: none;
    }
}