/* <---------- reset elements styles for all browser and normalize  starts here*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,hgroup,menu,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="gearSpinningbox infinite"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
/* reset elements styles for all browser and normalize ends here ----------> */

*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0);outline:none}
a,a:hover{text-decoration:none;cursor:pointer}

/* <---------- custom fonts starts */
@font-face{font-family:'RobotoSlabThin';src:url('../../../fluidicv2/styles/css/plugins/fonts/RobotoSlab-Thin.ttf') format('truetype');font-weight:normal;font-style:normal}
@font-face{font-family:'RobotoSlabLight';src:url('../../../fluidicv2/styles/css/plugins/fonts/RobotoSlab-Light.ttf') format('truetype');font-weight:normal;font-style:normal}
@font-face{font-family:'RobotoSlabRegular';src:url('../../../fluidicv2/styles/css/plugins/fonts/RobotoSlab-Regular.ttf') format('truetype');font-weight:normal;font-style:normal}
@font-face{font-family:'OpenSansLight';src:url('../../../fluidicv2/styles/css/plugins/fonts/OpenSans-Light.ttf') format('truetype');font-weight:normal;font-style:normal}
/* custom fonts ends ----------> */

/* <---------- html, body, wrapper¸ header, main, footer, container starts */
html,body,#wrapper,header,main,footer,.horizontalSeperator{float:left;width:100%;height:auto;font:14px 'RobotoSlabThin';position:relative}
.container{width:100%;max-width:1200px;height:auto;padding:0 20px;margin:auto}
.container:before,.container:after{content:' ';display:table}
.container:after{clear:both}
/* html, body, wrapper¸ header, main, footer, container ends ----------> */

