/*
@project Office 365
@version 0.1
@author Mario Rinaldi <cad_mrinaldi@gmail.com>
*/
/* clear fix - //www.webtoolkit.info/css-clearfix.html */ 
#wrapper .clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
#wrapper .clearfix{display:inline-block}
html[xmlns] #wrapper .clearfix{display:block}
* html #wrapper .clearfix{height:1%}
/* /clear fix */

/* Principal */
.pagina-template {
	min-height: 233px;
}


#wrapper hgroup{
	padding: 42px 0px 69px 12px;
}
/* /Principal */

/* tabela-planos */
/* .tabela-planos{
	margin:0 2px;
	background:url("//host.imguol.com/site/uolhost/images/loja-virtual/bg-tabela-linhas.jpg") 0 89px repeat-x;
} */

.tabela-planos .info-detalhes{
	position:relative;
	width:935px;
	height:352px;
    padding-bottom: 36px;
}

.tabela-planos .col-label{
	position:relative;
	/*top:86px;*/
	width:224px;	
	float:left;	
	/*text-align:center;*/
	font-size:14px;
	color:#4f4f4f;
	line-height:160%;
	margin-top:12px;
	margin-top: 25px;
}
.tabela-planos .col-label dl {
    width: 187px;
}
.tabela-planos .col-label dl dt {
    font-weight: bold;
    font-size: 16px;
    color:#525252;
}
.tabela-planos .col-label dl dd {
    background: url("//host.imguol.com/site/uolhost/images/office-365/list-oval-orange.jpg") no-repeat scroll 2px 6px;
    padding-left: 17px;
    border-bottom: 2px #ccc dotted;
    font-size: 14px;
    padding-bottom: 4px;
    margin-bottom: 4px;
}
.tabela-planos .col-label dl dd b { font-weight: bold; }
.tabela-planos .col-label dl dd.last {
    background-image: none;
	border-bottom: none;
}

.tabela-planos .col-label .check{background-position:0 -18px;}

.tabela-planos .col-label strong{font-weight:bold;font-size:16px;}

.tabela-planos .col-label .detalhes{
	margin-top: 33px;
	text-align: left;
	color: #6C6C6C;
}

.tabela-planos .col-label .detalhes p{margin-bottom:20px;}

.tabela-planos .col-planos{
	position:relative;
	/*top:16px;*/
	width:222px;
	height:315px;
	margin:0 7px;
	float:left;
}

.tabela-planos .col-planos h3{
	margin:0 0 39px;
	padding:0 0 25px;
	font-size:27px;
	text-align:center;
    color: #0d78a3;
}
.tabela-planos .col-planos h3 b {
	font-weight:bold;
    font-size:32px;    
}
.tabela-planos .col-planos .ganhe{
	color:#5f5f5f;
	font-size:19px;
	text-align:center;
	padding:0 0 15px;
	margin:0 0 0 17px;
	background:url("//host.imguol.com/site/uolhost/images/office-365/plus.png") no-repeat 46px 2px;
}

.tabela-planos .col-planos .valor{
	font-size:13px;
	color:#4e4e4e;
	text-align:center;
	padding:0 0 22px;
	margin:0;
}
.tabela-planos .col-planos .moeda{font-size:24px;}
.tabela-planos .col-planos .preco{font-size:30px;font-weight:bold;}

.tabela-planos .col-planos .contrate{
	display:block;
	width:134px;
	height:45px;
	margin:0 auto 8px;
	text-indent:-9000px;
	background:url("//host.imguol.com/site/uolhost/images/office-365/bt-contrate.png") no-repeat;
}
.tabela-planos .col-planos .contrate:hover{background-position:0 -45px;}
.tabela-planos .col-planos .detalhes{/*margin-top: 8px;*/ text-align: center;}
.tabela-planos .col-planos p {margin-bottom: 29px;}
.tabela-planos .col-planos p .list{padding-right:10px;}

/*.tabela-planos .plano-1 h3{color:#11a7db;}*/

