/*
Theme Name: Media Buying Brisbane
Theme URL: http://mediabuyingbrisbane.com.au/
Author: Zigzag Advertising
Author URI: http://zigzagadvertising.ph
Description: Custom Theme for Media Buying Brisbane
Version: 1.00
*/

@import url(http://fonts.googleapis.com/css?family=Alef:400,700);

/***======
    RESET
===============================***/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/*
font-family: 'Alef', sans-serif;
color green rgb(138, 185,51)
*/

/*======================================== 
GLOBAL STYLES
========================================== */

body {background:url(img/bg.gif);padding-bottom: 40px; color: #222222;font-family: 'Alef', sans-serif; font-size: 14px;line-height: 1.428571429;}
.container{margin:0 auto}
a{color: #82b425;outline:none!important}
a:focus{outline:none!important}
.clr{clear:both}
.lt{float:left}
.rt{float:right}
p{padding:10px 0}

/*=================
     Header
==================== */

.navbar-wrapper {top: 0; left: 0; right: 0;z-index: 20;}
.navbar-wrapper .container { padding-left: 0;padding-right: 0;}
.navbar-wrapper .navbar {padding-left: 15px; padding-right: 15px;}
 h1 .navbar-brand{background:url(img/branding.png) center right no-repeat; width:310px; height:250px;  position:absolute; z-index:1;top:-90px;font-size:0; line-height:0; margin:0 auto}
.nav li{ display:inline; text-transform:uppercase; font-size:16px;padding:0 10px; line-height:55px}
.nav li a{display:inline-block; color:#ffffff}
.nav li a:hover, .current_page_item a{ color:rgb(138, 185,51)!important;outline:none!important }

.navbar-inverse {top:90px; min-height:300px}
.navbar-wrapper .navbar{height:55px}
.phone{font-size:25px!important;color:#ffffff!important; line-height:50px;font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}


/***************
SLIDER
************/
.media img, .zigzag img{ width:100%; height:auto}
.slider{margin-top:180px;background:#ffffff;padding:5px;-webkit-box-shadow: 0px 1px 7px 0px rgba(50, 50, 50, 0.75);-moz-box-shadow:    0px 1px 7px 0px rgba(50, 50, 50, 0.75);box-shadow:         0px 1px 7px 0px rgba(50, 50, 50, 0.75);}
.responsive-slider.flexslider .slide-title a{background:none!important}
.responsive-slider.flexslider {margin-bottom:0!important}

.top{margin-top:40px;}
.top h2{font-size:24px;color:#222222; line-height:35px; text-align:center;padding-bottom:20px}
.top span, .zig span{color:rgb(138, 185,51); font-weight:bold;font-size:36px}
.da-dots span{background:#222222!important}
.da-arrows span{background:#909090!important}
.zig{background:#222222;position:relative;}
.zig h2{padding:15px; text-transform:uppercase; line-height:38px;font-size:20px;color:#ffffff}
.zig:after{position:absolute;top:0; right:-30px;border-style: solid;border-width: 30px 0 0 30px;height:0; width:0;border-color: transparent transparent transparent #222222;display:block; content:'';}
.content_padd{padding:50px 0; position:absolute}
.content_padd span{color:rgb(138, 185,51); font-weight:bold}

.we li{font-weight:bold;padding:6px 0;font-size:18px}
.we li span{color:rgb(138, 185,51); text-transform:uppercase}
.contain{margin:20px 0}
.contain h2{background:rgb(138, 185,51); position:relative; width:320px; height:50px;line-height:50px; font-size:24px;color:#ffffff; text-align:justify;margin:20px 0;padding-left:20px}
.contain h2:after{width: 0px;height: 0px;border-style: solid;border-width: 26px 0 24px 50px;border-color: transparent transparent transparent rgb(138, 185, 51);position:absolute;display:block; content:'';top:0;right:-50px}

/******************CONTACT FORM*********************/
.contform li{list-style:none;margin:15px 0;}
.contform input, .contform textarea{background:#d0cece;outline:none; padding:5px 10px;box-shadow:none;border:none; width:100%}
.contform textarea{resize:none; height:60px}
.sec{width:200px!important; float:left}
div.wpcf7-response-output.wpcf7-display-none.wpcf7-mail-sent-ok{border:none!important}
.contform input.submit{background:rgb(138, 185, 51)!important;width:90px!important; text-transform:uppercase;color:#ffffff!important;letter-spacing: normal; border: none;text-decoration:none;float:right}
.contform.submit:hover{background:#000;color:#ffffff}
div.wpcf7-mail-sent-ng {border:none!important; color:red}
.wpcf7-validation-errors{border:none!important}
.thanks{height:90px;margin-top:200px; color:#87B933; text-align:center}

/*================================
           SERVICES
================================*/
.services p{padding-left:30px}

/*================================
            FOOTER
================================*/
.foot{background:#222222; color:#ffffff;position:relative;top:50px; min-height:150px}
.foot:after{width: 0px;height: 0px;border-style: solid;border-width: 0 40px 40px 40px;border-color: transparent transparent #222222 transparent;position:absolute; content:''; top:-40px;left:50%;margin-left:-20px}
.foot h3{font-size:18px; color:rgb(138, 185,51); padding-left:20px}
.foot p{margin:0!important;line-height:15px}
.links {padding-bottom:40px}
.links li a{font-size:13px; color:#ffffff}
.links li a:hover{color:rgb(135, 185, 51)}
footer{background:rgb(135, 185, 51);height:50px;position:relative;line-height:50px; text-align:center}
footer a{color:#ffffff}
.pull-right{background:#222222; padding:18px 18px 17px 18px}

/*==================================== 
          RESPONSIVE CSS
====================================== */
@media (max-width : 319px) {
h1 .navbar-brand{margin-top:-270px;left:-3%}
 .navbar-inverse{margin-top:160px}
.slider, .metaslider{display:none; }
}

@media (min-width : 320px) and (max-width : 479px) {
h1 .navbar-brand{margin:-280px auto 0 -8%;}
 .navbar-inverse{margin:160px auto auto auto}
 .phone{font-size:20px!important;  top:-50px;position:relative}
.slider, .metaslider{display:none!important; background:none; box-shadow:none;margin-top:70px}
.navbar-collapse{background:#222222;margin-top:-74px;width:100%; z-index:2}
.nav li {display:block;line-height:18px; margin:10px 0;text-align:center}
.col-xs-push-cos{left:0!important}
.top{margin-top: 40%;}
.contain h2{ width:220px; height:50px;line-height:50px; font-size:16px;margin:20px 0;padding-left:20px}
.foot:after{left:40%}
footer{top:20px; height:100%; line-height:20px}
.links {padding-bottom:10px}
.contform input.submit {margin-top:20px; border-radius:none!important; box-shadow:none!important; }
.zigzag img{height:100%}
.zig h2{font-size:16px;line-height:26px}
.content_padd{padding-top:20px}
footer span{font-size:11px}
.navbar-inverse .navbar-toggle {background-color: rgb(138, 187, 62);}
}

@media (width : 480px) {
 h1 .navbar-brand{margin-top:-53%;left:13%; }
 .navbar-inverse{margin-top:35%}
.phone{margin-top: -50px;position: absolute;}
.navbar-collapse{background:#222222;}
.slider{display:none;!important}
}

/********iphone landscape*************/

@media   (min-width : 481px) and (max-width: 767px) {
.navbar-inverse{margin-top:190px}
 h1 .navbar-brand{margin-top:-295px; left:25%}
 .navbar-collapse{background:#222222;margin-top:-74px;width:100%; z-index:2}
.phone{font-size:20px!important;  top:-50px;position:relative;}
.slider{margin-top:100px}
.navbar-inverse .navbar-toggle {background-color: rgb(138, 187, 62);}
}

@media (width: 360px){
 h1 .navbar-brand{left:12%}
.slider{display:none;!important}
}
@media (width: 640px) {
  .navbar-inverse{margin:180px auto auto auto}
   h1 .navbar-brand{margin:-285px auto 0 auto; left:25%}

}

/*********ipad portrait**********/
/*@media (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

 h1 .navbar-brand{margin-top:-35%; left:30%}
 .navbar-inverse{margin-top:170px}
 .links li a{font-size:10px}
.foot p{font-size:10px;}
.slider{ margin-top:100px}
.foot p {10px}

}*/


@media (min-width: 768px) and (max-width:1024px) {
  .navbar > .container .navbar-brand {left:25%;top:-160px; }
  .navbar-nav{margin-top:-70px!important;}
  .nav li a{ font-size:14px!important}
  .phone{font-size:14px!important}
  .links li a{font-size:10px;padding:0 10px;}

}

@media (min-width: 992px) {
   .navbar > .container .navbar-brand {left:10%;top:-90px; }
   .navbar-nav{margin-top:0!important}
  .nav li a{ font-size:14px!important}
  .phone{font-size:18px!important}

}

<!--ipad landscape-->
@media (min-width:992px) and (max-width:1024px) {
.nav{outline:1px solid red}
h1 .navbar-brand{margin-top:-110%; left:-25px}
 .navbar-inverse{margin-top:200px}
}

/***======
    LOGIN PAGE
===============================***/
#login h1 a {background-image:url(img/branding.png) !important; width:300px!important;}
body.login{{background-image:url(img/bg.gif)!important;}
#loginform{box-shadow:none!important;background:#000;border:1px solid #565656}
.login #nav a, .login #backtoblog a {color: #FFFFFF !important;text-shadow:none!important;}
.login #login p.message{color:#222222!important}
#login_error, #login_error a{color: #222222}
.login #nav a:hover, .login #backtoblog a:hover, #login_error a:hover{color:#ffbe00!important;text-shadow:none!important}