/*body{

      background-color: #c7e4f3;
}*/
.right_triangle,.right_triangle_next{

    background-color: #e7f4fa;
    position: relative;
    word-break:break-all;
    text-align: justify;
    padding: 10px 0 10px 10px;
    height: auto;
}
.right_triangle:after, .right_triangle:before ,.right_triangle_next:after, .right_triangle_next:before {
    content: "";
    position: absolute;
    left: 100%;
    width: 40px;
    height: 50%;
}
.right_triangle:before {
    top: 0px;
    background: linear-gradient(to top right, white  50%, transparent 51%);
}
.right_triangle:after {
    bottom: 0px;
    background: linear-gradient(to bottom right, white 50%, transparent 51%);
}

.right_triangle_next:before {
    top: 0px;
    background: linear-gradient(to top right, #e7f4fa 50%, transparent 51%)!important;
}
.right_triangle_next:after {
    bottom: 0px;
    background: linear-gradient(to bottom right, #e7f4fa 50%, transparent 51%);
}

#box_1,#box_2,#box_3{
      padding-right:0px;
}

#box_1{
      z-index: 10;
      padding-left: 20px;
}

#box_2{

      z-index: 9;
      padding-left: calc(10% - 81px);
}

#box_3{

      z-index: 8;
      padding-left: calc(10% - 81px);
}

#box_4{

      z-index: 7;
      padding-left: calc(10% - 81px);
      padding-right:10px;
}

.arrow_dest{

      bottom: 5px;

}

.ship_img{
      width: 80%;
}

.logo_box img {
    max-width: 130px;
    margin-left: -1rem;

}

.result_price{

      color: #31abdf;
      font-size:1.4rem ;
      font-weight: 700;
      float: right;
      

}

.price_approx_tabs{

      float: right;
      font-size: .8rem;
}

.from_dest,.to_dest{

      color:#4ba1c3;
      /*font-size: 1.7rem;*/
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
      font-weight: 600;
}

.result-list-tags{

    margin-top: 1rem;
}

.result-tags li span .green {

      justify-content: center;
      display: flex;
      align-items: center;
      float: left;
      border-radius: 25%;
      color: #33CC00;
      margin-right: .1rem;
      margin-top: .25rem;
      padding-left: .5rem;
  }

  .result-tags li span .red {
      justify-content: center;
      display: flex;
      align-items: center;
      float: left;
      border-radius: 25%;
      color: #cc0e00;
      margin-right: .2rem;
      margin-top: .2rem;
      padding-left: .5rem;
  }

.result_day,.result_day-round,.result_day-2,.result_day-3,.result_day-4{

      color:#4ba1c3 ;
      font-weight: 400;
      padding-right:5px;
}


.result_month,.num_date ,.result_month-round ,.num_date-round,
.result_month-2,.num_date-2 ,.result_month-3,.num_date-3
,.result_month-4,.num_date-4{

      color: black;
      font-weight: 400;
      padding:0 5px;
}

.text-left.text-align-left-vessel{

      font-size: .8rem;
      text-overflow: ellipsis;
      white-space: nowrap;
}


.right_triangle_full{


    height: auto;
      padding: 10px 0 10px 10px;
}

.col-12.result-list-tags.text-right{

      text-align:center;
}

.result-list-inline>li {

      padding-left: 0px!important;
      font-size: .9rem;
      display: inline-block;
}

@media (max-width: 991px) and (min-width: 767px){


      .space{

            font-size: 12px;
      }

      .arrow_from_to{

            width: 20px;
      }

      .price_approx_tabs {

            padding-left: calc(100% - 100px);
      }

}

@media (min-width:993px){

      .arrow_mob{

            display: none;
      }
}

@media (min-width:1201px){

      .port-svg{

            display: none;
      }

      .result-list-inline {

            margin-left: -1.2rem;
            display: flex;
            justify-content: center;
      }
}

@media (max-width:992px) and (min-width:992px){
      .price_approx_tabs {
            padding-left: 100px;
      }

}

