/*
Theme Name: Grey Street – dental surgery
Theme URI: http://blacksheepdesign.co.nz
Author: Blacksheepdesign 
Author URI: http://www.blacksheepdesign.co.nz/
Author Design : Stacey Cottrill - stacey@blacksheepdesign.co.nz 

Version: 1.0
*/



/*reset*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form,label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; text-decoration: none; font-weight: normal; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;  color: rgb(101, 101, 101);  font-family: 'georgiaitalic';
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
::-moz-selection { background: rgb(226,35,26);color: rgb(255, 255, 255); text-shadow: none; }
::selection { background: rgb(226,35,26);color: rgb(255, 255, 255); text-shadow: none; }

::-webkit-input-placeholder {color: rgba(255, 255, 255, 0.5);}
:-moz-placeholder {color: rgba(255, 255, 255, 0.5);}
::-moz-placeholder{color: rgba(255, 255, 255, 0.5);}
:-ms-input-placeholder { color: rgba(255, 255, 255, 0.5);}



/*config*/
html,body {
	width:100%;
	height:100%;
}
h1,h2,h3,h4,h5,h6 {line-height: 1.8em; }
h1 {font-size: 38px; }
h2 {font-size: 27px; }
h3 {font-size: 23px; }
h4 {font-size: 15px; }
h5 {font-size: 17px; }
h6 {font-size: 14px; }

p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset,figure { margin-bottom: 20px;}
p {font-family: inherit;font-weight: normal;font-size: 16px;line-height: 1.8em;margin-bottom: 20px;}


a, li,dd{font-size:16px;}
li {line-height:1.8em;}
span,dt,dd {font:inherit}

.both:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.both { zoom: 1; }
.left { float: left; }
.right { float: right; }
.indent { text-indent: -99999px; display: block; }
.none {display: none;}
.block {display: block;}
.inline {display:inline;}
.inline-block {display: inline-block;}
.relative {position: relative;}
.fixed {position: fixed;}
.absolute {position: absolute;}
.static {position: static;}
.ease8 {-moz-transition: all .8s linear; -webkit-transition: all .8s ease; -o-transition: all .8s linear; -ms-transition: all .8s linear; transition: all .8s ease; }
.ease5 {-moz-transition: all .5s linear; -webkit-transition: all .5s ease; -o-transition: all .5s linear; -ms-transition: all .5s linear; transition: all .5s ease; }
.ease2 {-moz-transition: all .2s linear; -webkit-transition: all .2s ease; -o-transition: all .2s linear; -ms-transition: all .2s linear; transition: all .2s ease; }
.ease1 {-moz-transition: all .1s linear; -webkit-transition: all .1s ease; -o-transition: all .1s linear; -ms-transition: all .1s linear; transition: all .1s ease;}
.strong, strong {}
.overflow {overflow: hidden;}
.sprite {background-image:url(img/sprite.png); background-repeat: no-repeat; }

i, .italic{font-style: italic;}
strong, .strong{font-weight:700;}