.tabela-planos .mensagem{
	position: relative;
	top:17px;
	text-align:center;
	font-size:15px;
	/*font-weight:bold;*/
	color:#4f4f4f;
	clear:both;
    left: 231px;
    width: 696px;
}
.tabela-planos .mensagem b{font-weight: bold; font-size: 20px;}
.tabela-planos .mensagem a{font-size: 14px;}
/* /tabela-planos */

/* aba-vantagens */
.aba-vantagens {
}
.aba-vantagens h3{font-size:25px; color: #4f4f4f; margin-bottom: 32px;}

.aba-vantagens dl {
    float:left;
    color:#484848;
    font: 16px arial;
    border-right: 1px #b2b2b2 dotted;
    margin-left: 9px;
    width: 313px;
}
.aba-vantagens dl.opt1 {margin-left:0}
.aba-vantagens dl.opt3 {border:none}

.aba-vantagens dl  dt {
    font-weight: bold;
    background: url("//host.imguol.com/site/uolhost/images/office-365/list-oval-orange-medium.jpg") no-repeat scroll 0 6px;
    padding-left: 17px;
}
.aba-vantagens dl  dd {
    padding-left: 17px;
}
/* /aba-vantagens */

/* aba-tabela */
.aba-tabela {margin: 0 50px;}
.aba-tabela #abas ul {width: 960px;}


/* aba normal */
.aba-tabela #abas ul li a {
    background: url("//host.imguol.com/site/uolhost/images/aba-sprite-secundaria.png") repeat-x 0 0 scroll !important;
    padding-top: 0;
    height: 56px;
    line-height: 62px;
    width: auto; /* capturar valor no firebug e somar 40, atribuir com css individualmente */
    text-shadow: 0 0 4px #484848;
    filter: dropshadow(color=#484848,offX=0,offY=0,strength=4);
}
.aba-tabela #abas ul li a span {float:left;padding-top:4px;}
.aba-tabela #abas ul li a .left, .aba-tabela #abas ul li a .right {width: 25px; height: 56px; display: block;}
.aba-tabela #abas ul li a .left {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-secundaria.png") no-repeat 0 -116px scroll !important;}
.aba-tabela #abas ul li a .right {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-secundaria.png") no-repeat 20px -232px scroll !important;}

/* aba hover */
.aba-tabela #abas ul li a:hover {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-hover.png") repeat-x 0 0 scroll !important;}
.aba-tabela #abas ul li a:hover span {cursor:pointer}
.aba-tabela #abas ul li a:hover .left {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-hover.png") no-repeat 0 -116px scroll !important;}
.aba-tabela #abas ul li a:hover .right {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-hover.png") no-repeat 20px -232px scroll !important;}

/* aba selecionada */
.aba-tabela #abas ul li a.principal {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-selecionada.png") repeat-x 0 0 scroll !important;}
.aba-tabela #abas ul li a.principal .left {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-selecionada.png") no-repeat 0 -116px scroll !important;}
.aba-tabela #abas ul li a.principal .right {background: url("//host.imguol.com/site/uolhost/images/aba-sprite-selecionada.png") no-repeat 20px -232px scroll !important;}

.aba-tabela h3{font-size:18px;}
.aba-tabela .box{display:table;margin-top: 20px;}

.aba-tabela dl {
	font-size: 14px !important;
	color: #4F4F4F;
	height: 205px;
	border-bottom: solid 1px #CECECE;
	margin-bottom: 20px;
}

.aba-tabela dl dt {
	font-size: 18px;
	font-weight: bold;
	color: #0E89C3;
	line-height: 30px;
	margin-bottom: 12px;
}

.aba-tabela dl dt span {
	display: inline-block;
	text-indent: -9999px;
	width: 32px;
	height: 32px;
	margin-right: 10px;
	background: url("//host.imguol.com/site/uolhost/images/ul-itens-azul.png") no-repeat;
}

.aba-tabela dl.desc1 dt span {background-position:0 -1px;}
.aba-tabela dl.desc2 dt span {background-position:0 -33px;}
.aba-tabela dl.desc3 dt span {background-position:0 -65px;}

.aba-tabela dl dd {	
	font-size:14px;
	color:#363434;
	line-height:20px;
	margin-bottom:15px;
}


.tab-conteudo .image{
    position: relative;
    width: 960px;
    text-align: center;
    margin: 0 auto;
    padding-bottom: 50px;
}
.red-balloon {
    position: absolute;
    top: 215px;
    left: 90px;
    text-align: left;
	padding: 20px;
	/*border: 2px solid red;*/
}
.red-balloon.lado-direito {
    right: 90px;
    left: auto;
}
   
.red-balloon > span {
    font-size: 18px;
    color: #059cd6;
    display: block;
    margin-bottom: 10px;
}
.red-balloon p {
    font-size: 16px;
    color: #606060;
    line-height: 20px;
}

.tabela-detalhes {
	margin-bottom: 0;
}

.tabela-detalhes .tab-conteudo{
	margin-bottom:0;
}
/* /aba-tabela */



/* contrato-servico */
.contrato-servico {
	padding: 25px 0;
	margin-left:170px;
}
/* /contrato-servico */

/* LIGHTBOX */
#lightbox-window .header{border:0;}

#lightbox-window .content{
	min-height: 80px;
	margin-top: -10px;
	background:url("//host.imguol.com/site/uolhost/images/loja-virtual/bg-lightbox.jpg") no-repeat;
}

