/*
Theme Name: TAF
Theme URI: 
Author: Barley House Agency
*/

/* =Structure
-------------------------------------------------------------- */

body, html{
	margin:0px;
	width: 100%;
	height: 100%;

}

.main{
	overflow: hidden;
}


*{
    font-family: 'Montserrat', sans-serif, Arial;
    line-height: 1.5;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;
    font-weight: 400;
}

*:focus{
    outline: none;
}

b, strong{
    font-weight: 500;

}

i{  font-style: italic;}

b i{
    font-style: italic;
    font-weight: 500;
}

a{
    text-decoration: none;
    color: #213a8a;
}

#section-content a{
    text-decoration: underline;
  
}

a:hover{
    text-decoration: none;
  }

h1{
    font-size: 2em;
    margin: auto;
    font-weight: 400;
}

h2{
    color: #000;
    font-size: 30px;
}

h3{
    color: #000;
    font-size: 20px;
}

.image{
    width:100%;
    height: 100%;
}

.button{
    position: relative;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 2px;
  color: #fff !important;
  outline: 0;
  overflow:hidden;
  background: none;
  z-index: 1;
  cursor: pointer;
  font-weight: 200;
	text-decoration: none !important;
}


.button:before {
    content: "";
    position: absolute;
    background: #213a8a;
    top: 0;
    left: 0;
    width:100%;
    height: 100%;
    z-index: -1;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
    
}


.button:after {
      content: "";
      position: absolute;
      background: #2e2e2e;
      height: 100%;
      width: 0;
      z-index: -1;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.button:hover:after {
    width: 100%;
      color: #fff;
}

.noscroll{
	overflow: hidden;
}

.blur{
    -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}

.play-btn{
    position: absolute;
}

.play-btn .fas{
    font-size: 50px;
    color: #fff;
}

.play-btn .fas:hover{
    font-size: 80px;
    color: #555555;
    cursor: pointer;
} 

.animate{
	visibility: hidden;
}

.err-msg{
    font-size: 2em;
    text-align: center;
    width: 100%;
}

#event-table td{
    vertical-align: top;
}

.vbox-content {
    position: relative;
    overflow: hidden;
    padding: 0;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 !important;
    line-height: 0;
}

video{
    width: 100%;
}

.pagination {
    clear:both;
    padding:20px 0;
    position:relative;
    font-size:12px;
    line-height:12px;
    text-align: center;
    }
    
    .pagination div, .page-numbers {
    position: relative;
    display:inline-block;
    margin: 3px;
    text-decoration:none;
    width:auto;
    color:#fff;
    background: #555;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    }

   
    
    .pagination .number, .page-numbers .number{
        position: absolute;
    }

    .pagination div:hover, .page-numbers:hover{
    color:#fff;
    background: #213a8a;
    }
    
    .pagination .current, .page-numbers.current{
    background: #213a8a;
    color:#fff;
    }

    .pagination-arrows{
        margin: 3px;
        text-decoration:none;
        width:auto;
        color:#555 !important;
        background: transparent !important;
        border-radius: 50%;
        width: 30px;
        height: 30px;
        font-size: 30px;
    }

    .pagination-arrows:hover{
        color: #213a8a !important;
        }


dd {
    display: block;
    margin-inline-start: 0px;
}

/* ---------------------------------------------- /*
 * Grids
/* ---------------------------------------------- */

.grid-2{
    position: relative;
	max-width: 1400px;
	display: grid;
    grid-gap: 4%;
	grid-template-columns: 48% 48%;
	margin: auto;
}

.grid-item {
    position: relative;
    height: 100%;
    font-size: 18px;
    text-align: left;
    width: 100%;
    margin: auto;
}

.grid-item h2{
    margin: auto;
}

.grid-3{
    position: relative;
	max-width: 1400px;
	display: grid;
    grid-gap: 45px 4%;
	grid-template-columns: 30.66% 30.66% 30.66%;
	margin: auto;
}

.grid-4{
    position: relative;
	max-width: 1400px;
	display: grid;
    grid-gap: 20px 4%;
	grid-template-columns: auto auto auto auto;
	margin: auto;
}


section{
    position: relative;
    overflow: hidden;
}

article{
    max-width: 1200px;
    min-height: 300px;
    width: 100%;
    padding: 2em 20px;
    margin: auto;
}

#section-content{
    position: relative;
    max-width: 1400px;
    height: auto;
    margin: auto;
    padding: 3em 20px;
}

