 /*
Theme Name: DOB
Theme URI: 
Description: DOB Website
Author: BLANK
Author URI: http://everythingisblank.co/
Version: 1.0
*/

/* FONT-FAMILY */
body{
	font-family: 'Avenir';
	font-weight:500;
	line-height:1.5;
	-webkit-font-smoothing: antialiased;
	color:#333;
}
b,strong{font-weight:900;}

h1, h2, h3, h4, h5, h6, .title, .bt-about{
	font-family: 'Blender Pro';
	font-weight:900;
	line-height:0.9;
	-webkit-font-smoothing: antialiased;
}

/* FONT-COLOR */
body{font-size:14px;}


/* FONT-STYLE */

/* BASIC-STYLE */
html{height: 100%;}
body{min-height: 100%;}
.fh{min-height:100vh;}
*{padding:0;margin:0;}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: "";
	clear: both;
	height: 0;
}
a, a:hover, a:focus{text-decoration:none; color:inherit;}

.aligncenter, .tc{text-align:center;}
.alignright, .tr{text-align:right;}
.alignleft, .tl{text-align:left;}
em{font-style:italic;}
strong{font-weight:bold;}
.fl{float:left;}
.fr{float:right;}
.center{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	-ms-transform:translate(-50%, -50%); /* IE 9 */
    -webkit-transform:translate(-50%, -50%); /* Chrome, Safari, Opera */
}

.absolute{position:absolute;}
.relative{position:relative;}
.fixed{position:fixed;}

img{max-width:100%;height:auto;}

.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

a, button, .trigger{cursor:pointer;}
input{outline:none;}
a.button, a.button:focus, a.button:hover{text-decoration:none;}

.flex-center{
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Aimation */
.transition{
	transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out; /* Firefox 4 */
	-webkit-transition: all 0.2s ease-in-out; /* Safari and Chrome */
	-o-transition: all 0.2s ease-in-out; /* Opera */
}


/* GENERAL Style */
.bg-pattern{position:relative;}
.bg-pattern:after, .bg-pattern:before{
	width:100%;
	height:100%;
	content:' ';
	display:block;
	position:absolute;
	top:0;
	left:0;
}
.bg-pattern:after{
	z-index:-2;
	opacity:0.1;
	background-image:url(images/grid.png);
	background-size:80px;
	background-position:center top;
}
.bg-pattern:before{
	z-index:-1;
	background: rgba(255,255,255,0);
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(246,246,246,0.47) 47%, rgba(255,255,255,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(47%, rgba(246,246,246,0.47)), color-stop(100%, rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(246,246,246,0.47) 47%, rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(246,246,246,0.47) 47%, rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(246,246,246,0.47) 47%, rgba(255,255,255,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(246,246,246,0.47) 47%, rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0 );
}
.single .bg-pattern:after, .single .bg-pattern:before{max-height:180vh;}


header{margin-top:140px;margin-bottom:100px;}
.logo img{height:90px;width:auto;}

.container {
    width: 960px;
	padding-right: 10px;
    padding-left: 10px;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

/* HOMEPAGE */
#home-headline h2{font-size:28px;margin:0px;}
.bt-about{margin-top:70px;margin-bottom:50px;}
.bt-about .relative{
	height:85px;
	line-height:85px;
}
.bt-border{
	width:50px;
	height:85px;
	border:2px solid #333;
}
.state2{
	opacity:1;
	font-size:13px;
	white-space: nowrap;	
}
.space{
	height:0px;
	width:200px;
	background-color:#fcfcfc;
	height:40px;
}
#card-container{
	width:2280px;
	margin:auto;
	padding:8px 0px;
}
.post-card {
	width:380px !important;
  	padding:6px !important;
  	float:left;	
}
.post-card img, #card-thumbnail img{
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	overflow:hidden;
}
#shuffle-the-grid{
    font-size:16px;
  	color:#333;
  	background-color:#fff;
    font-family: 'Blender Pro';
	font-weight:900;
    line-height:50px;
  	padding:0px 25px !important;
  	opacity:0;
  	white-space: nowrap;
  	transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out; /* Firefox 4 */
	-webkit-transition: all 0.4s ease-in-out; /* Safari and Chrome */
	-o-transition: all 0.4s ease-in-out; /* Opera */
}
.cards-in-view #shuffle-the-grid{opacity:1;}
#shuffle-the-grid:hover{
  	color:#fff;
  	background-color:#333;
}
.post-card a{display:block;}
.icon{display:inline-block;}
.icon img{
  	transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out; /* Firefox 4 */
	-webkit-transition: all 0.3s ease-in-out; /* Safari and Chrome */
	-o-transition: all 0.3s ease-in-out; /* Opera */
}
.icon:hover img{opacity:0.5;}
.social-share .context-menu{left:-12px !important;}
.social-share .context-menu li a {
    display: block;
    padding: 0px !important;
  	text-align:center;
  	width:50px !important;
    line-height: 50px !important;
  	height:50px !important;
  	font-size:16px;
}	
.social-share .context-menu li{margin-bottom: 0px !important;}