.text-left {text-align: left;}
.text-center {text-align: center;}
.text-justify {text-align: justify;}
.text-right {text-align: right;}
.uppercase {text-transform: uppercase;}
.underline {text-decoration:underline;}
.grayscale {filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */filter: gray; /* IE6-9 */-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */}
.lh0{line-height: 0;}
.lh12{line-height: 1.2em;}
.lh16{line-height: 1.6em;}
.lh100{line-height: 100%;}
.top-left-zero {top: 0; left: 0;}
.top-right-zero {top: 0; right: 0;}
.bottom-left-zero {bottom: 0; left: 0;}
.bottom-right-zero {bottom: 0; right: 0;}
.zindex {z-index: 1;}
.zindex2 {z-index: 2;}
.zindex3 {z-index: 3;}
.zindex4 {z-index: 4;}
.zindex5 {z-index: 5;}
.perspective {-webkit-perspective: 1000px;}
.backface {-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden;}
.preserve3d {-webkit-transform-style: preserve-3d;}
.cover {-moz-background-size: cover;-webkit-background-size: cover;-o-background-size: cover;background-size: cover; }
.bg100 {background-size:100%;}
.no-repeat {background-repeat: no-repeat}
.cposition{background-position:center;}
.bposition{background-position:bottom;}
.lposition{background-position:left;}
.rposition{background-position:right;}
.tposition{background-position:top;}
.bgfix {background-attachment:fixed;}
.opacity10 {opacity: 1!important;}
.opacity08 {opacity: 0.8;}
.opacity05 {opacity: 0.5;}
.opacity03 {opacity: 0.3;}
.opacity01 {opacity: 0.1;}
.opacity0 {opacity: 0;}
.ellipsis {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.pointer {cursor:pointer}
.sp {letter-spacing:0.2em;}
.rotate90 {-webkit-transform: rotateZ(-90deg); transform: rotateZ(-90deg); }
.we-open p{margin-bottom:0px}
textarea {resize:none; overflow:auto}
input, textarea { background: transparent; border: 0; -webkit-appearance: none;  -webkit-border-radius: 0; outline: none!important; font-family: inherit; color: inherit; font-size:16px; -webkit-font-smoothing: antialiased;  padding:10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;}

/*radio-custom*/
input[type="radio"] { display:none; }
input[type="radio"] + label {}
input[type="radio"] + label h5 {opacity:0.5; display:inline; -webkit-transition:background-color 0.4s linear;-o-transition:background-color 0.4s linear;-moz-transition:background-color 0.4s linear;transition:background-color 0.4s linear;}
input[type="radio"] + label span {display:inline-block;width:15px;height:15px;margin:-2px 15px 0 0;vertical-align:middle;cursor:pointer;}
input[type="radio"] + label span {background-color: rgba(255,255,255,0.1);}
input[type="radio"]:checked + label h5{opacity:1}
input[type="radio"]:checked + label span{background-color: rgb( 238, 84, 100 );}
input[type="radio"] + label span,input[type="radio"]:checked + label span {-webkit-transition:background-color 0.4s linear;-o-transition:background-color 0.4s linear;-moz-transition:background-color 0.4s linear;transition:background-color 0.4s linear;}

/*check-custom*/
input[type="checkbox"] { display:none; }
input[type="checkbox"] + label {}
input[type="checkbox"] + label h5 {opacity:0.5; display:inline; -webkit-transition:background-color 0.4s linear;-o-transition:background-color 0.4s linear;-moz-transition:background-color 0.4s linear;transition:background-color 0.4s linear;}
input[type="checkbox"] + label span {display:inline-block;width:15px;height:15px;margin:6px 15px 0 0;vertical-align:middle;cursor:pointer;}
input[type="checkbox"] + label span {background-color: rgba(255,255,255,0.1);}
input[type="checkbox"]:checked + label h5{opacity:1}
input[type="checkbox"]:checked + label span{background-color: rgb( 238, 84, 100 );}
input[type="checkbox"] + label span,input[type="radio"]:checked + label span {-webkit-transition:background-color 0.4s linear;-o-transition:background-color 0.4s linear;-moz-transition:background-color 0.4s linear;transition:background-color 0.4s linear;}






.mc {margin: 0px auto; margin-top: 0; margin-bottom: 0;}

/*margin*/
.mt0 {margin-top: 0px;}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt40 {margin-top: 40px;}
.mt60 {margin-top: 60px;}
.mt80 {margin-top: 80px;}
.mt100 {margin-top: 100px;}
.mt120 {margin-top: 120px;}
.mt140 {margin-top: 140px;}

.mr0 {margin-right: 0px;}
.mr10 {margin-right: 10px;}
.mr20 {margin-right: 20px;}
.mr40 {margin-right: 40px;}
.mr60 {margin-right: 60px;}
.mr80 {margin-right: 80px;}
.mr100 {margin-right: 100px;}
.mr120 {margin-right: 120px;}
.mr140 {margin-right: 140px;}

.mb0 {margin-bottom: 0px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb60 {margin-bottom: 60px;}
.mb80 {margin-bottom: 80px;}
.mb100 {margin-bottom: 100px;}
.mb120 {margin-bottom: 120px;}
.mb140 {margin-bottom: 140px;}

.ml0 {margin-left: 0px;}
.ml10 {margin-left: 10px;}
.ml20 {margin-left: 20px;}
.ml40 {margin-left: 40px;}
.ml60 {margin-left: 60px;}
.ml80 {margin-left: 80px;}
.ml100 {margin-left: 100px;}
.ml120 {margin-left: 120px;}
.ml140 {margin-left: 140px;}



/*padding*/
.pt0 {padding-top: 0px;}
.pt10 {padding-top: 10px;}
.pt20 {padding-top: 20px;}
.pt40 {padding-top: 40px;}
.pt60 {padding-top: 60px;}
.pt80 {padding-top: 80px;}
.pt140 {padding-top: 140px;}

.pr0 {padding-right: 0px;}
.pr10 {padding-right: 10px;}
.pr20 {padding-right: 20px;}
.pr40 {padding-right: 40px;}
.pr60 {padding-right: 60px;}
.pr80 {padding-right: 80px;}
.pr140 {padding-right: 140px;}

.pb0 {padding-bottom: 0px;}
.pb10 {padding-bottom: 10px;}
.pb20 {padding-bottom: 20px;}
.pb40 {padding-bottom: 40px;}
.pb60 {padding-bottom: 60px;}
.pb80 {padding-bottom: 80px;}
.pb140 {padding-bottom: 140px;}

.pl0 {padding-left: 0px;}
.pl10 {padding-left: 10px;}
.pl20 {padding-left: 20px;}
.pl40 {padding-left: 40px;}
.pl60 {padding-left: 60px;}
.pl80 {padding-left: 80px;}
.pl140 {padding-left: 140px;}


/*top*/
.t0 {top: 0px;}
.t50 {top: 50%;}
.t80 {top: 80px;}
.t160 {top: 160px;}
.t240 {top: 240px;}
.t320 {top: 320px;}
.t400 {top: 400px;}
.t480 {top: 480px;}
.t560 {top: 560px;}


/*left*/
.l0 {left: 0px;}
.l50 {left: 50%;}
.l80 {left: 80px;}
.l160 {left: 160px;}
.l240 {left: 240px;}
.l320 {left: 320px;}
.l400 {left: 400px;}
.l480 {left: 480px;}
.l560 {left: 560px;}


/*right*/
.r0 {right: 0px;}
.r80 {right: 80px;}
.r160 {right: 160px;}
.r240 {right: 240px;}
.r320 {right: 320px;}
.r400 {right: 400px;}
.r480 {right: 480px;}
.r560 {right: 560px;}


/*bottom*/
.b0 {bottom: 0px;}
.b80 {bottom: 80px;}
.b160 {bottom: 160px;}
.b240 {bottom: 240px;}
.b320 {bottom: 320px;}
.b400 {bottom: 400px;}
.b480 {bottom: 480px;}
.b560 {bottom: 560px;}


/*widths*/
.width1 {width: 60px;}
.width2 {width: 140px;}
.width3 {width: 220px;}
.width4 {width: 300px;}
.width5 {width: 380px;}
.width6 {width: 460px;}
.width7 {width: 540px;}
.width8 {width: 620px;}
.width9 {width: 700px;}
.width10 {width: 780px;}
.width11 {width: 860px;}
.width12 {width: 940px;}
.width100 {width: 100%;}
.width90 {width: 90%;}
.width80 {width: 80%;}
.width70 {width: 70%;}
.width66 {width: 66.666666666%;}
.width65 {width: 65%;}
.width60 {width: 60%;}
.width50 {width: 50%}
.width48 {width: 48%}
.width45 {width: 45%}
.width40 {width: 40%}
.width30 {width: 30%}
.width33 {width: 33.333333333%}
.width25 {width: 25%}
.width20 {width: 20%}
.width16 {width:16.66666666666667%}


/*height*/
.height1 {height: 80px;}
.height2 {height: 140px;}
.height3 {height: 220px;}
.height4 {height: 300px;}
.height5 {height: 380px;}
.height6 {height: 460px;}
.height7 {height: 540px;}
.height8 {height: 620px;}
.height9 {height: 700px;}
.height10 {height: 780px;}
.height11 {height: 860px;}
.height12 {height: 940px;}
.height100 {height: 100%;}
.height90 {height: 90%;}
.height80 {height: 80%;}
.height70 {height: 70%;}
.height66 {height: 66.666666666%;}
.height50 {height: 50%}
.height40 {height: 40%}
.height33 {height: 33.333333333%}
.height25 {height: 25%}
.height0 {height: 0px}


/*fonts*/
.trade-bold {font-family: 'trade_gothic_lt_stdBdCnno.20';}
.trade-regular {font-family: 'trade_gothic_lt_stdCnno.18';}
.minion-regular {font-family: 'minion_proregular';}
.georgia-italic {font-family: 'georgiaitalic';}

/*colors*/
.cian {color:rgb(0,153,168)}
.bg-cian {background-color:rgb(0,153,168)}

.white {color:rgb(255,255,255)}
.bg-white {background-color:rgb(255,255,255)}


.yellow {color:rgb(255,209,0) }
.bg-yellow {background-color:rgb(255,209,0) }

.red {color:rgb(226,35,26)}
.bg-red {background-color:rgb(226,35,26)}
.blue {}
.box a {color:rgb(0,153,168)}

/*css*/
.width6 {max-width:460px}
h2 {  line-height: 1.5em; }
a,li,p {font-size:15px}
.width80px {width:80px}
.width1200 {width:1200px}
.mt5 {margin-top:5px}
.mb10 {margin-bottom:10px}
.pt70 {padding-top:70px}
.pt70:first-child{margin-top:-70px}
.mt260 {margin-top:260px}
.pt260 {padding-top:260px}
.height1300 {height:1300px}
/*video {text-align: center; position: absolute; left: 0%; margin-left: 0px; top: -15%; width:100%}*/
#home {/*min-height:800px*/}
#video-wrapper {
	position: relative;
	height:75%;
	min-height: 600px;
	background: url('img/1402623003SmileComposition.jpg');
	background-size: cover;
	overflow: hidden;

}
@media screen and (orientation: portrait) {
	#video-wrapper {
		background: url('img/mobile-smile.jpg');
		background-size: cover;
	}
}