#banner{
    position: relative;
    width: 100%;
    height: 650px;
    overflow: hidden;

}

#banner::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
}

#banner-text{
    position: absolute;
    top: 60% !important;
    max-width: 1400px;
    width: 100%;
    height: auto;
}

#banner-text-pages{
    position: absolute;
    color: #fff;
}

#banner-text-pages h1{
    font-size: 3em;
	font-weight: 500;
}

.inner-banner-text h1{
    font-size: 2em;
    margin: 0;

}

.inner-banner-text{
    position: relative;
    left: 0;
    width: 66%;
    color: #fff;
    font-size: 22px;
    padding: 20px 50px;
	font-weight: 500;
}

.inner-banner-text p{
	font-weight: 400;
}



.carousel-wrap {
    position: relative;
    width: 100%;
    margin: auto;
    padding: 20px 30px;
}

/* ---------------------------------------------- /*
 * Center Div
/* ---------------------------------------------- */
#video-background, .button:after, #banner-text, #banner-text-pages, .main-menu, .main-menu a:after, .header-menu a:after,
.play-btn, .pagination .number, .inner-search
{
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
  	-ms-transform: translate(-50%,-50%);
  	transform: translate(-50%,-50%);
  	-moz-transform: translate(-50%,-50%);
}

/* ---------------------------------------------- /*
 * Left Center Div
/* ---------------------------------------------- */
.copyright, .taf-header, .left-center {
    left: 50%;
    -webkit-transform: translate(-50%,0);
  	-ms-transform: translate(-50%,0);
  	transform: translate(-50%,0);
  	-moz-transform: translate(-50%,0);
}

/* ---------------------------------------------- /*
 * Top Center Div
/* ---------------------------------------------- */
.top-center{
    top: 50%;
    -webkit-transform: translate(0,-50%);
  	-ms-transform: translate(0,-50%);
  	transform: translate(0,-50%);
  	-moz-transform: translate(0,-50%);
}


/* ---------------------------------------------- /*
 * Transition
/* ---------------------------------------------- */
#logo, .button:after, .inner-banner-text, .main-menu a:after, .header-menu a:after, .play-btn .fas, .submit-btn{
    -webkit-transition: .3s ease-in-out;
  	-moz-transition: .3s ease-in-out;
  	-o-transition: .3s ease-in-out;
  	transition: .3s ease-in-out;
}


/* ---------------------------------------------- /*
 * Post Items
/* ---------------------------------------------- */
.post-wrap{
    padding: 35px 20px;
}

.post-title{
    position: relative;
    border-bottom: 1px solid #ccc;
}

.post-date{
    position: relative;
    padding: 10px 0;
    font-size: 14px;
}

.post-img, .events-img{
     position: relative; 
    height: 220px;
    overflow: hidden;

}

.post-img img, .events-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.post-desc p{
    position: relative;
   margin-bottom: 30px;
}

.post-wrap .button{

}


.grid-4 .grid-item {
    font-size: 16px;
}



.alphabet{
    background-color: transparent;
    border: none;
    font-size: 16px;
}

.alphabet:hover{
    color: blue;
}


.a-filter{
	margin-bottom: 50px;
}

.a-filter ul{

    list-style: none;
    padding: 0;
   text-align: center;
	
}

.a-filter ul li{
    display: inline-block;
    
}

/* ---------------------------------------------- /*
 * Owl Carousel
/* ---------------------------------------------- */

.owl-carousel {
  display: block;
  width: 100%;
  position: static;
 overflow: hidden;
}

.owl-carousel .owl-item {
  display: block;
  float: left;
  width: 100%;
}


.owl-carousel .owl-item .item {
  display: block;
  float: left;
  width: 100%;
  position: relative;
  height: 100%;
  overflow: hidden;
  background-color: #f1f1f1;
}


.owl-nav{
	position: absolute;
	width: 100%;
	top: 45%;
    left: 0;
	transform: translateY(-50%);
  	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);

}

.owl-nav.disabled{
    display: none;

}

.owl-nav button{
	position: absolute;
	background: none;
	border: 0;
	font-size: 50px;
	color: #aaa;
}


.owl-nav button:hover{
	color: #213a8a;
	cursor: pointer;
}

.owl-prev{
	left: -20px;
}

.owl-next{
	right: -20px;
}


/* ---------------------------------------------- /*
 * Header
/* ---------------------------------------------- */
.taf-header{
    position: absolute;
    height: 90px;
    max-width: 1400px;
    width: 100%;
    margin: auto;
    z-index: 500;
}

