div[class="row"] { border: 0px dotted rgba(0, 0, 0, 0.5); }
/*
div[class^="col-"] { background-clip: content-box; background-color: rgba(255, 0, 0, 0.2); }	
*/



/******************** Typography ********************/
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');
@import url('https://fonts.googleapis.com/css?family=Lora:400,700');

body { 			font:	normal 	300		15px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
blockquote { 	font:	normal 	300		15px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#4b4b4b; }

h1 { 			font:	normal 	300		48px/48px 'Lora',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
h2 { 			font:	normal 	normal	30px/30px 'Lora',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
h3 { 			font:	normal 	normal	22px/22px 'Lora',Helvetica,Arial,sans-serif;	color:#138e8e; }
h4 { 			font:	normal 	normal	18px/24px 'Lora',Helvetica,Arial,sans-serif;	color:#138e8e; }
h5 { 			font:	normal 	normal	13px/20px 'Lora',Helvetica,Arial,sans-serif;	color:#138e8e; }

a { color:#138E8E; }
a:focus, a:hover { color:#138E8E; text-decoration:underline; }

#header { 		font:	normal 	normal	12px/22px 'Roboto',Helvetica,Arial,sans-serif;	color:#aef1f1; }
#main_nav a { 	font:	normal	normal	15px/26px 'Lora',Helvetica,Arial,sans-serif; 	color:#ffffff; }
#footer { 		font:	normal 	300		14px/26px 'Roboto',Helvetica,Arial,sans-serif;	color:#ffffff; }
.filter_menu.design a {	   font:	normal 	400		14px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#138e8e; }
.filter_menu.marketing a { font:	normal 	400		14px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#138e8e; }

.testimonial  {	font:	italic 	normal	18px/30px 'Lora',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
.testimonial .credit {font:	normal 	normal	14px/22px 'Roboto',Helvetica,Arial,sans-serif;	color:#4b4b4b; }

.btn_call_to_action, .btn_call_to_action:hover 	   { font:	normal 	normal	15px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#ffffff; text-decoration:none; text-transform:uppercase; } /*learn more*/
.btn_call_to_action_2, .btn_call_to_action_2:hover { font:	normal 	normal	13px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#ffffff; text-decoration:none; text-transform:uppercase; } /*home page slideshow*/
.btn_call_to_action_3, .btn_call_to_action_3:hover { font:	normal 	normal	13px/24px 'Roboto',Helvetica,Arial,sans-serif;	color:#ffffff; text-decoration:none; text-transform:uppercase; } /*testimonial*/

.about_list_header { font:	normal 	700		18px/20px 'Roboto',Helvetica,Arial,sans-serif;	color:#000000; text-transform:uppercase; }

.work_item_client { font:	normal 	normal	14px/20px 'Lora',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
.work_item_filter { font:	normal 	500		12px/20px 'Roboto',Helvetica,Arial,sans-serif;	color:#acacac; text-transform:uppercase; }

.work_detail_breadcrumbs {		font:	normal 	700		12px/22px 'Roboto',Helvetica,Arial,sans-serif;	color:#4b4b4b; text-transform:uppercase; }
.work_detail_controls {   		font:	normal 	700		12px/22px 'Roboto',Helvetica,Arial,sans-serif;	color:#138e8e; }
.work_detail_filter_name {		font:	normal 	500		12px/20px 'Roboto',Helvetica,Arial,sans-serif;	color:#acacac; text-transform:uppercase; }
.work_detail_client_name, .work_detail_item_name { font:	normal 	700		18px/24px 'Lora',Helvetica,Arial,sans-serif;	color:#4b4b4b; }
.work_detail_anchor { 	  		font:	normal 	700		12px/20px 'Roboto',Helvetica,Arial,sans-serif;	color:#138e8e; text-transform:uppercase; }
.work_detail_item_description { font:	normal 	normal	16px/22px 'Roboto',Helvetica,Arial,sans-serif;	color:#4b4b4b; }

.wayback_item { font-weight:700; color:#b0b0b0; margin:10px 0 30px 0; }

.highlighted_text { color:#138e8e; }
.muted_text { color:#9a9a9a; }


/********************* Bootstrap.css Overrides ********************/
.navbar-collapse { border-top:0px solid transparent; padding-left:0; padding-right:0; }
.navbar-nav { float:right; margin-right:-15px; }
.nav > li { margin-left:0px; }
.navbar-nav > li > a { padding-bottom:6px; padding-top:6px; }
.nav > li > a:focus, .nav > li > a:hover { background-color:#036a6a; }
.nav .open > a, .nav .open > a:focus, .nav .open > a:hover { background-color:#0e6a6a; }
.navbar-nav > li > .dropdown-menu { 
	background: #138e8e; /* Old browsers */
	background: -moz-linear-gradient(top,  #222222 0%, #138e8e 5%) no-repeat scroll 0 0 transparent; /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #222222 0%,#138e8e 5%) no-repeat scroll 0 0 transparent; /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #222222 0%,#138e8e 5%) no-repeat scroll 0 0 transparent; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#138e8e',GradientType=0 ); /* IE6-9 */	
}
.dropdown-menu { background-color: #138e8e; }
.dropdown-menu > li > a { color: #ffffff; }
.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { background-color:#0e6a6a; color:#ffffff; }
.navbar-toggle { border:2px solid #ffffff; margin-bottom:0; margin-right:0; padding:7px 8px; }
.navbar-toggle .icon-bar { background-color:#ffffff; height:4px; }
.navbar-collapse.in { overflow-y: visible; }
   
.carousel-inner > .item > img, .carousel-inner > .item > a > img { margin:0 auto; }
.carousel-control.left, .carousel-control.right { background-image:none; }
.glyphicon { font-weight:normal; }  
.carousel-control { color:#bbbbbb; font-size:48px; text-shadow:none; }
.carousel-control .glyphicon-menu-left, .carousel-control .icon-prev { left:75%; margin-left:-10px; }
.carousel-control .glyphicon-menu-right, .carousel-control .icon-next { margin-right:-10px; right:75%; }
.carousel-control .glyphicon-menu-left, .carousel-control .glyphicon-menu-right, .carousel-control .icon-next, .carousel-control .icon-prev { display:inline-block; margin-top:-10px; position:absolute; top:45%; z-index:5; font-size:50px; height:30px; margin-top:-10px; width:30px; }

.work_detail > .carousel-inner { overflow:visible; }
.work_detail > .carousel-inner > .item {  }
.work_detail > .carousel-inner .btn_expand { position:absolute; top:-20px; right:0; }

label { font-size:17px; }	
.form-control { background-color:#f0f0f0; border:medium none; border-radius:0 0 0 0; box-shadow:none; height:50px; font-size:20px; }
select.form-control { padding-top:14px; padding-bottom:14px; }


/******************** Custom Styles *********************/
h1,h2,h3,h4 { margin-top:0; }
h1 { text-align:center; margin-bottom:40px; }
h5 { margin-top:-10px; }
hr { border-color:#cccccc; }
blockquote { border-left:0px none; margin:0 0 20px; padding:0 6.5%; }
iframe { border:none; }
#header { padding-top:20px; margin-bottom:40px; text-align:right; background: transparent url('../assets/header_background.png') no-repeat left top; background-size:100% 100%; }
#header .header_phone { margin-left:20%; }
#footer { padding-top:20px; padding-bottom:20px; text-align:center; background: transparent url('../assets/footer_background.png') no-repeat left top; background-size:100% 100%; }
#footer hr { border-color:#9be8e8; }

.filter_menu { text-align:center; }
.filter_menu a:hover { background-color:#138e8e; color:#ffffff; text-decoration:none; }
.filter_menu a.active { background-color:#ffffff; }
.filter_menu a.active:hover { color:#138e8e; }

/*.first { padding-left:0 !important; }
.last { padding-right:0 !important; }*/
.padding_left_shift { padding-left:7%; }
.margin_left_shift { margin-left:3%; }

/*----- content blocks ----*/
.content_block { padding-top:40px; padding-bottom:25px; margin-bottom:30px; background-color:#f1f1f1; position:relative; background: rgba(241,241,241,1); background: -moz-linear-gradient(top, rgba(241,241,241,1.0) 97%, rgba(218,218,218,1.0) 100%); }
.content_block_footer { background-color:#f1f1f1; margin-bottom:-7px; }

.arc_shadow:before { background-color: #dadada; content: "";  position:absolute; z-index: -1; width:99%; bottom: 0; height: 10px; left: 0.5%; border-radius: 500px / 5px; box-shadow:0 0 8px rgba(0,0,0,1.0); }
.drop_shadow:before { background-color: #dadada; content: "";  position:absolute; z-index: -1; width:99%; bottom: 0; height: 10px; left: 0.5%; border-radius: 0px / 0px; box-shadow:0 0 5px rgba(0,0,0,1.0); }

.filter_bar { padding-top:10px; padding-bottom:8px; margin-bottom:20px; background-color:#f1f1f1; position:relative; background: rgba(241,241,241,1); background: -moz-linear-gradient(top, rgba(241,241,241,1.0) 40%, rgba(218,218,218,1.0) 100%); }
.filter_bar:before{ background-color: #dadada; content: "";  position:absolute; z-index: -1; width:99%; bottom: 0; height: 10px; left: 0.5%; border-radius: 500px / 5px; box-shadow:0 0 8px rgba(85,85,85,1.0); }
.filter_bar.marketing { padding-top:5px; padding-bottom:4px; margin-bottom:30px; }
/*.filter_bar:after { background-color: #dadada; content: "";  position:absolute; z-index: -1; width:99%; top:0; height: 10px; left: 0.5%; border-radius: 500px / 5px; box-shadow:0 0 8px rgba(119,119,119,1.0); } 
*/
.filter_bar a { padding:8px 20px 6px; }

.button_wrapper { text-align:center; }
.btn_call_to_action   { background-color:#03b0b0; padding:12px 15px 11px; }  /*learn more*/
.btn_call_to_action_2 { background-color:#eb6363; padding:15px 30px 13px; } /*home page slideshow*/
.btn_call_to_action_3 { background-color:#03b0b0; padding:10px 25px 8px; }  /*testimonial*/

.btn_call_to_action:hover   { background-color:#128b8b; } /*learn more*/
.btn_call_to_action_2:hover { background-color:#fb7373; } /*home page slideshow*/
.btn_call_to_action_3:hover { background-color:#128b8b; } /*testimonial*/

.callout p { margin-bottom:15px; }
.callout_buttons { margin-bottom:60px; }

.biography { padding-top:50px; padding-bottom:50px; }
.wayback_item { }
.wayback_item img { box-shadow:0 3px 5px rgba(0,0,0,0.5); }
.wayback_item p { padding: 20px 0 40px 0; }

.work_cell { }
.work_item { background-color:#f1f1f1; padding:15px; -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; }
.work_item:hover {
    box-shadow: 0 0 6px rgba(0, 0, 0, .4);
	-webkit-box-shadow:0 0 6px rgba(0, 0, 0, .4);
	-moz-box-shadow:0 0 6px rgba(0, 0, 0, .4);
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#B9B9BA')";
	
	-webkit-transition:all 0.25s ease-in-out;
	-moz-transition:all 0.25s ease-in-out;
}
.work_item img { }
.work_item_client { margin-top:5px; }

.work_details { margin-bottom:30px; }
.work_detail_breadcrumbs { padding-left:4%; }
.overlay { 
	opacity: 0; position: absolute; top: 48%; left: 50%; z-index: 10; pointer-events: none; 
	margin-top: -54px; /*half of image height*/
	margin-left: -54px; /*half of image width*/
}
.carousel_controls { text-align:center; padding:20px 0 0 0;  }
.carousel_controls img { vertical-align:bottom;  }
#pause_overlay { opacity:0; }
#play_overlay { opacity:0; }
#play_control { display:none; }

.testimonial { padding-top:30px; padding-bottom:30px; }

.website_design_item img { margin-bottom:20px; }
.website_design_item a { margin-bottom:50px; }


.required_symbol { color:#138e8e; font-size:40px; font-weight:300; position:relative; top:11px;}
.icon { margin:0 10px 3px 0; width:35px; }
.error { color:#900; font-size:17px; margin:5px 0; }


/******************** Magnificent Popup Image Modal ********************/
.mfp-bg { opacity:0.95; }
.mfp-figure { margin-left:-15px; }
.mfp-figure:after { background:none; box-shadow:none; }
.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { padding-right:0; top:16px; right:0; }
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor:pointer; }
.mfp-close { opacity:1; }

/* padding-bottom and top for image */
.mfp-no-margins img.mfp-img { padding: 0; }
/* position of shadow behind the image */
.mfp-no-margins .mfp-figure:after { top: 0; bottom: 0; }
/* padding for main container */
.mfp-no-margins .mfp-container { padding: 0; }

/* for zoom animation uncomment this part if you haven't added this code anywhere else */
.mfp-with-zoom .mfp-container, .mfp-with-zoom.mfp-bg {
	opacity: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
}
.mfp-with-zoom.mfp-ready .mfp-container { opacity:1.0; }
.mfp-with-zoom.mfp-ready.mfp-bg { opacity:0.8; }
.mfp-with-zoom.mfp-removing .mfp-container, .mfp-with-zoom.mfp-removing.mfp-bg { opacity:0; }

.mfp-arrow { opacity:1.0; }
.mfp-arrow:before { opacity:1.0; }
.mfp-arrow-left:before { border-right:27px solid #ffffff; }
.mfp-arrow-right:before { border-left:27px solid #ffffff; }


/******************** Navbar Toggle Button switch on small breakpoint ********************/
@media only screen and (max-width : 991px) {
.navbar-header { float:none; }
.navbar-left,.navbar-right { float:none !important; }
.navbar-toggle { display:block; }
.navbar-collapse { border-top:1px solid transparent; box-shadow:inset 0 1px 0 rgba(255,255,255,0.1); }
.navbar-fixed-top { top:0; border-width:0 0 1px; }
.navbar-collapse.collapse { display:none !important; }
.navbar-nav { float:none !important; margin-top:7.5px; }
.navbar-nav>li { float:none; }
.navbar-nav>li>a { padding-top:10px; padding-bottom:10px; }
.collapse.in{ display:block !important; }
}


/******************** Bootstrap Carousal Fade Effect **********************/
.carousel-fade .carousel-inner .item { opacity:0; transition-property:opacity; }
.carousel-fade .carousel-inner .active { opacity:1; }

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right { left:0; opacity:0; z-index:1; }
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right { opacity:1; }
.carousel-fade .carousel-control { z-index:2; }
/* WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers." */
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-fade .carousel-inner > .item.next,
.carousel-fade .carousel-inner > .item.active.right { opacity:0; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); }
.carousel-fade .carousel-inner > .item.prev,
.carousel-fade .carousel-inner > .item.active.left { opacity:0; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); }
.carousel-fade .carousel-inner > .item.next.left,
	.carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active { opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); }
}


/******************** Custom Breakpoint Styles ********************/
/*---------- Custom, iPhone Retina ----------*/ 
@media only screen and (min-width : 320px) { 
	
}

/*---------- Extra Small Devices, Phones ----------*/ 
@media only screen and (min-width : 480px) {

}

/*---------- Small Devices, Tablets ----------*/
@media only screen and (min-width : 768px) {
	#header { font-size:16px; }
	#header .logo_dgag { margin-left:-13%; }
	.button_wrapper { text-align:left; }
	.btn_call_to_action_2, .btn_call_to_action_2:hover { font-size:16px }
}

/*---------- Medium Devices, Desktops ----------*/
@media only screen and (min-width : 992px) {
	#header { font-size:19px; }
	.navbar { margin-top:10px; }
	.nav > li { margin-left:8px; }
	.dropdown-menu { top:166%; }
	#footer { padding-top:40px; padding-bottom:40px; }
	#footer img { width:75%; }
	.btn_call_to_action_2, .btn_call_to_action_2:hover { font-size:17px }
	.btn_call_to_action_3, .btn_call_to_action_3:hover { font-size:15px }
	.work_detail > .carousel-inner .btn_expand  { right:21%; }
	.carousel-control { width:15%; }
	.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { right:-18px; }
}

/*---------- Large Devices, Wide Screens ----------*/
@media only screen and (min-width : 1200px) {
	.navbar { margin-top:22px; }
	.nav > li { margin-left:30px; }
	.btn_call_to_action_2, .btn_call_to_action_2:hover { font-size:19px }
	.carousel-control { width:20%; }
}