/* SINGLE */
.nav.absolute{
	width:100%;
	z-index:10;
	top:50px;
}
#card-thumbnail{margin:0px 0px 90px;}
#card-thumbnail img{width:420px;height:auto;margin:auto;}
#card-content{
	margin:0px auto 40px;
  padding:0px;
	background-color:#f2f2f2;
	font-weight:300;
}
.no-group.title{display:none;}
.row.no-group{margin-top:80px;}
.card-title {
    font-weight: 900;
    font-size: 15px;
    margin-bottom: 20px;
    text-transform: uppercase;
    padding: 50px 80px 0px;
}
#saying{margin-bottom:40px;}
.group-title br{display:none;}

#card-number{
	display:inline-block;
	padding-bottom:25px;
	border-bottom:2px solid #4c4c4c;
	line-height:45px;
	font-size:70px;
}
#card-title{
	font-size: 42px;
    margin-top: 25px;
}
#card-content .col-md-4{
	padding:60px 0px 60px 60px;
}
#card-content .col-md-8{
	padding:0px 60px 0px 25px;
	max-height:290px;
	margin-top:60px;
	margin-bottom:60px;
	overflow:auto;
}
#card-content #copy {
    padding: 0px 80px;
    margin-bottom: 50px;
    
}
#card-content #copy.scroll-active{
  	height: 260px;
    overflow-y: auto;
}
#card-content p {
    font-size: 17px;
    line-height: 1.75;
    letter-spacing: 0.016em;
    font-weight: 300;
}
#card-content p:last-child{margin-bottom:0px;}

.post-nav-title i{font-size:40px;}

#card-content #copy.scroll-active::-webkit-scrollbar {
    width: 6px;
}
 
#card-content #copy.scroll-active::-webkit-scrollbar-track {
	background-color:#fff;
}
 
#card-content #copy.scroll-active::-webkit-scrollbar-thumb {
  background-color: #333;
}

.example-container .group:nth-child(odd) .group-title{text-align:left;}
.example-container .group:nth-child(even) .group-title{text-align:right;}
.example-container .group:nth-child(odd) .group-title:after, .example-container .group:nth-child(even) .group-title:after {
    content: '';
    display: block;
    width: 60px;
    height: 2px;
    background-color: #d9d9d9;
    position: absolute;
    top: 50%;
    margin-top: -2px;
}
.example-container .group:nth-child(odd) .group-title:after{right:0px;}
.example-container .group:nth-child(even) .group-title:after{left:0px;}


.group-title {
    color: #a9aaae;
    font-size: 22px !important;
    display: inline-block;
    padding: 0px;
    margin-bottom: 40px;
}
.group-video{margin-bottom:40px;}
.overlay{
	width:100%;
	height:100%;
	z-index:1;
	background-color:#242424;
	opacity:0.5;
}
.video-icon{z-index:2;}
.video-icon img{height:40px !important; width:auto !important;}

.group-thumbnail a:hover .overlay, .group-thumbnail a:hover .video-icon{opacity:0;}
.video-title{
	color:#4c4c4c;
	text-decoration:none;
	margin-top:8px;
	font-size:10px;
}
.group-thumbnail a:hover .video-title{color:#666666;}

.example-container .no-group.title{font-size:44px;}
.example-container .no-group.title:after{
	content:'';
	display:block;
	width:60px;
	height:2px;
	background-color:#4c4c4c;
	margin:20px 0px 40px auto;
}
.example-container{margin-bottom:20px;}
.example-container .row.no-group .video-title{margin-bottom:30px;}
.example-container .row.group:last-child .group-video{margin-bottom:20px;}
.post-nav-title, .post-nav-left{font-size:32px !important;}
.post-nav-number {font-size: 70px !important;}

.next-post-container .post-nav-number {padding-left: 20px !important;}
.prev-post-container .post-nav-number {padding-right: 20px !important;}
.prev-post-container .post-nav-title {padding-left: 0px !important;}

.a-item-left{padding-right:6%;}
.a-item-right{padding-left:6%;}
#post-nav{color:#333;}
.owl-controls{
	position:absolute;
	top:50%;
	margin-top:-40px;
	width:100%;
}
.nav-control {
    width: 50px;
    height: 50px;
    position: absolute;
    line-height: 50px;
    font-size: 24px;
    text-align: center;
    background-color: #f2f2f2;
    color: #1a1a1a;
    margin-top: -5px;
}
.nav-control:hover{
	background-color:#1a1a1a;
	color:#f2f2f2;
}
.nav-prev{left:-30px;}
.nav-next{right:-30px;}

/* ABOUT */
.about-content{
	padding:60px;
	background-color:#f2f2f2;
	font-size:17px;
	line-height: 1.75;
    letter-spacing: 0.07em;
	font-weight: 300;
}
#saying p:last-child{margin-bottom:0px;}
#saying p{
  margin-bottom:15px;
  line-height:1.2;
}
  