#logo{
    position: absolute;
    top: 10px;
    left: 15px;
    height: 150px;
}



#logo img, .sog img, .footer-sog img{
    height: 100%;
    width: auto;
}

.sog{
	position: absolute;
	left: 20px;
	top: 10px;
	width: 80px;
	height: 80px;
	 z-index: 500;
}

.footer-sog{
	width: 180px;
	height: 80px;
	margin: 10px auto;
}

#header-buttons{
    position: absolute;
    right: 40px;
    text-align: right;
    bottom: 10px;
}

#social-buttons ul{
    padding: 0;
}

#social-buttons ul li, #header-nav ul li{
    display: inline-block;
    list-style: none;
    margin: 0 9px;
}

#header-buttons .fab, #header-buttons .fas{
    font-size: 22px;
    color: #fff;
}

.header-menu{
    margin: 0;
}

#tel-no{
    position: absolute;
    right: 115px;
    top: 18px;
}

#tel-no a{
    color: #fff;
    font-size: 1.2em;
}

#search-icon{
    position: absolute;
    right: 320px;
    top: 18px;
    color: #fff;
    font-size: 1.2em;
    cursor: pointer;
}

.arrow{
	position: absolute;
    bottom: 10px;
    color: #fff;
    font-size: 30px;
	left: 50%;
}

.arrow a{
    color: #fff;
}

.arrow a:hover{
     color: #213a8a;
}

/* ---------------------------------------------- /*
 * Menu
/* ---------------------------------------------- */


#main-nav{
    position: absolute;
    background-color: rgba(33,58,138, 0.90);
    height: 100%;
    width: 100%;
}

.main-menu{
    position: relative;
    list-style: none;
    margin: 0;
    margin: auto;
    padding: 0 50px;

}

.main-menu li{
    position: relative;
    text-align: center;
    width: 33%;
    margin: 10px auto;
    display: inline-block;
 }


.header-menu a{
    position: relative;
    font-size: 16px;
    padding: 5px 0;
    color: #fff;
}


.main-menu a{
    position: relative;
  padding: 2px;
  font-size: 25px;
  letter-spacing: 2px;
  color: #fff;
  outline: 0;
  overflow:hidden;
  background: none;
  z-index: 1;
  cursor: pointer;
  font-weight: 300;
 

}

.main-menu a:before, .header-menu a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width:100%;
    height: 100%;
    z-index: -1;

}


.main-menu a:after, .header-menu a:after  {
      content: "";
      position: absolute;
      height: 100%;
      width: 0;
      z-index: -1;
      border-bottom: 2px solid #fff;
}

.main-menu a:hover:after, .header-menu a:hover:after {
    width: 100%;
}




#menu{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

.menu-fixed{
    position: fixed!important;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 1;
}

.sub-menu {
    padding: 0;
   
}

.sub-menu a{
    font-size: 18px;
}
.sub-menu li{
    width: 100%;
    margin: 10px auto;
}


#nav-icon{
	width: 40px;
  	height: 32px;
  	position: absolute;
	right: 50px;
    top: 20px;
  	-webkit-transform: rotate(0deg) ;
 	-moz-transform: rotate(0deg) ;
  	-o-transform: rotate(0deg) ;
  	transform: rotate(0deg) ;
  	-webkit-transition: .5s ease-in-out;
  	-moz-transition: .5s ease-in-out;
  	-o-transition: .5s ease-in-out;
  	transition: .5s ease-in-out;
  	cursor: pointer;
}

#nav-icon span{
      display: block;
      position: absolute;
      height: 4px;
      width: 100%;
      background: #fff;
      border-radius: 9px;
      opacity: 1;
      left: 0;
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-transition: .25s ease-in-out;
      -moz-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
}

#nav-icon span:nth-child(1) {
    top: 0px;
}

#nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {
  top: 10px;
}

#nav-icon span:nth-child(4) {
  top: 20px;
}

#nav-icon.open span:nth-child(1) {
  top: 10px;
  width: 0%;
  left: 50%;
}

#nav-icon.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon.open span:nth-child(4) {
  top: 10px;
  width: 0%;
  left: 50%;
}


/* ---------------------------------------------- /*
 * Search Bar
/* ---------------------------------------------- */

.close-search{
    position: absolute;
    top: 10%;
    right: 20%;
}

.close-search:hover{
    cursor: pointer;
}