@media (max-width:992px){

      .from_dest, .to_dest {

            font-size: 1.2rem;
      }

      .col-xs-4.col-sm-5.col-md-5.col-lg-5.to_dest.text-right {
            padding-left: 0;
      }


      .center_triangle { 	
            position: relative;
            height: 320px;
            width: 100%;
      }
      
      .center_triangle:after {
            border-right: solid 120px transparent;
            border-left: solid 120px transparent;
            border-top: solid 50px white;
            transform: translateX(-50%);
            position: absolute;
            z-index: -1;
            content: '';
            top: 94%;
            left: 50%;
            height: 0;
      }

      .center_triangle_next { 	
            position: relative;
            height: 320px;
            width: 100%;
      }
      

      .center_triangle_next:after {
            border-right: solid 120px transparent;
            border-left: solid 120px transparent;
            border-top: solid 50px #e7f4fa;
            transform: translateX(-50%);
            position: absolute;
            z-index: -1;
            content: '';
            top: 94%;
            left: 50%;
            height: 0;
      }

      #box_1,#box_2,#box_3,#box_4 {
            padding: 35px 120px;
            height: auto;
        }

      .result_price {
     
            font-size: 2rem;
            float: right;
      }


      .text-left.text-align-left-vessel {
            font-size: .9rem;
      }
      
      .result-list-tags {
            margin-top:0.5rem;
            font-size: 1.5rem;
      }

      .arrow_from_to{

            display: none;
      }


      .right_triangle:before,.right_triangle_next:before{
            display: none;
      }


      .details_date_left,.details_date_right{

            font-size: 1rem!important;
      }
      

}

@media (max-width:1200px) and (min-width:991px){

      .from_dest, .to_dest {

            font-size: 1.2rem;
      }

      .result-list-inline,  .row.space {

            font-size:1.8rem;
      }

      .text-left.text-align-left-vessel {

            width: 105%;
      }



      .trips_footer{

            width: 953px;
      }



      .center_triangle { 	
            position: relative;
            height: 320px;
            width: 100%;
      }
      

      .center_triangle:after {
            border-right: solid 120px transparent;
            border-left: solid 120px transparent;
            border-top: solid 50px white;
            transform: translateX(-50%);
            position: absolute;
            z-index: -1;
            content: '';
            top: 94%;
            left: 50%;
            height: 0;
      }

      .center_triangle_next { 	
            position: relative;
            height: 320px;
            width: 100%;
      }
      

      .center_triangle_next:after {
            border-right: solid 120px transparent;
            border-left: solid 120px transparent;
            border-top: solid 50px #e7f4fa;
            transform: translateX(-50%);
            position: absolute;
            z-index: -1;
            content: '';
            top: 94%;
            left: 50%;
            height: 0;
      }

      #box_1,#box_2,#box_3,#box_4 {
            padding: 35px 180px;
            height: auto;
        }

      .result_price {
     
            font-size: 2rem;
            float: right;
      }

      .result-list-tags {

            float: right;
            padding-right: 0;
      }

      .text-left.text-align-left-vessel {
            font-size: 1rem;
        }
      
      .result-list-tags {
            margin-top:0.5rem;
      }


      .space{

            font-size: 1.8rem;
      }

      .arrow_from_to{

            display: none;
      }

      img.arrow_mob {

            /*margin-left: -1rem;*/
            max-width: 163px;
            width: 120px;
      }

      .right_triangle:before,.right_triangle_next:before{
            display: none;
      }


      .details_date_left,.details_date_right{

            font-size: 1rem!important;
      }
      
      .arrow_mob {
           display: block;
        }

        .price_approx_tabs {
            font-size: .8rem;
            padding-left: 100px;
        }

}


.price_approx_tabs_btn {
      float: right;
      margin-bottom: -1rem;
      color: white;
      font-size: 1.2rem;
      padding: 9px;
      padding-right: 0px;
  }


.col-7.col-md-6.next-step-button {
      height: inherit;
      max-width: 50%;
}

.details_date_left{

      /* changed on 4-9-2021 display: flex;
      justify-content: flex-start;*/
      display: -webkit-inline-box;
}

.details_date_right{

      display: flex;
      justify-content:flex-end;
      /*font-size: 1.4rem;*/
}


@media (max-width:673px){

      .price_approx_tabs {

            padding-left: 80px;
      }

      .from_dest, .to_dest {

            font-size: 1rem;
      }

      .space {
            font-size: 1.5rem;
      }

      #box_1, #box_2, #box_3, #box_4 {
            padding: 20px 80px;
      }


      .to_dest{

            word-break: normal;
      }

      img.arrow_mob {
            margin: 0;
            width: 100%;
        }


}

@media (min-width:673px) and (max-width:767px){

      .price_approx_tabs {

            padding-left: 80px;
      }

}

