* { outline: none }

BODY {background: #FFF; margin:0px; padding:0px; width: 100%; height: 100%; font-family: calibri, Arial, Helvetica, sans-serif; font-size: 1em; color: #737373 }

html { height: 100%; }

a:link, a:visited { text-decoration: none; color: inherit; }
a:hover { color: #333; }

.Site { position: relative; padding: 3.5em 2%; width: 96%; max-width: 1000px; height: 100%; margin: 0 auto .5em; }

.Site .Header { position: fixed; top: 0; height: 3.5em;  width: 96%; max-width: 1000px; z-index: 100; background: white }
.Site .Header > * { position: absolute;  }
.Site .Header .Logo { left:0; bottom: 0.5em; color: #737373; font-size: 1.1em; letter-spacing: .15em }
.Site .Header .MenuCont { right:0; bottom: 0.4em; color: #909090; font-size: .9em; line-height: 1.7em;  text-transform: uppercase ; }
.Site .Header .MenuCont > .Button { display: none }

.Site .Header .Menu A { padding: 0 0 0 1.45em; cursor: pointer; }
.Site .Header .Menu A.Selected { color: rgb(167,100,65) }
.Site .Header .Menu A.Contact { padding-right: 0 }
.Site .Header .Menu .Galeries { text-transform: uppercase ; } 
.Site .Header .Menu .Pages #bio { padding: 0 }
.Site .Header .Menu .Sep { padding: 0 0.8em }

.Main .Slider { position: relative }
.Main .Slider .Image .Caption { text-align: center; font-size: .9em; color: #7C7C7C }
.Main .Slider .Image .Caption .Title { text-transform: uppercase; }

#home .Main .Slider .Image { position: absolute; top: 0; left: 0; background: white; display: none }
#home .Main .Slider .Image.Current { display: block; position: relative; }
#home .Main .Slider .Frame { width: 100% }
#home .Main .Slider .Frame IMG { width: 100% }

.Main { overflow-y: hidden }

#gallery .Main { position: relative;  padding-top: 1em; font-size: .8em }
#gallery .Main .Title {width: 100%; text-transform: uppercase; }

#gallery .Main .Introduction { position: relative; overflow: hidden }
#gallery .Main .Introduction .Block.Text {  }


#bio .Main .Column { position: relative; float: left; padding-top: 2em; width: 44%; height: 100%; text-align: justify; font-size: .8em }

#bio .Main .Column.Left { padding-top: 4.3em }
#bio .Main .Column .Title { font-weight: bold; color: #555; font-size: 1.1em }

#bio .Main .Column.Right { float: right;  text-align: right;  }
#bio .Main .Column.Right .Title { margin-top: 1em }

#bio .Main .Block.Book { float: left; margin-top: 2em ; width: 100%; height: 100%; background: white }
#bio .Main .Block.Book .Card { width : 100%; height: 100%; text-align: left; }
#bio .Main .Block.Book .Card IMG { margin: 0; width: 60% }

#home .Main,
#slider .Main { height: 100%; overflow: hidden }

#gallery .Main .Introduction { padding-bottom: 2em; }
#gallery .Main .Introduction .Block.Text { height: 100% }
#gallery .Main .Introduction .Block.Sep { display: none }
#gallery .Main .Column { position: relative; float: left; width: 47%; height: 100%; text-align: justify }
#gallery .Main .Introduction .Column P:last-child { margin-bottom: 0 }
#gallery .Main .Column.Left { margin-right: 6%; }
#gallery .Main .Introduction .Action { float: left; width: 100%; height: 1.5em }
#gallery .Main .Introduction .Button { float: right; padding: .15em 1em; background: #BBB; color: white; font-size: .8em; cursor: pointer; }

#gallery .Main .Gallery { position: relative; clear: left; width: 100%; text-align: justify  }

#gallery .Main .Gallery.In { padding-top: 0 }

#gallery .Main .Gallery .Thumb { position: relative; float:left; margin: 0 1% 1.8%; width: 23.5%; text-align: center }
#gallery .Main .Gallery .Thumb:before { content: ""; display: block; padding-top: 90%; max-height: 100% }

#gallery .Main .Gallery .Thumb.Left { margin-left: 0px;  }
#gallery .Main .Gallery .Thumb.Right { margin-right: 0px;  }

#gallery .Main .Gallery .Thumb .Frame { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%;  }
#gallery .Main .Gallery .Thumb .Frame IMG { position: absolute; top: 0; left: 0; bottom: 0; right: 0; max-width: 100%; max-height: 94%; margin: auto;  }

#gallery .Main .Gallery .Thumb.Vert:before { content: ""; display: block; padding-top: 125%; max-height: 100% }
#gallery .Main .Gallery .Thumb.Vert .Frame IMG { position: absolute; top: 0; left: 0; bottom: 0; right: 0; max-width: 100%; max-height: 95%; margin: auto;  }

#gallery .Main .TextBlock {position: relative; clear: left; padding-top: 2em }

.Main .Slider { width: 100%; height: 100%; }
/*#slider .Main .Slider { position: absolute; top: 0;  background: white }*/

#slider .Main .Slider > TABLE { width: 100%; height: 100%; z-index: 1 }
#slider .Main .Slider TABLE { border-spacing: 0; border-collapse: collapse; }
#slider .Main .Slider TD { position: relative; width: 100%; height: 100% }
#slider .Main .Slider .Frame { width: 100%; height: 100% }

.Main .Slider .Image { position: relative; height: 90%; }
.Main .Slider .Wrapper { position: relative; float: left;  width: 100%; height: 95%; max-height: 800px; text-align: center}
.Main .Slider .Wrapper:before { content: ""; display: block; padding-top: 100%; max-height: 100% }
.Main .Slider .Image .Wrapper > IMG { position: absolute; top: 0; left: 0; bottom: 0; right: 0; max-width: 100%; max-height: 100%; margin: auto; }
.Main .Slider .Caption { text-align: center; position: relative }

.Main .Slider .Image { text-align: center }
#slider .Main .Slider .Image .Command { position: absolute; width: 50%; height: 100% }
#slider .Main .Slider .Image .Command.Left { left: 0; top: 0; text-align: left; }
#slider .Main .Slider .Image .Command.Right { right: 0; top: 0; text-align: right;  }
#slider .Main .Slider .Image .Command .Button { position: relative; display: none; top: 50%; z-index: 10 ; font-size: 60px; color: white; text-shadow: 0px 0px 2px #333; text-align: left; cursor: pointer; background-repeat: no-repeat; }
#slider .Main .Slider .Image .Command.Left .Button {  margin-left: 1em; }
#slider .Main .Slider .Image .Command.Right .Button { margin-right: 1em; }
#slider .Main .Slider .Image .Command.Right .Button.Close { position: absolute; right: 1em; top: 0; line-height: 30px; margin-top: 0; padding: 5px; font-size: 25px;  }
#slider .Main .Slider .Actions { position: absolute; width: 100%; height: 1.5em; z-index: 2 }
#slider .Main .Slider .Actions > DIV { float: right }
#slider .Main .Slider .Actions .Button { float: left; padding: .15em 1em; background: #DDD; color: white; margin-left: 1px; font-weight: bold; cursor: pointer; }


.Slider .CaptionCont { float: left; width: 100% }
.Slider .CaptionCont .Caption { display: inline-block; padding-top: .5em }
#slider .Main .Slider .CaptionCont .Caption > * {float: left}
#slider .Main .Slider .CaptionCont .Button { position: relative; top: 12px; width: 12px }
#slider .Main .Slider .CaptionCont .Button.Prev { margin-right: 50px }
#slider .Main .Slider .CaptionCont .Button.Next { margin-left: 50px  }

/*#slider .Main .Slider .CaptionCont { position: relative; margin: 0 50%; width: 100% }
#slider .Main .Slider .CaptionCont > * { float: left ; }
#slider .Main .Slider .CaptionCont .Button { margin-top: 5px; width: 15px }
#slider .Main .Slider .CaptionCont .Caption { min-width: 30% }
*/
#bio .Agent,
#bio .Gallery { margin-bottom: 1em  }

@media screen and (max-width: 666px)
{
 .Site .Header .Logo { bottom: auto; top: .5em ; }
}

@media screen and (max-width: 501px)
{
 #gallery .Main .Introduction .Column { width: 100% }
 #gallery .Main .Introduction .Column.Left { margin: 0 }

 .Site .Header .MenuCont > .Button { display: block }
 
 .Site .Header .MenuCont .Menu { display: none; position: absolute; right: 0; top: 1.5em; padding: 10%; background: white }
 .Site .Header .MenuCont .Menu.On { display: block; background: #FAFAFA } 
 .Site .Header .MenuCont .Menu .Button { display: block; float: none; clear: left; margin: 0.20em; text-align: right; white-space: nowrap; font-size: 1.2em }
 .Site .Header .MenuCont .Menu .Sep { display: none }
}

@media screen and (max-width: 666px)
{
 .Site .Header .Logo { bottom: auto; top: .5em ; }
}

@media screen and (max-height: 755px)
{
 #slider .Main .Slider .Wrapper { height: 90% }
}

@media screen and (max-height: 550px)
{
 #slider .Main .Slider .Wrapper { height: 85% }
}