#main-search{
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(33,58,138, 0.90);
    z-index: 900;
    display: none;
    font-size: 30px;
    text-align: center;
    color: #fff;
}

.inner-search{
    position: absolute;

}

#search-input{
    width: 100%;
    padding: 10px;
    height: 50px;
    font-size: 16px;
}


.search {
        position: relative;
        left: 50%;
        transform: translate(-50%, 0);
        margin: 20px 0;
        border: 0px;
      }
      
      .searchTerm {
        float: left;
        width: 100%;
        border: 3px solid #00B4CC;
        padding: 10px;
        height: 40px;
        font-size: 16px;
        border-radius: 5px;
        outline: none;
        color: #9DBFAF;
      }
      
      .searchTerm:focus{
        color: #00B4CC;
      }
      
      .searchButton {
        position: absolute;
        right: 0px;
        width: 40px;
        height: 40px;
        border: 0px;
        background: #00B4CC;
        text-align: center;
        color: #fff;
        border-radius: 5px;
        cursor: pointer;
        font-size: 20px;
      }


/* ---------------------------------------------- /*
 * Content
/* ---------------------------------------------- */

/* ---------------------------------------------- /*
 * Homepage
/* ---------------------------------------------- */

#video-background {
  position: absolute;
  min-width: 100%; 
  min-height: 100%;
  width: auto; 
  height: auto;

}

#home-page h2{
    color: #213a8a;
    padding: 0 30px;
}

#home-page .grid-2{
    padding: 20px 30px;
    min-height: 500px;
}

#home-page .grid-item h2{
    padding: 0;
}

#home-page .about, #home-page .sponsors{
    background-color: #f1f1f1;
}

.sponsor-logos{
	padding: 0 20px;
}

.sponsor-logos img{
	width: 100%;
	
}

.sponsor-logos .item{
	height: 100px;
	
}

/* ---------------------------------------------- /*
 * Post Pages
/* ---------------------------------------------- */


#news-page .grid-item, #events-page .events, #job-page .jobs, #taf-awards-page .awards{
    background-color: #f1f1f1;
}

#event-table td{
    padding: 5px 20px 5px 0;
}

#events-page p{
    padding-top: 20px;
}

#event-form{
	margin-top: 30px;
}

/* #trade-associations-page .grid-4{
    position: relative;
	max-width: 1400px;
	display: grid;
    grid-gap: 20px 4%;
	grid-template-columns: 16% 25% 22% 25%;
    margin: auto;
} */

#trade-associations-page h3, #trade-suppliers-page h3{
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: 500;
}

#trade-suppliers-page .grid-3, #trade-associations-page .grid-3{
    grid-template-columns: 20% 46% 20%;
}


.trades{
        padding: 20px 0;
    border-bottom: 1px solid #ccc;
}

#section-content .trades:nth-last-child(2) {
    border-bottom: none;
}

.sponsors li{
	list-style: none;
	width: auto;

}

.trade-desc p{margin:0}

.no-match{
	font-size: 30px;
	text-align:center;
}

/* ---------------------------------------------- /*
 * Contact Form
/* ---------------------------------------------- */

.wpcf7-form-control-wrap .form-input, .mc_input{
	width: 100%;
    padding: 8px 0;
    font-size: 16px;
	text-indent: 10px;
}


.wpcf7-form-control-wrap select{
	width: 100%;
    height: 40px;
    font-size: 16px;
	text-indent: 10px;
}

.wpcf7-form-control-wrap textarea{
	width: 100%;
	padding: 10px;
	font-size: 16px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;  
	border-color: #ccc;
}



div.wpcf7-validation-errors, div.wpcf7-acceptance-missing{
	text-align: center;
	color: #f00;
	border: none!important;
}

div.wpcf7-mail-sent-ok{
	text-align: center;
	border: none !important;
}

.submit-btn, #mc_signup_submit.button{
    position: relative;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 2px;
  color: #fff;
  outline: 0;
  overflow:hidden;
  background: none;
  z-index: 1;
  cursor: pointer;
  font-weight: 200;
  background: #213a8a;
	
}

#mc_signup_submit.button{
	border: 0;	
}

.submit-btn:hover, #mc_signup_submit.button:hover{

  background: #2e2e2e;
}


.tick-services .wpcf7-list-item {
    width: 100%;
    max-width: 31%;
}

/* ---------------------------------------------- /*
 * Footer
/* ---------------------------------------------- */

