/* Don't forget to include a CSS reset file otherwise it might look a little bit strange*/
/*a:active,a:focus {
    outline: expression(hideFocus='true');
}

p {
    margin-bottom: 20px;
}

#wrapper {
    width: 960px;
    margin: 0 auto;
    margin-top: 100px;
}*/

#tabs ul {
    list-style: none;
    background: url(../images/video-overlay.png) repeat #C1B28B;
}

#tabs,#tabs2,#tabs3,#tabs4,#tabs5 {
    margin: 0 auto;
    top: 0 !important;
}

#tabs li,#tabs2 li,#tabs3 li,#tabs4 li,#tabs5 li {
    float: left;
}

#tabs li a,#tabs2 li a,#tabs3 li a,#tabs4 li a,#tabs5 li a {
    display: block;
    padding: 10px;
    background: #C1B28B;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    border-right: 1px solid #aaa;
    border-top: 3px solid #C1B28B;
}

#tabs li a.tabulous_active {
    border-top: 3px solid #E65611 !important;
}

#tabs li a:hover, #tabs2 li a:hover,#tabs3 li a:hover,#tabs4 li a:hover,#tabs5 li a:hover {
    background: #606060;
    border-top: 3px solid #C1B28B;
}

#tabs_container {
    padding: 20px !important;
    overflow: hidden;
    position: relative;
    background: white;
    width: 410px;
    min-height: 200px;
}

#tabs_container div {
}

#tabs-1 p {
    margin: 0 !important;
}

#tabs-1 ol li {
    margin-top: 5px;
}

.tabulous_active {
    border-top: 3px solid #f5f195;
}

.transition {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;

    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}

.make_transist {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.hidescale {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -o-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    filter: alpha(opacity=0);
    opacity: 0;
    display: none;
}

.showscale {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;

    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
    display: block;
}

.hideleft {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
}

.showleft {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -o-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;

    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}

.hidescaleup {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    display: none;
}

.showscaleup {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;

    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
    display: block;
}

.hideflip {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;

    -webkit-transform: rotatey(-90deg) scale(1.1);
    -moz-transform: rotatey(-90deg) scale(1.1);
    -o-transform: rotatey(-90deg) scale(1.1);
    -ms-transform: rotatey(-90deg) scale(1.1);
    transform: rotatey(-90deg) scale(1.1);

    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    display: none;
}

.showflip {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;

    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;

    -webkit-transform: rotatey(0deg) scale(1);
    -moz-transform: rotatey(0deg) scale(1);
    -o-transform: rotatey(0deg) scale(1);
    -ms-transform: rotatey(0deg) scale(1);
    transform: rotatey(0deg) scale(1);

    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    display: block;
}

.tabulous_active {
    background: white !important;
    color: #655c89 !important;
}

.tabulousclear {
    display: block;
    clear: both;
}
/* Style the tab */
.tab {
    overflow: hidden;
   
}

/* Style the buttons inside the tab */
.tab button {
    background-color:#6B8E23;
	color:#fff;
    float: left;
    border: 1px solid #ddf0fd;
    outline: none;
    cursor: pointer;
    padding: 10px 10px;
    transition: 0.3s;
    font-size: 15px;
	border-radius:5px;
	
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #2E8B57;
	color:#fff;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #808000;
	color:#fff;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
}

/* Fade in tabs */
@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}