#content,
#main-cont {
	width:100%;
	height:100%;
}
#main {
	width: 100%; 
	height: 100%; 
	left:0px; 
	min-width: 390px;
	/*min-height:100%;*/
}
#main.active, #header.active{left:-275px}
#header {left:0px; min-width:390px}
#header div {margin:50px}

#menu-home { 
	position: relative;
	height:25%; 
	min-width:390px; 
	min-height:225px;
}
#menu-home  div {padding: 40px 0;}

#menu a {font-size:16px}
#menu a.active {border-bottom: 2px solid;}
#menu-home dt  {border-bottom: 1px solid; padding-bottom: 10px; margin-bottom: 10px;}
#menu-home .width1200 { width: 90%; max-width: 1200px; position: relative; overflow: hidden; }
#menu-home .medio { position: absolute; width: 100%; padding: 0px!important; }
#menu-home .medio dl { margin: 0 auto; float: none; top: 0px; }
#sidebar {width:290px; right:-290px; position: fixed;  overflow: auto; }
#logo.active { position:fixed; margin-left:50px}

#sidebar.active {right: -15px;}
#content {right:0px}
#content.active {right:275px}
#sidebar .cont-side {margin:50px 40px 40px; }

#sidebar ul li a{color:white; opacity:0.5}
#sidebar ul li a:hover{color:white; opacity:1}
#sidebar ul li a.active {color:white; opacity:1}