footer{
    position: relative;
    background-color: #2e2e2e;
    padding: 20px;
    color: #fff;
}

footer a{ color: #fff;}

#inner-footer{
    position: relative;
    padding: 20px 50px;
    height: auto;
    margin: auto;
    max-width: 1400px;
    
}

#inner-footer .grid-2{
    position: relative;
	display: grid;
    grid-gap: 0;
	grid-template-columns: 6% 88%;
	margin: auto ;
}

#inner-footer .grid-item{
    font-size: 14px;
}

#inner-footer .grid-item.copyright{
    text-align: center;
}

.follow{
    text-align: right;
}

.footer-buttons{
    position: absolute;
    bottom: 0;
    right: 0;
    color: #fff;
}

.follow .social .fab{
    font-size: 25px;
    color: #fff;
}

#menu-footer-social-menu .menu-item:last-child{
    margin-right: 0;
}

.copyright{
    text-align: center;
    position: absolute;
    padding: 20px;
    bottom: 0;
    font-size: 12px;
}

footer .icon .fas{
    font-size: 20px;
    padding: 0 10px 0 0;
}

.fa-phone, .fa-envelope{
    font-size: 20px;
    padding: 0 10px 0 0;    
}


/* ---------------------------------------------- /*
 * Responsive
/* ---------------------------------------------- */

@media screen and (max-height: 450px) {
	
}

@media screen and (max-height: 650px) {
	#banner{ height: 500px;}
}

@media screen and (min-height: 651px) and (max-height: 750px) {
	#banner{ height: 600px;}

}

@media screen and (max-height: 768px) and (min-height: 451px){
	
}


@media only screen 
	and (max-device-width: 768px) 
  	and (min-device-width: 100px) 
 	and (orientation: portrait),
	only screen 
	and (max-width: 779px) 
 	and (min-width: 300px) 
 { 
/* ---------------------------------------------- /*
 * Structure
/* ---------------------------------------------- */ 
     
    header{height: 80px;}
	 
	 p{font-size: 16px;}

    #logo{left: 15px; height: 50px;}

    #header-buttons{ right: 10px; text-align: right; bottom: 10px; display: none;}
     #tel-no{position: absolute; right: 65px;  top: 12px;}
     
     #tel-no .fa-phone{color: #fff; font-size: 22px;}
     
     #tel-no span{display: none; }

     #search-icon{ font-size: 25px; right: 120px;  top: 8px;}
     
    #nav-icon{width: 35px;height: 30px; position: absolute;	right:15px; top: 12px;}

     #nav-icon span{height: 4px;}
 
    #header-buttons ul li{margin: 0 5px;}

    .carousel-wrap{padding: 0 10px 30px; width: 90%; }
     
    .inner-banner-text{ width: 100%; font-size: 20px; padding: 20px 20px;}
     
    .inner-banner-text h1 {font-size: 1.5em; margin: 0;}
     
    h2 {margin: 20px 10px 10px;}
     
    .image{height: 350px;}

    .main-menu li{display: block; width: 100%;}

    .main-menu a{ font-size: 20px; }

    .sub-menu a {font-size: 18px;}

	 #banner{
		 height: 500px;
	 }
	 
#banner-text-pages h1 {
    font-size: 30px;
}
	 
	 #section-content{
		 padding: 25px 10px;
	 }
	 
	 .inner-search { width: 90%;}
	 
	 .close-search {
    top: 2%;
    right: 5%;
}
	 
/* ---------------------------------------------- /*
 * Grids
/* ---------------------------------------------- */

    .grid-2{grid-gap: 0; grid-template-columns: 100%;}

    .grid-item { height: 100%; font-size: 18px; text-align: left; width: 100%;}

    .grid-item h2{ margin: 10px auto; }

    .grid-3{ grid-gap: 45px 0; grid-template-columns: 100% !important;}
     
     .grid-4{ grid-gap: 20px 0; grid-template-columns: 100% !important;}
     
/* ---------------------------------------------- /*
 * Owl Carousel
/* ---------------------------------------------- */
    .owl-nav button{font-size: 30px;}

 
/* ---------------------------------------------- /*
 * Homepage
/* ---------------------------------------------- */

    #home-page .grid-2{padding: 10px 10px 50px;}
    #home-page h2 {padding: 0;}

     