#lightbox-window .content h3{
	clear:both;
	padding:26px 0 34px 0;
	width:360px;
	color:#0d6d96;	
	font-weight:normal;
	font-size:18px;
}

#lightbox-window .content p{width:360px;clear:both;margin:12px 0;}
#lightbox-window .content span{color:#025ec7;}

#lightbox-window .col-1{
	width:360px;
	float:left;
	text-align:right;
}

#lightbox-window .col-2{
	width:360px;
	float:left;
}

#lightbox-window .separador{
	position: relative;
	margin: 0 38px;	
	margin-top:94px;
	width: 2px;
	height: 218px;
	float: left;
	background: url("//host.imguol.com/site/uolhost/images/sep-vertical-general.jpg") repeat-y;
}
/* /LIGHTBOX */



    
/* others */ 
    .others h3 {
        color:#4f4f4f;
        font: 25px;
        margin:0 0 28px;
    }
    .others .box {
        width: 280px;
        height:320px;
        float:left;
        margin:0 29px 30px 0;
        border-right:1px dotted #ccc;
        padding-bottom:0;
        padding-right: 29px;
    }
  
        .others .box dl {}
            .others .box dl dt {
                background: url('//host.imguol.com/site/uolhost/images/office-365/outras/bu_others.png') no-repeat scroll 0 0 transparent;
                height:40px;
                padding-left:20px;
            }
                .others .box dl dt h4,
                .others .box dl dt h4 a {
                    color:#212121;
                    font: 14px arial;
                }
                .others .box dl dt strong {
                    color:#231f20;
                    font-size: 22px;
                    padding-top: 0;
                    display:block;
                }
            .others .box dl dd {}
			.box a {color:#727271;}
            .others .box dl dd.image {display:none}
            .others .box dl dd.text {
                font:14px arial;
                color:#6B6C6C;
                margin-top:173px;
                width:250px;
            }
            .others .box_exchange dl dd.text {width: 260px;}
            .others .box_desktop dl dd.text {width: 265px;}
            .others .box dl dd.price {
                color:#565656;
                font: 13px arial;
                margin-top:20px;
            }
                .others .box dl dd.price a {
                    margin-left: 34px;
                    color:#1f42c4;
                }
                
                .others .box dl dd.price span {font-size: 25px}
                .others .box dl dd.price span a {font-size: 14px}
                .others .box dl dd.price strong {font: bold 25px arial}

.others .box_exchange {background: url('//host.imguol.com/site/uolhost/images/office-365/outras/exchange.png') no-repeat scroll 14px 18px transparent;}
.others .box_online {background: url('//host.imguol.com/site/uolhost/images/office-365/outras/online.png') no-repeat scroll -18px 50px transparent;}
.others .box_desktop {background: url('//host.imguol.com/site/uolhost/images/office-365/outras/desktop.png') no-repeat scroll -4px 45px transparent;}
.others .box_business {background: url('//host.imguol.com/site/uolhost/images/office-365/outras/business.png') no-repeat scroll 0 39px transparent;}


#office-365-business .others .box_online, .others .box_business {margin:0 0 30px;padding:0;border:none;}

#office-365-exchange .others .box_exchange,
#office-365-online .others .box_online,
#office-365-business .others .box_business,
#office-365-desktop .others .box_desktop {display: none}
#office-365-index-a .others .box_online {display: none}


/* BUSINESS */
/* business - header (BG) */
#office-365-business .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-business.jpg") top center no-repeat;}
/* business - detalhes (BG) */
#office-365-business  .tabela-planos .info-detalhes{background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-business.png") no-repeat 225px 1px;}
/* business - abas */
#office-365-business  #exchange .image-2 .red-balloon {top:175px}
#office-365-business  #office .image-2 .red-balloon {top: 274px; right: 83px;}
#office-365-business  #sharepoint .image-1 .red-balloon {top: 205px; right: 100px;}
#office-365-business  #sharepoint .image-2 .red-balloon {top: 342px; left: 92px;}
#office-365-business  #lync .image-1 .red-balloon {top: 205px; right: 122px;}
#office-365-business  #lync .image-2 .red-balloon {top: 281px; left: 92px;}
/* /BUSINESS */


/* DESKTOP */
/* desktop - header (BG) */
#office-365-desktop .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-desktop.jpg") top center no-repeat;}
/* desktop - detalhes (BG) */
#office-365-desktop  .tabela-planos .info-detalhes{background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-desktop.png") no-repeat 223px 0;}
#office-365-desktop  .tabela-planos .col-label dl {width:220px}
#office-365-desktop .col-planos .ganhe {visibility: hidden;}
/* desktop - abas */
#office-365-desktop .aba-tabela {background: none;}
/* /DESKTOP */

/* EXCHANGE */
/* exchange - header (BG) */
#office-365-exchange .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-exchange.jpg") top center no-repeat;}
/* exchange - detalhes (BG) */
#office-365-exchange  .tabela-planos .info-detalhes{background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-exchange.png") no-repeat 223px 0;}
#office-365-exchange  .tabela-planos .col-label dl {width:220px}
/* exchange - MENUZINHO */
#office-365-exchange .with_basic .info-detalhes dl dd.exchange_online,
#office-365-exchange .without_basic .info-detalhes dl dd.exchange_basic {display:none}
#office-365-exchange .info-detalhes dl dd.without_bullet {
	background: none;
	border-bottom: none;
}
#office-365-exchange .info-detalhes dl dd.exchange_basic{
    paddding-bottom:0;
}
#office-365-exchange .info-detalhes dl dd.combo-caixas-postais{
	position:relative;
	width:154px;
	height:36px;
	background:url("//host.imguol.com/site/uolhost/images/office-365/bg-combo.png") no-repeat 17px 0;
	text-align:left;
	cursor:pointer;
    padding-bottom: 13px;
    padding-left: 17px;
    padding-right: 48px;
}
	#office-365-exchange .info-detalhes dl dd.combo-caixas-postais span{
		position: relative;
		top: 8px;
		left: 10px;
		color:#000;
		font-size:16px;
	}
	#office-365-exchange .info-detalhes dl dd.combo-caixas-postais ul{
		position: relative;	
		top:12px;
		border: 1px solid #CCC;
		background: white;
		display:none;
	}

		#office-365-exchange .info-detalhes dl dd.combo-caixas-postais ul li{
			padding:4px;
			font-size:14px;
            text-indent: 5px;
		}

		#office-365-exchange .info-detalhes dl dd.combo-caixas-postais ul li:hover{
			background:#3399FF;
			color:#FFF;
		}
