.tool-tip, .tool-tip-2, .tool-tip-3, .tool-tip-4 {
            position: relative;
            background: #86475e;
            border: 1px solid #a80768;
            max-width: 850px;
            border-radius: 5px;
            padding: 6px;
            font-size: 14px;
            color: #fff;
            box-sizing: border-box;
            box-shadow: 0px 2px 3px #999;
            text-align: center;
        }
        .tool-tip-2:after, .tool-tip-2:before,
        .tool-tip-3:after, .tool-tip-3:before,
        .tool-tip-4:after, .tool-tip-4:before,
        .tool-tip:after, .tool-tip:before {
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }
        .tool-tip:after, .tool-tip:before {
            left: 100%;
            border: solid transparent;
            top: 50%;
        }

        .tool-tip:after {
            border-left-color: #86475e;
            border-width: 10px;
            margin-top: -10px;
        }
        .tool-tip:before {
            border-left-color: #ba1451;
            border-width: 11px;
            margin-top: -11px;
        }
        
        
        
        .tool-tip-2:after, .tool-tip-2:before {
            right: 100%;
            top: 50%;
            border: solid transparent;
        }

        .tool-tip-2:after {
            border-right-color: #86475e;
            border-width: 10px;
            margin-top: -10px;
        }
        .tool-tip-2:before {
            border-right-color: #86475e;
            border-width: 11px;
            margin-top: -11px;
        }
        
        .tool-tip-3 {
			margin:20px auto;
            margin-top: 10px;
        }
        .tool-tip-3:after, .tool-tip-3:before {
            bottom: 100%;
            left: 50%;
            border: solid transparent;
        }

        .tool-tip-3:after {
            border-bottom-color: #86475e;
            border-width: 10px;
            margin-left: -10px;
        }
        .tool-tip-3:before {
            border-bottom-color: #86475e;
            border-width: 11px;
            margin-left: -11px;
        }
        
        .tool-tip-4 {
			    font-size: 12px;
			margin-left: 6px;
			max-width: 644px;
			z-index:3;
            margin-bottom: -4px;
			    padding: 3px;
        }
        .tool-tip-4:after, .tool-tip-4:before {
            top: 100%;
          right: 56px;
            border: solid transparent;
        }

        .tool-tip-4:after {
            border-top-color: #86475e;
            border-width: 10px;
            margin-left: -10px;
        }
        .tool-tip-4:before {
            border-top-color: #86475e;
            border-width: 11px;
            margin-left: -11px;
        }
        .tool-tip-hover {
            position: relative;
            
        }
        .tool-tip-hover .tool-tip-4 {
            visibility: hidden;
            position: absolute;
            top: -40px;
            -webkit-transition-property: top;
            -moz-transition-property: top;
            transition-property: top;
            -webkit-transition-duration: 0.5s;
            -moz-transition-duration: 0.5s;
            transition-duration: 0.5s;
        }
        
        .tool-tip-hover .switch:hover .tool-tip-4 {
            top: -20px;
            visibility: visible;
        }
        
        @media screen and (min-width: 320px) and  (max-width: 640px) {
			.tool-tip-3 {
				margin: 20px;
				margin-top: 10px;
			}
			.half-wrap {
                width: 100%;
            }
		}
		 @media screen and (min-width: 320px) and  (max-width: 960px) {
			.tool-tip-4 {
				max-width: 97.6%;
				width: 97.6%%;
		} 
          
        }