/* ---------------------------------------------- /*
 * Footer
/* ---------------------------------------------- */

    #inner-footer{padding: 20px 20px; margin: 0;}
    #inner-footer .grid-2{grid-gap: 0;	grid-template-columns: auto;}    
    #inner-footer .grid-3{grid-gap: 0;	grid-template-columns: auto;}
    #inner-footer .grid-item{text-align: center;}
    #inner-footer .grid-item.copyright{text-align: center;}
    .follow{text-align: center;}     
    .footer-buttons{position: relative; bottom: initial;  right: initial; padding-top: 20px;}
    .follow .social .fab{font-size: 25px; color: #fff;}
    .copyright { position: relative; padding: 30px 20px 0; }
     
    
}


@media only screen 
	and (max-device-width: 779px) 
  	and (min-device-width: 680px) 
 	and (orientation: portrait),
	only screen 
	and (max-width: 779px) 
 	and (min-width: 680px) 
 { 
    #logo{height: 80px;}
    .inner-banner-text h1 {font-size: 1.8em; margin: 0;}
}

@media only screen 
      and (min-width: 780px) 
      and (max-width: 999px) 
{ 
    .main-menu li{display: block; width: 100%;}
    .inner-banner-text{ font-size: 20px; width: 80%; padding: 20px 20px;}
    .inner-banner-text h1 {font-size: 2em; margin: 0;}
    .grid-3{ display: grid;  grid-gap: 45px 4%;
     grid-template-columns: 48% 48%;}
    #inner-footer .grid-3 {grid-template-columns:  30.66% 30.66% 30.66%;}
    .grid-4{ grid-gap: 20px 0; grid-template-columns: 40% 56% !important;}
    #inner-footer{padding: 20px 10px;}

    }



@media only screen 
 and (min-width: 1000px) and (max-width: 1199px)
 { 
	 
	 /* ----------- Header ----------- */
     .inner-banner-text h1 {font-size: 2em; }
     .inner-banner-text{font-size: 20px;width: 70%;}
     h2{font-size: 1.8em;}
	 
	 /* ----------- Menu ----------- */
	 

	

	  /* ----------- content ----------- */

 
	 /* ----------- Footer ----------- */
	



}

@media only screen 
   and (min-width: 1200px)  and (max-width: 1440px) 
 { 
	 
	 /* ----------- Header ----------- */
     .inner-banner-text h1 {font-size: 2em; }
     .inner-banner-text{font-size: 20px;}
     h2{font-size: 1.8em;}
	 
	 /* ----------- Menu ----------- */
	 
	  /* ----------- content ----------- */
	
     header, #section-content, #banner-text, .grid-2, .grid-3, #inner-footer{max-width: 1200px; }
    

	 /* ----------- Footer ----------- */

}

@media only screen 
   and (min-width: 1441px) 
 { 
	 
	 /* ----------- Header ----------- */
	
	 
	 /* ----------- Menu ----------- */
	 
	  /* ----------- content ----------- */





		 
	 /* ----------- Footer ----------- */
	 
}

@media only screen 
   and (min-width: 1800px) 
 { 
	 
	 /* ----------- Header ----------- */
	
	 
	 /* ----------- Menu ----------- */
	 
	  /* ----------- content ----------- */
	


	 
	 /* ----------- Footer ----------- */
	 



}

@media only screen 
   and (min-width: 2000px) 
 { 
	 
	 /* ----------- Header ----------- */
	
	 
	 /* ----------- Menu ----------- */
	 
	  /* ----------- content ----------- */
	

	 
	 
	 /* ----------- Footer ----------- */
	 



}

/* ----------- iPhone 4 and 4S ----------- */



/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	
}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	  
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	   

}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */



/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
	
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */



/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}

/* ----------- iPhone X ----------- */



/* Portrait */
@media only screen 
  and (device-width: 375px) 
  and (device-height: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
		
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
	
}

/* ----------- Galaxy S4, S5, s6, s7 and Note 3 ----------- */


/* Portrait */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {
	
}

/* Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: landscape) {

}

/* ----------- Galaxy S8 ----------- */



/* Portrait */
@media screen 
  and (device-width: 360px) 
  and (device-height: 740px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: portrait) {

}

/* Landscape */
@media screen 
  and (device-height: 360px) 
  and (device-width: 640px) 
  and (-webkit-device-pixel-ratio: 4) 
  and (orientation: landscape) {

}

/* ----------- tablets ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1)
{

}

@media only screen 
  and (device-width: 1024px) 
  and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2){
	
    .owl-prev{left: -60px;
}

.owl-next{
	right: -60px;
}


}