/*
 * Galleries
 * -------------------------------------------------- */


/* WORKS */
#works {padding-top: 30px;}
#works ul {list-style: none; margin: 0; padding: 0;}
#works .works_bar{position:relative; overflow: hidden; font-size: 14px; border-top:1px solid #06A545; border-bottom:1px solid #06A545; padding: 4px 0;}
#works .works_bar .nav{margin-top: 5px;}
#works .works_bar .nav a{font-weight:bold;}
#works .works_bar .search {text-transform: uppercase; color: #06A545;}
#works .show_works_popup {cursor: pointer;}
#works .show_works_popup:hover {color: #068438;}

#works #galleries {overflow: hidden;}
#works #galleries .gallery-works{padding:15px 0 0; margin: 0 -8px; list-style: none;}
#works #galleries .gallery-works > li{position:relative;float:left;width: 50%;padding:8px;background:none; font-size: 11px; line-height: 15px;}
#works #galleries .gallery-works > li .open-modal {position: absolute; left: 0; right: 0; height: 100%; width: 100%; z-index: 2; cursor: pointer;}
#works #galleries .gallery-works > li > img {max-width: 100%;display: block;margin: 0 auto 5px; width: 100%;}
#works #galleries .gallery-works > li .credits {height: 30px; overflow: hidden;}
#works #galleries .gallery-works div.work{ position: relative; cursor: pointer; overflow: hidden; width: 100%; margin-bottom: 5px; height: 0; padding-bottom: 100%; background-color: #747678;}
#works #galleries .gallery-works div.game{background:url(../images/video_games_thumb.png) no-repeat;background-size: cover;}
#works #galleries .gallery-works div.future-new{background:#E4512C;background-size: cover;}
#works #galleries .gallery-works div.work p {padding:10px;position:relative;font-size:11px;color: #fff;word-wrap: break-word;}
#works #galleries .gallery-works div.work p b {padding-top: 15px; display: block; font-weight: bold;}
#works .grid-row {padding-bottom: 90%; margin-bottom: 5px;}

#works .block {position: relative; font-size:11px;line-height:15px;}
#works .block + .block:before {height: 1px; background-color: #06A545; position: absolute; top: 0; left: 15px; right: 15px; content: "";}
#works .block + .block {padding-top: 25px; margin-top: 20px;}
#works .block strong, #works .block b {font-weight: bold;}
#works .block strong {color: #06A545;}
#works .details {font-size: 11px; display: block !important;}
#works .details p {margin-bottom:0.9em;}
#works .details .in-portfolio p {margin-bottom:0.3em;}
#works .details .writing .item {overflow-y: auto; background-color:#FFF;border:1px solid #CCC;}
#works .details .writing .item .writing-content {padding: 10px;}
#works .details .writing .item h1,
#works .details .writing .item h2,
#works .details .writing .item h3,
#works .details .writing .item h4,
#works .details .writing .item h5,
#works .details .writing .item h6 {font-size: 17px;}
#works .details .art .owl-stage-outer {text-align: center; overflow-y: auto;}
#works .details .art .owl-stage-outer img {max-height:490px;vertical-align:middle;}
#works .details .portrait {max-width: 150px;display: block;margin-bottom: 5px; width: 100%;}
#works .details .clipboard {border: 2px solid #06A545; padding: 5px;}
#works .details .gallery-media > div,
#works .details .gallery-media {position: relative;  padding-bottom: 70%; height: 0; overflow: hidden; max-width: 100%;}
#works .details .gallery-media > a {position: absolute !important; left: 0; top: 0; width: 100% !important; height: 100% !important;}
#works .details .gallery-media > a div {top: 50% !important; left: 50% !important; margin-top: -25px !important; margin-left: -25px !important;}
#works .details .gallery-media embed,
#works .details .gallery-media iframe,
#works .details .gallery-media object,
#works .details .gallery-media video {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#works .details .item-details {font-size: 14px; line-height: 1.48;}
#works .details .item-details img {max-width: 120px; margin-bottom: 10px;}
#works .details .item-details .item {margin-top: 12px;}


#works .spinner {background:url(../images/spinner.gif) 50% no-repeat;height:600px;}
#works .search_criteria {padding:20px 0;}
#works .search_criteria ul {color:#06A545;margin:0;padding-left:20px;}
#works .search_criteria ul li {list-style: disc outside none;padding:0;background:none;}
#works .search_criteria ul li span{color: #333;}