#page-about .row{margin-bottom:60px;}
#page-about .row:last-child{margin-bottom:20px;}
p{margin-bottom:0px;}

/* FOOTER */
.icon img{height:25px;width:auto}
footer{margin:40px auto;line-height:20px;}
header.container-fluid{z-index:999;}
.page-template-page-about .credit{display:block !important;}
.copyright{
	font-size:12px;
	color:#808080;
}

html{
	background-color:#dedede;
}
body.home{
	width:2330px;
	max-width:100%;
	margin:auto;
}
body{
	width:1190px;
	max-width:100%;
	margin:auto;
}

/**/

/* Enter Your Custom CSS Here */
.about-content{padding:60px;}
.about-content h3{
  	font-family: 'Avenir';
    font-weight: 700;
    line-height: 1.5;
  	margin:0px;
  	font-size:17px;
  	margin-bottom:30px;
}

.popup-close {
    position: absolute;
    top: 40px;
    right: 40px;
}

.popup-container{
    width: 100% !important;
    height: 100% !important;
}

form {
    margin-top: 40px;
    width:auto !important;
    max-width:inherit !important;
}
span.wpcf7-not-valid-tip{margin-top:10px;}
.ajax-loader{display:none !important;}

.popup-content p{
  	color:#808080;
    font-size:12px;
}
form input[type="text"], form input[type="email"], form input[type="tel"], form select{
  	padding:0px 25px !important;
  	color:#808080;
  	-webkit-appearance: none;
  	border-radius: 0;
  	-webkit-border-radius: 0;
}
form button, form input[type="submit"]{
  	font-size:16px !important;
  	color:#333;
  	background-color:#fff;
    font-family: 'Blender Pro';
	font-weight:900;
    line-height:46px !important;
  	padding:0px 25px !important;
  	-webkit-appearance: none;
  	border-radius: 0;
  	-webkit-border-radius: 0;
}
form textarea{
	padding:15px 25px !important;
	color:#808080;
  	-webkit-appearance: none;
  	border-radius: 0;
  	-webkit-border-radius: 0;
}
.popup-close, .fancybox-close{
  	top: 54px !important;
    right: 70px !important;
    width: 20px !important;
    height: 20px !important;
	background-size:contain !important;
}
.form-select:after{
  	background:none;
  	font-family:'FontAwesome';
  	content:'\f107';
  	font-size:14px;
  	line-height: 8px;
}
.popup-overlay.active{overflow:auto;}
.popup-container{
	width: 100%;
    height: 100%;
    padding: 40px 0px;
}
.fancybox-inner{z-index:9999;}

.fancybox-nav span{
  	background-image:none !important;
  	width:auto !important;
  	height:auto !important;
}
.fancybox-nav span:after{
  	font-family:'FontAwesome';
  	font-size:24px;
  	content:'\f107';
  	color:#808080;
  	display:block;
  	width:50px;
  	height:50px;
  	line-height:50px;
  	text-align:center;
}
.fancybox-prev span:after{
  	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}
.fancybox-next span:after{
  	-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
    transform: rotate(-90deg);
}
.fancybox-nav:hover span:after{
  	color:#fff;
}
.fancybox-lock .fancybox-overlay{overflow-y:auto;}
.fancybox-opened .fancybox-skin{
  	-webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;

}

.fancybox-nav span {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0px !important;
    top: 0px !important;
    left: 0px !important;
    right: 0px !important;
}
.fancybox-nav {
    top: 50% !important;
	z-index:9999 !important;  	
    width: 50px !important;
    margin-top: -25px !important;
    height: 50px !important;
    line-height: 50px !important;
}