/* exchange - abas */
#office-365-exchange .aba-tabela {background: none;}
#office-365-exchange .image-1 .red-balloon {top: 172px; right: 168px;}
#office-365-exchange .image-2 .red-balloon {top: 86px; left: 98px;}
#office-365-exchange .image-3 .red-balloon {top: 89px; right: 54px;}
#office-365-exchange .player {background: url(//host.imguol.com/site/uolhost/images/office-365/tabs/ea/exchange_img1.jpg) no-repeat scroll 0 0}
#office-365-exchange .player .container {float: right;margin-right: 30px;}
#office-365-exchange .player .red-balloon {top: 59px;bottom: auto; left: 39px;}
/* EXCHANGE */

/* ONLINE */
/* online - header (BG) */
#office-365-online .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-online.jpg") top center no-repeat;}
/* online - detalhes (BG) */
#office-365-online  .tabela-planos .info-detalhes{background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-online.png") no-repeat 225px 1px;}
/* desktop - abas */
#office-365-online #exchange .image-1 .red-balloon {top: 245px; right: 107px;}
#office-365-online #exchange .image-2 .red-balloon {left:93px}
#office-365-online #office .image-2 .red-balloon {top: 275px; right: 146px}
#office-365-online #sharepoint .image .red-balloon {top: 342px; left: 93px;}
#office-365-online #lync .image-1 .red-balloon {top: 330px; right: 171px;}
#office-365-online #lync .image-2 .red-balloon {top: 351px; left: 92px;}
/* /ONLINE */


