/*********************  variable  ***************************/
:root {
  --body-text: #FFFFFF;
  --body-bg: #39362C;
  --nav-bg: #F8F0D2;
  --nav-text: #6a644e;
  --nav-border: #6A644E;
  --hover:#c93;
}

/*************************************** general ******************************************/
body{background-color: var(--body-bg);}
#content{padding: 0px;}
body{color: var(--body-text);}
a{color: var(--body-text);}
a:hover, a:active, a:focus{color: var(--hover);}
.button-default{background-color: var(--nav-bg);color: var(--nav-text);border: 1px solid var(--nav-border);padding: 5px 10px;display: inline-block;}
ul{margin: 0;padding: 0;}
li{list-style: none;padding:0;margin: 0;}

/*************************************** navbar ******************************************/
.navbar{margin: 0 !important;}
.navbar-default{background-color: var(--nav-bg);border-color: var(--nav-border)}
.navbar-default .navbar-brand{padding: 0 10px;line-height: 50px;color:var(--hover);}
.navbar-default .navbar-nav>li>a{color:var(--nav-text); font-weight: bold;}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:active,.navbar-default .navbar-nav>li>a:focus{color:var(--hover) !important;}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:active, .navbar-default .navbar-brand:focus{color:var(--hover) !important;}
.navbar-default .navbar-nav .open .dropdown-menu>li>a{color:var(--nav-text);}
.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover, .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:active{color:var(--hover);}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{background-color: inherit;}
#categories{min-width: 800px;}
.dropdown-menu{background-color: var(--nav-bg);border-color: var(--nav-border)}
.dropdown-menu>li>a{padding: 0 !important;color: var(--nav-text);}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{background-color: inherit;text-decoration: underline;color: var(--hover);}}
.navbar-default .navbar-toggle{border-color: var(--nav-border);}
.navbar-default .navbar-toggle .icon-bar{background-color: var(--nav-text);}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{background-color: var(--nav-bg);}
.navbar-default .navbar-collapse, .navbar-default .navbar-form{border-color: var(--nav-border);}
.navbar-right{margin-right: 0px;}

