/* mobil */
@media (min-width: 200px) and (max-width: 767px){
    
    html,body{ -webkit-overflow-scrolling: touch; -transform:none;-webkit-backface-visibility: hidden; min-height: 100%;}
    
    #caption {    position: absolute;    right: 10px;    top: 170px;    z-index: 222222; max-width:205px; height:auto;}
    #homeright{ right:10px; background:none; z-index:2 !important;}
    .bottomNav{ margin-right: -12px; margin-top: -226px!important; display:none !important; }
    footer.home-footer{ position:absolute !important; bottom:0px;}
    footer.page-footer{ position:relative !important; bottom:0px; margin-top:0px;}

    #logo > h1{ padding:0px; margin:0px; background-color: #fff; padding: 5px; border-width: 5px; border-radius: 2px; border-color:  rgba(0, 0, 0, 1);}
    #logo > h1 > a > img{ width: 145px!important; height: 85px !important;  }
    #logo{position: absolute; left: 33px; top: 53px; z-index: 9999; padding:5px; margin:0px; border-radius: 3px; background-color: rgba(0, 0, 0, 0.2);}

    #logo2 > h1{ padding:0px; margin:0px; background-color: #fff; padding: 5px; border-width: 5px; border-radius: 2px; border-color:  rgba(0, 0, 0, 1);}
    #logo2> h1 > a > img{ width: 145px!important; height: 85px !important;  }
    #logo2{position: absolute; left: 33px; top: 53px; z-index: 9999; padding:5px; margin:0px; border-radius: 3px; background-color: rgba(0, 0, 0, 0.2);}


    
    /*
    #logo{    width: 125px;
    height: auto;
    display: block;
    background: url(img/menu-bg-center.png) 0px 0px repeat-y;
    background-size: 100%;
    text-align: center;     left: 20px;
    top: 26px;}
    #logo:before{    content: '';
    width: 125px;
    height: 7px;
    display: block;
    background: url(img/menu-bg-top.png) center center no-repeat;
    position: relative;
    background-size: 100%;
    top: -6px;}
    #logo:after {
    content: '';
    width: 125px;
    height: 7px;
    display: block;
    background: url(img/menu-bg-bottom.png) center center no-repeat;
    background-size: 100%;
    position: relative;
    top: 6px;
    }
    */


#slider{ height: 300px;  width:auto;  display: block;    position: relative;}
footer{    width: 100%;    background: #000000;    height: 70px;    z-index: 111112;    text-align: center;    position: relative;    bottom: 0px;}
#zoominoutParent, #zoominoutParent > .opportune, .bannerscollection_zoominout.opportune .contentHolderVisibleWrapper, .bannerscollection_zoominout .contentHolder, .bannerscollection_zoominout .contentHolderUnit{ height:100%;}
footer #footerleft {    position: absolute;    right: 0px;    top: 19px;     left: auto;    width: 100%;    margin: 0 auto;}
footer #footercenter {    margin: 0 auto;    padding-top: 12px;    padding-bottom: 0px;    font-size: 12px;    color: #a4a4a4;    width: 100%;    height: 30px;}
footer #footerleft ul.footer-social { text-align:center; margin-top: 16px;}
footer #footerleft ul.footer-social > li{ float:none; display:inline-block; margin: 0px 8px;}

#menu{ border: 3px solid rgba(255, 255, 255, 0.31)!important; background:none !important; display:none; top: 80px; left: 20px;     z-index: 99999999;}
#menu:after,#menu:before{ display:none;}
#menu > ul{ background: url(img/menu-open-bg.png) repeat;    width: 100%;    max-height: 330px;    position: relative; overflow: auto;}
.flexnav li ul{ border:none !important;}
.flexnav .touch-button{         transform: rotate(0deg) !important;    width: 96%!important;    text-align: right!important;    height: 25px!important;    right: 10px!important;    top: 3px!important;}
.flexnav .touch-button .navicon{ font-style:normal; font-size: 8px!important; top: 6px!important;}
.flexnav .touch-button.active > i.navicon{    transform: rotate(-180deg) !important; -webkit-transform: rotate(-180deg) !important;    color: #00467f;    position: absolute;    right: 0px;    top: 7px !important;}
.flexnav li a{ padding:7px 9px !important;}


.menu-button.active { left:20px !important;}
.menu-button{border: 3px solid rgba(255, 255, 255, 0.31)!important;    border-radius: 1px; width: 55px; height: 50px; position: absolute!important; left: 165px; top:20px; z-index:99999;background: none!important;padding: 0px!important;color: #717984!important;   -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;}
.menu-button .menu-button-cont{background: url(img/menu-open-bg.png) repeat;width: 100%;height: 100%;position: relative;padding: 14px 10px 11px 10px;}

.icon-bar { display: block; width: 100%; height: 2px; border-radius: 0px; margin-bottom: 5px; border: none; background-color: #727a85;   -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;}
    
    .icon-bar.closemenu2{ -moz-transform: rotate(0deg); -ms-transform: rotate(0deg);  transform: rotate(0deg); -webkit-transform: rotate(0deg); }
    .icon-bar.closemenu1{ -moz-transform: rotate(0deg); -ms-transform: rotate(0deg);  transform: rotate(0deg); -webkit-transform: rotate(0deg); }
    .icon-bar.closemenu3{ -moz-transform: rotate(0deg); -ms-transform: rotate(0deg);  transform: rotate(0deg); -webkit-transform: rotate(0deg);  }
    
    .menu-button.active .icon-bar.closemenu2{ display:none;}
    .menu-button.active  .icon-bar.closemenu1,
    .menu-button.active  .icon-bar.closemenu3{ -moz-transform: rotate(45deg); -ms-transform: rotate(45deg);  transform: rotate(45deg); -webkit-transform: rotate(45deg);}
    .menu-button.active  .icon-bar.closemenu1{ -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg);  transform: rotate(-45deg); -webkit-transform: rotate(-45deg);  position: relative; top:6px;}


.detail-container .detay-content {    width: 88%;    height: auto;    display: block;    background: url(img/detail-bg-center.png) 0px 0px repeat-y;    background-size:100%;    text-align: center;}
.detay-content:after{ content:''; width:100%; height: 45px; display:block; background: url(img/detail-bg-bottom.png) center top no-repeat; background-size:100%; position: relative; top: 45px; margin-top: -45px;}
.detay-content:before{ content:''; width:100%; height: 46px; display:block; background: url(img/detail-bg-top.png) center bottom no-repeat; background-size:100%; position: relative; top: -46px; margin-bottom: -41px;}

    .detail-container > #detaycontent{  left: 20px;   top: 190px;  z-index: 999991;  margin-bottom: 0px;}
    .detail-container .detay-content .content { padding: 0px 20px 0px 20px;}
    
    footer.detay-footer{    position: relative;    bottom: 0px;    margin-top: 40px;}
    .detay-content .content{ font-size:12px;}
    .detay-content .content > h2{ padding-bottom:10px; margin-bottom:10px;}
    #detaygolge {bottom: 0px; top:auto;height: 230px;position: relative;}
    .more-info{ height:auto !important;}
    .news-block {
     padding-left: 20px !important;
    
     padding-top: 220px !important;
}
.news-block .news-image {
    bottom: auto!important;
    right: 0;
    width: 100%!important;
    height: 200px!important;
}
.main-news-listing {
    width: 100%;
    padding-right: 0;
}



/* Slider Caption */
#caption{ max-width:none !important;}
.caption-detail{ background:rgba(0, 70, 127, 0.65)!important; background-image:none !important; border:3px solid rgba(255, 255, 255, 0.29) !important;  padding:20px; width:290px !important;}
.caption-detail:before { display:none !important;}
.caption-detail:after {display:none !important;}
.caption-detail a {
    padding: 5px 15px !important;
    border: 3px solid rgba(255, 255, 255, 0.27) !important;
    display: inline-block !important;
    margin-bottom: 20px !important;
    margin-top:-25px !important;
}
.caption-detail p{ width:100% !important; font-size:14px !important;  margin:0px!important;    }
.caption-detail p:first-child{ margin-top:20px !important;}
.caption-detail a:hover{ text-decoration:none;  border:5px solid rgba(255, 255, 255, 0.99); background:rgba(255, 255, 255, 1); color:#00467f;}
.newFS, .caption-detail{ font-size:20px !important;  font-family: 'tstar_proregular' !important; line-height:27px !important;}
.caption-link{ top: -30px !important;     z-index: 99 !important; }

/* Slider Caption */
.bysm724{ display:none;}

    
}
/* masaustu */
@media (min-width: 768px){
    
    #zoominoutParent, #zoominoutParent > .opportune, .bannerscollection_zoominout.opportune .contentHolderVisibleWrapper, .bannerscollection_zoominout .contentHolder, .bannerscollection_zoominout .contentHolderUnit{ height:715px !important;}
    .detail-container{ position:relative;  margin-bottom: 160px;}
    .detail-container > #logo { position:absolute; left: 0px;}
    .detail-container > #menu{ position:absolute; left: 0px;}
    .detail-container > #detaycontent{  left: 245px; }
    #menu, #logo{ display:block !important;}
    
    
}
/* tablet */
@media (min-width: 768px) and (max-width: 991px){
    
    #footercenter{ width:90% !important; padding-top:70px !important;}
    .bannerscollection_zoominout.opportune .bottomNav{ right:24px !important;}
    
    .detail-container > .detay-content{    width: 500px;    background-size: 100%;    top: 73px !important;}
    .detay-content .content{ padding:0px 30px;}
    .detay-content:before {    content: '';    width: 500px;    height: 46px;    display: block;    background: url(img/detail-bg-top.png) left bottom no-repeat;    position: relative;    background-size: 100%;    top: -46px;    margin-bottom: -46px;}
    .detay-content:after {    content: '';    width: 500px;    height: 45px;    display: block;    background: url(img/detail-bg-bottom.png) left top no-repeat;    position: relative;    background-size: 100%;    top: 45px;    margin-top: -46px;}
    .bannerscollection_zoominout.opportune .bottomOverThumb{ display:none !important; }
    #slider{ height: 300px;  width:auto;  display: block;    position: relative;}

}
@media (min-width: 768px) and (max-width:1024px){
#homeright{ right:10px; z-index: 999999;}
.bannerscollection_zoominout.opportune .bottomNav{ right:24px !important;}
.bannerscollection_zoominout.opportune .bottomOverThumb{ display:none !important; }
#slider{   width:auto; height: 420px;  display: block;    position: relative;}
}


@media (min-width: 1025px) and (max-width:1368px){
    .detail-container > #logo { position:absolute; left: 110px;}
    .detail-container > #menu{ position:absolute; left: 110px;}
    .detail-container > #detaycontent{  left: 360px; }
    #slider{   width:auto; height: 420px;  display: block;    position: relative;}
    
}
@media (min-width: 1369px){
}