.fancybox-prev{left:60px !important;}
.fancybox-next{right:60px !important;}
.group-thumbnail .relative{padding-bottom:100%;height:0px;}
.group-thumbnail img.youtube-thumbail {
    position: absolute;
    object-fit: cover;
    height: 100%;
    width: auto !important;
}
.video-title{
	
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}


.fancybox-close{z-index:9999 !important;}
p:last-child{margin-bottom:0px;}
#post-nav{margin:40px auto 30px;}

.fancybox-inner{
    max-height: 65vh;
    margin-top: 10vh;
}

.subscribe-form-container{min-width:360px;max-width:100%;}
#subscribe-form-response{margin-top:40px;}
.state2 a:hover, .logo a:hover{opacity:0.5;}
.postid-224 #card-title, .postid-238 #card-title, .postid-274 #card-title{font-size:32px;}




@media only screen and (max-width : 3000px) {
	body.home{
		width:1950px;
	}
	#card-container{
		width:1900px;
	}
}


@media only screen and (max-width : 2100px) {
	body.home{
		width:1570px;
	}
	#card-container{
		width:1520px;
	}
}

@media only screen and (max-width : 1700px) {
	body.home{
		width:1190px;
	}
	#card-container{
		width:1140px;
		margin:auto;
		padding:8px 0px;
	}
}


/* Medium Devices, Desktops */
@media only screen and (max-width : 1200px) {
	#card-container {width: 760px;}
	.container {max-width:85%;}
	.fancybox-prev{left:40px !important;}
	.fancybox-next{right:40px !important;}
	.popup-close, .fancybox-close{right: 50px !important;}
}

@media only screen and (max-width : 992px) {
	#card-container {width: 80%;}
	.post-card {	width:50% !important;}
	#card-content .col-md-8 {
		padding: 0px 60px 0px 60px;
		max-height: 280px;
		margin-top: 0px;
		margin-bottom: 60px;
	}
	.group-title {  
        font-size: 28px;
        margin-bottom: 40px;
        padding: 0px 15px;
        width: 100%;
        text-align: center !important;
    }
    .example-container .group:first-child .group-title{margin-top:0px;}
    .example-container .group:first-child .group-title:before {    
        width: 60px;
        bottom:inherit;
        right: 50%;
        margin-right: -30px;
        top: -50px;
    }
    .example-container .group:first-child .group-title:after {
        font-size: 40px;
        text-align: center;
        width: 100%;
        top: -100px;
        left:0px;
        display:none !important;
    }
    .example-container .no-group.title {font-size: 40px;}
    .example-container .no-group.title:after {width: 40px;margin:20px auto 40px;}
  .video-title{margin-bottom:20px;}
    
    .group-video{margin-bottom:20px;}
    .example-container .group:nth-child(odd) .group-title:after, .example-container .group:nth-child(even) .group-title:after{display:none;}
    .example-container .group:nth-child(even) .group-title:after {left: 15px;}

	

  .a-item{    
    width: 50%;
    display: inline-block;
    margin-right: -2px;
  }
  #post-nav {
    margin: -10px auto 0px;
	}
}



@media only screen and (max-width : 480px) {
  
	.post-card {width:100% !important;}
	
	.container {max-width:100%;padding:0px 40px;}
  	.about-content {
        padding: 40px;
    }
	#card-content .col-md-4{padding:40px;}
	#card-content .col-md-8{padding:0px 40px;}
	.copyright{line-height:1.785;font-size:10px;}
	
	#card-number {
		padding-bottom: 20px;
		line-height: 40px;
		font-size: 60px;
	}
	
	#card-title {
		font-size: 36px;
		margin-top: 20px;
	}
	#card-content p, .about-content {
		font-size: 14px;
	}
	.about-content h3 {
		font-size: 18px;
		margin-bottom: 20px;
	}
	#page-about .row {
		margin-bottom: 40px;
	}
	.post-nav-title, .post-nav-left {
		font-size: 24px !important;
	}
	.post-nav-number {
		font-size: 60px !important;
	}
	.next-post-container, .prev-post-container{padding: 10px 0px;}
	.example-container{padding:0px 20px;}
	.video-title{margin-bottom:20px;}
	.example-container .no-group.title{text-align:center;}
  
  .card-title {
    padding:40px 40px 0px;
	}
  
  #card-content #copy {
    padding: 0px 40px;
    margin-bottom: 40px;
    height: 260px;
    overflow-y: auto;
	}
  
  #popup-contact br{display:none;}
  .popup-container {
    width: 100%;
    height: 100%;
    padding: 40px 40px;
}
  
}



.wpcf7{max-width:400px;}
div.wpcf7-response-output {
    margin: 40px 50px 0px;
    padding: 0px;
    border: none !important;
}
