@font-face {
    font-family: 'coolve';
    src: url("../font/coolvetica_rg.otf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
    outline: 0;
    font-family: coolve, Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}
.headerContainer{
    display: flex;
    margin:0 auto;
    width: 1180px;
    flex-wrap: wrap;
}
.headerTop{
    display: flex;
    width: 100%;
    height: 68px;
    background-color:#574F7D;
    border-bottom:6px solid #FFDD00;

}
.headerTop .logo{
   height:54px;
}
.headerTop .logo .logoSelf{
    width: 242px;
    text-align: center;
   font-size:41px;
   color:#FFFFFF;
 }
 .headerTop .logo .slogan{
    width: 164px;
    text-align: center;
    position: relative;
    bottom:5px;
    font-size:12px;
    color:#FFDD00;

  }
.headerTop .menu{
    display: flex;
    width: 100%;
    justify-content: flex-end;
    margin-right:3px;
}
.headerTop .menu ul{
    display: flex;
    align-items: center;
    color:#FFFFFF;
    font-size:20px;
}
.headerTop .menu ul li a{
    color:#FFFFFF;

}
.headerTop .menu ul li{
    font-size:18px;
    margin-right:18px;
}
.headerTop .menu ul li.active{
    border:1px solid #000;
    color:#574F7D;
    background-color: #FFFFFF;
    padding:3px 12px 3px 12px;
}
.headerTop .menu ul li.active a{
    color:#574F7D;
}
.headerTop .registerLogin{
    display: flex;
}
.headerTop .registerLogin ul{
    display: flex;
    align-items: center;
}
.headerTop .registerLogin ul li{
    margin-right: 7px;
    width:105px;
    padding:3px 12px 3px 12px;
    background-color:#DC3545;
    color:#FFFFFF;
    font-size:20px;
}
.headerTop .registerLogin ul li a{
    color:#FFFFFF;
}
.headerBottom{
    display: flex;
    width: 100%;
    /*height: 48px;*/
    padding:6px;
    background-color:#171A21;
    justify-content: space-between;
    align-items: center;
    flex-wrap:wrap;
}
.headerBottom .bottomMenu{
    margin-left:21px;
}
.headerBottom .bottomMenu ul{
    display: flex;
    flex-wrap: wrap;

}
.headerBottom .bottomMenu ul li{
    color:#FFFFFF;
    margin-right:17px;
    padding:3px 12px 3px 12px;
}
.headerBottom .bottomMenu ul li a{
    color:#FFFFFF;
}
.headerBottom .bottomMenu ul li.active{
    border:1px solid #000;
    color:#574F7D;
    background-color: #FFFFFF;
    padding:3px 12px 3px 12px;

}
.headerBottom .bottomMenu ul li.active a{
    color:#574F7D;
}
.headerBottom .search{
    margin-right:4px;
}
.headerBottom .search input[type="text"]{
    height: 28px;
    width: 159px;
    padding:5px;
}
.headerBottom .search input[type="submit"]{
    border:0px;
    outline:0px;
    height: 30px;
    width: 30px;
    background-color: transparent;
    background-image: url("../images/search-26230.svg");
    vertical-align: middle;
    cursor: pointer;
}
.mainContainer{

    margin:0 auto;
    height: auto;
    width:1180px;
    background-color:#222731;
    padding-bottom:128px;
}
.mainContainer .popularMovieText{
    display: inline-block;
    margin-top:30px;
    height:46px;
    background-color:#574F7D;
    color:#FFFFFF;
    font-size:20px;
    padding:11px 8px 11px 8px;
}
.mainContainer .popularMovieContainer{
    position: relative;
    border-top:5px solid #574F7D;
    padding:43px 22px 43px 22px;
    background-color:#171A21;
    border-bottom:5px solid #574F7D;
    height:388px;


}
.mainContainer .popularMovieContainer .prevButton{
    position: absolute;
    top:45%;
    left:0px;
    z-index: 9;
    cursor: pointer;
}
.mainContainer .popularMovieContainer .nextButton{
    position: absolute;
    top:45%;
    right:0px;
    z-index: 9;
    cursor: pointer;
}
.mainContainer .popularMovieContainer ul{
    display: flex;
}
.mainContainer .popularMovieContainer ul li{
    position: relative;
    margin-right: 40px;
    width:189px;
    height: 288px;
}
.mainContainer .popularMovieContainer .movieImage{
    box-shadow:17px -9px 0px 0px #574F7D ;
}
.mainContainer .popularMovieContainer .movieDetails{
    height: 59px;
    padding:8px 8px 8px 8px;
    width: 100%;
    position: absolute;
    bottom:0px;
    background-color:rgb(80, 80,80,70%);


}
.mainContainer .popularMovieContainer .movieDetails .movieName{
    font-size: 17px;
    color: #FFFFFF;
    width: 183px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
}
.mainContainer .popularMovieContainer .movieDetails .dateImdb{
   display: flex;
   justify-content: space-between;

}
.mainContainer .popularMovieContainer .movieDetails .dateImdb .date{
   color:#BE212A;
   font-size:16px;

 }
.mainContainer .popularMovieContainer .movieDetails .dateImdb .imdb{
    color:#F29D08;
    font-size:16px;

}
.mainContainer .comingSoonMoviesText{
    display: inline-block;
    margin-top:30px;
    height:46px;
    background-color:#574F7D;
    color:#FFFFFF;
    font-size:20px;
    padding:11px 8px 11px 8px;
}
.mainContainer .comingSoonMoviesContainer{
    border-top:5px solid #574F7D;
    padding:20px 20px 13px 16px;
    background-color:#171A21;
    border-bottom:5px solid #574F7D;
}
.mainContainer .comingSoonMoviesContainer ul{
    display: flex;
}
.mainContainer .comingSoonMoviesContainer ul li {
    position: relative;
    margin-right: 20px;
}
.mainContainer .comingSoonMoviesContainer ul li figure img{
    width: 95px;
    height: 95px;
    border:5px solid #DC3545;
    border-radius: 50%;
    object-fit:fill;
}
.mainContainer .comingSoonMoviesContainer ul li .date{
    width: 70px;
    height: 18px;
    background-color:#DD3444;
    text-align: center;
    position: absolute;
    bottom:21px;
    right:12px;
    color:#FFFFFF;
    font-size:15px;
}
.mainContainer .comingSoonMoviesContainer ul li .movieName{
    width:90px;

    text-align:center;
    color:#FFFFFF;
}
.mainContainer .comingSoonMoviesContainer ul li .movieName h2{
    font-size:15px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: normal;
}
.mainContainer .movieAndSideBar{
    display: flex;
}
.mainContainer .movieListContainerMain{
    width:808px;
}
.mainContainer .movieListContainerMain .movieListTab{
    margin-top:39px;
    background-color:#171A21;
    padding:5px 19px 11px 19px;
    border-bottom:5px solid #574F7D;
}
.mainContainer .movieListContainerMain .movieListTab ul{
    display: flex;
}
.mainContainer .movieListContainerMain .movieListTab ul li{
    display: inline-block;
    background-color:#574F7D;
    padding:3px 7px 3px 7px;
    color:#FFFFFF;
    font-size:20px;
    margin-right:7px;
}
.mainContainer .movieListContainerMain .movieListContainer{
    padding-left:18px;
    padding-top:15px;
    padding-right:0px;
    background-color:#171A21;
}
.mainContainer .movieListContainerMain .movieListContainer ul.movieList{
    display: flex;
    flex-wrap: wrap;
}
.mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie{
    position: relative;
    width:22.5%;
    height:286px;
    margin-right:3%;
    margin-bottom:13px;
}
.mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie:nth-child(4n){

    margin-right: 0px;
}
.mainContainer .movieListContainerMain .movieListContainer figure img{
    width:100%;
    height:286px;
   box-shadow:-7px -7px 0px 0px #574F7D, -7px 0px 0px 0px #574F7D ;
}
.mainContainer .movieListContainerMain .movieListContainer .movieDetails {
    width: 100%;
    padding:4px;
    display: inline-block;
    background-color: rgb(0, 0, 0,75%);
    position: absolute;
    bottom:0px;
}
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieName h2 {
   font-weight: normal;
   font-size:15px;
   color:#FFFFFF;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width:150px;
}
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieName h2 a{
    color:#FFFFFF;
 }
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .dateImdb {
 display: flex;
 }
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .date {
    color:#FFFFFF;
    margin-right:24px;
    font-size:15px;
}
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .Imdb {
    color:#F29D08;
    margin-right:24px;
    font-size:15px;
    position:relative;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .Imdb span{
    width: 15px;
    height: 15px;
    background-image: url("../images/star.svg");
    position: absolute;
    right:18px;
    top:1px;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .ccFlag{
    display: flex;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .dateCcFlag{
    display: flex;
    justify-content: space-between;
    position: relative;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .dateCcFlag .ccFlag .cc{
    background-image: url("../images/cc.svg");
    width: 20px;
    height: 20px;
    position: absolute;
    right:20px;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .dateCcFlag .ccFlag .flag{
    background-image: url("../images/flag.svg");
    width: 15px;
    height: 15px;
    background-size: 15px;
    position: absolute;
    right:0px;
    top:2px;

 }
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieGenre{
    width:155px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieGenre ul{
    display: flex;
 }
 .mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieGenre ul li{
    background-color: #574F7D;
    font-size:12px;
    margin-right:5px;
    padding:1px;
    margin-top:3px;
}
.mainContainer .movieListContainerMain .movieListContainer .movieDetails .movieGenre ul li a{
    background-color: #574F7D;
    color:#ffffff;
}
.mainContainer .movieAndSideBar .sideBar{
    margin-top:39px;
    margin-left:10.5px;
    width: 362px;
}
.mainContainer .movieAndSideBar .sideBar .sideBarTitle{
    display: inline-block;
    height: 40px;
    width: 253px;
    background-color:#574F7D;
    padding:11px 20px 11px 20px;
    color:#FFFFFF;
    font-size:20px;
}
.mainContainer .movieAndSideBar .sideBar .sideBarContent{
    border-top:5px solid #574F7D;
    background-color:#171A21;
    padding:20px 10px 20px 10px;
    height:351px;
}
.mainContainer .movieAndSideBar .sideBar .sideBarContent .movieSearchContent{
    height:256px;
}
.mainContainer .movieAndSideBar .sideBar .sideBarContent .buttons{
   display: flex;
   justify-content: space-between;
}
.mainContainer .movieAndSideBar .sideBar .sideBarContent .searchButton{
    padding:13px 13px 13px 13px;
    background-color:#DC3545;
    font-size:20px;
    color:#FFFFFF;
    width:130px;
    text-align: center;
    border:none;
    outline:none;
    cursor:pointer;
}

.mainContainer .movieAndSideBar .sideBar .sideBarContent .resetButton{
    padding:13px 13px 13px 13px;
    background-color:#574F7D;
    font-size:20px;
    color:#FFFFFF;
    width:130px;
    text-align: center;
    border:none;
    outline:none;
    cursor:pointer;
}
.mainContainer .movieAndSideBar .sideBar .movieCategories {
    margin-top:39px;

}
.mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesTitle {
    display: inline-block;
    height: 40px;
    width: 253px;
    background-color:#574F7D;
    padding:11px 20px 11px 20px;
    color:#FFFFFF;
    font-size:20px;
}
.mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent {
    border-top:5px solid #574F7D;
    background-color:#171A21;
    padding:23px 0px 20px 10px;

}
.mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent ul{
   display: flex;
   flex-wrap: wrap;
}
.mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent li{
    width:161px;
    height: 31px;
    background-color:#574F7D;
    padding:5px;
    margin-right:20px;
    margin-bottom:9px;
    color:#FFFFFF;
 }
 .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent li:nth-child(2n){
    margin-right:0px;
 }
 .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent h2{
    font-weight: normal;
    font-size:16px;
 }
 .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent h2 a{
    color:#FFFFFF;
 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed {
    margin-top:39px;
 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedTitle {
    display: inline-block;
    height: 40px;
    width: 253px;
    background-color:#574F7D;
    padding:11px 19px 11px 20px;
    color:#FFFFFF;
    font-size:20px;
 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent {
    border-top:5px solid #574F7D;
    background-color:#171A21;

 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li {
   border-bottom:3px solid #FFDD00;
 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li:last-child {
    border-bottom:0px;
}
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer{
    display: flex;
    height:100px;
}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .number{
    width:35px;
    background-color:#574F7D;
    padding:35px 26px 35px 20px;
    color:#FFFFFF;
    font-size:20px;

}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content {
   display: flex;
   padding:10px 10px 2px 10px;
   height: 80px;
}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content figure img {
    width:65px;
    height: 80px;
    border-radius: 10px;
    margin-right:10px;

}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails .contentTitle{
   font-size:20px;
   color:#FFFFFF;
   width: 220px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails .contentTitle a{

    color:#FFFFFF;

 }
.mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails .contentDetails{
    position: relative;
    color:#F29D08;
    font-size:20px;
    margin-left:18px;
 }
 .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails .contentDetails::before{
    content:"";
    background-image: url("../images/star.svg") ;
    background-repeat: no-repeat;
    position: absolute;
    top:5px;
    left:-18px;
    width:25px;
    height: 25px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments{
    margin-top:39px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsTitle{
    display: inline-block;
    height: 40px;
    width: 253px;
    background-color:#574F7D;
    padding:11px 19px 11px 20px;
    color:#FFFFFF;
    font-size:20px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent{
    border-top:5px solid #574F7D;
    background-color:#171A21;

 }

 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li{
    border-bottom:3px solid #FFDD00;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li:last-child{
    border-bottom:0px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li .commentContainer{
    padding:10px 20px 10px 20px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li .commentContainer .movieTitle{
   color:#F29D08;
   font-size:20px;
   margin-bottom:8px;
 }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li .commentContainer .movieTitle a{
    color:#F29D08;

  }
 .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li .commentContainer .comment{
    color:#FFFFFF;
    font-size:15px;
    margin-bottom:8px;
  }
  .mainContainer .movieAndSideBar .sideBar .lastComments .lastCommentsContent ul li .commentContainer .userName{
    display: inline-block;
    color:#FFFFFF;
    font-size:15px;
    padding:4px 12px 4px 12px;
    background-color:#574F7D;
  }
  footer{
    width:1180px;
    margin:0px auto;
    background-color:#171A21;

  }
  footer .footer{
    display: flex;
    width:95%;
    margin:0px auto;
    padding:22px 0px;
    border-bottom:3px solid #FFDD00;
    height:267px;
  }
  footer .footer .logoSlogan{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding:54px 82px 82px 54px;
    border-right:3px solid #FFDD00;
    width:298px;
    height:220px;
  }
footer .footer .logoSlogan .logo{
    font-size:45px;
    color:#FFFFFF;
 }
 footer .footer .logoSlogan .slogan{
    font-size:15px;
    color:#FFDD00;
 }
footer .footer .footerText{
    padding:33px 38px 33px 40px;
    font-size:19px;
    color:#FFFFFF;
}
footer .copyright{
    width:95%;
    margin:0px auto;
    padding:12px 0px;
    color:#FFFFFF;
    font-size:18px;
}
.headerTop .menu .userLogged{
    width:185px;
    display: flex;
    justify-content: end;
    position: relative;
    align-items: center;
}
.headerTop .menu .userLogged .path
{
    margin-left:5px;
    margin-top:25px;

}
.headerTop .menu .userLogged .openerMenu
{
    display: none;
    width:200px;
    background-color:#574F7D;
    border-left:6px solid #FFDD00;
    border-bottom:6px solid #FFDD00;
    position: absolute;
    top:62px;
    left:-12px;
    z-index: 9999999;
}
.headerTop .menu .userLogged  .avatarPath .avatar
{
    height: 45px;
    width: 45px;

}
.headerTop .menu .userLogged  .avatarPath .avatar img
{
    border:2px solid #FFDD00;
    border-radius: 50%;
    width:45px;
    height: 45px;
}
.headerTop .menu .userLogged  .avatarPath .avatar img:hover
{
    border:2px solid #FFDD00;
    border-radius: 0;
}
.headerTop .menu .userLogged  .avatarPath
{
    display: flex;
}
.headerTop .menu .userLogged .openerMenu ul
{
    display: block;
    padding-bottom:4px;
}
.headerTop .menu .userLogged .openerMenu ul li
{
    margin-left:15px;
    border-top:2px solid #FFDD00;
    background-color:#222731;
    font-size:16px;
    text-align: center;
    margin-bottom:4px;
}
.headerTop .menu .userLogged .openerMenu ul li:last-child
{
    color:#B72240;
    margin-bottom:0px;
}
.watchContainer{
    width:1180px;
    margin:0 auto;
    background-color:#222731;
    padding:30px 20px 30px 20px;

}
.watchContainer .movieBar{
    background-color:#574F7D;
    padding:10px;
}
.watchContainer .movieBar h2{
    color:#FFFFFF;
    font-weight: normal;
    font-size:20px;
}
.watchContainer .selectLanguage{
    display: flex;
    font-size:20px;
    color:#FFFFFF;
    margin-top:10px;
}
.watchContainer .selectLanguage .active{
    background-color:#171A21;
    border-radius: 15px 15px 0px 0px;
}
.watchContainer .selectLanguage .trSubtitle {
    padding:10px 8px 10px 8px;
    margin-right:12px;

}
.watchContainer .selectLanguage .trDubbing {
    padding:10px 8px 10px 8px;
    cursor:pointer;
}
.watchContainer .selectLanguage .trSubtitle img{
    height: 18px;
    width: 18px;
    vertical-align: middle;
}
.watchContainer .selectLanguage .trDubbing img{
    height: 18px;
    width: 18px;
    vertical-align: middle;
}
.watchContainer .selectPlayers {
   padding:10px;
   background-color:#171A21;
}
.watchContainer .selectPlayers ul{
    display:flex;
 }
 .watchContainer .selectPlayers ul li{
    padding:5px;
    background-color: #574F7D;
    margin-right:10px;
    color:#FFFFFF;
 }
 .watchContainer .selectPlayers ul li.active{
    background-color: #FFFFFF ;
    color:#574F7D;
 }
 .watchContainer .player{
    height: 500px;
    width: 100%;
    margin-top:14px;
 }
 .watchContainer .player iframe{
    width: 100% !important;
    height: 500px;
 }
 .watchContainer .movieSection{
  margin-top:30px;
  padding:20px;
  background-color:#171A21;
 }
 .watchContainer .movieSection .movieInfoContainer{
    display: flex;
}
.watchContainer .movieSection .movieInfoContainer .moviePoster{
    margin-right:20px;
    width:230px;
}
.watchContainer .movieSection .movieInfoContainer .moviePoster .moviePosterButton{
   padding: 6px;
   text-align: center;
   background-color: #FFFFFF;
   color:#574F7D;
   margin-bottom:10px;
   font-size:20px;
}
.watchContainer .movieSection .movieInfoContainer .moviePoster figure img{
    width: 230px;
    height: 323.53px;
    margin-bottom:17px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .movieTitle{
    display: inline-block;
    background-color:#574F7D;
    padding:8px 10px 8px 10px;
    margin-bottom:10px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .movieTitle h2{
    font-size:20px;
    font-weight: normal;
    color:#FFFFFF;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo {
    font-size:20px;
    font-weight: normal;
    color:#FFFFFF;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .imdb{
    font-size:20px;
    position: relative;
    margin-left:30px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .imdb::before{
    content:'';
    background-image: url('../images/pngwing.com.svg');
    background-repeat: no-repeat;
    left:-32px;
    top:-5px;
    position: absolute;
    width:30px;
    height:30px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .textTitle{
    font-size:20px;
    color:#574F7D;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .textContent{
    font-size:20px;
    color:#FFFFFF;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .textContent a{
    color:#FFFFFF;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo ul li{
    border-bottom:3px solid #DC3545;
    padding:10px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo ul li:last-child{
    border-bottom:0px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .movieDescription{
    height:200px;
    overflow-y: scroll;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo ::-webkit-scrollbar{
    width:10px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo ::-webkit-scrollbar-thumb{
    background-color:#F29D08;
    border-radius: 50px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo ::-webkit-scrollbar-track{
    background: #DC3545;
    border-radius: 50px;
}
.watchContainer .movieSection .movieInfoContainer .movieInfo .movieDescription h2{
    font-weight: normal;
    font-size:16px;
    line-height: 22px;
}






.otherMovieContainer{
    width:1180px;
    margin:0 auto;
    background-color:#222731;
}
.otherMovieContainer .popularMovieText{
    display: inline-block;
    margin-top:30px;
    height:46px;
    background-color:#574F7D;
    color:#FFFFFF;
    font-size:20px;
    padding:11px 8px 11px 8px;
}
.otherMovieContainer .popularMovieContainer{
    border-top:5px solid #574F7D;
    padding:43px 40px 43px 22px;
    background-color:#171A21;
    border-bottom:5px solid #574F7D;
}
.otherMovieContainer .popularMovieContainer ul{
    display: flex;
}
.otherMovieContainer .popularMovieContainer ul li{
    position: relative;
    margin-right: 40px;
    width:189px;
    height: 288px;
}
.otherMovieContainer .popularMovieContainer .movieImage{
    box-shadow:17px -9px 0px 0px #574F7D ;
}
.otherMovieContainer .popularMovieContainer .movieImage figure img{
    width:189px;
    height: 288px;
}
.otherMovieContainer .popularMovieContainer .movieDetails{
    height: 59px;
    padding:8px 8px 8px 8px;
    width: 100%;
    position: absolute;
    bottom:0px;
    background-color:rgb(80, 80,80,70%);


}
.otherMovieContainer .popularMovieContainer .movieDetails .movieName{
    font-size:17px;
    color:#FFFFFF;
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
    width:183px;
}
.otherMovieContainer .popularMovieContainer .movieDetails .dateImdb{
   display: flex;
   justify-content: space-between;
}
.otherMovieContainer .popularMovieContainer .movieDetails .dateImdb .date{
   color:#BE212A;
   font-size:16px;

 }
 .otherMovieContainer .popularMovieContainer .movieDetails .dateImdb .imdb{
    color:#F29D08;
    font-size:16px;

}
.watchCommentContainer{
    width:1180px;
    margin:0 auto;
    background-color:#222731;
    padding:30px 20px 30px 20px;
}
.watchCommentContainer .commentTitle{
    display: inline-block;
    padding:10px 10px 5px 10px;
    background-color:#574F7D;
    color:#FFFFFF;
    font-size:20px;
}
.watchCommentContainer .movieComments{
    border-top:5px solid #574F7D;
    padding:20px;
    background-color:#171A21;
}
.watchCommentContainer .movieComments .formContent{
    display: flex;
}
.watchCommentContainer .movieComments .formContent .formAvatar {
    margin-right:20px;
}
.watchCommentContainer .movieComments .formContent .formAvatar figure img{
    width:45px;
    height:45px;
}
.watchCommentContainer .movieComments .formContent .formElements{
    width:100%;

    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.45);

}
.watchCommentContainer .movieComments .formContent .formElements textarea{
    display: block;
    width:100%;
    resize: none;
    height: 133px;
    padding:10px;
    background-color:#574F7D;
    color:rgb(255, 255,255,0.5);
    border:0;
    font-size:16px;
}
.watchCommentContainer .movieComments .formContent .formElements textarea::placeholder{
   font-size:16px;
}
.watchCommentContainer .movieComments .formContent .formElements  input[type="text"]{
    width:350px;
    padding:5px;
    background-color:#574F7D;
    display: inline-block;
    border:0;
    outline: 0;
    color:rgb(255, 255,255,0.5);
 }
 .watchCommentContainer .movieComments .formContent .formElements  input[type="text"]::placeholder{
    color:rgb(255, 255,255);
    font-size:16px;
 }
 .watchCommentContainer .movieComments .formContent .formElements span{
    display:inline-block;
    color:#FFFFFF;
    background-color:#574F7D;
    padding:3px;
    width:120px;

 }
 .watchCommentContainer .movieComments .formContent .formElements  input[type="button"]{
    height:29px;
    width:180px;
    background-color:#171A21;
    border:none;
    outline:none;
    color:#FFFFFF;
    font-size:16px;
 }
 .watchCommentContainer .movieComments .formContent .formElements  input[type="checkbox"]{
    height:20px;
    width: 20px;
    vertical-align: bottom;
    border:none;
    outline: none;

 }
 .watchCommentContainer .movieComments .movieCommentList{
    margin-top:28px;

 }
 .watchCommentContainer .movieComments .movieCommentList ul li{
    display: flex;
    border-bottom:3px solid #574F7D;
    padding-bottom:10px;
    margin-bottom:20px;
 }
 .watchCommentContainer .movieComments .movieCommentList ul li:last-child{
    border-bottom:none;
    margin-bottom:0px;
 }
 .watchCommentContainer .movieComments .movieCommentList ul li .commentAvatar figure img{
    height:45px;
    width: 45px;
    margin-right:30px;
 }
 .watchCommentContainer .movieComments .movieCommentList ul li .commentText {
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
 .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentNameDate{
   display: flex;
   justify-content: space-between;
   vertical-align: bottom;
   color:#DC3545;

 }
 .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentContent{
    color:rgb(255, 255, 255,.5);
   margin-top:10px;
  }

.mainContainer .movieAndSideBar .categoryListMain{
    width:808px;
    margin-top:39px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListTitle{
    padding:11px 20px 11px 20px;
    display: inline-block;
    background-color:#574F7D;
    color:#FFFFFF;
}

.mainContainer .movieAndSideBar .categoryListMain .categoryListContent{
    padding:23px 10px 23px 19px;
    border-top:5px solid #574F7D;
    background-color:#171A21;
}


.mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList{
    display: flex;
    flex-wrap: wrap;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie{
    position: relative;
    width:22.5%;
    height:286px;
    margin-right:3%;
    margin-bottom:13px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie:nth-child(4n){

    margin-right: 0px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent figure img{
    width:100%;
    height:286px;
   box-shadow:-7px -7px 0px 0px #574F7D, -7px 0px 0px 0px #574F7D ;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails {
    width: 100%;
    padding:4px;
    display: inline-block;
    background-color: rgb(0, 0, 0,75%);
    position: absolute;
    bottom:0px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieName h2 {
   font-weight: normal;
   font-size:15px;
   color:#FFFFFF;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width:150px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieName h2 a{
    color:#FFFFFF;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .dateImdb {
 display: flex;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .date {
    color:#FFFFFF;
    margin-right:24px;
    font-size:15px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .Imdb {
    color:#F29D08;
    margin-right:24px;
    font-size:15px;
    position:relative;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .Imdb span{
    width: 15px;
    height: 15px;
    background-image: url("../images/star.svg");
    position: absolute;
    right:19px;
    top:1px;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .ccFlag{
    display: flex;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .dateCcFlag{
    display: flex;
    justify-content: space-between;
    position: relative;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .dateCcFlag .ccFlag .cc{
    background-image: url("../images/cc.svg");
    width: 20px;
    height: 20px;
    position: absolute;
    right:20px;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .dateCcFlag .ccFlag .flag{
    background-image: url("../images/flag.svg");
    width: 15px;
    height: 15px;
    background-size: 15px;
    position: absolute;
    right:0px;
    top:2px;

 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieGenre{
    width:155px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieGenre ul{
    display: flex;
 }
 .mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieGenre ul li{
    background-color: #574F7D;
    font-size:12px;
    margin-right:5px;
    padding:1px;
    margin-top:3px;
}
.mainContainer .movieAndSideBar .categoryListMain .categoryListContent .movieDetails .movieGenre ul li a{
    background-color: #574F7D;
    color:#ffffff;
}
.mainContainer .movieAndSideBar .categoryListMain .sayfalama {
    display: flex;
    justify-content: center;
    margin-top:42px;

}
.mainContainer .movieAndSideBar .categoryListMain .sayfalama ul{
    display: flex;
}
.mainContainer .movieAndSideBar .categoryListMain .sayfalama ul li{
    margin-right:11px;
    font-size:16px;
    background-color:#574F7D;
    padding: 7px 10px;
    color:#FFFFFF;
}
.mainContainer .movieAndSideBar .categoryListMain .sayfalama ul li.active{
    margin-right:11px;
    font-size:16px;
    background-color:#FFFFFF;
    padding: 7px 10px;
    color:#574F7D;
}
.registerModal,.logInModal{
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    position: fixed;
    z-index: 9999999;
    top:0%;
    background-color: rgb(0, 0, 0,.9);
}
.registerWindow{
    position: absolute;

    width:380px;
    top:25%;
}
.registerWindow .registerTitle{
    background-color:#FFFFFF;

   text-align: center;
   border-radius: 20px 20px 0 0;
   color:#DC3545;
    padding:1px 0px 7px 0px;
}
.registerWindow .registerTitle div:first-child{
    font-size:41px;
}
.registerWindow .registerTitle div:last-child{
   position: absolute;
   top:5px;
   right: 10px;
   cursor: pointer;
 }
.registerWindow .modalFormContent{
    background-color:#574F7D;
    display:flex;
    flex-direction: column;
    padding:0 60px;
  }
.registerWindow .modalFormContent span{
    text-align:center;
    color:#FFFFFF;
    font-size:25px;
    margin:10px 0px;
  }
.registerWindow .modalFormContent input[type="text"]{
   width:260px;
   height:40px;
   margin-bottom:15px;
   padding:8px 10px 8px 10px;
  }
.registerWindow .modalFormContent select.cinsiyet {
    width:260px;
    height:40px;
    margin-bottom:15px;
    padding:8px 10px 8px 10px;
    color:rgb(0, 0, 0,.5)
   }
 .registerWindow .modalFormContent .registerButton {
        display: flex;
        justify-content: center;
        margin:1px 0px 24px 0px;

   }
.registerWindow .modalFormContent .registerButton button{
    font-size:24px;
    padding:8px 11px 8px 11px;
    background-color:#DC3545;
    color:#FFFFFF;
    border:none;
    outline:none;
    cursor: pointer;
    }

.registerWindow .registerBottom{
        text-align: center;
        background-color:#FFFFFF;
        padding:19px 5px;
        border-radius: 0px 0px 20px 20px;
    }
.registerWindow .registerBottom span a{
        color:#DC3545;
    }
.mainContainer .profileSettingsTitle{
    display: inline-block;
    font-size:20px;
    background-color:#574F7D;
    color:#FFFFFF;
    padding:11px 8px 11px 8px;
    margin-top:30px;
}
.mainContainer .profileSettingsContent{
    display: flex;
    background-color:#171A21;
    border-top:5px solid #574F7D;
    border-bottom:5px solid #574F7D;
}
.mainContainer .profileSettingsContent .avatarLoad{
    margin-right:39px;
    width:210px;
}
.mainContainer .profileSettingsContent .avatarLoad div{
    margin-top:10px;
    margin-left:23.5px;
    color:#FFFFFF;
}
.mainContainer .profileSettingsContent .avatarLoad img{
    display: block;
    padding-left:25px;
    padding-top:30px;
    width: 120px;
    height: 120px;
}
.mainContainer .profileSettingsContent .userInfoUpdate {
     display: flex;
     flex-direction: column;
     padding-top:30px;
     font-size:20px;

}
.mainContainer .profileSettingsContent .userInfoUpdate .userName {
    color:#FFFFFF;
}
.mainContainer .profileSettingsContent .userInfoUpdate .userNameText {
    color:#DC3545;
    font-size:18px;
    margin-bottom:63px;
}
.mainContainer .profileSettingsContent .userInfoUpdate .formContent {
    display: flex;
    flex-wrap: wrap;
    width:660px;
    color:#FFFFFF;
}
.mainContainer .profileSettingsContent .userInfoUpdate .formContent input {
    width:300px;
    height: 30px;
    margin-right:30px;
    padding:5px;
    color:#DC3545;
    margin-bottom:42px;
}

.mainContainer .profileSettingsContent .userInfoUpdate .formContent select {
    width:300px;
    height: 30px;
    padding:5px;
    color:#DC3545;
}
.mainContainer .profileSettingsContent .userInfoUpdate .formContent div {
    display: flex;
    flex-direction: column;
}
.mainContainer .profileSettingsContent .userInfoUpdate .InfoUpdateButton {
    display: flex;
    justify-content: end;
    margin-right:30px;
    margin-top:11px;
    margin-bottom:9px;
}
.mainContainer .profileSettingsContent .userInfoUpdate .InfoUpdateButton button{
    font-size:20px;
    padding:3px;
    background-color:#DC3545;
    color:#FFFFFF;
    border:none;
    outline: none;
    cursor:pointer;
}
.mainContainer .profileSettingsContent .passwordChange{
   width:330px;
   background-color:#DC3545;
}
.mainContainer .profileSettingsContent .passwordChangeTitle{
    display: inline-block;
    background-color:#574F7D;
    border-radius: 0px 0px 10px 0px;
    padding:9px 15px 9px 15px;
    color:#FFFFFF;
 }
 .mainContainer .profileSettingsContent .passwordChangeContent{
    padding:10px 15px 0px 15px;
    color:#FFFFFF;
    font-size:20px;

 }
 .mainContainer .profileSettingsContent .passwordChangeContent div{
    margin-bottom:5px;

 }
 .mainContainer .profileSettingsContent .passwordChangeContent input{
    width:300px;
    height: 30px;
    margin-bottom:20px;
    padding:5px;
 }
 .mainContainer .profileSettingsContent .passwordChangeContent .changePasswordButton{
    display: flex;
    justify-content: end;
    margin-top:55px;
 }
 .mainContainer .profileSettingsContent .passwordChangeContent .changePasswordButton button{
    border:none;
    outline:none;
    font-size:20px;
    background-color:#FFFFFF;
    color:#DC3545;
    padding:5px;
    cursor:pointer;
 }
 .mainContainer .profileCommentTitle{
    display: inline-block;
    font-size:20px;
    background-color:#574F7D;
    color:#FFFFFF;
    padding:11px 8px 5px 8px;
    margin-top:30px;
 }
 .mainContainer .profileMyComments{
    display: flex;
    background-color:#171A21;
    border-top:5px solid #574F7D;
    border-bottom:5px solid #574F7D;
    padding:20px 20px 40px 20px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer{
    display: flex;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul.one{
    border-right: 3px solid #FFDD00;
    margin-right:75px;
    padding-right:40px;

 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li{
    width:480px;
    border-bottom:3px solid #FFDD00;
    padding-top:20px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li:first-child{

    padding-top:0px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li .commentTitle{
    color:#F29D08;
    margin-bottom:8px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li .commentContent{
    color:#FFFFFF;
    margin-bottom:8px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li .gomovielink
 {
    display: inline-block;
    background-color:#574F7D;
    padding:4px 11px 4px 11px;
    margin-bottom:20px;
 }
 .mainContainer .profileMyComments .profileCommentsContainer ul li .gomovielink a
 {
    color:#FFFFFF;
 }
.mainContainer .movieAndSideBar .movieListContainerMain .sayfalama {
    display: flex;
    justify-content: center;
    margin-top:42px;

}
.mainContainer .movieAndSideBar .movieListContainerMain .sayfalama ul{
    display: flex;
}
.mainContainer .movieAndSideBar .movieListContainerMain .sayfalama ul li{
    margin-right:11px;
    font-size:16px;
    background-color:#574F7D;
    padding: 7px 10px;
    color:#FFFFFF;
}

.mainContainer .movieAndSideBar .movieListContainerMain .sayfalama ul li.active{
    margin-right:11px;
    font-size:16px;
    background-color:#FFFFFF;
    padding: 7px 10px;
    color:#574F7D;
}
.inmylist{
    color:white;
    margin-top:5px;
    padding-left:2px;
    font-size:20px;
}
.telif{
    display:flex;
    flex-direction: column;
    font-size:20px;
    color:#FFFFFF;
}
.telif div{
    margin:0 auto;
    justify-content: center;
}
 @media only screen and (min-width:1200px){ /* XL masa üstü pcler için */

 }
 @media only screen and (min-width:992px) and (max-width:1199px){ /* Large tablet */
    .mainContainer .comingSoonMoviesContainer ul{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar{
        width:10px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie:nth-child(4n){

        margin-right: 3%;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie:nth-child(4n){
        margin-right:3%;
    }

    footer .footer .footerText{
        font-size:17px;
    }
    .otherMovieContainer .popularMovieContainer{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .otherMovieContainer  ::-webkit-scrollbar{
        width:10px;
        height: 10px;
    }
    .otherMovieContainer ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .otherMovieContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentContent{
        max-height: 200px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .mainContainer .profileSettingsContent{
        flex-wrap: wrap;
    }
    .mainContainer .profileSettingsContent .passwordChange{
        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate{
        width:100%;
        padding-left:20px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer{
        flex-direction: column;
        width:100%;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.two{
        margin-top:15px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.one{
        border-right:0px;
        margin-right:0px;
        padding-right:0px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul li{
        width:100%;
    }

 }
 @media only screen and (min-width:768px) and (max-width:991px){ /*Medium ipad için*/
     .headerContainer .headerTop{
         flex-wrap: wrap;
         height: auto;

     }
     .headerContainer .headerTop .menu ul{
         flex-wrap: wrap;
     }
     .headerContainer .headerTop .menu ul li{
         margin-top:15px;
         margin-bottom:10px;
         font-size:16px;
     }
    .headerBottom{
        justify-content: center;
    }
    .headerBottom .search{

        margin-top:5px;
        width:90%;
    }
    .headerBottom .search input[type="text"]{
        width:90%;
    }
    .mainContainer .comingSoonMoviesContainer ul{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar{
        width:10px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie:nth-child(4n){

        margin-right: 3%;
    }
    .mainContainer .movieAndSideBar{
        flex-wrap: wrap;
    }
    .mainContainer .movieAndSideBar .sideBar{
        width:100%;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent{
        height: 350px;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent .movieSearchContent{
        height: 250px;
    }
    .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent li{
        margin-left:20px;
        margin-right:0px;
    }


    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie:nth-child(4n){
        margin-right:3%;
    }
    footer .footer{
        flex-direction: column;
        align-items: center;
        border-bottom:none;
    }
    footer .footer .logoSlogan{
        padding:0px;
        border-right: none;
    }
    footer .footer .footerText{
        font-size:15px;
    }
    .otherMovieContainer .popularMovieContainer{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .otherMovieContainer  ::-webkit-scrollbar{
        width:10px;
        height: 10px;
    }
    .otherMovieContainer ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .otherMovieContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentContent{
        max-height: 200px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .mainContainer .profileSettingsContent{
        flex-wrap: wrap;
    }
    .mainContainer .profileSettingsContent .passwordChange{
        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate{
        width:100%;
        padding-left:20px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer{
        flex-direction: column;
        width:100%;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.two{
        margin-top:15px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.one{
        border-right:0px;
        margin-right:0px;
        padding-right:0px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul li{
        width:100%;
    }

 }
 @media only screen and (min-width:576px) and (max-width:767px){/* Small */
     .headerContainer .headerTop{
         flex-wrap: wrap;
         height: auto;

     }
     .headerContainer .headerTop .menu ul{
         flex-wrap: wrap;
     }
     .headerContainer .headerTop .menu ul li{
         margin-top:15px;
         margin-bottom:10px;
         font-size:14px;
     }
    .headerBottom{
        justify-content: center;
    }
    .headerBottom .search{

        margin-top:5px;
        width:90%;
    }
    .headerBottom .search input[type="text"]{
        width:90%;
    }
    .mainContainer .comingSoonMoviesContainer ul{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar{
        width:10px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie:nth-child(4n){

        margin-right: 3%;
    }
    .mainContainer .movieAndSideBar{
        flex-wrap: wrap;
    }
    .mainContainer .movieAndSideBar .sideBar{
        width:100%;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent{
        height: 350px;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent .movieSearchContent{
        height: 260px;
    }
    .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent li{
        margin-left:20px;
        margin-right:0px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie{
        width:30.33%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie:nth-child(4n){
        margin-right:3%;
    }
    footer .footer{
        flex-direction: column;
        align-items: center;
        border-bottom:none;
    }
    footer .footer .logoSlogan{
        padding:0px;
        border-right: none;
    }
    footer .footer .footerText{
        font-size:15px;
    }
    .otherMovieContainer .popularMovieContainer{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .otherMovieContainer  ::-webkit-scrollbar{
        width:10px;
        height: 10px;
    }
    .otherMovieContainer ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .otherMovieContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentContent{
        max-height: 200px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .mainContainer .profileSettingsContent{
        flex-wrap: wrap;
    }
    .mainContainer .profileSettingsContent .passwordChange{
        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate{
        width:100%;
        padding-left:20px;
    }

    .mainContainer .profileSettingsContent .userInfoUpdate .formContent{

        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .formContent input{
        width:230px;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .formContent select{
        width:230px;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .InfoUpdateButton{
        margin-right:10px;

    }
    .mainContainer .profileMyComments .profileCommentsContainer{
        flex-direction: column;
        width:100%;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.two{
        margin-top:15px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.one{
        border-right:0px;
        margin-right:0px;
        padding-right:0px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul li{
        width:100%;
    }
     .watchCommentContainer .movieComments .formContent .formElements  input[type="text"]{
         width:100%;
     }
     .mainContainer .movieAndSideBar .sideBar{
         margin-left:0;
     }
     footer .footer{
         height: 320px;
     }
 }
 @media only screen and (max-width:575px){ /* xsmall */
     .headerContainer .headerTop{
         flex-wrap: wrap;
         height: auto;

     }
       .headerContainer .headerTop .menu > ul{
           margin-top:15px;
            flex-wrap: wrap;
           margin-bottom:10px;
           margin-left:5px;
        }
        .headerContainer .headerTop .menu ul li{
            margin-bottom:3px;
            font-size:14px;
        }

    .headerBottom{
        justify-content: center;
    }
    .headerBottom .search{
        margin-top: 5px;
        display: flex;
        width: 100%;
        flex-direction: column;
    }
    .headerBottom .search input[type="text"]{
        width:87%;
    }
    .mainContainer .comingSoonMoviesContainer ul{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar{
        width:10px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .mainContainer .comingSoonMoviesContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie:nth-child(4n){

        margin-right: 3%;
    }
    .mainContainer .movieAndSideBar{
        flex-wrap: wrap;
    }
    .mainContainer .movieAndSideBar .sideBar{
        width:100%;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent{
        height: 350px;
    }
    .mainContainer .movieAndSideBar .sideBar .sideBarContent .movieSearchContent{
        height: 260px;
    }
    .mainContainer .movieAndSideBar .sideBar .movieCategories .categoriesContent li{
        margin-left:0;
        margin-right:8px;
    }
    .mainContainer .movieListContainerMain .movieListContainer ul.movieList li.movie{
        width:47%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie{
        width:47%;
        margin-right:3%;
    }
    .mainContainer .movieAndSideBar .categoryListMain .categoryListContent ul.movieList li.movie:nth-child(4n){
        margin-right:3%;
    }
    footer .footer{
        flex-direction: column;
        align-items: center;
        border-bottom:none;
    }
    footer .footer .logoSlogan{
        padding:0px;
        border-right: none;
    }
    footer .footer .footerText{
        font-size:12px;
    }

    .headerTop .menu .userLogged .openerMenu
    {
        width:180px;
        left:-42px;
    }
    .watchContainer .movieSection .movieInfoContainer{
        flex-direction: column;
    }
    .watchContainer .movieSection .movieInfoContainer .movieInfo{
        margin-top:10px;
    }
    .watchContainer .movieSection .movieInfoContainer .moviePoster figure img{
        width: 100%;
    }
    .watchContainer .movieSection .movieInfoContainer .moviePoster{
        align-self: center;
        width: 80%;
    }
    .otherMovieContainer .popularMovieContainer{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .otherMovieContainer  ::-webkit-scrollbar{
        width:10px;
        height: 10px;
    }
    .otherMovieContainer ::-webkit-scrollbar-thumb{
        background-color:#F29D08;
        border-radius: 50px;
    }
    .otherMovieContainer  ::-webkit-scrollbar-track{
        background: #DC3545;
        border-radius: 50px;
    }
    .watchCommentContainer .movieComments .movieCommentList ul li .commentText .commentContent{
        max-height: 200px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .mainContainer .profileSettingsContent{
        flex-wrap: wrap;
    }
    .mainContainer .profileSettingsContent .passwordChange{
        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate{
        padding-left:20px;
        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .formContent{

        width:100%;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .formContent input{
        width:180px;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .formContent select{
        width:180px;
    }
    .mainContainer .profileSettingsContent .userInfoUpdate .InfoUpdateButton{
        margin-right:10px;

    }
    .mainContainer .profileMyComments .profileCommentsContainer{
        flex-direction: column;
        width:100%;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.two{
        margin-top:15px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul.one{
        border-right:0px;
        margin-right:0px;
        padding-right:0px;
    }
    .mainContainer .profileMyComments .profileCommentsContainer ul li{
        width:100%;
    }
     .watchCommentContainer .movieComments .formContent .formElements  input[type="text"]{
         width:100%;
     }
     .mainContainer .movieAndSideBar .sideBar{
         margin-left:0;
     }
     footer .footer{
         height: 320px;
     }
     .mainContainer .movieAndSideBar .sideBar .mostViewed .mostViewedContent ul li .contentContainer .content .mostviewedMovieDetails .contentTitle{
         width:200px;
     }
 }

@media screen and (max-width: 1180px){
  .headerContainer{
    width: 100%;
  }

    .mainContainer {
        width: 100%;

    }
    footer {
        width: 100% ;
     }
    .watchContainer {
        width: 100% ;
     }
     .otherMovieContainer{
        width: 100%;
     }
     .watchCommentContainer{
        width: 100%;
     }

}

/* select style */
.mainContainer .movieAndSideBar .sideBar .sideBarContent select{
    display: none;
}
.s-hidden {
    visibility:hidden;
    padding-right:10px;
}

.select {
    cursor:pointer;
    display:inline-block;
    position:relative;
    color:#FFFFFF;
    width:100%;
    height:40px;
    font-size:15px;
    margin-bottom:20px;
}
.styledSelect {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background-color:#574F7D;
    padding:12px 10px;
    font-weight:normal;
}
.styledSelect:after {
    content:"";
    width:0px;
    height:0px;
    border:12px solid transparent;
    border-color:#F29D08 transparent transparent transparent;
    position:absolute;
    top:15px;
    right:10px;
}
.styledSelect:active, .styledSelect.active {
    background-color:#574F7D;
}
.options {
    display:none;
    position:absolute;
    top:100%;
    right:0;
    left:0;
    z-index:999;
    margin:0 0;
    padding:0 0;
    list-style:none;

    background-color:#574F7D;
    -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);
    height: auto;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
}
.options li {
    padding:0 6px;
    margin:0 0;
    padding:0 10px;
    color:white;
}
.options li:hover {
    background-color:#39f;
    color:white;
}
/* select style */