#cerrar {font-size: 18px; top:6px; right:0; }
.separa {border-bottom: 1px solid rgba(0,153,168,0.5); padding-bottom: 25px;}


/*#contact-list ul:nth-child(2) { margin: 0 60px; }*/
#contact-list .icon {font-size: 44px; margin-top: 4px;}
#contact-list .icon.icon-facebook {font-size: 37px; margin-top: 7px;}
#contact-list .social {float: right; width: 80px;}
#carita img:hover {-webkit-transform:scale(1.05)}
.wysigyg ul li{ list-style-type:circle; margin-left:40px}
.wysigyg ol li{list-style-type:decimal; margin-left:40px}
.wysigyg del { text-decoration: line-through; }
.wysigyg a:hover {text-decoration:underline}
.wysigyg blockquote { border-left: 4px solid #F3F3F3; padding-left: 20px; margin-left: 20px; }

.open {background: rgba(0,153,168,0.8);}  
.open.active {opacity:1;}
form input {color: rgb(255, 255, 255); font-size: 32px; border-bottom: 3px solid #fff; text-align:center}
#submit {background: rgb(218, 218, 218); padding: 0px 10px; color: white; margin-left: 5px;}
#submit:hover {background-color:rgb(226,35,26)}
#submit.listo {background-color:rgb(226,35,26); padding: 0px 10px; color: white; margin-left: 5px;}

#s {border-bottom: 1px solid rgb(0,153,168)!important; padding: 0px 7px!important; margin-left: 8px; position: relative; top: 0px; text-align:left}
#searchform div { margin: 0px; }
#searchform > div > label { display: none; }
#searchform input {font-size: 16px; font-family: 'trade_gothic_lt_stdBdCnno.20'; color: rgb(0,153,168); border-bottom: 0px; text-transform: uppercase; padding: 0;}
#search-h {display: inline-block; float: right;}
#searchform { float: right; overflow:hidden; width: 0px;}
#search-h i {color: rgb(0,153,168); font-size: 16px; float: left; position: relative; top: 4px; cursor:pointer}
#searchsubmit {display:none}
.search-highlight {background:#FFFF00}
#search-page > div.width10.mc.relative.pt260 > div > h1 { display: none; }

#our-team { max-width: 400px; }
#our-team li{margin-left: 0px; list-style-type: none; width: 165px;float:left}
#our-team li:nth-child(even) {float:right}
#our-team li .image-perfil{width: 100%; height: 240px;}

#top {bottom: 45px; left: 45px; font-size: 23px; cursor: pointer;}
#top:hover {color:rgb(0,153,168)}

.box {position:relative}
.box h2.active {position: fixed; left: 300px; top: 70px;}

#menu-home > div > dl.absolute.r0.width4.zindex2 > dd > p > a { color: rgb(226,35,26);}

#video-viewport {
    position: absolute;
    top: 0;
    overflow: hidden;
    z-index: 0; /* for accessing the video by click */
}

#debug {
    position: absolute;
    top 0;
    z-index: 100;
    color: #fff;
    font-size: 12pt;
    display:none
}


@media screen and (max-width: 1780px){  


}


@media screen and (max-width: 1580px){  


}


@media screen and (max-width: 1480px){  


}




@media screen and (max-width: 1060px){  
#menu-home dl.width4 { width: 100%; float: none; margin-bottom: 0px; position: static; } 
#menu-home .medio { position: static; width: 100%; padding: 0px!important; margin: 35px 0; }  

}


@media screen and (max-width: 1060px){  
 

}


@media screen and (max-width: 900px){
.width9,.width10 {width: 87%;}
#header div { margin: 50px; margin-left: 6.0%; margin-right: 6.0%; }
#searchform > div { margin: 0px; }    
#video-wrapper { min-height: auto; }
}

@media screen and (max-width: 870px){
.box h2 {position:static; text-align: left;} 
.width6 {width:100%; float:left}
#contact-list ul:nth-child(2) { display: block; clear: both; margin-left: 0px; margin-right: 0; }  

#logo.active { position:absolute; margin-left:0px}        
}

@media screen and (max-width: 780px){

   
}


@media screen and (max-width: 620px){
#search-h i {top: 2px;}
#searchform {float: right;overflow: hidden;width: 0px;position: absolute;top: 35px;left: 81px;}
}

/*contact form mailchimp*/
h2.subscribe a{font-size:27px; color:white}
h2.subscribe #submit {background:transparent; margin-left:0px; text-decoration:underline; padding:0px}

#form {
	position: fixed;
	width:100%;
	height:100%;
}

#form a { color:inherit; }
.no-touch #form a:hover { border-bottom: 1px solid #fff; }

#form form {
	position: absolute;
	display: table;
	width:100%;
	height: 100%;
}

#form .field {
	display: none;
}

#form .field.active {
	display: table-cell;
	vertical-align:middle;
	z-index:10000;

}


#contact-mp-msg a {
	color:#FFF;
	border-bottom: 1px solid #FFF;
}
.icon-refresh {
	-webkit-animation: rotate 1.3s linear 0 infinite;
    -moz-animation: rotate 1.3s linear 0 infinite;
   	animation: rotate 1.3s linear 0 infinite;

}

@-webkit-keyframes rotate {
  0% { 
  	-webkit-transform: rotate(0);
  }
  
  100% { 
  	-webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes rotate {
  0% { 
  	-moz-transform: rotate(0);
  }
  
  100% { 
  	-moz-transform: rotate(360deg);
  }
}

@keyframes rotate {
  0% { 
  	transform: rotate(0);
  }
  
  100% { 
  	transform: rotate(360deg);
  }
}

#contact-list ul { 
	width:50%; 

}
#contact-list li,
#contact-list a { font-size: 20px; }