/*-----------------------------------------------------------------------------------

    Template Name: Driveon - Driving School HTML Template
    Description: Bootstrap HTML Template
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	
    1.   Page Banner Title Area
    2.   Feature Area
	3.   Course Area
	4.   Video Area
	5.   Instructor Area
	6.   FAQ Area
	7.   Call To Action Area
	8.   Contact Area
	9.   Dark Version Style
	
	
-----------------------------------------------------------------------------------*/
/*-------------------------- 
	1. Page Banner Title Area
--------------------------*/
.page-banner-area {
  background-image: url("img/section-bg/page-banner.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover ;
  background-size: cover ;
  padding: 270px 0 150px;
}
.page-banner{}
.page-banner h1 {
  color: #fff;
  display: block;
  font-size: 36px;
  font-weight: 900;
  line-height: 30px;
  margin-bottom: 0;
  text-transform: uppercase;
}
.page-banner.text-left h1 {
  float: left;
}
.page-banner.text-right h1 {
  float: right;
}
.page-banner ul {
  display: inline-block;
  vertical-align: top;
  margin-top: 10px;
}
.page-banner.text-left ul {
  float: right;
}
.page-banner.text-right ul {
  float: left;
}
.page-banner ul li {
  display: block;
  float: left;
  padding: 0 6px;
  position: relative;
}
.page-banner ul li:first-child {
  padding-left: 0;
}
.page-banner ul li:last-child {
  padding-right: 0;
}
.page-banner ul li + li::before {
  color: #fff;
  content: "/";
  display: block;
  left: -3px;
  line-height: 9px;
  overflow: hidden;
  position: absolute;
  top: 0;
}
.page-banner ul li a, .page-banner ul li span {
  color: #fff;
  display: block;
  font-size: 12px;
  line-height: 9px;
  text-transform: uppercase;
}
.page-banner ul li a:hover {
  color: #dec839;
}
.mbYTP_wrapper {
  z-index: -9 !important;
}
/*-------------------------- 
	2. Feature Area
--------------------------*/
.feature-wrapper {}
.feature-left{}
.feature-right{}
/* Feature Image */
.feature-image {
  z-index: 9;
}
/* Single Feature */
.single-feature {
  position: relative;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  z-index: 1;
}
.single-feature:nth-child(1) {
  padding: 16px 0 15px;
}
.single-feature:nth-child(2) {
  padding: 38px 0;
}
.single-feature:nth-child(3) {
  padding: 17px 0 15px;
}
/* Single Feature Hover */
.single-feature:hover {
  background-color: #fff;
}
.single-feature::before {
  background-color: #fff;
  bottom: 0px;
  content: "";
  opacity: 0;
  position: absolute;
  top: 0px;
 
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 50%;
  z-index: -1;
}
.single-feature:hover::before {
  opacity: 1;
  border-left: 0;
}
.feature-left .single-feature::before {
  left: 100%;
}
.feature-right .single-feature::before {
  right: 100%;
}
/* Left Single Feature */
.feature-left .single-feature {
  margin-right: -7px;
}
.feature-left .single-feature:nth-child(2) {
  margin-left: -15px;
  padding-right: 24px;
}
/* Right Single Feature */
.feature-right .single-feature {
  margin-left: -7px;
}
.feature-right .single-feature:nth-child(2) {
  margin-right: -15px;
  padding-left: 24px;
}
/* Featue Icon */
.single-feature .icon {
  display: block;
  margin-top: 19px;
  min-width: 36px;
}
.feature-left .icon {
  float: right;
  margin-left: 29px;
  text-align: left;
}
.feature-right .icon {
  float: left;
  margin-right: 29px;
  text-align: right;
}
.single-feature .icon i {
  color: #dc5e2d;
  font-size: 36px;
  display: block;
}
/* Feature Text */
.single-feature .text{}
.single-feature .text h4 {
  margin-bottom: 9px;
}
.single-feature .text p{}
.margin-2{
  margin-right: 10px;
}
.stick .main-menu nav > ul > li > a{
  color: #000;
}
#instafeed > a{
  display: block;
  width: 100px;
  height: 100px;
  margin: 5px;
  float: left;
  border:1px solid #ddd;
}
#instafeed a img
{
	width: 100%;
	height: 100%;
}
.owl-carousel .owl-item img{
 
}
/*-------------------------- 
	3. Course Area
--------------------------*/
.course-wrapper{}
.course-item {
  background: rgba(0, 0, 0, 0) url("img/shape/course/course-white.png") no-repeat scroll center center ;
  -webkit-background-size: cover ;
  background-size: cover ;
  overflow: hidden;
  padding: 34px 25px 40px;
  position: relative;
  transition: all 2s ease 0s;
  z-index: 1;
}
.course-item i {
  color: #dc5e2d;
  display: inline-block;
  font-size: 48px;
  margin-bottom: 18px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.course-item h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 19px;
  padding-bottom: 19px;
  position: relative;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.course-item h4::before {
  background-color: #b63b26;
  bottom: 0;
  content: "";
  height: 2px;
  left: 50%;
  margin-left: -25px;
  position: absolute;
  width: 50px;
}
.course-item p {
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

/* Course Hover */
.course-item:hover {
  background-image: url("img/shape/course/course-color.png");
  transform: rotate(360deg);
  }
.no-rotate:hover{
  transform: rotate(0deg);

}
.course-item:hover i {
  color: #fff;
}
.course-item:hover h4 {
  color: #fff;
}
.course-item:hover h4::before {
  background-color: #fff;
}
.course-item:hover p {
  color: #fff;
}
.yorm_btn{
  margin: 25px 0;
}
.yorm_btn button{
      background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border: 3px solid black;
    border-radius: 1px 1px;
    width: 200px;
    font-size: 16px;
    bottom: 0;
    line-height: 0;

}
.yorm_btn button:hover{
    background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border: 3px solid #dc5e2d;
    border-radius: 5px 5px;
    width: 200px;
    font-size: 16px;
    bottom: 0;
    line-height: 0;
}

.
/*--------------------------
	4. Video Area
--------------------------*/
.video-area {

  background: rgba(0, 0, 0, 0) url("img/section-bg/video.jpg") repeat scroll 0 0;
  -webkit-background-size: cover;
  background-size: cover;
  padding: 195px 0;
}
.parallax{
  background-image: url("img/section-bg/video.jpg");
 width: 100%;
 min-height: 500px;

  background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallax-overlay:before {
    content: "";
    position: absolute; 
    display: block; 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2; 
    cursor: pointer; 
}
.parallax-yazi {
  position: absolute;
  top: 50%;
  left: 50%;
  
  transform: translate(-50%,-50%);
  z-index: 10;
}
.parallax-yazi h1 { color: #fff; font-size: 36px; z-index: 0; text-align: center;}
.parallax_logolar { width: 100%; }
.parallax-logo { min-height: 300px; background-image: none; background-color: #fff; }
.video-content {}
.video-content a {
  color: #ffffff;
  display: inline-block;

}
.card-form{
  width: 500px;
  border-radius: 10px;
  background: white;
  box-shadow: 0 27px 55px 0 rgba(0, 0, 0, 0.3), 0 17px 17px 0 rgba(0, 0, 0, 0.15);
  }
  
  .form-title{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    font-size: 20px;
    font-weight: bold;
    background: #27ae60;
    border-radius: 10px 10px 0 0;
  }
  
  .form-body{
    padding: 10px;
    }
    .row-form{
      display: flex;
      justify-content: space-around;
      padding: 10px;
      }
      
      input[type="text"]{
        appearance: none;
        width: 100%;
        margin: 0 15px;
        height: 35px;
        padding: 5px 15px;
        border-radius: 5px;
        outline: none;
        border: none;
        background: #e8ebed;
        color: #576366;
        font-size: 14px;
      }
  
  .rule{
    height: 2px;
    background: #e8ebed;
    margin: 0px 35px;
  }
  
  .form-footer{
    margin: 0 25px 15px 25px;
    padding: 15px 10px;
    
    a{
      display: inline-block;
      height: 40px;
      line-height: 40px;
      border: none;
      border-radius: 5px;
      padding: 5px 15px;
      background: #27ae60;
      margin-right: 10px;
      font-size: 14px;
    }
    
    span{
      margin-left: 8px;
    }
  }
  
}





.video-content a:hover {
  color: #dec839;
}
.video-content a i {
  display: block;
  font-size: 60px;
}
.video-content h3 {
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  line-height: 18px;
  margin: 30px 0 0;
  text-transform: uppercase;
}
/*--------------------------
	5. Instructor Area
--------------------------*/
.instructor-details{}
.instructor-name {
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
}
.instructor-title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 20px;
}
.instructor-details p {
  margin-bottom: 17px;
}
.instructor-social{}
.instructor-social a {
  border: 1px solid #aaaaaa;
  color: #aaaaaa;
  display: block;
  float: left;
  height: 35px;
  margin-right: 15px;
  text-align: center;
  width: 35px;
}
.instructor-social a i {
  display: block;
  font-size: 18px;
  line-height: 33px;
}
.instructor-social a:hover {
  background-color: #e8753e;
  border-color: #000;
  color: #fff;
}
.instructor-image {
  margin-top: 74px;
}
.instructor-image img {
  width: 100%;
}
/* Instructor Tab List */
.instructor-tab-list {
  float: left;
  margin-top: -115px;
}
.instructor-tab-list li {
  display: block;
  float: left;
  margin-right: 30px;
  padding-bottom: 12px;
  width: 115px;
}
.instructor-tab-list li:last-child {
  margin-right: 0;
}
.instructor-tab-list li a {
  display: block;
  position: relative;
}
.instructor-tab-list li a::before {
  background-color: #000;
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.instructor-tab-list li a:hover::before, .instructor-tab-list li.active a::before {
  opacity: 0.5;
}
.instructor-tab-list li a::after {
  background-color: #dddddd;
  border-radius: 50%;
  bottom: -12px;
  content: "";
  height: 2px;
  left: 10px;
  opacity: 0;
  position: absolute;
  right: 10px;
}
.instructor-tab-list li a:hover::after, .instructor-tab-list li.active a::after {
  opacity: 1;
}
.instructor-tab-list li a img {
  width: 100%;
}
/*--------------------------
	6. FAQ Area
--------------------------*/
.faq-image {
  margin-top: 75px;
}
.faq-image img {
  width: 100%;
}
.egitimciler{
  background-image: url('../_tema/img/section-bg/testimonial-2.jpg');
}
/*--------------------------
	7. Call To Action Area
--------------------------*/
.cta-area {
  background-color: #dec839;
}
.call-to-action{}
.call-to-action h3 {
  color: #fff;
  display: block;
  float: left;
  font-weight: 600;
  line-height: 36px;
  margin: 0;
  text-transform: uppercase;
}
.call-to-action a {
  float: right;
}
.konu-menu{
      border-bottom: 2px solid #ddd !important;
    border-right: 2px solid #ddd !important;
    border-radius: 0px 25px !important;
}
.konularimiz ul li a{
  padding-left: 7px;
}
.modal-title button span{
  color: #e8753e;
  font-size: 35px;

}
.owl-theme .item img{
   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}
.owl-theme .item img:hover{
  filter: none;
}

/*--------------------------
	8. Contact Area
--------------------------*/
#contact-map {
  height: 530px;
}
.contact-info{margin-top: 35px;}
.contact-info .single-info{}
.contact-info .single-info + .single-info {
  margin-top: 45px;
}
.contact-info .single-info .icon {
  background-color: #dc5e2d;
  border-radius: 2px;
  color: #fff;
  display: block;
  float: left;
  height: 44px;
  margin-left: 10px;
  margin-right: 40px;
  margin-top: 10px;
  text-align: center;
  transform: rotate(45deg);
  width: 44px;
}
.contact-info .single-info .icon i {
  display: block;
  font-size: 24px;
  line-height: 44px;
  transform: rotate(-45deg);
}
.contact-info .single-info .content{}
.contact-info .single-info .content h5 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 11px;
  text-transform: uppercase;
}
.contact-info .single-info .content p{}
.contact-info .single-info .content p a {
  display: block;
  /* margin-left: 94px; */
}
.contact-info .single-info .content p a:hover {
  color: #dc5e2d;
}
/*--------------------------
	9. Dark Version Style
--------------------------*/
.dark-wrapper .bg-white, .dark-wrapper.bg-white {
  background-color: #1e2127;
}
.dark-wrapper .bg-gray, .dark-wrapper.bg-gray {
  background-color: #252830;
}
.dark-wrapper .overlay-white::before, .dark-wrapper.overlay-white::before {
  background-color: #000;
}
.dark-wrapper p, .dark-wrapper span {
  color: #d0d0d0;
}
.dark-wrapper h1, .dark-wrapper h2, .dark-wrapper h3, .dark-wrapper h4,  .dark-wrapper h5, .dark-wrapper h6, .dark-wrapper a {
  color: #fff;
}
.dark-wrapper .section-title::before, .dark-wrapper .section-title::after {
  background-color: #444;
}
/* Course Form */
.dark-wrapper .find-course-form h5 span {
  color: #555555;
}
/* Feature */
.dark-wrapper .single-feature:hover {
  background-color: #1e2127;
}
.dark-wrapper .single-feature::before {
  background-color: #1e2127;
}
/* Funfact */
.dark-wrapper .single-facts i {
  color: #d0d0d0;
}
.dark-wrapper .single-facts h1::before {
  background-color: #d0d0d0;
}
/* Course */
.dark-wrapper .course-item {
  background-image: url("img/shape/course/course-dark.png");
}
/* Gallery */
.dark-wrapper .gallery-filter button::before, .dark-wrapper .gallery-filter button::after {
  background-color: #d0d0d0;
}
.dark-wrapper .gallery-filter button {
  color: #d0d0d0;
}
/* Testimonial */
.dark-wrapper .ts-arrows {
  color: #fff;
}
/* FAQ */
.dark-wrapper .panel-group .panel {
  background-color: #252830;
}
/* Blog */
.dark-wrapper .blog-item .meta p {
  color: #d0d0d0;
}
.dark-wrapper .blog-item .title a {
  color: #fff;
}
.dark-wrapper .category-sidebar ul li a {
  color: #fff;
}
/* Contact */
.dark-wrapper .form .input input[type="text"], .dark-wrapper .form .input input[type="email"], .dark-wrapper .form .input input[type="tel"], .dark-wrapper .form .input input[type="password"], .dark-wrapper .form .input input[type="search"], .dark-wrapper .form .input input[type="url"], .dark-wrapper .form .input textarea {
  color: #fff;
}
/* Other */
.dark-wrapper .pagination ul li a {
  color: #fff;
}
.hero-slide-content h3{
  font-family: 'Pattaya', sans-serif;
}
.hours li{
  color: white;
}
.modal-body input 
{
  margin: 0 ;
  background: #fff;
  border: 1px solid #ccc;


}
.modal-footer button {
     border: 2px solid #000000;
    background: #f4f4f4;
    color: black;

}
.modal-footer button:hover{
    background: #de5f20;
    color: #fff;
    border-radius: 5px 5px;
    border: 2px solid black;

}

.contact-info-box:before {
    background-color: #de5f20;
    border-radius: 50%;
    bottom: 117px;
    content: "";
    height: 2px;
    left: 50%;
    margin-left: -178px;
    max-width: 430px;
    position: absolute;
    width: 100%;
}

.diger { 
width: 100%;
margin-left: 15px; }
.diger_btn { 
 padding: 4px 30px;
    margin-left: 40px;
    background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border: 3px solid black;
    border-radius: 1px 15px;
    width: 180px;
    font-size: 16px;
    bottom: 0;
    line-height: 35px !important;
    float: right;


 }
  .diger_btn:hover{
  background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border:3px solid #dc5e2d;
    border-radius: 5px 5px;
    width: 180px;
    font-size: 16px;
    bottom: 0;
    line-height: 35px !important;
 }

 @media(max-width: 736px){
  .diger a{
    margin-top: 15px;
    margin-bottom: 65px;
    margin-right: 45px;
  }
  .input input[type="email"]{
    padding-left: 15px !important;
  }
  .textarea textarea{
    padding-left: 15px !important;
  }
  .instagram-item{
    width: 24.4444%;
  }
  #scrollUp{
    margin-right: 5px;
  }
  .araclar_btn{
    margin: 155px !important;
  }
  .form .input input[type="submit"]{
    margin-left: 100px !important;
  }
  .contact-info-box:before{
    left: 42% !important;
    bottom: 95px;
  }
  .widget-social{
    padding-left: 80px !important;
  }
  .owl-carousel .owl-item img{
    width: 50% !important;
    margin-left: 100px;

  }



    #video-1 iframe{
      width: 100%;
      height: 350px; 
    }
    .icerik{
      margin: 55px 0 !important;
    }
    #cmt{
      float: right;
      margin-top: -25px;
    }



 }
  @media(max-width:1440px){
    .textarea textarea{
      padding-left: 15px !important;
    }
  }


 @media(max-height:667px){
  #video-1 iframe{
    width: 100%;
    height: 350px !important;
    }
    .trf{
      margin-top: 0 !important;
    }
  
 }
  @media(max-height:736px){
    .trf{
      margin-top: 0!important;
    }
    .araclar_btn{
    margin: 0 !important;
  }
  }
  @media(max-width: 1280px){
    .textarea textarea{
      padding-left: 15px !important;
    }
  }
 

 .egitim-yazi{
  margin-bottom: 54px;
 }
 .araclarimiz { 
width: 100%;
margin-top: 22px;
padding-left: 120px;
 }