.michael{border-top: 1px solid var(--nav-border)}
.michael ul{margin: 0;padding: 0;}
.michael li{list-style: none;padding:0;}
.michael a{display: block;text-align: center;padding: 5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.michael a:hover{text-decoration: none;}
.michael li:nth-child(2) {border-left: 1px solid var(--nav-border);border-right: 1px solid var(--nav-border);}

.ethan{border-bottom: 1px solid var(--nav-border);white-space: nowrap;overflow: hidden;}
.ethan ul{margin: 0;padding: 0 5px;text-align: right;background-color: var(--body-bg);}
.ethan li{list-style: none;padding:0 5px;display: inline-block;line-height:22px;font-size: 12px;}
.ethan li a{color: var(--body-text);line-height: 32px}
.ethan li a:hover, .ethan li a:active, .ethan li a:focus{color: var(--hover);}

.bertrand a{display: block;text-align: center;padding: 10px 0;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight:bold;color:var(--nav-text);}
.bertrand a:hover{text-decoration: none;color:var(--hover);}
.bertrand .col-xs-4{padding: 0;} 

.navbar-form .input-group{border: 1px solid var(--nav-border);}
.navbar-form .input-group input{border: none;border-radius: 0px;background-color: var(--nav-bg);color: var(--nav-text);}
.navbar-form .input-group button, .navbar-form .input-group button:active{border: none;border-radius: 0px;background-color: var(--nav-bg);}
.navbar-form .input-group button .glyphicon{color: var(--nav-text);font-style: italic;}

/*************************************** text ******************************************/
#william{margin: 0;line-height: 20px;overflow: hidden;position: relative;color: var(--body-text);padding:10px;}
#william h1{font-weight: bold;font-size: 14px;margin: 0px;display: inline;color: var(--body-text)}
#william p{display: inline;font-size: 13px;color: var(--body-text)}
#william .more{position: absolute;right: 0;bottom: -1px;background-color: var(--body-bg);cursor: pointer;font-size: 13px;padding:0 5px;display: none;line-height: inherit;height: 18px;color: var(--body-text)}

/*************************************** flex ******************************************/
.john { overflow: hidden; border-top: 1px solid var(--nav-border);padding-top:10px;padding-bottom:10px;}
.john .jacob { float: left; margin: 1px; box-sizing: content-box; overflow: hidden; position: relative;  }
.john .jacob img { width: auto; height: 100%; }
.john .title { position: absolute; top: 0; left: 0; padding: 4px 6px; font-size: 13px; color: #FFF; background: #222; background: rgba(0,0,0,.4); margin: 0;display: inline;}
.john .jacob:hover .title{color: var(--hover);}
.john .jacob img{max-height: 185px !important;}
.john .jacob div{height: 100%;width: 100%;}
.john iframe {transform: scale(0.74);transform-origin: top left;}


/*************************************** gallery ******************************************/
#gallery{position: relative;}
#left{margin-right:320px;border-right: 1px solid var(--nav-border);}
#right{position:absolute;right:0;top:0;width:320px;float:right;text-align:center;padding-top:10px;}
#player{position:relative;min-height:570px;margin:0 auto;text-align:center;cursor: pointer;padding:10px 0;}
#player img{max-width:100%;}
.prev-post{position:absolute;font-size:60px;width:90px;display:block;float:left;height:90px;top:40%;left:0;line-height: 90px;text-align: center;}
.next-post{position:absolute;font-size:60px;width:90px;display:block;height:90px;float:right;top:40%;right:10px;line-height: 90px;text-align: center;}
.next-post.glyphicon,.prev-post.glyphicon{color: var(--body-text);opacity:0.3;}
.next-post:hover.glyphicon ,.prev-post:hover.glyphicon{color: var(--hover);opacity:1;text-decoration: none;}
.related-picture{font-weight: bold;font-size: 14px;padding: 5px 0;border-top: 1px solid var(--nav-border);margin-bottom: 0;padding-left: 10px;}

/*************************************** thumb nav ******************************************/
.thumb-nav{width:300px;margin:auto;max-height: 225px;margin-bottom: 10px;}
.thumb-nav-img{width:73px;height:73px;overflow:hidden;position:relative;float:left;margin: 0 2px 2px 0;}
.thumb-nav-img img{left:0px;position:absolute;width:73px;min-width:73px;min-height:73px;max-width:73px;}
.thumb-nav-img .img-sel img{opacity:0.4;}
.thumb-pagination{border-top: 1px solid var(--nav-border);padding-top:10px;line-height: 20px;margin-bottom: 10px;}
.gallery-page{cursor: pointer;}
.gallery-page:hover{text-decoration: underline;color: var(--hover);}
#rd1{border-top: 1px solid var(--nav-border);padding-top:10px;}
#rd2{display: none;}
#tm1{width: 300px;margin: 10px auto 0 auto;height: 100px;overflow: hidden;}

/*************************************** simple-pagination-button ******************************************/
.simple-pagination{color:var(--body-text);border-top: 1px solid var(--nav-border);}
.simple-pagination-button{display: inline-block;margin: 10px;}

#footer{text-align: left;line-height: 32px;border-top: 1px solid var(--nav-border);}

.analisa{height: 260px;overflow: hidden;text-align: center;border-top: 1px solid var(--nav-border);padding-top:10px;margin-bottom:10px;}
.analisa > div{display: inline-block;}
.alvera{height: 100px;overflow: hidden;text-align: center;margin-top: 10px;margin-bottom: 10px;}
.alvera > div{display: inline-block;}
#right .alvera{height: 110px;padding-top: 10px;border-top: 1px solid var(--nav-border);padding-top:10px;display: none;}

/*************************************** footer ************************************************************/
#footer ul li{
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*************************************** channels ************************************************************/
#channels{border-top:1px solid var(--nav-border);line-height: 32px;}

/*************************************************************/
/********************* media query ***************************/
/*************************************************************/

@media(max-width:991px){
	#right .alvera{display: block;}
	
	#categories{min-width: 600px;}
	
	#william{height: 50px;border-top: 1px solid var(--nav-border);padding-bottom: 0;}
    #william .more{display: block;}
    
	#right{position:relative;width:100%;text-align:center;float: none;	}
	#left{margin-right:0px;border-bottom: 1px solid var(--nav-border);border-right: none;}
	#player{min-height:0px;border-top: 1px solid var(--nav-border);}
	
	#right{padding-left: 0px;}
	
	.john{margin-top: 10px;}
	#related{margin-top: 0;}
}

@media(max-width:767px){
	.prev-post{width: 50px;}
	.next-post{width: 50px;}
	.navbar-form .input-group{margin-right: 0px;}
	.navbar-nav{margin: 0;}
	.navbar-default .navbar-collapse{padding: 0;box-shadow: none;}
	.navbar-default .navbar-form{border: 0;margin: 0;box-shadow: none;}
	.navbar-default .navbar-toggle{margin-right:10px;padding: 9px 5px;}
	#search-toggle{padding: 8px 8px 4px 8px;}
	#search-toggle i{color: var(--nav-text);font-size: 16px;}
	.nav>li>a{padding-left: 0;padding-right: 0;}
}