/* <---------- header starts */
header{background:#4d5358;padding:33px 0 34px}
.logo,.logo img{float:left;width:auto;max-width:700px}
.logo img{background:url(../images/sprites.png) no-repeat 0 -717px;width:169px;height:30px;display:block}
.logo h1{clear:both;float:left;font:18px RobotoSlabLight;color:#fff;margin:10px  0 0}
header a{background:#18bf72;float:right;width:157px;height:43px;font:19px RobotoSlabRegular;text-align:center;color:#fff;padding:7px 15px;margin:15px 5px 0 0;border-radius:3px}
header a:last-child{background:#ce4d0e}
/* header ends ----------> */

/* <---------- OpManager Login Info starts */
.OpManagerLoginInfo{padding:105px 0 45px;text-align:center;color:#323232}
.OpManagerLoginInfo h2{font:bold 65px 'RobotoSlabThin';color:#342b2e}
.loginInfo{float:left;width:100%}
.loginInfo form,.externalLinks{width:293px;height:322px;margin:32px 35px 24px;display:inline-block;position:relative}
.loginInfo form a{width:293px;height:322px;border-radius:15px;display:inline-block;position:relative;opacity:.9;filter:alpha(opacity=90)}
.loginInfo form a:hover{opacity:1;filter:alpha(opacity=100)}
.loginInfo form a:before{background:url(../images/sprites.png) no-repeat 0 -70px;width:293px;height:322px;content:'';display:block}
a.operatorLogin:before{background-position:0 -393px !important}
a.guestLogin:before{background-position:-294px -70px !important}
.externalLinks{width:380px;height:304px;border-left:1px solid #c0c9de;position:relative;top:15px}
.externalLinks > div{background:url(../images/dotted.png) repeat-x bottom;float:left;width:100%;height:auto;position:relative}
.externalLinks > div:last-child{background:none}
.prdFeatures a,.techVideo a{float:left;width:100%;font:22px RobotoSlabRegular;text-align:left;color:#324a76;padding:35px 0 35px 70px;position:relative}
.prdFeatures a:before,.techVideo a:before{background:url(../images/sprites.png) no-repeat -170px -716px;width:37px;height:37px;content:'';position:absolute;top:30px;left:20px}
.techVideo a:before{background-position:-207px -716px}
.techPartners a{float:left;padding:0 0 20px}
.techPartners b{font:22px RobotoSlabRegular !important;text-align:left;color:#324a76;padding:20px 0 0 25px;margin:0 !important}
.techPartners i{background:url(../images/sprites.png) no-repeat 0 -754px;width:341px;height:35px;margin:0 0 0 25px;display:block}
a.operatorLogin:before{background-position:0 -393px !important}
.loginInfo a:after{content:'';margin:auto;border-radius:50%;position:absolute;right:0;left:0;z-index:1}
.adminLogin:after{width:88px;height:88px;border:5px solid #afb9d2;top:77px}
.adminLogin:hover:after{animation:radarEffectAdmin 1.3s ease-out 75ms infinite;-moz-animation:radarEffectAdmin 1.3s ease-out 75ms infinite;-webkit-animation:radarEffectAdmin 1.3s ease-out 75ms infinite;-o-animation:radarEffectAdmin 1.3s ease-out 75ms infinite}
.operatorLogin:after,.guestLogin:after{width:105px;height:105px;border:5px solid #cc9eaf;top:65px}
.guestLogin:after{border-color:#98d9bb}
.operatorLogin:after{width:105px;height:105px;border:5px solid #cc9eaf;top:65px}
.operatorLogin:hover:after{animation:radarEffectOperator 1.3s ease-out 75ms infinite;-moz-animation:radarEffectOperator 1.3s ease-out 75ms infinite;-webkit-animation:radarEffectOperator 1.3s ease-out 75ms infinite;-o-animation:radarEffectOperator 1.3s ease-out 75ms infinite}
.guestLogin:hover:after{animation:radarEffectGuest 1.3s ease-out 75ms infinite;-moz-animation:radarEffectGuest 1.3s ease-out 75ms infinite;-webkit-animation:radarEffectGuest 1.3s ease-out 75ms infinite;-o-animation:radarEffectGuest 1.3s ease-out 75ms infinite}
.loginInfo form a > i{width:283px;height:312px;border-radius:15px;position:absolute;top:5px;left:5px;z-index:-1;box-shadow:0 0 25px -3px rgba(0,0,0,.75)} 0 25px -3px rgba(0,0,0,.75)}
.loginInfo form a:hover > i{box-shadow:0 0 36px -3px rgba(0,0,0,.75)}
.OpManagerLoginInfo p{clear:both;float:none;max-width:1000px;font:24px/40px OpenSansLight;margin:auto}
.OpManagerLoginInfo b{font-size:29px;margin:83px 0 15px;display:block}
.OpManagerLoginInfo strong{font-size:37px}
.demoRegister{background:#586f9a;width:211px;height:55px;font:22px RobotoSlabRegular;color:#fff;padding:11px;border-radius:3px;display:inline-block}
/* OpManager Login Info ends ----------> */

/* <---------- footer starts */
footer{background:#f2f3f4;font-family:RobotoSlabLight;text-align:center;padding:32px 0 42px;margin:83px 0 20px;border-top:1px solid #dedede}
footer div p{font-size:18px;color:#292929;margin:0 20px 29px;display:inline-block}
footer a{color:#292929}
footer a:hover{text-decoration:underline}
footer div p b{font:20px RobotoSlabRegular;color:#4c4b4b}
footer > p{font-size:20px}
/* footer ends ----------> */

/* <---------- radar effect admin animation starts */
@-webkit-keyframes radarEffectAdmin{
	0%{ opacity infinite:.3;filter:alpha(opacity=30) }
	40%{ opacity:.5;filter:alpha(opacity=50);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #afb9d2, 0 0 0 10px rgba(255,255,255,.5) }
	100%{ opacity:0;filter:alpha(opacity=0);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #afb9d2, 0 0 0 10px rgba(255,255,255,.5);transform:scale(1.5) }
}
/* radar effect admin animation ends ----------> */

/* <---------- radar effect operator animation starts */
@-webkit-keyframes radarEffectOperator{
	0%{ opacity infinite:.3;filter:alpha(opacity=30) }
	40%{ opacity:.5;filter:alpha(opacity=50);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #cc9daf, 0 0 0 10px rgba(255,255,255,.5) }
	100%{ opacity:0;filter:alpha(opacity=0);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #cc9daf, 0 0 0 10px rgba(255,255,255,.5);transform:scale(1.5) }
}
/* radar effect operator animation ends ----------> */

/* <---------- radar effect guest animation starts */
@-webkit-keyframes radarEffectGuest{
	0%{ opacity infinite:.3;filter:alpha(opacity=30) }
	40%{ opacity:.5;filter:alpha(opacity=50);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #98d9bb, 0 0 0 10px rgba(255,255,255,.5) }
	100%{ opacity:0;filter:alpha(opacity=0);box-shadow:0 0 0 2px rgba(255,255,255,.1), 0 0 10px 10px #98d9bb, 0 0 0 10px rgba(255,255,255,.5);transform:scale(1.5) }
}
/* <---------- radar effect guest animation ends */

/* <---------- scaling animation starts */
.scale95{transform:scale(.95);transition:all .3s ease;-ms-transition:all .3s ease;-moz-transition:all .3s ease;-webkit-transition:all .3s ease;-o-transition:all .3s ease}
.scale95:hover{transform:scale(1)}
/* scaling animation ends ----------> */

 @media only screen and (max-height:1000px){ 
header{padding:18px 0}
.logo img{zoom:90%}
.logo h1{font-size:15px}
.OpManagerLoginInfo{padding:13px 0 30px}
.OpManagerLoginInfo h2{font-size:36px}
body:not(.ie11) .loginInfo{zoom:60%}
.loginInfo form{margin:28px 35px 20px}
body:not(.ie11) .OpManagerLoginInfo p{max-width:760px;font:18px/30px OpenSansLight}
.OpManagerLoginInfo b{font-size:18px;margin:25px 0 15px}
.OpManagerLoginInfo strong{font-size:28px}
.demoRegister{width:170px;height:40px;font-size:18px;padding:6px}
footer{padding:15px 0 22px;margin:0 0 20px}
footer div p{font-size:16px;margin:0 20px 20px}
footer > p{font-size:16px}
}

 @media only screen and (max-height:900px){ 
body.ie11 .loginInfo{margin:-100px auto -50px;transform:scale(.5)}
body.ie11 .OpManagerLoginInfo p{max-width:1000px;font:18px/30px OpenSansLight}
body.Windows.firefox #wrapper > main{margin-bottom:-190px;transform:scale(0.7);transform-origin:50% 0}
}