/*
	DENTAL+ THEME
	Created By: Maciej Kwas
	http://themeforest.net/user/prowseed
*/
.button {
	text-align:right !important;
	display:inline-block;
	float:right;
	line-height:27px;
	color:#555;
	text-decoration:none;
	margin-top:20px;
	}
.button span {
	position:relative;
	background-color:#555;
	display:inline-block;
	width:27px;
	height:27px;
	border-radius:14px;
	font-size:16px;
	color:#fff;
	text-align:center;
	margin-left:12px;
	-webkit-transition: background-color 200ms ease-in;
	-moz-transition: background-color 200ms ease-in;
	-o-transition: background-color 200ms ease-in;
	-ms-transition: background-color 200ms ease-in;
	transition: background-color 200ms ease-in;
	}
.button:hover span {
	background-color:#3f727d;
	}
.button:hover span:after {
	content:' ';
	border: 1px solid #3f727d;
	border-radius: 50%;
	height: 35px;
	width: 35px;
	position:absolute;
	left:-5px;
	top:-5px;
	}
.white {
	color:#fff !important;
	text-shadow: 0px 2px 3px rgba(41,75,114,.26);
	font-family:Oswald, Verdana, Geneva, sans-serif;
	}
::selection {
	background: #6196ca;
	}
::-moz-selection {
	background: #6196ca;
}

/* GRID
	----------------------------------------------------------------*/
.main {
	margin-left:auto;
	margin-right:auto;
	width:980px;
	}
.grid2, .grid4,{
	display: inline;
	float: left;
	margin-left: 20px;
	}
.grid2 {width:300px;}
.grid4 {width:620px;}
.grid4 tr td{
	background-color:#80ab4a;
	color:#fff;
}
.grid4 tr td:hover{
	background-color:#555;
}

@media only screen and (min-width: 720px) and (max-width: 979px) {
	.main {
		margin-left:auto;
		margin-right:auto;
		width:720px;
		}
	.grid2 {width:220px;}
	.grid4 {width:460px;}
	}

@media only screen and (max-width: 719px) {
	.main {
		width:90%;
		}
	
	.grid2, .grid4,{
		width:100%;
		margin-left: 0px;
		}
	}

.bottombar {
	position:relative;
	width:100%;
	background-color:#666;
	}
#location {
	min-height:500px;
	background-image:url(../img/map.png);
	background-position:center top;
	background-repeat:no-repeat;
	}
#location h1 {
	margin-top:42px;
	font-family: 'Kreon', serif;
	color:#fff;
	font-size:46px;
	text-shadow: 0px 2px 3px rgba(41,75,114,.26);
	line-height:63px;
	}
#location a {
	color:#17202F;
	}
#contact_map {
	width:600px;
	border:10px solid #FFF;
	height:350px;
}
.testimonials {
	position:absolute;
	bottom:100px;
	left:50%;
	margin-left:-470px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	}
.testimonials h3 {
	color:white;
	text-shadow: 0px 2px 3px rgba(41,75,114,.26);
	margin-bottom:0px;
	margin-top:20px;
	}
.testimonials p {
	color:#ffffff;
	border-left: 1px solid #fff;
	padding: 30px 0 30px 30px;
	}
.testimonials p span {
	display:block;
	font-size:12px;
	font-style:italic;
	}
.testbutton {
	position:absolute;
	right:0;
	bottom:-65px;
	}
#rings {
	width:339px;
	height:338px;
	background:url('../images/rings.png') center center no-repeat;
	position:absolute;
	top:230px;
	margin-top:-157px;
	left:50%;
	margin-left:-130px;
	}
@keyframes resize {
	0% {
		padding: 0;
		}
	100% {
		padding: 10px;
		margin-left:-10px;
		margin-top:-10px;
		}
	}
@-webkit-keyframes resize {
	0% {
		padding: 0;
		}
	100% {
		padding: 10px;
		margin-left:-10px;
		margin-top:-10px;
		}
	}
.pulsing-ring{
	border: 3px solid #FFFFFF;
	border-radius: 50%;
	height: 21px;
	width: 21px;
	position:absolute;
	left:185px;
	top:150px;
	-webkit-animation-name: resize;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	-webkit-animation-timing-function: ease-in-out;
	animation-name: resize;
	animation-duration: 0.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;

	}
#circle-contact, #circle-zoom, #circle-team {
	font-family:Oswald, Verdana, Geneva, sans-serif;
	position:absolute;
	top:0;
	left:50%;
	}
#circle-contact{
	margin-top:135px;
	margin-left:-150px;
	}
#circle-zoom {
	margin-top:138px;
	margin-left:95px;
	min-width:200px;
	}
#circle-zoom .button {
	float:left;
	}
#circle-team {
	margin-top:250px;
	margin-left:-248px;
	}

/* GOOGLE MAPS HIDDEN CONTAINER HACKS FOR MODAL WINDOW
	----------------------------------------------------------------*/
.gmaps_hidden_box {
	width:0; 
	height: 0; 
	overflow: hidden;
}
.gmaps_hidden_content {
	padding:10px; 
	background:#fff;
}
.gmaps_hidden_map {
	width:700px; 
	height:450px;
}


/* MEDIA QUERIES RULES FOR SMALL VIEWPORTS
	----------------------------------------------------------------*/
@media only screen and (min-width: 720px) and (max-width: 979px) {
	#location h1 {
		margin-top:42px;
		font-family: 'Kreon', serif;
		color:#fff;
		font-size:46px;
		text-shadow: 0px 2px 3px rgba(113,68,43,.26);
		line-height:63px;
		}
	#location p.white {
		font-size:13px;
		line-height:20px;
		}
	.testimonials {
		margin-left:-360px;
		}
	.testimonials p {
		padding: 20px 0 20px 30px;
		}
	.testbutton {
		position:absolute;
		right:0;
		bottom:-65px;
		}
	}

@media only screen and (max-width: 719px) {
	#contact_map {
		max-width:90%;
		height:300px;
		}
	#rings, .testimonials {
		display:none;
		}
	#location {
		min-height:300px;
		}
	}


/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; font-family:Oswald, Verdana, Geneva, sans-serif;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; border:5px solid #fff;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#888;}
#colorbox{}
    #cboxTopLeft{width:25px; height:25px; background:url(../images/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(../images/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(../images/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(../images/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(../images/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(../images/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(../images/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(../images/border2.png) repeat-y -25px 0;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:-5px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:-5px; left:100px; color:#999;}
        #cboxSlideshow{position:absolute; bottom:-5px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:-5px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:-5px; left:63px; color:#444;}
        #cboxLoadingOverlay{background:#fff url(../images/loading.gif) 50% 50% no-repeat;}
        #cboxClose{position:absolute; bottom:-5px; right:0; display:block; color:#444;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}