p {
    		width: 400px;
    	}

    	.box-cont {
    		position: relative;
    		float: center;

    	}

    	.box {
    		padding: 15px 0 15px 0;
    		width: 200px;
    		border: 1px solid #ddd;
    		text-align: center;
    		cursor: pointer;
    		display: block;
    	}

    	.link-cont, .image-cont {
    		cursor: pointer;
    		position: relative;
    	}

    	.image-cont {
    		cursor: pointer;
    		position: relative;
    		width: 400px;
    	}

    	.image-cont .tooltip {
    		width: 390px;
    	}

    	.link, .image {
    		cursor: pointer;
    	}

		
		
		
		
    	.tooltip {
    		position: absolute;
    		background: #000;
    		color: #fff;
    		text-decoration: none;
    		width: 190px;
    		padding: 5px;
    		border-radius: 14px;
    		text-align: center;
    		display: none;

    		z-index: 999;
    	}

    	.box-cont:hover .tooltip,
    	.link-cont:hover .tooltip,
    	.image-cont:hover .tooltip {
    		display: block;	
    	}

    	.tooltip .tooltip-triangle {
    		display: block;
    		position: absolute;
    		border-left: 5px solid transparent;
    		border-right: 5px solid transparent;
    		content: "";
    	}

    	/** top left */
		.tooltip-top-left {
			height: 20px;
			top: -35px;
			left: 0;
		}   	

    	.tooltip-top-left .tooltip-triangle {
    		border-top: 5px solid #000;
    		bottom: -5px;
    		left: 10px;
    	}

    	/** top right */
    	.tooltip-top-right {
			height: 20px;
			top: -35px;
			right: 0;
		}

		.tooltip-top-right .tooltip-triangle {
    		border-top: 5px solid #000;
    		bottom: -5px;
    		right: 10px;
    	}

    	/** bottom left */
		.tooltip-bottom-left {
			height: 20px;
			bottom: -35px;
			left: 0;
		}   	

    	.tooltip-bottom-left .tooltip-triangle {
    		border-bottom: 5px solid #000;
    		top: -5px;
    		left: 10px;
    	}

    	/** bottom right */
    	.tooltip-bottom-right {
			height: 20px;
			bottom: -35px;
			right: 0;
		}

		.tooltip-bottom-right .tooltip-triangle {
    		border-bottom: 5px solid #000;
    		top: -5px;
    		right: 10px;
    	}

    	/** top center */
    	.tooltip-top-center {
			height: 20px;
			top: -35px;
			left: 0;
		}

		.tooltip-top-center .tooltip-triangle {
			border-top: 5px solid #000;
			bottom: -5px;
			left: 46%;
		}

    	/** bottom center */
    	.tooltip-bottom-center {
			height: 20px;
			bottom: -35px;
			left: 0;
		}

		.tooltip-bottom-center .tooltip-triangle {
			border-bottom: 5px solid #000;
			top: -5px;
			left: 46%;
		}

		/** auto */

		.tooltip-auto {
			top: -55px;
			left: 0;
			width: auto;
			height: auto;
			text-align: left;
		}

		.tooltip-auto .tooltip-triangle {
			border-top: 5px solid #000;
			bottom: -5px;
			left: 46%;
		}

		/** fixed */
		.tooltip-fixed {
			top: -115px;
			left: 0;
			width: 150px;
			height: auto;
			text-align: left;
		}

		.tooltip-fixed .tooltip-triangle {
			border-top: 5px solid #000;
			bottom: -5px;
			left: 46%;
		}

		/** fluid */
		.tooltip-fluid {
			top: -65px;
			left: 0;
			width: 100%;
			height: 100%;
			text-align: left;
		}

		.tooltip-fluid .tooltip-triangle {
			border-top: 5px solid #000;
			bottom: -5px;
			left: 46%;
		}

		/** colors */

		.pacific-point { background: #0078ad; }
		.pacific-point-triangle { border-top-color: #0078ad !important;}

		.wild-wasabi { background: #F2F2F2; }
		.wild-wasabi-triangle { border-top-color: #8db173 !important;}

		.sahara-sand { background: #d1c4b1; }
		.sahara-sand-triangle { border-top-color: #d1c4b1 !important;}
