@charset "UTF-8"; /* Alobaidi Slider Style. */ .alobaidi_slider_wrap{ display:block; max-width:768px; margin-right:auto; margin-left:auto; margin-bottom:30px; background-color:#fff; padding:5px; border:1px solid #ddd; font-size:0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; line-height:0 !important; } .alobaidi_slider_wrap:last-child{ margin-bottom:0; } .alobaidi_slider_content{ font-size:0; position:relative; padding-bottom:74%; overflow:hidden; } ul.alobaidi_slider_list{ font-size:0; display:block; margin:0 !important; padding:0 !important; border:none !important; list-style:none !important; list-style-type:none !important; } ul.alobaidi_slider_list li{ position:absolute; top:0; left:0; width:100%; max-height:100%; height:100%; display:none; margin:0 !important; padding:0 !important; border:none !important; font-size:0; list-style:none !important; list-style-type:none !important; } ul.alobaidi_slider_list li:first-child{ display:block; } ul.alobaidi_slider_list li:before, ul.alobaidi_slider_list li:after{ display:none; } ul.alobaidi_slider_list img{ max-width:100% !important; width:100% !important; height:100% !important; margin:0 !important; padding:0 !important; border:none !important; box-sizing: inherit !important; -webkit-box-sizing: inherit !important; -moz-box-sizing: inherit !important; border-radius:0 !important; -moz-border-radius:0 !important; -webkit-border-radius:0 !important; -o-border-radius:0 !important; -ms-border-radius:0 !important; box-shadow:none !important; -webkit-box-shadow:none !important; -moz-box-shadow:none !important; -o-box-shadow:none !important; -ms-box-shadow:none !important; opacity:1 !important; } ul.alobaidi_slider_list img:hover{ opacity:1 !important; } .alobaidi_slider_caption{ position:absolute; bottom:0; width:100%; color:#fff !important; font-size:15px; line-height:1.5 !important; text-align:center; padding:1.45% 7% !important; background-color:rgba(0, 0, 0, 0.75) !important; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; margin:0 !important; border:none !important; text-shadow:none !important; } .alobaidi_slider_empty{ background-color:#E71414 !important; } ul.alobaidi_slider_list li a{ margin:0 !important; padding:0 !important; border:none !important; text-shadow:none !important; text-decoration:none !important; color:#fff !important; background:none !important; background-color:transparent !important; font-size:0; } ul.alobaidi_slider_list li .alobaidi_slider_caption a{ font-size:15px; } .alobaidi_slider_next{ position:absolute; top:47.6%; right:0; cursor:pointer; transition:all ease-in-out 0.3s; -webkit-transition:all ease-in-out 0.3s; -o-transition:all ease-in-out 0.3s; -moz-transition:all ease-in-out 0.3s; -ms-transition:all ease-in-out 0.3s; font-size:0; background:url('../images/alobaidi_slider_next.png') no-repeat; width:25px; height:25px; background-size:25px 25px!important; -webkit-background-size:25px 25px!important; -moz-background-size:25px 25px!important; -o-background-size:25px 25px!important; opacity:0; } .alobaidi_slider_prev{ position:absolute; top:47.6%; left:0; cursor:pointer; transition:all ease-in-out 0.3s; -webkit-transition:all ease-in-out 0.3s; -o-transition:all ease-in-out 0.3s; -moz-transition:all ease-in-out 0.3s; -ms-transition:all ease-in-out 0.3s; font-size:0; background:url('../images/alobaidi_slider_prev.png') no-repeat; width:25px; height:25px; background-size:25px 25px!important; -webkit-background-size:25px 25px!important; -moz-background-size:25px 25px!important; -o-background-size:25px 25px!important; opacity:0; } .alobaidi_slider_wrap:hover .alobaidi_slider_next{ opacity:0.75; right:15px; } .alobaidi_slider_wrap:hover .alobaidi_slider_prev{ opacity:0.75; left:15px; } .alobaidi_slider_next:hover, .alobaidi_slider_prev:hover{ opacity:0.9 !important; } /* video */ .alobaidi_slider_content iframe{ border:none !important; padding:0 !important; margin:0 !important; display:block; width:100% !important; max-width:100% !important; min-width:100% !important; height:100% !important; max-height:100% !important; min-height:100% !important; font-size:0; } /* if touch devices */ .alobaidi_slider_next.is_touch, .alobaidi_slider_prev.is_touch{ opacity:0.75 !important; width:50px; height:100%; top:0; } .alobaidi_slider_next.is_touch{ right:0 !important; background:url('../images/alobaidi_slider_next.png') no-repeat 50%; } .alobaidi_slider_prev.is_touch{ left:0 !important; background:url('../images/alobaidi_slider_prev.png') no-repeat 50%; } /* animation */ .alobaidi_slider_wrap .animated{ -webkit-animation-duration: 0.5s !important; animation-duration: 0.5s !important; -webkit-animation-fill-mode: both !important; animation-fill-mode: both !important; } @-webkit-keyframes fadeInRight_alobaidi_slider { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight_alobaidi_slider { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .alobaidi_slider_wrap .fadeInRight { -webkit-animation-name: fadeInRight_alobaidi_slider !important; animation-name: fadeInRight_alobaidi_slider !important; } @-webkit-keyframes fadeInLeft_alobaidi_slider { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft_alobaidi_slider { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .alobaidi_slider_wrap .fadeInLeft { -webkit-animation-name: fadeInLeft_alobaidi_slider !important; animation-name: fadeInLeft_alobaidi_slider !important; } @media all and (min-width: 1367px){ .alobaidi_slider_content{ padding-bottom:0; height:534px; } } /* responsive */ @media all and (max-width: 1024px) and (min-width: 800px){ .alobaidi_slider_content.is_touch{ padding-bottom:0; height:444px !important; } } @media all and (max-width: 800px) and (min-width: 768px){ .alobaidi_slider_content.is_touch{ padding-bottom:0; height:350px !important; } } @media all and (max-width: 768px) and (min-width: 480px){ .alobaidi_slider_content{ padding-bottom:0; height:334px !important; } } @media all and (max-width: 480px) and (min-width: 320px){ .alobaidi_slider_content{ padding-bottom:0; height:320px !important; } } @media all and (max-width: 320px) and (min-width: 220px){ .alobaidi_slider_content{ padding-bottom:0; height:220px !important; } }