#works-popup{background:#fffce1;font-size: 11px;line-height: 18px;}
#works-popup h3{color: #231F20;margin: 1em 0;font-size: 14px;font-weight: bold;}
#works-popup ul{margin: 0 0 1em;}
#works-popup .des {margin-top: 3em; margin-bottom: 0;}
#works-popup .col + .col {border-top: 2px solid #ccc;}
#works-popup .col h3{color:#231f20;margin-bottom:1em;}
#works-popup .col li{padding:0;background:none;}
#works-popup .col a{color:#231f20; transition: none;}
#works-popup .col select{padding:1px 2px;border:solid 1px #CCC;margin-bottom:5px;width: 100%;}
#works-popup .go{background:#06A545; border-color:#06A545; color: #fff;}
#works-popup .selected {font-weight:bold;background:url(../images/check.png) no-repeat 0 0;padding-left:13px;}
#works-popup .high {margin-bottom:8px;}

/*Modal Window*/
.modal-open .modal {padding-right: 0 !important;}
#works .modal-dialog .modal-title {padding: 10px 0;}
#works .modal-dialog .modal-body {padding-top: 0; padding-bottom: 0;}
#works .modal-dialog .modal-content {border-radius: 0; padding: 5px 0 15px; background-color: #e4f1df;}
#works .modal-dialog .modal-header {padding: 10px 15px; border-bottom: none;}
#works .modal-header .close {width: 50px; height: 50px; margin-top: -15px; margin-right: -15px;}
#works .modal-header .close:hover, #works .modal-header .close:focus {border: none; outline: none; box-shadow: none;}
#works .modal-dialog .modal-footer {padding: 0 15px; border-top: none; }


@media (min-width: 480px) {
  #works .works_bar .nav{float: right; margin-top: 0;}
  #works .works_bar .search{float: left;}

  #works #galleries .gallery-works{margin: 0 -15px;}
  #works #galleries .gallery-works > li{padding:15px; width: 33.333%;}
}
@media (min-width: 768px) {
  .modal-open #footer {right: 17px;}
  #works #galleries .gallery-works{margin: 0 -23px;}
  #works #galleries .gallery-works > li{width: 25%; padding-left: 23px; padding-right: 23px;}
  #works .block + .block {padding-left: 0; padding-top: 0; margin-top: 0;}
  #works .block + .block:before {display: none;}
  #works .modal-dialog {width: auto; max-width: 950px; margin: 30px 10px;}
  #works .modal-dialog .modal-title {max-width: 66.66667%;}
  #works-popup .col {display: table-cell; height: 100%; float: none;}
  #works-popup .col + .col {border-top: none; border-left: 2px solid #ccc;}
}
@media (min-width: 992px) {
  #works #galleries .gallery-works > li{width: 20%;}
  #works .modal-dialog {margin: 30px auto;}
}
@media (min-width: 1200px) {
  #works .modal-dialog .modal-title {max-width: 75%;}
}

/* OWL CAROUSEL */
#works .details .owl-carousel .owl-stage {max-height: 500px; overflow: hidden;}
#works .details .single-item {margin-bottom: 15px;}
#works .details .item {max-height: 500px; overflow: hidden;}
#works .details .item img{display: block;  width: auto; max-width: 100%; max-height: 490px; height: auto; margin: 0 auto 5px;}
#works .details .owl-dots {counter-reset: dots;}
#works .details .owl-dot span {width: 20px; height: 20px; margin: 5px; border: 1px solid #333; border-radius: 0; background: #fff;}
#works .details .owl-dot {position: relative;}
#works .details .owl-dot.active span, #works .works .owl-dot:hover span {border-color: #06A545; background: #fff;}
#works .details .owl-dot:before {counter-increment:dots; content: counter(dots); position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
#works .details .owl-dot.active:before, #works .works .owl-dot:hover:before {color: #06A545;}


/* MEDIA PAGE */
.page-template-template-media-page #masthead,
.page-template-template-media-page #footer {display: none;}

#newsletter {display: none !important;}

#works .clipboard-target {
    position: absolute;
    text-indent: -99999px;
}
#works .copy-to-clipboard {
    margin: 10px 0;
    width: 100%;
}
#works .alert {
    padding: 5px;
}
#works a { color:#747678; }
#works a:hover{ color:#FFB612; }
.section-green #works a:hover{ color:#068438; }
.section-orangered #works a:hover{ color:#F47735; }