.araclar_btn { 
    padding: 4px 30px;
    margin-left: 40px;
    background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border: 2px solid black;
    border-radius: 1px 15px;
 
    font-size: 16px;
    bottom: 0;
    line-height: 35px !important;


 }
 .araclar_btn:hover{
      background-color: #F4F4F0;
    color: #000;
    text-align: center;
    border:3px solid #dc5e2d;
    border-radius: 5px 5px;
    width: 200px;
    font-size: 16px;
    bottom: 0;
    line-height: 35px !important;
 }


 .temp2 {
    background-color: #FEFEFD;

}
.block-content-p30 {
    padding: 30px 0;
    }

    .owl-carousel.owl-loaded {
    display: block;
}
.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 1;
    }
    .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
 }
 .owl-carousel .owl-stage {
    position: relative;
    }

    .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
 }.owl-carousel .owl-item img {
    transform-style: preserve-3d;}
    .refs img {
    filter: grayscale(100);}
.owl-nav i {
    font-size: 26px;
    font-family: "FontAwesome";
    font-weight: 400;
}
.fa-angle-left:before {
    content: "\f104";}
    .owl-carousel .owl-controls .owl-nav .owl-next {
    display: block !important;
    position: absolute;
    right: 5px;
    }


 .parallaz-yazi h1{

  font-family: 'Courgette', cursive !important;
  font-size: 20px;
  color: #fff;
}
.comments{
  background: #f1f1f1;
  padding: 10px 10px;
  color: #000;
  border: 4px solid black; 
  border-radius: 15px 15px;
}
.comment-icon {
  margin-top: 20px;

  position: relative;

}
.input-submit{
 
  margin-top: 50px;
padding: 10px 10px;
color: black;

border-radius: 2px;


}
.sorular-header{
  background-color: #ADB4BE;
}

.trafik-isaretleri { display: none; }
.rotate_active
{
  background-image: url(img/shape/course/course-color.png);
}
.rotate_active.course-item i, .rotate_active.course-item h4,.rotate_active.course-item h4:before  { color: #fff; }

.icerik
{
  margin: 250px 0;
  text-align: center;
} 


.panel-body.konularimiz
{
  padding: 0;
  border-bottom-left-radius: 20px;
}
.konularimiz li {
  padding: 5px;
  text-align: left;
  font-size: 18px;
}
.konularimiz li:not(:last-child)
{
  border-bottom: 1px solid #ddd;
}
.konularimiz li.active
{
  background-color: #de5e23;
}
.konularimiz li.active a
{
  color: #fff;
}
@media(max-width: 768px){

  .video-area .row{
  width: 100%;
  margin-left: 0;
}
}



@media(max-width: 414px){
  .section-title h3{
    font-size: 30px !important;

  }
  .owl-item img{
    margin-right: 0!important;
  }
}
.hakkimizda-resim{
  padding-left: 0px !important;
  padding-bottom: 25px !important;
}


.panel-body p{
  padding-left: 7px;
}