/* INDEX A */
/* index-a - header (BG) */
#office-365-index-a .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-index-a.jpg") top center no-repeat;}
/* index-a - detalhes (BG) */
#office-365-index-a  .tabela-planos .info-detalhes{
	background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-index-a.png") no-repeat 0 0;
	padding-top: 58px;
}
#office-365-index-a #wrapper hgroup {padding-bottom: 11px;}
#office-365-index-a .tabela-planos .col-text {
	position: relative;
	left: 425px;
	padding-left: 36px;
	padding-top: 26px;
}
	#office-365-index-a .tabela-planos .col-text dl dt {
		color: #212121;
		font-size: 26px;
		margin-bottom: 6px;
	}
	#office-365-index-a .tabela-planos .col-text dl dd {
		color: #505050;
		font-size: 19px;
		padding-left: 4px;
	}
	#office-365-index-a .tabela-planos .col-text dl dd.last {
		border: none;
	}
#office-365-index-a .tabela-planos .col-label {
	position: relative;
	left: 425px;
	padding-left: 42px;
}
#office-365-index-a .tabela-planos .col-plano {
	width: 228px;
	height: 204px;
	padding-top: 19px;
	float: right;
}
#office-365-index-a .tabela-planos .col-plano h3 {
	padding: 0;
	margin-bottom: 10px;
	color: #535353;
	font-weight: normal;
}
#office-365-index-a .tabela-planos .col-plano .conheca {
	background:url("//host.imguol.com/site/uolhost/images/office-365/bt-conheca.png") no-repeat;
	height: 39px;
}
#office-365-index-a .tabela-planos .col-plano .conheca:hover {
	background-position: 0 -39px;
}
#office-365-index-a .tabela-planos .mensagem {
	width: 507px;
	left: 425px;
	color: #6b6c6c;
	font-size: 14px;
	font-weight: normal;
}

/* /INDEX A */