@media (max-width:530px){

      #box_1, #box_2, #box_3, #box_4 {
            padding: 20px 35px;
      }

      .price_approx_tabs {

            padding-left:40px;
      }

}

@media (max-width:454px){

      .result_price {
            font-size: 1.7rem;
            float: right;
      }

      .to_dest {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
      }

      .from_dest {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
      }

      .logo_box img {
            margin-left: 0rem!important;
        }


}


@media (max-width:408px){

      .result_price {
            font-size: 1.5rem!important;
            float: right;
      }

      .details_date_left,.details_date_right{

            font-size: 1rem!important;
      }

      #box_1, #box_2, #box_3, #box_4 {
            padding: 35px 15px;
      }

      .col-12.result-list-tags.text-right {
            text-align: center;
            margin-top: .1rem;
            
      }

      .result-list-tags {
            float: none;
        }


      .port-svg {
            display: none;
      }

      /*.price_approx_tabs {

            padding-left:0px;
      }*/

      .result-tags li span {

            font-size: 1rem;
      }

}

.port-svg {
      vertical-align: top;
      width: 20px;
      height: 22px;
}

.btn_style{

      margin-bottom: 10px;
      padding: 10px 25px;
      background-color: #337ab7!important;
}

/* click button */


@media (max-width:767px){

      .port-svg,.to_port{

            display: none!important;
      }

      .result-list-inline {
            /*padding-right: 10px;*/
            margin-right: 2px;
      }

}

#finalPrice,#finalPrice_topay{

      float: none;
      padding:0;
      color:white;
}


@media(min-width: 767px) and (max-width: 1200px){

      .result-list-inline {
   
            float: right;
            margin-top: -1rem;
      }



}

@media (min-width:1441px){

      .price_approx_tabs {

            font-size: .9rem;
      }

      .result-list-inline>li {

            font-size: .9rem;
      }
      .result_price {
            font-size: 1.45rem;
      }

      .from_dest, .to_dest {
            font-size: 1rem;
      }

      .details_date_left,.details_date_right{

            font-size: 1rem!important;
      }

}

@media (max-width:992px) and (min-width:768px){

      img.arrow_mob {

            margin-left: -1rem;
            max-width: 163px;
            width: 120px;
      }

}


.price_approx_tabs,.result-list-inline>li ,.text-left.text-align-left-vessel {
      color: #2c7f9e;
}

@media (min-width:1201px){

      .arrow_from_to {
            width: 44px;
            max-width: 44px;
            margin-left: -.8rem;
      }

      .logo_box img {
            margin-left: -.3rem;
      }

      .col-xl-12 {
            -ms-flex: 0 0 25%;
            flex: 0 0 25%;
            max-width: 25%;
      }

}

@media (min-width:320px) and (max-width:2056px){
      #arrival_time_from_totals,#departure_time_from_totals,
      #arrival_time_from_totals-2,#departure_time_from_totals-2,
      #arrival_time_from_totals-3,#departure_time_from_totals-3,
      #arrival_time_from_totals-4,#departure_time_from_totals-4,
      #arrival_time_to_totals,#departure_time_to_totals {
            color: #084f86;
            font-size: 1.3rem;
      }

      #distance_from_totals,#distance_to_totals,#distance_from_totals-2,#distance_from_totals-3,#distance_from_totals-4 {
            color: #084f86;
            font-size: 1rem;
            margin-top: 1rem;
      }
}

/* new changes 6-10-2021 */

div#box_1 {
      border-top-left-radius: 10px;
      border-bottom-left-radius: 10px;
}

.last_box,div#box_4{

      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
}

@media (max-width:1200px){
      div#box_1 {
            border-radius: 0!important;
            border-top-left-radius: 10px!important;
            border-top-right-radius: 10px!important;
      }

      .last_box,div#box_4{

            border-radius: 0!important;
            border-bottom-right-radius: 10px!important;
            border-bottom-left-radius: 10px!important;
      }

      .col-4.col-xs-4.col-sm-4.col-md-2.col-lg-2.arrow_dest{

            display: flex;
            flex-direction: column;
            align-items: center;
      }
}

.route_section{

      padding-left: 15px;
      padding-right: 15px;
}

.col-12.result-list-tags.text-right{

      padding-left: 0!important;
}

@media (max-width: 345px) and (min-width:320px){
      .price_approx_tabs {
            padding-left: 25px!important;
      }
}

.col-12.col-md-12.pl-2.tripsNextStep {

      padding-left: 15px!important;
}