section#whats { position: fixed; bottom:15px; right:15px; z-index:1; display:none }

section#whats.active { display:block }
		
section#whats div.in { position: relative; bottom:20px; right:20px }
		
    section#whats div#messenger { 
        position:absolute; bottom:50px; right:-1000px; width:300px; box-shadow: 10px 10px 0 rgba(0,0,0,.1);
    }

    section#whats div#messenger div.body { 
	      height: 300px
    }

    section#whats div#messenger div.body textarea { 
        width:100%;
	      height: 100%;
	      padding:30px 35px;
	      font-size: 14px;
	      border:none
    }

		section#whats header, section#whats footer {
			background-color: rgb(35,210,100);
			padding:15px
		}
		
		section#whats span { color:white; font-size: 14px; }
		
		section#whats i { 
			font-size:30px; background-color: rgb(35,210,100); color:white; padding:20px; border-radius: 100%; 
			box-shadow: 5px 5px 0 rgb(0,0,0,.1); position:absolute; bottom:0; right:0; z-index: 1; cursor: pointer
		}
		
    section#whats footer{ cursor:pointer; position:relative }

		section#whats footer i { 
			font-size:14px; background-color: transparent; color:white; border-radius: 100%; 
			box-shadow: none; position:absolute; top:-1px; right:13px
		}

    section#whats footer:hover{ cursor:pointer; background-color: green }

    section#whats footer:hover i { 
			 right:10px
		}

    section#whats i.fa-times { 
			 color:white; padding:15px 20px; display: none; border:5px solid white
		}

section#whats.on i.fa-times { 
			display: block
		}

section#whats.on div#messenger { 
			  right:40px;
    }
	
	@media screen and (max-width: 480px) {
		* {
		   max-width:inherit;		
	}
	#base, #base * {
		   max-width:100%;
	}
		section#aplicativo div.links a { 
			width:100%;
			margin:0;
		}
		
		section#aplicativo div.links a button { 
		  margin:5px 0!important; left: 0;
		}
	}