/* INDEX B */
/* index-b - header (BG) */
#office-365-index-b .pagina-template {background: url("//host.imguol.com/site/uolhost/images/backgrounds/bg-office-365-index-b.jpg") top center no-repeat;}
/* index-b - detalhes (BG) */
#office-365-index-b  .tabela-ofertas .info-detalhes{
	background:url("//host.imguol.com/site/uolhost/images/office-365/bg-planos-index-b.png") no-repeat 6px 0;
	padding-top: 22px;
	padding-bottom: 100px;
}
#office-365-index-b #wrapper hgroup {padding-bottom: 45px;}
#office-365-index-b .tabela-ofertas .col-ofertas {
	position: relative;
	/*width: 222px;*/
	width: 214px;
	height: 550px;
	margin: 0 8px;
	float: left;
	padding: 0 4px;
}
#office-365-index-b .tabela-ofertas .ofertas-1 {
	margin-left: 16px;
}
#office-365-index-b .tabela-ofertas .ofertas-4 {
	margin-left: 9px;
	margin-right: 0;
	width: 215px;
}
#office-365-index-b .tabela-ofertas .col-ofertas h3 {
	padding-left: 36px;
	font-size: 14px;
	color: #3f3f3f;
	padding-bottom: 21px;
	margin-bottom: 48px;
}
#office-365-index-b .tabela-ofertas .col-ofertas h3 a {
	color:#3F3F3F;
	font-weight:normal;
}
#office-365-index-b .tabela-ofertas .col-ofertas h3 span{
	font-size: 25px;
	display: block;
	line-height: 21px;
	font-weight:normal;
}
#office-365-index-b .tabela-ofertas .col-ofertas p.text{
	font-size: 14px;
	color: #545454;
	text-align: center;
	margin-bottom: 8px;
}
#office-365-index-b .tabela-ofertas .col-ofertas p.valor {
	font-size: 14px;
	color: #484848;
	text-align: center;
	margin-bottom: 8px;
}
#office-365-index-b .without_basic p.valor.with {display: none}
#office-365-index-b .without_basic p.valor.without {display: block !important}
#office-365-index-b .tabela-ofertas .col-ofertas p.valor span.moeda{
	font-size: 26px;
	color: #6c6c6c;
	font-weight:normal;
}
#office-365-index-b .tabela-ofertas .col-ofertas p.valor span{
	font-size: 34px;
	color: #484848;
	font-weight: bold;
}

#office-365-index-b .tabela-ofertas .col-ofertas dl {
	margin: 0 auto;
	width: 186px;
}
#office-365-index-b .tabela-ofertas .col-ofertas dl dd {
    background: url("//host.imguol.com/site/uolhost/images/office-365/list-oval-orangeb.jpg") no-repeat scroll 4px 14px;
    border-top: 2px #ccc dotted;
    font-size: 14px;
    padding: 8px 0 8px 14px;
    margin-bottom: 4px;
    line-height: 18px;
}
#office-365-index-b .tabela-ofertas .col-ofertas dl dd b {
	font-weight: bold;
}
#office-365-index-b .tabela-ofertas .col-ofertas dl dd.last {
    background-image: none;
}
#office-365-index-b .tabela-ofertas .col-ofertas .conheca{
	display:block;
	width:149px;
	height: 50px;
	margin:0 auto 18px;
	text-indent:-9000px;
	background:url("//host.imguol.com/site/uolhost/images/office-365/bt-conheca.jpg") no-repeat;
}
#office-365-index-b .tabela-ofertas .col-ofertas .conheca:hover{background-position:0 -50px;}


#office-365-index-b .tabela-ofertas .col-ofertas .more-details{
	background:url("//host.imguol.com/site/uolhost/images/office-365/bt-sprite-mais-detalhes.png") no-repeat;
	text-indent:-9000px;
	height: 22px;
	width:108px;
	display:block;
	margin:0 auto;
	position: absolute;
	bottom: 13px;
	left: 56px;
}
#office-365-index-b .tabela-ofertas .col-ofertas .more-details:hover {
	background-position:0 -30px;
}
#office-365-index-b .tabela-ofertas .ofertas-2 .more-details{background-position: -239px 0;}
#office-365-index-b .tabela-ofertas .ofertas-2 .more-details:hover{background-position: -239px -30px;}
#office-365-index-b .tabela-ofertas .ofertas-3 .more-details{background-position: -478px 0;}
#office-365-index-b .tabela-ofertas .ofertas-3 .more-details:hover{background-position: -478px -30px;}
#office-365-index-b .tabela-ofertas .ofertas-4 .more-details{background-position: -717px 0;}
#office-365-index-b .tabela-ofertas .ofertas-4 .more-details:hover{background-position: -717px -30px;}
/* /INDEX B */